Refactor plugin admin views to a more simplistic, reusable, multiple view approach
This commit is contained in:
Ryan Blenis
parent
55b0f27b12
commit
470ce54413
|
|
@ -199,22 +199,6 @@ module.exports.pluginHandler = function (parent) {
|
|||
return isValid;
|
||||
};
|
||||
|
||||
obj.getPlugins = function(func) {
|
||||
var plugins = parent.db.getPlugins();
|
||||
if (typeof plugins == 'undefined' || plugins.length == 0) {
|
||||
return null;
|
||||
}
|
||||
|
||||
plugins.forEach(function(p, x){
|
||||
// check semantic version
|
||||
console.log('FOREACH PLUGIN', p, x);
|
||||
// callbacks to new versions
|
||||
|
||||
});
|
||||
|
||||
return plugins;
|
||||
}
|
||||
|
||||
obj.getPluginConfig = function(configUrl) {
|
||||
return new Promise(function(resolve, reject) {
|
||||
var https = require('https');
|
||||
|
|
|
|||
|
|
@ -233,7 +233,7 @@ body {
|
|||
}
|
||||
|
||||
/* #UserDummyMenuSpan, */
|
||||
#MainSubMenuSpan, #MeshSubMenuSpan, #UserSubMenuSpan, #ServerSubMenuSpan, #MainMenuSpan, #MainSubMenu, #MeshSubMenu, #UserSubMenu, #ServerSubMenu, #UserDummyMenu {
|
||||
#MainSubMenuSpan, #MeshSubMenuSpan, #UserSubMenuSpan, #ServerSubMenuSpan, #MainMenuSpan, #MainSubMenu, #MeshSubMenu, #UserSubMenu, #ServerSubMenu, #UserDummyMenu, #PluginSubMenu {
|
||||
width: 100%;
|
||||
height: 24px;
|
||||
color: white;
|
||||
|
|
@ -244,6 +244,10 @@ body {
|
|||
display: none;
|
||||
}
|
||||
|
||||
.menu_stack #PluginSubMenu {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#MainMenuSpan {
|
||||
display: table;
|
||||
}
|
||||
|
|
@ -2629,50 +2633,7 @@ a {
|
|||
margin: 50px auto;
|
||||
}
|
||||
|
||||
.pluginOverlayBg {
|
||||
width: 95%; /* Full width (cover the whole page) */
|
||||
height: 95%; /* Full height (cover the whole page) */
|
||||
margin: 10px;
|
||||
background-color: rgba(0,0,0,0.8); /* Black background with opacity */
|
||||
z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
|
||||
position: absolute;
|
||||
cursor: pointer; /* Add a pointer on hover */
|
||||
filter:blur(4px);
|
||||
-o-filter:blur(4px);
|
||||
-ms-filter:blur(4px);
|
||||
-moz-filter:blur(4px);
|
||||
-webkit-filter:blur(4px);
|
||||
.pluginContent {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.pluginOverlay {
|
||||
width: 95%; /* Full width (cover the whole page) */
|
||||
height: 95%; /* Full height (cover the whole page) */
|
||||
margin: 10px;
|
||||
background-color: #FFFFFF; /* Black background with opacity */
|
||||
z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
|
||||
position: absolute;
|
||||
cursor: pointer; /* Add a pointer on hover */
|
||||
}
|
||||
.pluginOverlayContent {
|
||||
width: 100%; /* Full width (cover the whole page) */
|
||||
height: 100%; /* Full height (cover the whole page) */
|
||||
background-color: #FFFFFF; /* Black background with opacity */
|
||||
z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.pluginTitleBar {
|
||||
padding: 4px;
|
||||
height: 25px;
|
||||
border-bottom: double;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.pluginCloseBtn {
|
||||
border: none;
|
||||
outline: none;
|
||||
cursor: pointer;
|
||||
float: right;
|
||||
position: relative;
|
||||
padding: 0;
|
||||
}
|
||||
|
|
@ -57,6 +57,9 @@
|
|||
<div id="cxtermnorm" class="cmtext" onclick="cmtermaction(1,event)">Normal Connect</div>
|
||||
<div id="cxtermps" class="cmtext" onclick="cmtermaction(2,event)">PowerShell Connect</div>
|
||||
</div>
|
||||
<div id="pluginTabContextMenu" class="contextMenu noselect" style="display:none;min-width:0px">
|
||||
<div id="cxclose" class="cmtext" onclick="pluginTabClose(event)">Close Tab</div>
|
||||
</div>
|
||||
<!-- main page -->
|
||||
<div id=container>
|
||||
<div id="notifiyBox" class="notifiyBox" style="display:none"></div>
|
||||
|
|
@ -160,6 +163,11 @@
|
|||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
<div id=PluginSubMenuSpan>
|
||||
<table id=PluginSubMenu cellpadding=0 cellspacing=0 class=style1>
|
||||
<tr><td onclick="goPlugin(-1)" onkeypress="if (event.key == 'Enter') goPlugin(-1)" class="topbar_td style3x">Home</td></tr>
|
||||
</table>
|
||||
</div>
|
||||
<div id=UserDummyMenuSpan>
|
||||
<table id=UserDummyMenu cellpadding=0 cellspacing=0 class=style1>
|
||||
<tr><td class=style3 style=""> </td></tr>
|
||||
|
|
@ -2300,7 +2308,6 @@
|
|||
break;
|
||||
}
|
||||
case 'updatePluginList': {
|
||||
// @Ylianst - Do we need a rights check here?
|
||||
installedPluginList = message.event.list;
|
||||
updatePluginList();
|
||||
break;
|
||||
|
|
@ -3519,6 +3526,12 @@
|
|||
contextmenudiv.style.left = event.pageX + 'px';
|
||||
contextmenudiv.style.top = event.pageY + 'px';
|
||||
contextmenudiv.style.display = 'block';
|
||||
} else if (elem && elem != null && elem.classList.contains('pluginTab')) {
|
||||
contextelement = elem;
|
||||
var contextmenudiv = document.getElementById('pluginTabContextMenu');
|
||||
contextmenudiv.style.left = event.pageX + 'px';
|
||||
contextmenudiv.style.top = event.pageY + 'px';
|
||||
contextmenudiv.style.display = 'block';
|
||||
} else {
|
||||
while (elem && elem != null && elem.id != 'devs') { elem = elem.parentElement; }
|
||||
if (!elem || elem == null) return true;
|
||||
|
|
@ -3590,10 +3603,21 @@
|
|||
connectTerminal(null, 1, { powershell: (action == 2) });
|
||||
}
|
||||
|
||||
function pluginTabClose() {
|
||||
var pluginTab = contextelement;
|
||||
var pname = pluginTab.getAttribute('x-data-plugin-sname');
|
||||
var pdiv = Q('plugin-'+pname);
|
||||
pdiv.parentNode.removeChild(pdiv);
|
||||
pluginTab.parentNode.removeChild(pluginTab);
|
||||
QV('p7', true);
|
||||
goPlugin(-1);
|
||||
}
|
||||
|
||||
function hideContextMenu() {
|
||||
QV('contextMenu', false);
|
||||
QV('meshContextMenu', false);
|
||||
QV('termShellContextMenu', false);
|
||||
QV('pluginTabContextMenu', false);
|
||||
contextelement = null;
|
||||
}
|
||||
|
||||
|
|
@ -9412,7 +9436,7 @@
|
|||
// Fetch the server timeline stats if needed
|
||||
if ((x == 40) && (serverTimelineStats == null)) { refreshServerTimelineStats(); }
|
||||
|
||||
if (x == 7) refreshPluginLatest(); else noGoPlugin();
|
||||
if (x == 7) { refreshPluginLatest(); QV('PluginSubMenuSpan', true); goPlugin(-1); } else { noGoPlugin(); }
|
||||
|
||||
// Update the web page title
|
||||
if ((currentNode) && (x >= 10) && (x < 20)) {
|
||||
|
|
@ -9543,37 +9567,66 @@
|
|||
}
|
||||
|
||||
function goPlugin(pname, title) {
|
||||
let xwin = `<div class="pluginTitleBar"><span>${title}</span><span class="pluginCloseBtn"><button onclick="return noGoPlugin(this);">X</button></span></div>`;
|
||||
let holder = Q('PluginSubMenu').querySelectorAll('tr')[0];
|
||||
let loadedPluginsTDs = holder.querySelectorAll('td');
|
||||
var found = false;
|
||||
loadedPluginsTDs.forEach((p) => {
|
||||
p.classList.remove('style3sel');
|
||||
p.classList.add('style3x');
|
||||
var tname = p.getAttribute('x-data-plugin-sname');
|
||||
if (tname != null) { Q('plugin-'+tname).style.display = 'none'; }
|
||||
if (tname == pname) {
|
||||
// show existing tab / content
|
||||
p.classList.remove('style3x');
|
||||
p.classList.add('style3sel');
|
||||
QS('p7').display = 'none';
|
||||
Q('plugin-'+tname).style.display = '';
|
||||
found = true;
|
||||
}
|
||||
});
|
||||
if (pname == -1) { // go gome
|
||||
QV('p7', true);
|
||||
let homeTab = loadedPluginsTDs[0];
|
||||
homeTab.classList.add('style3sel');
|
||||
homeTab.classList.remove('style3x');
|
||||
found = true;
|
||||
}
|
||||
if (found) return;
|
||||
|
||||
Q('PluginSubMenu').style.display = 'block';
|
||||
let sif = document.createElement('td');
|
||||
sif.setAttribute('x-data-plugin-sname', pname);
|
||||
sif.classList.add('topbar_td');
|
||||
sif.classList.add('style3sel');
|
||||
sif.classList.add('pluginTab');
|
||||
sif.setAttribute('onclick', 'goPlugin("' + pname + '", "' + title + '")');
|
||||
sif.setAttribute('onkeypress', 'if (event.key == "Enter") goPlugin("' + pname + '", "' + title + '")');
|
||||
sif.innerHTML = title;
|
||||
holder.append(sif);
|
||||
|
||||
let dif = document.createElement('div');
|
||||
let cdif = document.createElement('div');
|
||||
dif.classList.add('pluginOverlay');
|
||||
dif.innerHTML = xwin;
|
||||
dif.setAttribute('id', 'plugin-'+pname);
|
||||
dif.classList.add('pluginContent');
|
||||
let pif = document.createElement('iframe');
|
||||
pif.src = '/pluginadmin.ashx?pin='+pname;
|
||||
pif.setAttribute('frameBorder', '0');
|
||||
pif.style.width = '100%';
|
||||
pif.style.height = '100%';
|
||||
pif.setAttribute('frameBorder', '0');
|
||||
cdif.classList.add('pluginOverlayContent');
|
||||
cdif.append(pif);
|
||||
dif.append(cdif);
|
||||
let x = Q('p7');
|
||||
x.parentNode.insertBefore(dif, x.nextSibling);
|
||||
Q('p7').classList.add('pluginOverlayBg');
|
||||
dif.append(pif);
|
||||
let x = Q('column_l_bottomgap');
|
||||
x.parentNode.insertBefore(dif, x.previousSibling);
|
||||
QS('p7').display = 'none';
|
||||
|
||||
}
|
||||
|
||||
function noGoPlugin(el) {
|
||||
if (el == null) {
|
||||
var boxes = document.querySelectorAll('.pluginOverlay');
|
||||
for (const b in Object.values(boxes)) {
|
||||
boxes[b].parentNode.removeChild(boxes[b]);
|
||||
}
|
||||
Q('p7').classList.remove('pluginOverlayBg');
|
||||
return;
|
||||
}
|
||||
var box = document.querySelector('.pluginOverlay').closest(".pluginOverlay");
|
||||
box.parentNode.removeChild(box);
|
||||
Q('p7').classList.remove('pluginOverlayBg');
|
||||
QV('PluginSubMenuSpan', false);
|
||||
let loadedPluginsTDs = Q('PluginSubMenu').querySelectorAll('td');
|
||||
loadedPluginsTDs.forEach((p) => {
|
||||
var tname = p.getAttribute('x-data-plugin-sname');
|
||||
if (tname != null) Q('plugin-'+tname).style.display = 'none';
|
||||
});
|
||||
}
|
||||
|
||||
// Generic methods
|
||||
|
|
|
|||
|
|
@ -3194,7 +3194,7 @@ module.exports.CreateWebServer = function (parent, db, args, certificates) {
|
|||
if (domain == null) { res.sendStatus(404); return; }
|
||||
if ((!req.session) || (req.session == null) || (!req.session.userid)) { res.sendStatus(401); return; }
|
||||
var user = obj.users[req.session.userid];
|
||||
if ((user == null) || ((user.siteadmin & 0xFFFFFFFF) == 0)) { res.sendStatus(401); return; }
|
||||
if (user == null) { res.sendStatus(401); return; }
|
||||
|
||||
parent.pluginHandler.handleAdminReq(req, res, user, obj);
|
||||
}
|
||||
|
|
@ -3204,7 +3204,7 @@ module.exports.CreateWebServer = function (parent, db, args, certificates) {
|
|||
if (domain == null) { res.sendStatus(404); return; }
|
||||
if ((!req.session) || (req.session == null) || (!req.session.userid)) { res.sendStatus(401); return; }
|
||||
var user = obj.users[req.session.userid];
|
||||
if ((user == null) || ((user.siteadmin & 0xFFFFFFFF) == 0)) { res.sendStatus(401); return; }
|
||||
if (user == null) { res.sendStatus(401); return; }
|
||||
|
||||
parent.pluginHandler.handleAdminPostReq(req, res, user, obj);
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue