Mirror/brk
1
0
Fork 0
mirror of https://github.com/bitcoinresearchkit/brk.git synced 2026-04-24 14:49:58 -07:00
Code Issues Packages Projects Releases Wiki Activity

global: snapshot

Browse Source
This commit is contained in:
nym21
2026-01-14 16:38:53 +01:00
parent ddb1db7a8e
commit d75c2a881b
226 changed files with 7776 additions and 20942 deletions
Download Patch File Download Diff File Expand all files Collapse all files

821
website/scripts/options/chain.js Normal file
View File

@@ -0,0 +1,821 @@
/** Chain section builder - typed tree-based patterns */
import { Unit } from "../utils/units.js";
/**
* Create Chain section
* @param {PartialContext} ctx
* @returns {PartialOptionsGroup}
*/
export function createChainSection(ctx) {
const {
colors,
brk,
line,
dots,
createPriceLine,
fromSizePattern,
fromFullnessPattern,
fromFeeRatePattern,
fromCoinbasePattern,
fromValuePattern,
fromBlockCountWithUnit,
fromIntervalPattern,
fromSupplyPattern,
} = ctx;
const {
blocks,
transactions,
pools,
inputs,
outputs,
market,
scripts,
supply,
} = brk.metrics;
// Build pools tree dynamically
const poolEntries = Object.entries(pools.vecs);
const poolsTree = poolEntries.map(([key, pool]) => {
const poolName =
brk.POOL_ID_TO_POOL_NAME[
/** @type {keyof typeof brk.POOL_ID_TO_POOL_NAME} */ (key.toLowerCase())
] || key;
return {
name: poolName,
tree: [
{
name: "Dominance",
title: `Mining Dominance of ${poolName}`,
bottom: [
line({
metric: pool._24hDominance,
name: "24h",
color: colors.orange,
unit: Unit.percentage,
defaultActive: false,
}),
line({
metric: pool._1wDominance,
name: "1w",
color: colors.red,
unit: Unit.percentage,
defaultActive: false,
}),
line({
metric: pool._1mDominance,
name: "1m",
unit: Unit.percentage,
}),
line({
metric: pool._1yDominance,
name: "1y",
color: colors.lime,
unit: Unit.percentage,
defaultActive: false,
}),
line({
metric: pool.dominance,
name: "all time",
color: colors.teal,
unit: Unit.percentage,
defaultActive: false,
}),
],
},
{
name: "Blocks mined",
title: `Blocks mined by ${poolName}`,
bottom: [
line({
metric: pool.blocksMined.sum,
name: "Sum",
unit: Unit.count,
}),
line({
metric: pool.blocksMined.cumulative,
name: "Cumulative",
color: colors.blue,
unit: Unit.count,
}),
line({
metric: pool._1wBlocksMined,
name: "1w Sum",
color: colors.red,
unit: Unit.count,
defaultActive: false,
}),
line({
metric: pool._1mBlocksMined,
name: "1m Sum",
color: colors.pink,
unit: Unit.count,
defaultActive: false,
}),
line({
metric: pool._1yBlocksMined,
name: "1y Sum",
color: colors.purple,
unit: Unit.count,
defaultActive: false,
}),
],
},
{
name: "Rewards",
title: `Rewards collected by ${poolName}`,
bottom: [
...fromValuePattern(
pool.coinbase,
"coinbase",
colors.orange,
colors.red,
),
...fromValuePattern(
pool.subsidy,
"subsidy",
colors.lime,
colors.emerald,
),
...fromValuePattern(pool.fee, "fee", colors.cyan, colors.indigo),
],
},
{
name: "Days since block",
title: `Days since ${poolName} mined a block`,
bottom: [
line({
metric: pool.daysSinceBlock,
name: "Since block",
unit: Unit.days,
}),
],
},
],
};
});
return {
name: "Chain",
tree: [
// Block
{
name: "Block",
tree: [
{
name: "Count",
title: "Block Count",
bottom: [
...fromBlockCountWithUnit(
blocks.count.blockCount,
"Block",
Unit.count,
),
line({
metric: blocks.count.blockCountTarget,
name: "Target",
color: colors.gray,
unit: Unit.count,
options: { lineStyle: 4 },
}),
line({
metric: blocks.count._1wBlockCount,
name: "1w sum",
color: colors.red,
unit: Unit.count,
defaultActive: false,
}),
line({
metric: blocks.count._1mBlockCount,
name: "1m sum",
color: colors.pink,
unit: Unit.count,
defaultActive: false,
}),
line({
metric: blocks.count._1yBlockCount,
name: "1y sum",
color: colors.purple,
unit: Unit.count,
defaultActive: false,
}),
],
},
{
name: "Interval",
title: "Block Interval",
bottom: [
...fromIntervalPattern(blocks.interval, "Interval", Unit.secs),
createPriceLine({ unit: Unit.secs, name: "Target", number: 600 }),
],
},
{
name: "Size",
title: "Block Size",
bottom: [
...fromSizePattern(blocks.size, "Size", Unit.bytes),
...fromFullnessPattern(blocks.vbytes, "Vbytes", Unit.vb),
...fromFullnessPattern(blocks.weight, "Weight", Unit.wu),
],
},
],
},
// Transaction
{
name: "Transaction",
tree: [
{
name: "Count",
title: "Transaction Count",
bottom: fromFullnessPattern(
transactions.count.txCount,
"Count",
Unit.count,
),
},
{
name: "Volume",
title: "Transaction Volume",
bottom: [
line({
metric: transactions.volume.sentSum.sats,
name: "Sent",
unit: Unit.sats,
}),
line({
metric: transactions.volume.sentSum.bitcoin,
name: "Sent",
unit: Unit.btc,
}),
line({
metric: transactions.volume.sentSum.dollars,
name: "Sent",
unit: Unit.usd,
}),
line({
metric: transactions.volume.annualizedVolume.sats,
name: "annualized",
color: colors.red,
unit: Unit.sats,
defaultActive: false,
}),
line({
metric: transactions.volume.annualizedVolume.bitcoin,
name: "annualized",
color: colors.red,
unit: Unit.btc,
defaultActive: false,
}),
line({
metric: transactions.volume.annualizedVolume.dollars,
name: "annualized",
color: colors.lime,
unit: Unit.usd,
defaultActive: false,
}),
],
},
{
name: "Size",
title: "Transaction Size",
bottom: [
...fromFeeRatePattern(
transactions.size.weight,
"weight",
Unit.wu,
),
...fromFeeRatePattern(transactions.size.vsize, "vsize", Unit.vb),
],
},
{
name: "Versions",
title: "Transaction Versions",
bottom: [
...fromBlockCountWithUnit(
transactions.versions.v1,
"v1",
Unit.count,
colors.orange,
colors.red,
),
...fromBlockCountWithUnit(
transactions.versions.v2,
"v2",
Unit.count,
colors.cyan,
colors.blue,
),
...fromBlockCountWithUnit(
transactions.versions.v3,
"v3",
Unit.count,
colors.lime,
colors.green,
),
],
},
{
name: "Velocity",
title: "Transactions Velocity",
bottom: [
line({
metric: supply.velocity.btc,
name: "bitcoin",
unit: Unit.ratio,
}),
line({
metric: supply.velocity.usd,
name: "dollars",
color: colors.emerald,
unit: Unit.ratio,
}),
],
},
{
name: "Speed",
title: "Transactions Per Second",
bottom: [
line({
metric: transactions.volume.txPerSec,
name: "Transactions",
unit: Unit.perSec,
}),
],
},
],
},
// Input
{
name: "Input",
tree: [
{
name: "Count",
title: "Transaction Input Count",
bottom: [...fromSizePattern(inputs.count, "Input", Unit.count)],
},
{
name: "Speed",
title: "Inputs Per Second",
bottom: [
line({
metric: transactions.volume.inputsPerSec,
name: "Inputs",
unit: Unit.perSec,
}),
],
},
],
},
// Output
{
name: "Output",
tree: [
{
name: "Count",
title: "Transaction Output Count",
bottom: [
...fromSizePattern(
outputs.count.totalCount,
"Output",
Unit.count,
),
],
},
{
name: "Speed",
title: "Outputs Per Second",
bottom: [
line({
metric: transactions.volume.outputsPerSec,
name: "Outputs",
unit: Unit.perSec,
}),
],
},
],
},
{
name: "UTXO",
tree: [
{
name: "Count",
title: "UTXO Count",
bottom: [
line({
metric: outputs.count.utxoCount,
name: "Count",
unit: Unit.count,
}),
],
},
],
},
// Coinbase
{
name: "Coinbase",
title: "Coinbase Rewards",
bottom: fromCoinbasePattern(blocks.rewards.coinbase, "Coinbase"),
},
// Subsidy
{
name: "Subsidy",
title: "Block Subsidy",
bottom: [
...fromCoinbasePattern(blocks.rewards.subsidy, "Subsidy"),
line({
metric: blocks.rewards.subsidyDominance,
name: "Dominance",
color: colors.purple,
unit: Unit.percentage,
defaultActive: false,
}),
],
},
// Fee
{
name: "Fee",
tree: [
{
name: "Total",
title: "Transaction Fees",
bottom: [
line({
metric: transactions.fees.fee.sats.sum,
name: "Sum",
unit: Unit.sats,
}),
line({
metric: transactions.fees.fee.sats.cumulative,
name: "Cumulative",
color: colors.blue,
unit: Unit.sats,
defaultActive: false,
}),
line({
metric: transactions.fees.fee.bitcoin.sum,
name: "Sum",
unit: Unit.btc,
}),
line({
metric: transactions.fees.fee.bitcoin.cumulative,
name: "Cumulative",
color: colors.blue,
unit: Unit.btc,
defaultActive: false,
}),
line({
metric: transactions.fees.fee.dollars.sum,
name: "Sum",
unit: Unit.usd,
}),
line({
metric: transactions.fees.fee.dollars.cumulative,
name: "Cumulative",
color: colors.blue,
unit: Unit.usd,
defaultActive: false,
}),
line({
metric: blocks.rewards.feeDominance,
name: "Dominance",
color: colors.purple,
unit: Unit.percentage,
defaultActive: false,
}),
],
},
{
name: "Rate",
title: "Fee Rate",
bottom: [
line({
metric: transactions.fees.feeRate.median,
name: "Median",
color: colors.purple,
unit: Unit.feeRate,
}),
line({
metric: transactions.fees.feeRate.average,
name: "Average",
color: colors.blue,
unit: Unit.feeRate,
defaultActive: false,
}),
line({
metric: transactions.fees.feeRate.min,
name: "Min",
color: colors.red,
unit: Unit.feeRate,
defaultActive: false,
}),
line({
metric: transactions.fees.feeRate.max,
name: "Max",
color: colors.green,
unit: Unit.feeRate,
defaultActive: false,
}),
line({
metric: transactions.fees.feeRate.pct10,
name: "pct10",
color: colors.rose,
unit: Unit.feeRate,
defaultActive: false,
}),
line({
metric: transactions.fees.feeRate.pct25,
name: "pct25",
color: colors.pink,
unit: Unit.feeRate,
defaultActive: false,
}),
line({
metric: transactions.fees.feeRate.pct75,
name: "pct75",
color: colors.violet,
unit: Unit.feeRate,
defaultActive: false,
}),
line({
metric: transactions.fees.feeRate.pct90,
name: "pct90",
color: colors.fuchsia,
unit: Unit.feeRate,
defaultActive: false,
}),
],
},
],
},
// Mining
{
name: "Mining",
tree: [
{
name: "Hashrate",
title: "Network Hashrate",
bottom: [
dots({
metric: blocks.mining.hashRate,
name: "Hashrate",
unit: Unit.hashRate,
}),
line({
metric: blocks.mining.hashRate1wSma,
name: "1w SMA",
color: colors.red,
unit: Unit.hashRate,
defaultActive: false,
}),
line({
metric: blocks.mining.hashRate1mSma,
name: "1m SMA",
color: colors.orange,
unit: Unit.hashRate,
defaultActive: false,
}),
line({
metric: blocks.mining.hashRate2mSma,
name: "2m SMA",
color: colors.yellow,
unit: Unit.hashRate,
defaultActive: false,
}),
line({
metric: blocks.mining.hashRate1ySma,
name: "1y SMA",
color: colors.lime,
unit: Unit.hashRate,
defaultActive: false,
}),
],
},
{
name: "Difficulty",
title: "Network Difficulty",
bottom: [
line({
metric: blocks.difficulty.raw,
name: "Difficulty",
unit: Unit.difficulty,
}),
line({
metric: blocks.difficulty.adjustment,
name: "Adjustment",
color: colors.orange,
unit: Unit.percentage,
defaultActive: false,
}),
line({
metric: blocks.difficulty.asHash,
name: "As hash",
color: colors.default,
unit: Unit.hashRate,
defaultActive: false,
options: { lineStyle: 1 },
}),
line({
metric: blocks.difficulty.blocksBeforeNextAdjustment,
name: "Blocks until adj.",
color: colors.indigo,
unit: Unit.blocks,
defaultActive: false,
}),
line({
metric: blocks.difficulty.daysBeforeNextAdjustment,
name: "Days until adj.",
color: colors.purple,
unit: Unit.days,
defaultActive: false,
}),
],
},
{
name: "Hash Price",
title: "Hash Price",
bottom: [
line({
metric: blocks.mining.hashPriceThs,
name: "TH/s",
color: colors.emerald,
unit: Unit.usdPerThsPerDay,
}),
line({
metric: blocks.mining.hashPricePhs,
name: "PH/s",
color: colors.emerald,
unit: Unit.usdPerPhsPerDay,
}),
line({
metric: blocks.mining.hashPriceRebound,
name: "Rebound",
color: colors.yellow,
unit: Unit.percentage,
}),
line({
metric: blocks.mining.hashPriceThsMin,
name: "TH/s Min",
color: colors.red,
unit: Unit.usdPerThsPerDay,
options: { lineStyle: 1 },
}),
line({
metric: blocks.mining.hashPricePhsMin,
name: "PH/s Min",
color: colors.red,
unit: Unit.usdPerPhsPerDay,
options: { lineStyle: 1 },
}),
],
},
{
name: "Hash Value",
title: "Hash Value",
bottom: [
line({
metric: blocks.mining.hashValueThs,
name: "TH/s",
color: colors.orange,
unit: Unit.satsPerThsPerDay,
}),
line({
metric: blocks.mining.hashValuePhs,
name: "PH/s",
color: colors.orange,
unit: Unit.satsPerPhsPerDay,
}),
line({
metric: blocks.mining.hashValueRebound,
name: "Rebound",
color: colors.yellow,
unit: Unit.percentage,
}),
line({
metric: blocks.mining.hashValueThsMin,
name: "TH/s Min",
color: colors.red,
unit: Unit.satsPerThsPerDay,
options: { lineStyle: 1 },
}),
line({
metric: blocks.mining.hashValuePhsMin,
name: "PH/s Min",
color: colors.red,
unit: Unit.satsPerPhsPerDay,
options: { lineStyle: 1 },
}),
],
},
{
name: "Halving",
title: "Halving Info",
bottom: [
line({
metric: blocks.halving.blocksBeforeNextHalving,
name: "Blocks until halving",
unit: Unit.blocks,
}),
line({
metric: blocks.halving.daysBeforeNextHalving,
name: "Days until halving",
color: colors.orange,
unit: Unit.days,
}),
line({
metric: blocks.halving.epoch,
name: "Halving epoch",
color: colors.purple,
unit: Unit.epoch,
defaultActive: false,
}),
],
},
{
name: "Puell Multiple",
title: "Puell Multiple",
bottom: [
line({
metric: market.indicators.puellMultiple,
name: "Puell Multiple",
unit: Unit.ratio,
}),
createPriceLine({ unit: Unit.ratio, number: 1 }),
],
},
],
},
// Pools
{
name: "Pools",
tree: poolsTree,
},
// Unspendable
{
name: "Unspendable",
tree: [
{
name: "Supply",
title: "Unspendable Supply",
bottom: fromValuePattern(supply.burned.unspendable, "Supply"),
},
{
name: "OP_RETURN",
tree: [
{
name: "Outputs",
title: "OP_RETURN Outputs",
bottom: fromFullnessPattern(
scripts.count.opreturn,
"Count",
Unit.count,
),
},
{
name: "Supply",
title: "OP_RETURN Supply",
bottom: fromValuePattern(supply.burned.opreturn, "Supply"),
},
],
},
],
},
// Supply
{
name: "Supply",
title: "Circulating Supply",
bottom: fromSupplyPattern(supply.circulating, "Supply"),
},
// Inflation
{
name: "Inflation",
title: "Inflation Rate",
bottom: [
line({
metric: supply.inflation,
name: "Rate",
unit: Unit.percentage,
}),
],
},
// Unclaimed Rewards
{
name: "Unclaimed Rewards",
title: "Unclaimed Block Rewards",
bottom: fromValuePattern(blocks.rewards.unclaimedRewards, "Unclaimed"),
},
],
};
}

400
website/scripts/options/cohorts/address.js Normal file
View File

