diff --git a/vendor-overwrites/colorpicker/colorpicker.js b/vendor-overwrites/colorpicker/colorpicker.js index 2253906e..958d9b92 100644 --- a/vendor-overwrites/colorpicker/colorpicker.js +++ b/vendor-overwrites/colorpicker/colorpicker.js @@ -298,7 +298,8 @@ function setFromHueElement(event) { const {left, width} = getScreenBounds($hue); - const currentX = event ? getTouchPosition(event).clientX : left + width * (HSV.h / 360); + const currentX = event ? getTouchPosition(event).clientX : + left + width * constrainHue(HSV.h) / 360; const normalizedH = constrain(0, 1, (currentX - left) / width); const x = dragging.hueKnobPos = width * normalizedH; $hueKnob.style.left = (x - Math.round($hueKnob.offsetWidth / 2)) + 'px'; @@ -472,7 +473,7 @@ $satPointer.style.top = (y - 5) + 'px'; dragging.saturationPointerPos = {x, y}; - const hueX = $hue.offsetWidth * (HSV.h / 360); + const hueX = $hue.offsetWidth * constrain(0, 1, HSV.h / 360); $hueKnob.style.left = (hueX - 7.5) + 'px'; dragging.hueKnobPos = hueX; @@ -741,6 +742,12 @@ } } + function constrainHue(h) { + return h < 0 ? h % 360 + 360 : + h > 360 ? h % 360 : + h; + } + function RGBtoHSV({r, g, b, a}) { r /= 255; g /= 255; @@ -755,10 +762,7 @@ MaxC === g ? 60 * (((b - r) / DeltaC) + 2) : MaxC === b ? 60 * (((r - g) / DeltaC) + 4) : 0; - h = - h < 0 ? h % 360 + 360 : - h > 360 ? h % 360 : - h; + h = constrainHue(h); return { h, s: MaxC === 0 ? 0 : DeltaC / MaxC, @@ -768,9 +772,7 @@ } function HSVtoRGB({h, s, v}) { - if (h === 360) { - h = 0; - } + h = constrainHue(h) % 360; const C = s * v; const X = C * (1 - Math.abs((h / 60) % 2 - 1)); const m = v - C; @@ -791,7 +793,7 @@ function HSLtoHSV({h, s, l, a}) { const t = s * (l < 50 ? l : 100 - l) / 100; return { - h, + h: constrainHue(h), s: t + l ? 200 * t / (t + l) / 100 : 0, v: (t + l) / 100, a, @@ -802,7 +804,7 @@ const l = (2 - s) * v / 2; const t = l < .5 ? l * 2 : 2 - l * 2; return { - h: Math.round(h), + h: Math.round(constrainHue(h)), s: Math.round(t ? s * v / t * 100 : 0), l: Math.round(l * 100), }; @@ -954,7 +956,9 @@ function parseAs(el, parser) { const num = parser(el.value); - if (!isNaN(num)) { + if (!isNaN(num) && + (!el.min || num >= parseFloat(el.min)) && + (!el.max || num <= parseFloat(el.max))) { el.value = num; return true; }