import 'package:auto_size_text/auto_size_text.dart';
import 'package:flutter/material.dart';
import 'package:manager_app/Components/fetch_resource_icon.dart';
import 'package:manager_app/Components/fetch_section_icon.dart';
import 'package:manager_app/Models/managerContext.dart';
import 'package:manager_app/Screens/Resources/new_resource_popup.dart';
import 'package:manager_app/Screens/Resources/show_resource_popup.dart';
import 'package:manager_app/app_context.dart';
import 'package:manager_app/constants.dart';
import 'package:managerapi/api.dart';
import 'package:provider/provider.dart';

class ResourcesScreen extends StatefulWidget {
  ResourcesScreen({Key key}) : super(key: key);

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

class _ResourcesScreenState extends State<ResourcesScreen> {

  @override
  Widget build(BuildContext context) {
    final appContext = Provider.of<AppContext>(context);
    Size size = MediaQuery.of(context).size;

    return Container(
      child: Column(
          children: [
            FutureBuilder(
                future: getResources(appContext),
                builder: (context, AsyncSnapshot<dynamic> snapshot) {
                  if (snapshot.connectionState == ConnectionState.done) {
                    var tempOutput = new List<ResourceDTO>.from(snapshot.data);
                    tempOutput.add(ResourceDTO(id: null));
                    return bodyGrid(tempOutput, size, appContext);
                  } else if (snapshot.connectionState == ConnectionState.none) {
                    return Text("No data");
                  } else {
                    return Center(child: Container(height: size.height * 0.2, child: Text('LOADING TODO FRAISE')));
                  }
                }
            ),
          ]
      ),
    );
  }

  Widget bodyGrid(data, Size size, AppContext appContext)  {
    return GridView.builder(
        shrinkWrap: true,
        gridDelegate: new SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 6),
        itemCount: data.length,
        itemBuilder: (BuildContext context, int index) {
          return // User Picture
            InkWell(
              onTap: () {
                if (data[index].id == null) {
                  showNewResource(appContext, context);
                } else {
                  showResource(data[index], appContext, context, size);
                }
              },
              child: Container(
                decoration: boxDecoration(data[index]),
                padding: const EdgeInsets.all(15),
                margin: EdgeInsets.symmetric(vertical: 15, horizontal: 15),
                child: Align(
                    alignment: Alignment.center,
                    child: getElement(data[index], size, appContext)
                ),
              ),
            );
        }
    );
  }

  getElement(ResourceDTO resource, Size size, AppContext appContext) {
    if (resource.id != null) {
      return Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          Align(
            alignment: Alignment.center,
            child: AutoSizeText(
              resource.label == null ? "" : resource.label,
              style: new TextStyle(fontSize: 20),
              maxLines: 1,
            ),
          ),
          Container(
            height: size.height *0.08,
            child: Center(
              child: Image.network(
                  resource.type == ResourceType.image ? appContext.getContext().clientAPI.resourceApi.apiClient.basePath+"/api/Resource/"+ resource.id : "https://miro.medium.com/max/1920/1*8wFh-pEuwyAGa1IaKb-lEw.png",
                  fit:BoxFit.fill
              ),
            ),
          ),
          Align(
            alignment: Alignment.bottomRight,
            child: Icon(
              getResourceIcon(resource.type),
              color: kPrimaryColor,
              size: 25,
            ),
          ),
        ],
      );
    } else {
      return Icon(
        Icons.add,
        color: kTextLightColor,
        size: 80.0,
      );
    }
  }
}

boxDecoration(ResourceDTO resourceDTO) {
  return BoxDecoration(
    color: resourceDTO.id == null ? Colors.lightGreen : kTextLightColor,
    shape: BoxShape.rectangle,
    borderRadius: BorderRadius.circular(25.0),
    boxShadow: [
      BoxShadow(
        color: kSecond,
        spreadRadius: 0.5,
        blurRadius: 5,
        offset: Offset(0, 1.5), // changes position of shadow
      ),
    ],
  );
}

Future<List<ResourceDTO>> getResources(dynamic appContext) async {
  List<ResourceDTO> resources = await appContext.getContext().clientAPI.resourceApi.resourceGet();
  print(resources);
  return resources;
}