Merge remote-tracking branch 'origin/development'

src/client/index.html

@@ -22,14 +22,14 @@
         <!-- enum -->
         <script src="../common/Enums.js"></script>
 
+        <!-- settings -->
+        <script src="../common/Settings.js"></script>  
+
         <!-- utils -->
         <script src="../common/game/util/IDDistributor.js"></script>
         <script src="../common/game/util/ColorGenerator.js"></script>
         <script src="../common/game/util/Group.js"></script>
         <script src="../common/game/util/GroupManager.js"></script>
-
-        <!-- settings -->
-        <script src="../common/Settings.js"></script>  
 
         <!-- timers -->
         <script src="../common/game/time/Timer.js"></script>

src/client/mainscreen.html

@@ -22,15 +22,15 @@
         <!-- enum -->
         <script src="../common/Enums.js"></script>
 
+        <!-- settings -->
+        <script src="../common/Settings.js"></script>  
+
         <!-- utils -->
         <script src="../common/game/util/IDDistributor.js"></script>
         <script src="../common/game/util/ColorGenerator.js"></script>
         <script src="../common/game/util/Group.js"></script>
         <script src="../common/game/util/GroupManager.js"></script>
 
-        <!-- settings -->
-        <script src="../common/Settings.js"></script>  
-
         <!-- timers -->
         <script src="../common/game/time/Timer.js"></script>
         <script src="../common/game/time/PlayerTimer.js"></script>

src/common/Settings.js

