import 'dart:async';
import 'package:flutter/material.dart';

import '../api/token.dart';
import '../api/video_api.dart';
import '../utils/platform.dart';
import '../screen_loading.dart';
import '../types/video.dart';
import '../types/video_data.dart';
import 'info_view.dart';

import 'videoscreen_desktop.dart'
    if (dart.library.html) 'videoscreen_mobile.dart';
import 'videoscreen_mobile.dart';

class VideoScreen extends StatefulWidget {
  const VideoScreen({Key? key, required this.metaData}) : super(key: key);
  final VideoT metaData;

  @override
  State<VideoScreen> createState() => _VideoScreenState();
}

class _VideoScreenState extends State<VideoScreen> {
  bool _appBarVisible = true;
  Timer? _appBarTimer;
  late Future<VideoData> _videoData;
  PageController _controller = PageController(
    initialPage: 0,
  );

  String url = "";

  void initPlayer() async {
    final videodata = await _videoData;

    final token = await Token.getInstance().getToken();
    if (token == null) return;

    final baseurl = token.domain;
    // todo not static middle path
    final path = baseurl + "/videos/vids/" + videodata.movieUrl;

    url = path;
  }

  @override
  void initState() {
    super.initState();
    _videoData = loadVideoData(widget.metaData.id);
    initPlayer();
    _setAppBarTimer();
  }

  @override
  void dispose() {
    super.dispose();
    _controller.dispose();
    _appBarTimer?.cancel();
  }

  void _setAppBarTimer() {
    _appBarTimer?.cancel();
    _appBarTimer = Timer(
      Duration(seconds: 3),
      () {
        setState(() {
          _appBarVisible = false;
        });
      },
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: FutureBuilder(
        future: _videoData,
        builder: (context, AsyncSnapshot<VideoData> snapshot) {
          if (snapshot.hasError) {
            return Text("Error");
          } else if (snapshot.hasData) {
            return MouseRegion(
              onHover: (PointerEvent event) async {
                if (isDesktop()) {
                  if (event.delta.dx != 0 || event.delta.dy != 0) {
                    setState(() {
                      _appBarVisible = true;
                    });
                    _setAppBarTimer();
                  }
                }
              },
              child: GestureDetector(
                onPanDown: (details) async {
                  if (_appBarVisible) {
                    await Future.delayed(Duration(milliseconds: 100));
                    setState(() {
                      _appBarVisible = false;
                    });
                  } else {
                    if (!isDesktop()) {
                      setState(() {
                        _appBarVisible = true;
                      });
                      _setAppBarTimer();
                    }
                  }
                },
                // behavior: HitTestBehavior.opaque,
                child: Stack(children: [
                  PageView(
                      scrollDirection: Axis.vertical,
                      controller: _controller,
                      children: [
                        Center(
                            child: isDesktop()
                                ? VideoScreenDesktop(
                                    url: url,
                                  )
                                : VideoScreenMobile(
                                    url: url,
                                  )),
                        InfoView(
                          videoId: widget.metaData.id,
                        )
                      ]),
                  if (_appBarVisible)
                    new Positioned(
                      top: 0.0,
                      left: 0.0,
                      right: 0.0,
                      child: AppBar(
                        title: Text(widget.metaData.title),
                        leading: new IconButton(
                          icon: new Icon(Icons.arrow_back_ios,
                              color: Colors.grey),
                          onPressed: () => Navigator.of(context).pop(),
                        ),
                        backgroundColor:
                            Theme.of(context).primaryColor.withOpacity(0.3),
                        elevation: 0.0,
                      ),
                    ),
                ]),
              ),
            );
          } else {
            return ScreenLoading();
          }
        },
      ),
    );
  }
}