Skip to content

Commit db63fa1

Browse files
gizmocuzgizmocuz
authored
Merge pull request #741 from WoLpH/usable-zwave-topology
Improved zwave topology usability
2 parents e7ce499 + 9f208d3 commit db63fa1

File tree

1 file changed

+84
-37
lines changed

1 file changed

+84
-37
lines changed

‎www/zwavetopology.html‎

Lines changed: 84 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -15,29 +15,58 @@
1515
<script src="js/bootstrap.min.js"></script>
1616
<script src="js/bootbox.min.js"></script>
1717
<script src="js/jquery-ui.min.js"></script>
18+
19+
<!-- Highcharts is not needed here but domoticz.js depends on it -->
20+
<script type="text/javascript" charset="utf-8" src="js/highcharts.js"></script>
21+
1822
<script type="text/javascript" charset="utf-8" src="js/domoticz.js"></script>
1923
<script src="js/d3.min.js"></script>
2024
<script type="text/javascript" charset="utf-8" src="js/jquery.dataTables.min.js"></script>
2125

2226
<script>
2327

2428
function getParameter(paramName) {
25-
var searchString = window.location.search.substring(1),i, val, params = searchString.split("&");
29+
var searchString = window.location.search.substring(1),i, val, params = searchString.split('&');
2630
for (i=0;i<params.length;i++) {
27-
val = params[i].split("=");
31+
val = params[i].split('=');
2832
if (val[0] == paramName) {
2933
return unescape(val[1]);
3034
}
3135
}
3236
return null;
3337
}
38+
39+
40+
function getNodeId(node){
41+
return (
42+
addLeadingZeros(node.nodeID, 3)
43+
+ ' (0x' + addLeadingZeros(node.nodeID.toString(16), 2) + ')'
44+
);
45+
}
46+
47+
function getNodeName(node){
48+
return node ? node.nodeName : '';
49+
}
50+
51+
function getGroupName(group){
52+
return group ? group.groupName : '';
53+
}
3454