@@ -8,8 +8,8 @@ var Settings = {
 	updateInterval: 17,
 
 	/**** SERVER CONNECTION ****/
-	server: 'http://localhost',
-	//server: 'http://vps-76938-1774.hosted.at.hostnet.nl',	//Server Olaf
+	//server: 'http://localhost',
+	server: 'http://vps-76938-1774.hosted.at.hostnet.nl',	//Server Olaf
 	port: 5050,
 
 	playerLimit: 30,
@@ -20,7 +20,7 @@ var Settings = {
 	//want anders wordt de oude powerup overschreden met de nieuwe timer :D hier nog een fix voor zoeken.
 	smallShield: {
 		time: 10,
-		color: "greenyellow",
+		color: "lightblue",
 		length: 3.5,
 		path: "../client/img/powerup.png",
 		chance: 0.15
@@ -45,7 +45,7 @@ var Settings = {
 	bigPole: {
 		time: 10,
 		color: "aqua",
-		radius: 1.2, //by which factor the pole will be multiplied
+		radius: 1.5, //by which factor the pole will be multiplied
 		path: "../client/img/powerup.png",
 		chance: 0.15
 	},
@@ -84,7 +84,8 @@ var Settings = {
 		color: "green",
 		hitColor: "red",
 		minsize: 5,
-		maxsize: 60
+		maxsize: 60,
+		ring: 4 //size of the powerup ring around the pole
 	},
 
 	/**** SHIELD ****/
@@ -101,9 +102,7 @@ var Settings = {
 		//Positions of initial ball
 		x: 100,
 		y: 100,
-		nrOfNewBalls: 3, //Number of new balls created per player. 
-		colors: ["#2237FF", "#FFBA00", "#FF0067", "#838FFF", "#FFD870", "#FFBC8C", 
-	"#FF70AA", "#FF004D", "#7716FF", "#FFE700"]
+		nrOfNewBalls: 3 //Number of new balls created per player. 
 	},
 
 	player: {

src/common/game/Drawer.js

@@ -78,45 +78,47 @@ Drawer = function(_canvasContext){
 	* @param {object} _powerup - The powerup object to be drawn
 	*/
 	this.drawPowerup = function (_powerup){
-		canvasContext.beginPath();
-		canvasContext.arc(_powerup.getPosition().x, _powerup.getPosition().y, _powerup.getRadius(), 0, Math.PI*2, true);
-		canvasContext.closePath();
-
-		canvasContext.fillStyle = _powerup.getColor();
-		canvasContext.fill();
-
-		//Draw the cooldown part
-		this.drawCoolDown(_powerup, 2);
+		this.drawCoolDown(_powerup, 0); //powerup should have a cooldown effect
 	};
 
+	/**
+	* Draws the ring around the pole when a powerup is active
+	* Note: this only happens when the pole is allowed to have a ring (so not on mainscreen)
+	*
+	* @method Draw#drawPowerupSkin
+	* @param {object} _pole - The pole around which the ring will be drawn
+	*/
 	this.drawPowerupSkin = function (_pole){
 		var powerup = _pole.player.getPowerup();
 		if(powerup != null && _pole.getPowerupDraw()){
-			canvasContext.beginPath();
-			canvasContext.arc(_pole.getBody().position.x, _pole.getBody().position.y, _pole.getRadius()+2, 0, Math.PI*2, true);
-			canvasContext.closePath();
-
-			canvasContext.fillStyle = powerup.color;
-			canvasContext.fill();	
-			this.drawCoolDown(_pole, 4);
+			this.drawCoolDown(_pole, Settings.pole.ring, powerup.getColor());
 		}
 	}
 
-	this.drawCoolDown = function (_object, _offset){	
+	/**
+	* Draws the powerup / pole with a cooldown effect
+	*
+	* @method Drawer#drawCoolDown
+	* @param {Object} _object - The object for which the cooldown is drawn
+	* @param {number} _offset - The offset which actually shows the ring around the object
+	* @param {string} _color - Optional; the color of the cooldown ring, or the color of the object if not specified
+	*/
+	this.drawCoolDown = function (_object, _offset, _color){	
 		if(_object.getCDAngle() > 0){
 			var startAngle = Settings.startAngle;
 			var endAngle = (startAngle + _object.getCDAngle()) % 360;
 
-			canvasContext.fillStyle = "black"; //Has to be the current background color
-			canvasContext.moveTo(_object.getPosition().x, _object.getPosition().y);
+			canvasContext.fillStyle = _color || _object.getColor();
+			canvasContext.moveTo(_object.getPosition().x, _object.getPosition().y)
 			canvasContext.beginPath();
 			canvasContext.arc(
-	            _object.getPosition().x, _object.getPosition().y, _object.getRadius() + _offset, startAngle * Math.PI / 180,
-	            endAngle * Math.PI / 180, false
-	        );
+				_object.getBody().position.x, _object.getBody().position.y, _object.getRadius() + _offset, startAngle * Math.PI / 180,
+				endAngle * Math.PI / 180, true
+			);
 			canvasContext.lineTo(_object.getPosition().x, _object.getPosition().y);
-	        canvasContext.fill();
-	        canvasContext.closePath();
+
+			canvasContext.fill();	
+			canvasContext.closePath();
     	}
 	}
 }

src/common/game/gameobjects/Pole.js

@@ -50,10 +50,9 @@ var Pole = Ball.extend({
 			this.prevColor = this.getColor(); //retrieve original color
 			this.setColor(Settings.pole.hitColor); //set new color to indicate being hit
 			this.saveHighscore(); //Save current score if highscore
-			this.hit = false; //remove hit flag
 			this.hitBy = -1; //remove hitBy
 			var savedThis = this;
-			setTimeout(function() { savedThis.setColor(savedThis.prevColor); savedThis.coolDown = false  }, 1000); //set cooldown period
+			setTimeout(function() { savedThis.setColor(savedThis.prevColor); savedThis.coolDown = false; savedThis.hit = false; }, 1000); //set cooldown period
 		}
 	},
 

src/common/game/util/ColorGenerator.js

@@ -1,3 +1,7 @@
+if(typeof module != 'undefined'){
+	var Settings = require('../../Settings.js');
+}
+
 /**
 * Class for a color generator
 * @class ColorGenerator
@@ -6,8 +10,8 @@
 */
 var ColorGenerator = {	
 
-	colors: ["#988CFF", "#FF3636", "#8CE4FF", "#90FF8C", "#F4FF8C", "#FFBC8C", 
-	"#FF8CF5", "#FF40DC", "#4640FF", "#29FFFB", "#38FF49", "#F5FF38"],
+	colors: ["#2237FF", "#2237FF", "#FF0067", "#838FFF", "#FFD870", "#FFBC8C", 
+	"#FF70AA", "#FF004D", "#7716FF", "#FFE700"],
 
 	/**
 	* Returns a random color from the predefined color list above.