import 'package:diplomaticquarterapp/core/model/weahter/weather_model.dart';
import 'package:diplomaticquarterapp/core/viewModels/project_view_model.dart';
import 'package:diplomaticquarterapp/widgets/text/app_texts_widget.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

class WeatherSlider extends StatelessWidget {
  final GetCityInfoList data;

  final ProjectViewModel projectViewModel;

  WeatherSlider(this.data, this.projectViewModel);

  LinearGradient red = LinearGradient(colors: [Colors.redAccent[100], Colors.redAccent]);
  LinearGradient green = LinearGradient(colors: [Colors.greenAccent[100], Colors.greenAccent]);
  LinearGradient grey = LinearGradient(colors: [Colors.grey[100], Colors.grey]);
  LinearGradient orange = LinearGradient(colors: [Colors.orangeAccent[100], Colors.orange]);
  LinearGradient yellow = LinearGradient(colors: [Colors.yellow[100], Colors.yellow[600]]);

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Padding(padding: EdgeInsets.only(top: 10), child: AppText(data.name)),
        AppText(
          data.category,
          fontSize: 24,
        ),
        Padding(
          padding: EdgeInsets.all(10),
          child: Stack(
            children: [
              Container(
                margin: EdgeInsets.only(bottom: 10),
                decoration: BoxDecoration(gradient: LinearGradient(colors: [Colors.grey[100], Colors.grey[400]]), borderRadius: BorderRadius.circular(10)),
                height: 15,
                width: MediaQuery.of(context).size.width,
                child: SizedBox(),
              ),
              Positioned(
                  top: 0,
                  child: Container(
                    decoration: BoxDecoration(
                        gradient: data.colorName == 'red'
                            ? red
                            : data.colorName == 'orange'
                                ? orange
                                : data.colorName == 'green'
                                    ? green
                                    : data.colorName == 'yellow'
                                        ? yellow
                                        : grey,
                        borderRadius: BorderRadius.circular(10)),
                    height: 15,
                    width: (MediaQuery.of(context).size.width * (double.parse(data.value) / 10)),
                    padding: EdgeInsets.all(15),
                    child: SizedBox(),
                  )),
              projectViewModel.isArabic
                  ? Positioned(
                      child: Container(
                          height: 0,
                          width: 0,
                          decoration: ShapeDecoration(
                            color: data.colorName == 'red'
                                ? Colors.redAccent
                                : data.colorName == 'orange'
                                    ? Colors.orangeAccent
                                    : data.colorName == 'green'
                                        ? Colors.greenAccent
                                        : data.colorName == 'yellow'
                                            ? Colors.yellowAccent
                                            : Colors.grey,
                            shape: MessageBorder(),
                          )),
                      top: 25,
                      right: (MediaQuery.of(context).size.width * (double.parse(data.value) / 10)),
                    )
                  : Positioned(
                      child: Container(
                          height: 0,
                          width: 0,
                          decoration: ShapeDecoration(
                            color: data.colorName == 'red'
                                ? Colors.redAccent
                                : data.colorName == 'orange'
                                    ? Colors.orangeAccent
                                    : data.colorName == 'green'
                                        ? Colors.greenAccent
                                        : data.colorName == 'yellow'
                                            ? Colors.yellowAccent
                                            : Colors.grey,
                            shape: MessageBorder(),
                          )),
                      top: 25,
                      left: (MediaQuery.of(context).size.width * (double.parse(data.value) / 10)),
                    )
            ],
          ),
        ),
        Padding(
            padding: EdgeInsets.only(top: 10),
            child: data.isValuesReversed == false
                ? Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      AppText(data.categoriesNames.category1,
                          fontSize: 12,
                          color: data.categoriesNames.category1 == data.category && data.colorName == 'red'
                              ? Colors.redAccent
                              : data.categoriesNames.category1 == data.category && data.colorName == 'orange'
                                  ? Colors.orangeAccent
                                  : data.categoriesNames.category1 == data.category && data.colorName == 'green'
                                      ? Colors.greenAccent
                                      : data.categoriesNames.category1 == data.category && data.colorName == 'yellow'
                                          ? Colors.yellow[900]
                                          : Colors.black),
                      AppText(data.categoriesNames.category2,
                          fontSize: 12,
                          color: data.categoriesNames.category2 == data.category && data.colorName == 'red'
                              ? Colors.redAccent
                              : data.categoriesNames.category2 == data.category && data.colorName == 'orange'
                                  ? Colors.orangeAccent
                                  : data.categoriesNames.category2 == data.category && data.colorName == 'green'
                                      ? Colors.greenAccent
                                      : data.categoriesNames.category2 == data.category && data.colorName == 'yellow'
                                          ? Colors.yellow[900]
                                          : Colors.black),
                      AppText(data.categoriesNames.category3,
                          fontSize: 12,
                          color: data.categoriesNames.category3 == data.category && data.colorName == 'red'
                              ? Colors.redAccent
                              : data.categoriesNames.category3 == data.category && data.colorName == 'orange'
                                  ? Colors.orangeAccent
                                  : data.categoriesNames.category3 == data.category && data.colorName == 'green'
                                      ? Colors.greenAccent
                                      : data.categoriesNames.category3 == data.category && data.colorName == 'yellow'
                                          ? Colors.yellow[900]
                                          : Colors.black),
                      AppText(data.categoriesNames.category4,
                          fontSize: 12,
                          color: data.categoriesNames.category4 == data.category && data.colorName == 'red'
                              ? Colors.redAccent
                              : data.categoriesNames.category4 == data.category && data.colorName == 'orange'
                                  ? Colors.orangeAccent
                                  : data.categoriesNames.category4 == data.category && data.colorName == 'green'
                                      ? Colors.greenAccent
                                      : data.categoriesNames.category4 == data.category && data.colorName == 'yellow'
                                          ? Colors.yellow[900]
                                          : Colors.black),
                      AppText(data.categoriesNames.category5,
                          fontSize: 12,
                          color: data.categoriesNames.category5 == data.category && data.colorName == 'red'
                              ? Colors.redAccent
                              : data.categoriesNames.category5 == data.category && data.colorName == 'orange'
                                  ? Colors.orangeAccent
                                  : data.categoriesNames.category5 == data.category && data.colorName == 'green'
                                      ? Colors.greenAccent
                                      : data.categoriesNames.category5 == data.category && data.colorName == 'yellow'
                                          ? Colors.yellow[900]
                                          : Colors.black),
                    ],
                  )
                : Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      AppText(data.categoriesNames.category5,
                          fontSize: 12,
                          color: data.categoriesNames.category5 == data.category && data.colorName == 'red'
                              ? Colors.redAccent
                              : data.categoriesNames.category5 == data.category && data.colorName == 'orange'
                                  ? Colors.orangeAccent
                                  : data.categoriesNames.category5 == data.category && data.colorName == 'green'
                                      ? Colors.greenAccent
                                      : data.categoriesNames.category5 == data.category && data.colorName == 'yellow'
                                          ? Colors.yellow[900]
                                          : Colors.black),
                      AppText(data.categoriesNames.category4,
                          fontSize: 12,
                          color: data.categoriesNames.category4 == data.category && data.colorName == 'red'
                              ? Colors.redAccent
                              : data.categoriesNames.category4 == data.category && data.colorName == 'orange'
                                  ? Colors.orangeAccent
                                  : data.categoriesNames.category4 == data.category && data.colorName == 'green'
                                      ? Colors.greenAccent
                                      : data.categoriesNames.category4 == data.category && data.colorName == 'yellow'
                                          ? Colors.yellow[900]
                                          : Colors.black),
                      AppText(data.categoriesNames.category3,
                          fontSize: 12,
                          color: data.categoriesNames.category3 == data.category && data.colorName == 'red'
                              ? Colors.redAccent
                              : data.categoriesNames.category3 == data.category && data.colorName == 'orange'
                                  ? Colors.orangeAccent
                                  : data.categoriesNames.category3 == data.category && data.colorName == 'green'
                                      ? Colors.greenAccent
                                      : data.categoriesNames.category3 == data.category && data.colorName == 'yellow'
                                          ? Colors.yellow[900]
                                          : Colors.black),
                      AppText(data.categoriesNames.category2,
                          fontSize: 12,
                          color: data.categoriesNames.category2 == data.category && data.colorName == 'red'
                              ? Colors.redAccent
                              : data.categoriesNames.category2 == data.category && data.colorName == 'orange'
                                  ? Colors.orangeAccent
                                  : data.categoriesNames.category2 == data.category && data.colorName == 'green'
                                      ? Colors.greenAccent
                                      : data.categoriesNames.category2 == data.category && data.colorName == 'yellow'
                                          ? Colors.yellow[900]
                                          : Colors.black),
                      AppText(data.categoriesNames.category1,
                          fontSize: 12,
                          color: data.categoriesNames.category1 == data.category && data.colorName == 'red'
                              ? Colors.redAccent
                              : data.categoriesNames.category1 == data.category && data.colorName == 'orange'
                                  ? Colors.orangeAccent
                                  : data.categoriesNames.category1 == data.category && data.colorName == 'green'
                                      ? Colors.greenAccent
                                      : data.categoriesNames.category1 == data.category && data.colorName == 'yellow'
                                          ? Colors.yellow[900]
                                          : Colors.black),
                    ],
                  )),
        Padding(padding: EdgeInsets.all(15), child: Divider())
      ],
    );
  }
}

