bullets do things now

components/body.js

@@ -7,8 +7,8 @@ function createBody(body, fixture) {
  return bs.component('body')
  .needs('physical')
  .on('init', function() {
- this.body = this.world.CreateBody(body(this.world))
- this.fixture = this.body.CreateFixture(fixture(this.body, this.world))
+ this.body = this.world.CreateBody(body.call(this, this.world))
+ this.fixture = this.body.CreateFixture(fixture.call(this, this.body, this.world))
  })
  .on('destroy', function() {
  this.body.DestroyFixture(this.fixture)

components/draw-circle.js

@@ -1,19 +1,21 @@
 var bs = require('bindlestiff')
 
 module.exports = function drawCircle(r, c) {
- var r2 = (r = (+r|0) || 15) * 2
  var tau = Math.PI * 2
 
+ this.c = this.c || c
+ this.r = this.r || (+r|0) || 15
+
  return bs.component()
  .needs('attached')
  .needs('body')
  .on('draw', function(ctx) {
- ctx.fillStyle = c
+ ctx.fillStyle = this.c
  ctx.beginPath()
  ctx.arc(
  this.body.m_xf.position.x * 30 - this.game.camera.pos[0]
  , this.body.m_xf.position.y * 30 - this.game.camera.pos[1]
- , r
+ , this.r
  , 0
  , tau
  , true

components/enemy.js

@@ -1,4 +1,5 @@
 var Box2D = require('box2dweb-commonjs').Box2D
+var lighten = require('../lib/color').lighten
 var bs = require('bindlestiff')
 
 var b2CircleShape = Box2D.Collision.Shapes.b2CircleShape
@@ -16,6 +17,33 @@ module.exports = function(
  return bs.define()
  .use(require('../components/attached'))
  .use(require('../components/physical'))
+ .use(require('../components/health')(10))
+ .use(bs.component()
+ .on('init', function() {
+ this.base_r =
+ this.r = size * 15 * (Math.random() * 0.25 + 0.75)
+ this.c = '#EB3E38'
+ this.flinch = 0
+ })
+ .on('tick', function() {
+ this.flinch *= 0.95
+ if (this.flinch)
+ if (this.flinch < 0.0025) {
+ this.flinch = 0
+ this.c = '#EB3E38'
+ this.r = this.base_r
+ } else {
+ this.c = lighten('#EB3E38', (this.flinch * 200)|0)
+ this.r = this.base_r * (1 - this.flinch * 0.4)
+ }
+ })
+ .on('damaged', function() {
+ this.flinch = 1
+ })
+ .on('died', function() {
+ this.flagged = true
+ })
+ )
  .use(require('../components/body')(
  function createBody() {
  var bd = new b2BodyDef
@@ -29,15 +57,16 @@ module.exports = function(
  function createFixture() {
  var fd = new b2FixtureDef
  fd.restitution = 0.5
- fd.shape = new b2CircleShape(0.5 * size)
+ fd.shape = new b2CircleShape(0.5 * this.r / 15)
  return fd
  }
  ))
- .use(require('../components/harmful')(true))
+ .use(require('../components/harmful')(0, 1))
  .use(require('../components/target-player')(speed))
+ .use(require('../components/vulnerable')(1))
  .use(shapes)
 
  function shapes(def) {
- return require('../components/draw-circle')(size * 15, '#EB3E38')(def)
+ return require('../components/draw-circle')()(def)
  }
 }

components/harmful.js

@@ -2,13 +2,15 @@ var bs = require('bindlestiff')
 
 module.exports = harmful
 
-var cache = {}
-function harmful(toPlayer) {
- toPlayer = !!toPlayer
- return cache[toPlayer] = cache[toPlayer] ||
-   bs.component('harmful')
+function harmful(group, damage) {
+ damage = parseInt(damage, 10)
+ group = parseInt(group, 10)
+
+ return bs.component('harmful')
  .needs('body')
  .on('init', function() {
- this.body.m_userData.harmful = toPlayer ? 1 : -1
+ this.body.m_userData = this.body.m_userData || {}
+ this.body.m_userData.harmful_damage = damage
+ this.body.m_userData.harmful_group = group
  })
 }

components/health.js

@@ -0,0 +1,18 @@
+var bs = require('bindlestiff')
+
+module.exports = health
+
+function health(amount) {
+ return bs.component('health')
+ .on('init', function() {
+ this.health = amount
+ this.dead = false
+ })
+ .on('damaged', function(dmg) {
+ this.health -= dmg
+ if (!this.dead && this.health <= 0) {
+ this.dead = true
+ this.trigger('died')
+ }
+ })
+}

components/target-player.js

@@ -14,8 +14,8 @@ function targetPlayer(speed) {
  var cx = this.body.m_xf.position.x
  var cy = this.body.m_xf.position.y
  var a = Math.atan2(ty - cy, tx - cx)
- tempVec.x = Math.cos(a) * speed
- tempVec.y = Math.sin(a) * speed
+ tempVec.x = Math.cos(a) * speed + Math.random() * 0.1 - 0.05
+ tempVec.y = Math.sin(a) * speed + Math.random() * 0.1 - 0.05
  this.body.ApplyImpulse(tempVec, this.body.GetWorldCenter())
  })
 }

components/vulnerable.js

@@ -0,0 +1,24 @@
+var Box2D = require('box2dweb-commonjs').Box2D
+var b2e = require('box2d-events')
+var bs = require('bindlestiff')
+
+module.exports = function vulnerable(group) {
+ group = parseInt(group, 10)
+
+ return bs.component('vulnerable')
+ .needs('physical')
+ .needs('body')
+ .on('init', function() {
+ var self = this
+
+ this.body.m_userData = this.body.m_userData || {}
+ this.body.m_userData.vulnerable_group = group
+ b2e(Box2D, this.world).fixture(
+ this.fixture
+ ).on('begin', function(a, b) {
+ var data = a.m_body.m_userData
+ if (data.harmful_group === group)
+ self.trigger('damaged', data.harmful_damage)
+ })
+ })
+}

entities/player-bullet.js

@@ -23,12 +23,17 @@ module.exports = bs.define()
  var fd = new b2FixtureDef
  fd.restitution = 0.5
  fd.shape = new b2CircleShape(0.5/3)
+ this.r = 5
  return fd
  }
  ))
  .use(require('../components/bounce-burst'))
- .use(require('../components/draw-circle')(5, '#EA6437'))
- .use(require('../components/harmful')(false))
+ .use(bs.component()
+ .on('init', function() {
+ this.c = '#362F34'
+ }))
+ .use(require('../components/draw-circle')(5))
+ .use(require('../components/harmful')(1, 1))
  .use(require('../components/gravity'))
  .use(require('../components/projectile')({
  key: 'shooter'

entities/player.js

@@ -139,7 +139,7 @@ module.exports = bs.define()
  .use(require('../components/gravity'))
 
 module.exports.prototype.fireBullet = function() {
- this.shootTimer = 5
+ this.shootTimer = 8
  var bullet = new Bullet
  var tx = this.game.mouse.x - this.game.width / 2
  var ty = this.game.mouse.y - this.game.height / 2

game.js

@@ -52,9 +52,7 @@ Game.prototype.start = function() {
 var framecounter = fps({ every: 1, decay: 0.5 })
 Game.prototype.tick = function() {
  framecounter.tick()
- // console.log('prestep')
  this.world.Step(this.tickrate, 8, 3)
- // console.log('poststep')
  this.camera.tick()
 
  for (var i = 0; i < this.queue.length; i += 1)
@@ -94,7 +92,9 @@ Game.prototype.draw = function() {
  this.instances[i].trigger('draw', ctx, this)
 
  ctx.fillStyle = '#FFCFBF'
- ctx.fillRect(mousex - 3, mousey - 3, 6, 6)
+ ctx.strokeStyle = '#000'
+ ctx.fillRect(mousex - 5, mousey - 5, 10, 10)
+ ctx.strokeRect(mousex - 5, mousey - 5, 10, 10)
 
  // this.ctx.restore()
  this.camera.draw()

lib/color.js

@@ -0,0 +1,65 @@
+/*
+ Copyright (c) Matthew Mueller, MIT License
+ http:https://component.io/matthewmueller/color
+*/
+
+/**
+ * Lighten the given color
+ * @param {String} color hex value
+ * @param {Number} value
+ * @return {String}
+ */
+
+exports.lighten = function(color, v) {
+ v = (v <= 1) ? v*100 : v;
+ return tint(color, v);
+};
+
+/**
+ * Darken the given color
+ * @param {String} color hex value
+ * @param {Number} value
+ * @return {String}
+ */
+
+exports.darken = function(color, v) {
+ v = (v <= 1) ? v*100 : v;
+ return tint(color, -v);
+};
+
+
+/**
+ * Tint the color by the given value
+ *
+ * Credits: richard maloney 2006
+ *
+ * @param {String} color
+ * @param {Number} v
+ * @return {String}
+ */
+
+function tint(color, v) {
+ color = color.replace(/^#/, '');
+ color = (color.length == 3) ? hex3tohex6(color) : color;
+ var rgb = parseInt(color, 16);
+ var r = Math.abs(((rgb >> 16) & 0xFF)+v); if (r>255) r=r-(r-255);
+ var g = Math.abs(((rgb >> 8) & 0xFF)+v); if (g>255) g=g-(g-255);
+ var b = Math.abs((rgb & 0xFF)+v); if (b>255) b=b-(b-255);
+ r = Number(r < 0 || isNaN(r)) ? 0 : ((r > 255) ? 255 : r).toString(16);
+ if (r.length == 1) r = '0' + r;
+ g = Number(g < 0 || isNaN(g)) ? 0 : ((g > 255) ? 255 : g).toString(16);
+ if (g.length == 1) g = '0' + g;
+ b = Number(b < 0 || isNaN(b)) ? 0 : ((b > 255) ? 255 : b).toString(16);
+ if (b.length == 1) b = '0' + b;
+ return "#" + r + g + b;
+}
+
+/**
+ * Hex3 to Hex6
+ */
+
+function hex3tohex6(h) {
+ return h[0] + h[0]
+ + h[1] + h[1]
+ + h[2] + h[2];
+}

lib/spawner.js

@@ -3,7 +3,7 @@ module.exports = Spawner
 function Spawner(game) {
  if (!(this instanceof Spawner)) return new Spawner(game)
 
- var frequency = 3
+ var frequency = 5
  var speed = 0.25
 
  var EnemyGenerator = require('../components/enemy')