happy with refactor

1 files changed, 115 insertions, 0 deletions

diff --git a/assets/javascripts/rectangles/engine/scenery/image.js b/assets/javascripts/rectangles/engine/scenery/image.js
new file mode 100644
index 0000000..6434603
--- /dev/null
+++ b/assets/javascripts/rectangles/engine/scenery/image.js
@@ -0,0 +1,115 @@
+Scenery.image = function (wall, img) {
+
+	var base = this
+	var center
+	var x = 0, y = 0, z = 0, bounds
+	var dragging = false
+
+	// should be proportional to distance from wall
+	var cursor_amp = 1.5
+	
+	base.init = function(){
+		base.build()
+		base.bind()
+	}
+	
+	base.build = function(){
+		center = wall.center_for(img)
+		base.mx_img = new MX.Image({
+			src: img.src,
+			x: center.a,
+			y: Rooms.list[wall.room].height/2 - img.height/2 - 20,
+			z: center.b,
+			scale: 300/img.naturalWidth,
+			rotationY: wall_rotation[ wall.side ],
+			backface: false,
+		})
+		scene.add( base.mx_img )
+	}
+	
+	base.bind = function(){
+		Scenery.mouse.bind_el(base.mx_img.el)
+		Scenery.mouse.on("down", down)
+		Scenery.mouse.on("enter", switch_wall)
+		Scenery.mouse.on("drag", drag)
+		Scenery.mouse.on("up", up)
+	}
+
+	function down (e, cursor){
+		if (e.target != base.mx_img.el) return;
+		dragging = true
+		x = base.mx_img.x
+		y = base.mx_img.y
+		z = base.mx_img.z
+		bounds = wall.bounds_for(img)
+		document.body.classList.add("dragging")
+	}
+	
+	function switch_wall (e, new_wall, cursor){
+		if (! dragging) return
+		if (new_wall.uid == wall.uid) return
+		if (! new_wall.fits(img)) return
+
+		bounds = new_wall.bounds_for(img)
+		center = new_wall.center_for(img)
+
+		x = center.a
+		z = center.b
+		
+		var wall_group = wall.side | new_wall.side
+		
+		if (wall.side !== new_wall.side && wall_group !== FRONT_BACK && wall_group !== LEFT_RIGHT) {
+			switch (wall.side) {
+				case FRONT:
+					z = bounds.x.a
+					break
+				case BACK:
+					z = bounds.x.b
+					break
+				case LEFT:
+					x = bounds.x.a
+					break
+				case RIGHT:
+					x = bounds.x.b
+					break
+			}
+		}
+
+		cursor.x.a = cursor.x.b
+		
+		base.mx_img.move({
+			x: x,
+			z: z,
+			rotationY: wall_rotation[ new_wall.side ]
+		})
+		
+		wall = new_wall
+	}
+	
+	function drag (e, cursor){
+		if (! dragging) return
+		
+		base.mx_img.y = bounds.y.clamp( y - cursor.y.magnitude()*cursor_amp )
+		switch (wall.side) {
+			case FRONT:
+				base.mx_img.x = bounds.x.clamp( x - cursor.x.magnitude()*cursor_amp )
+				break
+			case BACK:
+				base.mx_img.x = bounds.x.clamp( x + cursor.x.magnitude()*cursor_amp )
+				break
+			case LEFT:
+				base.mx_img.z = bounds.x.clamp( z + cursor.x.magnitude()*cursor_amp )
+				break
+			case RIGHT:
+				base.mx_img.z = bounds.x.clamp( z - cursor.x.magnitude()*cursor_amp )
+				break
+		}
+	}
+
+	function up (e, cursor){
+		dragging = false
+		document.body.classList.remove("dragging")
+	}
+	
+	return base
+}