- Inleiding
- Teamleden
- Korte beschrijving
- Phaser
- Webpack
- PHP & databases
- De code
- Preload
- Menu
- Info
- Leaderboard
- Play
- Shop
- Dropbox link
- Sven Knockaert
- Bernd Bousard
Cityflip is een endless arcade game, waarbij het de bedoeling is zoveel mogelijk afstand af te leggen.
De speler start met een ventje (de speler zelf), die constant vooruit loopt. De belangrijkste feature van Cityflip is het verwisselen van kant om enemies te ontwijken, dit door middel van de pijltjestoetsen. Vandaar ook de naam.
Een bijkomende doelstelling is zoveel mogelijk munten te verzamelen terwijl je loopt, waarmee je later zaken kan kopen in de shop.
Deze game is gemaakt in Phaser.js (een Javascript library om vlotter browser based games te schrijven). Voor documentatie en meer info kan je op de website van Phaser terrecht.
We gebruiken Webpack om vlot onze bestanden te kunnen indelen. Verder gebruiken we Babel om onze JS te transpilen naar meer compatiebele JS. Deze gebruiken we via de Terminal.
Onze database staat online. Je kan eventueel een sql dump downloaden om de structuur daarvan te raadplegen. Er worden AJAX calls gebruikt om het spel vlot te doen werken, dit met behulp van JSON.
- Clone/download dit project naar je locale computer.
- open terminal en typ het volgende commando
git pull https://github.com/berndbousard/cp3-game/
- navigeer naar deze map via teminal
- gebruik hiervoor het volgende commando
cd padNaarMap
- installeer alle dependencies die nodig zijn om het project te runnen
- gebruik hiervoor het volgende commando
npm install
- laat webpack je project in de gaten houden en transpilen wanneer er een codewijziging is gebeurd
- gebruik hiervoor het volgende commando
webpack -w
- importeer de database in je localhost om scores te kunnen wegschrijven/ophalen. Deze database heet 'cityflip_scores' te noemen met als login 'cityflipuser' en 'cityflippass'
De code wordt opgesplitst in states, met daarin verwijzing naar klasses:
Er wordt een progressbar getoond terwijl alle assets worden ingeladen. Eens deze allen zijn ingeladen, gaan we over tot de menu state.
De menu state is de basis interface van de gebruiker. Van hieruit kan je een scorebord bekijken, naar de shop gaan, meer info krijgen over de controls, en vanzelfsprekend ook gewoon het spel spelen.
Info is een korte state, met een korte uitleg van de doelstelling, zodat de gebruiker een idee heeft waar hij aan begint (zonder al te veel weg te geven). Er is verder info over de controls.
Hier kan je de top 5 beste scores zien.
Veruit de belangrijkste state, de play state brengt de speler in het spel. Een algemene counter houdt je vooruitgang bij. Verder worden je munten, bullets, meteorieten en kills bijgehouden. Deze data worden allemaal opgeslaan in de "Data" klasse, zodat je later deze variabelen nog kan aanspreken in andere states (voornamelijk de shop state).
Je kan in de shop bullets, meteorieten en ook een rainbow suit kopen.
Voor eventuele PSD bestanden van de assets kan je terrecht op onze shared dropbox folder omdat we dit net iets flexibeler vinden om grote assets te syncen. https://www.dropbox.com/sh/ytmj8p38x312811/AAAmECA1IaeSjoJFOXry_N7ja?dl=0