Accedi con GitHub
IT

Il pannello JumPHP di Claude Code

Mentre Claude scrive il tuo gioco, vedi cosa fa: un pannello accanto alla conversazione mostra i test in corso, le schermate del gioco che guarda, e ti permette di intervenire. È un mod di Claude Code, jumphp-live, fornito con JumPHP.

Installarlo

In Claude Code (in un terminale), digita:

/plugin install jumphp-live --marketplace davidnurdin/jumPhp

Rispondi y per aggiungere la sorgente, poi scegli l'ambito («user»: per tutti i tuoi progetti). Da una shell: claude plugin install jumphp-live --marketplace davidnurdin/jumPhp.

Usarlo

Nel tuo progetto JumPHP (la cartella che contiene bin/jumphp), avvia Claude Code e digita /jumphp <gioco>, per esempio /jumphp pong. Il pannello si apre a destra (serve una finestra abbastanza larga, 110 colonne o più). Si apre anche da solo la prima volta che Claude avvia bin/jumphp test o bin/jumphp shot.

Cosa mostra:

  • I controlli in diretta: quando Claude avvia bin/jumphp test, l'output scorre nel pannello e ogni passo viene spuntato man mano: ✔ php -l ✔ phpstan … phpunit smoke test. Alla fine: il riepilogo di PHPUnit e ciò che è fallito (i test falliti, gli avvisi e gli errori PHP).
  • La schermata del gioco in diretta (● live): mentre bin/jumphp test (il suo smoke test) o bin/jumphp shot fa girare il gioco, il pannello mostra la sua schermata fotogramma dopo fotogramma (il motore riscrive var/live/frame.png, opzione JUMPHP_LIVE). Le esecuzioni senza finestra vanno più veloci del tempo reale: JUMPHP_REALTIME=1 le rallenta alla velocità del gioco. Un progetto creato prima di questa opzione la recupera con git pull jumphp main (il repository JumPHP originale, conservato con il nome jumphp).
  • I test di gioco, sotto i tuoi occhi: i test che giocano il gioco vengono mostrati mentre girano (⏳, poi ✔ / ✘), con il nome del test in corso sopra la schermata live; poi clicca su un test per vedere il suo ultimo fotogramma. Il pulsante 🐢 Game speed / ⏩ Fast (r) sceglie la velocità: quella del gioco (per impostazione predefinita, per vedere la racchetta muoversi) o la più veloce possibile.
  • Le schermate: lo screenshot che bin/jumphp shot o siteshot ha appena fatto, e ogni immagine che Claude apre per guardare il gioco, mostrati nel pannello.
  • Le immagini in qualsiasi terminale: per impostazione predefinita sono disegnate con piccoli blocchi di colore (▦ Blocks), che ogni terminale a colori reali visualizza (GNOME Terminal, Konsole, Windows Terminal, VS Code…): il motore scrive a questo scopo, accanto a ogni PNG, una piccola copia grezza (.rgb). In kitty, Ghostty o iTerm2 il pannello mostra il PNG stesso (🖼 HD); il tasto p alterna. Il pulsante 🖼 Open (o) apre l'immagine mostrata nel visualizzatore del tuo desktop (xdg-open, open su macOS), a dimensione reale.
  • Il playground: il risultato dei test PHPUnit del sito (run_tests, get_test_run) e delle pubblicazioni (sync_project) quando Claude usa il server MCP.

Cosa puoi fare:

  • ▶ Tests (tasto t) e 📸 Shot (s): avviare subito i test o uno screenshot, senza Claude; l' output scorre nel pannello.
  • 🛠 Ask Claude to fix (f), dopo un fallimento: Claude riceve ciò che è fallito e corregge.
  • Tell Claude: un campo per scrivergli («salta più in alto», «il boss è troppo difficile»); lo legge appena ha finito il passo in corso.

Come segue Claude

Un comando Bash di Claude che avvia bin/jumphp test, shot, siteshot o webshot viene eseguito così com'è, con il suo output copiato anche in un file temporaneo che il pannello segue ({ export JUMPHP_LIVE=1; comando } 2>&1 | tee …, il codice di uscita viene conservato). Gli altri comandi non vengono toccati. Nulla viene inviato altrove.