class EyedropperTool extends Tool { eyedropperPreview = document.getElementById("eyedropper-preview"); selectedColor = {r:0, g:0, b:0}; constructor(name, options, switchFunction) { super(name, options); Events.on('click', this.mainButton, switchFunction, this); } onStart(mousePos, target) { super.onStart(mousePos); if (target.className != 'drawingCanvas') return; this.eyedropperPreview.style.display = 'block'; this.onDrag(mousePos); } onDrag(mousePos) { super.onDrag(mousePos); this.selectedColor = this.pickColor(mousePos); this.eyedropperPreview.style.borderColor = '#' + Color.rgbToHex(this.selectedColor); this.eyedropperPreview.style.left = mousePos[0] + currFile.currentLayer.canvas.offsetLeft - 30 + 'px'; this.eyedropperPreview.style.top = mousePos[1] + currFile.currentLayer.canvas.offsetTop - 30 + 'px'; const colorLightness = Math.max(this.selectedColor.r,this.selectedColor.g,this.selectedColor.b); //for the darkest 50% of colors, change the eyedropper preview to dark mode if (colorLightness>127) this.eyedropperPreview.classList.remove('dark'); else this.eyedropperPreview.classList.add('dark'); this.changeColor(); } onEnd(mousePos) { super.onEnd(mousePos); this.eyedropperPreview.style.display = 'none'; } changeColor() { let colorHex = Color.rgbToHex(this.selectedColor); ColorModule.updateCurrentColor('#' + Color.rgbToHex(this.selectedColor)); let colors = document.getElementsByClassName('color-button'); for (let i = 0; i < colors.length; i++) { //if picked color matches this color if (colorHex == colors[i].jscolor.toString()) { //remove current color selection document.querySelector("#colors-menu li.selected")?.classList.remove("selected"); //set current color for (let i=2; i