Reworked Breathing

It now no longer feels like breathing. It should feel a bit more
amorphis and subtle.

website/source/javascripts/app/Engine.Point.js

@@ -20,17 +20,16 @@ Engine.Point = function(id, x, y, shapeSize){
 	this.accel  = Vector.coerce(this.accel);
 	this.vel    = Vector.coerce(this.vel);
 
-	this.stiffness = Engine.getRandomFloat(3, 6);
-	this.friction  = Engine.getRandomFloat(0.15, 0.3);
+	this.stiffness = Engine.getRandomFloat(150, 600);
+	this.friction = Engine.getRandomFloat(12, 18);
 };
 
 Engine.Point.prototype = {
 
 	radius: 1,
 
-	stiffness : 0.5,
-	// friction  : 0.00001,
-	friction  : 0.01,
+	stiffness : 200,
+	friction  : 13,
 	threshold : 0.03,
 
 	pos: {
@@ -59,8 +58,8 @@ Engine.Point.prototype = {
 	},
 
 	updateBreathingPhysics: function(){
-		this.stiffness = 0.1;
-		this.friction  = 0.05;
+		this.stiffness = Engine.getRandomFloat(2, 4);
+		this.friction  = Engine.getRandomFloat(1, 2);
 	},
 
 	updateTarget: function(newSize){
@@ -74,8 +73,8 @@ Engine.Point.prototype = {
 		this.target.sub(diff);
 
 		this.target.add({
-			x: Engine.getRandomFloat(-8, 8),
-			y: Engine.getRandomFloat(-8, 8)
+			x: Engine.getRandomFloat(-3, 3),
+			y: Engine.getRandomFloat(-3, 3)
 		});
 	},
 
@@ -88,7 +87,7 @@ Engine.Point.prototype = {
 
 		this.accel.set(newAccel);
 
-		this.vel.add(this.accel);
+		this.vel.add(Vector.mult(this.accel, engine.tick));
 
 		this.pos.add(
 			Vector.mult(this.vel, engine.tick)

website/source/javascripts/app/Engine.Shape.js

@@ -81,13 +81,7 @@ Engine.Shape.prototype = {
 			return;
 		}
 
-		if (this.breatheIn) {
-			scale = 1;
-		} else {
-			scale = 1.05;
-		}
-
-		this.breatheIn = !this.breatheIn;
+		scale = 1;
 
 		newSize = Vector.mult(this.sizeRef, scale);
 
@@ -127,16 +121,16 @@ Engine.Shape.prototype = {
 			poly = this.polygons[p];
 			ctx.beginPath();
 			ctx.moveTo(
-				poly.a.pos.x * scale >> 0,
-				poly.a.pos.y * scale >> 0
+				poly.a.pos.x * scale,
+				poly.a.pos.y * scale
 			);
 			ctx.lineTo(
-				poly.b.pos.x * scale >> 0,
-				poly.b.pos.y * scale >> 0
+				poly.b.pos.x * scale,
+				poly.b.pos.y * scale
 			);
 			ctx.lineTo(
-				poly.c.pos.x * scale >> 0,
-				poly.c.pos.y * scale >> 0
+				poly.c.pos.x * scale,
+				poly.c.pos.y * scale
 			);
 			ctx.closePath();
 			ctx.fillStyle   = poly.fillStyle;

website/source/javascripts/app/Engine.js

@@ -73,7 +73,7 @@ Engine = Base.extend({
 			.then(function(){
 				this.starGeneratorRate = 200;
 			}, this)
-			.wait(2000)
+			.wait(500)
 			.then(function(){
 				parent.className += ' state-one';
 			})
@@ -93,10 +93,13 @@ Engine = Base.extend({
 			.then(function(){
 				this.showShapes = true;
 			}, this)
-			.wait(1000)
+			.wait(800)
+			.then(function(){
+				this.logo.startBreathing();
+			}, this)
+			.wait(200)
 			.then(function(){
 				this.showGrid = true;
-				// this.logo.startBreathing();
 			}, this)
 			.wait(1000)
 			.then(function(){