MyFavMirrors/MeshCentral
1
0
Fork 0
mirror of https://github.com/Ylianst/MeshCentral.git synced 2024-12-24 06:05:53 -05:00
Code Issues Packages Projects Releases Wiki Activity

More user interface improvements

Browse Source
This commit is contained in:
Ylian Saint-Hilaire 2018-09-18 14:47:17 -07:00
parent feb427add6
commit e0ee698e2a
6 changed files with 121 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

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

BIN
public/images/views.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.1 KiB

10
public/scripts/agent-desktop-0.0.2.js
View File

@ -84,7 +84,7 @@ var CreateAgentRemoteDesktop = function (canvasid, scrolldiv) {
}
obj.send = function (x) {
//console.log("KSend(" + x.length + "): " + rstr2hex(x));
if (obj.debugmode > 1) { console.log("KSend(" + x.length + "): " + rstr2hex(x)); }
obj.parent.send(x);
}
@ -159,7 +159,7 @@ var CreateAgentRemoteDesktop = function (canvasid, scrolldiv) {
}
obj.ProcessScreenMsg = function (width, height) {
if (obj.debugmode == 1) { console.log("ScreenSize: " + width + " x " + height); }
if (obj.debugmode > 0) { console.log("ScreenSize: " + width + " x " + height); }
obj.Canvas.setTransform(1, 0, 0, 1, 0, 0);
obj.rotation = 0;
obj.FirstDraw = true;
@ -178,19 +178,19 @@ var CreateAgentRemoteDesktop = function (canvasid, scrolldiv) {
}
obj.ProcessDataEx = function (str) {
if (obj.debugmode > 1) { console.log("KRecv(" + str.length + "): " + rstr2hex(str.substring(0, Math.min(str.length, 40)))); }
if (str.length < 4) return;
var cmdmsg = null, X = 0, Y = 0, command = ReadShort(str, 0), cmdsize = ReadShort(str, 2);
if ((cmdsize != str.length) && (obj.debugmode == 1)) { console.log(cmdsize, str.length, cmdsize == str.length); }
if ((cmdsize != str.length) && (obj.debugmode > 0)) { console.log(cmdsize, str.length, cmdsize == str.length); }
if (command >= 18) { console.error("Invalid KVM command " + command + " of size " + cmdsize); console.log("Invalid KVM data", str.length, str, rstr2hex(str)); return; }
if (cmdsize > str.length) { console.error("KVM invalid command size", cmdsize, str.length); return; }
//meshOnDebug("KVM Command: " + command + " Len:" + cmdsize);
//if (obj.debugmode == 1) { console.log("KVM Command: " + command + " Len:" + cmdsize); }
if (command == 3 || command == 4 || command == 7) {
cmdmsg = str.substring(4, cmdsize);
X = ((cmdmsg.charCodeAt(0) & 0xFF) << 8) + (cmdmsg.charCodeAt(1) & 0xFF);
Y = ((cmdmsg.charCodeAt(2) & 0xFF) << 8) + (cmdmsg.charCodeAt(3) & 0xFF);
if (obj.debugmode == 1) { console.log("CMD" + command + " at X=" + X + " Y=" + Y); }
if (obj.debugmode > 0) { console.log("CMD" + command + " at X=" + X + " Y=" + Y); }
}
switch (command) {

3
public/scripts/amt-terminal-0.0.2.js
View File

@ -14,10 +14,10 @@ var CreateAmtRemoteTerminal = function (divid) {
obj.terminalEmulation = 1;
// ###END###{Terminal-Enumation-All}
obj.fxEmulation = 0;
obj.lineFeed = '\r\n';
obj.width = 80; // 80 or 100
obj.height = 25; // 25 or 30
obj.lineFeed = '\r\n';
var _Terminal_CellHeight = 21;
var _Terminal_CellWidth = 13;
@ -414,6 +414,7 @@ var CreateAmtRemoteTerminal = function (divid) {
_TermMoveUp(1);
_termy = (obj.height - 1);
}
if (obj.lineFeed = '\n') { _termx = 0; } // *** If we are in Linux mode, \n will also return the cursor to the first col
break;
case '\r': // Carriage Return
_termx = 0;

55
public/styles/style.css
View File

@ -447,7 +447,6 @@ a {
.e2 {
float: left;
height: 100%;
width: 201px;
background-color: #c9c9c9;
}
@ -604,3 +603,57 @@ a {
padding-top: 4px;
padding-bottom: 4px;
}
.viewSelector {
width:32px;
height:32px;
background-color:#DDD;
border-radius:3px;
float:left;
margin-left:5px;
cursor: pointer;
opacity: 0.3;
}
.viewSelectorSel {
background-color:#BBB;
opacity: 0.8;
}
.viewSelector:hover {
opacity: 0.5;
background-color:#AAA;
}
.viewSelector1 {
margin-left:2px;
margin-top:2px;
background: url(../images/views.png) -0px 0px;
height: 28px;
width: 28px;
}
.viewSelector2 {
margin-left:2px;
margin-top:2px;
background: url(../images/views.png) -28px 0px;
height: 28px;
width: 28px;
}
.viewSelector3 {
margin-left:2px;
margin-top:2px;
background: url(../images/views.png) -56px 0px;
height: 28px;
width: 28px;
}
.viewSelector4 {
margin-left:2px;
margin-top:2px;
background: url(../images/views.png) -84px 0px;
height: 28px;
width: 28px;
}

77
views/default.handlebars
View File

@ -143,7 +143,12 @@
<div id=p0message style=margin:50px;text-align:center>Server disconnected, <href onclick=reload() style=cursor:pointer><u>click to reconnect</u></href>.</div>
</div>
<div id=p1 style=display:none>
<h1>My Devices</h1>
<div style="float:right" id="devListToolbarViewIcons">
<div id=devViewButton1 class="viewSelector" onclick=onDeviceViewChange(1) title="Columns"><div class="viewSelector1"></div></div>
<div id=devViewButton2 class=viewSelector onclick=onDeviceViewChange(2) title="List"><div class="viewSelector2"></div></div>
<div id=devViewButton3 class=viewSelector onclick=onDeviceViewChange(3) title="Desktops"><div class="viewSelector3"></div></div>
<div id=devViewButton4 class=viewSelector onclick=onDeviceViewChange(4) title="Map"><div class="viewSelector4"></div></div>
</div><div><h1>My Devices</h1></div>
<div style=width:100%;height:24px;background-color:#d3d9d6>
<div class=h1 style=height:100%;float:left>&nbsp;</div>
<div id=devListToolbar class=style14 style=height:100%;float:left>
@ -155,7 +160,7 @@
<div id=kvmListToolbar class=style14 style=height:100%;float:left>
&nbsp;&nbsp;<input type="button" onclick="connectAllKvmFunction()" value="Connect All" />&nbsp;
<input type="button" onclick="disconnectAllKvmFunction()" value="Disconnect All" />&nbsp;
<input type="checkbox" id="autoConnectDesktopCheckbox" onclick="autoConnectDesktops(event)" />AutoConnect&nbsp;
<input type="checkbox" id="autoConnectDesktopCheckbox" onclick="autoConnectDesktops(event)" title="Automatic connect" />Auto&nbsp;
<input type="button" onclick="showMultiDesktopSettings()" value="Settings" />&nbsp;
</div>
<div id=devMapToolbar class=style14 style=height:100%;float:left>
@ -163,10 +168,10 @@
<input type=button value=Search title="Search for location" onclick=getSearchLocation() />
<input type=button id=refreshmap title="Reset map view" value=Reset style=margin-left:5px onclick=refreshMap(false,true) />
</div>
<div class="auto-style1" style="height: 100%; float: right">
<div class="auto-style1" style=height:100%;float:right>
<div style="height:100%;width:4px;float:right;background-color:#ffffff"></div>
<div class=h2 style="height:100%;float:right">&nbsp;</div>
<div style=float:right id=devListToolbarView>
<div style="float:right;display:none" id=devListToolbarView>
View
<select id=viewselect onchange=onDeviceViewChange()>
<option value=1>Columns</option>
@ -327,7 +332,7 @@
<input type=submit id=p5fileCatchAllSubmit style="display:none" />
</form>
-->
<div id="p5PublicShare" style="display:none;width:100%;padding:4px;overflow:auto;-webkit-user-select:none;background-color:lightsteelblue">This files is shared publically, click "link" to get public url.</div>
<div id="p5PublicShare" style="display:none;width:100%;overflow:auto;-webkit-user-select:none;background-color:lightsteelblue"><div style="padding:4px">This files is shared publically, click "link" to get public url.</div></div>
<div id="bigok" style="width:256px;overflow:hidden;position:absolute;left:337px;top:20px;text-align:center;font-size:1600%;color:#AAAAAA;display:none"><b>&checkmark;</b></div>
<div id="bigfail" style="width:256px;overflow:hidden;position:absolute;left:337px;top:20px;text-align:center;font-size:1600%;color:#AAAAAA;display:none"><b>&#10007;</b></div>
<span id="p5files"></span>
@ -474,10 +479,13 @@
<tr>
<td style="padding-top:2px;padding-bottom:2px;background:#C0C0C0">
<div style="float:right;text-align:right">
<input id="id_tfxkeysbutton" type="button" onkeypress="return false" onkeydown="return false" class="bottombutton" value="Intel (F10 = ESC+[OM)" title="Toggle F1 to F10 keys emulation type" onclick="termToggleFx()">&nbsp;
<input id="id_ttypebutton" type="button" onkeypress="return false" onkeydown="return false" class="bottombutton" value="Extended Ascii" title="Toggle terminal emulation type" onclick="termToggleType()">&nbsp;&nbsp;
<select id="specialkeylist" onkeypress="return false"></select>
<input id="specialkeylistinput" type="button" onkeypress="return false" class="bottombutton" value="Send" title="Send the selected special key" onclick="sendSpecialKey()" />&nbsp;
<span id="terminalSettingsButtons" style="display:none">
<input id="id_tcrbutton" type="button" onkeypress="return false" onkeydown="return false" class="bottombutton" value="CR+LF" title="Toggle what the return key will send" onclick="termToggleCr()">
<input id="id_tfxkeysbutton" type="button" onkeypress="return false" onkeydown="return false" class="bottombutton" value="Intel (F10 = ESC+[OM)" title="Toggle F1 to F10 keys emulation type" onclick="termToggleFx()">
<input id="id_ttypebutton" type="button" onkeypress="return false" onkeydown="return false" class="bottombutton" value="Extended Ascii" title="Toggle terminal emulation type" onclick="termToggleType()">
</span>
<select id="specialkeylist" onkeypress="return false" style="margin-left:5px"></select>
<input id="specialkeylistinput" type="button" onkeypress="return false" class="bottombutton" value="Send" title="Send the selected special key" onclick="sendSpecialKey()" />
</div>
<div>
&nbsp;
@ -807,7 +815,7 @@
var multiDesktopFilter = null;
var serverPublicNamePort = "{{{serverDnsName}}}:{{{serverPublicPort}}}";
var amtScanResults = null;
var debugmode = false;
var debugmode = 0;
var clickOnce = (((features & 256) != 0) && detectClickOnce());
var attemptWebRTC = ((features & 128) != 0);
var webPageFullScreen = getstore('webPageFullScreen', true);
@ -826,7 +834,7 @@
// Check if we are in debug mode
args = parseUriArgs();
debugmode = (args.debug == 1);
debugmode = args.debug;
if (args.webrtc != null) { attemptWebRTC = (args.webrtc == 1); }
QV('p13AutoConnect', debugmode); // Files
QV('autoconnectbutton2', debugmode); // Terminal
@ -874,6 +882,9 @@
// Display the page devices
onSortSelectChange();
onSearchInputChanged();
for (var j = 1; j < 5; j++) { Q('devViewButton' + j).classList.remove('viewSelectorSel'); }
Q('devViewButton' + Q('viewselect').value).classList.add('viewSelectorSel');
// Setup upload drag & drop
Q('p5filetable').addEventListener("drop", p5fileDragDrop, false);
@ -1464,7 +1475,10 @@
return;
}
function onDeviceViewChange() {
function onDeviceViewChange(i) {
if (i != null) { Q('viewselect').value = i; }
for (var j = 1; j < 5; j++) { Q('devViewButton' + j).classList.remove('viewSelectorSel'); }
Q('devViewButton' + Q('viewselect').value).classList.add('viewSelectorSel');
putstore("deviceView", Q('viewselect').value);
putstore("viewsize", Q('sizeselect').value);
updateDevices();
@ -1572,7 +1586,8 @@
QV('devMapToolbar', view == 4);
QV('devListToolbarSize', view == 3);
QV('NoMeshesPanel', meshcount == 0);
QV('devListToolbarView', (meshcount != 0) && (nodes.length > 0));
//QV('devListToolbarView', (meshcount != 0) && (nodes.length > 0));
QV('devListToolbarViewIcons', (meshcount != 0) && (nodes.length > 0));
QV('devListToolbarSort', (meshcount != 0) && (nodes.length > 0) && (view < 4));
if ((meshcount == 0) || (nodes.length == 0)) { view = 1; sort = 0; }
if (view == 4) {
@ -1647,7 +1662,9 @@
var nodestate = NodeStateStr(nodes[i]);
if ((!nodes[i].conn) || (nodes[i].conn == 0)) { icon += ' gray'; }
if (view == 1) {
r += '<div id=devs style=display:inline-block;width:301px;height:50px;padding-top:1px;padding-bottom:1px><div style=width:22px;height:50%;float:left;padding-top:12px><input class="' + nodes[i].meshid + ' DeviceCheckbox" onclick=p1updateInfo() value=devid_' + nodes[i]._id + ' type=checkbox></div><div style=height:100%;cursor:pointer onclick=gotoDevice(\'' + nodes[i]._id + '\')><div class="i' + icon + '" style=width:50px;float:left></div><div style=height:100%><div class=g1></div><div class=e2><div class=e1 title="' + title + '">' + name + '</div><div>' + nodestate + '</div></div><div class=g2></div></div></div></div>';
var xw = Math.floor(Q('xdevices').clientWidth / 301);
xw = 301 + Math.floor((Q('xdevices').clientWidth - (xw * 301)) / xw);
r += '<div id=devs style=display:inline-block;width:' + xw + 'px;height:50px;padding-top:1px;padding-bottom:1px><div style=width:22px;height:50%;float:left;padding-top:12px><input class="' + nodes[i].meshid + ' DeviceCheckbox" onclick=p1updateInfo() value=devid_' + nodes[i]._id + ' type=checkbox></div><div style=height:100%;cursor:pointer onclick=gotoDevice(\'' + nodes[i]._id + '\')><div class="i' + icon + '" style=width:50px;float:left></div><div style=height:100%><div class=g1></div><div class=e2><div class=e1 style=width:' + (xw - 100) + 'px title="' + title + '">' + name + '</div><div>' + nodestate + '</div></div><div class=g2></div></div></div></div>';
} else if (view == 2) {
r += '<tr><td><div id=devs class=bar18 style=height:18px;width:100%;font-size:medium>';
r += '<div style=width:22px;float:left;background-color:white><input class="' + nodes[i].meshid + ' DeviceCheckbox" onclick=p1updateInfo() value=devid_' + nodes[i]._id + ' type=checkbox></div>';
@ -1749,7 +1766,13 @@
// Take care of KVM surfaces in desktop view mode
if (view == 3) {
// Figure out and adjust the size to fill the width of the div
var vsize = [{ x: 180, y: 101 }, { x: 302, y: 169 }, { x: 454, y: 255 }][Q('sizeselect').selectedIndex];
var realw = vsize.x + 2, tw = Q('xdevices').clientWidth - 30, xw = Math.floor(tw / realw);
xw = realw + Math.floor((tw - (xw * realw)) / xw);
vsize.y = vsize.y * (xw / vsize.x);
vsize.x = xw;
for (var i in multiDesktop) { multiDesktop[i].xxdelete = true; }
for (var i in kvmDivs) {
var id = kvmDivs[i], shortid = id.split('/')[2], desk = multiDesktop[id];
@ -2045,7 +2068,7 @@
x += "<div id=agins_windows>To add a new computer to mesh " + EscapeHtml(mesh.name) + ", download the mesh agent and install it the computer to manage. This agent has server and mesh information embedded within it.<br /><br />";
x += addHtmlValue('Mesh Agent', '<a href="meshagents?id=3&meshid=' + meshid.split('/')[2] + '" target="_blank" title="32bit version of the MeshAgent">Windows (.exe)</a>');
x += addHtmlValue('Mesh Agent', '<a href="meshagents?id=4&meshid=' + meshid.split('/')[2] + '" target="_blank" title="64bit version of the MeshAgent">Windows x64 (.exe)</a>');
if (debugmode == true) { x += addHtmlValue('Settings File', '<a href="meshsettings?id=' + meshid.split('/')[2] + '" target="_blank">' + EscapeHtml(mesh.name) + ' settings (.msh)</a>'); }
if (debugmode > 0) { x += addHtmlValue('Settings File', '<a href="meshsettings?id=' + meshid.split('/')[2] + '" target="_blank">' + EscapeHtml(mesh.name) + ' settings (.msh)</a>'); }
x += "</div>";
// Linux agent install
@ -3845,6 +3868,7 @@
var hwonline = ((terminalNode.conn & 6) != 0); // If CIRA (2) or AMT (4) connected, enable hardware terminal
QE('connectbutton2h', hwonline);
// Key buttons
QE('ctrlcbutton', termState);
QE('ctrlxbutton', termState);
QE('escbutton', termState);
@ -3852,6 +3876,14 @@
QE('pastebutton', termState);
QE('specialkeylist', termState);
QE('specialkeylistinput', termState);
// Terminal settings
QV('terminalSettingsButtons', (terminal) && (terminal.contype == 2));
if (terminal) {
Q('id_ttypebutton').value = terminalEmulations[terminal.m.terminalEmulation];
Q('id_tfxkeysbutton').value = fxEmulations[terminal.m.fxEmulation];
Q('id_tcrbutton').value = (terminal.m.lineFeed == '\r\n')?'CR+LF':'LF';
}
}
// Called when the terminal state changes
@ -3903,6 +3935,7 @@
terminal.Start(terminalNode._id);
terminal.contype = 1;
terminal.m.terminalEmulation = 0;
terminal.m.fxEmulation = 0;
Q('id_ttypebutton').value = terminalEmulations[0];
}
} else {
@ -3929,6 +3962,12 @@
Q('id_tfxkeysbutton').blur(); // Deselect the connect button so the button does not get key presses.
}
function termToggleCr() {
if (!terminal || xxdialogMode) return;
if (terminal.m.lineFeed == '\n') { terminal.m.lineFeed = '\r\n'; } else { terminal.m.lineFeed = '\n'; }
Q('id_tcrbutton').value = (terminal.m.lineFeed == '\r\n') ? 'CR+LF' : 'LF';
}
function termSendKey(key, id) {
if (!terminal || xxdialogMode) return;
terminal.m.TermSendKey(key);
@ -4514,7 +4553,7 @@
if (consoleNode.consoleText == null) { consoleNode.consoleText = ''; }
if (samenode == false) {
QH('p15agentConsoleText', consoleNode.consoleText);
Q('p15agentConsole').scrollTop = Q('p15agentConsole').scrollHeight;
Q('p15agentConsoleText').scrollTop = Q('p15agentConsoleText').scrollHeight;
}
var online = ((consoleNode.conn & 1) != 0)?true:false;
QH('p15statetext', online?"Mesh Agent is online":"Mesh Agent is offline");
@ -4541,7 +4580,7 @@
var v = Q('p15consoleText').value, t = '<div style=color:green>&gt; ' + EscapeHtml(Q('p15consoleText').value) + '<br/></div>';
Q('p15agentConsoleText').innerHTML += t;
consoleNode.consoleText += t;
Q('p15agentConsole').scrollTop = Q('p15agentConsole').scrollHeight;
Q('p15agentConsoleText').scrollTop = Q('p15agentConsoleText').scrollHeight;
Q('p15consoleText').value = '';
// Send the command to the mesh agent
@ -4563,7 +4602,7 @@
if (node.consoleText == null) { node.consoleText = data; } else { node.consoleText += data; }
if (consoleNode == node) {
Q('p15agentConsoleText').innerHTML += data;
Q('p15agentConsole').scrollTop = Q('p15agentConsole').scrollHeight;
Q('p15agentConsoleText').scrollTop = Q('p15agentConsoleText').scrollHeight;
}
}
@ -5879,7 +5918,7 @@
if (((b & 8) || x) && f) f(x, t);
}
function center() { QS('dialog').left = ((((getDocWidth() - 400) / 2)) + "px"); deskAdjust(); deskAdjust(); drawDeviceTimeline(); }
function center() { QS('dialog').left = ((((getDocWidth() - 400) / 2)) + "px"); deskAdjust(); deskAdjust(); drawDeviceTimeline(); updateDevicesEx(); }
function messagebox(t, m) { QH('id_dialogMessage', m); setDialogMode(1, t, 1); }
function statusbox(t, m) { QH('id_dialogMessage', m); setDialogMode(1, t); }
function getDocWidth() { if (window.innerWidth) return window.innerWidth; if (document.documentElement && document.documentElement.clientWidth && document.documentElement.clientWidth != 0) return document.documentElement.clientWidth; return document.getElementsByTagName('body')[0].clientWidth; }