import 'dart:async';

import 'package:flutter/material.dart';
import 'package:twonly/globals.dart';
import 'package:twonly/src/database/twonly_database.dart';
import 'package:twonly/src/model/memory_item.model.dart';
import 'package:twonly/src/views/components/message_send_state_icon.dart';
import 'package:twonly/src/views/memories/memories_item_thumbnail.dart';
import 'package:twonly/src/views/memories/memories_photo_slider.view.dart';

class InChatMediaViewer extends StatefulWidget {
  const InChatMediaViewer({
    required this.message,
    required this.contact,
    required this.color,
    required this.galleryItems,
    required this.canBeReopened,
    super.key,
  });

  final Message message;
  final Contact contact;
  final List<MemoryItem> galleryItems;
  final Color color;
  final bool canBeReopened;

  @override
  State<InChatMediaViewer> createState() => _InChatMediaViewerState();
}

class _InChatMediaViewerState extends State<InChatMediaViewer> {
  bool mirrorVideo = false;
  int? galleryItemIndex;
  StreamSubscription<Message?>? messageStream;
  Timer? _timer;

  @override
  void initState() {
    super.initState();
    loadIndexAsync();
    initStream();
  }

  Future<void> loadIndexAsync() async {
    if (!widget.message.mediaStored) return;
    _timer = Timer.periodic(const Duration(milliseconds: 10), (timer) {
      /// when the galleryItems are updated this widget is not reloaded
      /// so using this timer as a workaround
      if (loadIndex()) {
        timer.cancel();
        setState(() {});
      }
    });
  }

  bool loadIndex() {
    if (widget.message.mediaStored) {
      final index = widget.galleryItems.indexWhere((x) =>
          x.id == (widget.message.mediaUploadId ?? widget.message.messageId));
      if (index != -1) {
        galleryItemIndex = index;
        return true;
      }
    }
    return false;
  }

  @override
  void dispose() {
    super.dispose();
    messageStream?.cancel();
    _timer?.cancel();
    // videoController?.dispose();
  }

  Future<void> initStream() async {
    /// When the image is opened from the chat and then stored the
    /// image is not loaded so this will trigger an initAsync when mediaStored is changed

    /// image is already show
    if (widget.message.mediaStored) return;

    final stream = twonlyDB.messagesDao
        .getMessageByMessageId(widget.message.messageId)
        .watchSingleOrNull();
    messageStream = stream.listen((updated) async {
      if (updated != null) {
        if (updated.mediaStored) {
          await messageStream?.cancel();
          await loadIndexAsync();
        }
      }
    });
  }

  Future<void> onTap() async {
    if (galleryItemIndex == null) return;
    await Navigator.push(
      context,
      MaterialPageRoute(
        builder: (context) => MemoriesPhotoSliderView(
          galleryItems: widget.galleryItems,
          initialIndex: galleryItemIndex!,
        ),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    if (galleryItemIndex == null) {
      return Container(
        constraints: const BoxConstraints(
          minHeight: 39,
        ),
        decoration: BoxDecoration(
          border: Border.all(
            color: widget.color,
          ),
          borderRadius: BorderRadius.circular(12),
        ),
        child: Padding(
          padding: EdgeInsets.symmetric(
              vertical: (widget.canBeReopened) ? 5 : 10.0, horizontal: 4),
          child: MessageSendStateIcon(
            [widget.message],
            mainAxisAlignment: MainAxisAlignment.center,
            canBeReopened: widget.canBeReopened,
          ),
        ),
      );
    }
    return Container(
      decoration: BoxDecoration(
        border: Border.all(
          color: Colors.transparent,
        ),
        color: Colors.transparent,
        borderRadius: BorderRadius.circular(12),
      ),
      child: MemoriesItemThumbnail(
        galleryItem: widget.galleryItems[galleryItemIndex!],
        onTap: onTap,
      ),
    );
  }
}
