Color picker improvements

js/element/ColorHandlerElement.js

@@ -1,6 +1,5 @@
-import LinearColorEntity from "../entity/LinearColorEntity"
 import ColorHandlerTemplate from "../template/ColorHandlerTemplate"
-import IDraggableElement from "./IDraggableElement"
+import IDraggableControlElement from "./IDraggableControlElement"
 
 /** @typedef {import("../template/ColorPickerWindowTemplate").default} ColorPickerWindowTemplate */
 /**
@@ -8,29 +7,12 @@ import IDraggableElement from "./IDraggableElement"
  * @typedef {import("./WindowElement").default<T>} WindowElement
  */
 
-/** @extends {IDraggableElement<Object, ColorHandlerTemplate>} */
-export default class ColorHandlerElement extends IDraggableElement {
-
-    /** @type {WindowElement<ColorPickerWindowTemplate>} */
-    windowElement
+/** @extends {IDraggableControlElement<Object, ColorHandlerTemplate>} */
+export default class ColorHandlerElement extends IDraggableControlElement {
 
     constructor() {
         super({}, new ColorHandlerTemplate())
     }
-
-    connectedCallback() {
-        super.connectedCallback()
-        this.windowElement = this.closest("ueb-window")
-    }
-
-    /** @param {Number[]} param0 */
-    setLocation([x, y]) {
-        super.setLocation(this.template.adjustLocation([x, y]))
-    }
-
-    computeColor() {
-        return new LinearColorEntity()
-    }
 }
 
 customElements.define("ueb-color-handler", ColorHandlerElement)

js/element/ColorSliderElement.js

@@ -0,0 +1,14 @@
+import ColorSliderTemplate from "../template/ColorSliderTemplate"
+import IDraggableControlElement from "./IDraggableControlElement"
+
+/** @typedef {import("../template/IDraggableControlTemplate").default} IDraggableControlTemplate */
+
+/** @extends {IDraggableControlElement<Object, ColorSliderTemplate>} */
+export default class ColorSliderElement extends IDraggableControlElement {
+
+    constructor() {
+        super({}, new ColorSliderTemplate())
+    }
+}
+
+customElements.define("ueb-color-slider", ColorSliderElement)

js/element/IDraggableControlElement.js

@@ -0,0 +1,37 @@
+import IDraggableElement from "./IDraggableElement"
+
+/**
+ * @typedef {import("../element/WindowElement").default} WindowElement
+ * @typedef {import("../entity/IEntity").default} IEntity
+ * @typedef {import("../template/IDraggableControlTemplate").default} IDraggableControlTemplate
+ */
+
+/**
+ * @template {IEntity} T
+ * @template {IDraggableControlTemplate} U
+ * @extends {IDraggableElement<T, U>}
+ */
+export default class IDraggableControlElement extends IDraggableElement {
+
+    /** @type {WindowElement} */
+    windowElement
+
+    /**
+     * @param {T} entity
+     * @param {U} template
+     */
+    constructor(entity, template) {
+        super(entity, template)
+    }
+
+    connectedCallback() {
+        super.connectedCallback()
+        this.windowElement = this.closest("ueb-window")
+    }
+
+    /** @param {Number[]} param0 */
+    setLocation([x, y]) {
+        super.setLocation(this.template.adjustLocation([x, y]))
+    }
+
+}

js/element/IDraggableElement.js

@@ -28,9 +28,12 @@ export default class IDraggableElement extends IElement {
     static dragEventName = Configuration.dragEventName
     static dragGeneralEventName = Configuration.dragGeneralEventName
 
-    constructor(...args) {
-        // @ts-expect-error
-        super(...args)
+    /**
+     * @param {T} entity
+     * @param {U} template
+     */
+    constructor(entity, template) {
+        super(entity, template)
         this.locationX = 0
         this.locationY = 0
     }

js/element/IElement.js

@@ -91,7 +91,7 @@ export default class IElement extends LitElement {
         this.template.inputSetup()
     }
 
-    /** @param {Map<String, String>} */
+    /** @param {Map<String, String>} changedProperties */
     updated(changedProperties) {
         super.updated(changedProperties)
         this.template.updated(changedProperties)