35-
function removeNodeFromGroup(node,group,removenode) {
36-
var hwid=getParameter("hwid");
37-
bootbox.confirm($.t("Are you sure you want to remove this node from the group?"), function(result) {
55+
function removeNodeFromGroup(event) {
56+
var node = event.data.node;
57+
var group = event.data.group;
58+
var removeNode = event.data.removeNode;
59+
var removeNodeId = event.data.removeNodeId;
60+
var hwid=getParameter('hwid');
61+
bootbox.confirm($.t(
62+
'Are you sure you want to remove this node?<br>'
63+
+ 'Node: ' + getNodeName(removeNode)
64+
+ ' (' + removeNodeId
65+
+ ')<br>From group: ' + getGroupName(group)
66+
+ '<br>On node ' + getNodeName(node)), function(result) {
3867
if (result==true) {
3968
$.ajax({
40-
url: "json.htm?type=command&param=zwaveremovegroupnode&idx=" + hwid + "&node="+node+"&group="+group+"&removenode="+removenode,
69+
url: "json.htm?type=command&param=zwaveremovegroupnode&idx=" + hwid + "&node=" + node.nodeID + "&group=" + group.id + "&removeNode=" + removeNode,
4170
async: false,
4271
dataType: 'json',
4372
success: function(data) {
@@ -49,19 +78,21 @@
4978
}
5079
});
5180
}
52-
function addNodeToGroup(node,group) {
53-
var hwid=getParameter("hwid");
81+
function addNodeToGroup(event) {
82+
var node = event.data.node;
83+
var group = event.data.group;
84+
var hwid=getParameter('hwid');
5485
bootbox.dialog({
55-
message: $.t("Please enter the node to add to this group:")+"<input type='text' id='add_node' data-toggle='tooltip' title='NodeId or NodeId.Instance'></input>",
56-
title: "Add node",
86+
message: $.t("Please enter the node to add to this group:")+"<input type='text' id='add_node' data-toggle='tooltip' title='NodeId or NodeId.Instance'></input><br>" + group.groupName,
87+
title: 'Add node to ' + getNodeName(node),
5788
buttons: {
5889
main: {
5990
label: $.t("Save"),
6091
className: "btn-primary",
6192
callback: function() {
6293
var addnode = $("#add_node").val();
6394
$.ajax({
64-
url: "json.htm?type=command&param=zwaveaddgroupnode&idx=" + hwid + "&node="+node+"&group="+group+"&addnode="+addnode,
95+
url: "json.htm?type=command&param=zwaveaddgroupnode&idx=" + hwid + "&node=" + node.nodeID + "&group=" + group.id + "&addnode=" + addnode,
6596
async: false,
6697
dataType: 'json',
6798
success: redrawGroupTable()
@@ -95,43 +126,60 @@
95126
if (typeof data != 'undefined') {
96127
if (data.status=="OK") {
97128
if (typeof data.result != 'undefined') {
98-
grouptable = $('#grouptable');
99-
var maxgroups = data.result.MaxNoOfGroups;
100-
thead = $('<thead></thead>');
101-
trow = $('<tr></tr>');
129+
grouptable = $('#grouptable');
130+
var maxgroups = data.result.MaxNoOfGroups;
131+
var thead = $('<thead></thead>');
132+
var trow = $('<tr></tr>');
102133

103-
$('<th></th>').text($.t("Node")).appendTo(trow);
104-
$('<th></th>').text($.t("Name")).appendTo(trow);
134+
$('<th></th>').text($.t("Node")).appendTo(trow);
135+
$('<th></th>').text($.t("Name")).appendTo(trow);
105136
for (var i = 0; i < maxgroups; i++) {
106-
$('<th></th>').text($.t("Group")+" " +(i+1)).appendTo(trow);
137+
$('<th></th>').text($.t("Group") + " " + (i + 1)).appendTo(trow);
107138
}
108139
trow.appendTo(thead);
109140
thead.appendTo(grouptable);
110141
tbody = $('<tbody></tbody>');
111-
112-
jsonnodes = data.result.nodes;
113-
$.each(jsonnodes, function(i, item) {
142+
143+
var jsonnodes = data.result.nodes;
144+
var nodes = {};
145+
var i = jsonnodes.length;
146+
while (i--) {
147+
var node = jsonnodes[i];
148+
nodes[node.nodeID] = node;
149+
}
150+
$.each(jsonnodes, function(i, node) {
114151
var groupsDone = 0;
115-
noderow = $('<tr></tr>');
116-
var nodeStr = addLeadingZeros(item.nodeID,3) + " (0x" + addLeadingZeros(item.nodeID.toString(16),2) + ")";
117-
$('<td></td>').text(nodeStr).appendTo(noderow);
118-
$('<td></td>').text(item.nodeName).appendTo(noderow);
119-
noGroups = item.groupCount;
152+
noderow = $('<tr>');
153+
$('<td>').text(getNodeId(node)).appendTo(noderow);
154+
$('<td>').text(node.nodeName).appendTo(noderow);
155+
noGroups = node.groupCount;
120156
if (noGroups > 0) {
121-
groupnodes = item.groups;
157+
groupnodes = node.groups;
122158
$.each(groupnodes, function(g, group) {
123-
td = $('<td data-toggle="tooltip" title="' + group.groupName + '"></td>');
159+
td = $('<td>').data('toggle', 'tooltip').attr('title', getGroupName(group));
160+
161+
function createButton(text){
162+
var button = $('<span>');
163+
button.text(text);
164+
button.addClass('label label-info lcursor');
165+
return button;
166+
}
167+
124168
$.each(group.nodes.split(','), function(){
125169
if (this!="") {
126-
button=$('<span class="label label-info lcursor" onclick="removeNodeFromGroup('+item.nodeID+','+group.id+','+this+');">'+this+'</span>');
170+
var button = createButton(this);
171+
var removeNodeId = this * 1;
172+
var removeNode = nodes[Math.round(removeNodeId)];
173+
button.click({node: node, group: group, removeNode: removeNode, removeNodeId: this}, removeNodeFromGroup);
174+
button.attr('title', getNodeName(node) + ' on ' + getGroupName(group));
127175
button.appendTo(td);
128176
}
129177
});
130-
button=$('<span class="label label-info lcursor" onclick="addNodeToGroup('+item.nodeID+','+group.id+');">+</span>');
178+
var button = createButton('+');
179+
button.click({node: node, group: group}, addNodeToGroup);
131180
button.appendTo(td);
132181
td.appendTo(noderow);
133182
groupsDone++;
134-
135183
});
136184
}
137185
if (groupsDone<maxgroups) {
@@ -161,6 +209,7 @@
161209
"aLengthMenu": [[5,10], [5,10]],
162210
"iDisplayLength": 10,
163211
"sPaginationType": "full_numbers",
212+
paging: false,
164213
language: $.DataTableLanguage
165214
});
166215
}
@@ -172,8 +221,8 @@
172221

173222
function drawChord() {
174223

175-
var width = 430; //window.innerWidth*0.9;
176-
var height = 430; //window.innerHeight*0.8;
224+
var width = window.innerWidth*0.39;
225+
var height = window.innerHeight*0.8;
177226
innerRadius = Math.min(width, height) * .40,
178227
outerRadius = innerRadius * 1.1;
179228
var nodeslist=[];
@@ -366,14 +415,12 @@
366415
clear: both;
367416
}
368417
div.left {
369-
width: 50%;
418+
width: 40%;
370419
position: relative;
371420
float: left;
372-
height: 450px;
373421
}
374422
div.right {
375-
width: 49%;
376-
height: 450px;
423+
width: 60%;
377424
position: relative;
378425
float: right;
379426
overflow: auto;

0 commit comments

Comments
 (0)