render thumbnails as masks

3 files changed, 46 insertions, 7 deletions

diff --git a/public/assets/javascripts/rectangles/engine/map/draw.js b/public/assets/javascripts/rectangles/engine/map/draw.js
index 07e2d9f..6c27ff1 100644
--- a/public/assets/javascripts/rectangles/engine/map/draw.js
+++ b/public/assets/javascripts/rectangles/engine/map/draw.js
@@ -38,18 +38,24 @@ Map.Draw = function(map, opt){
 		ctx.restore()
 	}
 
+  // changes the ctx temporarily
 	draw.render = function(){
-		// change the ctx temporarily
+		var thumbnail_side = 1000
+		
+		var extent = Rooms.extent()
+		var center = extent.center()
+		var zoom = thumbnail_side / Math.max( extent.width(), extent.height() ) * 0.99
+
 		var canvas = document.createElement("canvas")
 		ctx = canvas.getContext('2d')
-		canvas.width = map.canvas.width
-		canvas.height = map.canvas.height
+		canvas.width = thumbnail_side
+		canvas.height = thumbnail_side
 		
 		draw.clear()
 
-		ctx.translate( map.dimensions.a * 1/2, map.dimensions.b * 1/2)
-		ctx.scale( map.zoom, map.zoom )
-		ctx.translate( map.center.a,  map.center.b )
+		ctx.translate( thumbnail_side * 1/2, thumbnail_side * 1/2)
+		ctx.scale( zoom, zoom )
+		ctx.translate( center.a, -center.b )
 		ctx.scale( -1, 1 )
 
 		draw.regions(Rooms.regions, ["#fff"], null)
@@ -73,7 +79,7 @@ Map.Draw = function(map, opt){
 
 		// reset the ctx
 		ctx = map.canvas.getContext("2d")
-		
+
 		return canvas
 	}
 
diff --git a/public/assets/javascripts/rectangles/engine/rooms/_rooms.js b/public/assets/javascripts/rectangles/engine/rooms/_rooms.js
index 6f96275..0c3cfd4 100644
--- a/public/assets/javascripts/rectangles/engine/rooms/_rooms.js
+++ b/public/assets/javascripts/rectangles/engine/rooms/_rooms.js
@@ -118,6 +118,16 @@
       return data
 		}
 
+    base.extent = function(){
+      var extent = new Rect ( new vec2(Infinity, -Infinity), new vec2(Infinity, -Infinity) )
+
+      base.forEach(function(room){
+        extent.expand(room.rect)
+      })
+    
+      return extent
+    }
+
 		base.sorted_by_position = function(){
 			return sort.rooms_by_position( base.values() )
 		}
diff --git a/public/assets/javascripts/rectangles/models/rect.js b/public/assets/javascripts/rectangles/models/rect.js
index a08176a..00f2c55 100644
--- a/public/assets/javascripts/rectangles/models/rect.js
+++ b/public/assets/javascripts/rectangles/models/rect.js
@@ -141,6 +141,29 @@
 	Rect.prototype.width = function(){ return this.x.length() }
 	Rect.prototype.height = function(){ return this.y.length() }
 	Rect.prototype.delta = function(){ return new vec2( this.x.magnitude(), this.y.magnitude() ) }
+	Rect.prototype.expand = function(rect){
+	  this.x.a = Math.min( this.x.a, rect.x.a )
+	  this.x.b = Math.max( this.x.b, rect.x.b )
+	  this.y.a = Math.min( this.y.a, rect.y.a )
+	  this.y.b = Math.max( this.y.b, rect.y.b )
+	  return this
+	}
+	Rect.prototype.square = function(){
+	  var width = this.x.length()
+	  var height = this.y.length()
+	  var diff
+	  if (width < height) {
+	    diff = (height - width) / 2
+	    this.x.a -= diff
+	    this.x.b += diff
+	  }
+	  else {
+	    diff = (width - height) / 2
+	    this.y.a -= diff
+	    this.y.b += diff
+	  }
+	  return this
+	}
 	Rect.prototype.toString = function(){
 		var sides = sidesToString(this.sides)
 		var s = "[" + this.x.toString() + " " + this.y.toString() + "] " + sides