Merge branch 'walls' of github.com:okfocus/vvalls into walls

21 files changed, 558 insertions, 75 deletions

diff --git a/public/assets/javascripts/rectangles/_env.js b/public/assets/javascripts/rectangles/_env.js
index 3cfe969..4b14a21 100644
--- a/public/assets/javascripts/rectangles/_env.js
+++ b/public/assets/javascripts/rectangles/_env.js
@@ -35,6 +35,20 @@ environment.init = function(){
 			zoom: -4.8	
 		})
 	}
+
+  keys.on("z", function(e){
+    e.preventDefault()
+    if (e.ctrlKey || e.metaKey) {
+      if (e.shiftKey) {
+        var canRedo = UndoStack.redo()
+        console.log("can redo", canRedo)
+      }
+      else {
+        var canUndo = UndoStack.undo()
+        console.log("can undo", canUndo)
+      }
+    }
+  })
 }
 environment.update = function(t){
 	map.update()
diff --git a/public/assets/javascripts/rectangles/engine/map/draw.js b/public/assets/javascripts/rectangles/engine/map/draw.js
index 8e1fe5a..3e185d2 100644
--- a/public/assets/javascripts/rectangles/engine/map/draw.js
+++ b/public/assets/javascripts/rectangles/engine/map/draw.js
@@ -29,7 +29,7 @@ Map.Draw = function(map, opt){
 			ctx.translate( map.center.a,  map.center.b )
 			ctx.scale( -1, 1 )
 
-			draw.regions(Rooms.regions, colors)
+			draw.regions(Rooms.regions, [ "#f8f8f8" ])
 			draw.mouse(map.ui.mouse.cursor)
 			draw.coords()
 			scene && draw.camera(scene.camera)
@@ -55,7 +55,7 @@ Map.Draw = function(map, opt){
 	}
 
 	draw.clear = function(){
-		ctx.fillStyle = "rgba(255,255,255,0.9)"
+		ctx.fillStyle = "rgba(255,255,255,0.98)"
 		ctx.clearRect(0, 0, map.dimensions.a, map.dimensions.b)
 		ctx.fillRect(0, 0, map.dimensions.a, map.dimensions.b)
 	}
diff --git a/public/assets/javascripts/rectangles/engine/map/ui_editor.js b/public/assets/javascripts/rectangles/engine/map/ui_editor.js
index 577ea32..9a557b9 100644
--- a/public/assets/javascripts/rectangles/engine/map/ui_editor.js
+++ b/public/assets/javascripts/rectangles/engine/map/ui_editor.js
@@ -30,6 +30,7 @@ Map.UI.Editor = function(map){
 	//
 	
 	function down (e, cursor){
+	  var room
 		cursor.x.div(map.dimensions.a).add(0.5).mul(map.dimensions.a / map.zoom).add(map.center.a)
 		cursor.y.div(map.dimensions.b).sub(0.5).mul(map.dimensions.b / map.zoom).sub(map.center.b)
 
@@ -52,22 +53,28 @@ Map.UI.Editor = function(map){
 
 		if (intersects.length && base.permissions.destroy) {
 			base.mouse.down = false
-			Rooms.remove(intersects[0])
-			app.tube("builder-destroy-room", intersects[0])
+			
+			room = intersects[0]
+
+      UndoStack.push({
+        type: "destroy-room",
+        undo: room.copy(),
+        redo: { id: room.id },
+      })
+
+			Rooms.remove(room)
+			app.tube("builder-destroy-room", room)
 			return
 		}
-		else if (intersects.length && (base.permissions.move || base.permissions.resize)) {
+		else if (intersects.length) {
 			base.dragging = intersects[0]
-			base.resizing = base.permissions.resize && base.dragging.rect.nearEdge(cursor.x.a, cursor.y.a, resize_margin / map.zoom)
+			base.resizing = base.dragging.rect.nearEdge(cursor.x.a, cursor.y.a, resize_margin / map.zoom)
 			base.dragging.rect.translation.sides = base.resizing
 			app.tube("builder-pick-room", intersects[0])
 		}
 		else if (base.permissions.create) {
 			base.creating = true
 		}
-		else if (intersects.length) {
-			app.tube("builder-pick-room", intersects[0])
-		}
 
 		if (e.shiftKey && base.dragging) {
 			base.dragging.rect.quantize(10/map.zoom)
@@ -77,6 +84,45 @@ Map.UI.Editor = function(map){
 	function move (e, cursor) {
 		cursor.x.div(map.dimensions.a).add(0.5).mul(map.dimensions.a / map.zoom).add(map.center.a)
 		cursor.y.div(map.dimensions.b).sub(0.5).mul(map.dimensions.b / map.zoom).sub(map.center.b)
+
+		var intersects = Rooms.filter(function(r){
+			return r.rect.contains(cursor.x.a, cursor.y.a)
+		})
+		
+		if (base.permissions.destroy) {
+      map.el.className = "destroy"
+		}
+		else if (intersects.length) {
+		  var edges = intersects[0].rect.nearEdge(cursor.x.a, cursor.y.a, resize_margin / map.zoom)
+		  switch (edges) {
+		    case FRONT_LEFT:
+		    case BACK_RIGHT:
+		      map.el.className = "nesw-resize"
+		      break
+
+		    case FRONT_RIGHT:
+		    case BACK_LEFT:
+		      map.el.className = "nwse-resize"
+		      break
+
+		    case FRONT:
+		    case BACK:
+		      map.el.className = "ns-resize"
+		      break
+
+		    case LEFT:
+		    case RIGHT:
+		      map.el.className = "ew-resize"
+		      break
+		    
+		    default:
+		      map.el.className = "move"
+		      break
+		  }
+		}
+		else {
+      map.el.className = ""
+		}
 	}
 
 	function drag (e, cursor) {
@@ -115,20 +161,40 @@ Map.UI.Editor = function(map){
 				cursor.x.abs().quantize(1)
 				cursor.y.abs().quantize(1)
 				var room = Rooms.add_with_rect( cursor )
+
+        UndoStack.push({
+          type: "create-room",
+          undo: { id: room.id },
+          redo: room.copy()
+        })
+        
 				app.tube("builder-pick-room", room)
 			}
 		}
 		
-		if (base.resizing) {
-			base.dragging.rect.resize()
-		}
-		else if (base.dragging) {
-			base.dragging.rect.translate()
-		}
+    if (base.resizing || base.dragging) {
 
+      var oldState = base.dragging.copy()
+      
+      if (base.resizing) {
+        base.dragging.rect.resize()
+      }
+      else if (base.dragging) {
+        base.dragging.rect.translate()
+      }
+      
+      UndoStack.push({
+        type: "update-room",
+        undo: oldState,
+        redo: base.dragging.copy()
+      })
+    }
+    
 		base.creating = base.dragging = base.resizing = false
 	}
 
+  var wheelState, wheelTimeout
+
 	function mousewheel (e, val, delta){
 		var cursor = base.mouse.cursor
 
@@ -137,8 +203,20 @@ Map.UI.Editor = function(map){
 		})
 		
 		if (intersects.length) {
+			wheelState = wheelState || intersects[0].copy()
+			
 			intersects[0].height = clamp( ~~(intersects[0].height - delta), height_min, height_max )
-			Rooms.clipper.update()
+			
+			clearTimeout(wheelTimeout)
+			wheelTimeout = setTimeout(function(){
+        UndoStack.push({
+          type: "update-room",
+          undo: wheelState,
+          redo: intersects[0].copy()
+        })
+        Rooms.clipper.update()
+        wheelState = null
+			}, 500)
 		}
 		else {
 			map.set_zoom(map.zoom_exponent - delta/20)
diff --git a/public/assets/javascripts/rectangles/engine/rooms/grouper.js b/public/assets/javascripts/rectangles/engine/rooms/grouper.js
index 4ad3bd8..cde9fbb 100644
--- a/public/assets/javascripts/rectangles/engine/rooms/grouper.js
+++ b/public/assets/javascripts/rectangles/engine/rooms/grouper.js
@@ -1,6 +1,6 @@
 (function(){
 
-	var vec2, Rect, Rooms, UidGenerator, Wall, Surface, sort
+	var vec2, Rect, Rooms, UidGenerator, Wall, Surface, sort, _
 	if ('window' in this) {
 		vec2 = window.vec2
 		Rect = window.Rect
@@ -9,6 +9,7 @@
 		UidGenerator = window.UidGenerator
 		Wall = window.Wall
 		sort = window.sort
+		_ = window._
 	}
 	else {
 		Rooms = require('./_rooms')
@@ -18,6 +19,7 @@
 		Wall = require('../../models/wall')
 		Surface = require('../../models/surface')
 		sort = require('../../util/sort')
+		_ = require('lodash')
 		FRONT = 0x1, BACK = 0x2, LEFT = 0x4, RIGHT = 0x8, FLOOR = 0x10, CEILING = 0x20
 		PI = Math.PI
 		HALF_PI = PI/2
@@ -82,6 +84,7 @@
 				collection.sort( useX ? sort.compare_zx : sort.compare_xz )
 				collection.forEach(function(mx){
 					if (last_mx && last_mx.rect.eq(mx.rect)) {
+					  // culls half-walls
 						if (last_mx.rect.id == mx.rect.id) {
 							last_mx.height += mx.height/2
 							last_mx.y += mx.height/4
@@ -103,41 +106,53 @@
 		}
 		base.group = function(walls, collections, side){
 			var collection = collections[side]
-			var wall
 			var useX = side & FRONT_BACK
-			var useA = side & (FRONT | RIGHT)
+			var useA = side & (FRONT | LEFT)
 
 			// collection.sort( useX ? sort.compare_zx : sort.compare_xz )
 			
+			var planes = {}
+						
 			collection.forEach(function(mx){
 				if (mx.culled) return
-				var coplanar = wall && wall.edge == mx.rect[useX ? 'y': 'x'][useA ? 'a': 'b']
-				
-				if (wall && coplanar) {
-					if (useX && wall.vec.b == mx.rect.x.a) {
-						wall.vec.b = mx.rect.x.b
-						wall.mx.push(mx)
-						wall.surface.add(mx.face)
-						return
-					}
-					else if (! useX && wall.vec.b == mx.rect.y.a) {
-						wall.vec.b = mx.rect.y.b
-						wall.mx.push(mx)
-						wall.surface.add(mx.face)
-						return
-					}
-				}
-				wall = new Wall ({
-					id:      base.uid(),
-					side:    side,
-					mx:      [ mx ],
-					surface: new Surface( mx.face ),
-					vec:     mx.rect[ useX ? 'x' : 'y' ].clone(),
-					edge:    mx.rect[ useX ? 'y' : 'x' ][ useA ? 'a' : 'b' ],
-				})
-				walls.push(wall)
+				var edge = mx.rect[useX ? 'y': 'x'][ useA ? 'a': 'b']
+				planes[edge] = planes[edge] || []
+				planes[edge].push(mx)
 			})
-
+			
+			var edges = _.keys(planes)
+			edges.forEach(function(edge){
+			
+				var wall
+				
+				planes[edge].forEach(function(mx){        
+				  
+          if (wall) {
+            if (useX && wall.vec.b == mx.rect.x.a) {
+              wall.vec.b = mx.rect.x.b
+              wall.mx.push(mx)
+              wall.surface.add(mx.face)
+              return
+            }
+            else if (! useX && wall.vec.b == mx.rect.y.a) {
+              wall.vec.b = mx.rect.y.b
+              wall.mx.push(mx)
+              wall.surface.add(mx.face)
+              return
+            }
+          }
+          wall = new Wall ({
+            id:      base.uid(),
+            side:    side,
+            mx:      [ mx ],
+            surface: new Surface( mx.face ),
+            vec:     mx.rect[ useX ? 'x' : 'y' ].clone(),
+            edge:    mx.rect[ useX ? 'y' : 'x' ][ useA ? 'a' : 'b' ],
+          })
+          walls.push(wall)
+        })
+      })
+      
 			return walls
 		}
 		
diff --git a/public/assets/javascripts/rectangles/engine/scenery/_scenery.js b/public/assets/javascripts/rectangles/engine/scenery/_scenery.js
index 137c74a..b4a38f8 100644
--- a/public/assets/javascripts/rectangles/engine/scenery/_scenery.js
+++ b/public/assets/javascripts/rectangles/engine/scenery/_scenery.js
@@ -14,7 +14,7 @@ var Scenery = new function(){
 
 	base.add = function(opt){
 		var scene_media
-		switch (media.type) {
+		switch (opt.media.type) {
 			case 'image':
 				scene_media = new Scenery.types.image (opt)
 				break
@@ -36,8 +36,13 @@ var Scenery = new function(){
 			mx: mx
 		})
 		base.nextMedia = null
+		return media
 	}
-	
+
+	base.find = function(id){
+		return base.list[id] || null
+	}
+		
 	base.remove = function(id){
 		var media = base.list[id]
 		delete base.list[id]
@@ -69,11 +74,11 @@ var Scenery = new function(){
 		scenery_data.forEach(function(data){
 			var wall = Rooms.walls[data.wall_id]
 			var scene_media = base.add({
+			  data: data,
 				wall: wall,
 				media: data.media,
 				id: data.id
 			})
-			scene_media.deserialize(data)
 		})
 	}
 
diff --git a/public/assets/javascripts/rectangles/engine/scenery/move.js b/public/assets/javascripts/rectangles/engine/scenery/move.js
index cc5b014..f2d37d8 100644
--- a/public/assets/javascripts/rectangles/engine/scenery/move.js
+++ b/public/assets/javascripts/rectangles/engine/scenery/move.js
@@ -3,6 +3,7 @@ Scenery.move = function(base){
 
 	var x, y, z, bounds
 	var dragging = false
+	var oldState
 
 	this.bind = function(){
 		Scenery.mouse.bind_el(base.mx.el)
@@ -23,6 +24,15 @@ Scenery.move = function(base){
 	function down (e, cursor){
 		if (e.target != base.mx.el) return;
 		if (editor.permissions.destroy) {
+      UndoStack.push({
+        type: 'destroy-scenery',
+        undo: base.serialize(),
+        redo: { id: base.id },
+      })
+
+      // TODO: watch individual scenery object here
+      Minotaur.watch( app.router.editorView.settings )
+
 			Scenery.remove(base.id)
 			return
 		}
@@ -39,6 +49,7 @@ Scenery.move = function(base){
 		y = base.mx.y
 		z = base.mx.z
 		bounds = base.bounds
+		oldState = base.serialize()
 		document.body.classList.add("dragging")
 	}
 	
@@ -63,8 +74,21 @@ Scenery.move = function(base){
 	}
 
 	function up (e, cursor){
+    if (! dragging || ! oldState) return
+    
 		dragging = false
 		document.body.classList.remove("dragging")
+
+    UndoStack.push({
+      type: 'update-scenery',
+      undo: oldState,
+      redo: base.serialize(),
+    })
+
+    // TODO: watch individual scenery object here
+    Minotaur.watch( app.router.editorView.settings )
+
+    oldState = null
 	}
 	
 	function switch_wall (e, new_wall, cursor){
diff --git a/public/assets/javascripts/rectangles/engine/scenery/resize.js b/public/assets/javascripts/rectangles/engine/scenery/resize.js
index df058bb..6b2e52c 100644
--- a/public/assets/javascripts/rectangles/engine/scenery/resize.js
+++ b/public/assets/javascripts/rectangles/engine/scenery/resize.js
@@ -7,6 +7,7 @@ Scenery.resize = new function(){
 	var x, y, z, bounds
 	var dragging = false
 	var dimensions, position, scale
+	var oldState
 
 	var dots = [], dot, selected_dot
 
@@ -54,7 +55,7 @@ Scenery.resize = new function(){
 	}
 	
 	// move all the dots to the object's current position
-	base.move_dots = function(){		
+	base.move_dots = function(){
 		x = obj.mx.x + sin(rotationY) * dot_distance_from_picture
 		y = obj.mx.y
 		z = obj.mx.z - cos(rotationY) * dot_distance_from_picture
@@ -88,7 +89,7 @@ Scenery.resize = new function(){
 
 	// pick a new object to focus on and show the dots
 	base.show = function(new_object) {
-		if (obj === new_object) return
+		// if (obj === new_object) return
 		obj = new_object
 		
 		base.add_dots()
@@ -151,6 +152,7 @@ Scenery.resize = new function(){
 		dimensions = obj.dimensions
 		position = new vec3(obj.mx.x, obj.mx.y, obj.mx.z)
 		scale = obj.mx.scale
+		oldState = obj.serialize()
 
 		document.body.classList.add("dragging")
 	}
@@ -191,6 +193,16 @@ Scenery.resize = new function(){
 		if (! editor.permissions.resize) { return }
 		obj.scale = obj.mx.ops.scale = obj.mx.scale
 		obj.set_wall()
+		
+    UndoStack.push({
+      type: 'update-scenery',
+      undo: oldState,
+      redo: obj.serialize(),
+    })
+
+    // TODO: watch individual scenery object here
+    Minotaur.watch( app.router.editorView.settings )
+
 		document.body.classList.remove("dragging")
 	}
 
diff --git a/public/assets/javascripts/rectangles/engine/scenery/types/_object.js b/public/assets/javascripts/rectangles/engine/scenery/types/_object.js
index aa1fefb..6bd5863 100644
--- a/public/assets/javascripts/rectangles/engine/scenery/types/_object.js
+++ b/public/assets/javascripts/rectangles/engine/scenery/types/_object.js
@@ -62,8 +62,12 @@ Scenery.types.base = Fiber.extend(function(base){
 
 		set_wall: function(wall, mx){
 			this.wall = wall || this.wall
-			this.bounds = this.wall.bounds_for(this.media, this.scale)
-			this.center = this.wall.center()
+			// this.bounds = this.wall.bounds_for(this.media, this.scale)
+			// this.center = this.wall.center()
+		},
+		
+		set_scale: function(scale){
+			this.scale = this.mx.scale = this.mx.ops.scale = scale || 1.0
 		},
 		
 		recenter: function(){
@@ -79,7 +83,6 @@ Scenery.types.base = Fiber.extend(function(base){
 		serialize: function(){
 			var data = {
 				id: this.id,
-				room_id: this.wall.room_id,
 				wall_id: this.wall.id,
 				side: this.wall.side,
 				dimensions: this.dimensions.serialize(),
diff --git a/public/assets/javascripts/rectangles/engine/scenery/types/image.js b/public/assets/javascripts/rectangles/engine/scenery/types/image.js
index 99c1810..576242e 100644
--- a/public/assets/javascripts/rectangles/engine/scenery/types/image.js
+++ b/public/assets/javascripts/rectangles/engine/scenery/types/image.js
@@ -10,7 +10,13 @@ Scenery.types.image = Scenery.types.base.extend(function(base){
 			this.build()
 			this.bind()
 			this.set_wall()
-			this.recenter()
+			
+			if (opt.data) {
+        this.deserialize(opt.data)
+      }
+      else {
+        this.recenter()
+      }
 		},
 
 		build: function(){
diff --git a/public/assets/javascripts/rectangles/engine/scenery/types/video.js b/public/assets/javascripts/rectangles/engine/scenery/types/video.js
index 79cfb1c..0bd5c06 100644
--- a/public/assets/javascripts/rectangles/engine/scenery/types/video.js
+++ b/public/assets/javascripts/rectangles/engine/scenery/types/video.js
@@ -10,7 +10,13 @@ Scenery.types.video = Scenery.types.base.extend(function(base){
 			this.build()
 			this.bind()
 			this.set_wall()
-			this.recenter()
+			
+			if (opt.data) {
+        this.deserialize(opt.data)
+      }
+      else {
+        this.recenter()
+      }
 		},
 
 		build: function(){
@@ -34,7 +40,8 @@ Scenery.types.video = Scenery.types.base.extend(function(base){
 				y: this.scale * this.media.height/2,
 				backface: false,
 			})
-			scene.add( this.mx )
+			scene.add(this.mx)
+			this.mx.load()
 		},
 		
 		play: function(){
diff --git a/public/assets/javascripts/rectangles/engine/scenery/undo.js b/public/assets/javascripts/rectangles/engine/scenery/undo.js
new file mode 100644
index 0000000..54ab755
--- /dev/null
+++ b/public/assets/javascripts/rectangles/engine/scenery/undo.js
@@ -0,0 +1,118 @@
+(function(){
+	UndoStack.register([
+		{
+			type: "create-scenery",
+      undo: function(state){
+        Scenery.remove(state.id)
+
+        // TODO: watch individual scenery object here
+        Minotaur.watch( app.router.editorView.settings )
+      },
+      redo: function(state){
+        Scenery.deserialize([ state ])
+
+        // TODO: watch individual scenery object here
+        Minotaur.watch( app.router.editorView.settings )
+      },
+		},
+		{
+			type: "update-scenery",
+      undo: function(state){
+        var scenery = Scenery.find(state.id)
+        scenery.deserialize(state)
+        scenery.set_wall(Rooms.walls[ state.wall_id ])
+        
+        if (editor.permissions.resize) {
+          Scenery.resize.show(scenery)
+        }
+
+        // TODO: watch individual scenery object here
+        Minotaur.watch( app.router.editorView.settings )
+      },
+      redo: function(state){
+        var scenery = Scenery.find(state.id)
+        scenery.deserialize(state)
+        scenery.set_wall(Rooms.walls[ state.wall_id ])
+
+        if (editor.permissions.resize) {
+          Scenery.resize.show(scenery)
+          Scenery.resize.rotate_dots()
+          Scenery.resize.move_dots()
+        }
+
+        // TODO: watch individual scenery object here
+        Minotaur.watch( app.router.editorView.settings )
+      },
+		},
+		{
+			type: "destroy-scenery",
+      undo: function(state){
+        Scenery.deserialize([ state ])
+
+        // TODO: watch individual scenery object here
+        Minotaur.watch( app.router.editorView.settings )
+      },
+      redo: function(state){
+        Scenery.remove(state.id)
+
+        // TODO: watch individual scenery object here
+        Minotaur.watch( app.router.editorView.settings )
+      },
+		},
+		
+		// 
+		
+		{
+			type: "create-room",
+      undo: function(room){
+        Rooms.remove(room)
+        Rooms.clipper.update()
+      },
+      redo: function(room){
+        Rooms.add(new Room(room))
+        Rooms.clipper.update()
+				app.tube("builder-pick-room", room)
+      },
+		},
+		{
+			type: "update-room",
+      undo: function(state){
+        var room = Rooms.list[state.id]
+        room.rect.assign( state.rect )
+        room.height = state.height
+        Rooms.clipper.update()
+				app.tube("builder-pick-room", room)
+      },
+      redo: function(state){
+        var room = Rooms.list[state.id]
+        room.rect.assign( state.rect )
+        room.height = state.height
+        Rooms.clipper.update()
+				app.tube("builder-pick-room", room)
+      },
+		},
+		{
+			type: "destroy-room",
+      undo: function(room){
+        Rooms.add(new Room(room))
+        Rooms.clipper.update()
+				app.tube("builder-pick-room", room)
+      },
+      redo: function(room){
+        Rooms.remove(room)
+        Rooms.clipper.update()
+      },
+		},
+		
+		//
+
+		{
+			type: "update-wallpaper",
+      undo: function(state){
+      },
+      redo: function(state){
+      },
+		},
+		
+	])
+})()
diff --git a/public/assets/javascripts/rectangles/models/rect.js b/public/assets/javascripts/rectangles/models/rect.js
index ec32ab7..5952f6a 100644
--- a/public/assets/javascripts/rectangles/models/rect.js
+++ b/public/assets/javascripts/rectangles/models/rect.js
@@ -39,6 +39,10 @@
 	Rect.prototype.clone = function(){
 		return new Rect( this.x.clone(), this.y.clone() )
 	}
+	Rect.prototype.assign = function(r) {
+	  this.x.assign(r.x)
+	  this.y.assign(r.y)
+	}
 	Rect.prototype.center = function(){
 		return new vec2(this.x.midpoint(), this.y.midpoint())
 	}
diff --git a/public/assets/javascripts/rectangles/models/room.js b/public/assets/javascripts/rectangles/models/room.js
index 937c928..33a94d0 100644
--- a/public/assets/javascripts/rectangles/models/room.js
+++ b/public/assets/javascripts/rectangles/models/room.js
@@ -40,6 +40,14 @@
 		this.focused = false
 	}
 	
+	Room.prototype.copy = function(){
+	  return {
+	    id: this.id,
+	    rect: this.rect.clone(),
+	    height: this.height,
+	  }
+	}
+	
 	Room.prototype.toString = function(){
 		return this.rect.toString()
 	}
diff --git a/public/assets/javascripts/rectangles/models/vec2.js b/public/assets/javascripts/rectangles/models/vec2.js
index 104c6f7..214feb9 100644
--- a/public/assets/javascripts/rectangles/models/vec2.js
+++ b/public/assets/javascripts/rectangles/models/vec2.js
@@ -17,6 +17,10 @@
 	vec2.prototype.clone = function(){
 		return new vec2(this.a, this.b)
 	}
+	vec2.prototype.assign = function(v){
+		this.a = v.a
+		this.b = v.b
+	}
 	vec2.prototype.abs = function(){
 		if (this.b < this.a) {
 			this.invert()
diff --git a/public/assets/javascripts/rectangles/models/wall.js b/public/assets/javascripts/rectangles/models/wall.js
index fdc91fd..460963b 100644
--- a/public/assets/javascripts/rectangles/models/wall.js
+++ b/public/assets/javascripts/rectangles/models/wall.js
@@ -52,7 +52,16 @@
 					// base.randomize_colors()
 					// console.log(sidesToString(base.side))
 					if (Scenery.nextMedia) {
-						Scenery.addNextToWall(base, mx)
+					var scenery = Scenery.addNextToWall(base)
+					
+  					UndoStack.push({
+  					  type: 'create-scenery',
+  					  undo: { id: scenery.id },
+              redo: scenery.serialize(),
+  					})
+
+  					// TODO: watch individual scenery object here
+  					Minotaur.watch( app.router.editorView.settings )
 					}
 					else if (Scenery.nextWallpaper) {
 						base.wallpaper()
@@ -135,18 +144,15 @@
 	Wall.prototype.wallpaper = function(){
 		var useX = this.side & FRONT_BACK
 		var shouldFlip = this.side & (LEFT | BACK)
-		this.siblings().forEach(function(w){
-			w.mx.forEach(function(mx){
-				
-				var partitionOffset = useX ? mx.x : mx.z
-				if (shouldFlip) partitionOffset *= -1
-				partitionOffset += mx.width/2
-				var floorOffset = mx.y + mx.height/2
+		this.mx.forEach(function(mx){
+      var partitionOffset = useX ? mx.x : mx.z
+      if (shouldFlip) partitionOffset *= -1
+      partitionOffset += mx.width/2
+      var floorOffset = mx.y + mx.height/2
 
-				mx.el.style.backgroundImage = Scenery.nextWallpaper
-				mx.el.style.backgroundPosition = (~~partitionOffset) + "px " + (~~floorOffset) + "px"
-			})
-		})
+      mx.el.style.backgroundImage = Scenery.nextWallpaper
+      mx.el.style.backgroundPosition = (~~partitionOffset) + "px " + (~~floorOffset) + "px"
+    })
 	}
 	
 	Wall.prototype.outline = function(){
diff --git a/public/assets/javascripts/rectangles/util/constants.js b/public/assets/javascripts/rectangles/util/constants.js
index 58cb1a5..b9485ca 100644
--- a/public/assets/javascripts/rectangles/util/constants.js
+++ b/public/assets/javascripts/rectangles/util/constants.js
@@ -8,6 +8,12 @@ var TOP = CEILING, BOTTOM = FLOOR,
 		BOTTOM_RIGHT = BOTTOM | RIGHT,
 		TOP_BOTTOM = TOP | BOTTOM
 
+var FRONT_LEFT = FRONT | LEFT,
+    FRONT_RIGHT = FRONT | RIGHT,
+    BACK_LEFT = BACK | LEFT,
+    BACK_RIGHT = BACK | RIGHT
+
+
 var height_min = 200,
 		height_max = 2000,
 		side_min = 10,
diff --git a/public/assets/javascripts/rectangles/util/keys.js b/public/assets/javascripts/rectangles/util/keys.js
index 5a5c9d2..62d763f 100644
--- a/public/assets/javascripts/rectangles/util/keys.js
+++ b/public/assets/javascripts/rectangles/util/keys.js
@@ -19,7 +19,7 @@ var keys = (function(){
 				break;
 			default:
 				if (keys.debug) console.log(key)
-				base.tube(key)
+				base.tube(key, e)
 				break;
 		}
 	})
@@ -158,8 +158,8 @@ var keys = (function(){
 		'backslash' : '220',
 		'closebracket' : '221',
 		'single_quote' : '222'
-	}
-	var KEY_NAMES = invert_hash(KEYCODES)
+	},
+	KEY_NAMES = invert_hash(KEYCODES)
 	
 	return base
 })()
\ No newline at end of file
diff --git a/public/assets/javascripts/rectangles/util/measurement.js b/public/assets/javascripts/rectangles/util/measurement.js
new file mode 100644
index 0000000..d6a0b35
--- /dev/null
+++ b/public/assets/javascripts/rectangles/util/measurement.js
@@ -0,0 +1,82 @@
+$.fn.resetUnitVal = function(){
+	this.each(function(){
+		var n = $(this).data("px")
+		$(this).unitVal(n)
+	});
+}
+
+$.fn.unitVal = function(n){
+	var s
+	if (typeof n === "undefined") {
+		s = $(this).val()
+		n = stringToMeasurement( s )
+		if (! n || isNaN(n)) {
+			n = $(this).data("px")
+		}
+	}
+	s = measurementToString( n )
+	$(this).val( s ).data("px", n)
+	return n
+}
+
+function measurementToString( n ) {
+	var s, ft, inch
+	switch (app.units) {
+		case 'm':
+			s = round(n/36 * 0.3048 * 100) / 100 + " m"
+			break
+		case 'ft':
+			ft = floor(n / 36)
+			inch = abs(round((n % 36) / 3))
+			s = ft + "'"
+			if (inch > 0) {
+				s += " " + inch + '"'
+			}
+			break
+		case 'px':
+		default:
+			s = round(n) + " px"
+			break
+	}
+	return s
+}
+function stringToMeasurement( s ) {
+	var ft, inch, ft_in, type
+	if (! s.match(/[0-9]/)) {
+		return NaN
+	}
+	if (s.indexOf("'") !== -1 || s.indexOf('"') !== -1 || s.indexOf('ft') !== -1) {
+		ft_in = s.match(/[0-9.]+/g)
+		if (ft_in.length >= 2) {
+			ft = parseFloat( ft_in[0] )
+			inch = parseFloat( ft_in[1] )
+		}
+		else if (ft_in.length == 1) {
+			if (s.indexOf('"') !== -1) {
+				ft = 0
+				inch = parseFloat( ft_in[0] )
+			}
+			else {
+				ft = parseFloat( ft_in[0] )
+				inch = 0
+			}
+		}
+		else {
+			ft = inch = 0
+		}
+		n = ft * 36 + inch * 3
+	}
+	else if (s.indexOf("m") !== -1) {
+		n = parseFloat(s.match(/[0-9.]+/)) * 36 / 0.3048
+	}
+	else if (s.indexOf("px") !== -1) {
+		n = parseFloat(s.match(/[0-9.]+/))
+	}
+	else {
+		n = abs( stringToMeasurement( s + app.units ) )
+	}
+	if (s.indexOf('-') !== -1) {
+		n *= -1
+	}
+	return n
+}
diff --git a/public/assets/javascripts/rectangles/util/minotaur.js b/public/assets/javascripts/rectangles/util/minotaur.js
new file mode 100644
index 0000000..039a053
--- /dev/null
+++ b/public/assets/javascripts/rectangles/util/minotaur.js
@@ -0,0 +1,64 @@
+(function(){
+
+  var Monitor = function () {
+    var base = this
+    base.$el = $("#minotaur")
+    base.timeout = null
+    base.delay = 500
+    base.objects = {}
+    
+    base.init = function () {
+      base.$el.removeClass()
+      base.$el.click(base.save)
+    }
+
+    base.watch = function (object) {
+      base.objects[object.type] = base.objects[object.type] || {}
+      base.objects[object.type][object._id] = object
+      base.clear()
+      base.timeout = setTimeout(base.save, base.delay)
+    }
+    
+    base.unwatch = function (object) {
+      if (base.objects[object.type] && base.objects[object.type][object._id]) {
+        delete base.objects[object.type][object._id]
+      }
+    }
+    
+    base.clear = function () {
+      if (base.timeout) clearTimeout(base.timeout)
+      base.timeout = false
+    }
+    
+    base.save = function () {
+      var saving = false
+      base.clear()
+      
+      for (var type in base.objects) {
+        for (var id in base.objects[type]) {
+          var obj = base.objects[type][id]
+          if (obj) {
+            obj.save(null, function(){ base.hide() }, function(){})
+          }
+          delete base.objects[type][id]
+          saving = true
+        }
+      }
+
+      saving ? base.show() : base.hide()
+    }
+    
+    base.show = function () {
+      base.$el.removeClass().addClass('saving')
+    }
+    
+    base.hide = function () {
+      base.$el.removeClass()
+    }
+    
+    base.init();
+  }
+  
+  window.Minotaur = new Monitor ();
+
+})()
diff --git a/public/assets/javascripts/rectangles/util/permissions.js b/public/assets/javascripts/rectangles/util/permissions.js
index adb2498..1b5a1b5 100644
--- a/public/assets/javascripts/rectangles/util/permissions.js
+++ b/public/assets/javascripts/rectangles/util/permissions.js
@@ -24,9 +24,26 @@ Permissions.prototype.assign = function (key, state) {
 	return state
 }
 
+Permissions.prototype.add = function (key) {	
+	var base = this
+	base[key] = true
+}
+
+Permissions.prototype.remove = function (key) {	
+	var base = this
+	base[key] = true
+}
+
 Permissions.prototype.clear = function () {	
 	var base = this
 	base.keys.forEach(function(op){
 		base[op] = false
 	})
 }
+
+Permissions.prototype.log = function () {
+  var base = this
+  base.keys.forEach(function(op){
+    console.log(op, base[op])
+  })
+}
\ No newline at end of file
diff --git a/public/assets/javascripts/rectangles/util/undo.js b/public/assets/javascripts/rectangles/util/undostack.js
index 3700817..b93c79e 100644
--- a/public/assets/javascripts/rectangles/util/undo.js
+++ b/public/assets/javascripts/rectangles/util/undostack.js
@@ -1,6 +1,7 @@
 (function(){
 
   var UndoStack = function(){
+    this.debug = true
     this.stack = []
     this.types = {}
     this.pointer = -1
@@ -17,7 +18,8 @@
   UndoStack.prototype.undo = function(){
     if (this.pointer == -1) return false
     var action = this.stack[this.pointer]
-    this.types[ action.type ].undo(action)
+    this.debug && console.log("undo", action.type)
+    this.types[ action.type ].undo(action.undo)
     this.pointer--
     return this.pointer > -1
   }
@@ -25,13 +27,21 @@
     if (this.pointer == this.stack.length-1) return false
     this.pointer++
     var action = this.stack[this.pointer]
-    this.types[ action.type ].redo(action)
+    this.debug && console.log("redo", action.type)
+    this.types[ action.type ].redo(action.redo)
     return this.pointer < this.stack.length-1
   }
   UndoStack.prototype.register = function(actionType){
-    this.types[ actionType.type ] = actionType
+  	if (actionType.length) {
+  		actionType.forEach(this.registerOne.bind(this))
+  	}
+  	else {
+  		this.registerOne(actionType)
+		}
   }
-  
+  UndoStack.prototype.registerOne = function(actionType){
+		this.types[ actionType.type ] = actionType
+	}  
   if ('window' in this) {
     window.UndoStack = new UndoStack
   }