Book Image

PhoneGap By Example

Book Image

PhoneGap By Example

Overview of this book

Table of Contents (17 chapters)
PhoneGap By Example
Credits
About the Author
About the Reviewers
www.PacktPub.com
Preface
Index

Prepare and create the game


When we executed the Cordova command to generate the application, it already created some HTML, CSS, and JavaScript for us. Let's organize it a little. I would like to see such a structure of the www folder:

.
├── assets
│    └── sprites
│      └── spheres.png
├── css
│    └── index.css
├── index.html
└── js
    ├── game.js
    ├── index.js
    └── phaser.js

In this structure, we should have the following elements:

  • spheres.png: This is our file with different bubble colors

  • index.html: This is the main HTML file where we should place the canvas

  • index.css: This is our main stylesheet file

  • phaser.js: This is the Phaser framework itself

  • game.js: This is the file with the game login and all Phaser-related code

Let's modify the index.html file so that the body content looks like this:

<div id="phaser"></div>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/phaser.js"></script>
<script...