Biliardo più bello (Codex): tavolo in pixel art visto dall'alto con cornice a fasce e diamanti, sala in penombra e luce delle lampade sul panno, segnapunti a cifre rosse, steccata e birilli che cadono animati, biglie in pixel, l'Ing. Tozzi a bordo tavolo che dà il gesso, esulta o allarga le braccia. Più: scritte a 8 punti (a 6 la B sembrava una D) e la stecca che torna a seguire il mouse finché un clic non fissa la mira (Andrea: «non riesco più a girare la stecca»)

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018ks2K99uqCZjAxvy7Rdj1R

tests/biliardo-render.test.mjs

@@ -0,0 +1,118 @@
+import test from 'node:test';
+import assert from 'node:assert/strict';
+import { readFileSync } from 'node:fs';
+import { newBiliardo, update, shoot, predict, simulate, judge, LEN, WID, VIEW, FIXED_STEP } from '../src/engine/biliardo.js';
+import { drawBiliardo, visualFrame, pinFall, tozziPose, tablePatches, TOZZI, SHOT_DELAY } from '../src/engine/biliardo-render.js';
+import { story } from '../src/story/story.js';
+
+test('il panno generato coincide con VIEW, senza buchi fra i ritagli', () => {
+    const png = readFileSync(new URL('../' + story.closeups.biliardo.picture, import.meta.url));
+    const patches = tablePatches();
+    assert.equal(png.readUInt32BE(16), 1672);
+    assert.equal(png.readUInt32BE(20), 941);
+    for (const [i, expected] of [VIEW.x, VIEW.y, LEN * VIEW.k, WID * VIEW.k].entries())
+        assert.ok(Math.abs(patches[12][i + 4] - expected) < 1e-10);
+    let area = 0;
+    for (const [i, p] of patches.entries()) {
+        const [x, y, w, h, dx, dy, dw, dh] = p;
+        assert.ok(w > 0 && h > 0 && dw > 0 && dh > 0);
+        assert.ok(x >= 0 && y >= 0 && x + w <= 1672 && y + h <= 941);
+        assert.ok(dx >= 0 && dy >= 0 && dx + dw <= 640 && dy + dh <= 360);
+        if (i % 5 < 4) assert.equal(dx + dw, patches[i + 1][4]);
+        if (i < 20) assert.equal(dy + dh, patches[i + 5][5]);
+        area += dw * dh;
+    }
+    assert.ok(Math.abs(area - 640 * 360) < 1e-8);
+});
+
+test('la steccata trattiene solo il disegno: velocità immediata e traiettoria invariata', () => {
+    const c = newBiliardo(42), start = { ...c.balls.player };
+    const expected = simulate(c, 'player', c.angle, c.power);
+    shoot(c);
+    assert.ok(Math.hypot(c.balls.player.vx, c.balls.player.vy) > 0);
+    update(c, SHOT_DELAY / 2);
+    assert.notEqual(c.balls.player.x, start.x, 'la fisica è già partita');
+    assert.equal(visualFrame(c).balls.player.x, start.x, 'il disegno aspetta la punta della stecca');
+    update(c, SHOT_DELAY);
+    const before = structuredClone(c);
+    const shown = visualFrame(c);
+    assert.ok(shown.balls.player.x > start.x);
+    assert.ok(shown.balls.player.x < c.balls.player.x);
+    assert.deepEqual(c, before, 'leggere il fotogramma non scrive nello stato');
+    for (let i = 0; i < 10000 && c.step === 'rolling'; i++) update(c, FIXED_STEP);
+    assert.deepEqual(judge(c.shot), expected);
+    assert.ok(c.visual.frames.length < 110, 'la cronologia non cresce per tutta la partita');
+    while (c.step === 'settle') update(c, FIXED_STEP);
+    assert.equal(visualFrame(c).balls, c.balls, 'al nuovo turno torna la posizione corrente');
+});
+
+test('caduta progressiva dei birilli, senza alterare guida, punteggio o rialzata', () => {
+    const c = newBiliardo(9);
+    Object.assign(c.balls.player, { x: LEN / 2 - 60, y: WID / 2 });
+    Object.assign(c.balls.cpu, { x: LEN / 2 - 30, y: WID / 2 });
+    Object.assign(c.balls.pallino, { x: 20, y: 20 });
+    c.angle = 0; c.power = 0.5;
+    const expected = simulate(c, 'player', c.angle, c.power), before = structuredClone(c);
+    predict(c);
+    assert.deepEqual(c, before, 'la previsione non fa partire animazioni');
+    shoot(c);
+    for (let i = 0; i < 1000 && !c.pins.some(p => p.down); i++) update(c, FIXED_STEP);
+    const p = c.pins.find(p => p.down);
+    assert.ok(p && Number.isFinite(p.visualDownAt));
+    assert.equal(pinFall(p, p.visualDownAt), 0);
+    assert.ok(pinFall(p, p.visualDownAt + 0.12) > 0 && pinFall(p, p.visualDownAt + 0.12) < 1);
+    assert.equal(pinFall(p, p.visualDownAt + 0.3), 1);
+    assert.equal(visualFrame(c).pins.some(p => p.down), false, 'anche la caduta segue il tempo delle biglie visibili');
+    for (let i = 0; i < 10000 && c.step === 'rolling'; i++) update(c, FIXED_STEP);
+    assert.deepEqual(judge(c.shot), expected);
+    while (c.step === 'settle') update(c, FIXED_STEP);
+    assert.ok(c.pins.every(p => !p.down && p.visualDownAt === undefined));
+});
+
+test('Tozzi pensa, esulta e sbaglia; tutte le pose restano fuori da tavolo e comandi', () => {
+    const c = newBiliardo(3);
+    assert.equal(tozziPose(c), 'stand');
+    c.current = 'cpu'; assert.equal(tozziPose(c), 'chalk');
+    for (const [last, pose] of [
+        [{ shooter: 'cpu', to: 'cpu', points: 4, foul: null, age: 0 }, 'cheer'],
+        [{ shooter: 'cpu', to: 'player', points: 2, foul: 'miss', age: 0 }, 'shrug'],
+        [{ shooter: 'cpu', to: 'cpu', points: 0, foul: null, age: 0 }, 'shrug'],
+        [{ shooter: 'player', to: 'cpu', points: 2, foul: 'own', age: 0 }, 'cheer'],
+    ]) { c.last = last; assert.equal(tozziPose(c), pose); }
+    c.last.age = 3; assert.equal(tozziPose(c), 'chalk');
+    const atlas = JSON.parse(readFileSync(new URL('../assets/characters/ing-tozzi.json', import.meta.url)));
+    for (const pose of ['stand', 'chalk', 'cheer', 'shrug']) {
+        const f = atlas.frames[pose], left = Math.round(TOZZI.x - f.ax * TOZZI.scale);
+        assert.ok(left >= 0 && left + Math.round(f.w * TOZZI.scale) < VIEW.x - 16, pose);
+        assert.ok(TOZZI.y - f.ay * TOZZI.scale > 72 && TOZZI.y < 360);
+    }
+});
+
+test('il disegno usa immagine e atlas, funziona durante il caricamento e non modifica la partita', () => {
+    const calls = [], ctx = new Proxy({}, { get: (o, key) => key in o ? o[key] : (...args) => calls.push([key, ...args]) });
+    const previous = globalThis.document;
+    globalThis.document = { createElement: () => ({ getContext: () => ctx }) };
+    const atlas = JSON.parse(readFileSync(new URL('../assets/characters/ing-tozzi.json', import.meta.url)));
+    const bg = {}, sheet = { atlas, img: {} }, c = newBiliardo(42);
+    try {
+        const render = (background, sprite) => {
+            const before = structuredClone(c);
+            drawBiliardo(ctx, c, story.closeups.biliardo, background, sprite);
+            assert.deepEqual(c, before);
+        };
+        render(); // Il file può non essere ancora arrivato dalla rete.
+        calls.length = 0;
+        render(bg, sheet);
+        assert.ok(calls.some(([op, image]) => op === 'drawImage' && image === bg));
+        assert.ok(calls.some(([op, image]) => op === 'drawImage' && image === sheet.img));
+        assert.ok(!calls.some(([op]) => op === 'createRadialGradient'), 'biglie senza gradienti lisci');
+        shoot(c); update(c, 0.1); render(bg, sheet);
+        update(c, 0.07); render(bg, sheet);
+        while (c.step === 'rolling') update(c, 1 / 60);
+        render(bg, sheet);
+        c.step = 'result'; c.result = { winner: 'cpu' }; render(bg, sheet);
+    } finally {
+        if (previous === undefined) delete globalThis.document;
+        else globalThis.document = previous;
+    }
+});

