Maxwell's Demon

// Maxwell's demon — a 2D ideal gas in a box split by a wall with a single gate.
// An auto-demon opens the gate to let fast particles pass left→right and slow
// ones right→left, manufacturing a temperature gradient out of "information".
// Click the gate (the gap in the middle wall) to override its state.

const N = 150;
const GATE_H = 80;        // gate height in canvas px (clamped to fit)
const WALL_W = 4;
const SPEED_MED = 110;    // px/s — separates "slow" from "fast" for coloring & demon
const RADIUS = 4;

let W = 0, H = 0;
let px, py, vx, vy;       // particle state (Float32Array)
let gateOpen = false;
let gateOverride = 0;     // -1 force closed, 0 auto, +1 force open
let overrideExpire = 0;   // seconds remaining for click-override
let entropyHist;
let entIdx = 0;

function init({ width, height }) {
  W = width; H = height;
  px = new Float32Array(N);
  py = new Float32Array(N);
  vx = new Float32Array(N);
  vy = new Float32Array(N);
  const midX = W / 2;
  for (let i = 0; i < N; i++) {
    // start half on left, half on right
    const left = i < N / 2;
    px[i] = left
      ? RADIUS + Math.random() * (midX - WALL_W - 2 * RADIUS)
      : midX + WALL_W + RADIUS + Math.random() * (W - midX - WALL_W - 2 * RADIUS);
    py[i] = RADIUS + Math.random() * (H - 2 * RADIUS);
    // Maxwell-Boltzmann-ish: pick speed from a small range around SPEED_MED
    const sp = 40 + Math.random() * 160;
    const ang = Math.random() * Math.PI * 2;
    vx[i] = Math.cos(ang) * sp;
    vy[i] = Math.sin(ang) * sp;
  }
  entropyHist = new Float32Array(180);
  entIdx = 0;
  gateOpen = false;
  gateOverride = 0;
  overrideExpire = 0;
}

function gateRect() {
  const midX = W / 2;
  const gh = Math.min(GATE_H, H * 0.5);
  const gy = (H - gh) / 2;
  return { x: midX - WALL_W / 2, y: gy, w: WALL_W, h: gh };
}

function pointInRect(x, y, rx, ry, rw, rh) {
  return x >= rx && x <= rx + rw && y >= ry && y <= ry + rh;
}

function step(dt) {
  const midX = W / 2;
  const wallL = midX - WALL_W / 2;
  const wallR = midX + WALL_W / 2;
  const g = gateRect();

  // Decide demon gate state for this frame.
  if (gateOverride !== 0 && overrideExpire > 0) {
    gateOpen = gateOverride > 0;
  } else {
    // Auto demon: open iff some particle within the gate band is about to cross
    // in the "useful" direction (fast L→R or slow R→L).
    gateOpen = false;
    for (let i = 0; i < N; i++) {
      const y = py[i];
      if (y < g.y - RADIUS || y > g.y + g.h + RADIUS) continue;
      const x = px[i];
      const sp2 = vx[i] * vx[i] + vy[i] * vy[i];
      const fast = sp2 > SPEED_MED * SPEED_MED;
      // about to cross left→right
      if (x < wallL && x + vx[i] * dt >= wallL && vx[i] > 0 && fast) { gateOpen = true; break; }
      // about to cross right→left
      if (x > wallR && x + vx[i] * dt <= wallR && vx[i] < 0 && !fast) { gateOpen = true; break; }
    }
  }

  for (let i = 0; i < N; i++) {
    let x = px[i] + vx[i] * dt;
    let y = py[i] + vy[i] * dt;
    // walls (box)
    if (x < RADIUS) { x = RADIUS; vx[i] = -vx[i]; }
    else if (x > W - RADIUS) { x = W - RADIUS; vx[i] = -vx[i]; }
    if (y < RADIUS) { y = RADIUS; vy[i] = -vy[i]; }
    else if (y > H - RADIUS) { y = H - RADIUS; vy[i] = -vy[i]; }

    // central wall (with possible open gate)
    const inGateY = y > g.y && y < g.y + g.h;
    const oldX = px[i];
    if (!(gateOpen && inGateY)) {
      // bounce off the central wall
      if (oldX <= wallL && x > wallL) { x = wallL - (x - wallL); vx[i] = -vx[i]; }
      else if (oldX >= wallR && x < wallR) { x = wallR + (wallR - x); vx[i] = -vx[i]; }
      else if (x > wallL && x < wallR) {
        // resolve any drift into the wall thickness
        x = (oldX < midX) ? wallL - RADIUS * 0.01 : wallR + RADIUS * 0.01;
        vx[i] = -vx[i];
      }
    }
    px[i] = x;
    py[i] = y;
  }
}

function temps() {
  const midX = W / 2;
  let nL = 0, nR = 0, kL = 0, kR = 0;
  for (let i = 0; i < N; i++) {
    const ke = vx[i] * vx[i] + vy[i] * vy[i];
    if (px[i] < midX) { nL++; kL += ke; } else { nR++; kR += ke; }
  }
  // <KE> ~ T in 2D ideal gas (k_B=m=1). Scale into a friendlier range.
  const TL = nL > 0 ? kL / nL / 2 : 0;
  const TR = nR > 0 ? kR / nR / 2 : 0;
  return { nL, nR, TL, TR };
}

function entropyProxy(nL, nR) {
  // Mixing entropy of the N=N particle distribution between two halves.
  // S = -[p log p + q log q] in nats, normalized so max=1.
  if (nL === 0 || nR === 0) return 0;
  const p = nL / N, q = nR / N;
  const S = -(p * Math.log(p) + q * Math.log(q));
  return S / Math.log(2); // normalize so even split = 1
}

