README.textile @@ -9,12 +9,15 @@ </head> <body> <div id="bd"> - <div id="stage-wrapper"><div id="stage"></div></div> + <div id="stage-wrapper"><div id="stage"><noscript><span class="js-warning">Javascript is required.</span></noscript></div></div> <div id="info"> <h1>Shapes</h1> <p>Shoot the angry rotating shapes before they run into you! Three exotic space themed backgrounds!</p> - <p><strong>Controls:</strong> W,A,S,D to move, Mouse to aim, Left Mouse button to fire.</p> - <p class="warning">This isn't meant to be a complete game. It's a prototype and buggy. That said, it <em>should</em> be playable in most browsers.</p> + <p>You start with 3 lives and 3 bombs. Bombs will destroy all enemy shapes on the screen. Use them wisely!</p> + <p>Each enemy shape has a different behavior. Learn to use this to your advantage.</p> + <p><strong>Controls:</strong> W,A,S,D to move, Mouse to aim, Left Mouse button to fire. Space detonates a bomb.</p> + <p class="warning"><em>This isn't meant to be a complete game. It's a prototype and buggy. That said, it <em>should</em> be playable in most decent browsers.</em></p> + <p><a href="mailto:">Questions, comments or flames?</a></p> </div> </div> <script type="text/javascript" src="js/yahoo-dom-event.js"></script> htdocs/index.html @@ -18,7 +18,6 @@ this.spritev.y = this.def.spritey; this.fire('init', null); } - //this.updateSprite(); }; var proto = G.Actor.prototype; proto.getPoints = function() { @@ -31,11 +30,14 @@ } }; proto.updateSprite = function() { - // TODO: Improve the peformance of this function; it's taking ~30% of execution time so sayeth Firebug + // TODO: Is there any way to improve the performance of this function? var s = this.sprite.style; - s.backgroundPosition = -this.spritev.x + 'px ' + -this.spritev.y + 'px'; - s.left = this.position.x + 'px'; - s.top = this.position.y + 'px'; + var pos_x = parseInt(this.position.x) + 'px'; + var pos_y = parseInt(this.position.y) + 'px'; + var pos_bg = -parseInt(this.spritev.x) + 'px ' + -parseInt(this.spritev.y) + 'px'; + if (s.backgroundPosition !== pos_bg) { s.backgroundPosition = pos_bg; } + if (s.left !== pos_x) { s.left = pos_x; } + if (s.top !== pos_y) {s.top = pos_y; } }; proto.getBounds = function(rect) { // TODO: Magic numbers are bad htdocs/js/actor.js @@ -64,7 +64,7 @@ Game.ActorDefs.EnemyPinky = { }, think:function(me, world) { var p = world.hero.position; - if (world.hero !== null && me.position.within(125, p)) { + if (typeof(world.hero) !== 'undefined' && me.position.within(125, p)) { me.speed = 8; me.direction = me.position.chase(p); } else { @@ -97,7 +97,7 @@ Game.ActorDefs.EnemyElDiablo = { }, think:function(me, world) { var p = world.hero.position; - if (world.hero !== null && me.position.within(75, p)) { + if (typeof(world.hero) !== 'undefined' && me.position.within(75, p)) { me.speed = 14; me.direction = me.position.chase(p); } else { htdocs/js/actor_defs.js @@ -9,7 +9,6 @@ this.score = 0; this.updateHUD(); this.initInput(); - //this.crosshair = null; this.hud.displayText('press space to begin', null, 100, 640, null); this.accept_input = false; this.state = 'ready'; @@ -57,10 +56,18 @@ me.world.killActor(hid); me.lives--; me.updateHUD(); - me.hud.displayText('you died', null, 30, 640, null, '#f00'); - me.hud.displayText('reload the page to try again', null, 150, 640, null); - //me.world.clean(); - //me.world.setup(); + if (me.lives >= 1) { + var reset = function() { + me.world.killAll(); + me.world.initHero(); + me.world.spawning = true; + me.accept_input = true; + }; + window.setTimeout(reset, 5000); + } else { + me.hud.displayText('game over', null, 30, 640, null, '#f00'); + me.hud.displayText('reload the page to play again', null, 150, 640, null); + } return; } me.awardPoints(actor1.getPoints() + actor2.getPoints()); htdocs/js/engine.js @@ -107,10 +107,10 @@ }; proto.initSpawns = function() { // TODO: Don't hardocode spawn points - this.spawns[0] = new Game.Vector(0, 0); - this.spawns[1] = new Game.Vector(this.width - 32, 0); - this.spawns[2] = new Game.Vector(0, this.height - 32); - this.spawns[3] = new Game.Vector(this.width - 32, this.height - 32); + this.spawns[0] = new G.Vector(0, 0); + this.spawns[1] = new G.Vector(this.width - 32, 0); + this.spawns[2] = new G.Vector(0, this.height - 32); + this.spawns[3] = new G.Vector(this.width - 32, this.height - 32); }; proto.spawn = function() { if (!this.spawning) { return false; } @@ -118,11 +118,11 @@ for (var x = 0; x < len; x++) { var def = null; switch (Game.util.randomRange(1, 5)) { - case 1: def = Game.ActorDefs.EnemyPinky; break; - case 2: def = Game.ActorDefs.EnemyTracker; break; - case 3: def = Game.ActorDefs.EnemyFlower; break; - case 4: def = Game.ActorDefs.EnemyCoward; break; - case 5: def = Game.ActorDefs.EnemyGhost; break; + case 1: def = G.ActorDefs.EnemyPinky; break; + case 2: def = G.ActorDefs.EnemyTracker; break; + case 3: def = G.ActorDefs.EnemyFlower; break; + case 4: def = G.ActorDefs.EnemyCoward; break; + case 5: def = G.ActorDefs.EnemyGhost; break; } var spawn = this.makeActor(def); spawn.position = this.spawns[x].copy(); htdocs/js/world.js @@ -21,7 +21,10 @@ body { margin-right:4em; } #stage { - + cursor:crosshair; + background:#000; + width:640px; + height:480px; } #stage-wrapper { float:left; @@ -31,5 +34,14 @@ body { width:300px; margin-left:20px; } +.js-warning { + display:block; + margin:0 auto; + padding:1em; + color:red; + text-align:center; + font-weight:bold; + font-size:2em; +} htdocs/style.css README eb932c618187e0baf447f21514e15e8c4b130f8a geoffb gmblair@gmail.com http://github.com/geoffb/shapes/commit/dc1131d0f7aa71a9c5c8d3c21314d38f37512cb9 dc1131d0f7aa71a9c5c8d3c21314d38f37512cb9

2009-03-04T01:34:20-08:00

Added bombs; added level resets after losing a life; other cleanup and things I can't remember 82b8db4334708206916b065e622f58e3b351cde4 geoffb gmblair@gmail.com