@@ -0,0 +1,400 @@
/**
* Address cohort folder builder
* Creates option trees for address-based cohorts (has addrCount)
* Address cohorts use _0satsPattern which has CostBasisPattern (no percentiles)
*/
import { Unit } from "../../utils/units.js";
import {
createSingleSupplySeries,
createGroupedSupplyTotalSeries,
createGroupedSupplyInProfitSeries,
createGroupedSupplyInLossSeries,
createUtxoCountSeries,
createAddressCountSeries,
createRealizedPriceSeries,
createRealizedPriceRatioSeries,
} from "./shared.js";
/**
* Create a cohort folder for address cohorts
* Includes address count section (addrCount exists on AddressCohortObject)
* @param {PartialContext} ctx
* @param {AddressCohortObject | AddressCohortGroupObject} args
* @returns {PartialOptionsGroup}
*/
export function createAddressCohortFolder(ctx, args) {
const list = "list" in args ? args.list : [args];
const useGroupName = "list" in args;
const isSingle = !("list" in args);
const title = args.title ? `${useGroupName ? "by" : "of"} ${args.title}` : "";
return {
name: args.name || "all",
tree: [
// Supply section
isSingle
? {
name: "supply",
title: `Supply ${title}`,
bottom: createSingleSupplySeries(
ctx,
/** @type {AddressCohortObject} */ (args),
),
}
: {
name: "supply",
tree: [
{
name: "total",
title: `Supply ${title}`,
bottom: createGroupedSupplyTotalSeries(ctx, list),
},
{
name: "in profit",
title: `Supply In Profit ${title}`,
bottom: createGroupedSupplyInProfitSeries(ctx, list),
},
{
name: "in loss",
title: `Supply In Loss ${title}`,
bottom: createGroupedSupplyInLossSeries(ctx, list),
},
],
},
// UTXO count
{
name: "utxo count",
title: `UTXO Count ${title}`,
bottom: createUtxoCountSeries(ctx, list, useGroupName),
},
// Address count (ADDRESS COHORTS ONLY - fully type safe!)
{
name: "address count",
title: `Address Count ${title}`,
bottom: createAddressCountSeries(ctx, list, useGroupName),
},
// Realized section
{
name: "Realized",
tree: [
...(useGroupName
? [
{
name: "Price",
title: `Realized Price ${title}`,
top: createRealizedPriceSeries(ctx, list),
},
{
name: "Ratio",
title: `Realized Price Ratio ${title}`,
bottom: createRealizedPriceRatioSeries(ctx, list),
},
]
: createRealizedPriceOptions(
ctx,
/** @type {AddressCohortObject} */ (args),
title,
)),
{
name: "capitalization",
title: `Realized Capitalization ${title}`,
bottom: createRealizedCapWithExtras(ctx, list, args, useGroupName),
},
...(!useGroupName
? createRealizedPnlSection(
ctx,
/** @type {AddressCohortObject} */ (args),
title,
)
: []),
],
},
// Unrealized section
...createUnrealizedSection(ctx, list, useGroupName, title),
// Cost basis section (no percentiles for address cohorts)
...createCostBasisSection(ctx, list, useGroupName, title),
// Activity section
...createActivitySection(ctx, list, useGroupName, title),
],
};
}
/**
* Create realized price options for single cohort
* @param {PartialContext} ctx
* @param {AddressCohortObject} args
* @param {string} title
* @returns {PartialOptionsTree}
*/
function createRealizedPriceOptions(ctx, args, title) {
const { line } = ctx;
const { tree, color } = args;
return [
{
name: "price",
title: `Realized Price ${title}`,
top: [
line({
metric: tree.realized.realizedPrice,
name: "Realized",
color,
unit: Unit.usd,
}),
],
},
];
}
/**
* Create realized cap with extras
* @param {PartialContext} ctx
* @param {readonly AddressCohortObject[]} list
* @param {AddressCohortObject | AddressCohortGroupObject} args
* @param {boolean} useGroupName
* @returns {AnyFetchedSeriesBlueprint[]}
*/
function createRealizedCapWithExtras(ctx, list, args, useGroupName) {
const { line, baseline, createPriceLine } = ctx;
const isSingle = !("list" in args);
return list.flatMap(({ color, name, tree }) => [
line({
metric: tree.realized.realizedCap,
name: useGroupName ? name : "Capitalization",
color,
unit: Unit.usd,
}),
...(isSingle
? [
baseline({
metric: tree.realized.realizedCap30dDelta,
name: "30d Change",
unit: Unit.usd,
defaultActive: false,
}),
createPriceLine({ unit: Unit.usd, defaultActive: false }),
]
: []),
// RealizedPattern (address cohorts) doesn't have realizedCapRelToOwnMarketCap
]);
}
/**
* Create realized PnL section for single cohort
* @param {PartialContext} ctx
* @param {AddressCohortObject} args
* @param {string} title
* @returns {PartialOptionsTree}
*/
function createRealizedPnlSection(ctx, args, title) {
const { colors, line } = ctx;
const { realized } = args.tree;
return [
{
name: "pnl",
title: `Realized Profit And Loss ${title}`,
bottom: [
line({
metric: realized.realizedProfit.sum,
name: "Profit",
color: colors.green,
unit: Unit.usd,
}),
line({
metric: realized.realizedLoss.sum,
name: "Loss",
color: colors.red,
unit: Unit.usd,
defaultActive: false,
}),
// RealizedPattern (address cohorts) doesn't have realizedProfitToLossRatio
line({
metric: realized.totalRealizedPnl,
name: "Total",
color: colors.default,
defaultActive: false,
unit: Unit.usd,
}),
line({
metric: realized.negRealizedLoss.sum,
name: "Negative Loss",
color: colors.red,
unit: Unit.usd,
}),
line({
metric: realized.negRealizedLoss.cumulative,
name: "Negative Loss",
color: colors.red,
unit: Unit.usd,
}),
],
},
];
}
/**
* Create unrealized section
* @param {PartialContext} ctx
* @param {readonly AddressCohortObject[]} list
* @param {boolean} useGroupName
* @param {string} title
* @returns {PartialOptionsTree}
*/
function createUnrealizedSection(ctx, list, useGroupName, title) {
const { colors, line, baseline } = ctx;
return [
{
name: "Unrealized",
tree: [
{
name: "nupl",
title: `Net Unrealized Profit/Loss ${title}`,
bottom: list.flatMap(({ color, name, tree }) => [
baseline({
metric: tree.unrealized.netUnrealizedPnl,
name: useGroupName ? name : "NUPL",
color: useGroupName ? color : [colors.red, colors.green],
unit: Unit.ratio,
options: { baseValue: { price: 0 } },
}),
]),
},
{
name: "profit",
title: `Unrealized Profit ${title}`,
bottom: list.flatMap(({ color, name, tree }) => [
line({
metric: tree.unrealized.unrealizedProfit,
name: useGroupName ? name : "Profit",
color,
unit: Unit.usd,
}),
]),
},
{
name: "loss",
title: `Unrealized Loss ${title}`,
bottom: list.flatMap(({ color, name, tree }) => [
line({
metric: tree.unrealized.unrealizedLoss,
name: useGroupName ? name : "Loss",
color,
unit: Unit.usd,
}),
]),
},
],
},
];
}
/**
* Create cost basis section (no percentiles for address cohorts)
* @param {PartialContext} ctx
* @param {readonly AddressCohortObject[]} list
* @param {boolean} useGroupName
* @param {string} title
* @returns {PartialOptionsTree}
*/
function createCostBasisSection(ctx, list, useGroupName, title) {
const { line } = ctx;
return [
{
name: "Cost Basis",
tree: [
{
name: "min",
title: `Min Cost Basis ${title}`,
top: list.map(({ color, name, tree }) =>
line({
metric: tree.costBasis.min,
name: useGroupName ? name : "Min",
color,
unit: Unit.usd,
}),
),
},
{
name: "max",
title: `Max Cost Basis ${title}`,
top: list.map(({ color, name, tree }) =>
line({
metric: tree.costBasis.max,
name: useGroupName ? name : "Max",
color,
unit: Unit.usd,
}),
),
},
],
},
];
}
/**
* Create activity section
* @param {PartialContext} ctx
* @param {readonly AddressCohortObject[]} list
* @param {boolean} useGroupName
* @param {string} title
* @returns {PartialOptionsTree}
*/
function createActivitySection(ctx, list, useGroupName, title) {
const { line } = ctx;
return [
{
name: "Activity",
tree: [
{
name: "coinblocks destroyed",
title: `Coinblocks Destroyed ${title}`,
bottom: list.flatMap(({ color, name, tree }) => [
line({
metric: tree.activity.coinblocksDestroyed.sum,
name: useGroupName ? name : "Coinblocks",
color,
unit: Unit.coinblocks,
}),
line({
metric: tree.activity.coinblocksDestroyed.cumulative,
name: useGroupName ? name : "Coinblocks",
color,
unit: Unit.coinblocks,
}),
]),
},
{
name: "coindays destroyed",
title: `Coindays Destroyed ${title}`,
bottom: list.flatMap(({ color, name, tree }) => [
line({
metric: tree.activity.coindaysDestroyed.sum,
name: useGroupName ? name : "Coindays",
color,
unit: Unit.coindays,
}),
line({
metric: tree.activity.coindaysDestroyed.cumulative,
name: useGroupName ? name : "Coindays",
color,
unit: Unit.coindays,
}),
]),
},
],
},
];
}

229
website/scripts/options/cohorts/data.js Normal file
View File

@@ -0,0 +1,229 @@
/** Build cohort data arrays from brk.metrics */
import {
termColors,
maxAgeColors,
minAgeColors,
ageRangeColors,
epochColors,
geAmountColors,
ltAmountColors,
amountRangeColors,
spendableTypeColors,
} from "../colors/index.js";
/**
* @template {Record<string, any>} T
* @param {T} obj
* @returns {[keyof T & string, T[keyof T & string]][]}
*/
const entries = (obj) =>
/** @type {[keyof T & string, T[keyof T & string]][]} */ (
Object.entries(obj)
);
/**
* Build all cohort data from brk tree
* @param {Colors} colors
* @param {BrkClient} brk
*/
export function buildCohortData(colors, brk) {
const utxoCohorts = brk.metrics.distribution.utxoCohorts;
const addressCohorts = brk.metrics.distribution.addressCohorts;
const {
TERM_NAMES,
EPOCH_NAMES,
MAX_AGE_NAMES,
MIN_AGE_NAMES,
AGE_RANGE_NAMES,
GE_AMOUNT_NAMES,
LT_AMOUNT_NAMES,
AMOUNT_RANGE_NAMES,
SPENDABLE_TYPE_NAMES,
} = brk;
// Base cohort representing "all" - CohortAll (adjustedSopr + percentiles but no RelToMarketCap)
/** @type {CohortAll} */
const cohortAll = {
name: "",
title: "",
color: colors.orange,
tree: utxoCohorts.all,
};
// Term cohorts - split because short is CohortFull, long is CohortWithPercentiles
const shortNames = TERM_NAMES.short;
/** @type {CohortFull} */
const termShort = {
name: shortNames.short,
title: shortNames.long,
color: colors[termColors.short],
tree: utxoCohorts.term.short,
};
const longNames = TERM_NAMES.long;
/** @type {CohortWithPercentiles} */
const termLong = {
name: longNames.short,
title: longNames.long,
color: colors[termColors.long],
tree: utxoCohorts.term.long,
};
// Max age cohorts (up to X time) - CohortWithAdjusted (adjustedSopr only)
/** @type {readonly CohortWithAdjusted[]} */
const upToDate = entries(utxoCohorts.maxAge).map(([key, tree]) => {
const names = MAX_AGE_NAMES[key];
return {
name: names.short,
title: names.long,
color: colors[maxAgeColors[key]],
tree,
};
});
// Min age cohorts (from X time) - CohortBasic (neither adjustedSopr nor percentiles)
/** @type {readonly CohortBasic[]} */
const fromDate = entries(utxoCohorts.minAge).map(([key, tree]) => {
const names = MIN_AGE_NAMES[key];
return {
name: names.short,
title: names.long,
color: colors[minAgeColors[key]],
tree,
};
});
// Age range cohorts - CohortWithPercentiles (percentiles only)
/** @type {readonly CohortWithPercentiles[]} */
const dateRange = entries(utxoCohorts.ageRange).map(([key, tree]) => {
const names = AGE_RANGE_NAMES[key];
return {
name: names.short,
title: names.long,
color: colors[ageRangeColors[key]],
tree,
};
});
// Epoch cohorts - CohortBasic (neither adjustedSopr nor percentiles)
/** @type {readonly CohortBasic[]} */
const epoch = entries(utxoCohorts.epoch).map(([key, tree]) => {
const names = EPOCH_NAMES[key];
return {
name: names.short,
title: names.long,
color: colors[epochColors[key]],
tree,
};
});
// UTXOs above amount - CohortBasic (neither adjustedSopr nor percentiles)
/** @type {readonly CohortBasic[]} */
const utxosAboveAmount = entries(utxoCohorts.geAmount).map(([key, tree]) => {
const names = GE_AMOUNT_NAMES[key];
return {
name: names.short,
title: names.long,
color: colors[geAmountColors[key]],
tree,
};
});
// Addresses above amount
/** @type {readonly AddressCohortObject[]} */
const addressesAboveAmount = entries(addressCohorts.geAmount).map(
([key, tree]) => {
const names = GE_AMOUNT_NAMES[key];
return {
name: names.short,
title: names.long,
color: colors[geAmountColors[key]],
tree,
};
},
);
// UTXOs under amount - CohortBasic (neither adjustedSopr nor percentiles)
/** @type {readonly CohortBasic[]} */
const utxosUnderAmount = entries(utxoCohorts.ltAmount).map(([key, tree]) => {
const names = LT_AMOUNT_NAMES[key];
return {
name: names.short,
title: names.long,
color: colors[ltAmountColors[key]],
tree,
};
});
// Addresses under amount
/** @type {readonly AddressCohortObject[]} */
const addressesUnderAmount = entries(addressCohorts.ltAmount).map(
([key, tree]) => {
const names = LT_AMOUNT_NAMES[key];
return {
name: names.short,
title: names.long,
color: colors[ltAmountColors[key]],
tree,
};
},
);
// UTXOs amount ranges - CohortBasic (neither adjustedSopr nor percentiles)
/** @type {readonly CohortBasic[]} */
const utxosAmountRanges = entries(utxoCohorts.amountRange).map(
([key, tree]) => {
const names = AMOUNT_RANGE_NAMES[key];
return {
name: names.short,
title: names.long,
color: colors[amountRangeColors[key]],
tree,
};
},
);
// Addresses amount ranges
/** @type {readonly AddressCohortObject[]} */
const addressesAmountRanges = entries(addressCohorts.amountRange).map(
([key, tree]) => {
const names = AMOUNT_RANGE_NAMES[key];
return {
name: names.short,
title: names.long,
color: colors[amountRangeColors[key]],
tree,
};
},
);
// Spendable type cohorts - CohortBasic (neither adjustedSopr nor percentiles)
/** @type {readonly CohortBasic[]} */
const type = entries(utxoCohorts.type).map(([key, tree]) => {
const names = SPENDABLE_TYPE_NAMES[key];
return {
name: names.short,
title: names.long,
color: colors[spendableTypeColors[key]],
tree,
};
});
return {
cohortAll,
termShort,
termLong,
upToDate,
fromDate,
dateRange,
epoch,
utxosAboveAmount,
addressesAboveAmount,
utxosUnderAmount,
addressesUnderAmount,
utxosAmountRanges,
addressesAmountRanges,
type,
};
}

31
website/scripts/options/cohorts/index.js Normal file
View File

@@ -0,0 +1,31 @@
/**
* Cohort module - exports all cohort-related functionality
*/
// Cohort data builder
export { buildCohortData } from "./data.js";
// Cohort folder builders (type-safe!)
export {
createCohortFolderAll,
createCohortFolderFull,
createCohortFolderWithAdjusted,
createCohortFolderWithPercentiles,
createCohortFolderBasic,
} from "./utxo.js";
export { createAddressCohortFolder } from "./address.js";
// Shared helpers
export {
createSingleSupplySeries,
createGroupedSupplyTotalSeries,
createGroupedSupplyInProfitSeries,
createGroupedSupplyInLossSeries,
createUtxoCountSeries,
createAddressCountSeries,
createRealizedPriceSeries,
createRealizedPriceRatioSeries,
createRealizedCapSeries,
createCostBasisMinMaxSeries,
createCostBasisPercentilesSeries,
} from "./shared.js";

417
website/scripts/options/cohorts/shared.js Normal file
View File

