Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
_updatePicker(rgba = this.color) {
let hsv = util.RGBToHSV(rgba.r, rgba.g, rgba.b);
let ctx = this.colorPickerCanvas.getContext('2d');
if (this.pixelRation === undefined) {
this.pixelRatio = (window.devicePixelRatio || 1) / (ctx.webkitBackingStorePixelRatio ||
ctx.mozBackingStorePixelRatio ||
ctx.msBackingStorePixelRatio ||
ctx.oBackingStorePixelRatio ||
ctx.backingStorePixelRatio || 1);
}
ctx.setTransform(this.pixelRatio, 0, 0, this.pixelRatio, 0, 0);
// clear the canvas
let w = this.colorPickerCanvas.clientWidth;
let h = this.colorPickerCanvas.clientHeight;
ctx.clearRect(0, 0, w, h);
ctx.putImageData(this.hueCircle, 0,0);
_setColor(rgba, setInitial = true) {
// store the initial color
if (setInitial === true) {
this.initialColor = util.extend({}, rgba);
}
this.color = rgba;
let hsv = util.RGBToHSV(rgba.r, rgba.g, rgba.b);
let angleConvert = 2 * Math.PI;
let radius = this.r * hsv.s;
let x = this.centerCoordinates.x + radius * Math.sin(angleConvert * hsv.h);
let y = this.centerCoordinates.y + radius * Math.cos(angleConvert * hsv.h);
this.colorPickerSelector.style.left = x - 0.5 * this.colorPickerSelector.clientWidth + 'px';
this.colorPickerSelector.style.top = y - 0.5 * this.colorPickerSelector.clientHeight + 'px';
this._updatePicker(rgba);
}
let y = top - centerY;
let angle = Math.atan2(x,y);
let radius = 0.98 * Math.min(Math.sqrt(x * x + y * y), centerX);
let newTop = Math.cos(angle) * radius + centerY;
let newLeft = Math.sin(angle) * radius + centerX;
this.colorPickerSelector.style.top = newTop - 0.5 * this.colorPickerSelector.clientHeight + 'px';
this.colorPickerSelector.style.left = newLeft - 0.5 * this.colorPickerSelector.clientWidth + 'px';
// set color
let h = angle / (2 * Math.PI);
h = h < 0 ? h + 1 : h;
let s = radius / this.r;
let hsv = util.RGBToHSV(this.color.r, this.color.g, this.color.b);
hsv.h = h;
hsv.s = s;
let rgba = util.HSVToRGB(hsv.h, hsv.s, hsv.v);
rgba['a'] = this.color.a;
this.color = rgba;
// update previews
this.initialColorDiv.style.backgroundColor = 'rgba(' + this.initialColor.r + ',' + this.initialColor.g + ',' + this.initialColor.b + ',' + this.initialColor.a + ')';
this.newColorDiv.style.backgroundColor = 'rgba(' + this.color.r + ',' + this.color.g + ',' + this.color.b + ',' + this.color.a + ')';
}
}
_setBrightness(value) {
let hsv = util.RGBToHSV(this.color.r, this.color.g, this.color.b);
hsv.v = value / 100;
let rgba = util.HSVToRGB(hsv.h, hsv.s, hsv.v);
rgba['a'] = this.color.a;
this.color = rgba;
this._updatePicker();
}