import 'dart:ui';

import 'package:aitrainer_app/model/cache.dart';
import 'package:aitrainer_app/service/logging.dart';
import 'package:aitrainer_app/util/common.dart';
import 'package:aitrainer_app/util/enums.dart';
import 'package:aitrainer_app/util/track.dart';
import 'package:aitrainer_app/util/trans.dart';
import 'package:convex_bottom_bar/convex_bottom_bar.dart';
import 'package:flutter/material.dart';

// ignore: must_be_immutable
class BottomNavigator extends StatefulWidget {
  int bottomNavIndex = 0;
  BottomNavigator({required this.bottomNavIndex}) {
    this.bottomNavIndex = bottomNavIndex;
  }

  @override
  _NawDrawerWidget createState() => _NawDrawerWidget();
}

class _NawDrawerWidget extends State<BottomNavigator> with Trans, Logging {
  @override
  void initState() {
    super.initState();
  }

  @override
  void didChangeDependencies() {
    Cache().initBadges();
    super.didChangeDependencies();
  }

  @override
  Widget build(BuildContext context) {
    final Color bgrColor = Color(0xffb4f500);
    final Color bgrColorEnd = Colors.blue;
    final Color active = Colors.white;
    final Color inactive = Colors.black38;
    setContext(context);

    return StyleProvider(
        style: Style(),
        child: ConvexAppBar(
            initialActiveIndex: widget.bottomNavIndex,
            curve: Curves.easeIn,
            style: TabStyle.react,
            color: inactive,
            height: 55,
            gradient: LinearGradient(colors: [bgrColorEnd, bgrColor], stops: [0.1, .75]),
            items: [
              TabItem(
                isIconBlend: false,
                title: t("Home"),
                icon: Common.badgedIcon(inactive, Icons.home, "home"),
                activeIcon: Common.badgedIcon(active, Icons.home, "home"),
              ),
              TabItem(
                title: t("Growth"),
                icon: Common.badgedIcon(inactive, Icons.trending_up, "development"),
                activeIcon: Common.badgedIcon(active, Icons.trending_up, "development"),
              ),
              TabItem(
                  title: t("Training"),
                  icon: Icon(Icons.featured_play_list, color: inactive),
                  activeIcon: Icon(Icons.featured_play_list, color: active)),
              TabItem(
                title: t("Account"),
                icon: Common.badgedIcon(inactive, Icons.person, "account"),
                activeIcon: Common.badgedIcon(active, Icons.person, "account"),
              ),
              TabItem(title: t("Settings"), icon: Icon(Icons.settings, color: inactive), activeIcon: Icon(Icons.settings, color: active)),
            ],
            onTap: (index) {
              setState(() {
                widget.bottomNavIndex = index;
                switch (index) {
                  case 0:
                    Navigator.of(context).pop();
                    Track().track(TrackingEvent.home);
                    Navigator.of(context).pushNamed('home');

                    break;
                  case 1:
                    Navigator.of(context).pop();
                    Track().track(TrackingEvent.my_development);
                    Navigator.of(context).pushNamed('myDevelopment');
                    break;
                  case 2:
                    Navigator.of(context).pop();
                    Track().track(TrackingEvent.my_exerciseplan);
                    Navigator.of(context).pushNamed('myTrainingPlans');

                    break;
                  case 3:
                    Navigator.of(context).pop();
                    Track().track(TrackingEvent.account);
                    Navigator.of(context).pushNamed('account');

                    break;
                  case 4:
                    Navigator.of(context).pop();
                    Track().track(TrackingEvent.settings);
                    Navigator.of(context).pushNamed('settings');

                    break;
                }
              });
            }));
  }
}

class Style extends StyleHook {
  @override
  double get activeIconSize => 50;

  @override
  double get activeIconMargin => 10;

  @override
  double get iconSize => 20;

  @override
  TextStyle textStyle(Color color) {
    return TextStyle(fontSize: 12, color: color);
  }
}