1 files changed, 126 insertions, 0 deletions
diff --git a/public/assets/javascripts/ui/blueprint/BlueprintUploader.js b/public/assets/javascripts/ui/blueprint/BlueprintUploader.js
new file mode 100644
index 0000000..aeb7d9c
--- /dev/null
+++ b/public/assets/javascripts/ui/blueprint/BlueprintUploader.js
@@ -0,0 +1,126 @@
+
+var BlueprintUploader = UploadView.extend({
+	el: ".blueprintUploader",
+	
+	mediaTag: "blueprint",
+	createAction: "/api/media/new",
+	uploadAction: "/api/media/upload",
+	listAction: "/api/media/user",
+	destroyAction: "/api/media/destroy",
+
+	events: {
+		"mousedown": 'stopPropagation',
+    "change .url": "enterUrl",
+    "keydown .url": "enterSetUrl",
+    
+    "click .blueprint": "pick",
+    "click .remove": "destroy",
+  },
+	
+	initialize: function(opt){
+	  this.parent = opt.parent
+	  this.__super__.initialize.call(this)
+
+    this.$url = this.$(".url")
+    this.$blueprints = this.$(".blueprints")
+	},
+	
+  loaded: false,
+	load: function(){
+		$.get(this.listAction, { tag: this.mediaTag }, this.populate.bind(this))
+	},
+
+	populate: function(data){
+		this.loaded = true
+		if (data && data.length) {
+		  this.$blueprints.show()
+      data.forEach(this.append.bind(this))
+      this.hide()
+      this.parent.scaler.pick(data[0])
+		}
+		else {
+		  this.show()
+		}
+	},
+	
+	pick: function(e){
+	  var $el = $(e.currentTarget)
+	  var media = $el.data("media")
+	  this.hide()
+	  this.parent.scaler.pick(media)
+	},
+  
+	destroy: function(e){
+	  e.stopPropagation()
+	  var $el = $(e.currentTarget)
+	  var _id = $el.closest(".blueprint").data("id")
+    $el.remove()
+		$.ajax({
+			type: "delete",
+			url: this.destroyAction,
+			data: { _id: _id, _csrf: $("[name=_csrf]").val() }
+		}).complete(function(){
+		})
+	},
+	
+	show: function(){
+    this.toggle(true)
+	},
+	hide: function(){
+		this.toggle(false)
+	},
+	toggle: function (state) {
+    this.$el.toggleClass("active", state)
+	},
+
+	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))
+	},
+  enterUrl: function(){
+  	var url = this.$url.sanitize()
+  	this.addUrl(url)
+  	this.$url.val("")
+  },
+	enterSetUrl: function (e) {
+		e.stopPropagation()
+		if (e.keyCode == 13) {
+			setTimeout(this.enterUrl.bind(this), 100)
+		}
+	},
+	
+	add: function(media){
+    this.$blueprints.show()
+	  this.append(media)
+	  this.hide()
+	  this.parent.scaler.pick(media)
+	},
+
+	append: function(media){
+	  var $el = $("<span>")
+	  var img = new Image ()
+	  img.src = media.url
+	  var remove = document.createElement("span")
+	  remove.className = "remove"
+	  remove.innerHTML = "<span>x</span>"
+	  
+	  $el.data("id", media._id)
+	  $el.data("media", media)
+	  $el.append(img)
+	  $el.append(remove)
+	  $el.addClass("blueprint")
+	  this.$blueprints.append($el)
+	},
+	
+})