backslash to noclip, fix colors

8 files changed, 43 insertions, 27 deletions

diff --git a/assets/javascripts/mx/extensions/mx.movements.js b/assets/javascripts/mx/extensions/mx.movements.js
index 164d747..2f377cb 100644
--- a/assets/javascripts/mx/extensions/mx.movements.js
+++ b/assets/javascripts/mx/extensions/mx.movements.js
@@ -222,10 +222,10 @@ MX.Movements = function (cam, viewHeight) {
 					vz += v * Math.sin(ry) * s
 				}
 				if (moveUp) {
-					vy += v * scale
+					pos.y += v * scale
 				}
 				if (moveDown) {
-					vy -= v * scale
+					pos.y -= v * scale
 				}
 
 				if (turnUp) {
@@ -242,7 +242,6 @@ MX.Movements = function (cam, viewHeight) {
 				}
 
 				pos.x += vx
-				pos.y += vy
 				pos.z += vz
 			}
 
@@ -265,7 +264,6 @@ MX.Movements = function (cam, viewHeight) {
 					pos.y = ceiling
 					vz = vz || 1
 				}
-
 			}
 
 			if (vx || vy || vz) {
@@ -277,7 +275,7 @@ MX.Movements = function (cam, viewHeight) {
 		unlock: function(){ locked = false },
 		scale: function(n){ if (n) scale = n; return scale },
 		resetScale: function(n){ scale = DEFAULT_SCALE },
-		gravity: function(g){ gravity = g },
+		gravity: function(g){ return typeof g == "boolean" ? gravity = g : gravity },
 		velocity: function(n){ v = clamp(n, 1, 50) },
 		jumpVelocity: function(n){ jumpV = clamp(n, 1, 50) },
 	}
diff --git a/assets/javascripts/mx/mx.js b/assets/javascripts/mx/mx.js
index df9abe7..79423df 100644
--- a/assets/javascripts/mx/mx.js
+++ b/assets/javascripts/mx/mx.js
@@ -138,7 +138,7 @@ var MX = MX || (function (undefined) {
     // ========================================================================
 
     function Object3D (el) {
-
+console.log(el)
         this.setupDomElement(el)
         this.setCSSTransformStyle('preserve-3d')
         this.el.classList.add('mx-object3d')
@@ -222,6 +222,7 @@ var MX = MX || (function (undefined) {
                 if (classes) {
                     var i = classes.length
                     while (i--) {
+                    console.log(classes[i].slice(1))
                         this.el.classList.add(classes[i].slice(1))
                     }
                 }
diff --git a/assets/javascripts/rectangles/engine/builder.js b/assets/javascripts/rectangles/engine/builder.js
index 00bb1c7..67dd922 100644
--- a/assets/javascripts/rectangles/engine/builder.js
+++ b/assets/javascripts/rectangles/engine/builder.js
@@ -42,8 +42,8 @@ var builder = new function(){
 	
 	function bind (){
 		clipper.rooms.forEach(function(room){
-			var walls = room.group_mx_walls()
-			walls.forEach(function(wall){
+			room.walls = room.group_mx_walls()
+			room.walls.forEach(function(wall){
 				wall.bind()
 				wall.randomize_colors()
 			})
@@ -271,7 +271,7 @@ var builder = new function(){
 		return el
 	}
 
-	function make_wall(room, klass){
+	function make_wall(klass){
 		var el = new MX.Object3D(".face" + (klass || ""))
 		el.width = el.height = el.scaleX = el.scaleY = el.scaleZ = 1
 		el.z = el.y = el.x = 0
diff --git a/assets/javascripts/rectangles/engine/mover.js b/assets/javascripts/rectangles/engine/mover.js
index 8c71feb..cac2cca 100644
--- a/assets/javascripts/rectangles/engine/mover.js
+++ b/assets/javascripts/rectangles/engine/mover.js
@@ -2,6 +2,7 @@ var mover = new function(){
 
 	var base = this
 	base.room = null
+	base.noclip = false
 
 	base.init = function(){
 		base.bind()
@@ -10,11 +11,22 @@ var mover = new function(){
 	
 	base.bind = function(){
 		app.on("move", base.update)
+		keys.on("backslash", function(){
+			base.noclip = ! base.noclip
+			app.movements.gravity( ! app.movements.gravity() )
+		})
 	}
 	
 	base.update = function(pos){
 		var radius = scene.camera.radius
 		
+		if (base.noclip) {
+			cam.x = pos.x
+			cam.y = pos.y
+			cam.z = pos.z
+			return
+		}
+		
 		cam.y = pos.y
 
 		// if we were in a room already..
diff --git a/assets/javascripts/rectangles/models/room.js b/assets/javascripts/rectangles/models/room.js
index 3c41a1b..a321b7f 100644
--- a/assets/javascripts/rectangles/models/room.js
+++ b/assets/javascripts/rectangles/models/room.js
@@ -77,10 +77,9 @@ window.Room = (function(){
 			
 			if (side & LEFT_RIGHT) {
  				els.sort(compare_x)
-				console.log(els.map(function(r){ return r.rect+"" }).join("\n"))
 			}
-			else {
-				console.log(els.map(function(r){ return r.rect+"" }).join("\n"))
+			else if (side & FRONT_BACK) {
+ 				els.sort(compare_z)
 			}
 			
 			var wall = new_wall(els.shift())
diff --git a/assets/javascripts/rectangles/util/colors.js b/assets/javascripts/rectangles/util/colors.js
index 77473d7..68f0901 100644
--- a/assets/javascripts/rectangles/util/colors.js
+++ b/assets/javascripts/rectangles/util/colors.js
@@ -30,7 +30,15 @@
 	}
 
 	var select = document.querySelector("#palette")
-	select.addEventListener("change", function(){ colors = color_palettes[select.value] })
+	select.addEventListener("change", function(){
+		colors = color_palettes[select.value]
+		clipper.rooms.forEach(function(room){
+			room.walls.forEach(function(wall){
+				wall.randomize_colors()
+			})
+		})
+
+	})
 
 	window.colors = color_palettes[select.value]
 	window.palettes = color_palettes
diff --git a/assets/javascripts/rectangles/util/keys.js b/assets/javascripts/rectangles/util/keys.js
index e0ab045..5a5c9d2 100644
--- a/assets/javascripts/rectangles/util/keys.js
+++ b/assets/javascripts/rectangles/util/keys.js
@@ -2,6 +2,7 @@ var keys = (function(){
 
 	var base = new function(){}
 	base.tube = new Tube ()
+	base.debug = false
 
 	base.on = function(){
     base.tube.on.apply(base.tube, arguments)
@@ -17,7 +18,8 @@ var keys = (function(){
 			case undefined:
 				break;
 			default:
-				// console.log(key)
+				if (keys.debug) console.log(key)
+				base.tube(key)
 				break;
 		}
 	})
diff --git a/rectangles.html b/rectangles.html
index 6d651f2..19f9e2f 100644
--- a/rectangles.html
+++ b/rectangles.html
@@ -17,22 +17,18 @@ body > div {
 }
 .face {
 	background-color: #fff;
-	transition: 0.1s ease;
+	transition: 0.1s background-color ease;
 }
-.front { background-color: #ddd; }
-.back  { background-color: #bbb; }
-.left  { background-color: #aaa; }
-.right { background-color: #888; }
-.floor { background-color: #00f; }
-.ceiling { background-color: #f00; }
+.front { background-color: #fff; }
+.back  { background-color: #fff; }
+.left  { background-color: #fff; }
+.right { background-color: #fff; }
+.floor { background-color: #fff; }
+.ceiling { background-color: rgba(230,230,255,0.3); }
 
 
-.active.front { background-color: #ddf; }
-.active.back  { background-color: #bbe; }
-.active.left  { background-color: #aad; }
-.active.right { background-color: #88b; }
-.active.floor { background-color: #0ff; }
-.active.ceiling { background-color: #ff0; }
+.active.floor { background-color: #ffe; }
+.active.ceiling { background-color: rgba(230,230,255,0.3); }
 
 /* 
 .face {