import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:quiosco_soler/productos/pages/comercial.dart';
import 'package:quiosco_soler/productos/pages/habitat.dart';
import 'package:quiosco_soler/productos/pages/industrial.dart';
import 'package:quiosco_soler/productos/pages/oem.dart';
import 'package:quiosco_soler/productos/providers/models_provider.dart';
import 'package:quiosco_soler/productos/widget/producto_lateral_menu.dart';
import 'package:scoped_model/scoped_model.dart';

class Index extends StatefulWidget {
  @override
  _IndexState createState() => _IndexState();
}

class _IndexState extends State<Index> {
  final GlobalKey<ScaffoldState> _productoScaffoldKey = GlobalKey<ScaffoldState>();
  final _modelosProvider = ModelosProvider();
  bool _isLoading = true;
  List<String> habitat = [];
  List<String> comercial = [];
  List<String> industrial = [];
  List<String> oem = [];

  @override
  void initState() {
    super.initState();
    _modelosProvider.fetchModelos().then((modelos){
      int i = 0;
      do{
        String modelo = modelos.result[i].modelo;
        switch(modelos.result[i].linea){
          case "Hábitat":
            if(!habitat.contains(modelo)){
              habitat.add(modelo);
            }
            break;
          case "Comercial":
            if(!comercial.contains(modelos.result[i].modelo)){
              comercial.add(modelos.result[i].modelo);
            }
            break;
          case "Industrial":
            if(!industrial.contains(modelos.result[i].modelo)){
              industrial.add(modelos.result[i].modelo);
            }
            break;
          case "OEM":
            if(!oem.contains(modelos.result[i].modelo)){
              oem.add(modelos.result[i].modelo);
            }
            break;
        }
        i++;
      }while(i < modelos.result.length);
      setState(() {
        _isLoading = false;
      });
    });
  }

