Web UI improvements, map fix.
This commit is contained in:
parent
3d98fe3770
commit
feb427add6
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "meshcentral",
|
||||
"version": "0.2.0-k",
|
||||
"version": "0.2.0-m",
|
||||
"keywords": [
|
||||
"Remote Management",
|
||||
"Intel AMT",
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -397,10 +397,10 @@
|
|||
</td>
|
||||
</tr>
|
||||
<tr id=deskarea3>
|
||||
<td id=deskarea3x style=background:black;text-align:center;height:400px;position:relative>
|
||||
<div id=DeskFocus style="color:transparent;border:3px dotted rgba(255,0,0,.2);position:absolute;border-radius:5px" oncontextmenu="return false" onmousedown=dmousedown(event) onmouseup=dmouseup(event) onmousemove=dmousemove(event)></div>
|
||||
<div id=DeskParent>
|
||||
<canvas id=Desk width=640 height=200 style="width:100%;-ms-touch-action:none;margin-left:0px" oncontextmenu="return false" onmousedown=dmousedown(event) onmouseup=dmouseup(event) onmousemove=dmousemove(event) onmousewheel=dmousewheel(event)></canvas>
|
||||
<td id=deskarea3x style="background:black;text-align:center;position:relative;overflow:hidden">
|
||||
<div id=DeskFocus style="overflow:hidden;color:transparent;border:3px dotted rgba(255,0,0,.2);position:absolute;border-radius:5px" oncontextmenu="return false" onmousedown=dmousedown(event) onmouseup=dmouseup(event) onmousemove=dmousemove(event)></div>
|
||||
<div id=DeskParent style="overflow:hidden">
|
||||
<canvas id=Desk width=640 height=480 style="overflow:hidden;width:100%;-ms-touch-action:none;margin-left:0px" oncontextmenu="return false" onmousedown=dmousedown(event) onmouseup=dmouseup(event) onmousemove=dmousemove(event) onmousewheel=dmousewheel(event)></canvas>
|
||||
</div>
|
||||
<div id=DeskTools style="position:absolute;width:400px;height:100%;background-color:gray;top:0;right:0;border-left:2px solid lightgray;display:none">
|
||||
<a id=DeskToolsRefreshButton style="float:right;padding:3px;cursor:pointer" onclick="refreshDeskTools()">Refresh</a>
|
||||
|
@ -946,6 +946,7 @@
|
|||
QV('page_leftbar', true);
|
||||
}
|
||||
drawDeviceTimeline();
|
||||
deskAdjust();
|
||||
QV('body', true);
|
||||
}
|
||||
|
||||
|
@ -1777,13 +1778,13 @@
|
|||
multiDesktop[id] = desktop;
|
||||
desktop = desktopNode = currentNode = null;
|
||||
// Setup a replacement desktop
|
||||
QH('DeskParent', '<canvas id="Desk" width="640" height="200" style="width:100%;-ms-touch-action:none;margin-left:0px" oncontextmenu="return false" onmousedown=dmousedown(event) onmouseup=dmouseup(event) onmousemove=dmousemove(event)></canvas>');
|
||||
QH('DeskParent', '<canvas id="Desk" width="640" height="480" style="width:100%;-ms-touch-action:none;margin-left:0px" oncontextmenu="return false" onmousedown=dmousedown(event) onmouseup=dmouseup(event) onmousemove=dmousemove(event)></canvas>');
|
||||
} else {
|
||||
// This is a new device, create a canvas for it.
|
||||
var c = document.createElement('canvas');
|
||||
c.setAttribute('id', 'kvmid_' + shortid);
|
||||
c.setAttribute('width', 640);
|
||||
c.setAttribute('height', 200);
|
||||
c.setAttribute('height', 480);
|
||||
c.setAttribute('oncontextmenu', 'return false');
|
||||
c.setAttribute('style', 'background-color:black;width:' + vsize.x + 'px;height:' + vsize.y + 'px');
|
||||
c.setAttribute('onclick', 'toggleKvmDevice(\'' + id + '\')');
|
||||
|
@ -1797,6 +1798,7 @@
|
|||
// If a device is no longer viewed, disconnect it.
|
||||
if (multiDesktop[i].xxdelete == true) { multiDesktop[i].Stop(); delete multiDesktop[i]; }
|
||||
}
|
||||
deskAdjust();
|
||||
} else {
|
||||
disconnectAllKvmFunction();
|
||||
Q('autoConnectDesktopCheckbox').checked = false;
|
||||
|
@ -2611,7 +2613,7 @@
|
|||
}
|
||||
map_cm_nodemenu_items.forEach(function (item){
|
||||
if (item.text == 'Zoom-in to extent' || item.text == 'Zoom-out to extent') { item.data = feature; }
|
||||
else { item.data = feature.getId(); }
|
||||
else { if (item != "-") { item.data = feature.getId(); } }
|
||||
});
|
||||
xxmap.contextmenu.extend(map_cm_nodemenu_items);
|
||||
}
|
||||
|
@ -3464,7 +3466,7 @@
|
|||
delete multiDesktop[currentNode._id];
|
||||
} else {
|
||||
// Device is not already connected, just setup a blank canvas
|
||||
QH('DeskParent', '<canvas id=Desk width=640 height=200 style="width:100%;-ms-touch-action:none;margin-left:0px" oncontextmenu="return false" onmousedown=dmousedown(event) onmouseup=dmouseup(event) onmousemove=dmousemove(event)></canvas>');
|
||||
QH('DeskParent', '<canvas id=Desk width=640 height=480 style="width:100%;-ms-touch-action:none;margin-left:0px" oncontextmenu="return false" onmousedown=dmousedown(event) onmouseup=dmouseup(event) onmousemove=dmousemove(event)></canvas>');
|
||||
desktopNode = currentNode;
|
||||
}
|
||||
// Setup the mouse wheel
|
||||
|
@ -3473,6 +3475,7 @@
|
|||
}
|
||||
desktopNode = currentNode;
|
||||
updateDesktopButtons();
|
||||
deskAdjust();
|
||||
|
||||
// On some browsers like IE, we can't save screen shots. Hide the scheenshot/capture buttons.
|
||||
if (!Q('Desk')['toBlob']) { QV('deskSaveBtn', false); }
|
||||
|
@ -3653,6 +3656,7 @@
|
|||
toggleFullScreen();
|
||||
}
|
||||
deskAdjust();
|
||||
deskAdjust();
|
||||
}
|
||||
|
||||
function deskToggleFocus() {
|
||||
|
@ -3679,10 +3683,11 @@
|
|||
QS('Desk')['margin-top'] = x + 'px';
|
||||
QS('Desk')['margin-bottom'] = x + 'px';
|
||||
} else {
|
||||
var mw = 9999, mh = (Math.max(document.documentElement.clientHeight, window.innerHeight || 0) - (webPageFullScreen?276:290));
|
||||
if (desktop) { mw = (desktop.m.width / desktop.m.height) * mh; }
|
||||
document.documentElement.style.overflow = 'auto';
|
||||
QS('deskarea3x').height = (desktop)?'40px':'400px';
|
||||
QS('Desk')['max-height'] = null;
|
||||
QS('Desk')['max-width'] = null;
|
||||
QS('Desk')['max-height'] = mh + 'px';
|
||||
QS('Desk')['max-width'] = mw + 'px';
|
||||
QS('Desk')['margin-top'] = '0';
|
||||
QS('Desk')['margin-bottom'] = '0';
|
||||
}
|
||||
|
@ -5874,7 +5879,7 @@
|
|||
if (((b & 8) || x) && f) f(x, t);
|
||||
}
|
||||
|
||||
function center() { QS('dialog').left = ((((getDocWidth() - 400) / 2)) + "px"); deskAdjust(); drawDeviceTimeline(); }
|
||||
function center() { QS('dialog').left = ((((getDocWidth() - 400) / 2)) + "px"); deskAdjust(); deskAdjust(); drawDeviceTimeline(); }
|
||||
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; }
|
||||
|
|
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
@ -6,7 +6,81 @@
|
|||
<meta name="viewport" content="user-scalable=1.0,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0" />
|
||||
<meta name="apple-mobile-web-app-capable" content="yes" />
|
||||
<meta name="format-detection" content="telephone=no" />
|
||||
<link type="text/css" href="styles/style.css" media="screen" rel="stylesheet" title="CSS" />
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
color: black;
|
||||
font-size: 13px;
|
||||
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
|
||||
background-color: #d3d9d6;
|
||||
}
|
||||
|
||||
#container {
|
||||
background-color: #fff;
|
||||
margin: 0 auto;
|
||||
border-top: 0;
|
||||
border-right: 1px solid #b7b7b7;
|
||||
border-bottom: 0;
|
||||
border-left: 1px solid #b7b7b7;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#masthead {
|
||||
width: auto;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
overflow: auto;
|
||||
text-align: right;
|
||||
background-color: #036;
|
||||
}
|
||||
|
||||
#column_l {
|
||||
position: relative;
|
||||
float: left;
|
||||
margin: 0;
|
||||
padding: 0 15px;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
#footer {
|
||||
clear: both;
|
||||
overflow: auto;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
background-color: #113962;
|
||||
padding-top: 5px;
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
|
||||
.style3 {
|
||||
text-align: center;
|
||||
color: white;
|
||||
background-color: #808080;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
#footer {
|
||||
clear: both;
|
||||
overflow: auto;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
background-color: #113962;
|
||||
padding-top: 5px;
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
|
||||
#footer a {
|
||||
color: #fff;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
#footer a:hover {
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
}
|
||||
</style>
|
||||
<script type="text/javascript" src="scripts/common-0.0.1.js"></script>
|
||||
<title>MeshCentral - Login</title>
|
||||
</head>
|
||||
|
@ -21,16 +95,19 @@
|
|||
<strong><font style="font-size:14px;font-family:Arial,Helvetica,sans-serif">{{{title2}}}</font></strong>
|
||||
</div>
|
||||
</div>
|
||||
<div id=page_content style="max-height:calc(100vh-138px)">
|
||||
<div id=page_content style="max-height:calc(100vh-108px)">
|
||||
<div id=topbar class="noselect style3" style="height:24px;position:relative">
|
||||
<div title="Toggle full width" style="cursor:pointer;color:white;position:absolute;top:3px;right:6px" onclick="toggleFullScreen(1)">↔</div>
|
||||
</div>
|
||||
<div id=column_l>
|
||||
<h1>Welcome</h1>
|
||||
<p>Connect to your home or office devices from anywhere in the world using MeshCentral, the remote monitoring and management web site. You will need to download and install a special management agent on your computers. Once installed, each mesh enabled computer will show up in the "My Devices" section of this web site and you will be able to monitor them, power them on and off and take control of them.</p>
|
||||
<table style=width:100%>
|
||||
<table id="centralTable" style=width:100%>
|
||||
<tr>
|
||||
<td style=width:500px valign=top>
|
||||
<img alt="" height=310 src=images/mainwelcome.png width=359 style="margin-left:70px" />
|
||||
<td id="welcomeimage" align="center">
|
||||
<img alt="" height=310 src=images/mainwelcome.png width=359 />
|
||||
</td>
|
||||
<td>
|
||||
<td align="center">
|
||||
<div id=loginpanel style="background-color: #979797;border-radius:16px;width:300px;padding:16px;text-align:center;display:none">
|
||||
<form action="login" method=post>
|
||||
<div id=message1>
|
||||
|
@ -173,6 +250,10 @@
|
|||
var newAccountPass = parseInt('{{{newAccountPass}}}');
|
||||
var emailCheck = ('{{{emailcheck}}}' == 'true');
|
||||
var features = parseInt('{{{features}}}');
|
||||
var webPageFullScreen = getstore('webPageFullScreen', true);
|
||||
if (webPageFullScreen == 'false') { webPageFullScreen = false; }
|
||||
if (webPageFullScreen == 'true') { webPageFullScreen = true; }
|
||||
toggleFullScreen();
|
||||
|
||||
function startup() {
|
||||
if ((features & 32) == 0) {
|
||||
|
@ -316,13 +397,58 @@
|
|||
if (((b & 8) || x) && f) f(x, t);
|
||||
}
|
||||
|
||||
function center() { QS('dialog').left = ((((getDocWidth() - 400) / 2)) + "px"); }
|
||||
// Toggle the web page to full screen
|
||||
function toggleFullScreen(toggle) {
|
||||
if (toggle === 1) { webPageFullScreen = !webPageFullScreen; putstore('webPageFullScreen', webPageFullScreen); }
|
||||
if (webPageFullScreen == false) {
|
||||
QS('container').width = '960px';
|
||||
QS('container')["min-width"] = '960px';
|
||||
QS('container')['border-right'] = '1px solid #b7b7b7';
|
||||
QS('container')['border-left'] = '1px solid #b7b7b7';
|
||||
QS('container')['overflow'] = 'hidden';
|
||||
QS('column_l').height = '';
|
||||
QS('column_l').width = '930px';
|
||||
QS('column_l')["overflow-y"] = '';
|
||||
QS('column_l')["max-height"] = 'calc(100vh - 111px)';
|
||||
QS('column_l')["min-width"] = '';
|
||||
QS('masthead')["width"] = '960px';
|
||||
} else {
|
||||
QS('container').width = '100%';
|
||||
QS('container')['min-width'] = '';
|
||||
QS('container')['border-right'] = '0';
|
||||
QS('container')['border-left'] = '0';
|
||||
QS('container')['overflow'] = 'hidden';
|
||||
QS('column_l').height = 'calc(100vh - 135px)';
|
||||
QS('column_l').width = '';
|
||||
QS('column_l')["overflow-y"] = 'auto';
|
||||
QS('column_l')["max-height"] = 'calc(100vh - 111px)';
|
||||
QS('column_l')["min-width"] = '';
|
||||
QS('masthead')["width"] = '100%';
|
||||
}
|
||||
QV('body', true);
|
||||
center();
|
||||
}
|
||||
|
||||
function center() {
|
||||
var w = getDocWidth();
|
||||
QS('dialog').left = ((((w - 400) / 2)) + "px");
|
||||
QV('welcomeimage', (webPageFullScreen == false) || (w > 800));
|
||||
if (webPageFullScreen == false) {
|
||||
QS('centralTable')['margin-top'] = '';
|
||||
} else {
|
||||
var h = (Q('column_l').clientHeight / 2) - 250;
|
||||
if (h < 0) h = 0;
|
||||
QS('centralTable')['margin-top'] = h + 'px';
|
||||
}
|
||||
}
|
||||
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; }
|
||||
function haltEvent(e) { if (e.preventDefault) e.preventDefault(); if (e.stopPropagation) e.stopPropagation(); return false; }
|
||||
function haltReturn(e) { if (e.keyCode == 13) { haltEvent(e); } }
|
||||
function validateEmail(v) { var emailReg = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/; return emailReg.test(v); }
|
||||
function putstore(name, val) { try { if (typeof (localStorage) === 'undefined') return; localStorage.setItem(name, val); } catch (e) { } }
|
||||
function getstore(name, val) { try { if (typeof (localStorage) === 'undefined') return val; var v = localStorage.getItem(name); if ((v == null) || (v == null)) return val; return v; } catch (e) { return val; } }
|
||||
|
||||
</script>
|
||||
</body>
|
||||
|
|
Loading…
Reference in New Issue