mirrors/vector-im-hydrogen-web
1
0
Fork 0
mirror of https://github.com/vector-im/hydrogen-web.git synced 2024-12-23 11:35:04 +01:00
Code Issues Projects Releases Wiki Activity

finish log viewer details panel

Browse Source
This commit is contained in:
Bruno Windels 2021-02-18 11:08:43 +01:00
parent 6b527cef65
commit 17c2fad4b4
2 changed files with 29 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
scripts/logviewer/index.html
View File

@ -27,12 +27,17 @@
aside { aside {
grid-area: details; grid-area: details;
padding: 8px;
} }
aside h3 { aside h3 {
word-wrap: anywhere; word-wrap: anywhere;
} }
aside p {
margin: 2px 0;
}
aside .values li span { aside .values li span {
word-wrap: ; word-wrap: ;
word-wrap: anywhere; word-wrap: anywhere;
@ -41,17 +46,26 @@
aside .values { aside .values {
list-style: none; list-style: none;
padding: 0; padding: 0;
border: 1px solid lightgray;
} }
aside .values span { aside .values span.key {
width: 50%; width: 30%;
display: block; display: block;
} }
aside .values span.value {
width: 70%;
display: block;
padding-left: 10px;
}
aside .values li { aside .values li {
display: flex; display: flex;
border: ; }
border-bottom: 1px solid lightgray;
aside .values li:not(:first-child) {
border-top: 1px solid lightgray;
} }
nav { nav {

14
scripts/logviewer/main.js
View File

@ -6,7 +6,9 @@ const main = document.querySelector("main");
let selectedItemNode; let selectedItemNode;
let rootItem; let rootItem;
document.querySelector("main").addEventListener("click", event => { const logLevels = [undefined, "All", "Debug", "Detail", "Info", "Warn", "Error", "Fatal", "Off"];
main.addEventListener("click", event => {
if (selectedItemNode) { if (selectedItemNode) {
selectedItemNode.classList.remove("selected"); selectedItemNode.classList.remove("selected");
selectedItemNode = null; selectedItemNode = null;
@ -30,12 +32,18 @@ document.querySelector("main").addEventListener("click", event => {
}); });
function showItemDetails(item, parent) { function showItemDetails(item, parent) {
const parentOffset = itemStart(parent) ? `${itemStart(item) - itemStart(parent)}ms` : "none";
const aside = t.aside([ const aside = t.aside([
t.h3(itemCaption(item)), t.h3(itemCaption(item)),
t.p([t.strong("Parent offset: "), parentOffset]),
t.p([t.strong("Log level: "), logLevels[itemLevel(item)]]),
t.p([t.strong("Error: "), itemError(item) ? `${itemError(item).name} ${itemError(item).stack}` : "none"]),
t.p([t.strong("Child count: "), itemChildren(item) ? `${itemChildren(item).length}` : "none"]),
t.p(t.strong("Values:")),
t.ul({class: "values"}, Object.entries(itemValues(item)).map(([key, value]) => { t.ul({class: "values"}, Object.entries(itemValues(item)).map(([key, value]) => {
return t.li([ return t.li([
t.span(normalizeValueKey(key)), t.span({className: "key"}, normalizeValueKey(key)),
t.span(value) t.span({className: "value"}, value)
]); ]);
})) }))
]); ]);