nomenclature for addressing floors, ceilings

9 files changed, 186 insertions, 9 deletions

diff --git a/public/assets/javascripts/rectangles/engine/rooms/_walls.js b/public/assets/javascripts/rectangles/engine/rooms/_walls.js
index f0cd558..b3611c8 100644
--- a/public/assets/javascripts/rectangles/engine/rooms/_walls.js
+++ b/public/assets/javascripts/rectangles/engine/rooms/_walls.js
@@ -35,6 +35,7 @@
 		var base = this
 		
 		base.list = []
+		base.floors = []
 		base.lookup = {}
 		base.colors = {}
 
@@ -57,11 +58,21 @@
 		    base.lookup[wall.id] = wall
 		  })
 		}
+
+		base.assignFloors = function(floors){
+		  base.floors = floors
+		  floors.forEach(function(floor){
+		    base.lookup[floor.id] = floor
+		  })
+		}
 		
 		base.bind = function(){
 			base.list.forEach(function(wall){
 				wall.bind()
 			})
+			base.floors.forEach(function(floor){
+			  floor.bind()
+			})
 		}
 
 		base.count = function(){
diff --git a/public/assets/javascripts/rectangles/engine/rooms/clipper.js b/public/assets/javascripts/rectangles/engine/rooms/clipper.js
index 33e3a84..0382758 100644
--- a/public/assets/javascripts/rectangles/engine/rooms/clipper.js
+++ b/public/assets/javascripts/rectangles/engine/rooms/clipper.js
@@ -49,7 +49,7 @@
 				Rooms.regions = regions = []
 				return
 			}
-		
+		  
 			base.reset_rects()
 			base.clip_rects()
 			var culled = base.cull_rects_iterative()
diff --git a/public/assets/javascripts/rectangles/engine/rooms/grouper.js b/public/assets/javascripts/rectangles/engine/rooms/grouper.js
index 663d29d..ec776a2 100644
--- a/public/assets/javascripts/rectangles/engine/rooms/grouper.js
+++ b/public/assets/javascripts/rectangles/engine/rooms/grouper.js
@@ -48,13 +48,16 @@
 		
 		base.build = function (){
 			var walls = []
+			var floors = []
 			var collections = base.collect()
 			base.cull(collections)
 			base.group(walls, collections, FRONT)
 			base.group(walls, collections, BACK)
 			base.group(walls, collections, LEFT)
 			base.group(walls, collections, RIGHT)
+			base.groupFloors(floors, collections)
 			Walls.assign( walls )
+			Walls.assignFloors( floors )
 			Walls.bind()
 		}
 		base.collect = function(){			
@@ -63,12 +66,16 @@
 			collections[BACK] = []
 			collections[LEFT] = []
 			collections[RIGHT] = []
+			collections[FLOOR] = []
+			collections[CEILING] = []
 			
 			Rooms.forEach(function(room){
 				room.mx_walls.forEach(function(mx){
 					var side = mx.side || mx.half_side
 					collections[side].push(mx)
 				})
+				collections[FLOOR] = collections[FLOOR].concat( room.mx_floor )
+				collections[CEILING] = collections[CEILING].concat( room.mx_ceiling )
 			})
 			
 			base.cull(collections)
@@ -161,6 +168,18 @@
       
 			return walls
 		}
+		base.groupFloors = function(floors, collections){
+		  var floor = new Floor ({
+		    id: 'floor',
+		    mx: collections[FLOOR]
+		  })
+		  var ceiling = new Floor ({
+		    id: 'ceiling',
+		    mx: collections[CEILING]
+		  })
+		  floors.push(floor)
+		  floors.push(ceiling)
+		}
 
 	}
 
