Check in the fan curve work

rog-control-center/ui/main_window.slint

@@ -3,8 +3,7 @@ import { AppSize } from "globals.slint";
 import { PageSystem, AvailableSystemProperties, SystemPageData } from "pages/system.slint";
 import { SideBar } from "widgets/sidebar.slint";
 import { PageAbout } from "pages/about.slint";
-import { PageFans, Node } from "pages/fans.slint";
+import { PageFans } from "pages/fans.slint";
-export { Node }
 import { PageAnime, AnimePageData } from "pages/anime.slint";
 import { PageAura } from "pages/aura.slint";
 import { AuraPageData, AuraDevType, AuraDevTuf, AuraDevRog1, PowerZones, KbAuraPowerState, AuraPowerDev, AuraEffect } from "types/aura_types.slint";
@@ -36,7 +35,6 @@ export component MainWindow inherits Window {
         aura.external_colour_change();
         aura.external_colour_change();
     }
-    pure callback verify_fan_curves([Node], length, length) -> [Node];
     min-height: AppSize.height;
     min-width: AppSize.width;
     background: Colors.black;

rog-control-center/ui/pages/fans.slint

@@ -1,53 +1,154 @@
-import { Palette } from "std-widgets.slint";
+import { Palette, TabWidget, Button, CheckBox } from "std-widgets.slint";
-import { Graph } from "../widgets/graph.slint";
+import { Graph, Node } from "../widgets/graph.slint";
+import { SystemToggle } from "../widgets/common.slint";
+import { Profile, FanType, FanPageData } from "../types/fan_types.slint";
 