@@ -0,0 +1,417 @@
/** Shared cohort chart section builders */
import { Unit } from "../../utils/units.js";
/**
* Create supply section for a single cohort
* @param {PartialContext} ctx
* @param {CohortObject} cohort
* @returns {AnyFetchedSeriesBlueprint[]}
*/
export function createSingleSupplySeries(ctx, cohort) {
const { colors, line, createPriceLine } = ctx;
const { tree } = cohort;
return [
line({
metric: tree.supply.total.sats,
name: "Supply",
color: colors.default,
unit: Unit.sats,
}),
line({
metric: tree.supply.total.bitcoin,
name: "Supply",
color: colors.default,
unit: Unit.btc,
}),
line({
metric: tree.supply.total.dollars,
name: "Supply",
color: colors.default,
unit: Unit.usd,
}),
...("supplyRelToCirculatingSupply" in tree.relative
? [
line({
metric: tree.relative.supplyRelToCirculatingSupply,
name: "Supply",
color: colors.default,
unit: Unit.pctSupply,
}),
]
: []),
line({
metric: tree.unrealized.supplyInProfit.sats,
name: "In Profit",
color: colors.green,
unit: Unit.sats,
}),
line({
metric: tree.unrealized.supplyInProfit.bitcoin,
name: "In Profit",
color: colors.green,
unit: Unit.btc,
}),
line({
metric: tree.unrealized.supplyInProfit.dollars,
name: "In Profit",
color: colors.green,
unit: Unit.usd,
}),
line({
metric: tree.unrealized.supplyInLoss.sats,
name: "In Loss",
color: colors.red,
unit: Unit.sats,
}),
line({
metric: tree.unrealized.supplyInLoss.bitcoin,
name: "In Loss",
color: colors.red,
unit: Unit.btc,
}),
line({
metric: tree.unrealized.supplyInLoss.dollars,
name: "In Loss",
color: colors.red,
unit: Unit.usd,
}),
line({
metric: tree.supply.halved.sats,
name: "half",
color: colors.gray,
unit: Unit.sats,
options: { lineStyle: 4 },
}),
line({
metric: tree.supply.halved.bitcoin,
name: "half",
color: colors.gray,
unit: Unit.btc,
options: { lineStyle: 4 },
}),
line({
metric: tree.supply.halved.dollars,
name: "half",
color: colors.gray,
unit: Unit.usd,
options: { lineStyle: 4 },
}),
...("supplyInProfitRelToCirculatingSupply" in tree.relative
? [
line({
metric: tree.relative.supplyInProfitRelToCirculatingSupply,
name: "In Profit",
color: colors.green,
unit: Unit.pctSupply,
}),
line({
metric: tree.relative.supplyInLossRelToCirculatingSupply,
name: "In Loss",
color: colors.red,
unit: Unit.pctSupply,
}),
]
: []),
line({
metric: tree.relative.supplyInProfitRelToOwnSupply,
name: "In Profit",
color: colors.green,
unit: Unit.pctOwn,
}),
line({
metric: tree.relative.supplyInLossRelToOwnSupply,
name: "In Loss",
color: colors.red,
unit: Unit.pctOwn,
}),
createPriceLine({
unit: Unit.pctOwn,
number: 100,
lineStyle: 0,
color: colors.default,
}),
createPriceLine({ unit: Unit.pctOwn, number: 50 }),
];
}
/**
* Create supply total series for grouped cohorts
* @param {PartialContext} ctx
* @param {readonly CohortObject[]} list
* @returns {AnyFetchedSeriesBlueprint[]}
*/
export function createGroupedSupplyTotalSeries(ctx, list) {
const { line, brk } = ctx;
const constant100 = brk.metrics.constants.constant100;
return list.flatMap(({ color, name, tree }) => [
line({ metric: tree.supply.total.sats, name, color, unit: Unit.sats }),
line({ metric: tree.supply.total.bitcoin, name, color, unit: Unit.btc }),
line({ metric: tree.supply.total.dollars, name, color, unit: Unit.usd }),
"supplyRelToCirculatingSupply" in tree.relative
? line({
metric: tree.relative.supplyRelToCirculatingSupply,
name,
color,
unit: Unit.pctSupply,
})
: line({ metric: constant100, name, color, unit: Unit.pctSupply }),
]);
}
/**
* Create supply in profit series for grouped cohorts
* @param {PartialContext} ctx
* @param {readonly CohortObject[]} list
* @returns {AnyFetchedSeriesBlueprint[]}
*/
export function createGroupedSupplyInProfitSeries(ctx, list) {
const { line } = ctx;
return list.flatMap(({ color, name, tree }) => [
line({
metric: tree.unrealized.supplyInProfit.sats,
name,
color,
unit: Unit.sats,
}),
line({
metric: tree.unrealized.supplyInProfit.bitcoin,
name,
color,
unit: Unit.btc,
}),
line({
metric: tree.unrealized.supplyInProfit.dollars,
name,
color,
unit: Unit.usd,
}),
...("supplyInProfitRelToCirculatingSupply" in tree.relative
? [
line({
metric: tree.relative.supplyInProfitRelToCirculatingSupply,
name,
color,
unit: Unit.pctSupply,
}),
]
: []),
]);
}
/**
* Create supply in loss series for grouped cohorts
* @param {PartialContext} ctx
* @param {readonly CohortObject[]} list
* @returns {AnyFetchedSeriesBlueprint[]}
*/
export function createGroupedSupplyInLossSeries(ctx, list) {
const { line } = ctx;
return list.flatMap(({ color, name, tree }) => [
line({
metric: tree.unrealized.supplyInLoss.sats,
name,
color,
unit: Unit.sats,
}),
line({
metric: tree.unrealized.supplyInLoss.bitcoin,
name,
color,
unit: Unit.btc,
}),
line({
metric: tree.unrealized.supplyInLoss.dollars,
name,
color,
unit: Unit.usd,
}),
...("supplyInLossRelToCirculatingSupply" in tree.relative
? [
line({
metric: tree.relative.supplyInLossRelToCirculatingSupply,
name,
color,
unit: Unit.pctSupply,
}),
]
: []),
]);
}
/**
* Create UTXO count series
* @param {PartialContext} ctx
* @param {readonly CohortObject[]} list
* @param {boolean} useGroupName
* @returns {AnyFetchedSeriesBlueprint[]}
*/
export function createUtxoCountSeries(ctx, list, useGroupName) {
const { line } = ctx;
return list.flatMap(({ color, name, tree }) => [
line({
metric: tree.outputs.utxoCount,
name: useGroupName ? name : "Count",
color,
unit: Unit.count,
}),
]);
}
/**
* Create address count series (for address cohorts only)
* @param {PartialContext} ctx
* @param {readonly AddressCohortObject[]} list
* @param {boolean} useGroupName
* @returns {AnyFetchedSeriesBlueprint[]}
*/
export function createAddressCountSeries(ctx, list, useGroupName) {
const { line, colors } = ctx;
return list.flatMap(({ color, name, tree }) => [
line({
metric: tree.addrCount,
name: useGroupName ? name : "Count",
color: useGroupName ? color : colors.orange,
unit: Unit.count,
}),
]);
}
/**
* Create realized price series for grouped cohorts
* @param {PartialContext} ctx
* @param {readonly CohortObject[]} list
* @returns {AnyFetchedSeriesBlueprint[]}
*/
export function createRealizedPriceSeries(ctx, list) {
const { line } = ctx;
return list.map(({ color, name, tree }) =>
line({ metric: tree.realized.realizedPrice, name, color, unit: Unit.usd }),
);
}
/**
* Create realized price ratio series for grouped cohorts
* @param {PartialContext} ctx
* @param {readonly CohortObject[]} list
* @returns {AnyFetchedSeriesBlueprint[]}
*/
export function createRealizedPriceRatioSeries(ctx, list) {
const { line, createPriceLine } = ctx;
return [
...list.map(({ color, name, tree }) =>
line({
metric: tree.realized.realizedPriceExtra.ratio,
name,
color,
unit: Unit.ratio,
}),
),
createPriceLine({ unit: Unit.ratio, number: 1 }),
];
}
/**
* Create realized capitalization series
* @param {PartialContext} ctx
* @param {readonly CohortObject[]} list
* @param {boolean} useGroupName
* @returns {AnyFetchedSeriesBlueprint[]}
*/
export function createRealizedCapSeries(ctx, list, useGroupName) {
const { line } = ctx;
return list.flatMap(({ color, name, tree }) => [
line({
metric: tree.realized.realizedCap,
name: useGroupName ? name : "Capitalization",
color,
unit: Unit.usd,
}),
]);
}
/**
* Create cost basis min/max series (available on all cohorts)
* @param {PartialContext} ctx
* @param {readonly CohortObject[]} list
* @param {boolean} useGroupName
* @returns {AnyFetchedSeriesBlueprint[]}
*/
export function createCostBasisMinMaxSeries(ctx, list, useGroupName) {
const { line } = ctx;
return list.flatMap(({ color, name, tree }) => [
line({
metric: tree.costBasis.min,
name: useGroupName ? `${name} min` : "Min",
color,
unit: Unit.usd,
}),
line({
metric: tree.costBasis.max,
name: useGroupName ? `${name} max` : "Max",
color,
unit: Unit.usd,
}),
]);
}
/**
* Create cost basis percentile series (only for cohorts with CostBasisPattern2)
* @param {PartialContext} ctx
* @param {readonly CohortWithCostBasisPercentiles[]} list
* @param {boolean} useGroupName
* @returns {AnyFetchedSeriesBlueprint[]}
*/
export function createCostBasisPercentilesSeries(ctx, list, useGroupName) {
const { line } = ctx;
return list.flatMap(({ color, name, tree }) => {
const percentiles = tree.costBasis.percentiles;
return [
line({
metric: percentiles.pct10,
name: useGroupName ? `${name} p10` : "p10",
color,
unit: Unit.usd,
defaultActive: false,
}),
line({
metric: percentiles.pct25,
name: useGroupName ? `${name} p25` : "p25",
color,
unit: Unit.usd,
defaultActive: false,
}),
line({
metric: percentiles.pct50,
name: useGroupName ? `${name} p50` : "p50",
color,
unit: Unit.usd,
}),
line({
metric: percentiles.pct75,
name: useGroupName ? `${name} p75` : "p75",
color,
unit: Unit.usd,
defaultActive: false,
}),
line({
metric: percentiles.pct90,
name: useGroupName ? `${name} p90` : "p90",
color,
unit: Unit.usd,
defaultActive: false,
}),
];
});
}

2246
website/scripts/options/cohorts/utxo.js Normal file
View File

File diff suppressed because it is too large Load Diff

488
website/scripts/options/cointime.js Normal file
View File

@@ -0,0 +1,488 @@
/** Cointime section builder - typed tree-based patterns */
import { Unit } from "../utils/units.js";
/**
* Create price with ratio options for cointime prices
* @param {PartialContext} ctx
* @param {Object} args
* @param {string} args.title
* @param {string} args.legend
* @param {AnyMetricPattern} args.price
* @param {ActivePriceRatioPattern} args.ratio
* @param {Color} [args.color]
* @returns {PartialOptionsTree}
*/
function createCointimePriceWithRatioOptions(
ctx,
{ title, legend, price, ratio, color },
) {
const { line, colors, createPriceLine } = ctx;
// Percentile USD mappings
const percentileUsdMap = [
{ name: "pct99", prop: ratio.ratioPct99Usd, color: colors.rose },
{ name: "pct98", prop: ratio.ratioPct98Usd, color: colors.pink },
{ name: "pct95", prop: ratio.ratioPct95Usd, color: colors.fuchsia },
{ name: "pct5", prop: ratio.ratioPct5Usd, color: colors.cyan },
{ name: "pct2", prop: ratio.ratioPct2Usd, color: colors.sky },
{ name: "pct1", prop: ratio.ratioPct1Usd, color: colors.blue },
];
// Percentile ratio mappings
const percentileMap = [
{ name: "pct99", prop: ratio.ratioPct99, color: colors.rose },
{ name: "pct98", prop: ratio.ratioPct98, color: colors.pink },
{ name: "pct95", prop: ratio.ratioPct95, color: colors.fuchsia },
{ name: "pct5", prop: ratio.ratioPct5, color: colors.cyan },
{ name: "pct2", prop: ratio.ratioPct2, color: colors.sky },
{ name: "pct1", prop: ratio.ratioPct1, color: colors.blue },
];
// SD patterns by window
const sdPatterns = [
{ nameAddon: "all", titleAddon: "", sd: ratio.ratioSd },
{ nameAddon: "4y", titleAddon: "4y", sd: ratio.ratio4ySd },
{ nameAddon: "2y", titleAddon: "2y", sd: ratio.ratio2ySd },
{ nameAddon: "1y", titleAddon: "1y", sd: ratio.ratio1ySd },
];
/** @param {Ratio1ySdPattern} sd */
const getSdBands = (sd) => [
{ name: "0σ", prop: sd._0sdUsd, color: colors.lime },
{ name: "+0.5σ", prop: sd.p05sdUsd, color: colors.yellow },
{ name: "+1σ", prop: sd.p1sdUsd, color: colors.amber },
{ name: "+1.5σ", prop: sd.p15sdUsd, color: colors.orange },
{ name: "+2σ", prop: sd.p2sdUsd, color: colors.red },
{ name: "+2.5σ", prop: sd.p25sdUsd, color: colors.rose },
{ name: "+3σ", prop: sd.p3sd, color: colors.pink },
{ name: "−0.5σ", prop: sd.m05sdUsd, color: colors.teal },
{ name: "−1σ", prop: sd.m1sdUsd, color: colors.cyan },
{ name: "−1.5σ", prop: sd.m15sdUsd, color: colors.sky },
{ name: "−2σ", prop: sd.m2sdUsd, color: colors.blue },
{ name: "−2.5σ", prop: sd.m25sdUsd, color: colors.indigo },
{ name: "−3σ", prop: sd.m3sd, color: colors.violet },
];
return [
{
name: "price",
title,
top: [line({ metric: price, name: legend, color, unit: Unit.usd })],
},
{
name: "Ratio",
title: `${title} Ratio`,
top: [
line({ metric: price, name: legend, color, unit: Unit.usd }),
...percentileUsdMap.map(({ name: pctName, prop, color: pctColor }) =>
line({
metric: prop,
name: pctName,
color: pctColor,
defaultActive: false,
unit: Unit.usd,
options: { lineStyle: 1 },
}),
),
],
bottom: [
line({ metric: ratio.ratio, name: "Ratio", color, unit: Unit.ratio }),
line({
metric: ratio.ratio1wSma,
name: "1w SMA",
color: colors.lime,
unit: Unit.ratio,
}),
line({
metric: ratio.ratio1mSma,
name: "1m SMA",
color: colors.teal,
unit: Unit.ratio,
}),
line({
metric: ratio.ratio1ySd.sma,
name: "1y SMA",
color: colors.sky,
unit: Unit.ratio,
}),
line({
metric: ratio.ratio2ySd.sma,
name: "2y SMA",
color: colors.indigo,
unit: Unit.ratio,
}),
line({
metric: ratio.ratio4ySd.sma,
name: "4y SMA",
color: colors.purple,
unit: Unit.ratio,
}),
line({
metric: ratio.ratioSd.sma,
name: "All SMA",
color: colors.rose,
unit: Unit.ratio,
}),
...percentileMap.map(({ name: pctName, prop, color: pctColor }) =>
line({
metric: prop,
name: pctName,
color: pctColor,
defaultActive: false,
unit: Unit.ratio,
options: { lineStyle: 1 },
}),
),
createPriceLine({ unit: Unit.ratio, number: 1 }),
],
},
{
name: "ZScores",
tree: sdPatterns.map(({ nameAddon, titleAddon, sd }) => ({
name: nameAddon,
title: `${title} ${titleAddon} Z-Score`,
top: getSdBands(sd).map(({ name: bandName, prop, color: bandColor }) =>
line({
metric: prop,
name: bandName,
color: bandColor,
unit: Unit.usd,
}),
),
bottom: [
line({ metric: sd.zscore, name: "Z-Score", color, unit: Unit.sd }),
createPriceLine({ unit: Unit.sd, number: 3 }),
createPriceLine({ unit: Unit.sd, number: 2 }),
createPriceLine({ unit: Unit.sd, number: 1 }),
createPriceLine({ unit: Unit.sd, number: 0 }),
createPriceLine({ unit: Unit.sd, number: -1 }),
createPriceLine({ unit: Unit.sd, number: -2 }),
createPriceLine({ unit: Unit.sd, number: -3 }),
],
})),
},
];
}
/**
* Create Cointime section
* @param {PartialContext} ctx
* @returns {PartialOptionsGroup}
*/
export function createCointimeSection(ctx) {
const { colors, brk, line } = ctx;
const { cointime, distribution, supply } = brk.metrics;
const { pricing, cap, activity, supply: cointimeSupply, adjusted } = cointime;
const { all } = distribution.utxoCohorts;
// Cointime prices data
const cointimePrices = [
{
price: pricing.trueMarketMean,
ratio: pricing.trueMarketMeanRatio,
name: "True market mean",
title: "true market mean",
color: colors.blue,
},
{
price: pricing.vaultedPrice,
ratio: pricing.vaultedPriceRatio,
name: "Vaulted",
title: "vaulted price",
color: colors.lime,
},
{
price: pricing.activePrice,
ratio: pricing.activePriceRatio,
name: "Active",
title: "active price",
color: colors.rose,
},
{
price: pricing.cointimePrice,
ratio: pricing.cointimePriceRatio,
name: "cointime",
title: "cointime price",
color: colors.yellow,
},
];
// Cointime capitalizations data
const cointimeCapitalizations = [
{
metric: cap.vaultedCap,
name: "vaulted",
title: "vaulted Capitalization",
color: colors.lime,
},
{
metric: cap.activeCap,
name: "active",
title: "active Capitalization",
color: colors.rose,
},
{
metric: cap.cointimeCap,
name: "cointime",
title: "cointime Capitalization",
color: colors.yellow,
},
{
metric: cap.investorCap,
name: "investor",
title: "investor Capitalization",
color: colors.fuchsia,
},
{
metric: cap.thermoCap,
name: "thermo",
title: "thermo Capitalization",
color: colors.emerald,
},
];
return {
name: "Cointime",
tree: [
// Prices
{
name: "Prices",
tree: [
{
name: "Compare",
title: "Compare Cointime Prices",
top: cointimePrices.map(({ price, name, color }) =>
line({ metric: price, name, color, unit: Unit.usd }),
),
},
...cointimePrices.map(({ price, ratio, name, color, title }) => ({
name,
tree: createCointimePriceWithRatioOptions(ctx, {
price,
ratio,
legend: name,
color,
title,
}),
})),
],
},
// Capitalization
{
name: "Capitalization",
tree: [
{
name: "Compare",
title: "Compare Cointime Capitalizations",
bottom: [
line({
metric: supply.marketCap,
name: "Market",
color: colors.default,
unit: Unit.usd,
}),
line({
metric: all.realized.realizedCap,
name: "Realized",
color: colors.orange,
unit: Unit.usd,
}),
...cointimeCapitalizations.map(({ metric, name, color }) =>
line({ metric, name, color, unit: Unit.usd }),
),
],
},
...cointimeCapitalizations.map(({ metric, name, color, title }) => ({
name,
title,
bottom: [
line({ metric, name, color, unit: Unit.usd }),
line({
metric: supply.marketCap,
name: "Market",
color: colors.default,
unit: Unit.usd,
}),
line({
metric: all.realized.realizedCap,
name: "Realized",
color: colors.orange,
unit: Unit.usd,
}),
],
})),
],
},
// Supply
{
name: "Supply",
title: "Cointime Supply",
bottom: [
// All supply (different pattern structure)
line({
metric: all.supply.total.sats,
name: "All",
color: colors.orange,
unit: Unit.sats,
}),
line({
metric: all.supply.total.bitcoin,
name: "All",
color: colors.orange,
unit: Unit.btc,
}),
line({
metric: all.supply.total.dollars,
name: "All",
color: colors.orange,
unit: Unit.usd,
}),
// Cointime supplies (ActiveSupplyPattern)
.../** @type {const} */ ([
[cointimeSupply.vaultedSupply, "Vaulted", colors.lime],
[cointimeSupply.activeSupply, "Active", colors.rose],
]).flatMap(([supplyItem, name, color]) => [
line({ metric: supplyItem.sats, name, color, unit: Unit.sats }),
line({ metric: supplyItem.bitcoin, name, color, unit: Unit.btc }),
line({ metric: supplyItem.dollars, name, color, unit: Unit.usd }),
]),
],
},
// Liveliness & Vaultedness
{
name: "Liveliness & Vaultedness",
title: "Liveliness & Vaultedness",
bottom: [
line({
metric: activity.liveliness,
name: "Liveliness",
color: colors.rose,
unit: Unit.ratio,
}),
line({
metric: activity.vaultedness,
name: "Vaultedness",
color: colors.lime,
unit: Unit.ratio,
}),
line({
metric: activity.activityToVaultednessRatio,
name: "Liveliness / Vaultedness",
color: colors.purple,
unit: Unit.ratio,
}),
],
},
// Coinblocks
{
name: "Coinblocks",
title: "Coinblocks",
bottom: [
// Destroyed comes from the all cohort's activity
line({
metric: all.activity.coinblocksDestroyed.sum,
name: "Destroyed",
color: colors.red,
unit: Unit.coinblocks,
}),
line({
metric: all.activity.coinblocksDestroyed.cumulative,
name: "Cumulative Destroyed",
color: colors.red,
defaultActive: false,
unit: Unit.coinblocks,
}),
// Created and stored from cointime
line({
metric: activity.coinblocksCreated.sum,
name: "Created",
color: colors.orange,
unit: Unit.coinblocks,
}),
line({
metric: activity.coinblocksCreated.cumulative,
name: "Cumulative Created",
color: colors.orange,
defaultActive: false,
unit: Unit.coinblocks,
}),
line({
metric: activity.coinblocksStored.sum,
name: "Stored",
color: colors.green,
unit: Unit.coinblocks,
}),
line({
metric: activity.coinblocksStored.cumulative,
name: "Cumulative Stored",
color: colors.green,
defaultActive: false,
unit: Unit.coinblocks,
}),
],
},
// Adjusted metrics
{
name: "Adjusted",
tree: [
// Inflation
{
name: "Inflation",
title: "Cointime-Adjusted Inflation Rate",
bottom: [
line({
metric: supply.inflation,
name: "Base",
color: colors.orange,
unit: Unit.percentage,
}),
line({
metric: adjusted.cointimeAdjInflationRate,
name: "Adjusted",
color: colors.purple,
unit: Unit.percentage,
}),
],
},
// Velocity
{
name: "Velocity",
title: "Cointime-Adjusted Transactions Velocity",
bottom: [
line({
metric: supply.velocity.btc,
name: "BTC",
color: colors.orange,
unit: Unit.ratio,
}),
line({
metric: adjusted.cointimeAdjTxBtcVelocity,
name: "Adj. BTC",
color: colors.red,
unit: Unit.ratio,
}),
line({
metric: supply.velocity.usd,
name: "USD",
color: colors.emerald,
unit: Unit.ratio,
}),
line({
metric: adjusted.cointimeAdjTxUsdVelocity,
name: "Adj. USD",
color: colors.lime,
unit: Unit.ratio,
}),
],
},
],
},
],
};
}

