Broncode van een poolspel: binnenkant van een 8-ball HTML5-pakket

Broncode van een poolspel is het waard om te kopen als drie dingen in aparte, leesbare bestanden zitten: de balfysica, de 8-ball-regels en de computertegenstander. Als die door elkaar lopen, wordt elke wijziging aan de laken-kleur of de moeilijkheid van de cpu een zoektocht naar fouten. Velvet Pool, ons 8-ball-template, houdt ze gescheiden, en deze gids loopt het pakket bestand voor bestand door.

We behandelen hoe de code is georganiseerd, wat een koper meestal als eerste aanpast, hoe je het hostet of als app inpakt, wat de licentie toestaat en wat de editie niet bevat. Elke bestandsnaam hieronder komt uit de kopersgids die bij het spel zit.

De korte versie: Velvet Pool is gewone JavaScript op WebGL2, zonder 3D-bibliotheek en zonder buildstap. Je wijzigt een bestand, kopieert het naar de spelmap en herlaadt de pagina.

Wat deze broncode van een poolspel bevat

Velvet Pool is een af 8-ball-spel, geen engine en geen startpakket. Het download bevat vier mappen: game/ is de kant-en-klare build om te uploaden, source/ is hetzelfde spel als ontwikkelaarseditie met een README, package.json en tests, documentation/ bevat de geïllustreerde gids in het Engels en Portugees, en THIRD-PARTY-LICENSES/ bewaart de licentieteksten van de lettertypen.

Het spel zelf speelt 8-ball met fouten, bal in de hand en volle of gestreepte ballen. Er zijn drie cpu-niveaus (Easy, Medium en Hard), een gratis oefentafel met ongedaan maken, balplaatsing en opnieuw opstellen, en wedstrijden voor twee spelers op één apparaat. Spelers geven de speelbal volgspin, trekspin of zijspin, en lokale prestaties ontgrendelen vijf laken-kleuren en vijf keustijlen. De interface komt in 14 talen.

• Stack: vanilla JavaScript, ES-modules en WebGL2. Geen Three.js of andere codebibliotheek.
• Code: gewone, opgemaakte JavaScript in source/src en game/src. Niets is geminificeerd of gebundeld.
• Tests: optioneel, met Node.js 20 of nieuwer. Ze controleren de fysica, de 8-ball-regels, de cpu-wedstrijden en de vertaalsleutels.
• Versie op het moment van schrijven: 1.1.0, bijgewerkt op 22 oktober 2026.

Bekijk de Velvet Pool-vermelding, de demo en de handleiding

Hoe de bestanden zijn ingedeeld

game/ en source/ hebben dezelfde indeling, dus een pad in de ene map wijst naar hetzelfde bestand in de andere. De scheiding die voor een poolspel het belangrijkst is, loopt tussen src/core/ (simulatie en regels) en src/game/ (alles wat de speler aanraakt).

• src/core/physics.js: de simulatie van de ballen, spin en kussenreactie.
• src/core/rules.js: de 8-ball-regels en fouten.
• src/core/ai.js: hoe de cpu zijn stoot kiest.
• src/game/controls.js: invoer voor richten, kracht en spin.
• src/game/progress.js: prestaties, lakens, keus en wedstrijdscores.
• src/game/i18n.js: de teksten in 14 talen, opgesomd in LANGS.
• src/game/localRecords.js: de lokale scorehistorie.
• src/game/audio.js: het afspelen van effecten en muziek.
• css/style.css en css/fonts.css: thema, responsieve lay-out en lettertypedeclaraties.
• assets/: kunst, audio en lettertypen, met de logobestanden in assets/logo/.

Omdat fysica, regels en cpu aparte modules zijn, kun je de cpu toleranter maken zonder de manier waarop de ballen bewegen aan te raken, of een foutregel wijzigen zonder de kussens opnieuw af te stemmen. Die scheiding is het belangrijkste om te zoeken in biljartcode die je koopt.

Wat een koper als eerste aanpast

De meeste projecten volgen dezelfde volgorde. Begin met wat spelers zien, ga dan naar wat ze voelen, en laat de regels voor het laatst, want regels zijn de makkelijkste plek om een bug te introduceren.

1. Huisstijl: vervang de logobestanden in assets/logo/ en pas de bijpassende maten in de CSS aan. Witlabel is toegestaan, dus jouw naam of die van je klant mag de onze vervangen.
2. Uiterlijk van de tafel: kleuren en lettertypen staan in css/style.css. Definities van lakens en keus staan in progress.js. Houd hun ID's stabiel, anders verliezen spelers de cosmetische items die ze al hebben ontgrendeld.
3. Teksten en talen: elke string staat in i18n.js. Pas de tekst aan die je nodig hebt; de lijst met talen staat in LANGS.
4. Moeilijkheid van de cpu: de keuze van de stoten staat in ai.js. Stem één niveau tegelijk af en speel een volledige wedstrijd tegen de cpu.
5. Fysica: wrijving, spin en kussenreactie staan in physics.js. Kleine wijzigingen werken hier erg door, dus draai de tests na elke wijziging.
6. Regels: huisvarianten horen in rules.js. Test fouten en bal in de hand met de hand, en ook met de suite.

De werkwijze is voor alle onderdelen hetzelfde: bewerk het bestand in source/, kopieer het naar hetzelfde pad in game/, serveer de map via HTTP en herlaad. De kopersgids raadt aan één functie tegelijk te wijzigen en na elke wijziging het menu, een wedstrijd, pauze, het resultaatscherm en een herlaadbeurt te testen.

