Improved webapp group collapsing feature.

This commit is contained in:
Ylian Saint-Hilaire 2019-12-24 11:49:36 -08:00
parent 4dee9ea640
commit ca39635bcd
2 changed files with 28 additions and 10 deletions

View File

@ -1,6 +1,6 @@
{
"name": "meshcentral",
"version": "0.4.6-n",
"version": "0.4.6-o",
"keywords": [
"Remote Management",
"Intel AMT",

View File

@ -1119,6 +1119,8 @@
if (pluginHandlerBuilder != null) { pluginHandler = new pluginHandlerBuilder(); }
var installedPluginList = null;
var goBackStack = [];
var CollapsedGroups = {};
try { CollapsedGroups = JSON.parse(getstore('_collapse', '{}')); } catch(ex) {}
// Console Message Display Timers
var p11DeskConsoleMsgTimer = null;
@ -2785,7 +2787,7 @@
if (sort == 0) {
// Mesh header
if (node.meshid != current) {
if ((view == 1) && (current != null)) { r += '</div>'; } // Close collapse div
if (((view == 1) || (view == 3)) && (current != null)) { r += '</div>'; } // Close collapse div
deviceHeaderSet();
var extra = '';
if (view == 2) { r += '<tr><td colspan=5>'; }
@ -2795,27 +2797,36 @@
r += '<div class=DevSt style=width:100%;padding-top:4px><span style=float:right>';
r += '<span id=DevxHeader' + deviceHeaderId + ' class=devHeaderx></span>' + extra;
r += '</span>';
var collapsed = CollapsedGroups[node.meshid];
r += '<img id=\"DevxColImg' + deviceHeaderId + '\" src=images/c' + ((collapsed === true)?'1':'2') + '.png height=8 width=8 style=margin-left:2px;margin-right:2px;cursor:pointer onclick=toggleCollapseGroup(\"' + deviceHeaderId + '\",\"' + node.meshid + '\")></img>'; // Collapse action
if ((view == 1) || (view == 3)) {
var collapsed = CollapsedGroups[node.meshid];
r += '<img id=\"DevxColImg' + deviceHeaderId + '\" src=images/c' + ((collapsed === true)?'1':'2') + '.png height=8 width=8 style=margin-left:2px;margin-right:2px;cursor:pointer onclick=toggleCollapseGroup(\"' + deviceHeaderId + '\",\"' + node.meshid + '\")></img>'; // Collapse action
}
r += '<span id=MxMESH tabindex=0 style=cursor:pointer onclick=gotoMesh("' + node.meshid + '") onkeypress="if (event.key==\'Enter\') gotoMesh(\'' + node.meshid + '\')">' + EscapeHtml(meshes[node.meshid].name) + '</span>' + getMeshActions(mesh2, meshrights) + '</div>';
if (view == 2) { r += '</div>'; }
current = node.meshid;
displayedMeshes[current] = 1;
c = 0;
if (view == 1) { r += '<div id=DevxCol' + deviceHeaderId + ((collapsed === true)?' style=display:none':'') + '>'; } // Open collapse div
if ((view == 1) || (view == 3)) { r += '<div id=DevxCol' + deviceHeaderId + ((collapsed === true)?' style=display:none':'') + '>'; } // Open collapse div
}
} else if (sort == 1) {
// Power header
var pwr = node.pwr?node.pwr:0;
if (pwr !== current) {
if (((view == 1) || (view == 3)) && (current != null)) { r += '</div>'; } // Close collapse div
deviceHeaderSet();
if ((view == 1) && (current !== null)) { if (c == 2) { r += '<td><div style=width:301px></div></td>'; } if (r != '') { r += '</tr></table>'; } }
if (view == 2) { r += '<tr><td>'; }
r += '<div class=DevSt style=width:100%;padding-top:4px><span id=DevxHeader' + deviceHeaderId + ' class=devHeaderx style=float:right></span><span>' + PowerStateStr2(node.pwr) + '</span></div>';
r += '<div class=DevSt style=width:100%;padding-top:4px><span id=DevxHeader' + deviceHeaderId + ' class=devHeaderx style=float:right></span>';
if ((view == 1) || (view == 3)) {
var collapsed = CollapsedGroups['pwr:' + pwr];
r += '<img id=\"DevxColImg' + deviceHeaderId + '\" src=images/c' + ((collapsed === true)?'1':'2') + '.png height=8 width=8 style=margin-left:2px;margin-right:2px;cursor:pointer onclick=toggleCollapseGroup(\"' + deviceHeaderId + '\",\"pwr:' + pwr + '\")></img>'; // Collapse action
}
r += '<span>' + PowerStateStr2(node.pwr) + '</span></div>';
current = pwr;
c = 0;
if ((view == 1) || (view == 3)) { r += '<div id=DevxCol' + deviceHeaderId + ((collapsed === true)?' style=display:none':'') + '>'; } // Open collapse div
}
} else if (sort == 2) {
// Device header
@ -2865,7 +2876,7 @@
}
}
// If we are displaying devices by group, put the device in the right group.
// If we are displaying devices by tags, put the device in the right tag group.
if ((sort == 3) && (r != '')) {
if (node.tags) {
for (var j in node.tags) {
@ -2889,7 +2900,7 @@
// If displaying devices by groups, sort the group names and display the devices.
if (sort == 3) {
var groupNames = [];
var groupNames = [], tagDeviceHeaderId = 0;
for (var i in groups) { groupNames.push(i); }
groupNames.sort(function (a, b) { return a.toLowerCase().localeCompare(b.toLowerCase()); });
for (var j in groupNames) {
@ -2897,7 +2908,14 @@
if (view == 2) {
r += '<tr><td colspan=4><div class=DevSt style=width:100%;padding-top:4px><span class=devHeaderx style=float:right>' + groupCount[i] + ' node' + ((groupCount[i] > 1) ? 's' : '') + '</span><span>' + i + '</span></div>' + groups[i];
} else {
r += '<div class=DevSt style=width:100%;padding-top:4px><span class=devHeaderx style=float:right>' + groupCount[i] + ' node' + ((groupCount[i] > 1) ? 's' : '') + '</span><span>' + i + '</span></div>' + groups[i];
r += '<div class=DevSt style=width:100%;padding-top:4px><span class=devHeaderx style=float:right>' + groupCount[i] + ' node' + ((groupCount[i] > 1) ? 's' : '') + '</span>';
var collapsed = CollapsedGroups['tag:' + i];
r += '<img id=\"DevxColImg' + tagDeviceHeaderId + '\" src=images/c' + ((collapsed === true)?'1':'2') + '.png height=8 width=8 style=margin-left:2px;margin-right:2px;cursor:pointer onclick=toggleCollapseGroup(\"' + tagDeviceHeaderId + '\",\"tag:' + i + '\")></img>'; // Collapse action
r += '<span>' + i + '</span></div>';
r += '<div id=DevxCol' + tagDeviceHeaderId + ((collapsed === true)?' style=display:none':'') + '>'; // Open collapse div
r += groups[i];
r += '</div>';
tagDeviceHeaderId++;
}
}
}
@ -3055,12 +3073,12 @@
oldviewmode = view;
}
var CollapsedGroups = {};
function toggleCollapseGroup(id, id2) {
var x = (QS('DevxCol' + id)['display'] == 'none');
if (x) { delete CollapsedGroups[id2]; } else { CollapsedGroups[id2] = true; }
Q('DevxColImg' + id).src = x?'images/c2.png':'images/c1.png';
QV('DevxCol' + id, x);
putstore('_collapse', JSON.stringify(CollapsedGroups));
}
function toggleKvmDevice(node) {