152
website/scripts/options/colors/cohorts.js Normal file
View File

@@ -0,0 +1,152 @@
/** Cohort color mappings */
/** @type {Readonly<Record<string, ColorName>>} */
export const termColors = {
short: "yellow",
long: "fuchsia",
};
/** @type {Readonly<Record<string, ColorName>>} */
export const maxAgeColors = {
_1w: "red",
_1m: "orange",
_2m: "amber",
_3m: "yellow",
_4m: "lime",
_5m: "green",
_6m: "teal",
_1y: "sky",
_2y: "indigo",
_3y: "violet",
_4y: "purple",
_5y: "fuchsia",
_6y: "pink",
_7y: "red",
_8y: "orange",
_10y: "amber",
_12y: "yellow",
_15y: "lime",
};
/** @type {Readonly<Record<string, ColorName>>} */
export const minAgeColors = {
_1d: "red",
_1w: "orange",
_1m: "yellow",
_2m: "lime",
_3m: "green",
_4m: "teal",
_5m: "cyan",
_6m: "blue",
_1y: "indigo",
_2y: "violet",
_3y: "purple",
_4y: "fuchsia",
_5y: "pink",
_6y: "rose",
_7y: "red",
_8y: "orange",
_10y: "yellow",
_12y: "lime",
};
/** @type {Readonly<Record<string, ColorName>>} */
export const ageRangeColors = {
upTo1d: "pink",
_1dTo1w: "red",
_1wTo1m: "orange",
_1mTo2m: "yellow",
_2mTo3m: "yellow",
_3mTo4m: "lime",
_4mTo5m: "lime",
_5mTo6m: "lime",
_6mTo1y: "green",
_1yTo2y: "cyan",
_2yTo3y: "blue",
_3yTo4y: "indigo",
_4yTo5y: "violet",
_5yTo6y: "purple",
_6yTo7y: "purple",
_7yTo8y: "fuchsia",
_8yTo10y: "fuchsia",
_10yTo12y: "pink",
_12yTo15y: "red",
from15y: "orange",
};
/** @type {Readonly<Record<string, ColorName>>} */
export const epochColors = {
_0: "red",
_1: "yellow",
_2: "orange",
_3: "lime",
_4: "green",
};
/** @type {Readonly<Record<string, ColorName>>} */
export const geAmountColors = {
_1sat: "orange",
_10sats: "orange",
_100sats: "yellow",
_1kSats: "lime",
_10kSats: "green",
_100kSats: "cyan",
_1mSats: "blue",
_10mSats: "indigo",
_1btc: "purple",
_10btc: "violet",
_100btc: "fuchsia",
_1kBtc: "pink",
_10kBtc: "red",
};
/** @type {Readonly<Record<string, ColorName>>} */
export const ltAmountColors = {
_10sats: "orange",
_100sats: "yellow",
_1kSats: "lime",
_10kSats: "green",
_100kSats: "cyan",
_1mSats: "blue",
_10mSats: "indigo",
_1btc: "purple",
_10btc: "violet",
_100btc: "fuchsia",
_1kBtc: "pink",
_10kBtc: "red",
_100kBtc: "orange",
};
/** @type {Readonly<Record<string, ColorName>>} */
export const amountRangeColors = {
_0sats: "red",
_1satTo10sats: "orange",
_10satsTo100sats: "yellow",
_100satsTo1kSats: "lime",
_1kSatsTo10kSats: "green",
_10kSatsTo100kSats: "cyan",
_100kSatsTo1mSats: "blue",
_1mSatsTo10mSats: "indigo",
_10mSatsTo1btc: "purple",
_1btcTo10btc: "violet",
_10btcTo100btc: "fuchsia",
_100btcTo1kBtc: "pink",
_1kBtcTo10kBtc: "red",
_10kBtcTo100kBtc: "orange",
_100kBtcOrMore: "yellow",
};
/** @type {Readonly<Record<string, ColorName>>} */
export const spendableTypeColors = {
p2pk65: "red",
p2pk33: "orange",
p2pkh: "yellow",
p2ms: "lime",
p2sh: "green",
p2wpkh: "teal",
p2wsh: "blue",
p2tr: "indigo",
p2a: "purple",
unknown: "violet",
empty: "fuchsia",
};

14
website/scripts/options/colors/index.js Normal file
View File

@@ -0,0 +1,14 @@
// Re-export all color mappings
export {
termColors,
maxAgeColors,
minAgeColors,
ageRangeColors,
epochColors,
geAmountColors,
ltAmountColors,
amountRangeColors,
spendableTypeColors,
} from "./cohorts.js";
export { averageColors, dcaColors } from "./misc.js";

42
website/scripts/options/colors/misc.js Normal file
View File

@@ -0,0 +1,42 @@
/** Miscellaneous color mappings for DCA and averages */
/**
* Moving average period colors
* Format: [periodId, days, colorName]
* @type {readonly [string, number, ColorName][]}
*/
export const averageColors = [
["1w", 7, "red"],
["8d", 8, "orange"],
["13d", 13, "amber"],
["21d", 21, "yellow"],
["1m", 30, "lime"],
["34d", 34, "green"],
["55d", 55, "emerald"],
["89d", 89, "teal"],
["144d", 144, "cyan"],
["200d", 200, "sky"],
["1y", 365, "blue"],
["2y", 730, "indigo"],
["200w", 1400, "violet"],
["4y", 1460, "purple"],
];
/**
* DCA class colors by year
* Format: [year, colorName, defaultActive]
* @type {readonly [number, ColorName, boolean][]}
*/
export const dcaColors = [
[2015, "pink", false],
[2016, "red", false],
[2017, "orange", true],
[2018, "yellow", true],
[2019, "green", true],
[2020, "teal", true],
[2021, "sky", true],
[2022, "blue", true],
[2023, "purple", true],
[2024, "fuchsia", true],
[2025, "pink", true],
];

118
website/scripts/options/constants.js Normal file
View File

@@ -0,0 +1,118 @@
/** Constant helpers for creating price lines and reference lines */
import { line } from "./series.js";
/**
* Get constant pattern by number dynamically from tree
* Examples: 0 → constant0, 38.2 → constant382, -1 → constantMinus1
* @param {BrkClient["metrics"]["constants"]} constants
* @param {number} num
* @returns {AnyMetricPattern}
*/
export function getConstant(constants, num) {
const key =
num >= 0
? `constant${String(num).replace(".", "")}`
: `constantMinus${Math.abs(num)}`;
const constant = /** @type {AnyMetricPattern | undefined} */ (
/** @type {Record<string, AnyMetricPattern>} */ (constants)[key]
);
if (!constant) throw new Error(`Unknown constant: ${num} (key: ${key})`);
return constant;
}
/**
* Create a price line series (horizontal reference line)
* @param {Object} args
* @param {BrkClient["metrics"]["constants"]} args.constants
* @param {Colors} args.colors
* @param {number} [args.number]
* @param {string} [args.name]
* @param {boolean} [args.defaultActive]
* @param {number} [args.lineStyle]
* @param {Color} [args.color]
* @param {Unit} args.unit
* @returns {FetchedLineSeriesBlueprint}
*/
export function createPriceLine({
constants,
colors,
number = 0,
unit,
defaultActive,
color,
name,
lineStyle,
}) {
return {
metric: getConstant(constants, number),
title: name ?? `${number}`,
unit,
defaultActive,
color: color ?? colors.gray,
options: {
lineStyle: lineStyle ?? 4,
lastValueVisible: false,
crosshairMarkerVisible: false,
},
};
}
/**
* Create multiple price lines from an array of numbers
* @param {Object} args
* @param {BrkClient["metrics"]["constants"]} args.constants
* @param {Colors} args.colors
* @param {number[]} args.numbers
* @param {Unit} args.unit
* @returns {FetchedLineSeriesBlueprint[]}
*/
export function createPriceLines({ constants, colors, numbers, unit }) {
return numbers.map((number) => ({
metric: getConstant(constants, number),
title: `${number}`,
unit,
defaultActive: !number,
color: colors.gray,
options: {
lineStyle: 4,
lastValueVisible: false,
crosshairMarkerVisible: false,
},
}));
}
/**
* Create a constant line series
* @param {Object} args
* @param {Colors} args.colors
* @param {AnyMetricPattern} args.constant
* @param {string} args.name
* @param {Unit} args.unit
* @param {Color} [args.color]
* @param {number} [args.lineStyle]
* @param {boolean} [args.defaultActive]
* @returns {FetchedLineSeriesBlueprint}
*/
export function constantLine({
colors,
constant,
name,
unit,
color,
lineStyle,
defaultActive,
}) {
return line({
metric: constant,
name,
unit,
defaultActive,
color: color ?? colors.gray,
options: {
lineStyle: lineStyle ?? 4,
lastValueVisible: false,
crosshairMarkerVisible: false,
},
});
}

96
website/scripts/options/context.js Normal file
View File

@@ -0,0 +1,96 @@
import {
line,
dots,
candlestick,
baseline,
histogram,
fromBlockCount,
fromBitcoin,
fromBlockSize,
fromSizePattern,
fromFullnessPattern,
fromFeeRatePattern,
fromCoinbasePattern,
fromValuePattern,
fromBitcoinPatternWithUnit,
fromBlockCountWithUnit,
fromIntervalPattern,
fromSupplyPattern,
} from "./series.js";
import {
createPriceLine,
createPriceLines,
constantLine,
} from "./constants.js";
/**
* Create a context object with all dependencies for building partial options
* @param {Object} args
* @param {Colors} args.colors
* @param {BrkClient} args.brk
* @returns {PartialContext}
*/
export function createContext({ colors, brk }) {
const constants = brk.metrics.constants;
return {
colors,
brk,
// Series helpers
line,
dots,
candlestick,
baseline,
histogram,
fromBlockCount: (pattern, title, color) =>
fromBlockCount(colors, pattern, title, color),
fromBitcoin: (pattern, title, color) =>
fromBitcoin(colors, pattern, title, color),
fromBlockSize: (pattern, title, color) =>
fromBlockSize(colors, pattern, title, color),
fromSizePattern: (pattern, title, unit) =>
fromSizePattern(colors, pattern, title, unit),
fromFullnessPattern: (pattern, title, unit) =>
fromFullnessPattern(colors, pattern, title, unit),
fromFeeRatePattern: (pattern, title, unit) =>
fromFeeRatePattern(colors, pattern, title, unit),
fromCoinbasePattern: (pattern, title) =>
fromCoinbasePattern(colors, pattern, title),
fromValuePattern: (pattern, title, sumColor, cumulativeColor) =>
fromValuePattern(colors, pattern, title, sumColor, cumulativeColor),
fromBitcoinPatternWithUnit: (
pattern,
title,
unit,
sumColor,
cumulativeColor,
) =>
fromBitcoinPatternWithUnit(
colors,
pattern,
title,
unit,
sumColor,
cumulativeColor,
),
fromBlockCountWithUnit: (pattern, title, unit, sumColor, cumulativeColor) =>
fromBlockCountWithUnit(
colors,
pattern,
title,
unit,
sumColor,
cumulativeColor,
),
fromIntervalPattern: (pattern, title, unit, color) =>
fromIntervalPattern(colors, pattern, title, unit, color),
fromSupplyPattern: (pattern, title, color) =>
fromSupplyPattern(colors, pattern, title, color),
createPriceLine: (args) => createPriceLine({ constants, colors, ...args }),
createPriceLines: (args) =>
createPriceLines({ constants, colors, ...args }),
constantLine: (args) => constantLine({ colors, ...args }),
};
}

378
website/scripts/options/full.js Normal file
View File

