import 'dart:async';

import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_svg/flutter_svg.dart';

import '../../bloc/home/newarrival_product/bloc.dart';
import '../../bloc/home/sale_product/bloc.dart';
import '../../bloc/product/product_list/bloc.dart';
import '../../config/theme.dart';
import '../../custom_widget/item_loading.dart';
import '../../custom_widget/item_product.dart';
import '../../service/api_service.dart';
import '../list_product/list_product.dart';

class ProductItem extends StatelessWidget {
  final String text;
  final String showProduct;
  final ProductListEvent event;
  final NewArrivalBloc newArrivalBloc;
  final SaleProductBloc saleProductBloc;
  final Completer<void> refreshCompleter;

  const ProductItem({
    Key key,
    this.text = '',
    this.showProduct = '',
    @required this.event,
    this.newArrivalBloc,
    this.refreshCompleter,
    this.saleProductBloc,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    double width = MediaQuery.of(context).size.width;
    return Container(
      margin: EdgeInsets.symmetric(
        vertical: 8.0,
      ),
      color: Colors.white,
      child: Column(
        children: <Widget>[
          Row(
            children: <Widget>[
              Expanded(
                child: Row(
                  children: <Widget>[
                    Align(
                      alignment: Alignment.topLeft,
                      child: Padding(
                        padding: const EdgeInsets.all(16.0),
                        child: Text(
                          text,
                          textAlign: TextAlign.left,
                          style: TextStyle(
                            fontSize: 18.0,
                            fontFamily: 'Avenir Black',
                            color: ThemeApp.categoryTextColor,
                          ),
                        ),
                      ),
                    ),
                    // TODO - issue can't load SVG
                    SvgPicture.asset('assets/icons/icon_new_arrival.svg'),
                  ],
                ),
              ),
              InkWell(
                child: Padding(
                  padding: const EdgeInsets.symmetric(
                    horizontal: 32.0,
                  ),
                  child: Text(
                    'View All',
                    textAlign: TextAlign.end,
                    style: ThemeApp.viewAllTextStyle(),
                  ),
                ),
                onTap: () {
                  Navigator.push(
                    context,
                    MaterialPageRoute(
                      builder: (BuildContext context) {
                        return BlocProvider<ProductListBloc>(
                          create: (BuildContext context) {
                            return ProductListBloc();
                          },
                          child: ListProductPage(
                            event: event,
                          ),
                        );
                      },
                    ),
                  );
                },
              ),
            ],
          ),
          SizedBox(
            width: width,
            child: NotificationListener<OverscrollIndicatorNotification>(
              onNotification: (OverscrollIndicatorNotification overScroll) {
                overScroll.disallowGlow();
                return false;
              },
              child: buildBlocBuilder(
                showProduct,
                newArrivalBloc,
                saleProductBloc,
                refreshCompleter,
                width,
                context,
              ),
            ),
          ),
        ],
      ),
    );
  }

  Widget buildLoadingItem(double width) {
    double height = 240.0;
    return Container(
      height: height,
      margin: EdgeInsets.only(
        bottom: 26.0,
      ),
      child: ListView.builder(
        shrinkWrap: true,
        scrollDirection: Axis.horizontal,
        physics: ScrollPhysics(),
        itemCount: 4,
        itemBuilder: (BuildContext context, int index) {
          return ItemProductsLoading(
            margin: index == 0
                ? EdgeInsets.only(
                    left: 16.0,
                    right: 16.0,
                    top: 6.0,
                    bottom: 6.0,
                  )
                : EdgeInsets.only(
                    right: 16.0,
                    top: 6.0,
                    bottom: 6.0,
                  ),
            width: width,
          );
        },
      ),
    );
  }

  Widget buildLoadedItem(state, double width) {
    return Container(
      height: 240.0,
      margin: EdgeInsets.only(
        bottom: 26.0,
      ),
      child: ListView.builder(
        shrinkWrap: true,
        physics: ScrollPhysics(),
        scrollDirection: Axis.horizontal,
        itemCount: state.product.length,
        itemBuilder: (BuildContext context, int index) {
          return ItemProducts(
            index: index,
            products: state.product[index],
            margin: index == 0
                ? EdgeInsets.only(
                    left: 16.0,
                    right: 16.0,
                    top: 6.0,
                    bottom: 6.0,
                  )
                : EdgeInsets.only(
                    right: 16.0,
                    top: 6.0,
                    bottom: 6.0,
                  ),
            width: width,
          );
        },
      ),
    );
  }

  Widget buildErrorItem() {
    return Text('Error');
  }

  BlocBuilder buildBlocBuilder(
    String showProduct,
    NewArrivalBloc newArrivalBloc,
    SaleProductBloc saleProductBloc,
    Completer<void> refreshCompleter,
    double width,
    BuildContext context,
  ) {
    switch (showProduct) {
      case ShowProduct.sale:
        BlocListener<SaleProductBloc, SaleProductState>(
          listener: (BuildContext context, SaleProductState state) {
            if (state is ProductLoaded) {
              saleProductBloc.add(GetSaleProductFromAPI());
            }
            refreshCompleter?.complete();
            refreshCompleter = Completer();
          },
          child: BlocBuilder<SaleProductBloc, SaleProductState>(
            builder: (BuildContext context, SaleProductState state) {
              if (state is ProductLoading) {
                return buildLoadingItem(width);
              }
              if (state is ProductLoaded) {
                return buildLoadedItem(state, width);
              }
              if (state is ProductError) {
                return Text("eroor ${state.message}");
              }
              return Container();
            },
          ),
        );
        break;
      case ShowProduct.newArrival:
        BlocListener<NewArrivalBloc, NewArrivalState>(
          listener: (BuildContext context, NewArrivalState state) {
            if (state is NewArrivalLoaded) {
             newArrivalBloc.add(GetNewArrivalFromAPI());
            }
            refreshCompleter?.complete();
            refreshCompleter = Completer();
          },
          child: BlocBuilder<NewArrivalBloc, NewArrivalState>(
            builder: (BuildContext context, NewArrivalState state) {
              if (state is NewArrivalLoading) {
                return buildLoadingItem(width);
              }
              if (state is NewArrivalLoaded) {
                return buildLoadedItem(state, width);
              }
              if (state is NewArrivalError) {
                return Text("INI JUGA ${state.message}");
              }
              return Container();
            },
          ),
        );

        break;
      default:
        return null;
    }
  }
}