FUNCT Add support to modify sliders

6 files changed, 85 insertions, 189 deletions

diff --git a/src/js/app.js b/src/js/app.js
new file mode 100644
index 0000000..773e5b0
--- /dev/null
+++ b/src/js/app.js
@@ -0,0 +1,29 @@
+import Mustache from 'mustache';
+import { init as init_sliders } from './sliders';
+
+var template;
+
+function render_sliders(sliders) {
+    var sliderContainer = document.getElementById('SliderContainer');
+    for( var i=0; i<sliders.length; i++) {
+        var node = Mustache.render(template, sliders[i]);
+        sliderContainer.innerHTML += node;
+    }
+}
+
+export function init() {
+    template = document.getElementById('slider-template').innerHTML;
+    Mustache.parse(template);
+
+    var sliders =  [];
+    for( var i=0; i<10; i++) {
+        sliders.push({
+            id: i,
+            name: 'Volume '+i,
+            value: Math.floor(Math.random()*100)
+        });
+    }
+
+    init_sliders(sliders);
+    render_sliders(sliders);
+}
\ No newline at end of file
diff --git a/src/js/buttons.js b/src/js/buttons.js
deleted file mode 100644
index 5fcb521..0000000
--- a/src/js/buttons.js
+++ /dev/null
@@ -1,38 +0,0 @@
-/*
- * Copyright 2019 Igalia, S.L.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *   http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-var buttons = {
-    ac: false,
-    auto: false,
-    circulation: false,
-    down: false,
-    up: false,
-    right: false,
-    rear: false,
-    front: false
-};
-
-function update(node, value) {
-    node.setAttribute('value', value);
-}
-
-module.exports = {
-    toggle: function(node) {
-        var key = node.getAttribute('key');
-        buttons[key] = !buttons[key];
-        update(node, buttons[key]);
-    }
-}
\ No newline at end of file
diff --git a/src/js/chair.js b/src/js/chair.js
deleted file mode 100644
index 5cd26e8..0000000
--- a/src/js/chair.js
+++ /dev/null
@@ -1,33 +0,0 @@
-/*
- * Copyright 2019 Igalia, S.L.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *   http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-var left = 0;
-var right = 0;
-
-function update(node, value){
-    node.setAttribute('value', value);
-}
-
-module.exports = {
-    left: function(node) {
-        left = (left + 1) % 3;
-        update(node, left);
-    },
-    right: function(node) {
-        right = (right + 1) % 3;
-        update(node, right);
-    },
-}
\ No newline at end of file
diff --git a/src/js/fan_speed.js b/src/js/fan_speed.js
deleted file mode 100644
index 8b131b5..0000000
--- a/src/js/fan_speed.js
+++ /dev/null
@@ -1,29 +0,0 @@
-/*
- * Copyright 2019 Igalia, S.L.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *   http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-var value = 0;
-
-function update(node, value) {
-    node.value = value;
-    node.parentNode.getElementsByTagName('progress')[0].value = value;
-}
-
-module.exports = {
-    set: function(node) {
-        value = node.value;
-        update(node, value);
-    }
-}
\ No newline at end of file
diff --git a/src/js/sliders.js b/src/js/sliders.js
new file mode 100644
index 0000000..624e8e4
--- /dev/null
+++ b/src/js/sliders.js
@@ -0,0 +1,56 @@
+this.sliders = {};
+
+function getRootNode(node) {
+    while(!node.hasAttribute('slider-id') && node.parentNode) {
+        return getRootNode(node.parentNode);
+    }
+
+    if( node.hasAttribute('slider-id') ) {
+        return node;
+    } else {
+        return false;
+    }
+}
+
+function getValue(node) {
+    node = getRootNode(node);
+    if( node ) {
+        return parseInt(node.getAttribute('value'));
+    } else {
+        return false;
+    }
+}
+
+function setValue(node, value) {
+    node = getRootNode(node);
+    if( node ){
+        value = Math.max(Math.min(value, 100), 0);
+        node.setAttribute('value', value);
+        node.getElementsByTagName('progress')[0].value = value;
+        node.getElementsByTagName('input')[0].value = value;
+        node.getElementsByClassName('value')[0].innerHTML = value+'%';
+    }
+}
+
+function init(sliders) {
+    console.log(sliders);
+}
+
+function increase(node) {
+    setValue(node, getValue(node)+5);
+}
+
+function decrease(node) {
+    setValue(node, getValue(node)-5);
+}
+
+function change(node) {
+    setValue(node, node.value);
+}
+
+module.exports = {
+    init: init,
+    increase: increase,
+    decrease: decrease,
+    change: change
+}
\ No newline at end of file
diff --git a/src/js/temperature.js b/src/js/temperature.js
deleted file mode 100644
index 3a394a1..0000000
--- a/src/js/temperature.js
+++ /dev/null
@@ -1,89 +0,0 @@
-/*
- * Copyright 2019 Igalia, S.L.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *   http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-var left = 22;
-var right = 22;
-
-var lowTemperature = 15;
-var hiTemperature = 30;
-var temperatures = [];
-
-var isScrolling;
-var elementHeight;
-
-function createTemperatureElement() {
-    var element = document.createElement('div');
-    element.classList = ['temperature'];
-    element.style.height = elementHeight+'px';
-    element.style.lineHeight = elementHeight+'px';
-    return element;
-}
-
-function update(node, index) {
-    node.scrollTop = index*elementHeight;
-
-    for( var i=0; i<node.children.length; i++) {
-        node.children[i].setAttribute('enabled',false);
-    }
-    node.children[index].setAttribute('enabled', true);
-}
-
-module.exports = {
-    left: function(node) {
-        clearTimeout(isScrolling);
-
-        isScrolling = setTimeout(function(){
-            var index = Math.round(node.scrollTop/elementHeight);
-            left = temperatures[index];
-            update(node, index);
-            console.log('LEFT', left);
-        }, 100);
-    },
-    right: function(node) {
-        clearTimeout(isScrolling);
-
-        isScrolling = setTimeout(function(){
-            var index = Math.round(node.scrollTop/elementHeight);
-            right = temperatures[index];
-            update(node, index);
-            console.log('RIGHT', right);
-        }, 100);
-    },
-    init: function() {
-        var leftTemperature = document.getElementById('lefttemperature');
-        var rightTemperature = document.getElementById('righttemperature');
-        elementHeight = leftTemperature.offsetHeight/2;
-
-        for( var i=lowTemperature; i<=hiTemperature; i++) {
-            var element = createTemperatureElement();
-            if( i === lowTemperature) {
-                element.innerHTML = 'LO';
-            } else if( i === hiTemperature ) {
-                element.innerHTML = 'HI';
-            } else {
-                element.innerHTML = i+'º';
-            }
-            leftTemperature.appendChild(element);
-            rightTemperature.appendChild(element.cloneNode(true));
-            temperatures[temperatures.length] = i;
-        }
-        leftTemperature.appendChild(createTemperatureElement());
-        rightTemperature.appendChild(createTemperatureElement());
-
-        update(leftTemperature, temperatures.indexOf(left));
-        update(rightTemperature, temperatures.indexOf(right));
-    }
-}
\ No newline at end of file