diff --git a/platformer.js b/platformer.js index 9235834..f965b3f 100644 --- a/platformer.js +++ b/platformer.js @@ -1,54 +1,36 @@ -// heavily based on the Quintus platformer example. +// heavily based/copied from/on the quintus platformer example. // vim:tw=120: window.addEventListener("load",function() { -// Set up an instance of the Quintus engine and include -// the Sprites, Scenes, Input and 2D module. The 2D module -// includes the `TileLayer` class as well as the `2d` componet. var Q = window.Q = Quintus({ development: true }) .include("Sprites, Scenes, Input, 2D, Anim, Touch, UI") - // Maximize this game to whatever the size of the browser is .setup({ maximize: true }) - // And turn on default input controls and touch input (for UI) .controls().touch() -// ## Player Sprite -// The very basic player sprite, this is just a normal sprite -// using the player sprite sheet with default controls added to it. Q.Sprite.extend("Player",{ - // the init constructor is called on creation init: function(p) { - // You can call the parent's constructor with this._super(..) this._super(p, { - sheet: "astronaut", // Setting a sprite sheet sets sprite width and height - x: 320, // You can also set additional properties that can - y: 90 // be overridden on object creation + sheet: "astronaut", + x: 320, + y: 90 }); - // Add in pre-made components to get up and running quickly - // The `2d` component adds in default 2d collision detection - // and kinetics (velocity, gravity) - // The `platformerControls` makes the player controllable by the - // default input actions (left, right to move, up or action to jump) - // It also checks to make sure the player is on a horizontal surface before - // letting them jump. this.add('2d, platformerControls'); - - // Write event handlers to respond hook into behaviors. - // hit.sprite is called everytime the player collides with a sprite this.on("hit.sprite",function(collision) { - - // Check the collision, if it's the rocket, you win! if(collision.obj.isA("Rocket")) { - var rocket = collision.obj; + // the rocket flies away + var rocket = collision.obj; rocket.add("tween"); rocket.animate({ x: 100, y: -500, angle: 360 }); + // the player disappears this.destroy(); + + // and the invite is displayed $("#einladung").show("slow"); } }); @@ -64,18 +46,11 @@ Q.Sprite.extend("Rocket", { } }); -// ## Enemy Sprite -// Create the Enemy class to add in some baddies Q.Sprite.extend("Neingeist",{ init: function(p) { this._super(p, { sheet: 'neingeist', vx: 100 }); - - // Enemies use the Bounce AI to change direction - // whenver they run into something. this.add('2d, aiBounce'); - // Listen for a sprite collision, if it's the player, - // end the game unless the enemy is hit on top this.on("bump.left,bump.right,bump.bottom",function(collision) { if(collision.obj.isA("Player")) { Q.stageScene("endGame", 1); @@ -83,8 +58,6 @@ Q.Sprite.extend("Neingeist",{ } }); - // If the enemy gets hit on the top, destroy it - // and give the user a "hop" this.on("bump.top",function(collision) { if(collision.obj.isA("Player")) { this.destroy(); @@ -95,18 +68,11 @@ Q.Sprite.extend("Neingeist",{ }); // FIXME do not copy -// ## Enemy Sprite -// Create the Enemy class to add in some baddies Q.Sprite.extend("Starbug",{ init: function(p) { this._super(p, { sheet: 'starbug', vx: 100 }); - - // Enemies use the Bounce AI to change direction - // whenver they run into something. this.add('2d, aiBounce'); - // Listen for a sprite collision, if it's the player, - // end the game unless the enemy is hit on top this.on("bump.left,bump.right,bump.bottom",function(collision) { if(collision.obj.isA("Player")) { Q.stageScene("endGame", 1); @@ -114,8 +80,6 @@ Q.Sprite.extend("Starbug",{ } }); - // If the enemy gets hit on the top, destroy it - // and give the user a "hop" this.on("bump.top",function(collision) { if(collision.obj.isA("Player")) { this.destroy(); @@ -126,18 +90,12 @@ Q.Sprite.extend("Starbug",{ }); // FIXME do not copy -// ## Enemy Sprite -// Create the Enemy class to add in some baddies Q.Sprite.extend("Martin",{ init: function(p) { this._super(p, { sheet: 'martin', vx: 100 }); - // Enemies use the Bounce AI to change direction - // whenver they run into something. this.add('2d, aiBounce'); - // Listen for a sprite collision, if it's the player, - // end the game unless the enemy is hit on top this.on("bump.left,bump.right,bump.bottom",function(collision) { if(collision.obj.isA("Player")) { Q.stageScene("endGame", 1); @@ -145,8 +103,6 @@ Q.Sprite.extend("Martin",{ } }); - // If the enemy gets hit on the top, destroy it - // and give the user a "hop" this.on("bump.top",function(collision) { if(collision.obj.isA("Player")) { this.destroy(); @@ -156,14 +112,10 @@ Q.Sprite.extend("Martin",{ } }); -// ## Level1 scene -// Create a new scene called level 1 -Q.scene("level1",function(stage) { +Q.scene("level1", function(stage) { - // Add in a repeater for a little parallax action stage.insert(new Q.Repeater({ asset: "background.png", speedX: 0.5, speedY: 0.5 })); - // Add in a tile layer, and make it the collision layer stage.collisionLayer(new Q.TileLayer({ tileW: 24, tileH: 24, @@ -171,15 +123,14 @@ Q.scene("level1",function(stage) { sheet: 'tiles' })); - // Create the player and add them to the stage + // player var player = stage.insert(new Q.Player()); - // Give the stage a moveable viewport and tell it - // to follow the player. + // viewport stage.add("viewport").follow(player); stage.viewport.scale = 2; - // Add in a couple of enemies + // enemies stage.insert(new Q.Starbug({ x: 600, y: 0 })); stage.insert(new Q.Neingeist({ x: 650, y: 0 })); stage.insert(new Q.Martin({ x: 550, y: 0 })); @@ -187,52 +138,27 @@ Q.scene("level1",function(stage) { stage.insert(new Q.Rocket({ x: 146, y: 32 })); }); -// To display a game over / game won popup box, -// create a endGame scene Q.scene('endGame',function(stage) { var container = stage.insert(new Q.UI.Container({ x: Q.width/2, y: Q.height/2, fill: "rgba(0,0,0,0.5)" })); - var button = container.insert(new Q.UI.Button({ x: 0, y: 0, fill: "#CCCCCC", label: "NOCHMAL" })) - // When the button is clicked, clear all the stages - // and restart the game. + button.on("click",function() { Q.clearStages(); Q.stageScene('level1'); }); - // Expand the container to visibily fit it's contents - // (with a padding) container.fit(16); }); -// ## Asset Loading and Game Launch -// Q.load can be called at any time to load additional assets -// assets that are already loaded will be skipped -// The callback will be triggered when everything is loaded Q.load("sprites.png, sprites.json, level.json, tiles.png, background.png", function() { - // Sprites sheets can be created manually Q.sheet("tiles","tiles.png", { tilew: 24, tileh: 24 }); - - // Or from a .json asset that defines sprite locations Q.compileSheets("sprites.png","sprites.json"); - // Finally, call stageScene to run the game Q.stageScene("level1"); }); -// ## Possible Experimentations: -// -// The are lots of things to try out here. -// -// 1. Modify level.json to change the level around and add in some more enemies. -// 2. Add in a second level by creating a level2.json and a level2 scene that gets -// loaded after level 1 is complete. -// 3. Add in a title screen -// 4. Add in a hud and points for jumping on enemies. -// 5. Add in a `Repeater` behind the TileLayer to create a paralax scrolling effect. - });