diff --git a/public/assets/javascripts/rectangles/models/floor.js b/public/assets/javascripts/rectangles/models/floor.js
new file mode 100644
index 0000000..ee264c7
--- /dev/null
+++ b/public/assets/javascripts/rectangles/models/floor.js
@@ -0,0 +1,146 @@
+(function(){
+
+	var vec2, Rect, sort
+	if ('window' in this) {
+		vec2 = window.vec2
+		Rect = window.Rect
+		sort = window.sort
+	}
+	else {
+		vec2 = require('./vec2')
+		Rect = require('./rect')
+		UidGenerator = require('../util/uid')
+	}
+	
+	var Floor = function(opt){
+		this.id = opt.id
+		this.side = opt.side
+		this.mx = opt.mx
+	}
+	
+	Floor.prototype.serialize = function(){
+	  return {
+	    id: this.id,
+	    background: this.background,
+	  }
+	}
+	
+	Floor.prototype.deserialize = function(data){
+	  this.wallpaper( data.background )
+	}
+
+	Floor.prototype.bind = function(){
+		var base = this
+		base.$els = $( this.mx.map(function(mx){ return mx.el }) )
+		console.log("HELLO")
+		this.mx.forEach(function(mx, index){
+			$(mx.el).bind({
+				mousedown: function(e){
+				  console.log("clicked on", base.id)
+					if (Scenery.nextWallpaper) {
+					  var oldState = base.serialize()
+						base.wallpaper(Scenery.nextWallpaper)
+						Scenery.nextWallpaper = null
+
+  					UndoStack.push({
+  					  type: 'update-wallpaper',
+  					  undo: oldState,
+              redo: base.serialize(),
+  					})
+
+            // TODO: watch individual scenery object here
+            Minotaur.watch( app.router.editorView.settings )
+          }
+				}
+			})
+		})
+
+    // flip the mx order
+		var shouldFlip = this.side & (CEILING)
+		if (! shouldFlip) {
+			this.mx.reverse()
+		}
+	}
+
+	Floor.prototype.color = function(color){
+		this.$els.css("background-color", color)
+	}
+	
+	Floor.prototype.wallpaper = function(background){
+	  if (! background) {
+	    background = { src: "none" }
+	  }
+	  else if (typeof background == "string") {
+	    background = { src: background }
+	  }
+	  else if (! background.src) {
+	    background = { src: "none" }
+	  }
+    background.x = background.x || 0
+    background.y = background.y || 0
+    background.scale = background.scale || 1
+
+		this.background = background
+		this.background.src = this.background.src.replace("url(","").replace(")","")
+
+		if (this.background.src == "none") {
+		  this.wallpaperLoad(this.background.src)
+		  return
+		}
+		
+		var img = new Image ()
+		img.onload = function(){
+		  this.backgroundImage = img
+		  this.wallpaperLoad(this.background.src)
+		  this.wallpaperPosition(background)
+		}.bind(this)
+		img.src = this.background.src
+		img.complete && img.onload()
+	}
+	
+	Floor.prototype.wallpaperLoad = function(url){
+	  if (url !== "none") {
+	    url = "url(" + url + ")"
+	  }
+		this.mx.forEach(function(mx){
+      mx.el.style.backgroundImage = url
+    })
+	}
+
+	Floor.prototype.wallpaperPosition = function(background){
+	  if (this.background.src == "none") { return }
+	  this.background.x = background.x || this.background.x
+	  this.background.y = background.y || this.background.y
+	  this.background.scale = background.scale || this.background.scale || 1
+	  
+		var shouldFlip = this.side & (CEILING)
+
+		var mx, dx, dy
+		var w = Math.round( this.backgroundImage.naturalWidth * this.background.scale )
+		var h = Math.round( this.backgroundImage.naturalHeight * this.background.scale )
+
+		this.surface.faces.forEach(function(face, i){
+      
+      if (shouldFlip) {
+        mx = this.mx[this.mx.length-1-i]
+        dx = Math.round( this.background.x + face.x.a )
+        dy = Math.round( this.background.y + face.y.b )
+      }
+      else {
+        mx = this.mx[i]
+        dx = Math.round( this.background.x - face.x.b )
+        dy = Math.round( this.background.y + face.y.b )
+      }
+      
+      mx.el.style.backgroundPosition = dx + 'px ' + dy + 'px'
+      mx.el.style.backgroundSize = w + 'px ' + h + 'px'
+    }.bind(this))
+	}
+
+	if ('window' in this) {
+		window.Floor = Floor
+	}
+	else {
+		module.exports = Floor
+	}
+})()
diff --git a/public/assets/javascripts/rectangles/models/room.js b/public/assets/javascripts/rectangles/models/room.js
index 0f09325..1a4606c 100644
--- a/public/assets/javascripts/rectangles/models/room.js
+++ b/public/assets/javascripts/rectangles/models/room.js
@@ -154,7 +154,7 @@
 			}
 //    if (bitcount(wall_collision) > 1) {
 //  				collision |= wall_collision
