Dneska jsem provedl úspěšnou konverzi z GM8.0 do HTML5 (javascript) na jednom kusu ze své starší tvorby. Než vám popíšu, jak to šlo, můžete se kouknout na výsledek: http://www.povray.cz/HTML5/Aiming/index.html

Nejprve je třeba říct, že o tu jednu hru jde jen okrajově. Hlavní věc zkoumání byla užitečnost a použitelnost Game Makeru Studio obecně, což se pokusím vysvětlit malou historickou vsuvkou.

Nemám rád změny. Musím přiznat, že byla doba, kdy jsem velmi dlouho zvažoval, jestli se budu GM jako IDE držet, když yoyogames přestali vyvíjet klasický Game Maker pro Windows ( Mac ) a začali bastlit své Game Maker Studio. Měl jsem v té době za sebou už řadu vytvořených herních pokusů s různou úrovní úspěšnosti a v původním Game Makeru jsem se konečně začínal cítit programátorsky sebejistý. Uvědomoval jsem si nedostatky Game Makeru a většinu problémů jsem byl schopen obejít nebo zcela vyřešit. Samozřejmě jsem uvítal snahu Yoyogames rozvíjet můj oblíbený software, protože bylo jasné, že původní koncept Game Makeru napsaný v Delphi je zastaralý a bez budoucnosti. Jenže pěkné myšlenky které Yoyogames o Game Makeru Studio šířili a dosud šíří jsou pravdivé asi jako reklama na „chutné a zdravé jídlo z výprodeje“. Na soudní žalobu to není, ale fakticky se jako zákazník člověk děsně nachytá, když si to koupí a jednoduše tomu věří.

Přesto jsem u Game Makeru zůstal a Studio Professional si před časem koupil. Přechod byl drastický a efektivita tvorby v GMS je trapným zlomkem mé původní efektivity v GM8. Jak je to možné? V první řadě nekompatibilita na úrovni resources. GMS neumí zpracovat tytéž soubory ani grafické, ani zvukové a neumí pracovat s fonty. Tzn. pokud má člověk nějakou sbírku svých klipartů, spritů, MIDI hudby a podobně, tak má celkem smůlu a čeká ho spousta úmorné práce na konverzích. Druhý hřebík do rakve je nekompatibilita jazyka GML, vlastního skriptovacího jazyka Game Makeru. Spousta funkcí pracuje jinak nebo byly úplně a bez náhrady vyhozeny, takže opět staré odladěné skripty píšete znovu. Třetí brzda je samotné prostředí Game Makeru Studio, které je celkově prasečí. Udržet nápad konzistentní v okamžiku jeho zrození je přetěžká věc a jakékoli zdržení či ztráta koncentrace je smrtící. Nutnost založit a pojmenovat projekt kdykoli chci začít cokoli zkoušet mi zabila už mnoho nápadů hned v zárodku. Je to podobné, jako bych poznámkové lístky zamkl do trezoru s časovým zámkem. Než bych to otevřel, nebylo by co poznamenávat. Že Game Maker Studio neumí česky a když chci napsat na české klávesnici array závorky [ ], používám alt+091(093) je jen malá část potíží.

Přesto jsem se rozhodl pro cestu boje a GMS jsem nejenže nezahodil, ale ještě jsem k němu přikoupil HTML5 exportní modul, který stojí víc, než nakolik mě přišel GMS Pro sám. Této koupě narozdíl od GMS nelituji ani v nejmenším. Osobně se mi HTML jako jazyk nikdy nelíbil a žádná jeho verze nezmění moji averzi, takže je poněkud ironie osudu, že jsem si mezi exportními moduly nabízenými ke GMS vybral právě tento, aniž bych o něm předtím mnoho věděl. Server yoyogames.com oficiálními informacemi o skutečných možnostech nabízených produktů totiž příliš nehýří a nejvíc se člověk dozví asi z help souboru v GMS, který je naštěstí univerzální pro všechny pluginy.

Instalace klíče byla bezproblémová a HTML exporter byl okamžitě funkční bez dalšího nastavování. Pro začátek je dobré zkusit funkčnost na novém projektu s minimálním obsahem. Řekněmě 1 room, 1 objekt s nějakým animovaným sprite. Při přepnutí na HTML5 v rámečku target horní lišty se sice nic zjevného nestane, ale spuštění hry se pak provede rovnou v prohlížeči ( nejlepší z hlediska kompatibility je asi Chrome ). GMS při spouštění hry z IDE nejprve vytvoří vlastní webserver, který poskytne lokální adresu. Tato adresa se pak objeví v řádku prohlížeče, který se automaticky spustí, pokud ještě spuštěný není.  Když už prohlížeč otevřený máte, hra se objeví v nové záložce. Když adresu ručně okopírujeme do případného dalšího prohlížeče bude fungovat taky, dokud běží webserver nebo dokud je hra otevřená v prohlížeči. Takže lze např. zkoušet funkčnost zároveň v Chrome a zároveň ve Firefoxu jako to dělám já. Znamená to, že když vypnete webserver, hra pokračuje dál, protože je v prohlížeči načtená. Webserver má vlastní okno a lze ho nezávisle vypnout.

