preserve proportions on scale (also smoother now)

7 files changed, 36 insertions, 42 deletions

diff --git a/public/assets/javascripts/mx/extensions/mx.movements.js b/public/assets/javascripts/mx/extensions/mx.movements.js
index d02b2d2..f176e8b 100644
--- a/public/assets/javascripts/mx/extensions/mx.movements.js
+++ b/public/assets/javascripts/mx/extensions/mx.movements.js
@@ -25,7 +25,7 @@ MX.Movements = function (cam, viewHeight) {
 			vx = vy = vz = 0,
 			creepFactor = 0.3
 
-	var DEFAULT_SCALE = scale = 1.0
+	var DEFAULT_SCALE = 1.0, scale = DEFAULT_SCALE
 	
 	var pos = { x: 0, y: 0, z: 0, rotationX: 0, rotationY: 0 }
 
diff --git a/public/assets/javascripts/rectangles/engine/scenery/move.js b/public/assets/javascripts/rectangles/engine/scenery/move.js
index ce4f297..8acc1c2 100644
--- a/public/assets/javascripts/rectangles/engine/scenery/move.js
+++ b/public/assets/javascripts/rectangles/engine/scenery/move.js
@@ -56,11 +56,11 @@ Scenery.move = function(base){
 	function switch_wall (e, new_wall, cursor){
 		if (! dragging) return
 		if (new_wall.uid == base.wall.uid) return
-		if (! new_wall.fits(base.media)) return
+		if (! new_wall.fits(base.media, base.scale)) return
 
 		var old_wall_side = base.wall.side
 		var wall_group = old_wall_side | new_wall.side
-		
+
 		base.set_wall(new_wall)
 
 		bounds = base.bounds
diff --git a/public/assets/javascripts/rectangles/engine/scenery/resize.js b/public/assets/javascripts/rectangles/engine/scenery/resize.js
index 50c97bd..ac13326 100644
--- a/public/assets/javascripts/rectangles/engine/scenery/resize.js
+++ b/public/assets/javascripts/rectangles/engine/scenery/resize.js
@@ -6,7 +6,7 @@ Scenery.resize = new function(){
 	var obj
 	var x, y, z, bounds
 	var dragging = false
-	var dimensions, position
+	var dimensions, position, scale
 
 	var dots = [], dot, selected_dot
 
@@ -147,58 +147,48 @@ Scenery.resize = new function(){
 		selected_dot = selection[0]
 		dragging = true
 		
-		dimensions = new vec2(obj.mx.width, obj.mx.height)
+		dimensions = obj.dimensions
 		position = new vec3(obj.mx.x, obj.mx.y, obj.mx.z)
+		scale = obj.mx.scale
 
-		console.log("down on", sidesToString(selected_dot.side))
-		
 		document.body.classList.add("dragging")
 	}
 
 	function drag (e, cursor){
 		if (! dragging) return
-		// cursor.x.magnitude()*cursor_amp
 
 		var x_sign = selected_dot.side & LEFT ? -1 : selected_dot.side & RIGHT ? 1 : 0
 		var y_sign = selected_dot.side & TOP ? -1 : selected_dot.side & BOTTOM ? 1 : 0
-
+		var width = cursor.x.magnitude()
+		var height = cursor.y.magnitude()
 		var mag = cursor.magnitude()
-	
-		// fix resizing here	
-//		obj.mx.scale = obj.media.scale 
-//		var translation = new vec2( x_sign * cursor.x.magnitude() * cursor_amp, y_sign * cursor.y.magnitude() * cursor_amp )
+		var old_width = dimensions.a * scale
 
-		if (selected_dot.side & LEFT_RIGHT) {
-// 			obj.mx.width = dimensions.a + translation.a
-			obj.mx.x = position.a + x_sign * cos(rotationY) * mag/2 * obj.mx.scale
-			obj.mx.z = position.c + x_sign * sin(rotationY) * mag/2 * obj.mx.scale
+		if (abs(width) > abs(height)) {
+			mag = x_sign * mag * sign(width)
 		}
-		if (selected_dot.side & TOP_BOTTOM) {
-// 			obj.mx.height = dimensions.b + translation.b
-			obj.mx.y = position.b - y_sign * mag/2 * obj.mx.scale
+		else {
+			mag = y_sign * mag * sign(height)
 		}
 		
-// 		bounds = obj.wall.bounds_for(dimensions)
+ 		obj.mx.scale = scale * (old_width + mag) / old_width
 
-// 		base.mx.y = bounds.y.clamp( y - cursor.y.magnitude()*cursor_amp )
-// 		switch (base.wall.side) {
-// 			case FRONT:
-// 			case BACK:
-// 				base.mx.x = bounds.x.clamp( x + cos(wall_rotation[base.wall.side]) * cursor.x.magnitude()*cursor_amp )
-// 				break
-// 			case LEFT:
-// 			case RIGHT:
-// 				base.mx.z = bounds.x.clamp( z + sin(wall_rotation[base.wall.side]) * cursor.x.magnitude()*cursor_amp )
-// 				break
-// 		}
+		if (selected_dot.side & LEFT_RIGHT) {
+			obj.mx.x = position.a + cos(rotationY) * mag/2 * (x_sign)
+			obj.mx.z = position.c + sin(rotationY) * mag/2 * (x_sign)
+		}
+		if (selected_dot.side & TOP_BOTTOM) {
+			obj.mx.y = position.b - mag/2 * y_sign
+		}
 
 		base.move_dots()
-		
 	}
 
 	function up (e, cursor){
 		dragging = false
 		selected_dot = null
+		obj.scale = obj.mx.ops.scale = obj.mx.scale
+		obj.set_wall()
 		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 f892c0c..1aa037c 100644
--- a/public/assets/javascripts/rectangles/engine/scenery/types/_object.js
+++ b/public/assets/javascripts/rectangles/engine/scenery/types/_object.js
@@ -8,6 +8,7 @@ Scenery.types.base = Fiber.extend(function(base){
 			this.move = new Scenery.move (this)
 			this.media = opt.media
 			this.dimensions = new vec2(this.media.width, this.media.height)
+			this.scale = this.media.scale
 			
 			if (opt.wall) {
 				this.set_wall(opt.wall)
@@ -42,7 +43,7 @@ Scenery.types.base = Fiber.extend(function(base){
 
 		set_wall: function(wall){
 			this.wall = wall || this.wall
-			this.bounds = this.wall.bounds_for(this.media)
+			this.bounds = this.wall.bounds_for(this.media, this.scale)
 			this.center = this.wall.center()
 		},
 
diff --git a/public/assets/javascripts/rectangles/engine/scenery/types/image.js b/public/assets/javascripts/rectangles/engine/scenery/types/image.js
index b5b5551..b668e6a 100644
--- a/public/assets/javascripts/rectangles/engine/scenery/types/image.js
+++ b/public/assets/javascripts/rectangles/engine/scenery/types/image.js
@@ -5,7 +5,7 @@ Scenery.types.image = Scenery.types.base.extend(function(base){
 	
 		init: function(opt){
 			base.init.call(this, opt)
-			this.scale = this.media.scale = 300 / max(300, this.media.width)
+			this.scale = 300 / max(300, this.media.width)
 
 			this.build()
 			this.bind()
@@ -25,7 +25,6 @@ Scenery.types.image = Scenery.types.base.extend(function(base){
 
 		serialize: function(){
 			var data = base.serialize.call(this)
-// 			console.log(data)
 			return data
 		},
 	
diff --git a/public/assets/javascripts/rectangles/models/rect.js b/public/assets/javascripts/rectangles/models/rect.js
index 0bab0e4..a4fbd87 100644
--- a/public/assets/javascripts/rectangles/models/rect.js
+++ b/public/assets/javascripts/rectangles/models/rect.js
@@ -28,6 +28,9 @@ window.Rect = (function(){
 	Rect.prototype.magnitude = function(){
 		return dist(this.x.a, this.y.a, this.x.b, this.y.b)
 	}
+	Rect.prototype.maxDimension = function(){
+		return abs(this.width) > abs(this.height) ? this.width : this.height
+	}
 
 	Rect.prototype.mul = function(n){
 		this.x.mul(n)
diff --git a/public/assets/javascripts/rectangles/models/wall.js b/public/assets/javascripts/rectangles/models/wall.js
index e327070..d0a2045 100644
--- a/public/assets/javascripts/rectangles/models/wall.js
+++ b/public/assets/javascripts/rectangles/models/wall.js
@@ -49,19 +49,20 @@ window.Wall = (function(){
 		})
 	}
 	
-	Wall.prototype.bounds_for = function(img) {
+	Wall.prototype.bounds_for = function(img, scale) {
+		scale = scale || 1
 		var coord = this.side & FRONT_BACK ? this.rect.x : this.rect.y
-		var halfWidth = img.width/2 * img.scale
-		var halfHeight = img.height/2 * img.scale
+		var halfWidth = img.width/2 * scale
+		var halfHeight = img.height/2 * scale
 
 		return new Rect( new vec2( coord.a + halfWidth, coord.b - halfWidth ),
 		                 new vec2( halfHeight, Rooms.list[this.room].height - halfHeight ) )
 	}
-	Wall.prototype.fits = function(img){
-		if (this.side & FRONT_BACK && this.rect.x.length() < img.width * img.scale) {
+	Wall.prototype.fits = function(img, scale){
+		if (this.side & FRONT_BACK && this.rect.x.length() < img.width * scale) {
 			return false
 		}
-		if (this.side & LEFT_RIGHT && this.rect.y.length() < img.width * img.scale) {
+		if (this.side & LEFT_RIGHT && this.rect.y.length() < img.width * scale) {
 			return false
 		}
 		return true