Initial cleanup push.

Based on agldemo2024 on commit 2a5dc04d801134338150c3f6afc67eaa65599763

Disable device preview.

Disable Lottie animation.

The original commit was b3c493c340fcb4bb0a937692838fc830bec3e9ea
but I am just keeping this change, because the json did not really
needed to change. I think.

Signed-off-by: Lisandro Pérez Meyer <lpmeyer@ics.com>

1 files changed, 251 insertions, 0 deletions

diff --git a/lib/presentation/screens/hvac/widgets/fan_speed_controls.dart b/lib/presentation/screens/hvac/widgets/fan_speed_controls.dart
new file mode 100644
index 0000000..00f1181
--- /dev/null
+++ b/lib/presentation/screens/hvac/widgets/fan_speed_controls.dart
@@ -0,0 +1,251 @@
+import 'package:flutter_ics_homescreen/export.dart';
+import 'package:gradient_borders/gradient_borders.dart';
+import 'package:rive/rive.dart' as rive;
+
+class FanSpeedControls extends ConsumerStatefulWidget {
+  const FanSpeedControls({super.key});
+
+  @override
+  FanSpeedControlsState createState() => FanSpeedControlsState();
+}
+
+class FanSpeedControlsState extends ConsumerState<FanSpeedControls>
+    with TickerProviderStateMixin {
+  bool isPressed = false;
+  LinearGradient gradientEnable1 = const LinearGradient(colors: <Color>[
+    Color(0xFF2962FF),
+    Color(0x802962FF),
+  ]);
+  LinearGradient gradientEnable2 = const LinearGradient(colors: <Color>[
+    Color(0xFF1A237E),
+    Color(0xFF141F64),
+  ]);
+  bool isMainACSelected = false;
+  late AnimationController animationController;
+  double controlProgress = 0.0;
+  int selectedFanSpeed = 0;
+  late rive.RiveAnimationController _controller;
+
+  bool _isPlaying = false;
+
+  /// Tracks if the animation is playing by whether controller is running
+  bool get isPlaying => _controller.isActive;
+
+  @override
+  void initState() {
+    super.initState();
+    _controller = rive.OneShotAnimation(
+      'Fan Spin',
+      autoplay: false,
+      onStop: () => setState(() => _isPlaying = false),
+      onStart: () => setState(() => _isPlaying = true),
+    );
+    animationController = AnimationController(
+      vsync: this,
+      duration: const Duration(seconds: 1),
+    );
+
+    animationController.addListener(() {
+      setState(() {
+        // _currentColorIndex = (_currentColorIndex + 1) % colorsList.length;
+      }); // Trigger a rebuild to repaint the CustomPaint
+    });
+    animationController.forward();
+  }
+
+  @override
+  void dispose() {
+    animationController.dispose();
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    double size = MediaQuery.sizeOf(context).height * 0.13021;
+    double fanSpeedWidth = MediaQuery.sizeOf(context).width * 0.35;
+    double fanSpeedHeight = MediaQuery.sizeOf(context).height * 0.15;
+    double strokeWidth = MediaQuery.sizeOf(context).height * 0.03;
+
+    double iconSize = 80;
+
+    final vehicle = ref.watch(vehicleProvider.select((vehicle) => vehicle));
+    selectedFanSpeed = vehicle.fanSpeed;
+    controlProgress = selectedFanSpeed * 0.3;
+
+    return Stack(
+      children: [
+        Center(
+          child: CustomPaint(
+            size: Size(
+                fanSpeedWidth, fanSpeedHeight), // Set the desired size here
+            painter: AnimatedColorPainter(
+              animationController,
+              controlProgress,
+              AGLDemoColors.blueGlowFillColor,
+              AGLDemoColors.backgroundInsetColor,
+              strokeWidth,
+            ),
+          ),
+        ),
+        Center(
+            child: Container(
+          margin: const EdgeInsets.only(top: 3),
+          // decoration: BoxDecoration(
+          //   shape: BoxShape.circle,
+          //   gradient: LinearGradient(
+          //       colors: !isMainACSelected
+          //           ? [
+          //               AGLDemoColors.neonBlueColor,
+          //               AGLDemoColors.neonBlueColor.withOpacity(0.2)
+          //             ]
+          //           : [
+          //               const Color.fromARGB(255, 255, 193, 193)
+          //                   .withOpacity(0.2),
+          //               const Color.fromARGB(255, 255, 193, 193)
+          //             ]),
+          //   boxShadow: isMainACSelected
+          //       ? [
+          //           BoxShadow(
+          //               offset: Offset(
+          //                   isMainACSelected ? 1 : 1, isMainACSelected ? 2 : 2),
+          //               blurRadius: isMainACSelected ? 16 : 16,
+          //               spreadRadius: 0,
+          //               color: isMainACSelected
+          //                   ? Colors.black.withOpacity(0.5)
+          //                   : Colors.black)
+          //         ]
+          //       : [],
+          // ),
+          //border: Border.all(color: Colors.white12, width: 1)),
+          //width: 90,
+          //height: 90,
+          child: Container(
+            margin: const EdgeInsets.all(1),
+            decoration: BoxDecoration(
+              shape: BoxShape.circle,
+              image: const DecorationImage(
+                image: AssetImage("assets/PlusVector.png"),
+              ),
+              gradient: Gradient.lerp(gradientEnable1, gradientEnable2, 0.5),
+              // border: Border.all(
+              //     color: isMainACSelected
+              //         ? AGLDemoColors.buttonFillEnabledColor
+              //         : Colors.white12,
+              //     width: isMainACSelected ? 3 : 1),
+              border: const GradientBoxBorder(
+                width: 2,
+                gradient: LinearGradient(
+                  colors: [
+                    Color(0x30C1D8FF),
+                    Color(0xFFC1D8FF),
+                  ],
+                ),
+              ),
+            ),
+            alignment: Alignment.center,
+            child: Material(
+              color: Colors.transparent,
+              child: InkWell(
+                  splashColor: Colors.transparent,
+                  hoverColor: Colors.transparent,
+                  highlightColor: Colors.transparent,
+                  customBorder: const CircleBorder(),
+                  onTap: () {
+                    _isPlaying ? null : _controller.isActive = true;
+                    setState(() {
+                      if (controlProgress >= 0.80) {
+                        controlProgress = 0.0;
+                        isMainACSelected = false;
+                        animationController.reverse();
+                      } else {
+                        isMainACSelected = true;
+                        _controller.isActive = true;
+                        _isPlaying = true;
+                        controlProgress += 0.30;
+                        animationController.forward();
+                      }
+                      ref
+                          .read(vehicleProvider.notifier)
+                          .updateFanSpeed(controlProgress ~/ 0.3);
+
+                      // isMainACSelected = !isMainACSelected;
+                      // if (controlProgress != 0.0) {
+                      //   previousProgress = controlProgress;
+                      // }
+                      // if (isMainACSelected) {
+                      //   controlProgress = previousProgress;
+                      //   animationController.forward();
+                      // } else {
+                      //   controlProgress = 0.0;
+                      //   animationController.reverse();
+                      // }
+                    });
+                  },
+                  onTapDown: (details) {
+                    setState(() {
+                      gradientEnable1 = LinearGradient(colors: <Color>[
+                        const Color(0xFF2962FF).withOpacity(0.15),
+                        const Color(0x802962FF).withOpacity(0.15),
+                      ]);
+                      gradientEnable2 = const LinearGradient(colors: <Color>[
+                        Color(0xFF1A237E),
+                        Color(0xFF1C2D92),
+                      ]);
+                    });
+                    //change style
+                  },
+                  onTapUp: (details) {
+                    setState(() {
+                      gradientEnable1 = const LinearGradient(colors: <Color>[
+                        Color(0xFF2962FF),
+                        Color(0x802962FF),
+                      ]);
+                      gradientEnable2 = const LinearGradient(colors: <Color>[
+                        Color(0xFF1A237E),
+                        Color(0xFF141F64),
+                      ]);
+                    });
+                  },
+                  child: Container(
+                      width: size,
+                      height: size,
+                      alignment: Alignment.center,
+                      child: !_isPlaying && controlProgress == 0.0
+                          ? SvgPicture.asset(
+                              "assets/ACMainButtonOff.svg",
+                              width: iconSize,
+                              height: iconSize,
+                            )
+                          // : !_isPlaying && controlProgress > 0.8
+                          //     ? SvgPicture.asset(
+                          //         "assets/ACMainButton.svg",
+                          //         width: iconSize,
+                          //         height: iconSize,
+                          //       )
+                          : SizedBox(
+                              width: iconSize,
+                              height: iconSize,
+                              child: rive.RiveAnimation.asset(
+                                  'assets/new_file.riv',
+                                  controllers: [_controller],
+                                  onInit: (_) => setState(() {
+                                        _controller.isActive = true;
+                                      }))))
+                  // Container(
+                  //   width: size,
+                  //   height: size,
+                  //   alignment: Alignment.center,
+                  //   child: SvgPicture.asset(
+                  //     "assets/ACMainButton.svg",
+                  //     width: iconSize,
+                  //     height: iconSize,
+                  //   ),
+                  // ),
+                  ),
+            ),
+          ),
+        ))
+      ],
+    );
+  }
+}