import 'dart:typed_data';
import 'package:cached_network_image/cached_network_image.dart';
import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:flare_flutter/flare_actor.dart';
import 'package:flare_flutter/flare_controls.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_bloc/flutter_bloc.dart';

import 'package:flutter/cupertino.dart';
import 'package:page_transition/page_transition.dart';
import 'package:provider/provider.dart';
import 'package:shared_preferences/shared_preferences.dart';
import 'package:teso/Classes/API%20Clasess/CouponDetails.dart';
import 'package:teso/Classes/API%20Clasess/Post.dart';
import 'package:teso/Classes/API%20Clasess/PostFav.dart';
import 'package:teso/Classes/TesoUser.dart';
import 'package:teso/Pages/Sub_Pages/Posts/comment.dart';
import 'package:teso/Pages/Sub_Pages/userProfile3P.dart';
import 'package:teso/Services/video_controller_service.dart';
import 'package:teso/blocs/video_player/video_player_bloc.dart';
import 'package:teso/blocs/video_player/video_player_event.dart';
import 'package:teso/blocs/video_player/video_player_state.dart';
import 'package:teso/providers/user_provider.dart';
import 'package:teso/util/SizeConfig.dart';
import 'package:teso/util/consts.dart';
import 'package:numeral/numeral.dart';
import 'package:teso/GeneralWidgets/widgets/video_player_widget.dart';
import 'package:http/http.dart' as http;
import 'dart:convert';

// ignore: must_be_immutable
class ViewPost extends StatefulWidget {
  Post postedAd;
  TesoUser user;
  bool friend;
  final bool play;

  ViewPost({
    Key key,
    this.postedAd,
    this.user,
    this.friend,
    @required this.play,
    // this.posts,
  }) : super(key: key);
  @override
  _ViewPostState createState() => _ViewPostState();
}

class _ViewPostState extends State<ViewPost> {
  bool favoured = false;
  List<CouponDetails> coupons = <CouponDetails>[];
  Uint8List imageBitmap;
  final FlareControls flareControls = FlareControls();
  bool campaignAd = false;
  int likes = 0;
  int comments = 0;
  var userDoc;
  var document;

  void sharing(Post ad) async {
    await rootBundle
        .load("assets/images/rawLogoOverlay.png")
        .then((value) => setState(() {
              imageBitmap = value.buffer.asUint8List();
            }));
    Provider.of<UserProvider>(context, listen: false).downloadVideo(
        ad.postID, ad.playbackID, ad.rendition, imageBitmap, context);
  }

  @override
  void dispose() {
    rootBundle.evict("assets/images/rawLogoOverlay.png");
    super.dispose();
  }

  void likePost(Post ad) {
    SharedPreferences.getInstance().then((value) {
      String cid = value.getString("id");
      PostFav liked = new PostFav();
      liked.admirerId = cid;
      liked.countId = DateTime.now().toString() + "$cid";
      liked.timestamp = DateTime.now().toIso8601String();
      liked.postId = ad.postID;

      setState(() {
        // ad.likes.add(liked);
        likes++;
        favoured = true;
      });

      flareControls.play("like");
      Provider.of<UserProvider>(context, listen: false).addLike(liked);
    });
  }

  void dislikePost(Post ad) {
    setState(() {
      favoured = false;
      likes--;
    });
    Provider.of<UserProvider>(context, listen: false).deleteLike(ad.postID);
  }