-export struct Node { x: length, y: length}
+component FanTab inherits Rectangle {
+    in-out property <bool> enabled: false;
+    in-out property <bool> tab_enabled: false;
+    in property <Profile> profile;
+    in property <FanType> fan_type;
+    callback apply();
+    callback cancel();
+    callback default();
+    callback toggled();
+    in property <string> title;
+    in-out property <[Node]> nodes;
 
-export component PageFans inherits VerticalLayout {
+    if !root.tab_enabled: VerticalLayout {
-    in-out property <[Node]> nodes: [
+        alignment: center;
-        {
+        HorizontalLayout {
-            x: 10px,
+            alignment: center;
-            y: 10px,
-        },
-        {
-            x: 40px,
-            y: 30px,
-        },
-        {
-            x: 70px,
-            y: 50px,
-        },
-        {
-            x: 100px,
-            y: 70px,
-        },
-        {
-            x: 130px,
-            y: 90px,
-        },
-        {
-            x: 160px,
-            y: 110px,
-        },
-        {
-            x: 190px,
-            y: 130px,
-        },
-        {
-            x: 220px,
-            y: 150px,
-        },
-    ];
             Text {
-        text: "WORK IN PROGRESS";
+                font-size: 24px;
+                text: "WIP: Not enabled yet";
+            }
+        }
+    }
+
+    VerticalLayout {
+        HorizontalLayout {
+            Graph {
+                nodes <=> root.nodes;
+            }
         }
 
         HorizontalLayout {
-        Graph {
+            alignment: LayoutAlignment.end;
-            // width: root.preferred-width;
+            CheckBox {
-        // height: root.preferred-height;
+                text: @tr("Enabled");
-        nodes <=> root.nodes;
+                checked <=> root.enabled;
+                enabled <=> root.tab_enabled;
+                toggled => {
+                    root.toggled();
+                }
+            }
 
+            Button {
+                text: @tr("Apply");
+                enabled <=> root.tab_enabled;
+                clicked => {
+                    root.apply();
+                }
+            }
+
+            Button {
+                text: @tr("Cancel");
+                enabled <=> root.tab_enabled;
+                clicked => {
+                    root.cancel()
+                }
+            }
+
+            Button {
+                text: @tr("Factory Default");
+                enabled <=> root.tab_enabled;
+                clicked => {
+                    root.default();
+                }
+            }
+        }
+    }
+}
+
+export component PageFans inherits VerticalLayout {
+    TabWidget {
+        Tab {
+            title: @tr("Balanced");
+            TabWidget {
+                Tab {
+                    title: @tr("CPU");
+                    FanTab {
+                        nodes <=> FanPageData.balanced_cpu;
+                    }
+                }
+
+                Tab {
+                    title: @tr("Mid");
+                    FanTab {
+                        nodes <=> FanPageData.balanced_mid;
+                    }
+                }
+
+                Tab {
+                    title: @tr("GPU");
+                    FanTab {
+                        nodes <=> FanPageData.balanced_gpu;
+                    }
+                }
+            }
+        }
+
+        Tab {
+            title: @tr("Performance");
+            TabWidget {
+                Tab {
+                    title: @tr("CPU");
+                    FanTab {
+                        nodes <=> FanPageData.performance_cpu;
+                    }
+                }
+
+                Tab {
+                    title: @tr("Mid");
+                    FanTab {
+                        nodes <=> FanPageData.performance_mid;
+                    }
+                }
+
+                Tab {
+                    title: @tr("GPU");
+                    FanTab {
+                        nodes <=> FanPageData.performance_gpu;
+                    }
+                }
+            }
+        }
+
+        Tab {
+            title: @tr("Quiet");
+            TabWidget {
+                Tab {
+                    title: @tr("CPU");
+                    FanTab {
+                        nodes <=> FanPageData.quiet_cpu;
+                    }
+                }
+
+                Tab {
+                    title: @tr("Mid");
+                    FanTab {
+                        nodes <=> FanPageData.quiet_mid;
+                    }
+                }
+
+                Tab {
+                    title: @tr("GPU");
+                    FanTab {
+                        nodes <=> FanPageData.quiet_gpu;
+                    }
+                }
+            }
         }
     }
 }

rog-control-center/ui/widgets/aura_power.slint

@@ -22,7 +22,6 @@ export component AuraPowerGroup inherits Rectangle {
             color: Palette.alternate-foreground;
             horizontal-alignment: TextHorizontalAlignment.center;
             text <=> root.group-title;
-        
         }
 
         row := HorizontalBox {

rog-control-center/ui/widgets/colour_picker.slint

@@ -4,8 +4,8 @@ export component ColourSlider inherits VerticalLayout {
     spacing: 10px;
     in-out property <bool> enabled;
     property <string> hex: "#FF0000";
-    in-out property <float> c1value<=> c1.value;
+    in-out property <float> c1value <=> c1.value;
-    in-out property <float> c2value<=> c2.value;
+    in-out property <float> c2value <=> c2.value;
     property <color> base_colour: Colors.red;
     in-out property <color> final_colour: Colors.red;
     in-out property <brush> colourbox: final_colour;
@@ -151,7 +151,6 @@ export component ColourSlider inherits VerticalLayout {
             border-radius: 7px;
             border-color: Palette.border;
             background <=> root.colourbox;
-        
         }
     }
 }

rog-control-center/ui/widgets/common.slint

@@ -24,7 +24,6 @@ export component SystemSlider inherits RogItem {
                 vertical-alignment: TextVerticalAlignment.center;
                 color: Palette.control-foreground;
                 text <=> root.text;
-            
             }
 
             Text {
@@ -63,7 +62,6 @@ export component SystemToggle inherits RogItem {
                 vertical-alignment: TextVerticalAlignment.center;
                 color: Palette.control-foreground;
                 text <=> root.text;
-            
             }
         }
 
@@ -94,7 +92,6 @@ export component SystemToggleVert inherits RogItem {
             horizontal-alignment: TextHorizontalAlignment.center;
             color: Palette.control-foreground;
             text <=> root.text;
-        
         }
 
         HorizontalLayout {
@@ -125,7 +122,6 @@ export component SystemDropdown inherits RogItem {
                 vertical-alignment: TextVerticalAlignment.center;
                 color: Palette.control-foreground;
                 text <=> root.text;
-            
             }
         }
 

rog-control-center/ui/widgets/graph.slint

@@ -3,25 +3,37 @@ import { Palette } from "std-widgets.slint";
 export struct Node { x: length, y: length}
 
 export component Graph inherits Rectangle {
-    preferred-height: 100%;
-    preferred-width: 100%;
-    pure callback verify_positions([Node], length, length) -> [Node];
     in-out property <[Node]> nodes;
-
+    in property <Node> node_min: { x: 0px, y: 0px };
-    for l[idx] in nodes: path := Rectangle {
+    in property <Node> node_max: { x: 100px, y: 100px };
+    property <length> graph_padding: 20px;
+    graph := Rectangle {
+        width: root.width - root.graph_padding * 2;
+        height: root.height - root.graph_padding * 2;
+        x: root.graph_padding;
+        y: root.graph_padding;
+        function scale_x_to_graph(x: length) -> length {
+            ((x - node_min.x) / (node_max.x - node_min.x)) * graph.width
+        }function scale_y_to_graph(y: length) -> length {
+            ((y - node_min.y) / (node_max.y - node_min.y)) * graph.height
+        }function scale_x_to_node(x: length) -> length {
+            (x / graph.width) * (node_max.x - node_min.x)
+        }function scale_y_to_node(y: length) -> length {
+            (y / graph.height) * (node_max.y - node_min.y)
+        }for l[idx] in nodes: path := Rectangle {
             if idx + 1 != nodes.length: Path {
                 viewbox-width: self.width / 1px;
                 viewbox-height: self.height / 1px;
                 stroke: Palette.control-foreground;
                 stroke-width: 2px;
                 MoveTo {
-                x: nodes[idx].x / 1px;
+                    x: scale_x_to_graph(nodes[idx].x) / 1px;
-                y: root.height / 1px - nodes[idx].y / 1px;
+                    y: graph.height / 1px - scale_y_to_graph(nodes[idx].y) / 1px;
                 }
 
                 LineTo {
-                x: nodes[idx + 1].x / 1px;
+                    x: scale_x_to_graph(nodes[idx + 1].x) / 1px;
-                y: root.height / 1px - nodes[idx + 1].y / 1px;
+                    y: graph.height / 1px - scale_y_to_graph(nodes[idx + 1].y) / 1px;
                 }
             }
         }
@@ -36,56 +48,56 @@ export component Graph inherits Rectangle {
                 }
             ]state := Rectangle {
                 background: Palette.control-foreground;
-            x: n.x - self.width / 2;
+                x: scale_x_to_graph(n.x) - self.width / 2;
-            y: root.height - n.y - self.height / 2;
+                y: graph.height - scale_y_to_graph(n.y) - self.height / 2;
                 width: 18px;
                 height: self.width;
                 border-radius: self.width / 2;
-            property <length> pad: self.border-radius / 2;
+                property <length> pad: 1px;
 
                 touch := TouchArea {
                     function check() {
                         if idx + 1 < nodes.length && idx > 0 {
-                        if n.x + self.mouse-x - self.pressed-x > nodes[idx + 1].x {
+                            if n.x + scale_x_to_node(self.mouse-x - self.pressed-x) > nodes[idx + 1].x {
                                 n.x = nodes[idx + 1].x - pad;
-                        } else if n.x + self.mouse-x - self.pressed-x < nodes[idx - 1].x {
+                            } else if n.x + scale_x_to_node(self.mouse-x - self.pressed-x) < nodes[idx - 1].x {
                                 n.x = nodes[idx - 1].x + pad;
                             }
 
-                        if n.y + self.height - self.mouse-y - self.pressed-y > nodes[idx + 1].y {
+                            if n.y + scale_y_to_node(self.height - self.mouse-y - self.pressed-y) > nodes[idx + 1].y {
                                 n.y = nodes[idx + 1].y - pad;
-                        } else if n.y + self.height - self.mouse-y - self.pressed-y < nodes[idx - 1].y {
+                            } else if n.y + scale_y_to_node(self.height - self.mouse-y - self.pressed-y) < nodes[idx - 1].y {
                                 n.y = nodes[idx - 1].y + pad;
                             }
                         } else if idx == 0 {
-                        if n.x + self.mouse-x - self.pressed-x < 0.0 {
+                            if n.x + scale_x_to_node(self.mouse-x - self.pressed-x) < 0.0 {
                                 n.x = 1px;
-                        } else if n.x + self.mouse-x - self.pressed-x > nodes[idx + 1].x {
+                            } else if n.x + scale_x_to_node(self.mouse-x - self.pressed-x) > nodes[idx + 1].x {
                                 n.x = nodes[idx + 1].x - pad;
                             }
 
-                        if n.y - self.mouse-y - self.pressed-y < 0.0 {
+                            if n.y - scale_y_to_node(self.mouse-y - self.pressed-y) < 0.0 {
                                 n.y = 1px;
-                        } else if n.y + self.height - self.mouse-y - self.pressed-y > nodes[idx + 1].y {
+                            } else if n.y + scale_y_to_node(self.height - self.mouse-y - self.pressed-y) > nodes[idx + 1].y {
                                 n.y = nodes[idx + 1].y - pad;
                             }
                         } else if idx == nodes.length - 1 {
-                        if n.x + self.mouse-x - self.pressed-x > root.width {
+                            if n.x + scale_x_to_node(self.mouse-x - self.pressed-x) > scale_x_to_node(graph.width) {
-                            n.x = root.width - 1px;
+                                n.x = scale_x_to_node(graph.width - 1px);
-                        } else if n.x + self.mouse-x - self.pressed-x < nodes[idx - 1].x {
+                            } else if n.x + scale_x_to_node(self.mouse-x - self.pressed-x) < nodes[idx - 1].x {
                                 n.x = nodes[idx - 1].x + pad;
                             }
 
-                        if n.y - self.mouse-y - self.pressed-y > root.height {
+                            if n.y - scale_y_to_node(self.mouse-y - self.pressed-y) > scale_y_to_node(graph.height) {
-                            n.y = root.height - 1px;
+                                n.y = scale_y_to_node(graph.height - 1px);
-                        } else if n.y + self.height - self.mouse-y - self.pressed-y < nodes[idx - 1].y {
+                            } else if n.y + scale_y_to_node(self.height - self.mouse-y - self.pressed-y) < nodes[idx - 1].y {
                                 n.y = nodes[idx - 1].y + pad;
                             }
                         }
                     }moved => {
                         if (self.pressed) {
-                        n.x += self.mouse-x - self.pressed-x;
+                            n.x += scale_x_to_node(self.mouse-x - self.pressed-x);
-                        n.y -= self.mouse-y - self.pressed-y;
+                            n.y -= scale_y_to_node(self.mouse-y - self.pressed-y);
                             self.check();
                             // nodes[idx] = n;
                     }
@@ -98,4 +110,5 @@ export component Graph inherits Rectangle {
                 }
             }
         }
+    }
 }

rog-control-center/ui/widgets/sidebar.slint

@@ -7,8 +7,8 @@ component SideBarItem inherits Rectangle {
     padding: 10px;
     in property <bool> selected;
     in property <bool> has-focus;
-    in-out property <string> text<=> label.text;
+    in-out property <string> text <=> label.text;
-    callback clicked<=>touch.clicked;
+    callback clicked <=> touch.clicked;
     min-height: self.visible ? l.preferred-height + 10px : 0px;
     // min-width: self.visible ? l.preferred-width + 10px : 0px;
     states [
@@ -54,7 +54,7 @@ component SideBarItem inherits Rectangle {
 export component SideBar inherits Rectangle {
     in property <[string]> model: [];
     in property <[bool]> available: [];
-    in property <string> title<=> label.text;
+    in property <string> title <=> label.text;
     out property <int> current-item: 0;
     out property <int> current-focused: fs.has-focus ? fs.focused-tab : -1;
     // The currently focused tab