From c781911322c84eb0c2aa4a00860016437d7b7cba Mon Sep 17 00:00:00 2001
From: Jules Laplace <jules@okfoc.us>
Date: Wed, 26 Aug 2015 18:30:33 -0400
Subject: surface blueprints on new project modal

---
 .../rectangles/engine/map/tools/arrow.js           |   2 +
 .../rectangles/engine/map/tools/eraser.js          |   2 +
 .../rectangles/engine/map/tools/line.js            |   2 +-
 .../rectangles/engine/map/tools/ortho.js           |   5 +-
 .../rectangles/engine/map/tools/polyline.js        |   2 +
 .../rectangles/engine/map/tools/position.js        |   2 +
 .../rectangles/engine/map/tools/start.js           |   2 +-
 .../javascripts/ui/blueprint/BlueprintUploader.js  |   9 +-
 public/assets/javascripts/ui/site/LayoutsModal.js  | 190 +++++++++++++++++++--
 public/assets/stylesheets/app.css                  |   4 +-
 server/lib/api/layouts.js                          |  18 +-
 views/projects/layouts-modal.ejs                   |   3 +
 12 files changed, 211 insertions(+), 30 deletions(-)

diff --git a/public/assets/javascripts/rectangles/engine/map/tools/arrow.js b/public/assets/javascripts/rectangles/engine/map/tools/arrow.js
index 2a73954..00478d4 100644
--- a/public/assets/javascripts/rectangles/engine/map/tools/arrow.js
+++ b/public/assets/javascripts/rectangles/engine/map/tools/arrow.js
@@ -1,3 +1,5 @@
+// Tool used to move corners of polylines
+
 var ArrowTool = MapTool.extend(function(base){
 	var exports = {}
 	
diff --git a/public/assets/javascripts/rectangles/engine/map/tools/eraser.js b/public/assets/javascripts/rectangles/engine/map/tools/eraser.js
index 648cd11..8fc3687 100644
--- a/public/assets/javascripts/rectangles/engine/map/tools/eraser.js
+++ b/public/assets/javascripts/rectangles/engine/map/tools/eraser.js
@@ -1,3 +1,5 @@
+// Tool used to delete lines
+
 var EraserTool = MapTool.extend(function(base){
 	var exports = {}
 	exports.down = function(e, cursor){
diff --git a/public/assets/javascripts/rectangles/engine/map/tools/line.js b/public/assets/javascripts/rectangles/engine/map/tools/line.js
index a8e2473..8175d66 100644
--- a/public/assets/javascripts/rectangles/engine/map/tools/line.js
+++ b/public/assets/javascripts/rectangles/engine/map/tools/line.js
@@ -1,4 +1,4 @@
-// This tool is used to define a very simple line between two points.
+// Tool is used to define a very simple line between two points.
 // It is used by the BlueprintScaler to specify a sample distance to scale.
 
 var LineTool = MapTool.extend(function(base){
diff --git a/public/assets/javascripts/rectangles/engine/map/tools/ortho.js b/public/assets/javascripts/rectangles/engine/map/tools/ortho.js
index 918ac0d..6ced728 100644
--- a/public/assets/javascripts/rectangles/engine/map/tools/ortho.js
+++ b/public/assets/javascripts/rectangles/engine/map/tools/ortho.js
@@ -1,6 +1,7 @@
+// Tool to make a polyline where all walls are orthogonal
+
 var OrthoPolylineTool = MapTool.extend(function (base) {
-  // this will work like normal polyline except all walls will be orthogonal
-  
+
   var prev_point, horizontal = false, first_edge_is_horizontal = false
   
   var exports = {}
diff --git a/public/assets/javascripts/rectangles/engine/map/tools/polyline.js b/public/assets/javascripts/rectangles/engine/map/tools/polyline.js
index 6716180..445ae26 100644
--- a/public/assets/javascripts/rectangles/engine/map/tools/polyline.js
+++ b/public/assets/javascripts/rectangles/engine/map/tools/polyline.js
@@ -1,3 +1,5 @@
+// Tool used to draw polylines with arbitrary angles
+
 var PolylineTool = MapTool.extend(function (base) {
   var exports = {}
   exports.down = function(e, cursor){
diff --git a/public/assets/javascripts/rectangles/engine/map/tools/position.js b/public/assets/javascripts/rectangles/engine/map/tools/position.js
index a994f5a..f8365bc 100644
--- a/public/assets/javascripts/rectangles/engine/map/tools/position.js
+++ b/public/assets/javascripts/rectangles/engine/map/tools/position.js
@@ -1,3 +1,5 @@
+// Tool used to set position on the map and let you change the view by dragging.
+
 var PositionTool = MapTool.extend(function(base){
 	var exports = {
 	  recenterCursor: false,
diff --git a/public/assets/javascripts/rectangles/engine/map/tools/start.js b/public/assets/javascripts/rectangles/engine/map/tools/start.js
index cca387c..203a85f 100644
--- a/public/assets/javascripts/rectangles/engine/map/tools/start.js
+++ b/public/assets/javascripts/rectangles/engine/map/tools/start.js
@@ -1,4 +1,4 @@
-// This tool is used to set the start position on the map.
+// Tool is used to set the start position on the map.
 
 var StartPositionTool = MapTool.extend(function(base){
 	var exports = {}
diff --git a/public/assets/javascripts/ui/blueprint/BlueprintUploader.js b/public/assets/javascripts/ui/blueprint/BlueprintUploader.js
index fbb71d5..fe1073a 100644
--- a/public/assets/javascripts/ui/blueprint/BlueprintUploader.js
+++ b/public/assets/javascripts/ui/blueprint/BlueprintUploader.js
@@ -37,8 +37,12 @@ var BlueprintUploader = UploadView.extend({
 		if (data && data.length) {
 		  this.$blueprints.show()
       data.forEach(this.append.bind(this))
-      this.hide()
-      if (this.nameToShow && this.nameToShow !== "new") {
+      if (this.nameToShow === "new") {
+        // don't pick anything..
+        this.show()
+      }
+      else if (! this.nameToShow) {
+        this.hide()
         data.some(function(el){
           if (el.slug == this.nameToShow) {
             this.parent.scaler.pick(el)
@@ -47,6 +51,7 @@ var BlueprintUploader = UploadView.extend({
         }.bind(this))
       }
       else {
+        this.hide()
         this.parent.scaler.pick(data[0])
       }
 		}
diff --git a/public/assets/javascripts/ui/site/LayoutsModal.js b/public/assets/javascripts/ui/site/LayoutsModal.js
index 87251af..a9c6ef0 100644
--- a/public/assets/javascripts/ui/site/LayoutsModal.js
+++ b/public/assets/javascripts/ui/site/LayoutsModal.js
@@ -6,6 +6,10 @@ var LayoutsIndex = View.extend({
 		this.$templatesList = this.$(".templates-list")
 		this.$noTemplates = this.$(".no-templates")
 		this.$form = this.$("form")
+		
+		this.$userTemplatesList = this.$(".userTemplatesList")
+		this.$blueprintsList = this.$(".blueprintsList")
+		this.$newBlueprintButton = this.$("[data-role='create-new-blueprint']")
 	},
 
 	load: function(type){
@@ -15,11 +19,6 @@ var LayoutsIndex = View.extend({
 	},
 
 	populate: function(data){
-/*
-	  if (data.user.plan_level < 1 && data.projectCount == 1) {
-	    // show lockout message
-	  }
-*/
 		if (! data.layouts.length) {
 			this.$templates.hide()
 			this.$form.hide()
@@ -89,20 +88,89 @@ var LayoutsModal = ModalView.extend(LayoutsIndex.prototype).extend({
 	action: "/api/layout",
 
 	events: {
-		"click .templates span": 'toggleActive',
+		"click .templates span": 'pick',
+		"click .userTemplates span": 'pick',
+		"click .blueprints span": 'pickBlueprint',
 		"submit form": 'newLayout',
 	},
 	
-	toggleActive: function(e){
+	pick: function(e){
 		e.preventDefault()
-		this.$(".templates .active").removeClass("active")
 		var $layout = $(e.currentTarget)
-		$layout.addClass("active")
+		window.location.pathname = "/layout/" + $layout.data("slug")
+	},
+
+	pick: function(e){
+		e.preventDefault()
+		var $blueprint = $(e.currentTarget)
+		$blueprint.addClass("active")
 		
-		// actually do
 		window.location.pathname = "/layout/" + $layout.data("slug")
 	},
-	
+
+	populate: function(data){
+/*
+	  if (data.user.plan_level < 1 && data.projectCount == 1) {
+	    // show lockout message
+	  }
+*/
+		if (! data.layouts.length) {
+			this.$templates.hide()
+			this.$form.hide()
+			this.$noTemplates.show()
+		}
+		this.$templatesList.empty()
+		data.layouts.forEach(function(room){
+			var $span = $("<span>")
+			$span.data("slug", room.slug)
+			
+			var $label = $("<label>")
+			$label.html( room.name )
+			
+			var $image = $("<span>")
+			$image.addClass("image").css("background-image", "url(" + room.photo + ")")
+			
+      $span.append( $image )
+      $span.append( $label )
+			
+			this.$templatesList.append($span)
+		}.bind(this))
+
+		data.user_layouts.forEach(function(room){
+			var $span = $("<span>")
+			$span.data("slug", room.slug)
+			
+			var $label = $("<label>")
+			$label.html( room.name )
+			
+			var $image = $("<span>")
+			$image.addClass("image").css("background-image", "url(" + room.photo + ")")
+			
+      $span.append( $image )
+      $span.append( $label )
+			
+			this.$userTemplatesList.append($span)
+		}.bind(this))
+		
+		data.blueprints.forEach(function(blueprint){
+			var $span = $("<span>")
+			$span.data("slug", blueprint.slug)
+			
+			var $label = $("<label>")
+			$label.html( blueprint.name )
+			
+			var $image = $("<span>")
+			$image.addClass("image").css("background-image", "url(" + blueprint.url + ")")
+			
+      $span.append( $image )
+      $span.append( $label )
+			
+			this.$blueprintsList.append($span)
+		}.bind(this))
+		
+		this.show()
+	},
+
 	newLayout: function(e){
 		e && e.preventDefault()
 		window.location.pathname = "/layout/new"
@@ -118,8 +186,10 @@ var NewProjectModal = ModalView.extend(LayoutsIndex.prototype).extend({
 
 	events: {
 		"click [data-role='create-new-layout']": 'createNewLayout',
-		"click .templates span": 'choose',
-		"submit form": 'choose',
+		"click [data-role='create-new-blueprint']": 'createNewBlueprint',
+		"click .templates span": 'pick',
+		"click .userTemplates span": 'pick',
+		"click .blueprints span": 'pickBlueprint',
 	},
 	
 	toggleActive: function(e){
@@ -128,16 +198,104 @@ var NewProjectModal = ModalView.extend(LayoutsIndex.prototype).extend({
 		$(e.currentTarget).addClass("active")
 	},
 	
-	choose: function(e){
+	pick: function(e){
 		e && e.preventDefault()
 // 		var layout = this.$(".templates .active").data("slug")
  		var layout = $(e.currentTarget).data("slug")
+ 		var isBlueprint = $(e.currentTarget).data("blueprint")
 		if (! layout || ! layout.length) return
-		window.location.pathname = "/project/new/" + layout
+		
+		if (isBlueprint) {
+      window.location.pathname = "/project/blueprint/" + layout
+		}
+		else {
+      window.location.pathname = "/project/new/" + layout
+		}
 	},
 
-	createNewLayout: function(){
+	createNewLayout: function(e){
+	  e.preventDefault()
 	  window.location.pathname = "/project/new/empty"
 	},
+
+	createNewBlueprint: function(s){
+	  e.preventDefault()
+	  window.location.pathname = "/blueprint/new"
+	},
+
+	populate: function(data){
+/*
+	  if (data.user.plan_level < 1 && data.projectCount == 1) {
+	    // show lockout message
+      this.$newBlueprintButton.hide()
+	  }
+*/
+		if (! data.layouts.length) {
+			this.$templates.hide()
+			this.$form.hide()
+			this.$noTemplates.show()
+		}
+		if (! data.blueprints.length) {
+		  this.$blueprintsList.parent().hide()
+    }
+		if (! data.user_layouts.length) {
+		  this.$userTemplatesList.parent().hide()
+    }
+
+		this.$templatesList.empty()
+		data.layouts.forEach(function(room){
+			var $span = $("<span>")
+			$span.data("slug", room.slug)
+			
+			var $label = $("<label>")
+			$label.html( room.name )
+			
+			var $image = $("<span>")
+			$image.addClass("image").css("background-image", "url(" + room.photo + ")")
+			
+      $span.append( $image )
+      $span.append( $label )
+			
+			this.$templatesList.append($span)
+		}.bind(this))
+
+		data.user_layouts.forEach(function(room){
+			var $span = $("<span>")
+			$span.data("slug", room.slug)
+			
+			var $label = $("<label>")
+			$label.html( room.name )
+			
+			var $image = $("<span>")
+			$image.addClass("image").css("background-image", "url(" + room.photo + ")")
+			
+      $span.append( $image )
+      $span.append( $label )
+			
+			this.$templatesList.append($span)
+		}.bind(this))
+		
+		data.blueprints.forEach(function(blueprint){
+		  if (! blueprint.slug) { return }
+		  
+			var $span = $("<span>")
+			$span.data("blueprint", true)
+			$span.data("slug", blueprint.slug)
+			
+			var $label = $("<label>")
+			$label.html( blueprint.name )
+			
+			var $image = $("<span>")
+			$image.addClass("image").css("background-image", "url(" + blueprint.url + ")")
+			
+      $span.append( $image )
+      $span.append( $label )
+			
+			this.$templatesList.append($span)
+		}.bind(this))
+		
+		this.show()
+	},
+
 	
 })
diff --git a/public/assets/stylesheets/app.css b/public/assets/stylesheets/app.css
index 5ef8c18..a1bb466 100755
--- a/public/assets/stylesheets/app.css
+++ b/public/assets/stylesheets/app.css
@@ -1157,7 +1157,9 @@ form .paidPlan label { float: none; font-size: 16px; margin: 0 10px; }
 	height: 100%;
 	padding: 20px 0 40px 0;
 }
-.templates-list {
+.templates-list,
+.userTemplatesList,
+.blueprintsList {
 	display: inline-block;
 	width: 100%;
 	margin-bottom: 40px;
diff --git a/server/lib/api/layouts.js b/server/lib/api/layouts.js
index f1db121..c04f926 100644
--- a/server/lib/api/layouts.js
+++ b/server/lib/api/layouts.js
@@ -5,18 +5,22 @@ var _ = require('lodash'),
 	upload = require('../upload'),
 	middleware = require('../middleware'),
 	config = require('../../../config.json'),
+	Blueprint = require('../schemas/Blueprint'),
 	Layout = require('../schemas/Layout');
 
 var layouts = {
 	index: function(req, res){
 		Layout.find({ is_stock: true }, function(err, stock_layouts){
-      Layout.find({ user_id: req.user._id }, function(err, user_layouts){
-        res.json({
-          layouts: stock_layouts,
-          user_layouts: user_layouts,
-          user: res.locals.user,
-          layoutCount: res.locals.layoutCount,
-          projectCount: res.locals.projectCount,
+      Layout.find({ user_id: req.user._id, is_stock: false }, function(err, user_layouts){
+        Blueprint.find({ user_id: req.user._id }, function(err, blueprints){
+          res.json({
+            layouts: stock_layouts,
+            user_layouts: user_layouts,
+            blueprints: blueprints,
+            user: res.locals.user,
+            layoutCount: res.locals.layoutCount,
+            projectCount: res.locals.projectCount,
+          })
         })
       })
 		})
diff --git a/views/projects/layouts-modal.ejs b/views/projects/layouts-modal.ejs
index 6f60d81..31ba7bf 100644
--- a/views/projects/layouts-modal.ejs
+++ b/views/projects/layouts-modal.ejs
@@ -43,7 +43,10 @@
 	    
 			<div class="templates-list">
 			</div>
+
 			<form>
+				<input data-role="create-new-blueprint" class="button_text" type="submit" value="trace a blueprint">
+				<br><br>
 				<input data-role="create-new-layout" class="button_text" type="submit" value="or make your own template">
 			</form>
 		</div>
-- 
cgit v1.2.3-70-g09d2