import 'package:manager_app/Components/rounded_input_field.dart';
import 'package:manager_app/constants.dart';
import 'package:manager_api_new/api.dart';
import 'package:flutter/material.dart';

class UploadOnlineResourceContainer extends StatefulWidget {
  final ResourceDTO resourceDTO;
  final ValueChanged<ResourceDTO> onChanged;
  const UploadOnlineResourceContainer({
    Key? key,
    required this.resourceDTO,
    required this.onChanged,
  }) : super(key: key);

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

class _UploadOnlineResourceContainerState extends State<UploadOnlineResourceContainer> with SingleTickerProviderStateMixin {
  String? urlResourceToShow;

  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    Size size = MediaQuery.of(context).size;
     //print(size.width);
    return displayElement(size);
  }

  showFile() {
    if (widget.resourceDTO.type == ResourceType.VideoUrl || widget.resourceDTO.type == ResourceType.Video) {
      return Column(
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          Padding(
            padding: const EdgeInsets.all(8.0),
            child: Text("La prévisualisation de la vidéo n'est pas disponible"),
          ),
          Icon(
            Icons.ondemand_video_sharp,
            size: 35,
          ),
        ],
      );
      /*return FutureBuilder(
          future: loadFile(urlResourceToShow),
          builder: (context, AsyncSnapshot<dynamic> snapshot) {
            if (snapshot.connectionState == ConnectionState.done) {
              return Container(
                  height: 300,
                  child: DartVLC(file: snapshot.data)
              );
            } else if (snapshot.connectionState == ConnectionState.none) {
              return Text("No data");
            } else {
              return Center(child: Container(height: 200, child: Text('LOADING TODO FRAISE')));
            }
          }
      );*/
      /*await Media.file(widget.file)*/
    } else {
      return Image.network(
          urlResourceToShow!,
          height: 150,
          fit:BoxFit.scaleDown,
          loadingBuilder: (BuildContext context, Widget child,
              ImageChunkEvent? loadingProgress) {
            if (loadingProgress == null) {
              return child;
            }
            return Center(
              child: CircularProgressIndicator(
                color: kPrimaryColor,
                value: loadingProgress.expectedTotalBytes != null
                    ? loadingProgress.cumulativeBytesLoaded /
                    loadingProgress.expectedTotalBytes!
                    : null,
              ),
            );
          },
      );
    }
  }

  /*loadFile(String urlResourceToShow) async {
    return await Media.network(urlResourceToShow);
  }*/

  displayElement(Size size) {
    return Column(
      children: [
        Center(
          child: Row(
            children: [
              Align(
                  alignment: AlignmentDirectional.center,
                  child: Text("URL:", style: TextStyle(fontSize: 25, fontWeight: FontWeight.w300))
              ),
              Padding(
                padding: const EdgeInsets.all(8.0),
                child: Container(
                  width: size.width *0.35, // TODO GET SIZE
                  child: RoundedInputField(
                    hintText: "Url de l'image, de la vidéo youtube ou du fichier json",
                    //icon: widget.resourceDTO.type == ResourceType.ImageUrl ? Icons.image : Icons.ondemand_video, // TODO: TBD
                    onChanged: (String text) {
                      widget.resourceDTO.url = text; // TODO check if ok
                      widget.onChanged(widget.resourceDTO);
                      widget.resourceDTO.type = _isYouTubeVideo(widget.resourceDTO.url!) ? ResourceType.VideoUrl : widget.resourceDTO.url!.endsWith("json") || widget.resourceDTO.url!.endsWith("php") ? ResourceType.JsonUrl : ResourceType.ImageUrl; // ou VideoUrl
                      print("URL OR NOOOOT  ?");
                      print(widget.resourceDTO.type);
                    },
                    initialValue: ""
                  ),
                ),
              ),
              InkWell(
                onTap: () {
                  //print("refresh preview");
                  setState(() {
                    urlResourceToShow = widget.resourceDTO.url;
                  });
                },
                child: Center(
                  child: Icon(
                    Icons.cloud_download_outlined,
                    color: kPrimaryColor,
                    size: 35,
                  ),
                ),
              )
            ],
          ),
        ),
        if(widget.resourceDTO.url != null) showFile()
      ],
    );
  }

  bool _isYouTubeVideo(String url) {
    RegExp regExp = RegExp(
        r'^https?://(?:www\.)?(?:youtube\.com/(?:[^/]+/[^/]+/|(?:v|e(?:mbed)?)\/|.*[?&]v=)|youtu\.be/)([^"&?/=%]{11})');

    return regExp.hasMatch(url);
  }


}