Function paint

app/rcc/scripts/painter/strip_chart.js:24–153

(ctx, w, h)

}

function paint(ctx, w, h) {
  // Cream paper background + vignette.
  ctx.fillStyle = theme.widget_base;
  ctx.fillRect(0, 0, w, h);

  // Header strip.
  ctx.fillStyle = theme.widget_text;
  ctx.font = "bold 11px sans-serif";
  ctx.textAlign = "start";
  ctx.fillText("STRIP  CHART", 14, 18);
  ctx.fillStyle = theme.placeholder_text;
  ctx.font = "10px sans-serif";
  ctx.textAlign = "end";
  ctx.fillText(datasets.length + " channels", w - 14, 18);
  ctx.fillStyle = theme.widget_border;
  ctx.fillRect(14, 22, w - 28, 1);

  // Plot card.
  const padL = 50;
  const padR = 14;
  const padT = 32;
  const padB = 38;
  const plotX = padL;
  const plotY = padT;
  const plotW = w - padL - padR;
  const plotH = h - padT - padB;

  ctx.fillStyle = theme.widget_border;
  ctx.fillRect(plotX + 1, plotY + 2, plotW, plotH);
  ctx.fillStyle = theme.alternate_base;
  ctx.fillRect(plotX, plotY, plotW, plotH);
  ctx.strokeStyle = theme.widget_border;
  ctx.lineWidth = 1;
  ctx.strokeRect(plotX + 0.5, plotY + 0.5, plotW - 1, plotH - 1);

  if (datasets.length === 0) return;

  // Unified Y range across every dataset.
  let lo = Number.POSITIVE_INFINITY;
  let hi = Number.NEGATIVE_INFINITY;
  for (let i = 0; i < datasets.length; ++i) {
    lo = Math.min(lo, datasets[i].min);
    hi = Math.max(hi, datasets[i].max);
  }
  if (!Number.isFinite(lo) || !Number.isFinite(hi) || hi <= lo) {
    lo = 0;
    hi = 100;
  }
  const span = hi - lo;

  // Horizontal grid lines + Y labels.
  ctx.strokeStyle = theme.widget_border;
  ctx.fillStyle    = theme.placeholder_text;
  ctx.font         = "9px sans-serif";
  ctx.textBaseline = "middle";
  ctx.textAlign    = "right";
  for (let i = 0; i <= 4; ++i) {
    const y = plotY + (plotH / 4) * i;