-
Tom Klamer & Meindert Romkes
S1027729 & S1059232 ICTSE2c
WEEK 6 JAVASCRIPT MVC FRAMEWORKS
-
1
Inhoud Toelichting op framework
.......................................................................................................................
2
Architectuur van het framework
.............................................................................................................
2
Beschrijving game
....................................................................................................................................
2
Mogelijk aanpak
......................................................................................................................................
2
Wat kan nog meer met het framework?
.................................................................................................
3
Onze
mening............................................................................................................................................
3
Bronnen
...................................................................................................................................................
4
-
2
Toelichting op framework We hebben gebruik gemaakt van het
AngularJs en Phaser framework.
Wij hebben gekozen om twee frameworks te gebruiken, n framework
voor de panelen (game,
instructies, verslag en highscores) en n framework de game.
We hebben gekozen voor het phaser framework omdat dit framework
heel geschikt is voor het
maken van games in een canvas. Op YouTube hebben we goede
tutorials gevonden en er zijn heel
veel voorbeelden op de website van phaser.
AngularJs hebben we gekozen omdat dit een populaire MV*
framework is voor de clint kant. Ook
was hier een hele goede tutorial voor te vinden, die wij
gebruikt hebben voor het maken van de
panelen.
Architectuur van het framework Angular.js is een MVW framework.
MVW staat voor Model-View-Whatever. Vroeger was angularJs
dichterbij een MVC model, maar na verloop van tijd en dankzij
vele verbeteringen, zit het framework
nu dichterbij een MVVM model. Je kan zelf er voor kiezen hoe je
het opbouwt, dus hebben ze gezegd
dat het een MVW framework is. Angular is heel flexibel en is
heel geschikt voor business logica en
presentatie.
Phaser is een framework voor het ontwikkelen van games. Phaser
heeft ook paar belangrijke functies
die op bepaalde momenten in de game aangeroepen worden en die
allemaal soorten code zouden
moeten omvatten.
Preload: wordt gebruikt om je assets en muziek in te laden.
Create: Deze functie wordt uitgevoerd wanneer de preload klaar
is. Hier kun je sprites creren.
Update: deze functie wordt elke frame aangeroepen, dat is
meestal rond de 60 keer per seconde. In
de update staan meestal dingen zoals collisie en het
bewegen.
Beschrijving game We gaan een soort van roadrunner waarbij je
allemaal objecten moet ontwijken en vijanden moet
doden. De bedoeling is om zoveel mogelijk punten te verzamelen.
De punten kunnen verdiend
worden met het zo lang mogelijk overleven. Na een keer geraakt
te zijn door een obstakel heb je het
spel verloren.
Mogelijk aanpak We krijgen vier panelen namelijk: game,
instructies, verslag en highscores. Dit gaan we maken
doormiddel van het Angular framework.
-
3
De game gaan we maken met het Phaser framework en in de preload
gaan we alle plaatjes inladen,
zoals het voorbeeld.
Figuur 1, voorbeeld plaatjes inladen
In de create gaan we alles sprites en animaties creren en in de
update komen onze functies om te
bewegen.
Wat kan nog meer met het framework? In de voorbeelden te zien
van Angular wordt Angular vaak gebruikt voor het maken van
webshops.
En als te lezen op de website van Angular is dit framework heel
flexibel.
Phaser daarentegen is minder flexibel en is alleen geschikt voor
het maken van games.
Onze mening Ons lijken deze twee frameworks samen geschikt zijn
om een game te maken, al gaan we phaser
gebruiken voor het canvas gedeelte en gaat Angular alleen
gebruikt worden voor het gedeelte van de
panelen.
-
4
Bronnen (2015, Maart 24). Opgehaald van Youtube:
https://www.youtube.com/watch?v=6rQROhVeIQE
(2015, Maart 28). Opgehaald van builtwith.angular:
https://builtwith.angularjs.org/
audio. (2015, Maart 27). Opgehaald van phaser:
http://phaser.io/examples/v2/audio/restart-sound
courses/shaping-up-with-angular-js. (2015, Maart 25). Opgehaald
van campus.codeschool:
http://campus.codeschool.com/courses/shaping-up-with-angular-js/
games. (2015, Maart 26). Opgehaald van phaser:
http://phaser.io/examples/v2/games/invaders
Guntis. (2015, 25 Maart). Opgehaald van gamedevacademy:
http://www.gamedevacademy.org/make-a-quick-phaser-compatible-game-using-
mightyeditor/
Home. (2015, Maart 24). Opgehaald van AngularJs:
https://angularjs.org/
posts. (2015, Maart 26). Opgehaald van googleplus:
https://plus.google.com/+AngularJS/posts/aZNVhj355G2
Procter, A. (2015, Maart 25). album. Opgehaald van vimeo:
https://vimeo.com/album/3156158
maukstelis, G. (2015, 24 Maart). Opgehaald van Youtube:
https://www.youtube.com/watch?v=gzGHMRx3yz0