@@ -0,0 +1,378 @@
import { createPartialOptions } from "./partial.js";
import {
createButtonElement,
createAnchorElement,
insertElementAtIndex,
} from "../utils/dom.js";
import { pushHistory, resetParams } from "../utils/url.js";
import { readStored, writeToStorage } from "../utils/storage.js";
import { stringToId } from "../utils/format.js";
import { collect, markUsed, logUnused } from "./unused.js";
/**
* @param {Object} args
* @param {Colors} args.colors
* @param {Signals} args.signals
* @param {BrkClient} args.brk
* @param {Signal<string | null>} args.qrcode
*/
export function initOptions({ colors, signals, brk, qrcode }) {
collect(brk.metrics);
const LS_SELECTED_KEY = `selected_path`;
const urlPath_ = window.document.location.pathname
.split("/")
.filter((v) => v);
const urlPath = urlPath_.length ? urlPath_ : undefined;
const savedPath = /** @type {string[]} */ (
JSON.parse(readStored(LS_SELECTED_KEY) || "[]") || []
).filter((v) => v);
console.log(savedPath);
/** @type {Signal<Option>} */
const selected = signals.createSignal(/** @type {any} */ (undefined));
const partialOptions = createPartialOptions({
colors,
brk,
});
/** @type {Option[]} */
const list = [];
const parent = signals.createSignal(/** @type {HTMLElement | null} */ (null));
/**
* @param {AnyFetchedSeriesBlueprint[]} [arr]
*/
function arrayToMap(arr = []) {
/** @type {Map<Unit, AnyFetchedSeriesBlueprint[]>} */
const map = new Map();
for (const blueprint of arr || []) {
if (!blueprint.metric) {
throw new Error(
`Blueprint missing metric: ${JSON.stringify(blueprint)}`,
);
}
if (!blueprint.unit) {
throw new Error(`Blueprint missing unit: ${blueprint.title}`);
}
markUsed(blueprint.metric);
const unit = blueprint.unit;
if (!map.has(unit)) {
map.set(unit, []);
}
map.get(unit)?.push(blueprint);
}
return map;
}
/**
* @param {Option} option
*/
function selectOption(option) {
pushHistory(option.path);
resetParams(option);
writeToStorage(LS_SELECTED_KEY, JSON.stringify(option.path));
selected.set(option);
}
/**
* @param {Object} args
* @param {Option} args.option
* @param {Signal<string | null>} args.qrcode
* @param {string} [args.name]
*/
function createOptionElement({ option, name, qrcode }) {
const title = option.title;
if (option.kind === "url") {
const href = option.url();
if (option.qrcode) {
return createButtonElement({
inside: option.name,
title,
onClick: () => {
qrcode.set(option.url);
},
});
} else {
return createAnchorElement({
href,
blank: true,
text: option.name,
title,
});
}
} else {
return createAnchorElement({
href: `/${option.path.join("/")}`,
title,
text: name || option.name,
onClick: () => {
selectOption(option);
},
});
}
}
/** @type {Option | undefined} */
let savedOption;
/**
* @param {PartialOptionsTree} partialTree
* @param {Accessor<HTMLElement | null>} parent
* @param {string[] | undefined} parentPath
* @returns {Accessor<number>}
*/
function recursiveProcessPartialTree(
partialTree,
parent,
parentPath = [],
depth = 0,
) {
/** @type {Accessor<number>[]} */
const listForSum = [];
const ul = signals.createMemo(
// @ts_ignore
(_previous) => {
const previous = /** @type {HTMLUListElement | null} */ (_previous);
previous?.remove();
const _parent = parent();
if (_parent) {
if ("open" in _parent && !_parent.open) {
throw "Set accesor to null instead";
}
const ul = window.document.createElement("ul");
_parent.append(ul);
return ul;
} else {
return null;
}
},
null,
);
partialTree.forEach((anyPartial, partialIndex) => {
const renderLi = signals.createSignal(true);
const li = signals.createMemo((_previous) => {
const previous = _previous;
previous?.remove();
const _ul = ul();
if (renderLi() && _ul) {
const li = window.document.createElement("li");
insertElementAtIndex(_ul, li, partialIndex);
return li;
} else {
return null;
}
}, /** @type {HTMLLIElement | null} */ (null));
if ("tree" in anyPartial) {
/** @type {Omit<OptionsGroup, keyof PartialOptionsGroup>} */
const groupAddons = {};
Object.assign(anyPartial, groupAddons);
const passedDetails = signals.createSignal(
/** @type {HTMLDivElement | HTMLDetailsElement | null} */ (null),
);
const serName = stringToId(anyPartial.name);
const path = [...parentPath, serName];
const childOptionsCount = recursiveProcessPartialTree(
anyPartial.tree,
passedDetails,
path,
depth + 1,
);
listForSum.push(childOptionsCount);
signals.createEffect(li, (li) => {
if (!li) {
passedDetails.set(null);
return;
}
signals.createEffect(selected, (selected) => {
if (
path.length <= selected.path.length &&
path.every((v, i) => selected.path.at(i) === v)
) {
li.dataset.highlight = "";
} else {
delete li.dataset.highlight;
}
});
const details = window.document.createElement("details");
details.dataset.name = serName;
li.appendChild(details);
const summary = window.document.createElement("summary");
details.append(summary);
summary.append(anyPartial.name);
const supCount = window.document.createElement("sup");
summary.append(supCount);
signals.createEffect(childOptionsCount, (childOptionsCount) => {
supCount.innerHTML = childOptionsCount.toLocaleString("en-us");
});
details.addEventListener("toggle", () => {
const open = details.open;
if (open) {
passedDetails.set(details);
} else {
passedDetails.set(null);
}
});
});
function createRenderLiEffect() {
signals.createEffect(childOptionsCount, (count) => {
renderLi.set(!!count);
});
}
createRenderLiEffect();
} else {
const option = /** @type {Option} */ (anyPartial);
const name = option.name;
const path = [...parentPath, stringToId(option.name)];
if ("kind" in anyPartial && anyPartial.kind === "explorer") {
Object.assign(
option,
/** @satisfies {ExplorerOption} */ ({
kind: anyPartial.kind,
path,
name,
title: option.title,
}),
);
} else if ("kind" in anyPartial && anyPartial.kind === "table") {
Object.assign(
option,
/** @satisfies {TableOption} */ ({
kind: anyPartial.kind,
path,
name,
title: option.title,
}),
);
} else if ("kind" in anyPartial && anyPartial.kind === "simulation") {
Object.assign(
option,
/** @satisfies {SimulationOption} */ ({
kind: anyPartial.kind,
path,
name,
title: anyPartial.title,
}),
);
} else if ("url" in anyPartial) {
Object.assign(
option,
/** @satisfies {UrlOption} */ ({
kind: "url",
path,
name,
title: name,
qrcode: !!anyPartial.qrcode,
url: anyPartial.url,
}),
);
} else {
const title = option.title || option.name;
Object.assign(
option,
/** @satisfies {ChartOption} */ ({
kind: "chart",
name,
title,
path,
top: arrayToMap(anyPartial.top),
bottom: arrayToMap(anyPartial.bottom),
}),
);
}
list.push(option);
if (urlPath) {
const sameAsURLPath =
urlPath.length === path.length &&
urlPath.every((val, i) => val === path[i]);
if (sameAsURLPath) {
selected.set(option);
}
} else if (savedPath) {
const sameAsSavedPath =
savedPath.length === path.length &&
savedPath.every((val, i) => val === path[i]);
if (sameAsSavedPath) {
savedOption = option;
}
}
signals.createEffect(li, (li) => {
if (!li) {
return;
}
signals.createEffect(selected, (selected) => {
if (selected === option) {
li.dataset.highlight = "";
} else {
delete li.dataset.highlight;
}
});
const element = createOptionElement({
option,
qrcode,
});
li.append(element);
});
listForSum.push(() => 1);
}
});
return signals.createMemo(() =>
listForSum.reduce((acc, s) => acc + s(), 0),
);
}
recursiveProcessPartialTree(partialOptions, parent);
logUnused();
if (!selected()) {
const option =
savedOption || list.find((option) => option.kind === "chart");
if (option) {
selected.set(option);
}
}
return {
selected,
list,
tree: /** @type {OptionsTree} */ (partialOptions),
parent,
createOptionElement,
selectOption,
};
}
/** @typedef {ReturnType<typeof initOptions>} Options */

237
website/scripts/options/market/averages.js Normal file
View File

@@ -0,0 +1,237 @@
/** Moving averages section */
import { Unit } from "../../utils/units.js";
import { periodIdToName } from "./utils.js";
/**
* Build averages data array from market patterns
* @param {Colors} colors
* @param {MarketMovingAverage} ma
*/
export function buildAverages(colors, ma) {
return /** @type {const} */ ([
["1w", 7, "red", ma.price1wSma, ma.price1wEma],
["8d", 8, "orange", ma.price8dSma, ma.price8dEma],
["13d", 13, "amber", ma.price13dSma, ma.price13dEma],
["21d", 21, "yellow", ma.price21dSma, ma.price21dEma],
["1m", 30, "lime", ma.price1mSma, ma.price1mEma],
["34d", 34, "green", ma.price34dSma, ma.price34dEma],
["55d", 55, "emerald", ma.price55dSma, ma.price55dEma],
["89d", 89, "teal", ma.price89dSma, ma.price89dEma],
["144d", 144, "cyan", ma.price144dSma, ma.price144dEma],
["200d", 200, "sky", ma.price200dSma, ma.price200dEma],
["1y", 365, "blue", ma.price1ySma, ma.price1yEma],
["2y", 730, "indigo", ma.price2ySma, ma.price2yEma],
["200w", 1400, "violet", ma.price200wSma, ma.price200wEma],
["4y", 1460, "purple", ma.price4ySma, ma.price4yEma],
]).map(([id, days, colorKey, sma, ema]) => ({
id,
name: periodIdToName(id, true),
days,
color: colors[colorKey],
sma,
ema,
}));
}
/**
* Create price with ratio options (for moving averages)
* @param {PartialContext} ctx
* @param {Object} args
* @param {string} args.title
* @param {string} args.legend
* @param {EmaRatioPattern} args.ratio
* @param {Color} [args.color]
* @returns {PartialOptionsTree}
*/
export function createPriceWithRatioOptions(
ctx,
{ title, legend, ratio, color },
) {
const { line, colors, createPriceLine } = ctx;
const priceMetric = ratio.price;
const percentileUsdMap = [
{ name: "pct99", prop: ratio.ratioPct99Usd, color: colors.rose },
{ name: "pct98", prop: ratio.ratioPct98Usd, color: colors.pink },
{ name: "pct95", prop: ratio.ratioPct95Usd, color: colors.fuchsia },
{ name: "pct5", prop: ratio.ratioPct5Usd, color: colors.cyan },
{ name: "pct2", prop: ratio.ratioPct2Usd, color: colors.sky },
{ name: "pct1", prop: ratio.ratioPct1Usd, color: colors.blue },
];
const percentileMap = [
{ name: "pct99", prop: ratio.ratioPct99, color: colors.rose },
{ name: "pct98", prop: ratio.ratioPct98, color: colors.pink },
{ name: "pct95", prop: ratio.ratioPct95, color: colors.fuchsia },
{ name: "pct5", prop: ratio.ratioPct5, color: colors.cyan },
{ name: "pct2", prop: ratio.ratioPct2, color: colors.sky },
{ name: "pct1", prop: ratio.ratioPct1, color: colors.blue },
];
const sdPatterns = [
{ nameAddon: "all", titleAddon: "", sd: ratio.ratioSd },
{ nameAddon: "4y", titleAddon: "4y", sd: ratio.ratio4ySd },
{ nameAddon: "2y", titleAddon: "2y", sd: ratio.ratio2ySd },
{ nameAddon: "1y", titleAddon: "1y", sd: ratio.ratio1ySd },
];
/** @param {Ratio1ySdPattern} sd */
const getSdBands = (sd) => [
{ name: "0σ", prop: sd._0sdUsd, color: colors.lime },
{ name: "+0.5σ", prop: sd.p05sdUsd, color: colors.yellow },
{ name: "+1σ", prop: sd.p1sdUsd, color: colors.amber },
{ name: "+1.5σ", prop: sd.p15sdUsd, color: colors.orange },
{ name: "+2σ", prop: sd.p2sdUsd, color: colors.red },
{ name: "+2.5σ", prop: sd.p25sdUsd, color: colors.rose },
{ name: "+3σ", prop: sd.p3sd, color: colors.pink },
{ name: "−0.5σ", prop: sd.m05sdUsd, color: colors.teal },
{ name: "−1σ", prop: sd.m1sdUsd, color: colors.cyan },
{ name: "−1.5σ", prop: sd.m15sdUsd, color: colors.sky },
{ name: "−2σ", prop: sd.m2sdUsd, color: colors.blue },
{ name: "−2.5σ", prop: sd.m25sdUsd, color: colors.indigo },
{ name: "−3σ", prop: sd.m3sd, color: colors.violet },
];
return [
{
name: "price",
title,
top: [line({ metric: priceMetric, name: legend, color, unit: Unit.usd })],
},
{
name: "Ratio",
title: `${title} Ratio`,
top: [
line({ metric: priceMetric, name: legend, color, unit: Unit.usd }),
...percentileUsdMap.map(({ name: pctName, prop, color: pctColor }) =>
line({
metric: prop,
name: pctName,
color: pctColor,
defaultActive: false,
unit: Unit.usd,
options: { lineStyle: 1 },
}),
),
],
bottom: [
line({ metric: ratio.ratio, name: "Ratio", color, unit: Unit.ratio }),
line({
metric: ratio.ratio1wSma,
name: "1w SMA",
color: colors.lime,
unit: Unit.ratio,
}),
line({
metric: ratio.ratio1mSma,
name: "1m SMA",
color: colors.teal,
unit: Unit.ratio,
}),
line({
metric: ratio.ratio1ySd.sma,
name: "1y SMA",
color: colors.sky,
unit: Unit.ratio,
}),
line({
metric: ratio.ratio2ySd.sma,
name: "2y SMA",
color: colors.indigo,
unit: Unit.ratio,
}),
line({
metric: ratio.ratio4ySd.sma,
name: "4y SMA",
color: colors.purple,
unit: Unit.ratio,
}),
line({
metric: ratio.ratioSd.sma,
name: "All SMA",
color: colors.rose,
unit: Unit.ratio,
}),
...percentileMap.map(({ name: pctName, prop, color: pctColor }) =>
line({
metric: prop,
name: pctName,
color: pctColor,
defaultActive: false,
unit: Unit.ratio,
options: { lineStyle: 1 },
}),
),
createPriceLine({ unit: Unit.ratio, number: 1 }),
],
},
{
name: "ZScores",
tree: sdPatterns.map(({ nameAddon, titleAddon, sd }) => ({
name: nameAddon,
title: `${title} ${titleAddon} Z-Score`,
top: getSdBands(sd).map(({ name: bandName, prop, color: bandColor }) =>
line({
metric: prop,
name: bandName,
color: bandColor,
unit: Unit.usd,
}),
),
bottom: [
line({ metric: sd.zscore, name: "Z-Score", color, unit: Unit.sd }),
createPriceLine({ unit: Unit.sd, number: 3 }),
createPriceLine({ unit: Unit.sd, number: 2 }),
createPriceLine({ unit: Unit.sd, number: 1 }),
createPriceLine({ unit: Unit.sd, number: 0 }),
createPriceLine({ unit: Unit.sd, number: -1 }),
createPriceLine({ unit: Unit.sd, number: -2 }),
createPriceLine({ unit: Unit.sd, number: -3 }),
],
})),
},
];
}
/**
* Create Averages section
* @param {PartialContext} ctx
* @param {ReturnType<typeof buildAverages>} averages
*/
export function createAveragesSection(ctx, averages) {
const { line } = ctx;
return {
name: "Averages",
tree: [
{ nameAddon: "Simple", metricAddon: /** @type {const} */ ("sma") },
{ nameAddon: "Exponential", metricAddon: /** @type {const} */ ("ema") },
].map(({ nameAddon, metricAddon }) => ({
name: nameAddon,
tree: [
{
name: "Compare",
title: `Market Price ${nameAddon} Moving Averages`,
top: averages.map(({ id, color, sma, ema }) =>
line({
metric: (metricAddon === "sma" ? sma : ema).price,
name: id,
color,
unit: Unit.usd,
}),
),
},
...averages.map(({ name, color, sma, ema }) => ({
name,
tree: createPriceWithRatioOptions(ctx, {
ratio: metricAddon === "sma" ? sma : ema,
title: `${name} Market Price ${nameAddon} Moving Average`,
legend: "average",
color,
}),
})),
],
})),
};
}

118
website/scripts/options/market/index.js Normal file
View File

@@ -0,0 +1,118 @@
/** Market section - Main entry point */
import { localhost } from "../../utils/env.js";
import { Unit } from "../../utils/units.js";
import { buildAverages, createAveragesSection } from "./averages.js";
import { createPerformanceSection } from "./performance.js";
import { createIndicatorsSection } from "./indicators/index.js";
import { createInvestingSection } from "./investing.js";
/**
* Create Market section
* @param {PartialContext} ctx
* @returns {PartialOptionsGroup}
*/
export function createMarketSection(ctx) {
const { colors, brk, line, candlestick } = ctx;
const { market, supply, price } = brk.metrics;
const {
movingAverage,
ath,
returns,
volatility,
range,
dca,
lookback,
indicators,
} = market;
const averages = buildAverages(colors, movingAverage);
return {
name: "Market",
tree: [
// Price
{
name: "Price",
title: "Bitcoin Price",
...(localhost && {
top: [
candlestick({
metric: price.oracle.ohlcDollars,
name: "Oracle",
unit: Unit.usd,
colors: [colors.cyan, colors.purple],
}),
],
}),
},
// Capitalization
{
name: "Capitalization",
title: "Market Capitalization",
bottom: [
line({
metric: supply.marketCap,
name: "Capitalization",
unit: Unit.usd,
}),
],
},
// All Time High
{
name: "All Time High",
title: "All Time High",
top: [line({ metric: ath.priceAth, name: "ATH", unit: Unit.usd })],
bottom: [
line({
metric: ath.priceDrawdown,
name: "Drawdown",
color: colors.red,
unit: Unit.percentage,
}),
line({
metric: ath.daysSincePriceAth,
name: "Since",
unit: Unit.days,
}),
line({
metric: ath.yearsSincePriceAth,
name: "Since",
unit: Unit.years,
}),
line({
metric: ath.maxDaysBetweenPriceAths,
name: "Max",
color: colors.red,
unit: Unit.days,
}),
line({
metric: ath.maxYearsBetweenPriceAths,
name: "Max",
color: colors.red,
unit: Unit.years,
}),
],
},
// Averages
createAveragesSection(ctx, averages),
// Performance
createPerformanceSection(ctx, returns),
// Indicators
createIndicatorsSection(ctx, {
volatility,
range,
movingAverage,
indicators,
}),
// Investing
createInvestingSection(ctx, { dca, lookback, returns }),
],
};
}

90
website/scripts/options/market/indicators/bands.js Normal file
View File

@@ -0,0 +1,90 @@
/** Bands indicators (MinMax, Mayer Multiple) */
import { Unit } from "../../../utils/units.js";
/**
* Create Bands section
* @param {PartialContext} ctx
* @param {Object} args
* @param {Market["range"]} args.range
* @param {Market["movingAverage"]} args.movingAverage
*/
export function createBandsSection(ctx, { range, movingAverage }) {
const { line, colors } = ctx;
return {
name: "Bands",
tree: [
{
name: "MinMax",
tree: [
{
id: "1w",
title: "1 Week",
min: range.price1wMin,
max: range.price1wMax,
},
{
id: "2w",
title: "2 Week",
min: range.price2wMin,
max: range.price2wMax,
},
{
id: "1m",
title: "1 Month",
min: range.price1mMin,
max: range.price1mMax,
},
{
id: "1y",
title: "1 Year",
min: range.price1yMin,
max: range.price1yMax,
},
].map(({ id, title, min, max }) => ({
name: id,
title: `Bitcoin Price ${title} MinMax Bands`,
top: [
line({
metric: min,
name: "Min",
color: colors.red,
unit: Unit.usd,
}),
line({
metric: max,
name: "Max",
color: colors.green,
unit: Unit.usd,
}),
],
})),
},
{
name: "Mayer Multiple",
title: "Mayer Multiple",
top: [
line({
metric: movingAverage.price200dSma.price,
name: "200d SMA",
color: colors.yellow,
unit: Unit.usd,
}),
line({
metric: movingAverage.price200dSmaX24,
name: "200d SMA x2.4",
color: colors.green,
unit: Unit.usd,
}),
line({
metric: movingAverage.price200dSmaX08,
name: "200d SMA x0.8",
color: colors.red,
unit: Unit.usd,
}),
],
},
],
};
}

