summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--svg/subcan.js224
-rw-r--r--svg/subcan_dxf.svg51
2 files changed, 272 insertions, 3 deletions
diff --git a/svg/subcan.js b/svg/subcan.js
index 9a48321..21c2d01 100644
--- a/svg/subcan.js
+++ b/svg/subcan.js
@@ -13,6 +13,167 @@ 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', {
+ params: [id],
+ error: function(result) {
+ console.log('light_get error', result);
+ },
+ success: function(result) {
+ /* <<< */
+ console.log('light_get', result['result']);
+ var set = result['result']['set'];
+ var newset = set ? 0 : 255;
+ $.jsonRPC.request('light_set', {
+ params: [id, newset],
+ error: function(result) {
+ console.log('light_set error', result);
+ },
+ success: function(result) {
+ // console.log('light_set ', id, ' => ', newset, ' OK: ', result['result']);
+ immediate_update(id, newset);
+ }
+ });
+ /* >>> */
+ }
+ });
+}
+
+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');
@@ -25,6 +186,68 @@ function prepare_cliprects() {
}
}
+function prepare_evts() {
+ $.jsonRPC.setup({
+ endPoint: '/jsonrpc',
+ namespace: ''
+ });
+ $.jsonRPC.request('ping', {
+ success: function(result) {
+ console.log('ping', result['result']);
+ },
+ error: function(result) {
+ console.log('ping error', result);
+ }
+ });
+
+ var nodes = simple_xpath('//svg:g[@inkscape:label="events"]/svg:rect');
+ console.log('setup events', nodes);
+ for (i in nodes) {
+ var node = nodes[i];
+ var id = node.id;
+ console.log('event node', i, " => ", node);
+ node.onclick = (function() {
+ 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';
+ }
+}
+
function update_cliprect(node, dir, val) {
//var cliprect = document.getElementById("cliprect-dali.lounge_buero-0");
//var t = new Date().getTime() / 2000 * Math.PI;
@@ -99,5 +322,6 @@ function timer() {
function doload() {
prepare_cliprects();
+ prepare_evts();
timer();
}
diff --git a/svg/subcan_dxf.svg b/svg/subcan_dxf.svg
index dd18259..031f606 100644
--- a/svg/subcan_dxf.svg
+++ b/svg/subcan_dxf.svg
@@ -22,10 +22,10 @@
id="script9227" />
<script
xlink:href="jquery.jsonrpc.js"
- id="script9227" />
+ id="script4" />
<script
xlink:href="subcan.js"
- id="script9227" />
+ id="script6" />
<defs
id="defs4">
<clipPath
@@ -172,7 +172,7 @@
inkscape:cx="680.17135"
inkscape:cy="386.87652"
inkscape:document-units="px"
- inkscape:current-layer="layer1"
+ inkscape:current-layer="layer9"
showgrid="true"
width="1052.36px"
inkscape:window-width="1600"
@@ -4387,4 +4387,49 @@
inkscape:connector-curvature="0"
sodipodi:nodetypes="cczcc" />
</g>
+ <g
+ inkscape:groupmode="layer"
+ id="layer9"
+ inkscape:label="events">
+ <rect
+ style="fill:#000000;fill-opacity:0.00392157;stroke:none"
+ id="evt_dali.lounge_durchreiche"
+ width="112"
+ height="120"
+ x="280.5"
+ y="271.5"
+ inkscape:label="#rect3791" />
+ <rect
+ style="fill:#000000;fill-opacity:0.00392157;stroke:none"
+ id="evt_dali.lounge_bar"
+ width="112"
+ height="120"
+ x="400.5"
+ y="271.5"
+ inkscape:label="#rect3791" />
+ <rect
+ style="fill:#000000;fill-opacity:0.00392157;stroke:none"
+ id="evt_dali.lounge_buero"
+ width="112"
+ height="120"
+ x="224.5"
+ y="79.5"
+ inkscape:label="#rect3791" />
+ <rect
+ style="fill:#000000;fill-opacity:0.00392157;stroke:none"
+ id="evt_dali.lounge_buehne"
+ width="112"
+ height="120"
+ x="104.5"
+ y="79.5"
+ inkscape:label="#rect3791" />
+ <rect
+ style="fill:#000000;fill-opacity:0.00392157;stroke:none"
+ id="evt_dali.flur"
+ width="120"
+ height="88"
+ x="520.5"
+ y="175.5"
+ inkscape:label="#rect3791" />
+ </g>
</svg>