-// 			}
+// 		}
 		})
 		return collision
 	}
diff --git a/public/assets/javascripts/rectangles/models/wall.js b/public/assets/javascripts/rectangles/models/wall.js
index 820fb5f..8174de7 100644
--- a/public/assets/javascripts/rectangles/models/wall.js
+++ b/public/assets/javascripts/rectangles/models/wall.js
@@ -19,7 +19,7 @@
 		this.side = opt.side
 		this.surface = opt.surface
 		this.mx = opt.mx
-		this.background = ""
+		this.background = { src: "none" }
 	}
 	
 	Wall.prototype.toString = function(){
@@ -127,8 +127,6 @@
 		if (! shouldFlip) {
 			this.mx.reverse()
 		}
-
-		// this.outline(wallColor, outlineColor)
 	}
 	
 	Wall.prototype.serialize = function(){
@@ -283,10 +281,8 @@
       mx.el.style.backgroundPosition = dx + 'px ' + dy + 'px'
       mx.el.style.backgroundSize = w + 'px ' + h + 'px'
     }.bind(this))
-    bbb = this
 	}
 	
-
 	Wall.prototype.outline = function(wallColor, outlineColor){
 		var useX = this.side & FRONT_BACK
 		var mx = this.mx
diff --git a/public/assets/javascripts/rectangles/util/constants.js b/public/assets/javascripts/rectangles/util/constants.js
index 4c6b3cc..198cc41 100644
--- a/public/assets/javascripts/rectangles/util/constants.js
+++ b/public/assets/javascripts/rectangles/util/constants.js
@@ -1,5 +1,6 @@
 var FRONT = 0x1, BACK = 0x2, LEFT = 0x4, RIGHT = 0x8, FLOOR = 0x10, CEILING = 0x20
-		FRONT_BACK = FRONT | BACK, LEFT_RIGHT = LEFT | RIGHT, FLOOR_CEILING = FLOOR | CEILING
+var FRONT_BACK = FRONT | BACK, LEFT_RIGHT = LEFT | RIGHT, FLOOR_CEILING = FLOOR | CEILING
+var WALL_SIDES = FRONT | BACK | LEFT | RIGHT
 
 var TOP = CEILING, BOTTOM = FLOOR,
 		TOP_LEFT = TOP | LEFT,
diff --git a/public/assets/javascripts/ui/editor/TextEditor.js b/public/assets/javascripts/ui/editor/TextEditor.js
index 1e35c12..0aa5aad 100644
--- a/public/assets/javascripts/ui/editor/TextEditor.js
+++ b/public/assets/javascripts/ui/editor/TextEditor.js
@@ -39,12 +39,15 @@ var TextEditor = FormView.extend({
         scale: 0.5,
         font: { family: 'Lato', size: 12, align: 'left' },
       }
-      
       this.createMode(true)
     }
+    else {
+      $("[data-role='toggle-text-editor']").removeClass("inuse")
+    }
   },
 
 	hide: function(scenery){
+	  Scenery.nextMedia = null
 		if (this.scenery) {
 			this.unbind()
 		}
diff --git a/views/partials/scripts.ejs b/views/partials/scripts.ejs
index f768160..21bed03 100644
--- a/views/partials/scripts.ejs
+++ b/views/partials/scripts.ejs
@@ -46,6 +46,7 @@
 <script type="text/javascript" src="/assets/javascripts/rectangles/models/tree.js"></script>
 <script type="text/javascript" src="/assets/javascripts/rectangles/models/room.js"></script>
 <script type="text/javascript" src="/assets/javascripts/rectangles/models/wall.js"></script>
+<script type="text/javascript" src="/assets/javascripts/rectangles/models/floor.js"></script>
 
 <script type="text/javascript" src="/assets/javascripts/rectangles/engine/rooms/_rooms.js"></script>
 <script type="text/javascript" src="/assets/javascripts/rectangles/engine/rooms/_walls.js"></script>