import 'dart:ui';

import 'package:aitrainer_app/bloc/menu/menu_bloc.dart';
import 'package:aitrainer_app/localization/app_language.dart';
import 'package:aitrainer_app/localization/app_localization.dart';
import 'package:aitrainer_app/model/cache.dart';
import 'package:aitrainer_app/model/workout_menu_tree.dart';
import 'package:aitrainer_app/util/trans.dart';
import 'package:badges/badges.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/painting.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:google_fonts/google_fonts.dart';

import 'menu_info_widget.dart';

// ignore: must_be_immutable
class MenuPageWidget extends StatelessWidget with Trans {
  int parent;
  final double baseWidth = 312;
  final double baseHeight = 675.2;

  MenuPageWidget({this.parent});

  @override
  Widget build(BuildContext context) {
    MenuBloc menuBloc = BlocProvider.of<MenuBloc>(context);
    setContext(context);
    double cWidth = MediaQuery.of(context).size.width;
    double cHeight = MediaQuery.of(context).size.height;

    return CustomScrollView(scrollDirection: Axis.vertical, slivers: buildMenuColumn(parent, context, menuBloc, cWidth, cHeight));
  }

  List<Widget> buildMenuColumn(int parent, BuildContext context, MenuBloc menuBloc, double cWidth, double cHeight) {
    final List<Widget> slivers = List();

    bool isChild = menuBloc.menuTreeRepository.isChildAndGym(menuBloc.parent);
    if (!isChild) {
      slivers.add(getInfoWidget(context, menuBloc));
    } else {
      slivers.add(getFilterWidget(parent, menuBloc));
      slivers.add(getFilterElements(menuBloc));
    }

    final List<Widget> _columnChildren = List();

    if (menuBloc.getFilteredBranch(menuBloc.parent).isEmpty) {
      _columnChildren.add(Container(
          padding: EdgeInsets.only(top: 15.0),
          child: Center(
              child: Stack(alignment: Alignment.bottomLeft, children: [
            Text(t("All Exercises has been filtered out"), style: GoogleFonts.inter(color: Colors.white)),
          ]))));
    } else {
      menuBloc.getFilteredBranch(menuBloc.parent).forEach((treeName, value) {
        WorkoutMenuTree workoutTree = value;
        _columnChildren.add(Container(
            padding: EdgeInsets.only(top: 15.0, left: 15, right: 15),
            height: 225, //cHeight / 3 * distortionHeight,
            child: Badge(
                padding: EdgeInsets.all(8),
                position: BadgePosition.bottomEnd(end: 0),
                animationDuration: Duration(milliseconds: 500),
                animationType: BadgeAnimationType.slide,
                badgeColor: Colors.orange[800],
                showBadge: workoutTree.base,
                badgeContent: Text(t("base"),
                    style: TextStyle(
                      color: Colors.white,
                      fontSize: 12,
                    )),
                child: Stack(alignment: Alignment.bottomLeft, children: [
                  FlatButton(
                    child: badgedIcon(workoutTree, cWidth, cHeight),
                    padding: EdgeInsets.only(left: 0.0, bottom: 0),
                    onPressed: () => menuClick(workoutTree, menuBloc, context),
                  ),
                  Container(
                    padding: EdgeInsets.only(left: 15, bottom: 15, right: 15),
                    child: GestureDetector(
                      onTap: () => menuClick(workoutTree, menuBloc, context),
                      child: Text(
                        workoutTree.name,
                        maxLines: 4,
                        style: GoogleFonts.archivoBlack(color: workoutTree.color, fontSize: workoutTree.fontSize, height: 1.1),
                      ),
                    ),
                  ),
                ]))));
      });
    }

    SliverList sliverList = SliverList(
      delegate: SliverChildListDelegate(_columnChildren),
    );

    slivers.add(sliverList);
    return slivers;
  }

  SliverGrid getFilterWidget(int parent, MenuBloc menuBloc) {
    SliverGrid sliverList = SliverGrid(
        delegate: SliverChildListDelegate([
          Column(mainAxisAlignment: MainAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.center, children: [
            Text(
              t("Equipment Filter"),
              textAlign: TextAlign.center,
              style: GoogleFonts.archivoBlack(
                fontSize: 24,
                color: Colors.white,
                shadows: <Shadow>[
                  Shadow(
                    offset: Offset(5.0, 5.0),
                    blurRadius: 12.0,
                    color: Colors.black54,
                  ),
                  Shadow(
                    offset: Offset(-3.0, 3.0),
                    blurRadius: 12.0,
                    color: Colors.black54,
                  ),
                ],
              ),
            ),
          ])
        ]),
        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
          crossAxisCount: 1,
          mainAxisSpacing: 5.0,
          crossAxisSpacing: 5.0,
          childAspectRatio: 9,
        ));