Hosten, insluiten of als app inpakken

Hosten is het eenvoudigste deel. Upload alles uit game/ naar een map zoals public_html/velvet-pool/, houd de submappen intact, en open het adres. Er is geen npm, terminal, PHP, database of account aan de serverkant nodig. Een plan dat statische bestanden via HTTPS serveert, is genoeg.

• Dubbelklik niet op index.html: browsers blokkeren de spelmodules op file://. Voor een lokale test draai je python -m http.server 8765 in game/.
• Blijft het scherm leeg, controleer dan of WebGL2 is ingeschakeld en of bestandsnamen hoofd- en kleine letters behouden.
• Weigert de browser een module, dan serveert je server .js met een verkeerd MIME-type.
• In een iframe op een portal: sta fullscreen en autoplay toe.

Alles wat het spel tijdens het draaien nodig heeft, staat in game/, dus er wordt niets van een CDN of een andere site geladen. Een verse paginalaadbeurt bereikt nog steeds je host, dus dit is geen installeerbare offline-app. Het werkt wel op touchschermen: spelers richten op de tafel en trekken aan de krachtregelaar.

Native appprojecten zitten niet in het pakket. Wil je het spel in de Google Play Store of de App Store, dan is een wrapper zoals Capacitor, dat de makers beschrijven als een native runtime voor mobiele apps met webcode, een gangbare route. Het bouwen en onderhouden van het winkelproject is jouw werk, of een dienst die we apart offreren.

Wat de editie niet bevat

Velvet Pool is de lokale browseredities. Er is geen online multiplayer of privékamers, geen online ranglijst, geen cloudaccounts en geen advertentie-SDK. Twee personen kunnen op één apparaat spelen, en persoonlijke scores van in aanmerking komende cpu-wedstrijden worden in de browser opgeslagen. Oefenwedstrijden en wedstrijden op hetzelfde apparaat slaan geen score op.

Online spelen vraagt om je eigen server en ontwikkelwerk. Dat is een echt project, dus reken er vanaf het begin op in plaats van te verwachten dat het template ermee meegroeit. Heeft je catalogus meer sportspellen nodig, dan zijn deze twee ook als kant-en-klare browseredities te koop.

Puttide: 3D-minigolf met 30 holes, ook in gewone JavaScript

Golazo: tafelvoetbal met 50 nationale teams

Licentie en prijs in één alinea

Velvet Pool heeft een lijstprijs van $39. Tot 30 november 2026 geldt een Black Friday-actie van 15% op elke template, dus het kost $33,15, en bestellingen van twee of meer templates krijgen daarnaast 5% tot 20% korting. Elke aankoop is een eeuwigdurende, niet-exclusieve licentie voor één eindproduct, van jou of van één klant. Je mag de code, kunst en audio binnen dat product wijzigen en er je eigen merk op zetten. Spelers kunnen het gratis spelen of via advertenties. Je mag de template of zijn code niet op zichzelf doorverkopen. Zes maanden support zijn inbegrepen, of twaalf met de extensie bij het afrekenen; maatwerk, hosting en SDK- of portalintegratie worden apart geofferd.

Lees de volledige licentie- en supportvoorwaarden

Veelgestelde vragen

Is de broncode van het poolspel leesbaar of geminificeerd?

Leesbaar. De JavaScript in source/src en game/src is gewoon en opgemaakt, zonder geminificeerde of gebundelde bestanden.

Heb ik Node.js of een buildstap nodig?

Nee. Je bewerkt de bestanden in source/ en kopieert ze naar game/. Node.js 20 of nieuwer is alleen nodig als je de optionele tests wilt draaien.

Kan ik de cpu makkelijker of moeilijker maken?

Ja. De keuze van de cpu-stoten staat in src/core/ai.js, los van de fysica, dus je kunt die afstemmen zonder de beweging van de ballen te veranderen.

Werkt het op telefoons?

Ja. Aanraakinvoer wordt ondersteund en de besturing past zich aan het scherm aan. WebGL2 is vereist, en de prestaties hangen af van het apparaat, dus test op de telefoons die je spelers gebruiken.

Behouden spelers hun voortgang als ik het spel naar een nieuw domein verhuis?

Nee. Opslag hoort bij de browseroorsprong, dus bij een ander domein begint de speler opnieuw. Kies het definitieve adres vóór de lancering.

Kan ik online multiplayer toevoegen?

Niet met alleen deze editie. Daarvoor heb je je eigen server en ontwikkelwerk nodig. We kunnen het als maatwerk offreren.

Voor wie deze poolcode geschikt is

Het past bij een portal of site die een 8-ball-spel in de catalogus wil, bij een bureau dat een gebrand biljartspel voor één klant levert, en bij een ontwikkelaar die wil lezen hoe poolfysica en regels zijn geschreven zonder 3D-bibliotheek ertussen. Het past minder goed als je plan afhangt van online wedstrijden of een gedeelde ranglijst.

Speel de demo voor je koopt op een telefoon en op een laptop, en open de bestandsindeling in de handleiding. Als de scheiding tussen fysica, regels en cpu past bij hoe jij wilt werken, is de rest een paar middagen wijzigen.

Probeer de Velvet Pool-demo en koop de licentie

Wijzigingen nodig of meerdere licenties? Vraag een offerte aan