dart file

import 'package:flutter/material.dart';
import 'package:wellspingapp/wellspring_icons.dart';
import 'package:wellspingapp/auth_provider.dart';
import 'package:wellspingapp/sessions_page.dart';
import 'package:wellspingapp/app_data.dart';
import 'package:wellspingapp/play_page.dart';
import 'package:flutter_svg/flutter_svg.dart';

class BottomNavBar extends StatefulWidget {

  @override
  State<StatefulWidget> createState() => _BottomNavBarState();
}

class _BottomNavBarState extends State<BottomNavBar>  with TickerProviderStateMixin {
  double section = 0;

  String lastRouteName;
  bool saved = false;




  List<Widget> buildProgramTiles() {
    List<Widget> tiles = [];
    var userData = AuthProvider.of(context).userData;
    var appData = AuthProvider.of(context).appData;

    List<Session> sessionsList = userData.getActiveProgramsSessions(appData);

    sessionsList.forEach((Session session) {
      tiles.add(
          buildProgramTile(
            programId: session.programId,
            title: session.getProgram().name,
            watched: session.getOrder(),
            sessionId: session.id,
            total: session.getProgramSessions().length,
            short: session.getProgram().description,
          )
      );
    });

    return tiles;

  }

  Widget buildProgramTile({
    int programId,
    String title,
    int watched,
    int sessionId,
    int total,
    String short}) {

    return Card(
      child: Container(
        height: 240,
        width: 180,
        child: Stack(
          alignment: Alignment.topCenter,
          children: <Widget>[
            Container(
              height: 240,
              width: 180,
              decoration: BoxDecoration(
                color: Color.fromRGBO(136, 136, 136, 1),
                borderRadius: BorderRadius.all(Radius.circular(5)),
              ),

            ),
            Container(
              padding: EdgeInsets.only(top: 20),
              child: Icon(Icons.landscape, color: Color.fromRGBO(255, 255, 255, 0.2), size: 180),
            ),
            Column(
              crossAxisAlignment: CrossAxisAlignment.stretch,
              mainAxisSize: MainAxisSize.min,
              mainAxisAlignment: MainAxisAlignment.start,
              children: <Widget>[
                SizedBox(
                  height: 10,
                ),
                Center(
                    child: Text(title, style: TextStyle(fontSize: 22, color: Colors.white), textAlign: TextAlign.center,)
                ),
                Center(
                    child: Text('${watched}/${total}', style: TextStyle(fontSize: 16, color: Colors.white))
                ),
                SizedBox(
                  height: 10,
                ),
                Expanded(
                  child: Container(
                    width: 180,
                    padding: EdgeInsets.all(10),
                    child: Column(
                      children: <Widget>[
                        Text(short, textAlign: TextAlign.center, style: TextStyle(fontSize: 12, color: Colors.white),),
                      ],
                    ),
                  ),
                ),
                Container(
                  padding: EdgeInsets.only(bottom: 10),
                  child: Row(
                    mainAxisSize: MainAxisSize.max,
                    mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: <Widget>[
                      Container(
                        padding: EdgeInsets.all(0),
                        width: 50,
                        child: FlatButton(
                          padding: EdgeInsets.all(0),
                          onPressed: () {

                            Navigator.push(
                              context,
                              MaterialPageRoute(
                                builder: (context) => SessionsPage(programId: programId),
                              ),
                            );
                          },
                          child: Column(
                            crossAxisAlignment: CrossAxisAlignment.center,
                            children: <Widget>[
                              Icon(Icons.landscape, color: Colors.white, size: 40),
                              Text('See all', style: TextStyle(fontSize: 10, color: Colors.white),)
                            ],
                          ),
                        ),
                      ),
                      Container(
                        padding: EdgeInsets.all(0),
                        width: 50,
                        child: FlatButton(
                          padding: EdgeInsets.all(0),
                          onPressed: () {

                            AppData appData = AuthProvider.of(context).appData;
                            Program program = appData.programs.firstWhere((item) {
                              return item.id == programId;
                            });

                            Session session = program.sessions.sessions.firstWhere((item) {
                              return item.id == sessionId;
                            });

                            Navigator.push(
                              context,
                              MaterialPageRoute(
                                builder: (context) => PlayPage(session: session),
                              ),
                            );
                          },
                          child: Column(
                            crossAxisAlignment: CrossAxisAlignment.center,
                            children: <Widget>[
                              Icon(Icons.play_arrow, color: Colors.white, size: 40),
                              Text('Play next', style: TextStyle(fontSize: 10, color: Colors.white),)
                            ],
                          ),
                        ),
                      ),
                    ],
                  ),
                ),
              ],
            )
          ],
        ),
      ),
//      child: ,
    );
  }


//  Card makeGridCell(String name, IconData icon) {
  TableCell makeGridCell(String name, SvgPicture picture ) {
//    return Card(
    return TableCell(
//      elevation: 1.0,
      child: FlatButton(
//        shape: RoundedRectangleBorder(borderRadius: BorderRadius.all(Radius.circular(5))),
        onPressed: () {
          print('pressed $name');
          switch(name) {
            case 'Settings': {

              //TODO: move lastRouteName to inherited widget
              print('last: $lastRouteName');
              if(lastRouteName != '/userSettingsPage') {
                Future result = Navigator.pushNamed(context, '/userSettingsPage');
                lastRouteName = '/userSettingsPage';
                print('set last: $lastRouteName');
                result.then((a) {
                  print('RESET last!!! result: $result, $a');
                  lastRouteName = '/';
                });
              }

              break;
            }
            case 'Upgrade': {
              Future result = Navigator.pushNamed(context, '/upgradePage');
              lastRouteName = '/upgradePage';
              result.then((a) {
                print('result: $result, $a');
                lastRouteName = '/';
              });
            }
            break;
            case 'Medals': {
              Future result = Navigator.pushNamed(context, '/medalsPage');
              lastRouteName = '/medalsPage';
              result.then((a) {
                print('result: $result, $a');
                lastRouteName = '/';
              });
            }
            break;
            case 'Share': {
              Future result = Navigator.pushNamed(context, '/sharePage');
              lastRouteName = '/sharePage';
              result.then((a) {
                print('result: $result, $a');
                lastRouteName = '/';
              });
            }
            break;
            case 'About': {
              Future result = Navigator.pushNamed(context, '/aboutPage');
              lastRouteName = '/aboutPage';
              result.then((a) {
                print('result: $result, $a');
                lastRouteName = '/';
              });
            }
            break;
            case 'Merchandise': {
              Future result = Navigator.pushNamed(context, '/merchandisePage');
              lastRouteName = '/merchandisePage';
              result.then((a) {
                print('result: $result, $a');
                lastRouteName = '/';
              });
            }
            break;
          }

          setState(() {
            section = 0;
          });


        },
        child: Container(
          padding: EdgeInsets.symmetric(horizontal: 5, vertical: 20),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.stretch,
            mainAxisSize: MainAxisSize.min,
            verticalDirection: VerticalDirection.down,
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              //Center(child: Icon(picture, size: 60, color: Color.fromRGBO(100, 100, 100, 1),)),
              SizedBox(height: 5,),
              Center(child: Text(name, style: TextStyle(fontSize: 13, color: Color.fromRGBO(100, 100, 100, 1), fontWeight: FontWeight.bold))),
            ],
          ),
        ),
      ),

    );
  }


  Widget buildSection() {
    if(section == 1) {

      return Container(
          height: 330,
          child: Column(
              children: <Widget>[
                SizedBox(
                  height: 70,
                  child: Container(
                    decoration: BoxDecoration(
                        gradient: LinearGradient(
                            begin: Alignment.bottomCenter,
                            end: Alignment.topCenter,
                            stops: [0, 1],
                            colors: [
                              Color.fromRGBO(230, 230, 230, 1),
                              Color.fromRGBO(180, 180, 180, 1),
                            ])
                    ),
                    child: Container(
                      padding: EdgeInsets.only(left: 20),
                      child: Row(
                        mainAxisSize: MainAxisSize.max,
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        crossAxisAlignment: CrossAxisAlignment.stretch,
                        children: <Widget>[
                          Icon(Wellspring.content, size: 30, color: Color.fromRGBO(85, 85, 85, 1)),
                          Expanded(
                            flex: 25,
                            child: Column(
                              mainAxisAlignment: MainAxisAlignment.center,
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: <Widget>[
                                Container(
                                  padding: EdgeInsets.only(left: 10),
                                  child: Text('Current programs', style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold, color: Color.fromRGBO(85, 85, 85, 1)), ),
                                ),
                              ],
                            ),
                          ),
                          Container(
//                          padding: EdgeInsets.only(right: 20),
                            width: 100,
                            child: FlatButton(
                              onPressed: () {
                                Navigator.pushNamed(context, '/programsPage');
                              },
                              child: Text('ALL', style: TextStyle(color: Color.fromRGBO(71, 180, 234, 1)),),
                            ),
                          ),



                        ],
                      ),
                    ),
                  ),
                ),

                Expanded(
                  flex: 1,
                  child: Container(
                    //width: 90,
//                  decoration: BoxDecoration(border: Border.all(color: Color.fromRGBO(0, 0, 0, 1), width: 1), borderRadius: BorderRadius.all(Radius.circular(5))),
                    padding: EdgeInsets.all(10),
                    child: ListView(
                      scrollDirection: Axis.horizontal,
                      children: buildProgramTiles(),
//                      children: <Widget>[
//                        buildProgramTile(
//                          title: 'Clarity',
//                          watched: 2,
//                          total: 10,
//                          short: 'A short description about this pack. What\'s the purpose and which benefits it provides',
//                        ),
//                        buildProgramTile(
//                          title: 'Chill',
//                          watched: 4,
//                          total: 10,
//                          short: 'A short description about this pack. What\'s the purpose and which benefits it provides',
//                        ),
//                        buildProgramTile(
//                          title: 'Commitment',
//                          watched: 0,
//                          total: 10,
//                          short: 'A short description about this pack. What\'s the purpose and which benefits it provides',
//                        ),
//                      ],
                    ),
                  ),
                ),
              ]
          )
      );
    } else if(section == 2) {
      return Container(
        child: Column(
          mainAxisSize: MainAxisSize.max,
          mainAxisAlignment: MainAxisAlignment.end,
          children: <Widget>[
            SizedBox(
              height: 70,
              child: Container(
                decoration: BoxDecoration(
                    gradient: LinearGradient(
                        begin: Alignment.bottomCenter,
                        end: Alignment.topCenter,
                        stops: [0, 1],
                        colors: [
                          Color.fromRGBO(230, 230, 230, 1),
                          Color.fromRGBO(180, 180, 180, 1),
                        ])
                ),
                child: Container(
                  padding: EdgeInsets.all(20),
                  child: Row(
                    mainAxisSize: MainAxisSize.max,
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    crossAxisAlignment: CrossAxisAlignment.center,
                    children: <Widget>[
                      Icon(Icons.account_circle, size: 30, color: Color.fromRGBO(85, 85, 85, 1)),
                      Expanded(
                        flex: 15,
                        child: Container(
                          padding: EdgeInsets.only(left: 10),
                          child: Text('Dave', style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold, color: Color.fromRGBO(85, 85, 85, 1)),),
                        ),
                      ),
                      Container(
                        padding: EdgeInsets.only(right: 20),
                        width: 60,
                        child: Row(
                          children: <Widget>[
                            Flexible(
                              flex: 1,
                              child: Icon(Wellspring.medal, size: 30, color: Color.fromRGBO(85, 85, 85, 0.5),),
                            ),
                            Flexible(
                              flex: 1,
                              child: Icon(Wellspring.medal, size: 30, color: Color.fromRGBO(85, 85, 85, 0.7),),
                            ),
                            Flexible(
                              flex: 1,
                              child: Icon(Wellspring.medal, size: 30, color: Color.fromRGBO(85, 85, 85, 0.9),),
                            ),
                          ],
                        ),
                      ),



                    ],
                  ),
                ),
              ),
            ),


//            Expanded(
            Container(
//              flex: 1,
              child: Container(
//                child: GridView.count(
//                  primary: true,
//                  padding: EdgeInsets.all(1.0),
//                  crossAxisCount: 3,
//                  childAspectRatio: 1.0,
//                  mainAxisSpacing: 1.0,
//                  crossAxisSpacing: 1.0,
//                  children: <Widget>[
//                    makeGridCell('Medals', Wellspring.podium),
//                    makeGridCell('Merchandise', Wellspring.tshirt),
//                    makeGridCell('Upgrade', Icons.call_missed_outgoing),
//                    makeGridCell('About', Wellspring.ms),
//                    makeGridCell('Share', Wellspring.share),
//                    makeGridCell('Settings', Icons.settings),
//                  ]
//                ),

                child: Table(
                    border: TableBorder.all(width: 0, color: Colors.transparent),
                    children: [
                      TableRow(
                          children: [
                            makeGridCell('Medals', SvgPicture.asset("assets/icon/username.svg",height: 30)),
                            makeGridCell('Merchandise', SvgPicture.asset('assets/icon/username.svg',height:30)),
                            makeGridCell('Upgrade', SvgPicture.asset('assets/icon/username.svg',height: 30)),
                          ]
                      ),
                      TableRow(
                          children: [
                            makeGridCell('About', SvgPicture.asset('assets/icon/ico_submenu_about.svg', height: 30,)),
                            makeGridCell('Share',SvgPicture.asset('assets/icon/username.svg')),
                            makeGridCell('Settings', SvgPicture.asset('assets/icon/ico_menu_home.svg', height: 50)),
                          ]
                      ),
                    ]
                ),


              ),
            ),


          ],
        ),

      );
    } else {
      return Container();
    }
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      child: Column(
        mainAxisSize: MainAxisSize.min,
        mainAxisAlignment: MainAxisAlignment.start,
        children: <Widget>[

          AnimatedSize(
              vsync: this,
              alignment: Alignment.topCenter,
              duration: Duration(milliseconds: 200),
              curve: Curves.easeOut,
              child: Container(
                  child: Column(
                      mainAxisAlignment: MainAxisAlignment.start,
                      children: <Widget>[
                        buildSection(),
                      ]
                  )
              )
          ),

          //footer button
          Container(
              height: 80,
              child: Row(
                  crossAxisAlignment: CrossAxisAlignment.stretch,
                  children: <Widget> [
                    Expanded(
                      child: Container(
                        color: const Color(0xff2e3136),
                        child: FlatButton(
                          onPressed: () {
                            setState(() {
                              section = 0;
                            });
                            Navigator.popUntil(context, ModalRoute.withName('/'));
                          },
                          child: Column(
                            mainAxisSize: MainAxisSize.max,
                            mainAxisAlignment: MainAxisAlignment.center,
                            children: <Widget>[
                              Padding(
                                padding: const EdgeInsets.all(8.0),
                                child: SvgPicture.asset('assets/icon/ico_menu_home.svg',height: 30,),
                              ),
                              Text('Home',style: Theme.of(context).textTheme.body1,),
                            ],
                          ),
                        ),

                      ),
                    ),
                    Expanded(
                      child: Container(
                        color: const Color(0xff2e3136),
                        child: FlatButton(
                          onPressed: () {
                            print('pressed');

                            setState(() {
                              if(section == 1) {
                                section = 0;
                              } else {
                                section = 1;
                              }
                            });
                          },
                          child: Column(
                            mainAxisSize: MainAxisSize.max,
                            mainAxisAlignment: MainAxisAlignment.center,
                            children: <Widget>[
                              Padding(
                                padding: const EdgeInsets.all(8.0),
                                child: SvgPicture.asset('assets/icon/ico_menu_programs.svg',height: 30,),
                              ),
                              Text('Programs', style: Theme.of(context).textTheme.body1,),
                            ],
                          ),
                        ),
                      ),
                    ),
                    Expanded(
                      child: Container(
                        color: const Color(0xff2e3136),
                        child: FlatButton(
                          onPressed: () {
                            print('pressed');

                            setState(() {
                              if(section == 2) {
                                section = 0;
                              } else {
                                section = 2;
                              }
                            });
                          },
                          child: Column(
                            mainAxisSize: MainAxisSize.max,
                            mainAxisAlignment: MainAxisAlignment.center,
                            children: <Widget>[
                            Padding(
                              padding: const EdgeInsets.all(8.0),
                              child: SvgPicture.asset('assets/icon/username.svg',height: 30,),
                            ),

                              Text('User',style: Theme.of(context).textTheme.body1,),
                            ],
                          ),
                        ),
                      ),
                    ),
                  ]

              )
          )
        ],
      ),
    );

  }


}