105 lines
2.2 KiB
JavaScript
105 lines
2.2 KiB
JavaScript
/* exported gui,router */
|
|
/* globals socket,notify,domlib,guiList,guiMap,guiStats,guiNode,guiConsole */
|
|
|
|
const gui = {},
|
|
router = new Navigo(null, true, '#');
|
|
|
|
|
|
(function init () {
|
|
'use strict';
|
|
|
|
const GUI_RENDER_DEBOUNCER_TIME = 100;
|
|
|
|
let currentView = {
|
|
'bind': function bind () {
|
|
console.warn('Do not run dummies');
|
|
},
|
|
// eslint-disable-next-line func-name-matching
|
|
'render': function renderDummy () {
|
|
console.warn('DO not run dummies');
|
|
}
|
|
};
|
|
|
|
function renderView () {
|
|
// eslint-disable-next-line prefer-destructuring
|
|
const status = document.getElementsByClassName('status')[0];
|
|
|
|
if (!status) {
|
|
console.log('unable to render, render later');
|
|
window.setTimeout(renderView, GUI_RENDER_DEBOUNCER_TIME);
|
|
|
|
return;
|
|
}
|
|
status.classList.remove('connecting', 'offline');
|
|
if (socket.readyState !== 1) {
|
|
let statusClass = 'offline';
|
|
|
|
// eslint-disable-next-line no-magic-numbers
|
|
if (socket.readyState === 0 || socket.readyState === 2) {
|
|
statusClass = 'connecting';
|
|
}
|
|
status.classList.add(statusClass);
|
|
}
|
|
|
|
// eslint-disable-next-line prefer-destructuring
|
|
notify.bind(document.getElementsByClassName('notifications')[0]);
|
|
|
|
currentView.render();
|
|
router.resolve();
|
|
}
|
|
|
|
function setView (toView) {
|
|
currentView = toView;
|
|
const main = document.querySelector('main');
|
|
|
|
domlib.removeChildren(main);
|
|
currentView.bind(main);
|
|
currentView.render();
|
|
}
|
|
|
|
router.on({
|
|
'/console': function routerConsole () {
|
|
setView(guiConsole);
|
|
},
|
|
'/list': function routerList () {
|
|
setView(guiList);
|
|
},
|
|
'/map': function routerMap () {
|
|
setView(guiMap);
|
|
},
|
|
'/n/:nodeID': {
|
|
'as': 'node',
|
|
// eslint-disable-next-line func-name-matching
|
|
'uses': function routerNode (params) {
|
|
guiNode.setNodeID(params.nodeID.toLowerCase());
|
|
setView(guiNode);
|
|
}
|
|
},
|
|
'/statistics': function routerStats () {
|
|
setView(guiStats);
|
|
}
|
|
|
|
});
|
|
router.on(() => {
|
|
router.navigate('/list');
|
|
});
|
|
|
|
gui.render = function render () {
|
|
let timeout = false;
|
|
|
|
function reset () {
|
|
timeout = null;
|
|
}
|
|
|
|
if (timeout) {
|
|
console('skip rendering, because to often');
|
|
window.clearTimeout(timeout);
|
|
} else {
|
|
renderView();
|
|
}
|
|
timeout = window.setTimeout(reset, GUI_RENDER_DEBOUNCER_TIME);
|
|
};
|
|
|
|
window.onload = gui.render;
|
|
})();
|