external/MeshCentral
1
0
Fork 0
mirror of https://github.com/Ylianst/MeshCentral.git synced 2025-03-09 15:40:18 +00:00
Code Issues Releases Wiki Activity

[ENH] Add toggle switch for new MeshCentral UI in settings and top header of the classic UI

Browse source
This commit is contained in:
kambereBr 2025-01-06 03:21:51 +02:00
parent 95729d2a88
commit e3b1ad436c
2 changed files with 42 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

15
public/styles/style.css
View file

@ -263,6 +263,12 @@ body {
right: 3px;
}
.textnewui {
color: white;
font-weight: bold;
padding: 2px;
}
.LogoffLinkColor {
color:white;
}
@ -2896,7 +2902,7 @@ a {
width: 28px;
}
.viewSelector3 {
.viewSelector3, .uiSelector7 {
margin-left: 2px;
margin-top: 2px;
background: url(../images/views.png) -56px 0px;
@ -2996,6 +3002,13 @@ a {
background-color: #AAA;
}
.uiSelector_end {
width: 32px;
height: 32px;
float: left;
margin: 3px;
}
.uiSelectorSel {
background-color: #BBB;
opacity: 0.8;

28
views/default.handlebars
View file

@ -164,6 +164,16 @@
<div id=notificationCount onclick="clickNotificationIcon()" class="unselectable" style="display: none;" title="Click to view current notifications">0</div>
</div>
<p id="logoutControl"><span id=logoutControlSpan class="logoncontrolspan"></span><span id=idleTimeoutNotify style="color:yellow"></span></p>
<div style="position:absolute;right:0;margin-right:8px;cursor:pointer;">
<table>
<tr>
<td class="textnewui"><label class="form-check-label text-white" for="inputUiViewMode">Try the new MeshCentral UI &ensp;</label></td>
<td class="form-check form-switch">
<input class="form-check-input" type="checkbox" id="inputUiViewMode" onchange="toggleBootstrapUIMode()">
</td>
</tr>
</table>
</div>
</div>
<div id="page_leftbar">
<div style="height:16px"></div>
@ -199,11 +209,13 @@
<div tabindex=0 id=uiViewButton1 class=uiSelector onclick=userInterfaceSelectMenu(1) title="Left bar interface" onkeypress="if (event.key == 'Enter') userInterfaceSelectMenu(1)"><div class="uiSelector1"></div></div>
<div tabindex=0 id=uiViewButton2 class=uiSelector onclick=userInterfaceSelectMenu(2) title="Top bar interface" onkeypress="if (event.key == 'Enter') userInterfaceSelectMenu(2)"><div class="uiSelector2"></div></div>
<div tabindex=0 id=uiViewButton3 class=uiSelector onclick=userInterfaceSelectMenu(3) title="Fixed width interface" onkeypress="if (event.key == 'Enter') userInterfaceSelectMenu(3)"><div class="uiSelector3"></div></div>
<div tabindex=0 id=uiViewButton7 class=uiSelector onclick=toggleBootstrapUIMode() title="Toggle Bootstrap UI" onkeypress="if (event.key == 'Enter') toggleBootstrapUIMode()"><div class="uiSelector7"></div></div>
</td>
<td>
<div tabindex=0 id=uiViewButton6 class=uiSelector onclick="showNotes(false)" title="Personal Notes" onkeypress="if (event.key == 'Enter') showNotes(false)"><div class="uiSelector6"></div></div>
<div tabindex=0 id=uiViewButton4 class=uiSelector onclick=toggleNightMode() title="Toggle night mode" onkeypress="if (event.key == 'Enter') toggleNightMode()"><div class="uiSelector4"></div></div>
<div tabindex=0 id=uiViewButton5 class=uiSelector onclick=toggleFooterBarMode() title="Toggle footer bar" onkeypress="if (event.key == 'Enter') toggleFooterBarMode()"><div class="uiSelector5"></div></div>
<div class=uiSelector_end>&nbsp;</div>
</td>
</tr>
</table>
@ -1572,6 +1584,7 @@
var deskAspectRatio = 0;
try { deskAspectRatio = parseInt(getstore('deskAspectRatio', '0')); } catch (ex) { }
var uiMode = parseInt(getstore('uiMode', 1));
// var uiViewMode = parseInt(getstore('uiViewMode', 0));
var webPageStackMenu = false;
var webPageFullScreen = true;
var nightMode = setNightMode();
@ -2182,6 +2195,21 @@
QV('body', true);
}
function saveUserInterfaceMode() {
var nUiViewMode = 0;
if (Q('ui1').checked) { nUiViewMode = 1; }
putstore('uiViewMode', nUiViewMode);
}
function toggleBootstrapUIMode() {
if (xxdialogMode) return;
var uiViewMode = getstore('uiViewMode', '0');
var x = '<input type=radio id=ui0 name=uiradio value=0 ' + ((uiViewMode == 0)?'checked':'') + '><label for=ui0>' + "Classic" + '</label><br>';
x += '<input type=radio id=ui1 name=uiradio value=1 ' + ((uiViewMode == 1)?'checked':'') + '><label for=ui1>' + "Modern" + '</label><br>';
setDialogMode(2, "User Interface", 3, saveUserInterfaceMode, x);
QV('uiMenu', false);
}
function getNodeFromId(id) { if (nodes != null) { for (var i in nodes) { if (nodes[i]._id == id) return nodes[i]; } } return null; }
function reload() {
var x = window.location.href;