web: fix error in lockdown safari + charts: update instead of setData when possible

This commit is contained in:
nym21
2025-06-16 18:20:56 +02:00
parent 098f6de047
commit 985e961876
9 changed files with 262 additions and 216 deletions

View File

@@ -1,8 +1,8 @@
// @ts-check
/**
* @import { Option, PartialChartOption, ChartOption, AnyPartialOption, ProcessedOptionAddons, OptionsTree, SimulationOption, AnySeriesBlueprint, ChartableIndex, SeriesType } from "./options"
* @import { Valued, SingleValueData, CandlestickData, ChartData, OHLCTuple, Series, ISeries, LineData, BaselineData, PartialLineStyleOptions, PartialBaselineStyleOptions, PartialCandlestickStyleOptions } from "../packages/lightweight-charts/wrapper"
* @import { Option, PartialChartOption, ChartOption, AnyPartialOption, ProcessedOptionAddons, OptionsTree, SimulationOption, AnySeriesBlueprint, SeriesType } from "./options"
* @import { Valued, SingleValueData, CandlestickData, OHLCTuple, Series, ISeries, LineData, BaselineData, PartialLineStyleOptions, PartialBaselineStyleOptions, PartialCandlestickStyleOptions } from "../packages/lightweight-charts/wrapper"
* @import * as _ from "../packages/ufuzzy/v1.0.18/types"
* @import { Signal, Signals, Accessor } from "../packages/solid-signals/wrapper";
* @import { DateIndex, DecadeIndex, DifficultyEpoch, Index, HalvingEpoch, Height, MonthIndex, P2PK33Index, P2PK65Index, P2PKHIndex, P2SHIndex, P2MSIndex, P2AIndex, P2TRIndex, P2WPKHIndex, P2WSHIndex, TxIndex, InputIndex, OutputIndex, VecId, WeekIndex, YearIndex, VecIdToIndexes, QuarterIndex, EmptyOutputIndex, OpReturnIndex, UnknownOutputIndex } from "./vecid-to-indexes"
@@ -63,14 +63,14 @@ function initPackages() {
const imports = {
async signals() {
return import("../packages/solid-signals/wrapper.js").then(
(d) => d.default,
(d) => d.default
);
},
async lightweightCharts() {
return window.document.fonts.ready.then(() =>
import("../packages/lightweight-charts/wrapper.js").then(
(d) => d.default,
),
(d) => d.default
)
);
},
async leanQr() {
@@ -78,7 +78,7 @@ function initPackages() {
},
async ufuzzy() {
return import("../packages/ufuzzy/v1.0.18/script.js").then(
({ default: d }) => d,
({ default: d }) => d
);
},
};
@@ -585,7 +585,7 @@ function createUtils() {
window.history.pushState(
null,
"",
`${pathname}?${urlParams.toString()}`,
`${pathname}?${urlParams.toString()}`
);
} catch (_) {}
},
@@ -602,7 +602,7 @@ function createUtils() {
window.history.replaceState(
null,
"",
`${pathname}?${urlParams.toString()}`,
`${pathname}?${urlParams.toString()}`
);
} catch (_) {}
},
@@ -988,16 +988,22 @@ function createUtils() {
* @param {string} key
*/
read(key) {
return localStorage.getItem(key);
try {
return localStorage.getItem(key);
} catch (_) {
return null;
}
},
/**
* @param {string} key
* @param {string | boolean | null | undefined} value
*/
write(key, value) {
value !== undefined && value !== null
? localStorage.setItem(key, String(value))
: localStorage.removeItem(key);
try {
value !== undefined && value !== null
? localStorage.setItem(key, String(value))
: localStorage.removeItem(key);
} catch (_) {}
},
/**
* @param {string} key
@@ -1185,7 +1191,7 @@ function createUtils() {
},
/**
* @param {string} v
* @returns {ChartableIndex}
* @returns {Index}
*/
deserialize(v) {
switch (v) {
@@ -1204,7 +1210,7 @@ function createUtils() {
case "decade":
return /** @satisfies {DecadeIndex} */ (1);
default:
throw Error("Unsupported");
throw Error("todo");
}
},
},
@@ -1235,8 +1241,8 @@ function createUtils() {
today.getUTCDate(),
0,
0,
0,
),
0
)
);
},
/**
@@ -1329,7 +1335,7 @@ function createUtils() {
*/
function getNumberOfDaysBetweenTwoDates(oldest, youngest) {
return Math.round(
Math.abs((youngest.getTime() - oldest.getTime()) / date.ONE_DAY_IN_MS),
Math.abs((youngest.getTime() - oldest.getTime()) / date.ONE_DAY_IN_MS)
);
}
@@ -1547,7 +1553,7 @@ function createVecsResources(signals, utils) {
const fetchedRecord = signals.createSignal(
/** @type {Map<string, {loading: boolean, at: Date | null, vec: Signal<T[] | null>}>} */ (
new Map()
),
)
);
return {
@@ -1595,7 +1601,7 @@ function createVecsResources(signals, utils) {
index,
id,
from,
to,
to
)
);
fetched.at = new Date();
@@ -1856,7 +1862,7 @@ function initWebSockets(signals, utils) {
window.document.addEventListener(
"visibilitychange",
reinitWebSocketIfDocumentNotHidden,
reinitWebSocketIfDocumentNotHidden
);
window.document.addEventListener("online", reinitWebSocket);
@@ -1865,7 +1871,7 @@ function initWebSockets(signals, utils) {
ws?.close();
window.document.removeEventListener(
"visibilitychange",
reinitWebSocketIfDocumentNotHidden,
reinitWebSocketIfDocumentNotHidden
);
window.document.removeEventListener("online", reinitWebSocket);
live.set(false);
@@ -1891,7 +1897,7 @@ function initWebSockets(signals, utils) {
symbol: ["BTC/USD"],
interval: 1440,
},
}),
})
);
});
@@ -1910,7 +1916,6 @@ function initWebSockets(signals, utils) {
high: Number(high),
low: Number(low),
close: Number(close),
value: Number(close),
};
candle && callback({ ...candle });
@@ -1921,7 +1926,7 @@ function initWebSockets(signals, utils) {
/** @type {ReturnType<typeof createWebsocket<CandlestickData>>} */
const kraken1dCandle = createWebsocket((callback) =>
krakenCandleWebSocketCreator(callback),
krakenCandleWebSocketCreator(callback)
);
kraken1dCandle.open();
@@ -1980,7 +1985,7 @@ function main() {
}
const frame = window.document.getElementById(
/** @type {string} */ (input.value),
/** @type {string} */ (input.value)
);
if (!frame) {
@@ -2078,23 +2083,23 @@ function main() {
function initDark() {
const preferredColorSchemeMatchMedia = window.matchMedia(
"(prefers-color-scheme: dark)",
"(prefers-color-scheme: dark)"
);
const dark = signals.createSignal(
preferredColorSchemeMatchMedia.matches,
preferredColorSchemeMatchMedia.matches
);
preferredColorSchemeMatchMedia.addEventListener(
"change",
({ matches }) => {
dark.set(matches);
},
}
);
return dark;
}
const dark = initDark();
const qrcode = signals.createSignal(
/** @type {string | null} */ (null),
/** @type {string | null} */ (null)
);
function createLastHeightResource() {
@@ -2105,7 +2110,7 @@ function main() {
lastHeight.set(h);
},
/** @satisfies {Height} */ (5),
"height",
"height"
);
}
fetchLastHeight();
@@ -2149,10 +2154,10 @@ function main() {
const owner = signals.getOwner();
const chartOption = signals.createSignal(
/** @type {ChartOption | null} */ (null),
/** @type {ChartOption | null} */ (null)
);
const simOption = signals.createSignal(
/** @type {SimulationOption | null} */ (null),
/** @type {SimulationOption | null} */ (null)
);
let previousElement = /** @type {HTMLElement | undefined} */ (
@@ -2198,9 +2203,9 @@ function main() {
webSockets,
vecsResources,
vecIdToIndexes,
}),
),
),
})
)
)
);
}
firstTimeLoadingChart = false;
@@ -2221,8 +2226,8 @@ function main() {
vecsResources,
option,
vecIdToIndexes,
}),
),
})
)
);
}
firstTimeLoadingTable = false;
@@ -2246,9 +2251,9 @@ function main() {
signals,
utils,
vecsResources,
}),
),
),
})
)
)
);
}
firstTimeLoadingSimulation = false;
@@ -2277,7 +2282,7 @@ function main() {
createMobileSwitchEffect();
utils.dom.onFirstIntersection(elements.aside, () =>
signals.runWithOwner(owner, initSelectedFrame),
signals.runWithOwner(owner, initSelectedFrame)
);
}
initSelected();
@@ -2355,7 +2360,7 @@ function main() {
if (indexes?.length) {
const maxIndex = Math.min(
(order || indexes).length - 1,
minIndex + RESULTS_PER_PAGE - 1,
minIndex + RESULTS_PER_PAGE - 1
);
list = Array(maxIndex - minIndex + 1);
@@ -2431,7 +2436,7 @@ function main() {
haystack,
needle,
undefined,
infoThresh,
infoThresh
);
if (!result?.[0]?.length || !result?.[1]) {
@@ -2439,7 +2444,7 @@ function main() {
haystack,
needle,
outOfOrder,
infoThresh,
infoThresh
);
}
@@ -2448,7 +2453,7 @@ function main() {
haystack,
needle,
outOfOrder,
infoThresh,
infoThresh
);
}
@@ -2457,7 +2462,7 @@ function main() {
haystack,
needle,
outOfOrder,
infoThresh,
infoThresh
);
}
@@ -2466,7 +2471,7 @@ function main() {
haystack,
needle,
undefined,
infoThresh,
infoThresh
);
}
@@ -2475,7 +2480,7 @@ function main() {
haystack,
needle,
outOfOrder,
infoThresh,
infoThresh
);
}
@@ -2558,7 +2563,7 @@ function main() {
shareDiv.hidden = false;
});
}),
})
);
}
initShare();
@@ -2575,15 +2580,18 @@ function main() {
* @param {number | null} width
*/
function setBarWidth(width) {
if (typeof width === "number") {
elements.main.style.width = `${width}px`;
localStorage.setItem(barWidthLocalStorageKey, String(width));
} else {
elements.main.style.width = elements.style.getPropertyValue(
"--default-main-width",
);
localStorage.removeItem(barWidthLocalStorageKey);
}
// TODO: Check if should be a signal ??
try {
if (typeof width === "number") {
elements.main.style.width = `${width}px`;
utils.storage.write(barWidthLocalStorageKey, String(width));
} else {
elements.main.style.width = elements.style.getPropertyValue(
"--default-main-width"
);
utils.storage.remove(barWidthLocalStorageKey);
}
} catch (_) {}
}
/**
@@ -2616,9 +2624,9 @@ function main() {
window.addEventListener("mouseleave", setResizeFalse);
}
initDesktopResizeBar();
}),
),
),
})
)
)
);
}
main();

View File

@@ -1,16 +1,5 @@
// @ts-check
/**
* @typedef {Height | DateIndex | WeekIndex | MonthIndex | QuarterIndex | YearIndex | DecadeIndex} ChartableIndex
*/
/**
* @template {readonly unknown[]} T
* @typedef {Extract<T[number], ChartableIndex> extends never ? false : true} IncludesChartableIndex
*/
/**
* @typedef {{[K in VecId]: IncludesChartableIndex<VecIdToIndexes[K]> extends true ? K : never}[VecId]} ChartableVecId
*/
/**
* @typedef {Object} BaseSeriesBlueprint
* @property {string} title
@@ -42,7 +31,7 @@
*
* @typedef {AnySeriesBlueprint["type"]} SeriesType
*
* @typedef {{ key: ChartableVecId, unit?: Unit | Unit[] }} FetchedAnySeriesOptions
* @typedef {{ key: VecId, unit?: Unit | Unit[] }} FetchedAnySeriesOptions
*
* @typedef {BaselineSeriesBlueprint & FetchedAnySeriesOptions} FetchedBaselineSeriesBlueprint
* @typedef {CandlestickSeriesBlueprint & FetchedAnySeriesOptions} FetchedCandlestickSeriesBlueprint
@@ -122,11 +111,11 @@
function createPartialOptions(colors) {
/**
* @template {string} S
* @typedef {Extract<ChartableVecId, `${S}${string}`>} StartsWith
* @typedef {Extract<VecId, `${S}${string}`>} StartsWith
*/
/**
* @template {string} S
* @typedef {Extract<ChartableVecId, `${string}${S}`>} EndsWith
* @typedef {Extract<VecId, `${string}${S}`>} EndsWith
*/
/**
* @template {string} K
@@ -813,7 +802,7 @@ function createPartialOptions(colors) {
/**
* @param {Object} args
* @param {ChartableVecId} args.key
* @param {VecId} args.key
* @param {string} args.name
* @param {Color} [args.color]
* @param {boolean} [args.defaultActive]
@@ -925,7 +914,7 @@ function createPartialOptions(colors) {
/**
* @param {Object} args
* @param {ChartableVecId & VecIdAverageBase & VecIdSumBase & CumulativeVecIdBase & VecIdMinBase & VecIdMaxBase & VecId90pBase & VecId75pBase & VecIdMedianBase & VecId25pBase & VecId10pBase} args.key
* @param {VecId & VecIdAverageBase & VecIdSumBase & CumulativeVecIdBase & VecIdMinBase & VecIdMaxBase & VecId90pBase & VecId75pBase & VecIdMedianBase & VecId25pBase & VecId10pBase} args.key
* @param {string} args.name
*/
function createBaseAverageSumCumulativeMinMaxPercentilesSeries({
@@ -943,7 +932,7 @@ function createPartialOptions(colors) {
/**
* @param {Object} args
* @param {ChartableVecId & VecIdSumBase & CumulativeVecIdBase} args.key
* @param {VecId & VecIdSumBase & CumulativeVecIdBase} args.key
* @param {string} args.name
*/
function createBaseSumCumulativeSeries({ key, name }) {
@@ -1424,7 +1413,7 @@ function createPartialOptions(colors) {
key: `${fixKey(key)}realized-price`,
name,
color,
}),
})
),
}
: createPriceWithRatio({
@@ -1507,7 +1496,7 @@ function createPartialOptions(colors) {
/** @satisfies {FetchedBaselineSeriesBlueprint} */ ({
type: "Baseline",
key: `${fixKey(
key,
key
)}net-realized-profit-and-loss-relative-to-realized-cap`,
title: useGroupName ? name : "Net",
color: useGroupName ? color : undefined,
@@ -1578,7 +1567,7 @@ function createPartialOptions(colors) {
/** @satisfies {FetchedBaselineSeriesBlueprint} */ ({
type: "Baseline",
key: `${fixKey(
key,
key
)}adjusted-spent-output-profit-ratio`,
title: useGroupName ? name : "asopr",
color: useGroupName ? color : undefined,
@@ -1601,7 +1590,7 @@ function createPartialOptions(colors) {
key: `${fixKey(key)}sell-side-risk-ratio`,
name: useGroupName ? name : "Risk",
color: color,
}),
})
),
},
],
@@ -1690,7 +1679,7 @@ function createPartialOptions(colors) {
/** @satisfies {FetchedBaselineSeriesBlueprint} */ ({
type: "Baseline",
key: `${fixKey(
key,
key
)}net-unrealized-profit-and-loss-relative-to-market-cap`,
title: useGroupName ? name : "Net",
color: useGroupName ? color : undefined,
@@ -1868,7 +1857,7 @@ function createPartialOptions(colors) {
key: `${key}-sma`,
name: key,
color,
}),
})
),
},
...averages.map(({ key, name, color }) =>
@@ -1878,7 +1867,7 @@ function createPartialOptions(colors) {
title: `${name} Market Price Moving Average`,
legend: "average",
color,
}),
})
),
],
},
@@ -1969,7 +1958,7 @@ function createPartialOptions(colors) {
},
}),
],
}),
})
),
.../** @type {const} */ ([
{ name: "2 Year", key: "2y" },
@@ -2040,7 +2029,7 @@ function createPartialOptions(colors) {
},
}),
],
}),
})
),
],
},
@@ -2056,7 +2045,7 @@ function createPartialOptions(colors) {
name: `${year}`,
color,
defaultActive,
}),
})
),
},
...dcaClasses.map(
@@ -2083,7 +2072,7 @@ function createPartialOptions(colors) {
},
}),
],
}),
})
),
],
},
@@ -2144,10 +2133,10 @@ function createPartialOptions(colors) {
bottom: [
...createAverageSumCumulativeMinMaxPercentilesSeries("fee"),
...createAverageSumCumulativeMinMaxPercentilesSeries(
"fee-in-btc",
"fee-in-btc"
),
...createAverageSumCumulativeMinMaxPercentilesSeries(
"fee-in-usd",
"fee-in-usd"
),
],
},
@@ -2889,7 +2878,7 @@ export function initOptions({ colors, signals, env, utils, qrcode }) {
const LS_SELECTED_KEY = `selected-id`;
const urlSelected = utils.url.pathnameToSelectedId();
const savedSelectedId = localStorage.getItem(LS_SELECTED_KEY);
const savedSelectedId = utils.storage.read(LS_SELECTED_KEY);
/** @type {Signal<Option>} */
const selected = signals.createSignal(/** @type {any} */ (undefined));
@@ -2903,7 +2892,7 @@ export function initOptions({ colors, signals, env, utils, qrcode }) {
const detailsList = [];
const treeElement = signals.createSignal(
/** @type {HTMLDivElement | null} */ (null),
/** @type {HTMLDivElement | null} */ (null)
);
/** @type {string[] | undefined} */
@@ -2973,7 +2962,7 @@ export function initOptions({ colors, signals, env, utils, qrcode }) {
signals.createEffect(selected, (selected) => {
if (selected?.id === option.id) {
input.checked = true;
localStorage.setItem(LS_SELECTED_KEY, option.id);
utils.storage.write(LS_SELECTED_KEY, option.id);
} else if (input.checked) {
input.checked = false;
}
@@ -3015,7 +3004,7 @@ export function initOptions({ colors, signals, env, utils, qrcode }) {
return null;
}
},
null,
null
);
partialTree.forEach((anyPartial, partialIndex) => {
@@ -3038,7 +3027,7 @@ export function initOptions({ colors, signals, env, utils, qrcode }) {
if ("tree" in anyPartial) {
const folderId = utils.stringToId(
`${(path || []).join(" ")} ${anyPartial.name} folder`,
`${(path || []).join(" ")} ${anyPartial.name} folder`
);
/** @type {Omit<OptionsGroup, keyof PartialOptionsGroup>} */
@@ -3053,13 +3042,13 @@ export function initOptions({ colors, signals, env, utils, qrcode }) {
const thisPath = groupAddons.id;
const passedDetails = signals.createSignal(
/** @type {HTMLDivElement | HTMLDetailsElement | null} */ (null),
/** @type {HTMLDivElement | HTMLDetailsElement | null} */ (null)
);
const childOptionsCount = recursiveProcessPartialTree(
anyPartial.tree,
passedDetails,
[...(path || []), thisPath],
[...(path || []), thisPath]
);
listForSum.push(childOptionsCount);
@@ -3191,7 +3180,7 @@ export function initOptions({ colors, signals, env, utils, qrcode }) {
});
return signals.createMemo(() =>
listForSum.reduce((acc, s) => acc + s(), 0),
listForSum.reduce((acc, s) => acc + s(), 0)
);
}
recursiveProcessPartialTree(partialOptions, treeElement);
@@ -3218,7 +3207,7 @@ export function initOptions({ colors, signals, env, utils, qrcode }) {
console.log(
[...m.entries()]
.filter(([_, value]) => value > 1)
.map(([key, _]) => key),
.map(([key, _]) => key)
);
throw Error("ID duplicate");

View File

@@ -2,7 +2,7 @@
// File auto-generated, any modifications will be overwritten
//
export const VERSION = "v0.0.58";
export const VERSION = "v0.0.61";
/** @typedef {0} DateIndex */
/** @typedef {1} DecadeIndex */
@@ -31,8 +31,11 @@ export const VERSION = "v0.0.58";
/** @typedef {DateIndex | DecadeIndex | DifficultyEpoch | EmptyOutputIndex | HalvingEpoch | Height | InputIndex | MonthIndex | OpReturnIndex | OutputIndex | P2AIndex | P2MSIndex | P2PK33Index | P2PK65Index | P2PKHIndex | P2SHIndex | P2TRIndex | P2WPKHIndex | P2WSHIndex | QuarterIndex | TxIndex | UnknownOutputIndex | WeekIndex | YearIndex} Index */
/** @typedef {ReturnType<typeof createVecIdToIndexes>} VecIdToIndexes */
/** @typedef {keyof VecIdToIndexes} VecId */
export function createVecIdToIndexes() {
return /** @type {const} */ ({
return {
"0": [0, 1, 2, 5, 7, 19, 22, 23],
"0sats-adjusted-spent-output-profit-ratio": [0],
"0sats-adjusted-value-created": [0, 1, 2, 5, 7, 19, 22, 23],
@@ -9037,7 +9040,5 @@ export function createVecIdToIndexes() {
"weight": [5, 20],
"yearindex": [7, 23],
"yearindex-count": [1],
});
};
}
/** @typedef {ReturnType<typeof createVecIdToIndexes>} VecIdToIndexes */
/** @typedef {keyof VecIdToIndexes} VecId */