Skip to content

Commit

Permalink
[BUGFIX] consoleView
Browse files Browse the repository at this point in the history
  • Loading branch information
@genofire
genofire committed May 30, 2017
1 parent 7aa5896 commit d5179c7
Show file tree
Hide file tree
Showing 4 changed files with 92 additions and 38 deletions.
55 changes: 38 additions & 17 deletions webroot/css/console.css
View file
Expand Up @@ -14,28 +14,49 @@
.console {
font-family: monospace;
white-space: pre;
font-size: 14px;
}
.console .cmd {
min-height: 22px;
clear: both;
.console {
width: 100%;
border-spacing: 0px;
}
.console .cmd > .time, .console .cmd .host{
display: inline-block;
color: #009ee0;
.console > tr {
clear: both;
border-spacing: 0px;

width: 15%;
}
.console .cmd > div {
background-color: #ccc;
margin-bottom: 3px;
.console > tr > td {
width: 100%;
padding: 0px;
border-spacing: 0px;
height: 18px;
}
.console .cmd .status {
width: 15%;
height: 20px;
.console > tr.cmd > td {
margin-top: 3px;
}
.console .cmd > div > div {
clear: both;
.console > tr:not(.cmd) > td {
margin-top: 0px;
}
.console table,
.console table tr,
.console table td {
width: 100%;
padding: 0px;
margin: 0px;
border-collapse: collapse;
}
.console .time, .console .host{
color: #009ee0;
width: 1%;
}
.console .status {
text-align: right;
height: 18px;
}

.console table {
background-color: #ccc;
}
.console .cmd div .status {
width: 20px;
.console table .status {
width: 18px;
}
6 changes: 4 additions & 2 deletions webroot/css/main.css
View file
Expand Up @@ -30,17 +30,19 @@ h1 {
border-bottom: 4px solid #dc0067;
}
header {
background-color: #373636;
max-width: 100%;
width: 100%;
height: 50px;
}
header > div {
display: inline-block;
}
nav {
background-color: #373636;
position: fixed;
display: inline-block;
font-weight: 700;
width: 100%;
height: 50px;
}
nav ul {
padding: 0;
Expand Down
57 changes: 38 additions & 19 deletions webroot/js/gui_console.js
View file
Expand Up @@ -11,6 +11,7 @@ const guiConsole = {};
let container = null,
el = null,
output = null,
editing = false,
ownfilter = false;

function createID () {
Expand Down Expand Up @@ -84,15 +85,22 @@ const guiConsole = {};

function createRow (cmd) {
const row = {
'clients': {},
'clientsContainer': document.createElement('div'),
'clientsEl': {},
'el': document.createElement('div')
};
'clients': {},
'clientsContainer': document.createElement('tr'),
'clientsEl': {},
'el': document.createElement('tr')
},
tab = domlib.newAt(row.clientsContainer, 'td'),
clientRow = domlib.newAt(tab, 'table');

tab.setAttribute('colspan', '3');


if (cmd.cmd === '' && cmd.timestemp === 0) {
row.el.innerHTML = '\n' +
const initRow = domlib.newAt(row.el, 'td');

initRow.setAttribute('colspan', '3');
initRow.innerHTML = '\n' +
' _______ ________ __\n' +
' | |.-----.-----.-----.| | | |.----.| |_\n' +
' | - || _ | -__| || | | || _|| _|\n' +
Expand All @@ -110,22 +118,21 @@ const guiConsole = {};

return row;
}
row.timestemp = domlib.newAt(row.el, 'span');
row.cmd = domlib.newAt(row.el, 'span');
row.status = domlib.newAt(row.el, 'span');
row.timestemp = domlib.newAt(row.el, 'td');
row.cmd = domlib.newAt(row.el, 'td');
row.status = domlib.newAt(row.el, 'td');

row.el.classList.add('cmd');
row.timestemp.classList.add('time');
row.status.classList.add('status');

if (cmd.clients) {
Object.keys(cmd.clients).forEach((addr) => {
console.log(cmd, row, addr);
const clientEl = domlib.newAt(row.clientsContainer, 'div'),
const clientEl = domlib.newAt(clientRow, 'tr'),
clients = {
'host': domlib.newAt(clientEl, 'span'),
'result': domlib.newAt(clientEl, 'span'),
'status': domlib.newAt(clientEl, 'span')
'host': domlib.newAt(clientEl, 'td'),
'result': domlib.newAt(clientEl, 'td'),
'status': domlib.newAt(clientEl, 'td')
};

clients.host.classList.add('host');
Expand All @@ -134,11 +141,11 @@ const guiConsole = {};
row.clientsEl[addr] = clientEl;
row.clients[addr] = clients;
});
row.cmd.addEventListener('click', () => {
row.el.addEventListener('click', () => {
if (row.clientsContainer.parentElement) {
row.el.removeChild(row.clientsContainer);
row.el.parentElement.removeChild(row.clientsContainer);
} else {
row.el.appendChild(row.clientsContainer);
row.el.parentElement.insertBefore(row.clientsContainer, row.el.nextSibling);
}
});
}
Expand All @@ -150,6 +157,9 @@ const guiConsole = {};
}

function update () {
if (editing) {
return;
}
let cmds = store.getCMDs();

if (ownfilter) {
Expand Down Expand Up @@ -185,11 +195,14 @@ const guiConsole = {};
return 0;
}

return cmds[aID].timestemp - cmds[bID].timestemp;
return new Date(cmds[aID].timestemp) - new Date(cmds[bID].timestemp);
}).
forEach((id) => {
if (cmds[id] && !cmdRow[id].el.parentElement) {
output.appendChild(cmdRow[id].el);
if (cmdRow[id].clientsContainer.parentElement) {
cmdRow[id].el.parentElement.insertBefore(cmdRow[id].clientsContainer, cmdRow[id].el.nextSibling);
}
}
});
}
Expand All @@ -215,7 +228,7 @@ const guiConsole = {};
'timestemp': 0
});

output = domlib.newAt(el, 'div');
output = domlib.newAt(el, 'table');
output.classList.add('console');

const prompt = domlib.newAt(el, 'div'),
Expand All @@ -239,6 +252,12 @@ const guiConsole = {};
socket.sendcmd(cmd);
promptInput.value = '';
});
promptInput.addEventListener('focusin', () => {
editing = true;
});
promptInput.addEventListener('focusout', () => {
editing = false;
});

filterBtn.classList.add('btn');
filterBtn.innerHTML = 'Show all';
Expand Down
12 changes: 12 additions & 0 deletions webroot/js/gui_list.js
View file
Expand Up @@ -332,6 +332,12 @@ const guiList = {};
cell2.addEventListener('dblclick', () => {
sortTable(cell2);
});
nodeidFilter.addEventListener('focusin', () => {
editing = true;
});
nodeidFilter.addEventListener('focusout', () => {
editing = false;
});


cell3.classList.add('sortable');
Expand All @@ -341,6 +347,12 @@ const guiList = {};
cell3.addEventListener('dblclick', () => {
sortTable(cell3);
});
hostnameFilter.addEventListener('focusin', () => {
editing = true;
});
hostnameFilter.addEventListener('focusout', () => {
editing = false;
});

cell4.innerHTML = 'Freq';

Expand Down

0 comments on commit d5179c7

Please sign in to comment.