From f4fbe3b64f39ae557d949e295e465605b82355fe Mon Sep 17 00:00:00 2001
From: lstrsrt <79076531+lstrsrt@users.noreply.github.com>
Date: Thu, 20 Mar 2025 14:58:14 +0100
Subject: [PATCH] =?UTF-8?q?=F0=9F=92=84=20Add=20hue=20preview=20circle=20t?=
 =?UTF-8?q?o=20Aura=20Glow=20preferences?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 resources/ui/adw/aura-glow.ui | 13 ++++++++++--
 src/effects/AuraGlow.js       | 25 ++++++++++++++++++++++
 src/utils.js                  | 39 +++++++++++++++++++++++++++++++++++
 3 files changed, 75 insertions(+), 2 deletions(-)

diff --git a/resources/ui/adw/aura-glow.ui b/resources/ui/adw/aura-glow.ui
index aec39ab..32a195f 100644
--- a/resources/ui/adw/aura-glow.ui
+++ b/resources/ui/adw/aura-glow.ui
@@ -67,7 +67,16 @@ SPDX-License-Identifier: GPL-3.0-or-later
     <child>
       <object class="AdwActionRow" id="aura-glow-action-row">
         <property name="title" translatable="yes">Start Hue</property>
-
+        <child>
+          <object class="GtkDrawingArea" id="aura-glow-hue-preview">
+            <property name="valign">3</property>
+            <property name="halign">2</property>
+            <property name="hexpand">true</property>
+            <property name="vexpand">true</property>
+            <property name="height-request">16</property>
+            <property name="width-request">16</property>
+          </object>
+        </child>
         <child>
           <object class="GtkScale" id="aura-glow-start-hue-slider">
             <property name="valign">center</property>
@@ -135,7 +144,7 @@ SPDX-License-Identifier: GPL-3.0-or-later
       <object class="AdwActionRow">
         <property name="title" translatable="yes">Saturation</property>
         <child>
-          <object class="GtkScale">
+          <object class="GtkScale" id="aura-glow-saturation-slider">
             <property name="valign">center</property>
             <property name="draw-value">1</property>
             <property name="digits">2</property>
diff --git a/src/effects/AuraGlow.js b/src/effects/AuraGlow.js
index 3ebf3b4..ca50270 100644
--- a/src/effects/AuraGlow.js
+++ b/src/effects/AuraGlow.js
@@ -103,6 +103,31 @@ export default class Effect {
     dialog.bindAdjustment('aura-glow-edge-hardness');
     dialog.bindAdjustment('aura-glow-blur');
 
+    dialog.getBuilder()
+      .get_object('aura-glow-hue-preview')
+      .set_draw_func((area, cairo) => {
+        const hueScale = dialog.getBuilder().get_object('aura-glow-start-hue-slider');
+        const satScale = dialog.getBuilder().get_object('aura-glow-saturation-slider');
+        const color    = utils.hsvToRgb(hueScale.get_value(), satScale.get_value(), 1);
+        const height   = area.get_allocated_height();
+        const width    = area.get_allocated_width();
+        cairo.setSourceRGB(color.r, color.g, color.b);
+        cairo.arc(width / 2, height / 2, width / 2, 0.0, 2 * Math.PI);
+        cairo.fill();
+    });
+
+    function redrawHuePreview() {
+      dialog.getBuilder().get_object('aura-glow-hue-preview').queue_draw();
+    }
+
+    dialog.getBuilder()
+      .get_object('aura-glow-start-hue-slider')
+      .connect('value-changed', redrawHuePreview);
+
+    dialog.getBuilder()
+      .get_object('aura-glow-saturation-slider')
+      .connect('value-changed', redrawHuePreview);
+
     // enable and disable the one slider
     function enableDisablePref(dialog, state) {
       dialog.getBuilder().get_object('aura-glow-start-hue-slider').set_sensitive(!state);
diff --git a/src/utils.js b/src/utils.js
index c136cf5..df03b4d 100644
--- a/src/utils.js
+++ b/src/utils.js
@@ -195,3 +195,42 @@ export function parseColor(string) {
 
   return [color.red / 255, color.green / 255, color.blue / 255, color.alpha / 255];
 }
+
+// Converts a color in hsv space into rgb.
+// https://stackoverflow.com/a/17243070
+export function hsvToRgb(h, s, v) {
+  var r, g, b, i, f, p, q, t;
+  if (arguments.length === 1) {
+    (s = h.s), (v = h.v), (h = h.h);
+  }
+  i = Math.floor(h * 6);
+  f = h * 6 - i;
+  p = v * (1 - s);
+  q = v * (1 - f * s);
+  t = v * (1 - (1 - f) * s);
+  switch (i % 6) {
+    case 0:
+      (r = v), (g = t), (b = p);
+      break;
+    case 1:
+      (r = q), (g = v), (b = p);
+      break;
+    case 2:
+      (r = p), (g = v), (b = t);
+      break;
+    case 3:
+      (r = p), (g = q), (b = v);
+      break;
+    case 4:
+      (r = t), (g = p), (b = v);
+      break;
+    case 5:
+      (r = v), (g = p), (b = q);
+      break;
+  }
+  return {
+    r,
+    g,
+    b,
+  };
+}