mirror of
https://github.com/vector-im/hydrogen-web.git
synced 2024-12-22 19:14:52 +01:00
finish log viewer details panel
This commit is contained in:
parent
6b527cef65
commit
17c2fad4b4
@ -27,12 +27,17 @@
|
||||
|
||||
aside {
|
||||
grid-area: details;
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
aside h3 {
|
||||
word-wrap: anywhere;
|
||||
}
|
||||
|
||||
aside p {
|
||||
margin: 2px 0;
|
||||
}
|
||||
|
||||
aside .values li span {
|
||||
word-wrap: ;
|
||||
word-wrap: anywhere;
|
||||
@ -41,17 +46,26 @@
|
||||
aside .values {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
border: 1px solid lightgray;
|
||||
}
|
||||
|
||||
aside .values span {
|
||||
width: 50%;
|
||||
aside .values span.key {
|
||||
width: 30%;
|
||||
display: block;
|
||||
}
|
||||
|
||||
aside .values span.value {
|
||||
width: 70%;
|
||||
display: block;
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
aside .values li {
|
||||
display: flex;
|
||||
border: ;
|
||||
border-bottom: 1px solid lightgray;
|
||||
}
|
||||
|
||||
aside .values li:not(:first-child) {
|
||||
border-top: 1px solid lightgray;
|
||||
}
|
||||
|
||||
nav {
|
||||
|
@ -6,7 +6,9 @@ const main = document.querySelector("main");
|
||||
let selectedItemNode;
|
||||
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) {
|
||||
selectedItemNode.classList.remove("selected");
|
||||
selectedItemNode = null;
|
||||
@ -30,12 +32,18 @@ document.querySelector("main").addEventListener("click", event => {
|
||||
});
|
||||
|
||||
function showItemDetails(item, parent) {
|
||||
const parentOffset = itemStart(parent) ? `${itemStart(item) - itemStart(parent)}ms` : "none";
|
||||
const aside = t.aside([
|
||||
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]) => {
|
||||
return t.li([
|
||||
t.span(normalizeValueKey(key)),
|
||||
t.span(value)
|
||||
t.span({className: "key"}, normalizeValueKey(key)),
|
||||
t.span({className: "value"}, value)
|
||||
]);
|
||||
}))
|
||||
]);
|
||||
|
Loading…
Reference in New Issue
Block a user