Trochu složitější problém je ladění. Na pohodlný debugger z GM8 je třeba rovnou zapomenout, aby člověk neměl noční můry ještě léta.
To, co vypisuje webserver se nezdálo být možné ovlivňovat, ale možná jsem s tím jen neuměl. Každopádně je nejlepší si hned na začátku vyrobit prázdný objekt, který bude v události DrawGUI vypisovat vybrané proměnné do levého horního rohu v řádcích pod sebe. Jinak doporučuji základ hry nejprve odladit pro target Windows a v HTML5 ladit jen webovou podobu, pokud je to jen trochu možné.

Samotná konverze starší hry měla dvě fáze. Import z GM8 do GMS byl první. To vezmu trochu zkrátka, protože hra Aiming je jednoduchá a potíže byly jen v neschopnosti GMS vyskočit příkazem break z bloku kódu a jedna proměnná deklarovaná ošklivě jako globalvar ( nedoporučuji vůbec používat ) nebyla vidět v objektech, které ji potřebovaly. Kód jsem tedy vyčistil a pro Windows to jelo asi během dvaceti minut. Pak se ještě trochu proházela automaticky generovaná depth u některých objektů, takže bylo třeba nastavit ručně, co má být zobrazeno nad a co pod pod ostatními objekty.

Druhá část konverze je odladění pro HTML5. Tady je třeba říct, co se vlastně vytvoří jako výsledek. Game Maker exportuje soubor index.html, ikonu a složku html5game ( názvy lze změnit ) kamkoli na lokální disk. Lze to spustit i rovnou odtamtud, ale jen pro testovací účely, protože to vybafne hlášky o nutnosti spouštění z webserveru. Nicméně to po odklikání přesto spustí. Vlastní program je v souboru s koncovkou .js, což znamená javascript ( pozor javascript není totéž co Java ), který se stáhne spolu s webovou stránkou a jeho provedení zajišťuje prohlížeč. To mimo jiné znamená dvě věci: jede to tak rychle, jak je rychlý hráčův počítač nezávisle na tom jak rychlé je internetové připojení a taky to znamená, že celý kód hry je v době hraní přístupný hráči k prohlížení a případně úpravám. Tzn. minimální zabezpečení. Game Maker Studio řeší bezpečnost kódu poměrně standardní cestou, tzv. obfuskováním, kdy se kód proloží nesmyslnými znaky tak, že je pro člověka nesrozumitelný, ale počítač ho zpracovává normálně. Není to úplně dokonalé, ale běžného uživatele to spolehlivě odradí od nabourávání. Stejně je asi lepší nějaké cheaty do toho zabudovat rovnou a hráči pak nemají potřebu to lámat. 🙂

V HTML5 to jelo prakticky ihned bez chybových hlášek. Jen jsem ještě chtěl, aby se velikost herního okna přizpůsobovala velikosti okna prohlížeče a přitom zůstaval zachován poměr stran. GM8 tohle uměl pro windows jedním tlačítkem v preferencích, GMS to neumí automaticky pro žádnou platformu vůbec. Napsal jsem si proto trochu kódu, který v zásadě funguje natolik, nakolik lze zaručit jednotné chování různých prohlížečů webu. Tady je:

Událost Create:

ratio=max(room_width/browser_width,room_height/browser_height); size_x=room_width/ratio; size_y=room_height/ratio; x=browser_width-size_x; y=browser_height-size_y;

Událost BeginStep:

ratio=max(room_width/browser_width,room_height/browser_height); size_x=room_width/ratio; size_y=room_height/ratio; x=browser_width-size_x; y=browser_height-size_y; window_set_rectangle(x/2,y/2,size_x,size_y);

Když mi všechno fungovalo, vyexportoval jsem soubory na lokální disk. Ikonu jsem nahradil svojí vlastní prostě tak, že jsem ji přepsal svým ico souborem se stejným názvem. Pak jsem změnil text zobrazený v hlavičce stránky. To jsem udělal tak, že jsem index.html otevřel v poznámkovém bloku a změnil text uzavřený mezi tag <title> </title>. Nakonec nezbylo než nahrán obsah na nějaký hosting. Já mám už delší dobu placený hosting pro svoje starší a zcela zanedbané stránky ( hanba mi 😳 ) a tak jsem to využil i pro tentokrát. Má to výhodu nepřítomnosti reklam a přiměřené spolehlivosti provozu.

V zásadě lze říct, že se HTML5 exporter pro GMS vyplatí, pokud děláte hry nevyžadující vysoký výkon, nejsou založeny na práci se soubory a obecně nejsou příliš složité a náročné. Teoreticky se takto dají vyrobit celé běžné webové stránky jako solidní grafická prezentace.

Kdyby někdo nerozuměl, jak se hra Aiming hraje: mačká se jen klávesa SPACE. Nejlépe se soutěží na šest ran. Klávesa R vyčistí terč a spustí to znovu.

Míření:
První stisk spustí náměr, druhý stisk se musí shodnout s prvním pohyblivým bodem, třetí stisk se musí shodnout s druhým pohyblivým bodem. Na konci dráhy bílého bodu nastává výstřel. Přesnost shody s pohyblivými body určuje přesnost zásahu. Pokud se nestihne první bod, je lépe druhý nemačkat vůbec – k výstřelu prostě nedojde a nepočítá se pokus.