class MessageBorder extends ShapeBorder {
  final bool usePadding;
  final bool reverse;

  MessageBorder({this.usePadding = true, this.reverse = false});

  @override
  EdgeInsetsGeometry get dimensions => EdgeInsets.only(bottom: usePadding ? 0 : 0);

  @override
  Path getInnerPath(Rect rect, {TextDirection textDirection}) => null;

  @override
  Path getOuterPath(Rect rect, {TextDirection textDirection}) {
    rect = Rect.fromPoints(rect.bottomRight, rect.bottomLeft - Offset(0, 0));
    if (!reverse) {
      return Path()
        ..addRRect(RRect.fromRectAndRadius(rect, Radius.circular(rect.height / 2)))
        ..moveTo(rect.topCenter.dx - 10, rect.topCenter.dy)
        ..relativeLineTo(10, -10)
        ..relativeLineTo(10, 10)
        ..close();
    } else {
      return Path()
        ..addRRect(RRect.fromRectAndRadius(rect, Radius.circular(rect.height / 2)))
        ..moveTo(rect.topCenter.dx, rect.topCenter.dy)
        ..relativeLineTo(10, 20)
        ..relativeLineTo(20, -20)
        ..close();
    }
  }

  @override
  void paint(Canvas canvas, Rect rect, {TextDirection textDirection}) {}

  @override
  ShapeBorder scale(double t) => this;
}
