add Water

BattleCity.html

@@ -98,6 +98,7 @@
   <script type="text/javascript" src="src/Player.js"></script>
   <script type="text/javascript" src="src/StageStatisticsPoints.js"></script>
   <script type="text/javascript" src="src/Trees.js"></script>
+  <script type="text/javascript" src="src/Water.js"></script>
 
   <script type="text/javascript" src="lib/Stats.js"></script>
   <script type="text/javascript" src="src/FPSCounter.js"></script>

SpecRunner.html

@@ -150,6 +150,7 @@
   <script type="text/javascript" src="src/Delay.js"></script>
   <script type="text/javascript" src="src/MoveFn.js"></script>
   <script type="text/javascript" src="src/Trees.js"></script>
+  <script type="text/javascript" src="src/Water.js"></script>
 
   <script type="text/javascript">
     (function() {

spec/BuilderSpec.js

@@ -40,6 +40,7 @@ describe("Builder", function () {
       spyOn(builder, 'buildSteelWallTop');
       spyOn(builder, 'buildSteelWallFull');
 
+      spyOn(builder, 'buildWater');
       spyOn(builder, 'buildTrees');
 
       spyOn(builder, 'clear');
@@ -84,6 +85,10 @@ describe("Builder", function () {
       expect(builder.buildSteelWallFull).toHaveBeenCalledWith(cursor.getPosition());
       builder.buildSteelWallFull.reset();
 
+      builder.build(cursor);
+      expect(builder.buildWater).toHaveBeenCalledWith(cursor.getPosition());
+      builder.buildWater.reset();
+
       builder.build(cursor);
       expect(builder.buildTrees).toHaveBeenCalledWith(cursor.getPosition());
       builder.buildTrees.reset();
@@ -202,6 +207,13 @@ describe("Builder", function () {
       expect(parts[3].getPosition()).toEqual(new Point(6, 7))
     });
 
+    it("#buildWater", function () {
+      var parts = builder.buildWater(new Point(2, 3));
+      var water = parts[0];
+      expect(water instanceof Water).toBeTruthy();
+      expect(water.getPosition()).toEqual(new Point(2, 3))
+    });
+
     it("#buildTrees", function () {
       var parts = builder.buildTrees(new Point(2, 3));
       var trees = parts[0];

src/Animation.js

@@ -5,10 +5,15 @@ function Animation(frames, frameDuration, loop) {
   this._frame = 0;
   this._timer = 0;
   this._completed = false;
+  this._active = true;
 }
 
+Animation.prototype.setActive = function (active) {
+  this._active = active;
+};
+
 Animation.prototype.update = function () {
-  if (this._completed) {
+  if (!this._active || this._completed) {
     return;
   }
 

src/Builder.js

@@ -15,6 +15,7 @@ function Builder(eventManager) {
     Builder.Structure.STEEL_WALL_TOP,
     Builder.Structure.STEEL_WALL_FULL,
 
+    Builder.Structure.WATER,
     Builder.Structure.TREES,
 
     Builder.Structure.CLEAR,
@@ -39,6 +40,7 @@ Builder.Structure.STEEL_WALL_LEFT = 'Builder.Structure.STEEL_WALL_LEFT';
 Builder.Structure.STEEL_WALL_TOP = 'Builder.Structure.STEEL_WALL_TOP';
 Builder.Structure.STEEL_WALL_FULL = 'Builder.Structure.STEEL_WALL_FULL';
 
+Builder.Structure.WATER = 'Builder.Structure.WATER';
 Builder.Structure.TREES = 'Builder.Structure.TREES';
 
 Builder.Structure.CLEAR = 'Builder.Structure.CLEAR';
@@ -95,6 +97,9 @@ Builder.prototype.build = function (cursor) {
   else if (this._structure == Builder.Structure.STEEL_WALL_FULL) {
     structure = this.buildSteelWallFull(cursor.getPosition());
   }
+  else if (this._structure == Builder.Structure.WATER) {
+    structure = this.buildWater(cursor.getPosition());
+  }
   else if (this._structure == Builder.Structure.TREES) {
     structure = this.buildTrees(cursor.getPosition());
   }
@@ -149,6 +154,15 @@ Builder.prototype.buildSteelWallFull = function (position) {
   return this._buildWallFull(position, new SteelWallFactory(this._eventManager));
 };
 
+Builder.prototype.buildWater = function (position) {
+  var parts = [];
+  var water = new Water(this._eventManager);
+  water.setPosition(position);
+  water.stopAnimation();
+  parts.push(water);
+  return parts;
+};
+
 Builder.prototype.buildTrees = function (position) {
   var parts = [];
   var trees = new Trees(this._eventManager);

src/ImageManager.js

@@ -149,6 +149,8 @@ var ImageManager = (function() {
     wall_brick: null,
     wall_steel: null,
     trees: null,
+    water_1: null,
+    water_2: null,
 
     base: null,
     base_destroyed: null,

src/Water.js

@@ -0,0 +1,26 @@
+function Water(eventManager) {
+  Sprite.call(this, eventManager);
+  this._animation = new Animation([1,2], 30, true);
+}
+
+Water.subclass(Sprite);
+
+Water.prototype.getClassName = function () {
+  return 'Water';
+};
+
+Water.prototype.stopAnimation = function () {
+  this._animation.setActive(false);
+};
+
+Water.prototype.updateHook = function () {
+  this._animation.update();
+};
+
+Water.prototype.getImage = function () {
+  return 'water_' + this._animation.getFrame();
+};
+
+Water.prototype.draw = function (ctx) {
+  ctx.drawImage(ImageManager.getImage(this.getImage()), this._x, this._y);
+};