Update framework

framework/ui/menu/items/slider-item.js

@@ -0,0 +1,42 @@
+import { BaseItem } from './base-item';
+export class SliderItem extends BaseItem {
+    constructor(id, title, min, max, step, defaultValue = null) {
+        super(id, title);
+        this.min = min;
+        this.max = max;
+        this.step = step;
+        this.defaultValue = defaultValue;
+    }
+    getDOMNode() {
+        this.container = document.createElement('div');
+        this.label = document.createElement('label');
+        this.label.textContent = this.title;
+        this.label.setAttribute('for', `slider_${this.id}`);
+        this.slider = document.createElement('input');
+        this.slider.id = `slider_${this.id}`;
+        this.slider.type = 'range';
+        this.slider.setAttribute('min', this.min.toString());
+        this.slider.setAttribute('max', this.max.toString());
+        this.slider.setAttribute('step', this.step.toString());
+        if (this.defaultValue)
+            this.slider.value = this.defaultValue.toString();
+        this.slider.addEventListener('change', this.onChange.bind(this));
+        this.slider.addEventListener('focus', this.onFocus.bind(this));
+        this.container.appendChild(this.label);
+        this.container.appendChild(this.slider);
+        this.container.addEventListener('focus', this.onFocus.bind(this));
+        return this.container;
+    }
+    getContents() {
+        return this.slider.value;
+    }
+    onChange(event) {
+        this.emit('update', {
+            type: 'slider',
+            value: this.slider.value
+        });
+    }
+    focus() {
+        this.slider && this.slider.focus();
+    }
+}