tests/biliardo.browser.mjs

@@ -1,7 +1,7 @@
 // Regressioni della mira con veri eventi browser, su desktop e touch.
 // npm run browser:biliardo — schermate in /tmp/regolo-biliardo.
 import { chromium } from 'playwright';
-import { mkdirSync } from 'node:fs';
+import { mkdirSync, writeFileSync } from 'node:fs';
 import assert from 'node:assert/strict';
 import { staticServer } from './helpers.mjs';
 
@@ -10,6 +10,59 @@ mkdirSync(out, { recursive: true });
 const server = await staticServer();
 let browser;
 const errors = [];
+
+// Fotogrammi ripetibili del renderer, oltre alle schermate dell'interfaccia reale.
+async function checkArtwork(page, name) {
+    const captures = await page.evaluate(async () => {
+        const { story } = await import('/src/story/story.js');
+        const { newBiliardo, shoot, update, LEN, WID, VIEW } = await import('/src/engine/biliardo.js');
+        const { drawBiliardo } = await import('/src/engine/biliardo-render.js');
+        const def = story.closeups.biliardo;
+        const load = async src => { const img = new Image(); img.src = src; await img.decode(); return img; };
+        const bg = await load('/' + def.picture);
+        const atlas = await (await fetch('/assets/characters/ing-tozzi.json')).json();
+        const sheet = { atlas, img: await load('/assets/characters/' + atlas.image) };
+        const canvas = document.createElement('canvas'); canvas.width = 640; canvas.height = 360;
+        const ctx = canvas.getContext('2d'), shots = [], used = [];
+        const drawImage = ctx.drawImage.bind(ctx);
+        ctx.drawImage = (image, ...args) => { used.push(image); drawImage(image, ...args); };
+        const c = newBiliardo(42);
+        const draw = label => {
+            const before = JSON.stringify(c);
+            drawBiliardo(ctx, c, def, bg, sheet);
+            if (before !== JSON.stringify(c)) throw new Error('Il renderer modifica la partita');
+            shots.push({ label, png: canvas.toDataURL('image/png').split(',')[1] });
+        };
+        c.step = 'settle'; draw('riposo');
+        if (!used.includes(bg) || !used.includes(sheet.img)) throw new Error('Tavolo o Ingegnere non disegnati');
+        const pixel = (x, y) => [...ctx.getImageData(x, y, 1, 1).data].slice(0, 3);
+        const bright = p => p.reduce((s, v) => s + v, 0);
+        if (bright(pixel(320, 180)) <= bright(pixel(85, 180))) throw new Error('Manca la luce centrale');
+        if (pixel(177, 22).join() !== '255,90,61') throw new Error('Cifra rossa a sette segmenti assente');
+        if (pixel(177, 30).join() !== '56,27,23') throw new Error('Lo zero accende il segmento centrale');
+        const b = c.balls.player, bx = VIEW.x + b.x * VIEW.k, by = VIEW.y + b.y * VIEW.k;
+        const colors = new Set();
+        for (let y = Math.ceil(by - 3); y <= by + 3; y++) for (let x = Math.ceil(bx - 3); x <= bx + 3; x++) colors.add(pixel(x, y).join());
+        if (colors.size > 4 || !colors.has('255,253,244')) throw new Error('Biglia senza palette ridotta o riflesso quadrato');
+        c.step = 'aim'; c.current = 'cpu'; draw('tozzi-chalk');
+        c.last = { shooter: 'cpu', to: 'cpu', points: 4, foul: null, age: 0 }; c.points.cpu = 4; draw('tozzi-cheer');
+        c.last = { shooter: 'cpu', to: 'player', points: 2, foul: 'miss', age: 0 }; draw('tozzi-shrug');
+        c.last = null; c.current = 'player'; c.points.cpu = 0;
+        shoot(c); update(c, 0.1); draw('stecca-arretrata'); update(c, 0.07); draw('stecca-avanti'); update(c, 0.08); draw('biglie-partite');
+        const pins = newBiliardo(9);
+        Object.assign(pins.balls.player, { x: LEN / 2 - 60, y: WID / 2 });
+        Object.assign(pins.balls.cpu, { x: LEN / 2 - 30, y: WID / 2 });
+        Object.assign(pins.balls.pallino, { x: 20, y: 20 });
+        pins.angle = 0; pins.power = 0.5; shoot(pins);
+        for (let n = 0; n < 1000 && !pins.pins.some(p => p.down); n++) update(pins, 1 / 240);
+        update(pins, 0.25); update(pins, 0.04);
+        drawBiliardo(ctx, pins, def, bg, sheet);
+        shots.push({ label: 'birilli-caduta', png: canvas.toDataURL('image/png').split(',')[1] });
+        return shots;
+    });
+    for (const { label, png } of captures) writeFileSync(`${out}/${name}-${label}.png`, Buffer.from(png, 'base64'));
+}
+
 try {
     browser = await chromium.launch({ args: ['--use-gl=angle', '--use-angle=swiftshader', '--enable-unsafe-swiftshader'] });
     for (const [name, mobile, viewport] of [
@@ -32,6 +85,10 @@ try {
             game.choose(game.options().findIndex(o => o.text.includes('una partita ai birilli'))); settle(game);
         });
         await page.waitForSelector('#bocce-controls:not([hidden])');
+        await page.waitForFunction(async () => {
+            const { hasBackground } = await import('/src/engine/render.js');
+            return hasBackground('assets/closeups/biliardo-tavolo.png');
+        });
         const canvas = await page.locator('#scene').boundingBox();
         for (const id of ['#sound', '#corner']) {
             const box = await page.locator(id).boundingBox();
@@ -55,6 +112,12 @@ try {
             return { x: r.x + x / 640 * r.width, y: r.y + y / 360 * r.height, r };
         };
         const target = await position();
+        if (!mobile) {
+            // Prima del clic la stecca segue il mouse (Andrea, 25 ottobre: «non riesco più a girare la stecca»).
+            const before = (await state()).angle;
+            await page.mouse.move(target.r.x + target.r.width * 0.5, target.r.y + target.r.height * 0.85, { steps: 4 });
+            assert.notEqual((await state()).angle, before, 'senza clic la stecca gira col mouse');
+        }
         if (mobile) await page.touchscreen.tap(target.x, target.y);
         else await page.mouse.click(target.x, target.y);
         assert.equal((await state()).step, 'aim', 'un tocco sceglie la mira senza tirare');
@@ -72,6 +135,7 @@ try {
         await page.locator('#bocce-power').fill('60');
         const prepared = await state();
         await page.screenshot({ path: `${out}/${name}-mira.png` });
+        await checkArtwork(page, name);
         const expected = await page.evaluate(async () => {
             const { simulate } = await import('/src/engine/biliardo.js');
             const c = game.closeup;