score works now, -50 for hitting a roid, +100 for shooting it

control/config.html

@@ -26,7 +26,14 @@
       <div class="viewport">
         <div class="flipsnap"></div>
       </div>
-      <button class="continue" onclick="window.location.href = '/control';"> Play </button>
+      <button class="continue" data-next="wizard-04" onclick="continueWizard(event)"> Continue </button>
+    </div>
+
+    <div id="wizard-04" style="display:none;">
+      <button class="back" data-next="wizard-03" onclick="continueWizard(event)"> Back </button>
+      <div class="ship-select"> Input your initials </div>
+      <input class="initials" placeholder="initials" type="text"/>
+      <button class="continue" onclick="confirmInitials(); window.location.href = '/control';"> Play </button>
     </div>
   </body>
 </html>

control/config.js

@@ -106,6 +106,10 @@ setShipColor = function(color){
   localStorage.setItem('color',color);
 }
 
+confirmInitials = function() {
+  localStorage.setItem('initials', document.querySelector('.initials').value);
+}
+
 generateColors = function(){
   // generates all the possible colors
   var c = ['dd','77','22'];

control/index.js

@@ -51,5 +51,5 @@ fullscreenToggle = function(){
 
 window.onload = function(){
   var socket = io();
-  socket.emit('add plane',localStorage.getItem('color')||'0x777777');
+  socket.emit('add plane',localStorage.getItem('color')||'0x777777', localStorage.getItem('initials'));
 }

control/main.css

@@ -78,6 +78,17 @@ canvas{
   font-weight: bold;
   font-size: 2em;
 }
+.initials {
+  position:fixed;
+  bottom:0px;
+  left:0px;
+
+
+  width: calc(50% - 10px);
+  height: calc(50% - 10px);
+  margin: 5px;
+
+}
 /* attack screen */
 
 #fire {

host/game/damageinfo.js

@@ -0,0 +1,6 @@
+var DamageInfo = function(owner, amt) {
+	this.owner = owner;
+	this.amt = amt;
+}
+
+module.exports = DamageInfo;

host/game/entity/bullet.js

@@ -3,8 +3,9 @@ var THREE = require('../libs/three');
 var CANNON = require('../libs/cannon');
 var global = require('../global');
 
-var Bullet = function(position, angle) {
+var Bullet = function(owner, position, vel) {
   Entity.call(this);
+  this.owner = owner;
   this.setGeometry(
       new THREE.BoxGeometry( 1, 1, 1 ),
       new THREE.MeshPhongMaterial({ color: 0x666666 })
@@ -13,8 +14,7 @@ var Bullet = function(position, angle) {
   var shape = new CANNON.Box(new CANNON.Vec3(1, 1, 1));
   var body = new CANNON.Body({mass: 10});
   body.addShape(shape);
-  var dir = (new THREE.Vector3()).subVectors(global.game.camera.lookAtPos,global.game.camera.position).normalize().multiplyScalar(3);
-  body.velocity.set(dir.x, dir.y, dir.z);
+  body.velocity.set(vel.x, vel.y, vel.z);
   body.angularDamping = 0.0;
   this.setPhysicsBody(body);
   this.setCollisionGroup(global.cgroup.BULLET);
@@ -36,6 +36,7 @@ Bullet.prototype.onCollide = function(e) {
   if (e.body && e.body.entity && e.body.entity.applyDamage) {
     console.log('Bullet colliding with: ', e.body.entity);
     e.body.entity.applyDamage(Bullet.IMPACT_DAMAGE);
+    this.owner.score.add(100);
   }
   this.remove();
 };

host/game/entity/enemy.js

@@ -54,7 +54,7 @@ Enemy.prototype.fire = function(){
 
 Enemy.prototype.fireProjectile = function(){
   // fires the projectile once
-  new Bullet(this.getPos(), new THREE.Vector3(this.motion.x,this.motion.y,5).normalize());
+  new Bullet(this, this.getPos(), new THREE.Vector3(this.motion.x,this.motion.y,5).normalize());
 }
 
 

host/game/entity/player.js

@@ -3,8 +3,9 @@ var THREE = require('../libs/three');
 var CANNON = require('../libs/cannon');
 /*jshint -W079 */ var global = require('../global');
 var Bullet = require('./bullet');
+var Score = require('../score');
 
-var Player = function(color) {
+var Player = function(color, initials) {
   Damageable.call(this, Player.MAX_HEALTH);
   // base square ... not in use anymore?
   this.setGeometry(
@@ -30,6 +31,7 @@ var Player = function(color) {
 
   // starting relative position in xy space. 0,0 is the left bottom; 1,1 is right top.
   this.relativePos = {y:0,z:0};
+  this.score = new Score(initials, 0);
 };
 
 Player.prototype = Object.create( Damageable.prototype );
@@ -62,7 +64,11 @@ Player.prototype.fire = function(){
 
 Player.prototype.fireProjectile = function(){
   // fires the projectile once
-  new Bullet(this.getPos(), this.Forward);
+  new Bullet(
+    this, 
+    this.getPos(), 
+    (new THREE.Vector3()).subVectors(global.game.camera.lookAtPos,global.game.camera.position).normalize().multiplyScalar(3)
+  );
 };
 
 Player.prototype.applyMotion = function(motion) {
@@ -77,15 +83,12 @@ Player.prototype.applyMotion = function(motion) {
   this.motion = motion;
 };
 
-function nameof(obj){
-  return obj.constructor.toString();
-}
-
 Player.prototype.onCollide = function(e) {
   if (e.body && e.body.entity && e.body.entity.applyDamage) {
     console.log('Player colliding with: ', e.body.entity);
     e.body.entity.applyDamage(200);
     this.applyDamage(50); 
+    this.score.add(-50);
   }
 };
 

host/game/game.js

@@ -6,11 +6,7 @@ var hook = require('./hook');
 var players = require('./player-store');
 var Asteroid = require('./entity/asteroid');
 var global = require('./global');
-
-var Score = function(initials, score){
-  this.initials = initials;
-  this.score = score;
-}
+var Score = require('./score');
 
 var Game = function() {
   this.initPhysics();
@@ -41,6 +37,10 @@ Game.prototype.betweenLevel = function() {
   var self = this;
   var pos = self.level.points[global.LEVEL_SEGMENTS -1];
   this.level.remove();
+  players.players.forEach(function(ply) {
+    self.addScore(ply.score.initials, ply.score.score);
+    ply.score.reset();
+  });
   var highscoreDiv = document.getElementById('highscores');
   highscoreDiv.innerHTML = "";
   highscoreDiv.style.display = "";

host/game/player-store.js

@@ -1,8 +1,8 @@
 var Player = require('./entity/player');
 var store = { players: [] };
 
-store.create = function(color) {
-  var p = new Player(color);
+store.create = function(color, initials) {
+  var p = new Player(color, (initials || 'AAA').toUpperCase().substring(0,3));
   store.players.push(p);
   document.getElementById("title-gif").style.display = "none";
   document.getElementById("qr_code_play").style.display = "none";

host/game/score.js

@@ -0,0 +1,18 @@
+var Score = function(initials, score){
+  this.initials = initials;
+  this.score = score;
+};
+
+Score.prototype.add = function(num) {
+  this.score += num;
+};
+
+Score.prototype.reset = function() {
+  this.score = 0;
+};
+
+Score.prototype.setInitials = function(initials) {
+  this.initials = initials;
+};
+
+module.exports = Score;

host/socket.js

@@ -4,10 +4,11 @@ var THREE = require('./game/libs/three');
 var socket = io();
 
 socket.on('add plane', function(player){
+  console.log(player);
 	var color = Number(player.color);
 	console.log(color);
 	localStorage[player.playerId] = player.color;
-  var ply = players.create(color);
+  var ply = players.create(color, player.initials);
   ply.userId = player.playerId;
   console.log("%c ADDED PLAYER "+ply.userId,"color: #"+color.toString(16));
   ply.setPos(new THREE.Vector3(0,0,0));

index.js

@@ -42,9 +42,9 @@ app.use(express.static(path.join(__dirname, 'static')));
 var playerCount = 0;
 io.on('connection', function(socket){
   var playerId = ++playerCount;
-  socket.on('add plane', function(color){
+  socket.on('add plane', function(color, initials){
     console.log(playerId + " joined");
-    var player = {playerId:playerId,color:color};
+    var player = {playerId:playerId,color:color,initials:initials};
     io.emit('add plane',player);
   });
   socket.on('disconnect', function(){