  @override
  Widget build(BuildContext context) {
    final _screenSize = MediaQuery.of(context).size;
    return ScopedModelDescendant<MainModel>(
      builder: (context, child, model){
        return Scaffold(
          key: _productoScaffoldKey,
          drawer: _isLoading ? null : ProductoLateralMenu(
              position: 'index'
          ),
          appBar: _isLoading ? null : AppBar(
            automaticallyImplyLeading: false,
            backgroundColor: Colors.white,
            centerTitle: true,
            title: Row(
              children: <Widget>[
                Image(
                  image: AssetImage('assets/logo.png'),
                  width: 32.0,
                ),
                SizedBox(width: 8.0),
                TextButton(
                  style: TextButton.styleFrom(
                      padding: EdgeInsets.zero,
                      tapTargetSize: MaterialTapTargetSize.shrinkWrap,
                      minimumSize: Size(0.0, 0.0)
                  ),
                  child: Icon(
                    Icons.menu,
                    color: Color.fromRGBO(255, 0, 0, 1),
                  ),
                  onPressed: () => _productoScaffoldKey.currentState.openDrawer(),
                ),
                Expanded(
                  child: Text(
                    'PRODUCTO',
                    textAlign: TextAlign.center,
                    style: TextStyle(
                        color: Colors.red,
                        fontFamily: 'Helvetica Neue Black Cond'
                    ),
                  ),
                ),
                SizedBox(width: 32.0),
                TextButton(
                  style: TextButton.styleFrom(
                      padding: EdgeInsets.zero,
                      tapTargetSize: MaterialTapTargetSize.shrinkWrap,
                      minimumSize: Size(0.0, 0.0)
                  ),
                  child: Icon(
                    Icons.cancel,
                    color: Color(0xFFFF0000),
                  ),
                  onPressed: () => Navigator.pop(context),
                ),
              ],
            ),
          ),
          body: _isLoading ? Center(
            child: CircularProgressIndicator(),
          ) : SingleChildScrollView(
            child: Column(
              children: <Widget>[
                Container(
                  width: _screenSize.width*0.9,
                  margin: EdgeInsets.symmetric(horizontal: _screenSize.width*0.05, vertical: 8.0),
                  child: Text(
                    'Explora nuestros sistemas de ventilación',
                    style: GoogleFonts.robotoSlab(
                        fontWeight: FontWeight.w400,
                        fontSize: 24.0
                    ),
                  ),
                ),
                Container(
                  width: _screenSize.width*0.9,
                  margin: EdgeInsets.symmetric(horizontal: _screenSize.width*0.05),
                  child: Text(
                    'Características completas, documentación técnica y toda la información que necesitas.',
                    style: GoogleFonts.roboto(
                        fontSize: 16.0
                    ),
                  ),
                ),
                SizedBox(height: 8.0),
                TextButton(
                  style: TextButton.styleFrom(
                      padding: EdgeInsets.zero,
                      tapTargetSize: MaterialTapTargetSize.shrinkWrap,
                      minimumSize: Size(0.0, 0.0)
                  ),
                  child: Container(
                    width: _screenSize.width,
                    alignment: Alignment.center,
                    child: Stack(
                      children: <Widget>[
                        Image(
                          width: _screenSize.width,
                          image: AssetImage('assets/habitat.jpg'),
                          fit: BoxFit.cover,
                        ),
                        Positioned(
                          bottom: 44.0,
                          left: 22.0,
                          child: Text(
                            'División Hábitat',
                            style: GoogleFonts.robotoSlab(
                                fontSize: 16.0,
                                color: Colors.white,
                                shadows: <Shadow>[
                                  Shadow(
                                      offset: Offset(1.0, 1.0),
                                      blurRadius: 3.0,
                                      color: Colors.black87
                                  )
                                ]
                            ),
                          ),
                        )
                      ],
                    ),
                  ),
                  onPressed: () {
                    List<Widget> habChil = [];

                    habitat.forEach((element) {
                      habChil.add(TextButton(
                        child: Text(
                          element,
                          textAlign: TextAlign.center,
                          style: GoogleFonts.roboto(
                              fontSize: 16.0,
                              color: Colors.black
                          ),
                        ),
                        onPressed: () => Navigator.push(context, MaterialPageRoute(
                            builder: (context) => Habitat(
                              modelo: element,
                              modelos: habitat,
                            )
                        )),
                      ));
                    });

                    showDialog(
                        context: context,
                        barrierDismissible: true,
                        builder: (context){
                          return AlertDialog(
                            title: Text(
                              'Selecciona un porducto',
                              textAlign: TextAlign.center,
                              style: GoogleFonts.roboto(
                                  fontSize: 20.0,
                                  fontWeight: FontWeight.bold,
                                  color: Color.fromRGBO(180, 4, 4, 2)
                              ),
                            ),
                            content: SingleChildScrollView(
                              child: Column(
                                children: habChil,
                              ),
                            ),
                            actions: <Widget>[
                              TextButton(
                                child: Text(
                                  'Cancelar',
                                  style: GoogleFonts.roboto(),
                                ),
                                onPressed: () => Navigator.pop(context),
                              )
                            ],
                          );
                        }
                    );
                  },
                ),
                TextButton(
                  style: TextButton.styleFrom(
                      padding: EdgeInsets.zero,
                      tapTargetSize: MaterialTapTargetSize.shrinkWrap,
                      minimumSize: Size(0.0, 0.0)
                  ),
                  child: Container(
                    width: _screenSize.width,
                    alignment: Alignment.center,
                    child: Stack(
                      children: <Widget>[
                        Image(
                          width: _screenSize.width,
                          image: AssetImage('assets/comercial.jpg'),
                          fit: BoxFit.cover,
                        ),
                        Positioned(
                          bottom: 44.0,
                          left: 22.0,
                          child: Text(
                            'División Comercial',
                            style: GoogleFonts.robotoSlab(
                                fontSize: 16.0,
                                color: Colors.white,
                                shadows: <Shadow>[
                                  Shadow(
                                      offset: Offset(1.0, 1.0),
                                      blurRadius: 3.0,
                                      color: Colors.black87
                                  )
                                ]
                            ),
                          ),
                        )
                      ],
                    ),
                  ),
                  onPressed: () {
                    List<Widget> comChil = [];

                    comercial.forEach((element) {
                      comChil.add(TextButton(
                        child: Text(
                          element,
                          textAlign: TextAlign.center,
                          style: GoogleFonts.roboto(
                              fontSize: 16.0,
                              color: Colors.black
                          ),
                        ),
                        onPressed: () => Navigator.push(context, MaterialPageRoute(
                            builder: (context) => Comercial(
                              modelo: element,
                              modelos: comercial,
                            )
                        )),
                      ));
                    });

                    showDialog(
                        context: context,
                        barrierDismissible: true,
                        builder: (context){
                          return AlertDialog(
                            title: Text(
                              'Selecciona un porducto',
                              textAlign: TextAlign.center,
                              style: GoogleFonts.roboto(
                                  fontSize: 20.0,
                                  fontWeight: FontWeight.bold,
                                  color: Color.fromRGBO(180, 4, 4, 2)
                              ),
                            ),
                            content: SingleChildScrollView(
                              child: Column(
                                children: comChil,
                              ),
                            ),
                            actions: <Widget>[
                              TextButton(
                                child: Text(
                                  'Cancelar',
                                  style: GoogleFonts.roboto(),
                                ),
                                onPressed: () => Navigator.pop(context),
                              )
                            ],
                          );
                        }
                    );
                  },
                ),
                TextButton(
                  style: TextButton.styleFrom(
                      padding: EdgeInsets.zero,
                      tapTargetSize: MaterialTapTargetSize.shrinkWrap,
                      minimumSize: Size(0.0, 0.0)
                  ),
                  child: Container(
                    width: _screenSize.width,
                    alignment: Alignment.center,
                    child: Stack(
                      children: <Widget>[
                        Image(
                          width: _screenSize.width,
                          image: AssetImage('assets/industrial.jpg'),
                          fit: BoxFit.cover,
                        ),
                        Positioned(
                          bottom: 44.0,
                          left: 22.0,
                          child: Text(
                            'División Industrial',
                            style: GoogleFonts.robotoSlab(
                                fontSize: 16.0,
                                color: Colors.white,
                                shadows: <Shadow>[
                                  Shadow(
                                      offset: Offset(1.0, 1.0),
                                      blurRadius: 3.0,
                                      color: Colors.black87
                                  )
                                ]
                            ),
                          ),
                        )
                      ],
                    ),
                  ),
                  onPressed: () {
                    List<Widget> indChil = [];

                    industrial.forEach((element) {
                      indChil.add(TextButton(
                        child: Text(
                          element,
                          textAlign: TextAlign.center,
                          style: GoogleFonts.roboto(
                              fontSize: 16.0,
                              color: Colors.black
                          ),
                        ),
                        onPressed: () => Navigator.push(context, MaterialPageRoute(
                            builder: (context) => Industrial(
                              modelo: element,
                              modelos: industrial,
                            )
                        )),
                      ));
                    });

                    showDialog(
                        context: context,
                        barrierDismissible: true,
                        builder: (context){
                          return AlertDialog(
                            title: Text(
                              'Selecciona un porducto',
                              textAlign: TextAlign.center,
                              style: GoogleFonts.roboto(
                                  fontSize: 20.0,
                                  fontWeight: FontWeight.bold,
                                  color: Color.fromRGBO(180, 4, 4, 2)
                              ),
                            ),
                            content: SingleChildScrollView(
                              child: Column(
                                children: indChil,
                              ),
                            ),
                            actions: <Widget>[
                              TextButton(
                                child: Text(
                                  'Cancelar',
                                  style: GoogleFonts.roboto(),
                                ),
                                onPressed: () => Navigator.pop(context),
                              )
                            ],
                          );
                        }
                    );
                  },
                ),
                TextButton(
                  style: TextButton.styleFrom(
                      padding: EdgeInsets.zero,
                      tapTargetSize: MaterialTapTargetSize.shrinkWrap,
                      minimumSize: Size(0.0, 0.0)
                  ),
                  child: Container(
                    width: _screenSize.width,
                    alignment: Alignment.center,
                    child: Stack(
                      children: <Widget>[
                        Image(
                          width: _screenSize.width,
                          image: AssetImage('assets/oem.jpg'),
                          fit: BoxFit.cover,
                        ),
                        Positioned(
                          bottom: 44.0,
                          left: 22.0,
                          child: Text(
                            'División OEM',
                            style: GoogleFonts.robotoSlab(
                                fontSize: 16.0,
                                color: Colors.white,
                                shadows: <Shadow>[
                                  Shadow(
                                      offset: Offset(1.0, 1.0),
                                      blurRadius: 3.0,
                                      color: Colors.black87
                                  )
                                ]
                            ),
                          ),
                        )
                      ],
                    ),
                  ),
                  onPressed: () {
                    List<Widget> oemChil = [];

                    oem.forEach((element) {
                      oemChil.add(TextButton(
                        child: Text(
                          element,
                          textAlign: TextAlign.center,
                          style: GoogleFonts.roboto(
                              fontSize: 16.0,
                              color: Colors.black
                          ),
                        ),
                        onPressed: () => Navigator.push(context, MaterialPageRoute(
                            builder: (context) => OEM(
                              modelo: element,
                              modelos: oem,
                            )
                        )),
                      ));
                    });

                    showDialog(
                        context: context,
                        barrierDismissible: true,
                        builder: (context){
                          return AlertDialog(
                            title: Text(
                              'Selecciona un porducto',
                              textAlign: TextAlign.center,
                              style: GoogleFonts.roboto(
                                  fontSize: 20.0,
                                  fontWeight: FontWeight.bold,
                                  color: Color.fromRGBO(180, 4, 4, 2)
                              ),
                            ),
                            content: SingleChildScrollView(
                              child: Column(
                                children: oemChil,
                              ),
                            ),
                            actions: <Widget>[
                              TextButton(
                                child: Text(
                                  'Cancelar',
                                  style: GoogleFonts.roboto(),
                                ),
                                onPressed: () => Navigator.pop(context),
                              )
                            ],
                          );
                        }
                    );
                  },
                ),
                TextButton(
                  style: TextButton.styleFrom(
                      padding: EdgeInsets.zero,
                      tapTargetSize: MaterialTapTargetSize.shrinkWrap,
                      minimumSize: Size(0.0, 0.0)
                  ),
                  child: Container(
                    width: _screenSize.width,
                    alignment: Alignment.center,
                    child: Stack(
                      children: <Widget>[
                        Image(
                          width: _screenSize.width,
                          image: AssetImage('assets/apl.jpg'),
                          fit: BoxFit.cover,
                        ),
                        Positioned(
                          bottom: 44.0,
                          left: 22.0,
                          child: Text(
                            'División APL',
                            style: GoogleFonts.robotoSlab(
                                fontSize: 16.0,
                                color: Colors.white,
                                shadows: <Shadow>[
                                  Shadow(
                                      offset: Offset(1.0, 1.0),
                                      blurRadius: 3.0,
                                      color: Colors.black87
                                  )
                                ]
                            ),
                          ),
                        )
                      ],
                    ),
                  ),
                  onPressed: () => Navigator.pushNamed(context, 'apl'),
                ),
                TextButton(
                  style: TextButton.styleFrom(
                      padding: EdgeInsets.zero,
                      tapTargetSize: MaterialTapTargetSize.shrinkWrap,
                      minimumSize: Size(0.0, 0.0)
                  ),
                  child: Container(
                    width: _screenSize.width,
                    alignment: Alignment.center,
                    child: Stack(
                      children: <Widget>[
                        Image(
                          width: _screenSize.width,
                          image: AssetImage('assets/unidades.jpg'),
                          fit: BoxFit.cover,
                        ),
                        Positioned(
                          bottom: 44.0,
                          left: 22.0,
                          child: Container(
                            width: _screenSize.width-44.0,
                            child: Text(
                              'Unidades de Ventilación Para Recuperación de Energía',
                              style: GoogleFonts.robotoSlab(
                                  fontSize: 16.0,
                                  color: Colors.white,
                                  shadows: <Shadow>[
                                    Shadow(
                                        offset: Offset(1.0, 1.0),
                                        blurRadius: 3.0,
                                        color: Colors.black87
                                    )
                                  ]
                              ),
                            ),
                          ),
                        )
                      ],
                    ),
                  ),
                  onPressed: () => Navigator.pushNamed(context, 'ener'),
                )
              ],
            ),
          ),
        );
      },
    );
  }
}
