rework comments
This commit is contained in:
parent
b44efcb65b
commit
5ae5c8fbb6
1 changed files with 14 additions and 88 deletions
102
platformer.js
102
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.
|
||||
|
||||
});
|
||||
|
|
Reference in a new issue