27
website/scripts/options/market/indicators/index.js Normal file
View File

@@ -0,0 +1,27 @@
/** Indicators section - Main entry point */
import { createMomentumSection } from "./momentum.js";
import { createVolatilitySection } from "./volatility.js";
import { createBandsSection } from "./bands.js";
import { createOnchainSection } from "./onchain.js";
/**
* Create Indicators section
* @param {PartialContext} ctx
* @param {Object} args
* @param {Market["volatility"]} args.volatility
* @param {Market["range"]} args.range
* @param {Market["movingAverage"]} args.movingAverage
* @param {Market["indicators"]} args.indicators
*/
export function createIndicatorsSection(ctx, { volatility, range, movingAverage, indicators }) {
return {
name: "Indicators",
tree: [
createMomentumSection(ctx, indicators),
createVolatilitySection(ctx, { volatility, range }),
createBandsSection(ctx, { range, movingAverage }),
createOnchainSection(ctx, { indicators, movingAverage }),
],
};
}

111
website/scripts/options/market/indicators/momentum.js Normal file
View File

@@ -0,0 +1,111 @@
/** Momentum indicators (RSI, StochRSI, Stochastic, MACD) */
import { Unit } from "../../../utils/units.js";
/**
* Create Momentum section
* @param {PartialContext} ctx
* @param {Market["indicators"]} indicators
*/
export function createMomentumSection(ctx, indicators) {
const { line, histogram, colors, createPriceLine } = ctx;
return {
name: "Momentum",
tree: [
{
name: "RSI",
title: "Relative Strength Index (14d)",
bottom: [
line({
metric: indicators.rsi14d,
name: "RSI",
color: colors.indigo,
unit: Unit.index,
}),
line({
metric: indicators.rsi14dMin,
name: "Min",
color: colors.red,
defaultActive: false,
unit: Unit.index,
}),
line({
metric: indicators.rsi14dMax,
name: "Max",
color: colors.green,
defaultActive: false,
unit: Unit.index,
}),
createPriceLine({ unit: Unit.index, number: 70 }),
createPriceLine({
unit: Unit.index,
number: 50,
defaultActive: false,
}),
createPriceLine({ unit: Unit.index, number: 30 }),
],
},
{
name: "StochRSI",
title: "Stochastic RSI",
bottom: [
// line({
// metric: indicators.stochRsi,
// name: "Stoch RSI",
// color: colors.purple,
// unit: Unit.index,
// }),
line({
metric: indicators.stochRsiK,
name: "K",
color: colors.blue,
unit: Unit.index,
}),
line({
metric: indicators.stochRsiD,
name: "D",
color: colors.orange,
unit: Unit.index,
}),
createPriceLine({ unit: Unit.index, number: 80 }),
createPriceLine({ unit: Unit.index, number: 20 }),
],
},
// {
// name: "Stochastic",
// title: "Stochastic Oscillator",
// bottom: [
// line({ metric: indicators.stochK, name: "K", color: colors.blue, unit: Unit.index }),
// line({ metric: indicators.stochD, name: "D", color: colors.orange, unit: Unit.index }),
// createPriceLine({ unit: Unit.index, number: 80 }),
// createPriceLine({ unit: Unit.index, number: 20 }),
// ],
// },
{
name: "MACD",
title: "Moving Average Convergence Divergence",
bottom: [
line({
metric: indicators.macdLine,
name: "MACD",
color: colors.blue,
unit: Unit.usd,
}),
line({
metric: indicators.macdSignal,
name: "Signal",
color: colors.orange,
unit: Unit.usd,
}),
histogram({
metric: indicators.macdHistogram,
name: "Histogram",
unit: Unit.usd,
}),
createPriceLine({ unit: Unit.usd }),
],
},
],
};
}

83
website/scripts/options/market/indicators/onchain.js Normal file
View File

@@ -0,0 +1,83 @@
/** On-chain indicators (Pi Cycle, Puell, NVT, Gini) */
import { Unit } from "../../../utils/units.js";
/**
* Create On-chain section
* @param {PartialContext} ctx
* @param {Object} args
* @param {Market["indicators"]} args.indicators
* @param {Market["movingAverage"]} args.movingAverage
*/
export function createOnchainSection(ctx, { indicators, movingAverage }) {
const { line, colors, createPriceLine } = ctx;
return {
name: "On-chain",
tree: [
{
name: "Pi Cycle",
title: "Pi Cycle Top Indicator",
top: [
line({
metric: movingAverage.price111dSma.price,
name: "111d SMA",
color: colors.green,
unit: Unit.usd,
}),
line({
metric: movingAverage.price350dSmaX2,
name: "350d SMA x2",
color: colors.red,
unit: Unit.usd,
}),
],
bottom: [
line({
metric: indicators.piCycle,
name: "Pi Cycle",
color: colors.purple,
unit: Unit.ratio,
}),
createPriceLine({ unit: Unit.ratio, number: 1 }),
],
},
{
name: "Puell Multiple",
title: "Puell Multiple",
bottom: [
line({
metric: indicators.puellMultiple,
name: "Puell",
color: colors.green,
unit: Unit.ratio,
}),
],
},
{
name: "NVT",
title: "Network Value to Transactions Ratio",
bottom: [
line({
metric: indicators.nvt,
name: "NVT",
color: colors.orange,
unit: Unit.ratio,
}),
],
},
{
name: "Gini",
title: "Gini Coefficient",
bottom: [
line({
metric: indicators.gini,
name: "Gini",
color: colors.red,
unit: Unit.ratio,
}),
],
},
],
};
}

120
website/scripts/options/market/indicators/volatility.js Normal file
View File

@@ -0,0 +1,120 @@
/** Volatility indicators (Index, True Range, Choppiness, Sharpe, Sortino) */
import { Unit } from "../../../utils/units.js";
/**
* Create Volatility section
* @param {PartialContext} ctx
* @param {Object} args
* @param {Market["volatility"]} args.volatility
* @param {Market["range"]} args.range
*/
export function createVolatilitySection(ctx, { volatility, range }) {
const { line, colors, createPriceLine } = ctx;
return {
name: "Volatility",
tree: [
{
name: "Index",
title: "Bitcoin Price Volatility Index",
bottom: [
line({
metric: volatility.price1wVolatility,
name: "1w",
color: colors.red,
unit: Unit.percentage,
}),
line({
metric: volatility.price1mVolatility,
name: "1m",
color: colors.orange,
unit: Unit.percentage,
}),
line({
metric: volatility.price1yVolatility,
name: "1y",
color: colors.lime,
unit: Unit.percentage,
}),
],
},
{
name: "True Range",
title: "Bitcoin Price True Range",
bottom: [
line({
metric: range.priceTrueRange,
name: "Value",
color: colors.yellow,
unit: Unit.usd,
}),
],
},
{
name: "Choppiness",
title: "Bitcoin Price Choppiness Index",
bottom: [
line({
metric: range.price2wChoppinessIndex,
name: "2w",
color: colors.red,
unit: Unit.index,
}),
createPriceLine({ unit: Unit.index, number: 61.8 }),
createPriceLine({ unit: Unit.index, number: 38.2 }),
],
},
{
name: "Sharpe Ratio",
title: "Sharpe Ratio",
bottom: [
line({
metric: volatility.sharpe1w,
name: "1w",
color: colors.red,
unit: Unit.ratio,
}),
line({
metric: volatility.sharpe1m,
name: "1m",
color: colors.orange,
unit: Unit.ratio,
}),
line({
metric: volatility.sharpe1y,
name: "1y",
color: colors.lime,
unit: Unit.ratio,
}),
createPriceLine({ unit: Unit.ratio }),
],
},
{
name: "Sortino Ratio",
title: "Sortino Ratio",
bottom: [
line({
metric: volatility.sortino1w,
name: "1w",
color: colors.red,
unit: Unit.ratio,
}),
line({
metric: volatility.sortino1m,
name: "1m",
color: colors.orange,
unit: Unit.ratio,
}),
line({
metric: volatility.sortino1y,
name: "1y",
color: colors.lime,
unit: Unit.ratio,
}),
createPriceLine({ unit: Unit.ratio }),
],
},
],
};
}

284
website/scripts/options/market/investing.js Normal file
View File

@@ -0,0 +1,284 @@
/** Investing section (DCA) */
import { Unit } from "../../utils/units.js";
import { periodIdToName } from "./utils.js";
/**
* Build DCA classes data array
* @param {Colors} colors
* @param {MarketDca} dca
*/
export function buildDcaClasses(colors, dca) {
return /** @type {const} */ ([
[2025, "pink", true],
[2024, "fuchsia", true],
[2023, "purple", true],
[2022, "blue", true],
[2021, "sky", true],
[2020, "teal", true],
[2019, "green", true],
[2018, "yellow", true],
[2017, "orange", true],
[2016, "red", false],
[2015, "pink", false],
]).map(([year, colorKey, defaultActive]) => ({
year,
color: colors[colorKey],
defaultActive,
costBasis: dca.classAveragePrice[`_${year}`],
returns: dca.classReturns[`_${year}`],
stack: dca.classStack[`_${year}`],
}));
}
/**
* Create Investing section
* @param {PartialContext} ctx
* @param {Object} args
* @param {Market["dca"]} args.dca
* @param {Market["lookback"]} args.lookback
* @param {Market["returns"]} args.returns
*/
export function createInvestingSection(ctx, { dca, lookback, returns }) {
const { line, baseline, colors, createPriceLine } = ctx;
const dcaClasses = buildDcaClasses(colors, dca);
return {
name: "Investing",
tree: [
// DCA vs Lump sum
{
name: "DCA vs Lump sum",
tree: /** @type {const} */ ([
["1w", "_1w"],
["1m", "_1m"],
["3m", "_3m"],
["6m", "_6m"],
["1y", "_1y"],
["2y", "_2y"],
["3y", "_3y"],
["4y", "_4y"],
["5y", "_5y"],
["6y", "_6y"],
["8y", "_8y"],
["10y", "_10y"],
]).map(([id, key]) => {
const name = periodIdToName(id, true);
const priceAgo = lookback[key];
const priceReturns = returns.priceReturns[key];
const dcaCostBasis = dca.periodAveragePrice[key];
const dcaReturns = dca.periodReturns[key];
const dcaStack = dca.periodStack[key];
const lumpSumStack = dca.periodLumpSumStack[key];
return {
name,
tree: [
{
name: "Cost basis",
title: `${name} DCA vs Lump Sum (Cost Basis)`,
top: [
line({
metric: dcaCostBasis,
name: "DCA",
color: colors.green,
unit: Unit.usd,
}),
line({
metric: priceAgo,
name: "Lump sum",
color: colors.orange,
unit: Unit.usd,
}),
],
},
{
name: "Returns",
title: `${name} DCA vs Lump Sum (Returns)`,
bottom: [
baseline({
metric: dcaReturns,
name: "DCA",
unit: Unit.percentage,
}),
baseline({
metric: priceReturns,
name: "Lump sum",
color: [colors.lime, colors.red],
unit: Unit.percentage,
}),
createPriceLine({ unit: Unit.percentage }),
],
},
{
name: "Stack",
title: `${name} DCA vs Lump Sum Stack ($100/day)`,
bottom: [
line({
metric: dcaStack.sats,
name: "DCA",
color: colors.green,
unit: Unit.sats,
}),
line({
metric: dcaStack.bitcoin,
name: "DCA",
color: colors.green,
unit: Unit.btc,
}),
line({
metric: dcaStack.dollars,
name: "DCA",
color: colors.green,
unit: Unit.usd,
}),
line({
metric: lumpSumStack.sats,
name: "Lump sum",
color: colors.orange,
unit: Unit.sats,
}),
line({
metric: lumpSumStack.bitcoin,
name: "Lump sum",
color: colors.orange,
unit: Unit.btc,
}),
line({
metric: lumpSumStack.dollars,
name: "Lump sum",
color: colors.orange,
unit: Unit.usd,
}),
],
},
],
};
}),
},
// DCA classes
{
name: "DCA classes",
tree: [
// Comparison charts (all years overlaid)
{
name: "Compare",
tree: [
{
name: "Cost basis",
title: "DCA Cost Basis by Year",
top: dcaClasses.map(
({ year, color, defaultActive, costBasis }) =>
line({
metric: costBasis,
name: `${year}`,
color,
defaultActive,
unit: Unit.usd,
}),
),
},
{
name: "Returns",
title: "DCA Returns by Year",
bottom: dcaClasses.map(
({ year, color, defaultActive, returns }) =>
baseline({
metric: returns,
name: `${year}`,
color,
defaultActive,
unit: Unit.percentage,
}),
),
},
{
name: "Stack",
title: "DCA Stack by Year ($100/day)",
bottom: dcaClasses.flatMap(
({ year, color, defaultActive, stack }) => [
line({
metric: stack.sats,
name: `${year}`,
color,
defaultActive,
unit: Unit.sats,
}),
line({
metric: stack.bitcoin,
name: `${year}`,
color,
defaultActive,
unit: Unit.btc,
}),
line({
metric: stack.dollars,
name: `${year}`,
color,
defaultActive,
unit: Unit.usd,
}),
],
),
},
],
},
// Individual year charts
...dcaClasses.map(({ year, color, costBasis, returns, stack }) => ({
name: `${year}`,
tree: [
{
name: "Cost basis",
title: `DCA Class ${year} Cost Basis`,
top: [
line({
metric: costBasis,
name: "Cost basis",
color,
unit: Unit.usd,
}),
],
},
{
name: "Returns",
title: `DCA Class ${year} Returns`,
bottom: [
baseline({
metric: returns,
name: "Returns",
color,
unit: Unit.percentage,
}),
],
},
{
name: "Stack",
title: `DCA Class ${year} Stack ($100/day)`,
bottom: [
line({
metric: stack.sats,
name: "Stack",
color,
unit: Unit.sats,
}),
line({
metric: stack.bitcoin,
name: "Stack",
color,
unit: Unit.btc,
}),
line({
metric: stack.dollars,
name: "Stack",
color,
unit: Unit.usd,
}),
],
},
],
})),
],
},
],
};
}

58
website/scripts/options/market/performance.js Normal file
View File

@@ -0,0 +1,58 @@
/** Performance section */
import { Unit } from "../../utils/units.js";
import { periodIdToName } from "./utils.js";
/**
* Create Performance section
* @param {PartialContext} ctx
* @param {Market["returns"]} returns
*/
export function createPerformanceSection(ctx, returns) {
const { colors, baseline, createPriceLine } = ctx;
return {
name: "Performance",
tree: /** @type {const} */ ([
["1d", "_1d", undefined],
["1w", "_1w", undefined],
["1m", "_1m", undefined],
["3m", "_3m", undefined],
["6m", "_6m", undefined],
["1y", "_1y", undefined],
["2y", "_2y", "_2y"],
["3y", "_3y", "_3y"],
["4y", "_4y", "_4y"],
["5y", "_5y", "_5y"],
["6y", "_6y", "_6y"],
["8y", "_8y", "_8y"],
["10y", "_10y", "_10y"],
]).map(([id, returnKey, cagrKey]) => {
const priceReturns = returns.priceReturns[returnKey];
const cagr = cagrKey ? returns.cagr[cagrKey] : undefined;
const name = periodIdToName(id, true);
return {
name,
title: `${name} Performance`,
bottom: [
baseline({
metric: priceReturns,
name: "Total",
unit: Unit.percentage,
}),
...(cagr
? [
baseline({
metric: cagr,
name: "CAGR",
color: [colors.lime, colors.pink],
unit: Unit.percentage,
}),
]
: []),
createPriceLine({ unit: Unit.percentage }),
],
};
}),
};
}

23
website/scripts/options/market/utils.js Normal file
View File

@@ -0,0 +1,23 @@
/** Market utilities */
/**
* Convert period ID to readable name
* @param {string} id
* @param {boolean} [compoundAdjective]
*/
export function periodIdToName(id, compoundAdjective) {
const num = parseInt(id);
const s = compoundAdjective || num === 1 ? "" : "s";
switch (id.slice(-1)) {
case "d":
return `${num} day${s}`;
case "w":
return `${num} week${s}`;
case "m":
return `${num} month${s}`;
case "y":
return `${num} year${s}`;
default:
return id;
}
}

362
website/scripts/options/partial.js Normal file
View File

