From 22fefb3a8b1b5c2d49ff827e765d0f9c26bb8977 Mon Sep 17 00:00:00 2001 From: Corey Woodworth Date: Mon, 17 Nov 2025 11:42:32 -0500 Subject: [PATCH] Refactor ColorsConvert.js --- Helpers/ColorsConvert.js | 41 +++++----------------------------- Widgets/NColorPickerDialog.qml | 28 +++++++++++------------ 2 files changed, 20 insertions(+), 49 deletions(-) diff --git a/Helpers/ColorsConvert.js b/Helpers/ColorsConvert.js index 8e727040..0e5eb7ae 100644 --- a/Helpers/ColorsConvert.js +++ b/Helpers/ColorsConvert.js @@ -1,37 +1,8 @@ // Convert hex color to HSL function hexToHSL(hex) { - const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex); - if (!result) return null; - - let r = parseInt(result[1], 16) / 255; - let g = parseInt(result[2], 16) / 255; - let b = parseInt(result[3], 16) / 255; - - const max = Math.max(r, g, b); - const min = Math.min(r, g, b); - let h, - s, - l = (max + min) / 2; - - if (max === min) { - h = s = 0; - } else { - const d = max - min; - s = l > 0.5 ? d / (2 - max - min) : d / (max + min); - switch (max) { - case r: - h = ((g - b) / d + (g < b ? 6 : 0)) / 6; - break; - case g: - h = ((b - r) / d + 2) / 6; - break; - case b: - h = ((r - g) / d + 4) / 6; - break; - } - } - - return { h: h * 360, s: s * 100, l: l * 100 }; + const rgb = hexToRgb(hex); + if (!rgb) return null; + return rgbToHsl(rgb.r, rgb.g, rgb.b); } // Convert HSL to hex color @@ -112,7 +83,7 @@ function hslToRgb(h, s, l) { b = hue2rgb(p, q, h - 1/3); } - return { r: r * 255, g: g * 255, b: b * 255 }; + return { r: Math.round(r * 255), g: Math.round(g * 255), b: Math.round(b * 255) }; } // Convert RGB to HSV @@ -140,7 +111,7 @@ function rgbToHsv(r, g, b) { } h /= 6; } - return [h * 360, s * 100, v * 100]; + return { h: h * 360, s: s * 100, v: v * 100 }; } // Convert HSV to RGB @@ -189,7 +160,7 @@ function hsvToRgb(h, s, v) { break; } - return [Math.round(r * 255), Math.round(g * 255), Math.round(b * 255)]; + return { r: Math.round(r * 255), g: Math.round(g * 255), b: Math.round(b * 255) }; } // Calculate relative luminance (WCAG standard) diff --git a/Widgets/NColorPickerDialog.qml b/Widgets/NColorPickerDialog.qml index eacc9ec0..0db44571 100644 --- a/Widgets/NColorPickerDialog.qml +++ b/Widgets/NColorPickerDialog.qml @@ -175,8 +175,8 @@ Popup { onMoved: value => { root.selectedColor = Qt.rgba(value / 255, root.selectedColor.g, root.selectedColor.b, 1); var hsv = ColorsConvert.rgbToHsv(root.selectedColor.r * 255, root.selectedColor.g * 255, root.selectedColor.b * 255); - root.currentHue = hsv[0]; - root.currentSaturation = hsv[1]; + root.currentHue = hsv.h; + root.currentSaturation = hsv.s; } text: Math.round(value) } @@ -202,8 +202,8 @@ Popup { root.selectedColor = Qt.rgba(root.selectedColor.r, value / 255, root.selectedColor.b, 1); // Update stored hue and saturation when RGB changes var hsv = ColorsConvert.rgbToHsv(root.selectedColor.r * 255, root.selectedColor.g * 255, root.selectedColor.b * 255); - root.currentHue = hsv[0]; - root.currentSaturation = hsv[1]; + root.currentHue = hsv.h; + root.currentSaturation = hsv.s; } text: Math.round(value) } @@ -229,8 +229,8 @@ Popup { root.selectedColor = Qt.rgba(root.selectedColor.r, root.selectedColor.g, value / 255, 1); // Update stored hue and saturation when RGB changes var hsv = ColorsConvert.rgbToHsv(root.selectedColor.r * 255, root.selectedColor.g * 255, root.selectedColor.b * 255); - root.currentHue = hsv[0]; - root.currentSaturation = hsv[1]; + root.currentHue = hsv.h; + root.currentSaturation = hsv.s; } text: Math.round(value) } @@ -253,7 +253,7 @@ Popup { to: 100 value: { var hsv = ColorsConvert.rgbToHsv(root.selectedColor.r * 255, root.selectedColor.g * 255, root.selectedColor.b * 255); - return hsv[2]; + return hsv.v; } onMoved: value => { var hue = root.currentHue; @@ -261,14 +261,14 @@ Popup { if (hue === 0 && saturation === 0) { var hsv = ColorsConvert.rgbToHsv(root.selectedColor.r * 255, root.selectedColor.g * 255, root.selectedColor.b * 255); - hue = hsv[0]; - saturation = hsv[1]; + hue = hsv.h; + saturation = hsv.s; root.currentHue = hue; root.currentSaturation = saturation; } var rgb = ColorsConvert.hsvToRgb(hue, saturation, value); - root.selectedColor = Qt.rgba(rgb[0] / 255, rgb[1] / 255, rgb[2] / 255, 1); + root.selectedColor = Qt.rgba(rgb.r / 255, rgb.g / 255, rgb.b / 255, 1); } text: Math.round(brightnessSlider.value) + "%" } @@ -314,8 +314,8 @@ Popup { onClicked: { root.selectedColor = modelData; var hsv = ColorsConvert.rgbToHsv(root.selectedColor.r * 255, root.selectedColor.g * 255, root.selectedColor.b * 255); - root.currentHue = hsv[0]; - root.currentSaturation = hsv[1]; + root.currentHue = hsv.h; + root.currentSaturation = hsv.s; } } } @@ -364,8 +364,8 @@ Popup { onClicked: { root.selectedColor = modelData; var hsv = ColorsConvert.rgbToHsv(root.selectedColor.r * 255, root.selectedColor.g * 255, root.selectedColor.b * 255); - root.currentHue = hsv[0]; - root.currentSaturation = hsv[1]; + root.currentHue = hsv.h; + root.currentSaturation = hsv.s; } } }