O'Reilly logo

Professional HTML5 Mobile Game Development by Pascal Rettig

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Creating the Editor

The editor consists of a layer of editing tools that sits on top of the existing platformer code. By making use of as much of the existing platformer code as possible, the editor needs to add only the ability to move the view around and changes tiles.

Modifying the Platform Game

The changes needed to get the editor code into the existing platform.js file are minimal. Open up the index.html file in the public/ directory and add the soon-to-be-created quintus_editor.js file, as shown in Listing 19-3.

Listing 19-3: Modified index.html file

<!DOCTYPE HTML>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=0, 
minimum-scale=1.0, maximum-scale=1.0"/>
    <title>Platformer</title>
    <script src='js/jquery.min.js'></script>
    <script src='js/underscore.js'></script>
    <script src='js/quintus.js'></script>
    <script src='js/quintus_input.js'></script>
    <script src='js/quintus_sprites.js'></script>
    <script src='js/quintus_scenes.js'></script>
    <script src='js/quintus_anim.js'></script>
    <script src='js/quintus_platformer.js'></script>
    <script src='js/quintus_editor.js'></script>
    <script src='platform.js'></script>
    <style>
      * { padding:0px; margin:0px; }
    </style>
  </head>
  <body>
  </body>
</html>

Next open up the platform.js file in the same directory; at the top of the file, add the Editor module and remove the controls call. (Controls will be enabled later by the editor.)

$(function() {
  var Q = window.Q 
        = Quintus()
          .include(' ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required