Camera Arcade AR
Jocuri în realitate augmentată, direct în browser (iPhone, Android, laptop), singur sau cu prietenii:
- Joc de zaruri: două zaruri 3D cu fizică reală; pe rând, fiecare aruncă și vede imediat câte puncte a făcut; cine are mai multe ia runda (la egalitate aruncă din nou doar cei la egalitate). În AR zarurile îți apar în palmă: strângi pumnul, le agiți și deschizi mâna ca să le arunci pe masă. Pe ecran: dai cu degetul peste masă sau scuturi telefonul.
- Pe bani (bonus, îl pornește gazda): fiecare își pune bancnota în fața camerei înainte să arunce; aplicația recunoaște bancnota (1–500 lei), câștigătorul rundei ia potul și se ține soldul fiecăruia.
- Piatră–Hârtie–Foarfecă: gestul e recunoscut din camera din spate (MediaPipe Hand Landmarker). Runda pornește singură când toți jucătorii au mâna în cadru, cu numărătoare 3–2–1 (bip și vibrație), iar gestul se arată pe „Acum!”. Singur pe telefon: o mână = tu contra calculatorului, două mâini = doi jucători. Mâinile tale rămân cele reale din cameră, cu simbolul 3D al gestului deasupra. Adversarul are o mână 3D articulată, bate ritmul cu pumnul, apoi dezvăluie alegerea și simbolul. La rezultat simbolurile și mâna adversarului se apropie și reacționează, cu particule de impact.
- Nu te supăra, frate: 2–4 jucători, fiecare cu culoarea aleasă, tabla 3D pe masă. Zarul îl arunci din palmă; căsuțele unde poți muta sunt marcate, iar pionul îl iei tu (cu degetul pe ecran sau ciupit cu mâna) și îl pui pe căsuța marcată — lăsat în altă parte, se întoarce.
- Jenga: turn de 54 de piese pe masă; pe rând prinzi o piesă (cu degetul pe ecran sau, în AR, între degetul mare și arătător), o scoți și o duci tu sus pe turn; cine dărâmă turnul pierde. Dacă tragi prea repede, turnul se clatină și riscul crește. Stabilitatea se calculează geometric (centrul de greutate față de zona de sprijin a fiecărui nivel) plus un risc care crește cu fiecare nivel șubrezit; prăbușirea e simulată fizic.
- X și 0: clasic, 3×3, tabla pe masă. În AR pui degetul real pe o căsuță și îl ții o clipă.
Cum se joacă
Mâini virtuale animate
La aruncările tactile și ale calculatorului, o mână 3D ține zarurile, le agită și le eliberează. Când arunci cu mâna reală urmărită de cameră, zarurile pleacă direct din ea. La piatră–hârtie–foarfecă, mâinile reale din cameră au doar o piatră, o foaie sau o foarfecă 3D deasupra, fără avatar duplicat. Adversarul păstrează mâna 3D articulată și simbolul. Adversarul bate ritmul cu pumnul și își arată simbolul doar la dezvăluirea alegerii; la rezultat simbolurile și mâna adversarului se apropie și reacționează. Modelul comun este în src/scenes/virtual-hand.js, iar simbolurile în src/scenes/rps-symbols.js, fără biblioteci suplimentare.
Pași
- La pornire apeși Pornește camera (aplicația merge doar cu camera — AR), apoi, prima dată, îți scrii numele.
- Creează cameră → primești un cod de 4 litere; prietenii apasă Intră cu un cod și îl scriu. Fără cameră joci pe telefonul tău, cu calculatorul (+ Calculator).
- Gazda alege jocul; toți intră automat în el.
- Jocul se deschide direct pe masa ta; din butonul cu cubul (sus) poți alege:
- Pe masa mea — aplicația caută întâi o suprafață plană, apoi atingi unde vrei tabla/zarurile. Merge oriunde, fiecare pe masa lui (inclusiv cei care nu sunt în aceeași cameră).
- Pe markerul comun — pentru cei din aceeași cameră: pui pe masă markerul (printat sau pe o tabletă) și tabla apare exact pe el, în același loc pentru toți.
Cum e făcut
src/rules/ regulile jocurilor (fără grafică, testate automat)
src/ar/ camera, urmărirea mesei și recunoașterea mâinii
src/scenes/ scenele 3D ale fiecărui joc
src/ui/ interfața (app.js leagă totul), sunete
src/extra/ multiplayer și bancnote (funcții în plus)
tests/ teste automate · tools/ar-sim/ simulatorul de telefon
Explicat pe larg, pas cu pas: DOCUMENTATIE.md.
| Fișier | Ce face |
|---|
src/rules/ludo.js | regulile „Nu te supăra, frate” |
src/rules/game.js | starea camerei de joc (lobby, zaruri, PHF, Ludo, calculatorul) — reducer pur |
src/extra/net.js | multiplayer fără server propriu: PeerJS (WebRTC); gazda ține starea și o trimite tuturor |
src/scenes/dice.js | zaruri cu fizică (cannon-es); valoarea e decisă de cel care aruncă, animația o respectă pe toate telefoanele |
src/scenes/board.js | tabla 3D, pionii animați pas cu pas |
src/rules/jenga.js, src/scenes/jenga-view.js | regulile și stabilitatea turnului / turnul 3D, tragerea și prăbușirea |
src/rules/xo.js, src/scenes/xo-view.js | regulile și calculatorul / tabla 3×3 |
src/ar/ar.js | scena: pe masă cu 8th Wall (rezervă: AlvaAR SLAM + giroscop) / marker ArUco (js-aruco2) / WebXR (?webxr) |
src/ar/hands.js | recunoașterea mâinilor și a gestului |
src/ar/surface.js | masa din punctele 3D ale urmăririi (înălțimea unde se adună cele mai multe), ca aplicația Măsurare |
src/ar/ar.js → makeHand | mâna reală în scena AR: raze 3D prin degete, distanța estimată din mărimea palmei, ciupit |
src/scenes/rps-ar.js, src/scenes/virtual-hand.js | simboluri peste mâinile reale, mâinile articulate ale adversarilor și reacții animate |
src/ui/sound.js | sunete sintetizate, vibrație, confetti |
src/extra/banknotes.js, src/extra/banknote-refs.json | recunoașterea bancnotelor: rețea neuronală (MediaPipe Image Embedder) + cel mai apropiat vecin |
src/ui/app.js, index.html | interfața (Inter + iconițe Phosphor prin Iconify) |
Biblioteci (din CDN): three.js, cannon-es, PeerJS, MediaPipe Tasks Vision, 8th Wall Engine © Niantic Spatial (binar gratuit, licență proprie — urmărirea mesei), AlvaAR (GPL-3.0, rezervă), js-aruco2.
This is the beginning of the README. Read the rest at the original. Read the full README ↗