@@ -0,0 +1,362 @@
/** Partial options - Main entry point */
import { localhost } from "../utils/env.js";
import { createContext } from "./context.js";
import {
buildCohortData,
createCohortFolderAll,
createCohortFolderFull,
createCohortFolderWithAdjusted,
createCohortFolderWithPercentiles,
createCohortFolderBasic,
createAddressCohortFolder,
} from "./cohorts/index.js";
import { createMarketSection } from "./market/index.js";
import { createChainSection } from "./chain.js";
import { createCointimeSection } from "./cointime.js";
// Re-export types for external consumers
export * from "./types.js";
/**
* Create partial options tree
* @param {Object} args
* @param {Colors} args.colors
* @param {BrkClient} args.brk
* @returns {PartialOptionsTree}
*/
export function createPartialOptions({ colors, brk }) {
// Create context with all helpers
const ctx = createContext({ colors, brk });
// Build cohort data
const {
cohortAll,
termShort,
termLong,
upToDate,
fromDate,
dateRange,
epoch,
utxosAboveAmount,
addressesAboveAmount,
utxosUnderAmount,
addressesUnderAmount,
utxosAmountRanges,
addressesAmountRanges,
type,
} = buildCohortData(colors, brk);
// Helpers to map cohorts by capability type
/** @param {CohortWithAdjusted} cohort */
const mapWithAdjusted = (cohort) => createCohortFolderWithAdjusted(ctx, cohort);
/** @param {CohortWithPercentiles} cohort */
const mapWithPercentiles = (cohort) => createCohortFolderWithPercentiles(ctx, cohort);
/** @param {CohortBasic} cohort */
const mapBasic = (cohort) => createCohortFolderBasic(ctx, cohort);
/** @param {AddressCohortObject} cohort */
const mapAddressCohorts = (cohort) => createAddressCohortFolder(ctx, cohort);
return [
// Debug explorer (localhost only)
...(localhost
? [
{
kind: /** @type {const} */ ("explorer"),
name: "Explorer",
title: "Debug explorer",
},
]
: []),
// Charts section
{
name: "Charts",
tree: [
// Market section
createMarketSection(ctx),
// Chain section
createChainSection(ctx),
// Cohorts section
{
name: "Cohorts",
tree: [
// All UTXOs - CohortAll (adjustedSopr + percentiles but no RelToMarketCap)
createCohortFolderAll(ctx, cohortAll),
// Terms (STH/LTH) - Short is Full, Long is WithPercentiles
{
name: "terms",
tree: [
// Individual cohorts with their specific capabilities
createCohortFolderFull(ctx, termShort),
createCohortFolderWithPercentiles(ctx, termLong),
],
},
// Epochs - CohortBasic (neither adjustedSopr nor percentiles)
{
name: "Epochs",
tree: [
createCohortFolderBasic(ctx, {
name: "Compare",
title: "Epoch",
list: epoch,
}),
...epoch.map(mapBasic),
],
},
// Types - CohortBasic
{
name: "types",
tree: [
createCohortFolderBasic(ctx, {
name: "Compare",
title: "Type",
list: type,
}),
...type.map(mapBasic),
],
},
// UTXOs Up to age - CohortWithAdjusted (adjustedSopr only)
{
name: "UTXOs Up to age",
tree: [
createCohortFolderWithAdjusted(ctx, {
name: "Compare",
title: "UTXOs Up To Age",
list: upToDate,
}),
...upToDate.map(mapWithAdjusted),
],
},
// UTXOs from age - CohortBasic
{
name: "UTXOs from age",
tree: [
createCohortFolderBasic(ctx, {
name: "Compare",
title: "UTXOs from age",
list: fromDate,
}),
...fromDate.map(mapBasic),
],
},
// UTXOs age ranges - CohortWithPercentiles (percentiles only)
{
name: "UTXOs age Ranges",
tree: [
createCohortFolderWithPercentiles(ctx, {
name: "Compare",
title: "UTXOs Age Range",
list: dateRange,
}),
...dateRange.map(mapWithPercentiles),
],
},
// UTXOs under amounts - CohortBasic
{
name: "UTXOs under amounts",
tree: [
createCohortFolderBasic(ctx, {
name: "Compare",
title: "UTXOs under amount",
list: utxosUnderAmount,
}),
...utxosUnderAmount.map(mapBasic),
],
},
// UTXOs above amounts - CohortBasic
{
name: "UTXOs Above Amounts",
tree: [
createCohortFolderBasic(ctx, {
name: "Compare",
title: "UTXOs Above Amount",
list: utxosAboveAmount,
}),
...utxosAboveAmount.map(mapBasic),
],
},
// UTXOs between amounts - CohortBasic
{
name: "UTXOs between amounts",
tree: [
createCohortFolderBasic(ctx, {
name: "Compare",
title: "UTXOs between amounts",
list: utxosAmountRanges,
}),
...utxosAmountRanges.map(mapBasic),
],
},
// Addresses under amount (TYPE SAFE - uses createAddressCohortFolder!)
{
name: "Addresses under amount",
tree: [
createAddressCohortFolder(ctx, {
name: "Compare",
title: "Addresses under Amount",
list: addressesUnderAmount,
}),
...addressesUnderAmount.map(mapAddressCohorts),
],
},
// Addresses above amount (TYPE SAFE - uses createAddressCohortFolder!)
{
name: "Addresses above amount",
tree: [
createAddressCohortFolder(ctx, {
name: "Compare",
title: "Addresses above amount",
list: addressesAboveAmount,
}),
...addressesAboveAmount.map(mapAddressCohorts),
],
},
// Addresses between amounts (TYPE SAFE - uses createAddressCohortFolder!)
{
name: "Addresses between amounts",
tree: [
createAddressCohortFolder(ctx, {
name: "Compare",
title: "Addresses between amounts",
list: addressesAmountRanges,
}),
...addressesAmountRanges.map(mapAddressCohorts),
],
},
],
},
// Cointime section
createCointimeSection(ctx),
],
},
// Table section
{
kind: /** @type {const} */ ("table"),
title: "Table",
name: "Table",
},
// Simulations section
{
name: "Simulations",
tree: [
{
kind: /** @type {const} */ ("simulation"),
name: "Save In Bitcoin",
title: "Save In Bitcoin",
},
],
},
// Tools section
{
name: "Tools",
tree: [
{
name: "Documentation",
tree: [
{
name: "API",
url: () => "/api",
title: "API documentation",
},
{
name: "MCP",
url: () =>
"https://github.com/bitcoinresearchkit/brk/blob/main/crates/brk_mcp/README.md#brk_mcp",
title: "Model Context Protocol documentation",
},
{
name: "Crate",
url: () => "/crate",
title: "View on crates.io",
},
{
name: "Source",
url: () => "/github",
title: "Source code and issues",
},
{
name: "Changelog",
url: () => "/changelog",
title: "Release notes and changelog",
},
],
},
{
name: "Hosting",
tree: [
{
name: "Status",
url: () => "/status",
title: "Service status and uptime",
},
{
name: "Self-host",
url: () => "/install",
title: "Install and run yourself",
},
{
name: "Service",
url: () => "/service",
title: "Hosted service offering",
},
],
},
{
name: "Community",
tree: [
{
name: "Discord",
url: () => "/discord",
title: "Join the Discord server",
},
{
name: "GitHub",
url: () => "/github",
title: "Source code and issues",
},
{
name: "Nostr",
url: () => "/nostr",
title: "Follow on Nostr",
},
],
},
],
},
// Donate
{
name: "Donate",
qrcode: true,
url: () => "bitcoin:bc1q098zsm89m7kgyze338vfejhpdt92ua9p3peuve",
title: "Bitcoin address for donations",
},
// Share
{
name: "Share",
qrcode: true,
url: () => window.location.href,
title: "Share",
},
];
}

736
website/scripts/options/series.js Normal file
View File

@@ -0,0 +1,736 @@
/** Series helpers for creating chart series blueprints */
import { Unit } from "../utils/units.js";
/**
* Create a Line series
* @param {Object} args
* @param {AnyMetricPattern} args.metric
* @param {string} args.name
* @param {Unit} args.unit
* @param {Color} [args.color]
* @param {boolean} [args.defaultActive]
* @param {LineSeriesPartialOptions} [args.options]
* @returns {FetchedLineSeriesBlueprint}
*/
export function line({ metric, name, color, defaultActive, unit, options }) {
return {
metric,
title: name,
color,
unit,
defaultActive,
options,
};
}
/**
* Create a Dots series (line with only point markers visible)
* @param {Object} args
* @param {AnyMetricPattern} args.metric
* @param {string} args.name
* @param {Unit} args.unit
* @param {Color} [args.color]
* @param {boolean} [args.defaultActive]
* @param {LineSeriesPartialOptions} [args.options]
* @returns {FetchedDotsSeriesBlueprint}
*/
export function dots({ metric, name, color, defaultActive, unit, options }) {
return {
type: /** @type {const} */ ("Dots"),
metric,
title: name,
color,
unit,
defaultActive,
options,
};
}
/**
* Create a Candlestick series
* @param {Object} args
* @param {AnyMetricPattern} args.metric
* @param {string} args.name
* @param {Unit} args.unit
* @param {[Color, Color]} [args.colors] - [upColor, downColor] for legend
* @param {boolean} [args.defaultActive]
* @param {CandlestickSeriesPartialOptions} [args.options]
* @returns {FetchedCandlestickSeriesBlueprint}
*/
export function candlestick({
metric,
name,
colors,
defaultActive,
unit,
options,
}) {
return {
type: /** @type {const} */ ("Candlestick"),
metric,
title: name,
colors,
unit,
defaultActive,
options,
};
}
/**
* Create a Baseline series
* @param {Object} args
* @param {AnyMetricPattern} args.metric
* @param {string} args.name
* @param {Unit} args.unit
* @param {Color | [Color, Color]} [args.color]
* @param {boolean} [args.defaultActive]
* @param {BaselineSeriesPartialOptions} [args.options]
* @returns {FetchedBaselineSeriesBlueprint}
*/
export function baseline({
metric,
name,
color,
defaultActive,
unit,
options,
}) {
const isTuple = Array.isArray(color);
return {
type: /** @type {const} */ ("Baseline"),
metric,
title: name,
color: isTuple ? undefined : color,
colors: isTuple ? color : undefined,
unit,
defaultActive,
options,
};
}
/**
* Create a Histogram series
* @param {Object} args
* @param {AnyMetricPattern} args.metric
* @param {string} args.name
* @param {Unit} args.unit
* @param {Color | [Color, Color]} [args.color]
* @param {boolean} [args.defaultActive]
* @param {HistogramSeriesPartialOptions} [args.options]
* @returns {FetchedHistogramSeriesBlueprint}
*/
export function histogram({
metric,
name,
color,
defaultActive,
unit,
options,
}) {
return {
type: /** @type {const} */ ("Histogram"),
metric,
title: name,
color,
unit,
defaultActive,
options,
};
}
/**
* Create series from a BlockCountPattern ({ base, sum, cumulative })
* @param {Colors} colors
* @param {BlockCountPattern<any>} pattern
* @param {string} title
* @param {Color} [color]
* @returns {AnyFetchedSeriesBlueprint[]}
*/
export function fromBlockCount(colors, pattern, title, color) {
return [
{ metric: pattern.sum, title, color: color ?? colors.default },
{
metric: pattern.cumulative,
title: `${title} (cum.)`,
color: colors.cyan,
defaultActive: false,
},
];
}
/**
* Create series from a FullnessPattern ({ base, sum, cumulative, average, min, max, percentiles })
* @param {Colors} colors
* @param {FullnessPattern<any>} pattern
* @param {string} title
* @param {Color} [color]
* @returns {AnyFetchedSeriesBlueprint[]}
*/
export function fromBitcoin(colors, pattern, title, color) {
return [
{ metric: pattern.base, title, color: color ?? colors.default },
{ metric: pattern.average, title: "Average", defaultActive: false },
{
metric: pattern.max,
title: "Max",
color: colors.pink,
defaultActive: false,
},
{
metric: pattern.min,
title: "Min",
color: colors.green,
defaultActive: false,
},
{
metric: pattern.median,
title: "Median",
color: colors.amber,
defaultActive: false,
},
{
metric: pattern.pct75,
title: "pct75",
color: colors.red,
defaultActive: false,
},
{
metric: pattern.pct25,
title: "pct25",
color: colors.yellow,
defaultActive: false,
},
{
metric: pattern.pct90,
title: "pct90",
color: colors.rose,
defaultActive: false,
},
{
metric: pattern.pct10,
title: "pct10",
color: colors.lime,
defaultActive: false,
},
];
}
/**
* Create series from a SizePattern ({ sum, cumulative, average, min, max, percentiles })
* @param {Colors} colors
* @param {AnyStatsPattern} pattern
* @param {string} title
* @param {Color} [color]
* @returns {AnyFetchedSeriesBlueprint[]}
*/
export function fromBlockSize(colors, pattern, title, color) {
return [
{ metric: pattern.sum, title, color: color ?? colors.default },
{ metric: pattern.average, title: "Average", defaultActive: false },
{
metric: pattern.cumulative,
title: `${title} (cum.)`,
color: colors.cyan,
defaultActive: false,
},
{
metric: pattern.max,
title: "Max",
color: colors.pink,
defaultActive: false,
},
{
metric: pattern.min,
title: "Min",
color: colors.green,
defaultActive: false,
},
{
metric: pattern.median,
title: "Median",
color: colors.amber,
defaultActive: false,
},
{
metric: pattern.pct75,
title: "pct75",
color: colors.red,
defaultActive: false,
},
{
metric: pattern.pct25,
title: "pct25",
color: colors.yellow,
defaultActive: false,
},
{
metric: pattern.pct90,
title: "pct90",
color: colors.rose,
defaultActive: false,
},
{
metric: pattern.pct10,
title: "pct10",
color: colors.lime,
defaultActive: false,
},
];
}
/**
* Create series from a SizePattern ({ average, sum, cumulative, min, max, percentiles })
* @param {Colors} colors
* @param {AnyStatsPattern} pattern
* @param {string} title
* @param {Unit} unit
* @returns {AnyFetchedSeriesBlueprint[]}
*/
export function fromSizePattern(colors, pattern, title, unit) {
return [
{ metric: pattern.average, title: `${title} avg`, unit },
{
metric: pattern.sum,
title: `${title} sum`,
color: colors.blue,
unit,
defaultActive: false,
},
{
metric: pattern.cumulative,
title: `${title} cumulative`,
color: colors.indigo,
unit,
defaultActive: false,
},
{
metric: pattern.min,
title: `${title} min`,
color: colors.red,
unit,
defaultActive: false,
},
{
metric: pattern.max,
title: `${title} max`,
color: colors.green,
unit,
defaultActive: false,
},
{
metric: pattern.pct10,
title: `${title} pct10`,
color: colors.rose,
unit,
defaultActive: false,
},
{
metric: pattern.pct25,
title: `${title} pct25`,
color: colors.pink,
unit,
defaultActive: false,
},
{
metric: pattern.median,
title: `${title} median`,
color: colors.purple,
unit,
defaultActive: false,
},
{
metric: pattern.pct75,
title: `${title} pct75`,
color: colors.violet,
unit,
defaultActive: false,
},
{
metric: pattern.pct90,
title: `${title} pct90`,
color: colors.fuchsia,
unit,
defaultActive: false,
},
];
}
/**
* Create series from a FullnessPattern ({ base, average, sum, cumulative, min, max, percentiles })
* @param {Colors} colors
* @param {FullnessPattern<any>} pattern
* @param {string} title
* @param {Unit} unit
* @returns {AnyFetchedSeriesBlueprint[]}
*/
export function fromFullnessPattern(colors, pattern, title, unit) {
return [
{ metric: pattern.base, title, unit },
{
metric: pattern.average,
title: `${title} avg`,
color: colors.purple,
unit,
defaultActive: false,
},
{
metric: pattern.min,
title: `${title} min`,
color: colors.red,
unit,
defaultActive: false,
},
{
metric: pattern.max,
title: `${title} max`,
color: colors.green,
unit,
defaultActive: false,
},
{
metric: pattern.pct10,
title: `${title} pct10`,
color: colors.rose,
unit,
defaultActive: false,
},
{
metric: pattern.pct25,
title: `${title} pct25`,
color: colors.pink,
unit,
defaultActive: false,
},
{
metric: pattern.median,
title: `${title} median`,
color: colors.violet,
unit,
defaultActive: false,
},
{
metric: pattern.pct75,
title: `${title} pct75`,
color: colors.fuchsia,
unit,
defaultActive: false,
},
{
metric: pattern.pct90,
title: `${title} pct90`,
color: colors.amber,
unit,
defaultActive: false,
},
];
}
/**
* Create series from a FeeRatePattern ({ average, min, max, percentiles })
* @param {Colors} colors
* @param {FeeRatePattern<any>} pattern
* @param {string} title
* @param {Unit} unit
* @returns {AnyFetchedSeriesBlueprint[]}
*/
export function fromFeeRatePattern(colors, pattern, title, unit) {
return [
{ metric: pattern.average, title: `${title} avg`, unit },
{
metric: pattern.min,
title: `${title} min`,
color: colors.red,
unit,
defaultActive: false,
},
{
metric: pattern.max,
title: `${title} max`,
color: colors.green,
unit,
defaultActive: false,
},
{
metric: pattern.pct10,
title: `${title} pct10`,
color: colors.rose,
unit,
defaultActive: false,
},
{
metric: pattern.pct25,
title: `${title} pct25`,
color: colors.pink,
unit,
defaultActive: false,
},
{
metric: pattern.median,
title: `${title} median`,
color: colors.purple,
unit,
defaultActive: false,
},
{
metric: pattern.pct75,
title: `${title} pct75`,
color: colors.violet,
unit,
defaultActive: false,
},
{
metric: pattern.pct90,
title: `${title} pct90`,
color: colors.fuchsia,
unit,
defaultActive: false,
},
];
}
/**
* Create series from a CoinbasePattern ({ sats, bitcoin, dollars } each as FullnessPattern)
* @param {Colors} colors
* @param {CoinbasePattern} pattern
* @param {string} title
* @returns {AnyFetchedSeriesBlueprint[]}
*/
export function fromCoinbasePattern(colors, pattern, title) {
return [
...fromFullnessPattern(colors, pattern.sats, title, Unit.sats),
...fromFullnessPattern(colors, pattern.bitcoin, title, Unit.btc),
...fromFullnessPattern(colors, pattern.dollars, title, Unit.usd),
];
}
/**
* Create series from a ValuePattern ({ sats, bitcoin, dollars } each as BlockCountPattern with sum + cumulative)
* @param {Colors} colors
* @param {ValuePattern} pattern
* @param {string} title
* @param {Color} [sumColor]
* @param {Color} [cumulativeColor]
* @returns {AnyFetchedSeriesBlueprint[]}
*/
export function fromValuePattern(
colors,
pattern,
title,
sumColor,
cumulativeColor,
) {
return [
{
metric: pattern.sats.sum,
title,
color: sumColor,
unit: Unit.sats,
},
{
metric: pattern.sats.cumulative,
title: `${title} cumulative`,
color: cumulativeColor ?? colors.blue,
unit: Unit.sats,
defaultActive: false,
},
{
metric: pattern.bitcoin.sum,
title,
color: sumColor,
unit: Unit.btc,
},
{
metric: pattern.bitcoin.cumulative,
title: `${title} cumulative`,
color: cumulativeColor ?? colors.blue,
unit: Unit.btc,
defaultActive: false,
},
{
metric: pattern.dollars.sum,
title,
color: sumColor,
unit: Unit.usd,
},
{
metric: pattern.dollars.cumulative,
title: `${title} cumulative`,
color: cumulativeColor ?? colors.blue,
unit: Unit.usd,
defaultActive: false,
},
];
}
/**
* Create sum/cumulative series from a BitcoinPattern ({ sum, cumulative }) with explicit unit and colors
* @param {Colors} colors
* @param {{ sum: AnyMetricPattern, cumulative: AnyMetricPattern }} pattern
* @param {string} title
* @param {Unit} unit
* @param {Color} [sumColor]
* @param {Color} [cumulativeColor]
* @returns {AnyFetchedSeriesBlueprint[]}
*/
export function fromBitcoinPatternWithUnit(
colors,
pattern,
title,
unit,
sumColor,
cumulativeColor,
) {
return [
{
metric: pattern.sum,
title: `${title} sum`,
color: sumColor,
unit,
},
{
metric: pattern.cumulative,
title: `${title} cumulative`,
color: cumulativeColor ?? colors.blue,
unit,
defaultActive: false,
},
];
}
/**
* Create sum/cumulative series from a BlockCountPattern with explicit unit and colors
* @param {Colors} colors
* @param {BlockCountPattern<any>} pattern
* @param {string} title
* @param {Unit} unit
* @param {Color} [sumColor]
* @param {Color} [cumulativeColor]
* @returns {AnyFetchedSeriesBlueprint[]}
*/
export function fromBlockCountWithUnit(
colors,
pattern,
title,
unit,
sumColor,
cumulativeColor,
) {
return [
{
metric: pattern.sum,
title: `${title} sum`,
color: sumColor,
unit,
},
{
metric: pattern.cumulative,
title: `${title} cumulative`,
color: cumulativeColor ?? colors.blue,
unit,
defaultActive: false,
},
];
}
/**
* Create series from an IntervalPattern (base + average/min/max/median/percentiles, no sum/cumulative)
* @param {Colors} colors
* @param {IntervalPattern} pattern
* @param {string} title
* @param {Unit} unit
* @param {Color} [color]
* @returns {AnyFetchedSeriesBlueprint[]}
*/
export function fromIntervalPattern(colors, pattern, title, unit, color) {
return [
{ metric: pattern.base, title, color, unit },
{
metric: pattern.average,
title: `${title} avg`,
color: colors.purple,
unit,
defaultActive: false,
},
{
metric: pattern.min,
title: `${title} min`,
color: colors.red,
unit,
defaultActive: false,
},
{
metric: pattern.max,
title: `${title} max`,
color: colors.green,
unit,
defaultActive: false,
},
{
metric: pattern.median,
title: `${title} median`,
color: colors.violet,
unit,
defaultActive: false,
},
{
metric: pattern.pct10,
title: `${title} pct10`,
color: colors.rose,
unit,
defaultActive: false,
},
{
metric: pattern.pct25,
title: `${title} pct25`,
color: colors.pink,
unit,
defaultActive: false,
},
{
metric: pattern.pct75,
title: `${title} pct75`,
color: colors.fuchsia,
unit,
defaultActive: false,
},
{
metric: pattern.pct90,
title: `${title} pct90`,
color: colors.amber,
unit,
defaultActive: false,
},
];
}
/**
* Create series from a SupplyPattern (sats/bitcoin/dollars, no sum/cumulative)
* @param {Colors} colors
* @param {SupplyPattern} pattern
* @param {string} title
* @param {Color} [color]
* @returns {AnyFetchedSeriesBlueprint[]}
*/
export function fromSupplyPattern(colors, pattern, title, color) {
return [
{
metric: pattern.sats,
title,
color: color ?? colors.default,
unit: Unit.sats,
},
{
metric: pattern.bitcoin,
title,
color: color ?? colors.default,
unit: Unit.btc,
},
{
metric: pattern.dollars,
title,
color: color ?? colors.default,
unit: Unit.usd,
},
];
}

