functioning blueprint scaler

8 files changed, 148 insertions, 9 deletions

diff --git a/public/assets/javascripts/rectangles/engine/map/draw.js b/public/assets/javascripts/rectangles/engine/map/draw.js
index 11ba3f8..cc2f4d8 100644
--- a/public/assets/javascripts/rectangles/engine/map/draw.js
+++ b/public/assets/javascripts/rectangles/engine/map/draw.js
@@ -198,7 +198,7 @@ Map.Draw = function(map, opt){
 
 	//
 
-	function line (x,y,a,b,translation){
+	var line = draw.line = function (x,y,a,b,translation){
 		if (translation) {
 			x += translation.a
 			a += translation.a
diff --git a/public/assets/javascripts/rectangles/engine/map/tools/line.js b/public/assets/javascripts/rectangles/engine/map/tools/line.js
new file mode 100644
index 0000000..8f409a8
--- /dev/null
+++ b/public/assets/javascripts/rectangles/engine/map/tools/line.js
@@ -0,0 +1,49 @@
+var LineTool = MapTool.extend(function(base){
+	var exports = {}
+	
+	var selected_point = null
+	
+	var line = exports.line = []
+	
+	var can_drag, dragging
+	
+	exports.down = function(e, cursor){
+	  this.cursor = cursor
+	  switch (line.length) {
+	    case 0:
+        line[0] = cursor.x_component()
+        can_drag = true
+        break
+      case 1:
+        line[1] = cursor.x_component()
+        can_drag = false
+        break
+      case 2:
+        line[0] = cursor.x_component()
+        line.pop()
+        can_drag = true
+        break
+    }
+	}
+	
+	exports.move = function(e, cursor){
+    this.cursor = cursor
+	}
+	
+	exports.drag = function(e, cursor){
+	  if (dragging) {
+	    line[1].a = cursor.x.b
+	    line[1].b = cursor.y.b
+	  }
+	  else if (can_drag && cursor.magnitude() > 10/map.zoom) {
+	    line[1] = cursor.y_component()
+	    dragging = true
+	  }
+	}
+	
+	exports.up = function(e, cursor){
+	  can_drag = dragging = false
+	}
+	
+	return exports
+})
\ No newline at end of file
diff --git a/public/assets/javascripts/rectangles/models/rect.js b/public/assets/javascripts/rectangles/models/rect.js
index c667cf5..92c8c9e 100644
--- a/public/assets/javascripts/rectangles/models/rect.js
+++ b/public/assets/javascripts/rectangles/models/rect.js
@@ -39,6 +39,12 @@
 	Rect.prototype.clone = function(){
 		return new Rect( this.x.clone(), this.y.clone() )
 	}
+	Rect.prototype.x_component = function(){
+	  return new vec2( this.x.a, this.y.a )
+	}
+	Rect.prototype.y_component = function(){
+	  return new vec2( this.x.b, this.y.b )
+	}
 	Rect.prototype.assign = function(r) {
 	  this.x.assign(r.x)
 	  this.y.assign(r.y)
diff --git a/public/assets/javascripts/ui/blueprint/BlueprintScaler.js b/public/assets/javascripts/ui/blueprint/BlueprintScaler.js
index a81c89b..addf9a9 100644
--- a/public/assets/javascripts/ui/blueprint/BlueprintScaler.js
+++ b/public/assets/javascripts/ui/blueprint/BlueprintScaler.js
@@ -1,10 +1,13 @@
 
-var BlueprintScaler = ModalView.extend({
+var BlueprintScaler = ModalFormView.extend({
 	el: ".blueprintScaler",
 	
+	method: "/api/media/scale",
+	
 	events: {
     "change [name=blueprint-dimensions]": "changeDimensions",
     "change [name=blueprint-units]": "changeUnits",
+    "click .uploadNewBlueprint": "showBlueprintUpload",
     "click #saveBlueprint": "save",
 	},
 	
@@ -12,6 +15,7 @@ var BlueprintScaler = ModalView.extend({
     this.$blueprintMap = this.$("#blueprintMap")
     this.$blueprintDimensionsRapper = this.$("#blueprintDimensions")
     this.$dimensions = this.$("[name=blueprint-dimensions]")
+    this.$pixels = this.$("[name=blueprint-pixels]")
     this.$units = this.$("[name=blueprint-units]")
     this.$save = this.$("#saveBlueprint")
 
@@ -24,23 +28,40 @@ var BlueprintScaler = ModalView.extend({
       zoom_min: -6.2,
       zoom_max: 1,
     })
-    map.ui.add_tool("arrow", new ArrowTool)
-    map.ui.add_tool("position", new PositionTool)
-    map.ui.set_tool("position")
+    this.lineTool = new LineTool
+    map.ui.add_tool("line", this.lineTool)
+    map.ui.set_tool("line")
     
     scene = scene || { camera: { x: 0, y: 0, z: 0 } }
     
     this.floorplan = new MX.Image ()
     
-    this.animate()
+    this.animating = false
+	},
+	
+	showBlueprintUpload: function(){
+	  this.parent.blueprintUpload.show()
 	},
 	
 	pick: function(media){
+	  this.media = media
+    
+    if (!! media.scale) {
+      this.parent.useFloorplan(media)
+    }
+
     this.floorplan.load({ media: media, keepImage: true })
+
+    if (! this.animating) {
+      this.animating = true
+      this.animate()
+    }
 	},
 	
 	animate: function(t){
     requestAnimationFrame(this.animate.bind(this))
+    
+    if (! this.animating) return
 
     var dt = t - this.last_t
     this.last_t = t
@@ -53,6 +74,27 @@ var BlueprintScaler = ModalView.extend({
     this.map.draw.translate()
 
     this.floorplan.draw(this.map.draw.ctx, true)
+    
+    this.map.draw.ctx.strokeStyle = "#f00"
+    this.map.draw.ctx.lineWidth = 2/map.zoom
+    switch (this.lineTool.line.length) {
+      case 1:
+        this.map.draw.line(
+          this.lineTool.line[0].a,
+          this.lineTool.line[0].b,
+          this.lineTool.cursor.x.a,
+          this.lineTool.cursor.y.a
+        )
+        break
+      case 2:
+        this.map.draw.line(
+          this.lineTool.line[0].a,
+          this.lineTool.line[0].b,
+          this.lineTool.line[1].a,
+          this.lineTool.line[1].b
+        )
+        break
+    }
 
     this.map.draw.coords()
 
@@ -62,10 +104,47 @@ var BlueprintScaler = ModalView.extend({
 	},
 
 	changeDimensions: function(){
+	  app.units = this.$units.val()
+	  this.$dimensions.unitVal()
 	},
 	changeUnits: function(){
+	  app.units = this.$units.val()
+	  this.$dimensions.resetUnitVal()
+	},
+	lineLength: function(){
+	  if (this.lineTool.line.length !== 2) return 0
+	  var line = this.lineTool.line
+	  return dist( line[0].a, line[0].b, line[1].a, line[1].b )
+	}
+
+	validate: function(){
+	  var val = this.$dimensions.unitVal()
+	  var errors = []
+	  if (! this.lineLength()) {
+	    errors.push("no line")
+	    alert("Please click two corners of a wall and then specify how long it is in feet or meters.")
+	  }
+	  else if (val == 0) {
+	    errors.push("no measurement")
+	    alert("Please tell us how long the wall is in feet or meters.")
+	  }
+    return errors
 	},
-	save: function(){
+	
+	showErrors: function(){},
+	
+	serialize: function(){
+    var fd = new FormData()
+    fd.append( "_id", this.media._id)
+    fd.append( "units", this.$units.val() )
+    fd.append( "scale", this.$dimensions.unitVal() / this.lineLength() )
+    fd.append( "_csrf", $("[name=_csrf]").val())
+    return fd
+	},
+	
+	success: function(){
+	  this.animating = false
+    this.parent.useFloorplan(media)
 	},
 
 })
diff --git a/public/assets/javascripts/ui/blueprint/BlueprintView.js b/public/assets/javascripts/ui/blueprint/BlueprintView.js
index a803f12..6b204e5 100644
--- a/public/assets/javascripts/ui/blueprint/BlueprintView.js
+++ b/public/assets/javascripts/ui/blueprint/BlueprintView.js
@@ -33,6 +33,9 @@ var BlueprintView = View.extend({
 	
 	hideExtras: function(){
 	},
+	
+	useFloorplan: function(media){
+	},
 
 	pickWall: function(wall, pos){
 	},
diff --git a/server/lib/schemas/Layout.js b/server/lib/schemas/Layout.js
index cff1d78..e15e188 100644
--- a/server/lib/schemas/Layout.js
+++ b/server/lib/schemas/Layout.js
@@ -23,6 +23,7 @@ var LayoutSchema = new mongoose.Schema({
 	photo: {
 		type: String,
 	},
+	media: mongoose.Schema.Types.Mixed,
 	rooms: [mongoose.Schema.Types.Mixed],
 	startPosition: mongoose.Schema.Types.Mixed,
 	viewHeight: { type: Number },
diff --git a/views/controls/blueprint/editor.ejs b/views/controls/blueprint/editor.ejs
index 308b4c8..3e0c097 100644
--- a/views/controls/blueprint/editor.ejs
+++ b/views/controls/blueprint/editor.ejs
@@ -99,8 +99,8 @@ body {
         <br><br>
 
         <div class="setting number">
-          <label for="wall-length">length</label>
-          <input type="text" class="units" name="wall-length" id="wall-length">
+          <label for="blueprint-dimensions">length</label>
+          <input type="text" class="units" name="blueprint-dimensions" id="blueprint-dimensions">
           <select id="blueprint-units" name="blueprint-units">
             <option value="ft">feet</option>
             <option value="m">meters</option>
diff --git a/views/partials/scripts.ejs b/views/partials/scripts.ejs
index 136bd4d..a0222b5 100644
--- a/views/partials/scripts.ejs
+++ b/views/partials/scripts.ejs
@@ -91,6 +91,7 @@
 <script type="text/javascript" src="/assets/javascripts/rectangles/engine/map/ui/ortho.js"></script>
 <script type="text/javascript" src="/assets/javascripts/rectangles/engine/map/tools/_base.js"></script>
 <script type="text/javascript" src="/assets/javascripts/rectangles/engine/map/tools/arrow.js"></script>
+<script type="text/javascript" src="/assets/javascripts/rectangles/engine/map/tools/line.js"></script>
 <script type="text/javascript" src="/assets/javascripts/rectangles/engine/map/tools/eraser.js"></script>
 <script type="text/javascript" src="/assets/javascripts/rectangles/engine/map/tools/ortho.js"></script>
 <script type="text/javascript" src="/assets/javascripts/rectangles/engine/map/tools/polyline.js"></script>