Sometimes you like, fuggit, make it responsive

So now the logo dynamically changes based on screensize...

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

@@ -53,6 +53,11 @@ Engine.Point.prototype = {
 		y: 0
 	},
 
+	resize: function(){
+		this.target.x = this.pos.x = this.ref.x * this.shapeSize.x;
+		this.target.y = this.pos.y = this.ref.y * this.shapeSize.y;
+	},
+
 	updateBreathingPhysics: function(){
 		this.stiffness = 0.1;
 		this.friction  = 0.05;

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

@@ -47,6 +47,20 @@ Engine.Shape.prototype = {
 	breathLength: 1,
 	breatheIn: false,
 
+	resize: function(newSize, offset){
+		var len, p;
+
+		this.size.x = newSize;
+		this.size.y = newSize;
+
+		this.pos.x = -(newSize / 2);
+		this.pos.y = -(newSize / 2 + offset);
+
+		for (p = 0, len = this.points.length; p < len; p++) {
+			this.points[p].resize();
+		}
+	},
+
 	startBreathing: function(){
 		var p;
 

website/source/javascripts/app/Engine.js

@@ -115,12 +115,6 @@ Engine = Base.extend({
 	},
 
 	setupEvents: function(){
-		if (window.innerWidth < 570) {
-			this.height = 560;
-		} else {
-			this.height = 700;
-		}
-
 		this.resize = this.resize.bind(this);
 		this.resize();
 		window.addEventListener('resize', this.resize, false);
@@ -290,7 +284,14 @@ Engine = Base.extend({
 	},
 
 	resize: function(){
-		var scale = this.scale;
+		var scale = this.scale,
+			size, offset;
+
+		if (window.innerWidth < 570) {
+			this.height = 560;
+		} else {
+			this.height = 700;
+		}
 
 		this.width  = window.innerWidth;
 
@@ -306,6 +307,17 @@ Engine = Base.extend({
 		if (this.grid) {
 			this.grid.resize(this.width, this.height);
 		}
+
+		if (this.logo) {
+			if (this.height === 560) {
+				size = 300;
+				offset = 0;
+			} else {
+				size = 360;
+				offset = 40;
+			}
+			this.logo.resize(size, offset);
+		}
 	},
 
 	_handleMouseCoords: function(event){