267
website/scripts/options/types.js Normal file
View File

@@ -0,0 +1,267 @@
/**
* @typedef {Object} BaseSeriesBlueprint
* @property {string} title
* @property {boolean} [defaultActive]
*
* @typedef {Object} BaselineSeriesBlueprintSpecific
* @property {"Baseline"} type
* @property {Color} [color]
* @property {[Color, Color]} [colors]
* @property {BaselineSeriesPartialOptions} [options]
* @property {Accessor<BaselineData[]>} [data]
* @typedef {BaseSeriesBlueprint & BaselineSeriesBlueprintSpecific} BaselineSeriesBlueprint
*
* @typedef {Object} CandlestickSeriesBlueprintSpecific
* @property {"Candlestick"} type
* @property {[Color, Color]} [colors]
* @property {CandlestickSeriesPartialOptions} [options]
* @property {Accessor<CandlestickData[]>} [data]
* @typedef {BaseSeriesBlueprint & CandlestickSeriesBlueprintSpecific} CandlestickSeriesBlueprint
*
* @typedef {Object} LineSeriesBlueprintSpecific
* @property {"Line"} [type]
* @property {Color} [color]
* @property {LineSeriesPartialOptions} [options]
* @property {Accessor<LineData[]>} [data]
* @typedef {BaseSeriesBlueprint & LineSeriesBlueprintSpecific} LineSeriesBlueprint
*
* @typedef {Object} HistogramSeriesBlueprintSpecific
* @property {"Histogram"} type
* @property {Color | [Color, Color]} [color] - Single color or [positive, negative] colors (defaults to green/red)
* @property {HistogramSeriesPartialOptions} [options]
* @property {Accessor<HistogramData[]>} [data]
* @typedef {BaseSeriesBlueprint & HistogramSeriesBlueprintSpecific} HistogramSeriesBlueprint
*
* @typedef {Object} DotsSeriesBlueprintSpecific
* @property {"Dots"} type
* @property {Color} [color]
* @property {LineSeriesPartialOptions} [options]
* @property {Accessor<LineData[]>} [data]
* @typedef {BaseSeriesBlueprint & DotsSeriesBlueprintSpecific} DotsSeriesBlueprint
*
* @typedef {BaselineSeriesBlueprint | CandlestickSeriesBlueprint | LineSeriesBlueprint | HistogramSeriesBlueprint | DotsSeriesBlueprint} AnySeriesBlueprint
*
* @typedef {AnySeriesBlueprint["type"]} SeriesType
*
* @typedef {{ metric: AnyMetricPattern, unit?: Unit }} FetchedAnySeriesOptions
*
* @typedef {BaselineSeriesBlueprint & FetchedAnySeriesOptions} FetchedBaselineSeriesBlueprint
* @typedef {CandlestickSeriesBlueprint & FetchedAnySeriesOptions} FetchedCandlestickSeriesBlueprint
* @typedef {LineSeriesBlueprint & FetchedAnySeriesOptions} FetchedLineSeriesBlueprint
* @typedef {HistogramSeriesBlueprint & FetchedAnySeriesOptions} FetchedHistogramSeriesBlueprint
* @typedef {DotsSeriesBlueprint & FetchedAnySeriesOptions} FetchedDotsSeriesBlueprint
* @typedef {AnySeriesBlueprint & FetchedAnySeriesOptions} AnyFetchedSeriesBlueprint
*
* @typedef {Object} PartialOption
* @property {string} name
*
* @typedef {Object} ProcessedOptionAddons
* @property {string} title
* @property {string[]} path
*
* @typedef {Object} PartialExplorerOptionSpecific
* @property {"explorer"} kind
* @property {string} title
*
* @typedef {PartialOption & PartialExplorerOptionSpecific} PartialExplorerOption
*
* @typedef {Required<PartialExplorerOption> & ProcessedOptionAddons} ExplorerOption
*
* @typedef {Object} PartialChartOptionSpecific
* @property {"chart"} [kind]
* @property {string} title
* @property {AnyFetchedSeriesBlueprint[]} [top]
* @property {AnyFetchedSeriesBlueprint[]} [bottom]
*
* @typedef {PartialOption & PartialChartOptionSpecific} PartialChartOption
*
* @typedef {Object} ProcessedChartOptionAddons
* @property {Map<Unit, AnyFetchedSeriesBlueprint[]>} top
* @property {Map<Unit, AnyFetchedSeriesBlueprint[]>} bottom
*
* @typedef {Required<Omit<PartialChartOption, "top" | "bottom">> & ProcessedChartOptionAddons & ProcessedOptionAddons} ChartOption
*
* @typedef {Object} PartialTableOptionSpecific
* @property {"table"} kind
* @property {string} title
*
* @typedef {PartialOption & PartialTableOptionSpecific} PartialTableOption
*
* @typedef {Required<PartialTableOption> & ProcessedOptionAddons} TableOption
*
* @typedef {Object} PartialSimulationOptionSpecific
* @property {"simulation"} kind
* @property {string} title
*
* @typedef {PartialOption & PartialSimulationOptionSpecific} PartialSimulationOption
*
* @typedef {Required<PartialSimulationOption> & ProcessedOptionAddons} SimulationOption
*
* @typedef {Object} PartialUrlOptionSpecific
* @property {"url"} [kind]
* @property {() => string} url
* @property {string} title
* @property {boolean} [qrcode]
*
* @typedef {PartialOption & PartialUrlOptionSpecific} PartialUrlOption
*
* @typedef {Required<PartialUrlOption> & ProcessedOptionAddons} UrlOption
*
* @typedef {PartialExplorerOption | PartialChartOption | PartialTableOption | PartialSimulationOption | PartialUrlOption} AnyPartialOption
*
* @typedef {ExplorerOption | ChartOption | TableOption | SimulationOption | UrlOption} Option
*
* @typedef {(AnyPartialOption | PartialOptionsGroup)[]} PartialOptionsTree
*
* @typedef {Object} PartialOptionsGroup
* @property {string} name
* @property {PartialOptionsTree} tree
*
* @typedef {Object} OptionsGroup
* @property {string} name
* @property {OptionsTree} tree
*
* @typedef {(Option | OptionsGroup)[]} OptionsTree
*
* @typedef {Object} UtxoCohortObject
* @property {string} name
* @property {string} title
* @property {Color} color
* @property {UtxoCohortPattern} tree
*
* ============================================================================
* UTXO Cohort Pattern Types (based on brk client patterns)
* ============================================================================
*
* Patterns with adjustedSopr + percentiles + RelToMarketCap:
* - ShortTermPattern (term.short)
* @typedef {ShortTermPattern} PatternFull
*
* The "All" pattern is special - has adjustedSopr + percentiles but NO RelToMarketCap
* @typedef {AllUtxoPattern} PatternAll
*
* Patterns with adjustedSopr only (RealizedPattern4, CostBasisPattern):
* - MaxAgePattern (maxAge.*)
* @typedef {MaxAgePattern} PatternWithAdjusted
*
* Patterns with percentiles only (RealizedPattern2, CostBasisPattern2):
* - LongTermPattern (term.long)
* - AgeRangePattern (ageRange.*)
* @typedef {LongTermPattern | AgeRangePattern} PatternWithPercentiles
*
* Patterns with neither (RealizedPattern/2, CostBasisPattern):
* - BasicUtxoPattern (minAge.*, geAmount.*, ltAmount.*)
* - EpochPattern (epoch.*)
* @typedef {BasicUtxoPattern | EpochPattern} PatternBasic
*
* ============================================================================
* Cohort Object Types (by capability)
* ============================================================================
*
* All cohort: adjustedSopr + percentiles but NO RelToMarketCap (special)
* @typedef {Object} CohortAll
* @property {string} name
* @property {string} title
* @property {Color} color
* @property {PatternAll} tree
*
* Full cohort: adjustedSopr + percentiles + RelToMarketCap (term.short)
* @typedef {Object} CohortFull
* @property {string} name
* @property {string} title
* @property {Color} color
* @property {PatternFull} tree
*
* Cohort with adjustedSopr only (maxAge.*)
* @typedef {Object} CohortWithAdjusted
* @property {string} name
* @property {string} title
* @property {Color} color
* @property {PatternWithAdjusted} tree
*
* Cohort with percentiles only (term.long, ageRange.*)
* @typedef {Object} CohortWithPercentiles
* @property {string} name
* @property {string} title
* @property {Color} color
* @property {PatternWithPercentiles} tree
*
* Basic cohort: neither (minAge.*, epoch.*, amount cohorts)
* @typedef {Object} CohortBasic
* @property {string} name
* @property {string} title
* @property {Color} color
* @property {PatternBasic} tree
*
* ============================================================================
* Cohort Group Types (by capability)
* ============================================================================
*
* @typedef {Object} CohortGroupFull
* @property {string} name
* @property {string} title
* @property {readonly CohortFull[]} list
*
* @typedef {Object} CohortGroupWithAdjusted
* @property {string} name
* @property {string} title
* @property {readonly CohortWithAdjusted[]} list
*
* @typedef {Object} CohortGroupWithPercentiles
* @property {string} name
* @property {string} title
* @property {readonly CohortWithPercentiles[]} list
*
* @typedef {Object} CohortGroupBasic
* @property {string} name
* @property {string} title
* @property {readonly CohortBasic[]} list
*
* @typedef {Object} UtxoCohortGroupObject
* @property {string} name
* @property {string} title
* @property {readonly UtxoCohortObject[]} list
*
* @typedef {Object} AddressCohortObject
* @property {string} name
* @property {string} title
* @property {Color} color
* @property {AddressCohortPattern} tree
*
* @typedef {UtxoCohortObject | AddressCohortObject} CohortObject
*
*
* @typedef {Object} AddressCohortGroupObject
* @property {string} name
* @property {string} title
* @property {readonly AddressCohortObject[]} list
*
* @typedef {UtxoCohortGroupObject | AddressCohortGroupObject} CohortGroupObject
*
* @typedef {Object} PartialContext
* @property {Colors} colors
* @property {BrkClient} brk
* @property {LineSeriesFn} line
* @property {DotsSeriesFn} dots
* @property {CandlestickSeriesFn} candlestick
* @property {BaselineSeriesFn} baseline
* @property {HistogramSeriesFn} histogram
* @property {(pattern: BlockCountPattern<any>, title: string, color?: Color) => AnyFetchedSeriesBlueprint[]} fromBlockCount
* @property {(pattern: FullnessPattern<any>, title: string, color?: Color) => AnyFetchedSeriesBlueprint[]} fromBitcoin
* @property {(pattern: AnyStatsPattern, title: string, color?: Color) => AnyFetchedSeriesBlueprint[]} fromBlockSize
* @property {(pattern: AnyStatsPattern, title: string, unit: Unit) => AnyFetchedSeriesBlueprint[]} fromSizePattern
* @property {(pattern: FullnessPattern<any>, title: string, unit: Unit) => AnyFetchedSeriesBlueprint[]} fromFullnessPattern
* @property {(pattern: FeeRatePattern<any>, title: string, unit: Unit) => AnyFetchedSeriesBlueprint[]} fromFeeRatePattern
* @property {(pattern: CoinbasePattern, title: string) => AnyFetchedSeriesBlueprint[]} fromCoinbasePattern
* @property {(pattern: ValuePattern, title: string, sumColor?: Color, cumulativeColor?: Color) => AnyFetchedSeriesBlueprint[]} fromValuePattern
* @property {(pattern: { sum: AnyMetricPattern, cumulative: AnyMetricPattern }, title: string, unit: Unit, sumColor?: Color, cumulativeColor?: Color) => AnyFetchedSeriesBlueprint[]} fromBitcoinPatternWithUnit
* @property {(pattern: BlockCountPattern<any>, title: string, unit: Unit, sumColor?: Color, cumulativeColor?: Color) => AnyFetchedSeriesBlueprint[]} fromBlockCountWithUnit
* @property {(pattern: IntervalPattern, title: string, unit: Unit, color?: Color) => AnyFetchedSeriesBlueprint[]} fromIntervalPattern
* @property {(pattern: SupplyPattern, title: string, color?: Color) => AnyFetchedSeriesBlueprint[]} fromSupplyPattern
* @property {(args: { number?: number, name?: string, defaultActive?: boolean, lineStyle?: LineStyle, color?: Color, unit: Unit }) => FetchedLineSeriesBlueprint} createPriceLine
* @property {(args: { numbers: number[], unit: Unit }) => FetchedLineSeriesBlueprint[]} createPriceLines
* @property {(args: { constant: AnyMetricPattern, name: string, unit: Unit, color?: Color, lineStyle?: number, defaultActive?: boolean }) => FetchedLineSeriesBlueprint} constantLine
*/
// Re-export for type consumers
export {};

44
website/scripts/options/unused.js Normal file
View File

@@ -0,0 +1,44 @@
/** Track unused metrics (dev only) */
import { localhost } from "../utils/env.js";
/** @type {Set<AnyMetricPattern> | null} */
export const unused = localhost ? new Set() : null;
/**
* Walk and collect AnyMetricPatterns
* @param {TreeNode | null | undefined} node
* @param {Set<AnyMetricPattern>} set
*/
function walk(node, set) {
if (node && "by" in node) {
set.add(/** @type {AnyMetricPattern} */ (node));
} else if (node && typeof node === "object") {
for (const value of Object.values(node)) {
walk(/** @type {TreeNode | null | undefined} */ (value), set);
}
}
}
/**
* Collect all AnyMetricPatterns from tree
* @param {TreeNode} tree
*/
export function collect(tree) {
if (unused) walk(tree, unused);
}
/**
* Mark a metric as used
* @param {AnyMetricPattern} metric
*/
export function markUsed(metric) {
unused?.delete(metric);
}
/** Log unused metrics to console */
export function logUnused() {
if (!unused?.size) return;
const paths = [...unused].map((m) => Object.values(m.by)[0].path);
console.warn("Unused metrics:", paths);
}