diff --git a/crates/brk_playground/src/lib.rs b/crates/brk_playground/src/lib.rs index 3b5f27f1d..9c8be1b78 100644 --- a/crates/brk_playground/src/lib.rs +++ b/crates/brk_playground/src/lib.rs @@ -23,6 +23,6 @@ pub use oracle::{ HeightPriceResult, OracleConfig, OracleResult, derive_daily_ohlc, derive_daily_ohlc_with_confidence, derive_height_price, derive_height_price_with_confidence, derive_ohlc_from_height_prices, derive_ohlc_from_height_prices_with_confidence, - derive_price_from_histogram, + derive_price_fast, derive_price_from_histogram, }; pub use signal::{compute_expected_bins_per_day, usd_to_bin}; diff --git a/website/scripts/chart/index.js b/website/scripts/chart/index.js index f9e029340..73db0abe2 100644 --- a/website/scripts/chart/index.js +++ b/website/scripts/chart/index.js @@ -153,6 +153,7 @@ export function createChart({ /** @type {Map>} */ const seriesByHomePane = new Map(); + let pendingVisibilityCheck = false; /** * Register series with its home pane for collapse management @@ -172,6 +173,16 @@ export function createChart({ if (!panesWithFieldsets.has(paneIndex)) { setTimeout(() => createPaneFieldsets(paneIndex), paneIndex ? 50 : 0); } + + // Defer visibility check until after all series are registered + if (!pendingVisibilityCheck) { + pendingVisibilityCheck = true; + requestAnimationFrame(() => { + pendingVisibilityCheck = false; + updatePaneVisibility(0); + updatePaneVisibility(1); + }); + } } /** @@ -237,7 +248,9 @@ export function createChart({ } else { // For pane 1: move series to pane 0 when hidden, back when visible const pane0Map = seriesByHomePane.get(0); - const pane0AllHidden = pane0Map ? [...pane0Map.keys()].every((s) => !s.active.value) : true; + const pane0AllHidden = pane0Map + ? [...pane0Map.keys()].every((s) => !s.active.value) + : true; if (allHidden) { // Pane 1 hidden: move to pane 0 @@ -324,7 +337,7 @@ export function createChart({ locale: "en-us", }, crosshair: { - mode: 0, + mode: 3, }, ...(fitContent ? { @@ -461,7 +474,10 @@ export function createChart({ * @param {number} configPaneIndex - which pane's config to use * @param {number} [targetPaneIndex] - which physical pane to create on (defaults to configPaneIndex) */ - function createPaneFieldsets(configPaneIndex, targetPaneIndex = configPaneIndex) { + function createPaneFieldsets( + configPaneIndex, + targetPaneIndex = configPaneIndex, + ) { const pane = ichart.panes().at(targetPaneIndex); if (!pane) return; @@ -474,7 +490,10 @@ export function createChart({ for (const { id, position, createChild } of configs.values()) { // Remove existing at same position Array.from(parent.childNodes) - .filter((el) => /** @type {HTMLElement} */ (el).dataset?.position === position) + .filter( + (el) => + /** @type {HTMLElement} */ (el).dataset?.position === position, + ) .forEach((el) => el.remove()); const fieldset = window.document.createElement("fieldset"); @@ -514,35 +533,36 @@ export function createChart({ function addPriceScaleSelectorIfNeeded({ unit, paneIndex, seriesType }) { const id = `${chartId}-scale`; + /** @type {"lin" | "log"} */ + const defaultValue = + unit.id === "usd" && seriesType !== "Baseline" ? "log" : "lin"; + + const persisted = createPersistedValue({ + defaultValue, + storageKey: `${id}-scale-${paneIndex}`, + urlKey: paneIndex === 0 ? "price_scale" : "unit_scale", + serialize: (v) => v, + deserialize: (s) => /** @type {"lin" | "log"} */ (s), + }); + + /** @param {"lin" | "log"} value */ + const applyScale = (value) => { + try { + const pane = ichart.panes().at(paneIndex); + pane?.priceScale("right").applyOptions({ + mode: value === "lin" ? 0 : 1, + }); + } catch {} + }; + + // Apply scale immediately + applyScale(persisted.value); + addFieldsetIfNeeded({ id, paneIndex, position: "sw", - createChild(pane) { - /** @type {"lin" | "log"} */ - const defaultValue = - unit.id === "usd" && seriesType !== "Baseline" ? "log" : "lin"; - - const persisted = createPersistedValue({ - defaultValue, - storageKey: `${id}-scale-${paneIndex}`, - urlKey: paneIndex === 0 ? "price_scale" : "unit_scale", - serialize: (v) => v, - deserialize: (s) => /** @type {"lin" | "log"} */ (s), - }); - - /** @param {"lin" | "log"} value */ - const applyScale = (value) => { - try { - pane.priceScale("right").applyOptions({ - mode: value === "lin" ? 0 : 1, - }); - } catch {} - }; - - // Apply initial value - applyScale(persisted.value); - + createChild() { const field = createChoiceField({ choices: /** @type {const} */ (["lin", "log"]), id: stringToId(`${id} ${paneIndex} ${unit}`),