    return sliverList;
  }

  SliverGrid getFilterElements(MenuBloc menuBloc) {
    List<Widget> list = List();

    menuBloc.exerciseDeviceRepository.getGymDevices().forEach((element) {
      String deviceName = AppLanguage().appLocal == Locale('en') ? element.name : element.nameTranslation;
      ChoiceChip chip = ChoiceChip(
        labelPadding: EdgeInsets.only(right: 5),
        avatar: Icon(
          Icons.remove_circle_outline,
          color: Colors.orange,
          size: 18,
        ),
        label: Text(deviceName),
        labelStyle: TextStyle(fontSize: 9, color: Colors.black),
        selectedColor: Colors.white,
        selected: menuBloc.selectedDevice(element.exerciseDeviceId),
        backgroundColor: Colors.blue[100],
        shadowColor: Colors.black54,
        onSelected: (value) => menuBloc.add(MenuFilterExerciseType(deviceId: element.exerciseDeviceId)),
      );
      list.add(chip);
    });

    SliverGrid sliverList = SliverGrid(
        delegate: SliverChildListDelegate(list),
        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
          crossAxisCount: 3,
          mainAxisSpacing: 1.0,
          crossAxisSpacing: 1.0,
          childAspectRatio: 3,
        ));
    return sliverList;
  }

  SliverGrid getInfoWidget(BuildContext context, MenuBloc menuBloc) {
    final List<Widget> _columnChildren = List();
    if (context != null) {
      menuBloc.setContext(context);
      menuBloc.setMenuInfo();

      Widget info = MenuInfoWidget(
        title: menuBloc.infoTitle,
        titleSize: 18,
        titleWeight: FontWeight.bold,
        titleColor: Colors.orangeAccent,
        text: menuBloc.infoText,
        textSize: 13,
        textColor: Colors.yellowAccent,
        text2: menuBloc.infoText2,
        text3: menuBloc.infoText3,
        link: menuBloc.infoLink,
        bloc: menuBloc,
      );
      _columnChildren.add(info);
    }
    SliverGrid sliverList = SliverGrid(
        delegate: SliverChildListDelegate(_columnChildren),
        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
          crossAxisCount: 1,
          mainAxisSpacing: 5.0,
          crossAxisSpacing: 5.0,
          childAspectRatio: 2,
        ));
    return sliverList;
  }

  void menuClick(WorkoutMenuTree workoutTree, MenuBloc menuBloc, BuildContext context) {
    print("Hi!, Menu clicked " + workoutTree.id.toString());
    if (workoutTree.child == false) {
      menuBloc.add(MenuTreeDown(item: workoutTree, parent: workoutTree.id));
    } else {
      menuBloc.add(MenuClickExercise(exerciseTypeId: workoutTree.id));
      if (Cache().userLoggedIn == null) {
        Scaffold.of(context).showSnackBar(SnackBar(
            backgroundColor: Colors.orange,
            content: Text(AppLocalizations.of(context).translate('Please log in'), style: TextStyle(color: Colors.white))));
      } else {
        if (workoutTree.exerciseType.name == "Custom" && Cache().userLoggedIn.admin == 1) {
          Navigator.of(context).pushNamed('exerciseCustomPage', arguments: workoutTree.exerciseType);
        } else {
          Navigator.of(context).pushNamed('exerciseNewPage', arguments: workoutTree.exerciseType);
        }
      }
    }
  }

  dynamic getShape(WorkoutMenuTree workoutTree) {
    bool base = workoutTree.base;
    dynamic returnCode = (base == true)
        ? RoundedRectangleBorder(
            side: BorderSide(width: 6, color: Colors.orangeAccent), borderRadius: BorderRadius.all(Radius.circular(24.0)))
        : RoundedRectangleBorder(
            side: BorderSide(width: 1, color: Colors.transparent), borderRadius: BorderRadius.all(Radius.circular(8.0)));
    return returnCode;
  }

  dynamic _getButtonImage(WorkoutMenuTree workoutTree, double cWidth, double cHeight) {
    dynamic image;
    try {
      image = ClipRRect(
          borderRadius: BorderRadius.circular(24),
          child: Image.asset(
            workoutTree.imageName,
            height: cHeight,
            errorBuilder: (context, error, stackTrace) {
              String url = Cache.mediaUrl + 'images/' + workoutTree.imageName.substring(11);
              Widget image = FadeInImage.assetNetwork(
                placeholder: 'asset/image/dots.gif',
                image: url,
                height: 180,
              );
              return image;
            },
          ));
    } on Exception catch (_) {
      String url = Cache.mediaUrl + '/images/' + workoutTree.imageName;
      image = FadeInImage.assetNetwork(
        placeholder: 'asset/image/dots.gif',
        image: url,
        height: 180,
      );
    }

    return image;
  }

  Widget badgedIcon(WorkoutMenuTree workoutMenuTree, double cWidth, double cHeight) {
    String badgeKey = workoutMenuTree.nameEnglish;
    bool show = Cache().getBadges()[badgeKey] != null;
    int counter = Cache().getBadges()[badgeKey] != null ? Cache().getBadges()[badgeKey] : 0;
    return Badge(
      padding: EdgeInsets.all(8),
      position: BadgePosition.topEnd(top: 3, end: 3),
      animationDuration: Duration(milliseconds: 500),
      animationType: BadgeAnimationType.slide,
      badgeColor: Colors.red,
      showBadge: show,
      badgeContent: Text(counter.toString(),
          style: TextStyle(
            color: Colors.white,
            fontSize: 16,
          )),
      child: _getButtonImage(workoutMenuTree, cWidth, cHeight),
    );
  }
}