Izvorna koda namiznega tenisa: datoteke in fizika igre Sunset Rally
3D namizni tenis za brskalnik, odprt datoteko za datoteko: kje so fizika, točkovanje, kampanja in kraji ter kaj spremeniti najprej.
Če potrebuješ izvorno kodo namiznega tenisa, ki jo lahko gostiš in spreminjaš, je Sunset Rally pripravljena 3D igra namiznega tenisa za brskalnik z kampanjo z devetimi tekmami, tremi nasprotniki CPU, delavnico in celotnim projektom TypeScript, za 39 $ po redni ceni. Mapa igre je že zgrajena in nepomanjšana, zato jo lahko najprej naložiš, berljiva pa je pozneje.
Športne igre se težje prilagajajo, kot se zdi, ker je zabava v fiziki in kontrolah, ne v menijih. Ta vodnik pokaže, kje je vsak od teh delov v projektu Sunset Rally, kaj lahko varno spremeniš in kaj ta izdaja izpušča.
Kako igra namizni tenis
Tekme gredo do sedmih točk proti nasprotniku CPU. Igralci premikajo kazalec ali vlečejo, da nadzirajo loparček, zadetki pa so samodejni. Potiskanje navzgor doda moč, premik vstran postavi žogo, vlečenje navzdol odigra spustni udarec, visoka žoga pa je tam za smash.
Izbirna pomoč, ki jo igralci lahko med tekmo vklopijo in izklopijo, pomaga loparčku najti višino žoge. To je pomembno za javno spletno mesto: igralec, ki prvič igra na telefonu, lahko še vedno vrne žogo.
Na voljo so trije nasprotniki CPU s svojimi slogi: potrpežljiva Capi, razigrana Nori in natančna Miso, vsak na Easy (lahko), Normal (normalno) ali Hard (težko). Način Training (trening) ti da partnerja, ki vrne vsak udarec. Po tekmi ponovni posnetek pokaže odločilno točko znova.
Kaj vsebuje paket izvorne kode namiznega tenisa
- Mapa game/, pripravljena za gostovanje, že zgrajena in nepomanjšana.
- Razvijalska izvorna koda TypeScript z nastavitvijo Vite in sredstvi igre, v source/.
- Ilustrirani priročniki v angleščini in portugalščini s pravimi posnetki zaslona.
- Pisave in zvočne datoteke, priložene igri.
- Obvestila o licencah tretjih oseb in dnevnik sprememb.
Sklad je TypeScript, Three.js r184, Vite in WebGL2. Datoteke so HTML, CSS, JavaScript, TypeScript in JSON. Vmesnik je na voljo v 14 jezikih: angleščina, portugalščina, španščina, francoščina, nemščina, italijanščina, nizozemščina, poljščina, turščina, ruščina, indonezijščina, japonščina, korejščina in poenostavljena kitajščina. Priročnika sta samo v angleščini in portugalščini.
Vsebina okoli tekem je prav tako del paketa: krog Sunset Circuit z devetimi tekmami v treh fazah, trije kraji (vrt Sunset, vrt Sakura in obalna kavarna Seaside café) ob jutru, popoldnevu, noči ali dežju ter delavnica Workshop, kjer kovanci iz zmag kupijo barve loparčkov, obloge, oblike, ročaje, lesene podlage, trak za robove, nalepke ter sloge žog in miz.
Kje so stvari v kodi
Priročnik vsak del igre preslika v datoteko. To je seznam, ki ga imej odprtega, medtem ko delaš:
- Campaign.ts: devet tekem kampanje in njihovi cilji za zvezdice.
- Places.ts: kako izgleda vsak kraj.
- physics.ts: fizika žoge in loparčka.
- match.ts: pravila točkovanja in tekme.
- i18n.ts: besedilo vmesnika v angleščini in portugalščini; drugi jeziki so v mapi locales.
- styles.css: oblikovanje menijev in zaslonov.
Vsaka tekma kampanje ima do tri zvezdice: zmaga, zadeti tri kote in odigrati izmenjavo desetih udarcev. To je 27 zvezdic, z zaključkom vsakega kraja pa se prisluži nagrada iz delavnice. Ker so pogoji za zvezdice v eni datoteki kampanje, lahko kampanjo naredite lažjo ali težjo, ne da bi iskali po kodi.
Kaj najprej spremeniti v predlogi za namizni tenis
Predlagamo ta vrstni red, od nizkega do visokega tveganja.
- Besedilo vmesnika in ime igre v i18n.ts in mapi locales.
- Barve in zasloni v styles.css.
- Slogi delavnice za loparčke, žoge in mize, da oprema nosi tvojo blagovno znamko.
- Vizualni elementi krajev v Places.ts.
- Tekme kampanje in cilji zvezdic v Campaign.ts.
- Fizika in točkovanje v physics.ts in match.ts, le če potrebuješ drugačen občutek.
Priročnik dodaja tri pravila, ki jih je vredno upoštevati. Ohrani ID-je odklepov, ID-je predmetov in ključe shranjevanja stabilne, sicer igralci izgubijo, kar so zaslužili. Pred začetkom naredi varnostno kopijo. Spreminjaj eno funkcijo naenkrat, da veš, katera sprememba je povzročila kaj.
Beli označevalnik (white label) je dovoljen: tvoje ime in logotip ali tvojega naročnika lahko nadomestita naše.
Ponovna gradnja, gostovanje in vdelava
Za igranje ni treba ničesar graditi. Naloži vsebino mape game/ na poljuben gostitelj HTTP(S), ki streže statične datoteke, ohrani relativne poti in odpri naslov. Ni potreben PHP, baza podatkov ali račun.
Za spremembo izvorne kode potrebuješ Node.js (priporočen je 24 LTS) in npm. Uredi TypeScript, ponovno zgradi z Vite in zamenjaj gostujočo mapo game/ z novim izhodom.
Brskalnik potrebuje JavaScript, ES module in WebGL2. Podprta sta dotik in miška, kontrole pa se prilagodijo velikosti zaslona. Zmogljivost je odvisna od brskalnika in naprave, zato preizkusi na telefonih, ki jih uporabljajo tvoji igralci.
- Naloži game/ v testno mapo na tvojem gostitelju.
- Odigraj eno tekmo v namiznem brskalniku in eno na telefonu.
- Besedilne in slogovne spremembe naredi v source/ in ponovno zgradi.
- Zamenjaj celotno testno mapo in ponovno igraj.
- Premakni na končni naslov.
Kaj ta izdaja ne vključuje
Ta izdaja se igra proti CPU: kampanja, prosta tekma in trening. Spletni večigralec, spletne sobe, spletne lestvice in oblačni računi niso del paketa, prav tako ni načina za dva igralca. Ni SDK za oglase ali računov, nativne aplikacije in gostovanje niso vključeni.
Napredek ostane v brskalniku igralca: zvezdice kampanje, rezultati, statistika, ponovni posnetki in predmeti iz delavnice. Ne uporablja se noben strežnik ali račun, zato po zagonu ni ničesar vzdrževati.
Če potrebuješ spletni način, SDK za portal, različico za trgovino z aplikacijami ali namestitev na svoj strežnik, je to ločena storitev, ponujena za vsak projekt posebej.
Zahtevaj ponudbo za delo po meri
Licenca, podpora in cena v enem odstavku
Z enim nakupom dobiš trajno, nekskluzivno licenco za en končni izdelek, tvojega ali enega naročnika, ki ga igralci lahko uporabljajo brezplačno ali z oglaševalskim zaslužkom. Kodo, grafiko in zvok v tem izdelku lahko spremeniš, ne smeš pa predloge, njene kode ali sredstev preprodajati ali deliti samih po sebi. Podpora traja 6 mesecev, z dodatnim podaljšanjem ob blagajni pa 12, in pokriva namestitev in uporabo datotek ter popravljanje napak, ki jih je mogoče ponoviti; delo po meri, gostovanje in integracija SDK ali portala se ponudijo posebej. Redna cena je 39 $; do 30. novembra 2026 velja promocija črni petek, ki odstrani 15 % z vsake predloge, zato Sunset Rally stane 33,15 $, od 1. decembra pa se cene vrnejo na redne.
Pogosta vprašanja
Ali moram za uporabo te igre namiznega tenisa kaj graditi?
Ne. Mapa game/ je že zgrajena. Naloži njeno vsebino na statični spletni gostitelj in odpri naslov. Node.js in npm sta potrebna le, če spremeniš TypeScript in ponovno zgradiš.
Ali obstaja način za dva igralca ali spletni način?
Ne. Ta izdaja se igra proti CPU v kampanji, prostih tekmah in treningu.
Ali lahko spremenim kampanjo in cilje zvezdic?
Da. Tekme in pogoji za zvezdice so v Campaign.ts. Po spremembi ponovno zgradi z Node.js.
Ali lahko spremenim, kako se žoga obnaša?
Da. Fizika je v physics.ts, pravila točkovanja pa v match.ts. Spreminjaj eno stvar naenkrat in preizkusi proti vsakemu nasprotniku.
Ali deluje na telefonih?
Da, s kontrolami na dotik, ki se prilagodijo zaslonu. Potreben je WebGL2, zmogljivost pa je odvisna od naprave, zato preizkusi na telefonih, ki jih ciljaš.
Kje je napredek shranjen?
V brskalniku igralca. Ne uporablja se noben strežnik ali račun.
Druge športne predloge za primerjavo
Če gradiš športni kotiček za spletno mesto, dve drugi predlogi lepo sodita ob Sunset Rally. Velvet Pool je igra bilijarda osmica s CPU nasprotnikom in lokalnim načinom za dva igralca, napisana v navadnem JavaScriptu z WebGL2, po redni ceni 39 $. Puttide je 3D mini golf s 30 luknjami, zgrajen na Three.js in Rapierju, po redni ceni 39 $. Obe imata 14 jezikov vmesnika.
Sunset Rally ustreza portalom in spletnim mestom, ki želijo športno igro s kratkimi tekmami, studiem, ki enemu naročniku dostavi igro z blagovno znamko, in razvijalcem, ki želijo berljiv projekt TypeScript in Three.js, iz katerega se lahko učijo ali ga razširijo. Če potrebuješ dva igralca na isti napravi, ima to način Velvet Pool, Sunset Rally pa ga nima.
Oglej si Velvet Pool, igro osmica
Oglej si Puttide, 3D mini golf
Dva ali več predlog v istem naročilu zniža vsako licenco: 5 % popusta za dve, 10 % za tri, 15 % za štiri in 20 % za pet ali več.