merge

1 files changed, 72 insertions, 19 deletions

diff --git a/public/assets/javascripts/rectangles/models/wall.js b/public/assets/javascripts/rectangles/models/wall.js
index dc38183..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(){
@@ -68,12 +68,12 @@
 				},
 */
 				mousedown: function(e){
-					if (Scenery.nextMedia) {
-            var offset = offsetFromPoint(e, mx.el)
-            if (! offset) { return }
+          var offset = offsetFromPoint(e, mx.el)
+          if (! offset) { return }
 
-            var pos = base.mxOffsetToPosition( offset, index )
+          var pos = base.mxOffsetToPosition( offset, index )
 
+					if (Scenery.nextMedia) {
             var scenery = Scenery.addNextToWall({
             	wall: base,
             	index: index,
@@ -116,7 +116,7 @@
             Minotaur.watch( app.router.editorView.settings )
           }
 					else {
-						app.controller.hideExtras()
+						app.controller.pickWall(base, pos)
 					}
 				}
 			})
@@ -127,8 +127,6 @@
 		if (! shouldFlip) {
 			this.mx.reverse()
 		}
-
-		// this.outline(wallColor, outlineColor)
 	}
 	
 	Wall.prototype.serialize = function(){
@@ -214,21 +212,76 @@
 	}
 	
 	Wall.prototype.wallpaper = function(background){
-		var useX = this.side & FRONT_BACK
-		var shouldFlip = this.side & (LEFT | BACK)
-		
-		this.background = background || "none"
+	  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()
+	}
+	
+	Wall.prototype.wallpaperLoad = function(url){
+	  if (url !== "none") {
+	    url = "url(" + url + ")"
+	  }
 		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 = background
-      mx.el.style.backgroundPosition = (~~partitionOffset) + "px " + (~~floorOffset) + "px"
+      mx.el.style.backgroundImage = url
     })
 	}
+
+	Wall.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 useX = this.side & FRONT_BACK
+		var shouldFlip = this.side & (LEFT | BACK)
+
+		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))
+	}
 	
 	Wall.prototype.outline = function(wallColor, outlineColor){
 		var useX = this.side & FRONT_BACK