Factor out beater

scripts/game.js

@@ -175,37 +175,17 @@ var SplashScreen = new Scene();
   var ctx = Game.context;
   var x = Game.canvas.width / 2;
   var y = Game.canvas.height / 2;
-  var position = {x: x, y: y};
-  var RADIUS = 8;
-  var RIPPLE_SIZE = 10;
-  var RIPPLE_SPEED = 10;
-
-  var rippleCounter = 0;
-
-  SplashScreen.color = function(p) {
-    return color(255, 255, 255, p);
-  };
+  var beater = new Beater();
+  beater.init(x, y, 'white');
 
   SplashScreen.update = function(dt) {
-    rippleCounter += RIPPLE_SPEED * dt;
-    if(rippleCounter > RIPPLE_SIZE) {
-      rippleCounter = 0;
-    }
+    beater.update(dt);
   };
 
   SplashScreen.draw = function() {
     ctx.fillStyle = 'black';
     ctx.fillRect(0, 0, Game.canvas.width, Game.canvas.height);
-
-    ctx.fillStyle = 'white';
-    drawCircle(position, RADIUS, 3, this.color(1));
-    drawCircle(position, 2, 3, this.color(1));
-
-    // ripples
-    var p = lerp(1, 0, ease(rippleCounter/RIPPLE_SIZE));
-    drawCircle(position, RADIUS+7+rippleCounter, 1, this.color(p));
-    drawCircle(position, RADIUS+4+rippleCounter, 1, this.color(p*0.8));
-    drawCircle(position, RADIUS+1+rippleCounter, 1, this.color(p*0.5));
+    beater.draw();
   };
 })();
 

scripts/games/safari.js

@@ -247,41 +247,29 @@ function SoundSafari(beatInfo) {
 
     function Target(beat) {
       this.beat = beat;
-      this.alpha = 0;
       this.spectrum = [];
+      this.alpha = 0;
       if(points < 4) {
         this.alpha = ease(1-points/4);
       }
-      this.rippleCounter = 0;
+      this.init(0, 0, color(0, 255, 0, this.alpha));
       this.reset();
     }
 
+    Target.prototype = new Beater();
+
     Target.prototype.reset = function() {
       this.y = -20;
       this.x = Math.random()*LEVEL_SIZE;
     };
 
-    Target.prototype.color = function(p) {
-      return color(0, 255, 0, p*this.alpha);
-    };
-
     Target.prototype.draw = function() {
-      var adjPosition = translatePoints(this);
-      drawCircle(adjPosition, RADIUS, 3, this.color(1));
-      drawCircle(adjPosition, 2, 3, this.color(1));
-
-      // ripples
-      var p = lerp(1, 0, ease(this.rippleCounter/RIPPLE_SIZE));
-      drawCircle(adjPosition, RADIUS+7+this.rippleCounter, 1, this.color(p));
-      drawCircle(adjPosition, RADIUS+4+this.rippleCounter, 1, this.color(p*0.8));
-      drawCircle(adjPosition, RADIUS+1+this.rippleCounter, 1, this.color(p*0.5));
+      this.position = translatePoints(this);
+      Beater.prototype.draw.call(this);
     };
 
     Target.prototype.onUpdate = function(dt) {
-      this.rippleCounter += RIPPLE_SPEED * dt;
-      if(this.rippleCounter > RIPPLE_SIZE) {
-        this.rippleCounter = 0;
-      }
+      this.update(dt);
 
       if(colliding(player, this)) {
         state.point();

scripts/util.js

@@ -222,3 +222,42 @@ DeferredTween.prototype.update = function(dt) {
  function tweenFrom(start) {
   return new DeferredTween(start);
 };
+
+// Entities
+function Beater() {};
+
+(function() {
+  var RADIUS = 8;
+  var RIPPLE_SIZE = 10;
+  var RIPPLE_SPEED = 10;
+
+  Beater.prototype.init = function(x, y, color) {
+    this.baseColor = color;
+    this.rippleCounter = 0;
+    this.position = {x: x, y: y};
+  };
+
+  Beater.prototype.update = function(dt) {
+    this.rippleCounter += RIPPLE_SPEED * dt;
+    if(this.rippleCounter > RIPPLE_SIZE) {
+      this.rippleCounter = 0;
+    }
+  };
+
+  Beater.prototype.draw = function() {
+    var ctx = Game.context;
+    ctx.fillStyle = this.baseColor;
+    drawCircle(this.position, RADIUS, 3, this.baseColor);
+    drawCircle(this.position, 2, 3, this.baseColor);
+
+    // ripples
+    var p = lerp(1, 0, ease(this.rippleCounter/RIPPLE_SIZE));
+    ctx.globalAlpha = p;
+    drawCircle(this.position, RADIUS+7+this.rippleCounter, 1, this.baseColor);
+    ctx.globalAlpha = p*0.8;
+    drawCircle(this.position, RADIUS+4+this.rippleCounter, 1, this.baseColor);
+    ctx.globalAlpha = p*0.5;
+    drawCircle(this.position, RADIUS+1+this.rippleCounter, 1, this.baseColor);
+    ctx.globalAlpha = 1;
+  };
+})();