summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--svg/subcan.js170
1 files changed, 169 insertions, 1 deletions
diff --git a/svg/subcan.js b/svg/subcan.js
index c1cee69..21c2d01 100644
--- a/svg/subcan.js
+++ b/svg/subcan.js
@@ -13,8 +13,30 @@ function simple_xpath(expr) {
return nodes;
}
+var mousesel = null;
+var mouseset = null;
+var mouseorig = 0;
+var mousey = 0;
+var mousetimer = null;
+var mousetdir = 0;
+var mousestart = 0;
+
+function immediate_update(id, setval) {
+ var nodes = simple_xpath('//svg:text[@inkscape:label = "'+id+'=%set"]');
+
+ for (i in nodes) {
+ var node = nodes[i];
+ value = Math.round(setval / 255. * 100) + "%";
+ node.firstChild.textContent = value;
+ }
+}
+
function on_evt_click(node) {
var id = node.id.substring(4);
+ var now = new Date().getTime();
+ if (now - mousestart > 100)
+ return;
+
console.log("clicked", id);
$.jsonRPC.request('light_get', {
@@ -33,7 +55,8 @@ function on_evt_click(node) {
console.log('light_set error', result);
},
success: function(result) {
- console.log('light_set ', id, ' => ', newset, ' OK: ', result['result']);
+ // console.log('light_set ', id, ' => ', newset, ' OK: ', result['result']);
+ immediate_update(id, newset);
}
});
/* >>> */
@@ -41,6 +64,116 @@ function on_evt_click(node) {
});
}
+function on_mouse_timer() {
+ if (mousesel === null)
+ return;
+
+ var id = mousesel.id.substring(4);
+
+/* mouseset += mousetdir * 8;
+ if (mouseset < 1)
+ mouseset = 1;
+ if (id.substring(0, 4) == 'dali' && mouseset < 0x55)
+ mouseset = 0x55;
+ if (mouseset > 255)
+ mouseset = 255; */
+
+ $.jsonRPC.request('light_set', {
+ params: [id, mouseset],
+ error: function(result) {
+ console.log('light_set error', result);
+ },
+ success: function(result) {
+ // console.log('light_set ', id, ' => ', mouseset, ' OK: ', result['result']);
+ immediate_update(id, mouseset);
+ }
+ });
+
+ mousetimer = window.setTimeout(on_mouse_timer, 100);
+}
+
+function on_evt_mousedown(node, evt) {
+ var id = node.id.substring(4);
+ // console.log('node', node, 'y', evt.clientY);
+ mousestart = new Date().getTime();
+ node.style.fill = "#0088ff";
+ node.style.fillOpacity = 0.25;
+ mousesel = node;
+ mousey = evt.clientY;
+ $.jsonRPC.request('light_get', {
+ params: [id],
+ error: function(result) {
+ console.log('light_get error', result);
+ },
+ success: function(result) {
+ mouseorig = result['result']['set'];
+ mouseset = mouseorig;
+ }
+ });
+
+ if (evt.stopPropagation) evt.stopPropagation();
+ evt.cancelBubble = true;
+ return false;
+}
+
+function on_evt_mousemove(node, evt) {
+ if (mousesel === null)
+ return;
+
+ var offs = evt.clientY - mousey;
+ // console.log('node', node, 'set', mouseset, 'y', evt.clientY, 'offs', offs);
+ var deadzone = 20;
+ var dimzone = 120;
+
+ var min = 1;
+ if (mousesel.id.substring(4, 8) == 'dali')
+ min = 0x55;
+
+ if (offs > -deadzone && offs < deadzone) {
+ if (mousetimer !== null)
+ window.clearTimeout(mousetimer);
+ mousetimer = null;
+ return;
+ }
+
+ if (offs < 0) {
+ var pos = (-offs - deadzone) / dimzone;
+ console.log("cvo", offs, "+dim", pos);
+ mouseset = mouseorig + pos * (255 - mouseorig);
+ } else {
+ var pos = (offs - deadzone) / dimzone;
+ console.log("cvo", offs, "-dim", pos);
+ mouseset = mouseorig * (1.0 - pos);
+ }
+ mouseset = Math.floor(mouseset);
+ if (mouseset > 255)
+ mouseset = 255;
+ if (mouseset < min)
+ mouseset = min;
+
+ if (mousetimer === null)
+ mousetimer = window.setTimeout(on_mouse_timer, 100);
+
+ evt.cancelBubble = true;
+ if (evt.stopPropagation) evt.stopPropagation();
+ return false;
+}
+
+function on_evt_mouseup(node, evt) {
+ // console.log('--- up ---');
+ window.setTimeout((function() {
+ var sel = mousesel;
+ return function() {
+ sel.style.fillOpacity = 0.0;
+ }
+ })(), 250);
+ mousesel = null;
+
+ evt.cancelBubble = true;
+ if (evt.stopPropagation) evt.stopPropagation();
+ return false;
+}
+
function prepare_cliprects() {
var nodes = simple_xpath('//svg:rect[contains(@inkscape:label, "=")]');
console.log('setup');
@@ -77,6 +210,41 @@ function prepare_evts() {
var current_node = node;
return function() { on_evt_click(current_node); }
})();
+ node.onmousedown = (function() {
+ var current_node = node;
+ return function(evt) { on_evt_mousedown(current_node, evt); }
+ })();
+ node.onmousemove = (function() {
+ var current_node = node;
+ return function(evt) { on_evt_mousemove(current_node, evt); }
+ })();
+ node.onmouseup = (function() {
+ var current_node = node;
+ return function(evt) { on_evt_mouseup(current_node, evt); }
+ })();
+ node.onselectstart = function() { return false; }
+ node.unselectable = 'on';
+ node.style.userSelect = 'none';
+ node.style.MozUserSelect = 'none';
+ node.style.WebkitUserSelect = 'none';
+ }
+ document.onmouseup = (function() {
+ var current_node = node;
+ return function(evt) { on_evt_mouseup(current_node, evt); }
+ })();
+ document.onmousemove = (function() {
+ var current_node = node;
+ return function(evt) { on_evt_mousemove(current_node, evt); }
+ })();
+
+ var nodes = simple_xpath('//svg:text');
+ for (i in nodes) {
+ var node = nodes[i];
+ node.onselectstart = function() { return false; }
+ node.unselectable = 'on';
+ node.style.userSelect = 'none';
+ node.style.MozUserSelect = 'none';
+ node.style.WebkitUserSelect = 'none';
}
}