  void commentsDialog(BuildContext context) {
    if (userDoc == null) {
      FirebaseFirestore.instance
          .collection("users")
          .doc(widget.postedAd.publisherID)
          .get()
          .then((value) {
        setState(() {
          userDoc = value.data();
        });
      });
    } else {
      showModalBottomSheet(
        context: context,
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.vertical(top: Radius.circular(20.0)),
        ),
        builder: (BuildContext bc) {
          return ClipRRect(
            borderRadius: BorderRadius.only(
              topLeft: Radius.circular(20.0),
              topRight: Radius.circular(20.0),
            ),
            child: CommentSection(
                postedAd: widget.postedAd,
                user: TesoUser(
                  username: userDoc["username"],
                  userGUID: userDoc["id"],
                )),
          );
        },
      );
    }
  }

  Future<void> getCampaignCoupons(String campaign) async {
    SharedPreferences prefs = await SharedPreferences.getInstance();
    Map<String, String> requestHeaders = {
      'Content-type': 'application/json',
      'Authorization': prefs.getString('tokensTeso')
    };
    try {
      var register2 = serverLocation + 'coupons/campaign_coupons';
      var client1 = await http.post(
        Uri.parse(register2),
        headers: requestHeaders,
        body: json.encode(campaign),
      );
      if (client1.statusCode == 200) {
        var details = jsonDecode(client1.body);
        setState(() {
          coupons = List<CouponDetails>.from(
              details.map((model) => CouponDetails.fromJSON(model)).toList());
          // coupons.removeWhere(
          //     (element) => element.expiration.isAfter(DateTime.now()));
        });
      }
    } catch (e) {
      print(e);
    }
  }

  @override
  void initState() {
    campaignAd = false;
    _getDocuments();
    _likedListen();
    _commentsListen();
    FirebaseFirestore.instance
        .collection("users")
        .doc(widget.postedAd.publisherID)
        .get()
        .then((value) {
      if (mounted)
        setState(() {
          userDoc = value.data();
        });
    });
    super.initState();
  }

  _getDocuments() {
    FirebaseFirestore.instance
        .collection("posts")
        .doc(widget.postedAd.postID)
        .get()
        .then((value) {
      if (mounted)
        setState(() {
          document = value.data();
          if (document != null) {
            if (document["campaignId"] != null) {
              campaignAd = true;
              getCampaignCoupons(document["campaignId"]);
            }
          }
        });
    });
  }

  _likedListen() {
    SharedPreferences.getInstance().then((value) {
      String cid = value.getString("id");
      FirebaseFirestore.instance
          .collection("posts")
          .doc(widget.postedAd.postID)
          .collection("likes")
          .snapshots()
          .listen((event) {
        if (mounted) {
          setState(() {
            favoured =
                event.docs.any((element) => element.data()["admirerID"] == cid);
            likes = event.docs.length;
          });
        }
      });
    });
  }

  _commentsListen() {
    FirebaseFirestore.instance
        .collection("posts")
        .doc(widget.postedAd.postID)
        .collection("comments")
        .snapshots()
        .listen((event) {
      if (mounted) {
        setState(() {
          comments = event.docs.length;
        });
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    SizeConfig().init(context);
    return Scaffold(
      body: Container(
        width: MediaQuery.of(context).size.width,
        height: MediaQuery.of(context).size.height,
        color: Colors.black,
        child: Stack(
          children: [
            _buildVideoPlayer(widget.postedAd),
            Align(
              alignment: Alignment.bottomRight,
              child: Container(
                margin: EdgeInsets.only(
                  right: 10,
                  bottom: 30,
                ),
                width: 50,
                height: MediaQuery.of(context).size.width * 0.73,
                child: Column(
                  children: [
                    Container(
                      width: 40,
                      height: 40,
                      decoration: BoxDecoration(
                        shape: BoxShape.circle,
                        border: Border.all(
                          color: Colors.black,
                          width: 1,
                        ),
                      ),
                      child: ClipRRect(
                        borderRadius: BorderRadius.only(
                          topLeft: Radius.circular(90.0),
                          topRight: Radius.circular(90.0),
                          bottomLeft: Radius.circular(90),
                          bottomRight: Radius.circular(90),
                        ),
                        child: InkWell(
                          onTap: widget.postedAd.publisherID != null
                              ? () => Navigator.pushReplacement(
                                    context,
                                    PageTransition(
                                      child: UserProfileThirdPerson(
                                        user: new TesoUser(
                                          username: userDoc["username"],
                                          userGUID: userDoc["id"],
                                          firstname: userDoc["firstname"],
                                          lastname: userDoc["surname"],
                                        ),
                                      ),
                                      type: PageTransitionType.fade,
                                    ),
                                  )
                              : null,
                          child: CachedNetworkImage(
                            imageUrl: serverLocation +
                                "api/pulldp/" +
                                widget.postedAd.publisherID,
                            imageBuilder: (context, imageProvider) =>
                                FadeInImage(
                              height: 90,
                              width: 90,
                              fit: BoxFit.fill,
                              image: imageProvider,
                              placeholder:
                                  AssetImage("assets/images/tesoDP/dp1.png"),
                            ),
                          ),
                        ),
                      ),
                    ),
                    SizedBox(
                      height: 20,
                    ),
                    Container(
                      height: 50,
                      child: InkWell(
                        onTap: () {
                          if (campaignAd) {
                            if (favoured) {
                              return null;
                            } else {
                              likePost(widget.postedAd);
                            }
                          } else {
                            if (favoured) {
                              dislikePost(widget.postedAd);
                            } else {
                              likePost(widget.postedAd);
                            }
                          }
                        },
                        child: new Wrap(
                          direction: Axis.vertical,
                          children: [
                            Container(
                              width: 50,
                              height: 30,
                              child: Center(
                                child: Icon(
                                  Icons.favorite,
                                  size: 30,
                                  color: favoured ? Colors.red : Colors.white,
                                ),
                              ),
                            ),
                            Container(
                              height: 20,
                              width: 50,
                              child: Center(
                                child: Text(
                                  Numeral(likes).value().toString(),
                                  style: TextStyle(
                                    fontWeight: FontWeight.bold,
                                    color: Colors.white,
                                  ),
                                ),
                              ),
                            ),
                          ],
                        ),
                      ),
                    ),
                    SizedBox(
                      height: 20,
                    ),
                    Container(
                      height: 50,
                      child: InkWell(
                        onTap: () => commentsDialog(context),
                        child: new Wrap(
                          direction: Axis.vertical,
                          children: [
                            Container(
                              width: 50,
                              height: 30,
                              child: Center(
                                child: Icon(
                                  Icons.comment,
                                  size: 30,
                                  color: Colors.white,
                                ),
                              ),
                            ),
                            Container(
                              height: 20,
                              width: 50,
                              child: Center(
                                child: Text(
                                  Numeral(comments).value().toString(),
                                  style: TextStyle(
                                    fontWeight: FontWeight.bold,
                                    color: Colors.white,
                                  ),
                                ),
                              ),
                            ),
                          ],
                        ),
                      ),
                    ),
                    SizedBox(
                      height: 20,
                    ),
                    Container(
                      height: 30,
                      child: InkWell(
                        onTap: () => sharing(widget.postedAd),
                        child: Icon(
                          Icons.share,
                          size: 30,
                          color: Colors.white,
                        ),
                      ),
                    ),
                  ],
                ),
              ),
            ),
            Align(
              alignment: Alignment.bottomLeft,
              child: Container(
                margin: EdgeInsets.symmetric(
                  horizontal: 10,
                  vertical: MediaQuery.of(context).size.height * 0.05,
                ),
                child: new Wrap(
                  direction: Axis.vertical,
                  children: [
                    new RichText(
                      maxLines: 5,
                      text: TextSpan(
                        text: userDoc != null ? "@" + userDoc["username"] : "",
                        style: TextStyle(
                          color: Colors.white,
                          fontSize: SizeConfig.safeBlockHorizontal * 4.3,
                          fontWeight: FontWeight.bold,
                        ),
                      ),
                    ),
                    SizedBox(height: 5),
                    Container(
                      margin: EdgeInsets.only(bottom: 20),
                      width: MediaQuery.of(context).size.width * 0.7,
                      child: Text(
                        document != null
                            ? document["title"] != null
                                ? document["title"]
                                : ""
                            : "",
                        style: TextStyle(
                          color: Colors.white,
                          fontSize: SizeConfig.safeBlockHorizontal * 4.3,
                          height: 1.5,
                        ),
                        maxLines: 4,
                        overflow: TextOverflow.ellipsis,
                        textDirection: TextDirection.rtl,
                        textAlign: TextAlign.left,
                      ),
                    ),
                  ],
                ),
              ),
            ),
            Align(
              alignment: Alignment.topLeft,
              child: Container(
                margin: EdgeInsets.only(top: 25),
                child: IconButton(
                  onPressed: () => Navigator.of(context).pop(),
                  icon: new Icon(
                    Icons.arrow_back,
                    color: Colors.white,
                    size: 25.0,
                  ),
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }

  Widget _buildVideoPlayer(Post ad) {
    return BlocProvider<VideoPlayerBloc>(
      create: (context) => VideoPlayerBloc(
          RepositoryProvider.of<VideoControllerService>(context))
        ..add(VideoSelectedEvent(ad)),
      child: BlocBuilder<VideoPlayerBloc, VideoPlayerState>(
        builder: (context, state) {
          return Container(child: _getPlayer(context, state, ad));
        },
      ),
    );
  }

  Widget _getPlayer(BuildContext context, VideoPlayerState state, Post ad) {
    // final screenWidth = MediaQuery.of(context).size.width;
    // final containerHeight = screenWidth / ASPECT_RATIO;
    final containerHeight = MediaQuery.of(context).size.height;
    if (state is VideoPlayerStateLoaded) {
      return GestureDetector(
        onDoubleTap: () {
          if (campaignAd) {
            if (favoured) {
              return null;
            } else {
              likePost(ad);
            }
          } else {
            if (favoured) {
              dislikePost(ad);
            } else {
              likePost(ad);
            }
          }
        },
        child: Stack(
          children: [
            VideoPlayerWidget(
              key: Key(state.video.playbackID),
              controller: state.controller,
              ad: ad,
              play: widget.play,
              details: coupons,
            ),
            Container(
              width: double.infinity,
              height: MediaQuery.of(context).size.height,
              child: Center(
                child: SizedBox(
                  width: 80,
                  height: 80,
                  child: FlareActor(
                    'assets/like.flr',
                    controller: flareControls,
                    animation: 'idle',
                  ),
                ),
              ),
            ),
          ],
        ),
      );
    }

    if (state is VideoPlayerStateLoading) {
      return Container(
        height: containerHeight,
        color: Colors.black,
        child: Center(
          child: CupertinoActivityIndicator(
            animating: true,
            radius: 15,
          ),
        ),
      );
    }

    if (state is VideoPlayerStateError) {
      return Container(
        height: containerHeight,
        color: Colors.black,
        child: Center(
          child: Text(state.message),
        ),
      );
    }

    return Container(
      height: containerHeight,
      color: Colors.black,
      child: Center(
        child: CupertinoActivityIndicator(
          animating: true,
          radius: 15,
        ),
      ),
    );
  }
}