split off info/settings

8 files changed, 284 insertions, 4 deletions

diff --git a/public/assets/javascripts/ui/blueprint/BlueprintInfo.js b/public/assets/javascripts/ui/blueprint/BlueprintInfo.js
new file mode 100644
index 0000000..ad462ae
--- /dev/null
+++ b/public/assets/javascripts/ui/blueprint/BlueprintInfo.js
@@ -0,0 +1,76 @@
+
+var BlueprintInfo = View.extend({
+	el: "#blueprintInfo",
+
+	events: {
+	  "mousedown": "stopPropagation",
+		"keydown": 'stopPropagation',
+		"keydown [name=height]": 'enterHeight',
+		"change [name=units]": 'changeUnits',
+		"keydown [name=viewHeight]": 'enterViewHeight',
+		"change [name=viewHeight]": 'changeViewHeight',
+		"click [data-role=destroy-room]": 'destroy',
+	},
+	
+	initialize: function(opt){
+		this.parent = opt.parent
+		this.$units = this.$("[name=units]")
+		this.$viewHeight = this.$("[name=viewHeight]")
+		this.$unitName = this.$(".unitName")
+	},
+	
+	load: function(data){
+		this.$viewHeight.unitVal( window.viewHeight = data.viewHeight || app.defaults.viewHeight )
+		this.$units.val( data.units )
+		this.$unitName.html( data.units )
+	},
+
+	toggle: function(state){
+		this.$el.toggleClass("active", state)
+    this.$viewHeight.unitVal( window.viewHeight )
+	},
+	
+	show: function(){	
+		this.toggle(true)
+	},
+	
+	hide: function(){
+	  this.room = null
+		this.toggle(false)
+	},
+
+	room: null,
+	
+	pick: function(room){
+	},
+	
+	deselect: function(){
+	  this.room = null
+	  this.toggle(true)
+	},
+
+	enterHeight: function(e){
+	  if (e.keyCode == 13) this.changeHeight(e)
+	},
+	changeHeight: function(e){
+		e.stopPropagation()
+		var height = this.room.height = this.$height.unitVal()
+		if (window.heightIsGlobal) {
+		  Rooms.forEach(function(room){
+		    room.height = height
+		  })
+		}
+    Rooms.rebuild()
+	},
+	changeUnits: function(){
+		app.units = this.$units.val()
+		this.$('.units').resetUnitVal()
+	},
+	enterViewHeight: function(e){
+	  if (e.keyCode == 13) this.changeViewHeight(e)
+	},
+  changeViewHeight: function(){
+ 		window.viewHeight = this.$viewHeight.unitVal()
+	}
+
+})
diff --git a/public/assets/javascripts/ui/blueprint/BlueprintSettings.js b/public/assets/javascripts/ui/blueprint/BlueprintSettings.js
new file mode 100644
index 0000000..1ff3d6e
--- /dev/null
+++ b/public/assets/javascripts/ui/blueprint/BlueprintSettings.js
@@ -0,0 +1,139 @@
+
+var BlueprintSettings = FormView.extend({
+	el: "#blueprintSettings",
+	
+	createAction: "/api/layout/new",
+	updateAction: "/api/layout/edit",
+	destroyAction: "/api/layout/destroy",
+
+	events: {
+	  "mousedown": "stopPropagation",
+		"keydown": 'stopPropagation',
+		"keydown [name=name]": 'enterSubmit',
+		"click [data-role='save-layout']": 'clickSave',
+		"click [data-role='clone-layout']": 'clone',
+		"click [data-role='clear-layout']": 'clear',
+		"click [data-role='destroy-layout']": 'destroy',
+	},
+	
+	initialize: function(opt){
+		this.parent = opt.parent
+		this.__super__.initialize.call(this)
+		
+		this.$id = this.$("[name=_id]")
+		this.$csrf = this.$("[name=_csrf]")
+		this.$name = this.$("[name=name]")
+		this.$privacy = this.$("[name=privacy]")
+	},
+	
+	load: function(data){
+		this.$id.val(data._id)
+		this.$name.val(data.name)
+
+		this.parent.colorControl.loadDefaults()
+
+		data.rooms && Rooms.deserialize(data.rooms)
+		data.startPosition && scene.camera.move(data.startPosition)
+		data.privacy && this.$privacy.find("[value=" + data.privacy + "]").prop('checked', "checked")
+
+		this.action = data.isNew ? this.createAction : this.updateAction
+	},
+	
+	clone: function(){
+		var names = this.$name.val().split(" ")
+		if ( ! isNaN(Number( names[names.length-1] )) ) {
+			names[names.length-1] = Number( names[names.length-1] ) + 1
+		}
+		else {
+			names.push("2")
+		}
+
+		this.$id.val('new')
+		this.$name.val( names.join(" ") )
+		this.action = this.createAction
+		
+		window.history.pushState(null, document.title, "/builder/new")
+	},
+	
+	clear: function(){
+		Rooms.removeAll()
+	},
+	
+	destroy: function(){
+		var msg = "Are you sure you want to delete the blueprint " + sanitize(this.$name.val()) + "?"
+		ConfirmModal.confirm(msg, function(){
+			$.ajax({
+				url: this.destroyAction,
+				type: "delete",
+				data: { _id: this.$id.val(), _csrf: this.$csrf.val() },
+				success: function(data){
+					window.location.href = "/layout"
+				}
+			})
+		}.bind(this))
+	},
+
+	toggle: function(state){
+		this.$el.toggleClass("active", state)
+	},
+
+	enterSubmit: function (e) {
+		e.stopPropagation()
+		var base = this
+		if (e.keyCode == 13) {
+			setTimeout(function(){ base.save(e) }, 100)
+		}
+	},
+
+	validate: function(){
+		var errors = []
+		var name = this.$name.val()
+		if (! name || ! name.length) {
+			errors.push("Layout needs a name.")
+		}
+		if (Rooms.count() == 0) {
+			errors.push("Please add some rooms by drawing boxes.")
+		}
+		return errors
+	},
+	
+	showErrors: function(errors){
+		var $errors = $("<span>")
+		errors.forEach(function(err){
+			var $row = $("<div>")
+			$row.html(err)
+			$errors.append( $row )
+		})
+		ErrorModal.alert($errors)
+	},
+	
+	serialize: function(){
+		var thumbnail = map.draw.render()
+		var fd = new FormData()
+		fd.append( "_csrf", this.$csrf.val() )
+		fd.append( "_id", this.$id.val() )
+		fd.append( "name", this.$name.val() )
+		fd.append( "privacy", this.$privacy.filter(":checked").val() == "private" )
+		fd.append( "rooms", JSON.stringify( Rooms.serialize() ) )
+		fd.append( "startPosition", JSON.stringify( app.position(scene.camera) ) )
+		fd.append( "thumbnail", dataUriToBlob(thumbnail.toDataURL()) )
+		return fd
+	},
+
+	clickSave: function(){
+    this.toggle(false)
+    this.save()
+	},
+	
+	success: function(data){
+		this.$id.val(data._id)
+		this.$name.val(data.name)
+		this.action = this.updateAction
+		
+		Minotaur.unwatch(this)
+		Minotaur.hide()
+
+		window.history.pushState(null, document.title, "/layout/" + data.slug)
+	},
+
+})
diff --git a/public/assets/javascripts/ui/blueprint/BlueprintView.js b/public/assets/javascripts/ui/blueprint/BlueprintView.js
index e84fc30..a59f44f 100644
--- a/public/assets/javascripts/ui/blueprint/BlueprintView.js
+++ b/public/assets/javascripts/ui/blueprint/BlueprintView.js
@@ -8,7 +8,6 @@ var BlueprintView = View.extend({
 	},
 	
 	initialize: function(){
-// 		this.info = new BuilderInfo ({ parent: this })
 // 		this.settings = new BuilderSettings ({ parent: this })
 // 		this.colorControl = new ColorControl ({ parent: this })
 // 		this.cursor = new HelpCursor({ parent: this })
@@ -17,6 +16,7 @@ var BlueprintView = View.extend({
 		this.toolbar = new BlueprintToolbar ({ parent: this })
     this.uploader = new BlueprintUploader ({ parent: this })
     this.scaler = new BlueprintScaler ({ parent: this })
+		this.info = new BlueprintInfo ({ parent: this })
 	},
 
 	load: function(name){
diff --git a/server/lib/api/blueprint.js b/server/lib/api/blueprint.js
index a932383..7319055 100644
--- a/server/lib/api/blueprint.js
+++ b/server/lib/api/blueprint.js
@@ -75,7 +75,6 @@ var blueprint = {
 			doc.scale = data.scale
 			doc.units = data.units
 			doc.line = data.line
-			console.log(doc)
 			doc.save(function(err, rec){
 				if (err || ! rec) { return res.json({ error: err }) }
 				res.json(rec)
diff --git a/views/blueprint.ejs b/views/blueprint.ejs
index e68e106..e7f7c48 100644
--- a/views/blueprint.ejs
+++ b/views/blueprint.ejs
@@ -12,9 +12,9 @@
 		[[ include partials/header ]]
 		
 		<div id="builderView">
-			[[ include controls/builder/info ]]
+			[[ include controls/blueprint/info ]]
 			[[ include controls/blueprint/toolbar ]]
-			[[ include controls/builder/settings ]]
+			[[ include controls/blueprint/settings ]]
       [[ include controls/blueprint/editor ]]
       [[ include controls/blueprint/scaler ]]
 		</div>
diff --git a/views/controls/blueprint/info.ejs b/views/controls/blueprint/info.ejs
new file mode 100644
index 0000000..f994629
--- /dev/null
+++ b/views/controls/blueprint/info.ejs
@@ -0,0 +1,25 @@
+<div class="vvbox settings info" id="blueprintInfo">
+	<h4>Blueprint Editor</h4>
+
+	<div class="setting number twoline">
+		<label for="room-height">ceiling height</label>
+		<input type="text" class="units" name="height" id="room-height">
+		<label for="room-height-global" id="room-height-global-label">global?</label>
+		<input type="checkbox" name="heightGlobal" id="room-height-global">
+	</div>
+
+	<div class="setting number twoline">
+		<label for="viewHeight">camera height</label>
+		<input type="text" class="units" name="viewHeight" id="viewHeight">
+	</div>
+
+	<div class="setting number twoline">
+		<label for="builder-units">units</label>
+		<select id="builder-units" name="units">
+			<option value="px">pixels</option>
+			<option value="ft">foot</option>
+			<option value="m">meter</option>
+		</select>
+	</div>
+
+</div>
diff --git a/views/controls/blueprint/settings.ejs b/views/controls/blueprint/settings.ejs
new file mode 100644
index 0000000..a7ce2f0
--- /dev/null
+++ b/views/controls/blueprint/settings.ejs
@@ -0,0 +1,39 @@
+<div class="vvbox settings active" id="blueprintSettings">
+	<input type="hidden" name="_csrf" value="[[- token ]]">
+	<input type="hidden" name="_id" value="new">
+
+	<div class="setting">
+		<a href="#" id="startpoint">
+			<span class="ion-ios-navigate-outline"></span>
+			<span id="startText">Select Startpoint</span>
+			<span id="moveText">Move to Desired Point</span></a>
+	</div>
+
+	<div class="setting">
+		<input type="text" name="name" placeholder="layout name">
+	</div>
+	
+	<div class="setting">
+		<div class="radio-group">
+			<input id="privacy_private" class="radio-group__option" type="radio" name="privacy" value="public" checked>
+			<label class="radio-group__label" for="privacy_private">
+				Everyone
+			</label>
+			<input id="privacy_public" class="radio-group__option" type="radio" name="privacy" value="private">
+			<label class="radio-group__label" for="privacy_public">
+				Just for me
+			</label>
+		</div>
+	</div>
+	
+	<div class="setting">
+		<button data-role="save-layout">Save</button>
+	</div>
+	
+	<div class="setting subButtons">
+		<a href="#" data-role="clear-layout">Clear</a>
+		<a href="#" data-role="clone-layout">Clone</a>
+		<a href="#" data-role="destroy-layout">Delete</a>
+	</div>
+
+</div>
diff --git a/views/partials/scripts.ejs b/views/partials/scripts.ejs
index 909309e..8a69888 100644
--- a/views/partials/scripts.ejs
+++ b/views/partials/scripts.ejs
@@ -134,6 +134,8 @@
 <script type="text/javascript" src="/assets/javascripts/ui/builder/BuilderInfo.js"></script>
 
 <script type="text/javascript" src="/assets/javascripts/ui/blueprint/BlueprintView.js"></script>
+<script type="text/javascript" src="/assets/javascripts/ui/blueprint/BlueprintInfo.js"></script>
+<script type="text/javascript" src="/assets/javascripts/ui/blueprint/BlueprintSettings.js"></script>
 <script type="text/javascript" src="/assets/javascripts/ui/blueprint/BlueprintEditor.js"></script>
 <script type="text/javascript" src="/assets/javascripts/ui/blueprint/BlueprintScaler.js"></script>
 <script type="text/javascript" src="/assets/javascripts/ui/blueprint/BlueprintToolbar.js"></script>