fix clone button, add urls you paste to your wallpaper

5 files changed, 57 insertions, 8 deletions

diff --git a/public/assets/javascripts/ui/editor/EditorSettings.js b/public/assets/javascripts/ui/editor/EditorSettings.js
index 664b102..240f713 100644
--- a/public/assets/javascripts/ui/editor/EditorSettings.js
+++ b/public/assets/javascripts/ui/editor/EditorSettings.js
@@ -81,7 +81,9 @@ var EditorSettings = FormView.extend({
 	  this.parent.collaborators.show()
 	},
 	
-	clone: function(){
+	clone: function(e){
+		e.preventDefault()
+
 		var names = this.$name.val().split(" ")
 		if ( ! isNaN(Number( names[names.length-1] )) ) {
 			names[names.length-1] = Number( names[names.length-1] ) + 1
@@ -93,11 +95,14 @@ var EditorSettings = FormView.extend({
 		this.$id.val('new')
 		this.$name.val( names.join(" ") )
 		this.action = this.createAction
+		this.thumbnailState = null
 		
-		window.history.pushState(null, document.title, "/builder/new")
+		window.history.pushState(null, document.title, "/project/new")
 	},
 	
-	clear: function(){
+	clear: function(e){
+		e.preventDefault()
+
 		Scenery.removeAll()
 	},
 	
diff --git a/public/assets/javascripts/ui/editor/MediaUpload.js b/public/assets/javascripts/ui/editor/MediaUpload.js
index 9799f99..b3f4ac3 100644
--- a/public/assets/javascripts/ui/editor/MediaUpload.js
+++ b/public/assets/javascripts/ui/editor/MediaUpload.js
@@ -26,6 +26,7 @@ var MediaUpload = UploadView.extend({
 	},
 	
 	enterSubmit: function(e){
+		e.stopPropagation()
 		if (e.keyCode == 13) {
 			e.preventDefault()
 			this.parse()
@@ -35,7 +36,10 @@ var MediaUpload = UploadView.extend({
 	parse: function(){
 		var url = this.$url.val()
 		this.$url.val("")
-		
+		this.parseUrl(url)
+	},
+	
+	parseUrl: function(url){
 		Parser.parse(url, function(media){
 			if (! media) {
 				alert("Not a valid image/video link")
@@ -52,7 +56,7 @@ var MediaUpload = UploadView.extend({
 			request.done(this.add.bind(this))
 		}.bind(this))
 	},
-	
+
 	add: function(media){
 		console.log(media)
 		this.parent.mediaViewer.addUploadedMedia(media)
diff --git a/public/assets/javascripts/ui/editor/Presets.js b/public/assets/javascripts/ui/editor/Presets.js
index cde2fdf..0a0e0fe 100644
--- a/public/assets/javascripts/ui/editor/Presets.js
+++ b/public/assets/javascripts/ui/editor/Presets.js
@@ -110,6 +110,7 @@ var Presets = View.extend({
 			Walls.setWallpaper.floor({ src: url })
 			Walls.setWallpaper.ceiling({ src: url })
   	}
+  	app.controller.wallpaperPicker.addUrl(url)
   },
 	enterSetUrl: function (e) {
 		e.stopPropagation()
diff --git a/public/assets/javascripts/ui/editor/WallpaperPicker.js b/public/assets/javascripts/ui/editor/WallpaperPicker.js
index ad30ad8..6bcd859 100644
--- a/public/assets/javascripts/ui/editor/WallpaperPicker.js
+++ b/public/assets/javascripts/ui/editor/WallpaperPicker.js
@@ -3,6 +3,7 @@ var WallpaperPicker = UploadView.extend({
 	el: ".wallpaper",
 	
 	mediaTag: "wallpaper",
+	createAction: "/api/media/new",
 	uploadAction: "/api/media/upload",
 
 	events: {
@@ -10,7 +11,6 @@ var WallpaperPicker = UploadView.extend({
 		"click .swatch": 'pick',
 		"click .wallpaperRemove": 'remove',
     "input [data-role='wallpaper-scale']": 'updateScale',
-
   },
 	
 	initialize: function(opt){
@@ -57,14 +57,33 @@ var WallpaperPicker = UploadView.extend({
     this.toggle(true)
 	},
 	
+	seenWallpapers: {},
 	add: function (media) {
 	  if (media.type !== "image") { return }
+	  if (this.seenWallpapers[ media.url ]) { return }
 	  var swatch = document.createElement("div")
 	  swatch.className = "swatch"
 	  swatch.style.backgroundImage = "url(" + media.url + ")"
 	  this.$swatches.append(swatch)
     this.$swatches.show()
     this.$(".txt").hide()
+    this.seenWallpapers[ media.url ] = true
+	},
+	
+	addUrl: function (url){
+		Parser.loadImage(url, function(media){
+			if (! media) return
+			media._csrf = $("[name=_csrf]").val()
+			media.tag = this.mediaTag
+			
+			var request = $.ajax({
+				type: "post",
+				url: this.createAction,
+				data: media,
+			})
+			request.done(this.add.bind(this))
+			
+		}.bind(this))
 	},
 
 	toggle: function (state) {
diff --git a/public/assets/javascripts/ui/lib/Parser.js b/public/assets/javascripts/ui/lib/Parser.js
index 52c96e6..aa8c480 100644
--- a/public/assets/javascripts/ui/lib/Parser.js
+++ b/public/assets/javascripts/ui/lib/Parser.js
@@ -5,9 +5,12 @@ var Parser = {
 		fetch: function(url, done) {
 			var img = new Image ()
 			img.onload = function(){
+				if (!img) return
 				var width = img.naturalWidth, height = img.naturalHeight
 				img = null
 				done({
+					url: url,
+					type: "image",
 					token: "",
 					thumbnail: "",
 					title: "",
@@ -32,6 +35,8 @@ var Parser = {
 				var width = video.videoWidth, height = video.videoHeight
 				video = null
 				done({
+					url: url,
+					type: "video",
 					token: "",
 					thumbnail: "",
 					title: "",
@@ -63,6 +68,8 @@ var Parser = {
 				success: function(result){
 					var res = result.items[0]
 					done({
+						url: url,
+						type: "youtube",
 						token: id,
 						thumbnail: thumb,
 						title: res.snippet.title,
@@ -92,6 +99,8 @@ var Parser = {
 					  return
 					}
 					done({
+						url: url,
+						type: "vimeo",
 						token: id,
 						thumbnail: res.thumbnail_large,
 						title: res.title,
@@ -119,6 +128,8 @@ var Parser = {
 					+ '0673fbe6fc794a7750f680747e863b10',
 				success: function(result) {
 					done({
+						url: url,
+						type: "soundcloud",
 						token: result.id,
 						thumbnail: "",
 						title: "",
@@ -138,6 +149,8 @@ var Parser = {
 		regex: /^http.+/i,
 		fetch: function(url, done) {
 			done({
+				url: url,
+				type: "link",
 				token: "",
 				thumbnail: "",
 				title: "",
@@ -156,8 +169,6 @@ var Parser = {
 		var matched = Parser.integrations.some(function(integration){
 			if (integration.regex.test(url)) {
 				integration.fetch(url, function(res){
-					res.url = url
-					res.type = integration.type					
 					cb(res)
 				})
 				return true
@@ -176,6 +187,15 @@ var Parser = {
 	  return ""
 	},
 
+	loadImage: function(url, cb, error){
+		if (Parser.lookup.image.regex.test(url)) {
+			Parser.lookup.image.fetch(url, function(media){
+				cb(media)
+			})
+		}
+		else error && error()
+	},
+	
   thumbnail: function (media) {
     return '<img src="' + (media.thumbnail || media.url) + '" class="thumb">';
   },