function speedToColor(spd) {
  // 0 → blue (220), SPEED_MED*2 → red (0)
  const t = Math.min(1, spd / (SPEED_MED * 2));
  const hue = 220 * (1 - t);
  return `hsl(${hue.toFixed(0)},85%,55%)`;
}

function render(ctx) {
  // fade trail for a sense of motion
  ctx.fillStyle = "rgba(8,10,18,0.35)";
  ctx.fillRect(0, 0, W, H);

  // central wall
  const midX = W / 2;
  const g = gateRect();
  ctx.fillStyle = "rgba(220,220,230,0.85)";
  ctx.fillRect(midX - WALL_W / 2, 0, WALL_W, g.y);
  ctx.fillRect(midX - WALL_W / 2, g.y + g.h, WALL_W, H - (g.y + g.h));

  // gate
  if (gateOpen) {
    ctx.fillStyle = "rgba(120,255,160,0.18)";
    ctx.fillRect(g.x - 6, g.y, g.w + 12, g.h);
    ctx.strokeStyle = "rgba(120,255,160,0.9)";
  } else {
    ctx.fillStyle = "rgba(220,220,230,0.85)";
    ctx.fillRect(g.x, g.y, g.w, g.h);
    ctx.strokeStyle = "rgba(255,200,80,0.85)";
  }
  ctx.lineWidth = 1.5;
  ctx.strokeRect(g.x - 8, g.y - 4, g.w + 16, g.h + 8);

  // particles
  for (let i = 0; i < N; i++) {
    const spd = Math.hypot(vx[i], vy[i]);
    ctx.fillStyle = speedToColor(spd);
    ctx.beginPath();
    ctx.arc(px[i], py[i], RADIUS, 0, Math.PI * 2);
    ctx.fill();
  }
}

function drawHUD(ctx, st, S) {
  const pad = 10;
  // left HUD
  ctx.fillStyle = "rgba(0,0,0,0.55)";
  ctx.fillRect(pad, pad, 150, 64);
  ctx.fillStyle = "#fff";
  ctx.font = "12px monospace";
  ctx.textAlign = "left";
  ctx.textBaseline = "alphabetic";
  ctx.fillText("LEFT", pad + 8, pad + 18);
  ctx.fillText(`N = ${st.nL}`, pad + 8, pad + 34);
  ctx.fillText(`T = ${st.TL.toFixed(0)}`, pad + 8, pad + 50);

  // right HUD
  const rx = W - 150 - pad;
  ctx.fillStyle = "rgba(0,0,0,0.55)";
  ctx.fillRect(rx, pad, 150, 64);
  ctx.fillStyle = "#fff";
  ctx.fillText("RIGHT", rx + 8, pad + 18);
  ctx.fillText(`N = ${st.nR}`, rx + 8, pad + 34);
  ctx.fillText(`T = ${st.TR.toFixed(0)}`, rx + 8, pad + 50);

  // bottom strip: entropy proxy + legend
  const sw = Math.min(360, W - 2 * pad);
  const sh = 46;
  const sx = (W - sw) / 2;
  const sy = H - sh - pad;
  ctx.fillStyle = "rgba(0,0,0,0.55)";
  ctx.fillRect(sx, sy, sw, sh);
  ctx.fillStyle = "#fff";
  ctx.fillText("mixing entropy (1 = mixed, 0 = sorted)", sx + 8, sy + 14);
  // sparkline
  ctx.strokeStyle = "#ffd17a";
  ctx.beginPath();
  for (let i = 0; i < entropyHist.length; i++) {
    const idx = (entIdx + i) % entropyHist.length;
    const v = entropyHist[idx];
    const xx = sx + 8 + (i / (entropyHist.length - 1)) * (sw - 16);
    const yy = sy + sh - 4 - v * (sh - 22);
    if (i === 0) ctx.moveTo(xx, yy); else ctx.lineTo(xx, yy);
  }
  ctx.stroke();
  ctx.fillStyle = "#fff";
  ctx.fillText(`S = ${S.toFixed(3)}`, sx + sw - 70, sy + 14);

  // hint
  ctx.textAlign = "center";
  ctx.fillStyle = "rgba(255,255,255,0.85)";
  ctx.fillText(
    gateOverride !== 0 && overrideExpire > 0
      ? `gate forced ${gateOverride > 0 ? "OPEN" : "CLOSED"}`
      : "click the gate to override",
    W / 2, pad + 18
  );
}

function tick({ ctx, dt, width, height, input }) {
  if (width !== W || height !== H) { W = width; H = height; }
  const cdt = Math.min(dt, 0.033);

  // handle clicks on the gate region
  const g = gateRect();
  const hitX = g.x - 14, hitY = g.y - 8, hitW = g.w + 28, hitH = g.h + 16;
  for (const c of input.consumeClicks()) {
    if (pointInRect(c.x, c.y, hitX, hitY, hitW, hitH)) {
      // toggle override: closed -> open -> auto -> closed ...
      if (gateOverride === 0) gateOverride = 1;
      else if (gateOverride === 1) gateOverride = -1;
      else gateOverride = 0;
      overrideExpire = 2.5;
    }
  }
  if (overrideExpire > 0) overrideExpire -= cdt;

  step(cdt);
  render(ctx);

  const st = temps();
  const S = entropyProxy(st.nL, st.nR);
  entropyHist[entIdx] = S;
  entIdx = (entIdx + 1) % entropyHist.length;

  drawHUD(ctx, st, S);
}