IMPLEMENTACE 3D LOGICKÉ HRY V JAVASCRIPTU

Download

Obsah PDF

1. Úvod
2. Použité technologie a teorie 
2.1 HTML5
2.2 Javascript 
2.3 JSON
2.4 Lineární algebra pro 3D grafiku
2.5 WebGL
3 Koncepce hry
3.1 Berušky 2 
3.2 Herní pole 
3.3 Prvky herního pole 
3.4 Váhy herních prvků a síla berušky 
3.5 Posuvy beden 
3.6 Výbušné bedny 
3.7 Ovládání 
3.8 Vykreslování 
3.9 Návrh webu 
4 Implementace
4.1 Inicializace 
4.2 Nahrání vybrané úrovn 
4.3 Vytvoření vnitřní reprezentace herní úrovně 
4.4 Herní logika a podněty uživatele 
4.5 Ovladání 
4.6 Vykreslování 
4.7 Nastavení hry 
5 Testování 
6 Závěr 
A - Diagram HTML 5 API 
B - Diagram návrhu webu 
C - Podoba hry Berušky 2 WebGL

Obsah Archivu

./audio ............Herní hudba
./css ..............Kaskádové styly
./doc ..............Zdrojové soubory techniké zprávy
./dochtml ..........Vygenerovaná dokumentace hry
./graphics .........Zdrojové soubory grafiky
./img ..............Grafika použitá na webu
./js ...............Implementace hry a pomocné soubory
./levels ...........Herní úrovně
./lightmaps ........Lightmapy
./textures .........Textury
./favicon.ico ......Ikona webu
./ibp.pdf ..........Technická zpráva
./index.html .......HTML dokument hry s GLSL popisem shaderů

Upozornění

Některé prohlížeče zamezují možnosti načítání souborů z lokálního úložiště.
U prohlížeče Google Chrome je při jeho spouštění potřeba přidat tyto parametry:

--allow-file-access-from-files --disable-web-security

Hardwarová akcelerace WebGL je možná pouze na grafických čipech podporujících shader model 2.0. V případě, že Váš hardware tuto technologie nepodporuje, je ve většině případů možné vykreslovat obraz softwarově. Dále je také nutné zkontrolovat, zda Váš prohlížeč podporuje WebGL a zda je technologie v prohlížeči povolena.

Pokud se ocitnete v situaci, kdy je hra podle všeho vykreslována, avšak obrazovka zůstává černá, pak máte nejspíše zvolenou kameru z pohledu berušky a vypnuto zobrazení okolí herní úrovně. Informace o klávesách, které kameru a zobrazení nastavují, jsou dostupné pomocí menu v pravém horním rohu webu. Menu představuje různé kontexty zobrazení.