website_next: part 3

This commit is contained in:
nym21
2026-07-06 11:15:39 +02:00
parent eee1a10d2a
commit 3f9edb211e
103 changed files with 1829 additions and 2040 deletions
+16 -42
View File
@@ -1,29 +1,9 @@
import { createUsdAmount, renderUsdAmount } from "../../usd/index.js";
import { formatDateTime } from "./format.js";
import { createBlockTitle } from "./title.js";
/** @typedef {import("../../modules/brk-client/index.js").BlockInfoV1} Block */
/** @param {number} unixSeconds */
function formatDateTime(unixSeconds) {
return new Date(unixSeconds * 1_000).toLocaleString(undefined, {
dateStyle: "medium",
timeStyle: "medium",
});
}
/** @param {number} height */
function createHeightElement(height) {
const element = document.createElement("span");
const prefix = document.createElement("span");
const value = document.createElement("span");
prefix.dataset.dim = "";
prefix.textContent = `#${"0".repeat(Math.max(0, 7 - String(height).length))}`;
value.textContent = String(height);
element.append(prefix, value);
return element;
}
/** @param {string} hash */
function createHashElement(hash) {
const element = document.createElement("span");
@@ -41,41 +21,35 @@ function createHashElement(hash) {
return element;
}
/** @param {number} height */
function createTitle(height) {
const label = document.createElement("span");
const value = document.createElement("span");
label.dataset.titleLabel = "";
value.dataset.titleHeight = "";
label.textContent = "Block";
value.append(createHeightElement(height));
return [label, value];
}
export function createBlockHeader() {
/** @param {Node[]} [actions] */
export function createBlockHeader(actions = []) {
const element = document.createElement("header");
const titleRow = document.createElement("div");
const main = document.createElement("div");
const title = document.createElement("h1");
const side = document.createElement("div");
const actionList = document.createElement("div");
const date = document.createElement("time");
const meta = document.createElement("div");
const hash = document.createElement("p");
const price = createUsdAmount("output", 0, {
tone: "positive",
});
main.dataset.blockMain = "";
titleRow.dataset.blockTitle = "";
side.dataset.blockSide = "";
actionList.dataset.blockActions = "";
date.dataset.blockDate = "";
meta.dataset.blockMeta = "";
hash.dataset.blockHashLine = "";
titleRow.append(title, date);
meta.append(hash, price);
element.append(titleRow, meta);
actionList.append(...actions);
side.append(date, price, actionList);
main.append(title, hash);
titleRow.append(main, side);
element.append(titleRow);
/** @param {Block} block */
function update(block) {
title.replaceChildren(...createTitle(block.height));
title.replaceChildren(...createBlockTitle(block.height));
date.dateTime = new Date(block.timestamp * 1_000).toISOString();
date.textContent = formatDateTime(block.timestamp);
hash.replaceChildren(createHashElement(block.id));