better formatted time and ability to view messages in large mode

This commit is contained in:
metacryst
2026-02-26 17:30:21 -06:00
parent 402a99d55c
commit b908354c04

View File

@@ -1,7 +1,7 @@
class Dashboard extends Shadow {
COL = {
time: 17,
time: 14,
fname: 6,
lname: 6,
email: 20,
@@ -18,6 +18,34 @@ class Dashboard extends Shadow {
.overflowY("hidden");
}
spawnModal(msg) {
let div = document.createElement("div")
div.classList.add("modal")
div.innerText = msg
div.style.left = "50vw"
div.style.top = "50vh"
div.style.padding = "5em"
div.style.position = "fixed"
div.style.backgroundColor = "var(--accent)"
div.style.color = "var(--main)"
div.style.transform = "translate(-50%, -50%)"
document.body.appendChild(div)
let p = document.createElement("p")
p.innerText = "X"
p.color = "red"
p.style.position = "absolute"
p.style.top = "1em"
p.style.right = "2em"
p.style.cursor = "pointer"
p.onClick((finished) => {
if(finished) {
p.parentElement.remove()
}
})
div.appendChild(p)
}
render() {
VStack(() => {
@@ -43,7 +71,7 @@ class Dashboard extends Shadow {
p("Last").width(this.COL.lname, pct).fontWeight("bold").whiteSpace("nowrap");
p("Email").width(this.COL.email, pct).fontWeight("bold").whiteSpace("nowrap");
p("Phone").width(this.COL.phone, pct).fontWeight("bold").whiteSpace("nowrap");
p("Message").width(this.COL.message, pct).fontWeight("bold").whiteSpace("nowrap");
p("Message").width(this.COL.message, pct).fontWeight("bold").whiteSpace("nowrap")
p("County").width(this.COL.county, pct).fontWeight("bold").whiteSpace("nowrap");
})
.width(95, pct)
@@ -51,13 +79,32 @@ class Dashboard extends Shadow {
.gap(8);
global.currentNetwork.data.contact.forEach((entry) => {
HStack(() => {
this.cell("time", entry.time);
this.cell("time", entry.time.replace(/:\d{6}(?=am|pm)/i, '')
.replace('-', '   ')
.replace(/(\d{1,2}:\d{2})(am|pm)/i, (_, time, meridiem) => {
const [h, m] = time.split(':');
return `${h.padStart(2, '0')}:${m}${meridiem.toLowerCase()}`;
}));
this.cell("fname", entry.fname);
this.cell("lname", entry.lname);
this.cell("email", entry.email);
this.cell("phone", entry.phone);
this.cell("message", entry.message);
this.cell("message", entry.message)
.cursor("pointer")
.onHover(function (hovering) {
if(hovering) {
this.style.outline = "1px solid black"
} else {
this.style.outline = ""
}
})
.onClick((done) => {
if(done) {
this.spawnModal(entry.message)
}
})
this.cell("county", entry.county ?? "Not Specified");
})
.width(95, pct)
@@ -85,7 +132,12 @@ class Dashboard extends Shadow {
global.currentNetwork.data.join.forEach((entry) => {
HStack(() => {
this.cell("time", entry.time);
this.cell("time", entry.time.replace(/:\d{6}(?=am|pm)/i, '')
.replace('-', '   ')
.replace(/(\d{1,2}:\d{2})(am|pm)/i, (_, time, meridiem) => {
const [h, m] = time.split(':');
return `${h.padStart(2, '0')}:${m}${meridiem.toLowerCase()}`;
}));
this.cell("fname", entry.fname);
this.cell("lname", entry.lname);
this.cell("email", entry.email);