Refactor ColorsConvert.js

This commit is contained in:
Corey Woodworth
2025-11-17 11:42:32 -05:00
parent c223737fd7
commit 22fefb3a8b
2 changed files with 20 additions and 49 deletions

View File

@@ -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)

View File

@@ -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;
}
}
}