media viewer appears

10 files changed, 116 insertions, 27 deletions

diff --git a/public/assets/javascripts/ui/SiteRouter.js b/public/assets/javascripts/ui/SiteRouter.js
index 70523d7..664cbb2 100644
--- a/public/assets/javascripts/ui/SiteRouter.js
+++ b/public/assets/javascripts/ui/SiteRouter.js
@@ -79,7 +79,7 @@ var SiteRouter = Router.extend({
 
 		app.mode.editor = true
 		app.launch()
-		
+
 		layout = slugify(layout)
 		
 		window.history.pushState(null, document.title, "/project/new/" + layout)
diff --git a/public/assets/javascripts/ui/editor/EditorSettings.js b/public/assets/javascripts/ui/editor/EditorSettings.js
index ad578d2..9263dd7 100644
--- a/public/assets/javascripts/ui/editor/EditorSettings.js
+++ b/public/assets/javascripts/ui/editor/EditorSettings.js
@@ -25,14 +25,12 @@ var EditorSettings = FormView.extend({
 	},
 	
 	load: function(data){
-		this.$id.val(data._id)
-		this.$name.val(data.name)
-
+		this.action = data.isNew ? this.createAction : this.updateAction
+	},
+	
+	loadLayout: function(data){
 		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(){
diff --git a/public/assets/javascripts/ui/editor/EditorToolbar.js b/public/assets/javascripts/ui/editor/EditorToolbar.js
index 1942fe8..df7a974 100644
--- a/public/assets/javascripts/ui/editor/EditorToolbar.js
+++ b/public/assets/javascripts/ui/editor/EditorToolbar.js
@@ -1,10 +1,16 @@
 
 var EditorToolbar = View.extend({
-	el: "#builderToolbar",
+	el: "#editorToolbar",
 
 	events: {
 		"click [data-role='toggle-map-view']": 'toggleMap',
-		"click [data-role='toggle-layout-settings']": 'toggleSettings',
+		"click [data-role='toggle-project-settings']": 'toggleSettings',
+		"click [data-role='open-media-viewer']": 'openMediaViewer',
+		"click [data-role='resize-media']": 'resize',
+		"click [data-role='toggle-wallpaper-panel']": 'toggleWallpaper',
+		"click [data-role='toggle-light-control']": 'toggleLightControl',
+		"click [data-role='delete-media']": 'deleteMedia',
+		"click [data-role='edit-wall-text']": 'editWallText',
 	},
 	
 	initialize: function(opt){
@@ -18,5 +24,25 @@ var EditorToolbar = View.extend({
 	toggleSettings: function(){
 		this.parent.settings.toggle()
 	},
+	
+	openMediaViewer: function(){
+		this.parent.mediaViewer.show()
+		this.parent.mediaUpload.show()
+	},
+	
+	resizeMedia: function(){
+	},
+	
+	deleteMedia: function(){
+	},
+	
+	toggleWallpaper: function(){
+	},
+	
+	toggleLightControl: function(){
+	},
+	
+	editWallText: function(){
+	},
 
 })
diff --git a/public/assets/javascripts/ui/editor/EditorView.js b/public/assets/javascripts/ui/editor/EditorView.js
index 7cabeb7..1093c76 100644
--- a/public/assets/javascripts/ui/editor/EditorView.js
+++ b/public/assets/javascripts/ui/editor/EditorView.js
@@ -2,7 +2,8 @@
 var EditorView = View.extend({
 	el: "#editorView",
 	
-	action: "/api/layouts/",
+	projecttAction: "/api/projects/",
+	layoutAction: "/api/layouts/",
 
 	events: {
 	},
@@ -10,25 +11,21 @@ var EditorView = View.extend({
 	initialize: function(){
 		this.toolbar = new EditorToolbar ({ parent: this })
 		this.settings = new EditorSettings ({ parent: this })
+		this.mediaViewer = new MediaViewer ({ parent: this })
+		this.mediaUpload = new MediaUpload ({ parent: this })
 	},
 
 	load: function(name){
 	},
 	
-	loadLayout: function(name){
-		if (! name || name == "new") {
-			this.ready({ isNew: true, _id: "new", name: "" })
-			return
-		}
-		
-		name = sanitize(name)
-		
-		$.get(this.action + name, $.proxy(this.ready, this))
+	loadLayout: function(layout){
+		layout = sanitize(layout)
+		$.get(this.layoutAction + layout, $.proxy(this.ready, this))
 	},
 	
 	ready: function(data){
 		$("#map").hide()
-		this.settings.load(data)
+		this.settings.loadLayout(data)
 	},
 
 })
diff --git a/public/assets/javascripts/ui/editor/MediaUpload.js b/public/assets/javascripts/ui/editor/MediaUpload.js
new file mode 100644
index 0000000..cebb547
--- /dev/null
+++ b/public/assets/javascripts/ui/editor/MediaUpload.js
@@ -0,0 +1,23 @@
+
+var MediaUpload = View.extend({
+	el: ".fileUpload",
+
+	action: "/api/media",
+	
+	initialize: function(opt){
+		this.parent = opt.parent
+	},
+
+	show: function(){
+		this.$el.addClass("active")
+	},
+	
+	hide: function(){
+		this.$el.removeClass("active")
+	},
+
+	success: function(res){
+		window.location.pathname = "/about/" + res.name
+	},
+
+})
diff --git a/public/assets/javascripts/ui/editor/MediaViewer.js b/public/assets/javascripts/ui/editor/MediaViewer.js
new file mode 100644
index 0000000..8413e70
--- /dev/null
+++ b/public/assets/javascripts/ui/editor/MediaViewer.js
@@ -0,0 +1,41 @@
+
+var MediaViewer = ModalView.extend({
+	el: ".mediaDrawer.mediaViewer",
+	createAction: "/api/docs/new",
+	updateAction: "/api/docs/edit",
+	destroyAction: "/api/docs/destroy",
+
+	show: function(){
+		if (! this.loaded) {
+			this.load()
+		}
+		else {
+			this.__super__.show()
+		}
+	},
+
+	load: function(){
+		$.get("/api/media/user", $.proxy(this.populate, this)
+	},
+
+	populate: function(data){
+		data.forEach($.proxy(function(room){
+			var $span = $("<span>")
+			// $span.html(JSON.stringify(room))
+			$span.data("slug", room.slug)
+			$span.css("background-image", "url(" + room.photo + ")")
+			
+			this.$templates.append($span)
+		}, this))
+		this.__super__.show()
+	},
+
+	destroy: function(name, cb){
+		$.ajax({
+			type: "delete",
+			url: this.destroyAction,
+			data: { name: name, _csrf: $("[name=_csrf]").val() }
+		}).complete(cb || function(){})
+	},
+
+})
diff --git a/public/assets/javascripts/ui/lib/FormView.js b/public/assets/javascripts/ui/lib/FormView.js
index dc1801b..0106ce0 100644
--- a/public/assets/javascripts/ui/lib/FormView.js
+++ b/public/assets/javascripts/ui/lib/FormView.js
@@ -6,7 +6,10 @@ var FormView = View.extend({
 		"submit form": "save"
 	},
 
-	initialize: function(){
+	initialize: function(opt){
+		if (opt && opt.parent) {
+			this.parent = opt.parent
+		}
 		this.$form = this.$("form")
 		this.$errors = this.$(".errors")
 		this.$errorList = this.$(".errorList")
diff --git a/public/assets/javascripts/ui/lib/ModalView.js b/public/assets/javascripts/ui/lib/ModalView.js
index b90b3c4..957a54d 100644
--- a/public/assets/javascripts/ui/lib/ModalView.js
+++ b/public/assets/javascripts/ui/lib/ModalView.js
@@ -4,6 +4,12 @@ var ModalView = View.extend({
 		"click .close": 'close',
 	},
 	
+	initialize: function(opt){
+		if (opt && opt.parent) {
+			this.parent = opt.parent
+		}
+	},
+	
 	show: function(){
 		$(".mediaDrawer").removeClass("active");
 		this.$el.addClass("active");
diff --git a/public/assets/javascripts/ui/site/LayoutsModal.js b/public/assets/javascripts/ui/site/LayoutsModal.js
index 18bd27d..0604245 100644
--- a/public/assets/javascripts/ui/site/LayoutsModal.js
+++ b/public/assets/javascripts/ui/site/LayoutsModal.js
@@ -104,7 +104,6 @@ var NewProjectModal = ModalView.extend(LayoutsIndex.prototype).extend({
 	choose: function(e){
 		e && e.preventDefault()
 		var layout = this.$(".templates .active").data("slug")
-		console.log(layout)
 		if (! layout || ! layout.length) return
 		window.location.pathname = "/project/new/" + layout
 	}
diff --git a/public/assets/javascripts/ui/z_misc.js b/public/assets/javascripts/ui/z_misc.js
index 37e41c6..64b8a5b 100644
--- a/public/assets/javascripts/ui/z_misc.js
+++ b/public/assets/javascripts/ui/z_misc.js
@@ -10,11 +10,7 @@ function bind () {
 			$(this).toggleClass("icon-close", isActive);
 		})
 	}
-	
-  $(".addMedia").clickToToggle(function(isActive){
-    $(".mediaDrawer").toggleClass("active", isActive);
-    $(".fileUpload").toggleClass("active", isActive);
-  });
+
 
   $(".room1 .editBtn").click(function () {
   	var room = $(this).parent();