add: show next block based on stratum jobs

This subscribes to a stratum jobs feed (currently from stream.stratum.work)
and renders to-be-mined blocks. This allows us to see which pool is mining on which
block.

The feed is keyed by pool, not by the block being mined on: a pool mines
on exactly one block at a time, so a new job replaces whatever we knew
about that pool. Otherwise a pool that switched to a new block would keep
haunting the one it had already left until its TTL ran out — right after
a new block is found, that would show most pools mining on two blocks at
once.

This is experimental and needs `?mining` as an argument to the URL to be enabled.

Author: 0xB10C

www/js/blocktree.js

@@ -142,6 +142,93 @@ let countdownLayer = g
     .append("g")
     .attr("id", "countdown")
 
+// context from the last draw, so job updates can refresh just the pool cloud (and
+// detect whether a full redraw is actually needed) without re-rendering the blocks.
+let miningDrawCtx = null
+
+// invert the current stratum jobs (state_stratum_jobs, one entry per pool, kept up to
+// date in main.js) into a map of prev_hash -> { parent, pool_names }: the pools mining
+// on each block we recognise. Expired pools are pruned here so the set stays current
+// without a separate timer.
+function current_mining_by_prev(header_infos) {
+  let result = new Map()
+  if (typeof state_stratum_jobs === "undefined" || state_stratum_jobs.size === 0) {
+    return result
+  }
+  const now = Date.now()
+  // index the real headers by hash so we can resolve a job's parent block
+  let by_hash = new Map()
+  header_infos.forEach(h => by_hash.set(h.hash, h))
+
+  state_stratum_jobs.forEach((job, pool_name) => {
+    // drop pools we haven't heard from in a while
+    if (now - job.last_seen > STRATUM_JOB_TTL_MS) {
+      state_stratum_jobs.delete(pool_name)
+      return
+    }
+    // only show ghosts that build on a block we actually know about
+    let parent = by_hash.get(job.prev_hash)
+    if (parent === undefined) return
+    let entry = result.get(job.prev_hash)
+    if (entry === undefined) {
+      entry = { parent, pool_names: [] }
+      result.set(job.prev_hash, entry)
+    }
+    entry.pool_names.push(pool_name)
+  })
+  // stable order, so the labels don't get reshuffled between refreshes
+  result.forEach(entry => entry.pool_names.sort())
+  return result
+}
+
+// build synthetic "being mined" header objects to inject into the tree. One ghost
+// block per prev_hash we recognise, aggregating all pools mining on top of it.
+function build_mining_headers(header_infos) {
+  let mining_headers = []
+  current_mining_by_prev(header_infos).forEach(({ parent, pool_names }, prev_hash) => {
+    mining_headers.push({
+      id: "mining-" + prev_hash,
+      prev_id: parent.id,
+      height: parent.height + 1,
+      hash: "mining-" + prev_hash,
+      prev_blockhash: prev_hash,
+      // pool names are shown in a force-positioned cloud around the block, so the
+      // block itself carries no miner label
+      miner: "",
+      // not MIN_DIFFICULTY, so it doesn't get the accent-colored stroke
+      difficulty_int: 0,
+      status: "mining",
+      mining_pools: pool_names,
+    })
+  })
+  return mining_headers
+}
+
+// called when new stratum jobs arrive. If the set of being-mined blocks is unchanged
+// (the common case: same tip, just a shifting pool set) only the pool cloud is
+// refreshed, leaving the block DOM — and its running pulse animation — untouched. A
+// full redraw happens only when a ghost block appears or disappears.
+function refresh_mining() {
+  if (miningDrawCtx === null) {
+    draw({ preserveView: true })
+    return
+  }
+  let desired = current_mining_by_prev(miningDrawCtx.header_infos)
+  let current_keys = miningDrawCtx.ghostByPrev
+  let same = desired.size === current_keys.size &&
+    Array.from(desired.keys()).every(k => current_keys.has(k))
+  if (!same) {
+    draw({ preserveView: true })
+    return
+  }
+  // same set of ghosts: update their pool lists in place and re-lay-out the cloud only
+  desired.forEach(({ pool_names }, prev_hash) => {
+    let node = current_keys.get(prev_hash)
+    if (node) node.data.data.mining_pools = pool_names
+  })
+  draw_mining_pool_clouds(miningDrawCtx.root_node, miningDrawCtx.htoi)
+}
+
 function preprocess_data(data) {
   let header_infos = data.header_infos;
   let node_infos = data.nodes;
@@ -166,13 +253,18 @@ function preprocess_data(data) {
     header_info.is_tip = status != undefined
   })
 
+  // synthetic "being mined" blocks from the stratum jobs feed, injected as children
+  // of the block each pool builds on. max_height (below) stays based on the real
+  // headers only, so these ghosts are not treated as the animated newest block.
+  let mining_headers = build_mining_headers(header_infos)
+
   var treeData = d3
     .stratify()
     .id(d => d.id)
     .parentId(function (d) {
       // d3js requires the first prev block hash to be null
       return (d.prev_id == MAX_USIZE ? null : d.prev_id)
-    })(header_infos);
+    })(header_infos.concat(mining_headers));
 
   stripUninteresting(treeData, 4)
 
@@ -214,7 +306,8 @@ function preprocess_data(data) {
   return [root_node, max_height, htoi]
 }
 
-function draw() {
+function draw(opts) {
+  opts = opts || {}
   let data = state_data
 
   // nothing to draw if there are no headers
@@ -434,6 +527,13 @@ function draw() {
   // pool names orbiting each "being mined" block, laid out with a force simulation
   draw_mining_pool_clouds(root_node, htoi)
 
+  // remember what we drew so incoming jobs can refresh the cloud in place, without a
+  // full redraw that would restart the ghost blocks' pulse animation
+  let ghostByPrev = new Map()
+  root_node.descendants().filter(d => d.data.data.status == "mining")
+    .forEach(d => ghostByPrev.set(d.data.data.prev_blockhash, d))
+  miningDrawCtx = { root_node, htoi, header_infos: data.header_infos, ghostByPrev }
+
   // size the miner background box to fit its (already positioned) text
   recalc_miner_boxes()
 
@@ -519,18 +619,21 @@ function draw() {
   })
   descLayer.raise()
 
-  // most redraws (a node's data changed) re-render the very same layout, so the block
-  // we anchor on hasn't moved. Panning the camera to where it already is still runs a
-  // zoom transition, and that is visible as a jump — so only re-anchor when there is
-  // something to re-anchor to.
+  // most redraws (a node's data changed, a new stratum job) re-render the very same
+  // layout, so the block we anchor on hasn't moved. Panning the camera to where it
+  // already is still runs a zoom transition, and that is visible as a jump — so only
+  // re-anchor when there is something to re-anchor to.
   let anchor_moved = offset_x != lastTipPos.x || offset_y != lastTipPos.y
   lastTipPos = { x: offset_x, y: offset_y }
 
-  if (initialDraw || anchor_moved) {
+  // job-triggered redraws (new stratum jobs arriving) pass preserveView so the
+  // viewport isn't yanked back to the tip while the user is panning around.
+  if (!opts.preserveView && (initialDraw || anchor_moved)) {
     zoom.scaleBy(svg, 1);
     let svgSize = d3.select("#drawing-area").node().getBoundingClientRect();
     zoom.translateTo(svg.transition(d3.transition().duration(initialDraw ? 0 : 750)), offset_x, offset_y, o.tip_anchor(svgSize.width, svgSize.height))
-
+    // only clear this once the view has actually been anchored, so a job-triggered
+    // preserveView redraw can't consume it before the first real draw
     initialDraw = false
   }
 }

www/js/main.js

@@ -308,3 +308,86 @@ changeSSE.addEventListener("cache_changed", (e) => {
 
 
 run()
+
+// ---------------------------------------------------------------------------
+// Stratum jobs feed: show which blocks pools are currently mining on top of.
+// Off by default; enable for testing by adding ?mining to the URL.
+// ---------------------------------------------------------------------------
+
+const MINING_ENABLED = new URLSearchParams(window.location.search).has("mining")
+const STRATUM_SSE_URL = "https://stream.stratum.work/"
+// forget a pool entirely if we haven't heard a job from it within this window, so
+// pools that stop sending (or disappear from the feed) don't linger forever.
+const STRATUM_JOB_TTL_MS = 120000
+// pool_name -> { prev_hash, last_seen }: the one block each pool is currently mining
+// on. Read by build_mining_headers() in blocktree.js on every draw, which groups it
+// the other way round, by the block being mined on.
+var state_stratum_jobs = new Map()
+let stratum_redraw_scheduled = false
+
+// the feed's prev_hash lists the header's 4-byte words in header (little-endian)
+// order; reversing the word order gives the big-endian display hash used
+// everywhere else in the app (header_infos[].hash), so ghost blocks resolve
+// against the real tree.
+function stratum_prevhash_to_display(hex) {
+  let words = []
+  for (let i = 0; i < hex.length; i += 8) words.push(hex.slice(i, i + 8))
+  return words.reverse().join("")
+}
+
+// A pool mines on exactly one block at a time, so a new job replaces whatever we knew
+// about that pool. Keying the state by pool (rather than by the block being mined on)
+// is what makes that replacement automatic: keyed the other way round, a pool that
+// switched to a new block would keep haunting the old one until its TTL ran out, and
+// look like it was mining two blocks at once.
+function record_stratum_job(job) {
+  if (job == null || !job.prev_hash || !job.pool_name) return
+  state_stratum_jobs.set(job.pool_name, {
+    prev_hash: stratum_prevhash_to_display(job.prev_hash),
+    last_seen: Date.now(),
+  })
+}
+
+// jobs arrive several times a second; coalesce them into at most one redraw per
+// window and never recenter the viewport for them.
+function schedule_stratum_redraw() {
+  if (stratum_redraw_scheduled) return
+  stratum_redraw_scheduled = true
+  setTimeout(() => {
+    stratum_redraw_scheduled = false
+    if (state_data.header_infos && state_data.header_infos.length > 0) {
+      // refresh_mining() only does a full redraw when the set of being-mined blocks
+      // changes; otherwise it just re-lays-out the pool cloud, leaving the ghost
+      // blocks (and their pulse animation) untouched.
+      refresh_mining()
+    }
+  }, 1500)
+}
+
+let stratumSource = null
+function connect_stratum() {
+  try {
+    // EventSource reconnects on its own after an error (with the server's
+    // requested retry delay, or a browser default), so no manual backoff here.
+    stratumSource = new EventSource(STRATUM_SSE_URL)
+  } catch (e) {
+    console.error("could not open stratum jobs stream", e)
+    return
+  }
+  stratumSource.addEventListener("message", (e) => {
+    let job
+    try { job = JSON.parse(e.data) } catch (_) { return }
+    record_stratum_job(job)
+    schedule_stratum_redraw()
+  })
+  stratumSource.addEventListener("error", (e) => {
+    console.debug("stratum jobs stream error, browser will retry", e)
+  })
+}
+
+// only connect (and thus show any being-mined blocks) when opted in via ?mining
+if (MINING_ENABLED) {
+  connect_stratum()
+} else {
+  console.debug("mining jobs feed disabled; add ?mining to the URL to enable it")
+}