3 files changed, 89 insertions, 62 deletions

diff --git a/public/assets/javascripts/ui/editor/EditorToolbar.js b/public/assets/javascripts/ui/editor/EditorToolbar.js
index 4b30228..76218fe 100644
--- a/public/assets/javascripts/ui/editor/EditorToolbar.js
+++ b/public/assets/javascripts/ui/editor/EditorToolbar.js
@@ -19,6 +19,7 @@ var EditorToolbar = View.extend({
 
 	toggleMap: function(){
 		map.toggle()
+		// $("#minimap").toggleClass("hide");
 	},
 	
 	toggleSettings: function(){
@@ -49,3 +50,5 @@ var EditorToolbar = View.extend({
 	},
 
 })
+
+// $(".icon-close").removeClass("icon-close")
diff --git a/public/assets/javascripts/ui/editor/MediaUpload.js b/public/assets/javascripts/ui/editor/MediaUpload.js
index a66f2e8..3ade132 100644
--- a/public/assets/javascripts/ui/editor/MediaUpload.js
+++ b/public/assets/javascripts/ui/editor/MediaUpload.js
@@ -67,23 +67,47 @@ var MediaUpload = View.extend({
 			if ( ! f.type.match('image.*')) {
 				continue;
 			}
+			
+			this.getImageDimensions(f)
+		}
+	},
+	
+	getImageDimensions: function(f){
+		var base = this
+		
+		this.$upload.addClass('uploading')
 
-			this.$upload.addClass('uploading')
-
-			var fd = new FormData();
-			fd.append( 'image', f )
-			fd.append( '_csrf', this.$csrf.val() )
+		var reader = new FileReader();
 
-			var request = $.ajax({
-				url: this.uploadAction,
-				type: "post",
-				data: fd,
-				dataType: "json",
-				processData: false,
-				contentType: false,
-			})
-			request.done($.proxy(this.add, this))
+		reader.onload = function(e) {
+			var image = new Image()
+			image.onload = function(){
+				var width = image.naturalWidth,
+					height = image.naturalHeight
+				base.upload(f, width, height)
+			}
+			image.src = e.target.result
 		}
+		
+		reader.readAsDataURL(f);
+	},
+	
+	upload: function(f, width, height){
+		var fd = new FormData();
+		fd.append( 'image', f )
+		fd.append( 'width', width )
+		fd.append( 'height', height )
+		fd.append( '_csrf', this.$csrf.val() )
+
+		var request = $.ajax({
+			url: this.uploadAction,
+			type: "post",
+			data: fd,
+			dataType: "json",
+			processData: false,
+			contentType: false,
+		})
+		request.done($.proxy(this.add, this))
 	},
 	
 	add: function(media){
diff --git a/public/assets/javascripts/ui/editor/MediaViewer.js b/public/assets/javascripts/ui/editor/MediaViewer.js
index e48c5b6..84deb7d 100644
--- a/public/assets/javascripts/ui/editor/MediaViewer.js
+++ b/public/assets/javascripts/ui/editor/MediaViewer.js
@@ -7,21 +7,21 @@ var MediaViewer = ModalView.extend({
 		'click .foundToggle': "foundToggle",
 		'click .yourMedia': "userToggle",
 		'click #deleteMedia': "deleteArmed",
-		'mousedown .mediaContainer': "pick",
+		'click .mediaContainer': "pick",
 	},
-
+	
 	foundToggle: function(){
-    $(".foundMedia").addClass("active");
-    $(".myMedia").addClass("inactive");
-    $('a').removeClass("active");
-    $('.foundToggle').addClass("active");
+    this.$(".foundMedia").addClass("active");
+    this.$(".myMedia").addClass("inactive");
+    this.$("a").removeClass("active");
+    this.$(".foundToggle").addClass("active");
 	},
 	
 	userToggle: function(){
     this.$(".foundMedia").removeClass("active");
     this.$(".myMedia").removeClass("inactive");
-    this.$('a').removeClass("active");
-    this.$('.yourMedia').addClass("active");
+    this.$("a").removeClass("active");
+    this.$(".yourMedia").addClass("active");
 	},
 
 	show: function(){
@@ -35,6 +35,7 @@ var MediaViewer = ModalView.extend({
 	
 	hide: function(){
 		this.__super__.hide.call(this)
+		this.deleteArmed(null, false)
 		this.parent.mediaUpload.hide()
 	},
 
@@ -77,56 +78,55 @@ var MediaViewer = ModalView.extend({
 		this.deleteIsArmed = state
 		$("body").toggleClass("deleteArmed", state)
 	},
+
+	destroy: function(_id, cb){
+		$.ajax({
+			type: "delete",
+			url: this.destroyAction,
+			data: { _id: _id, _csrf: $("[name=_csrf]").val() }
+		}).complete(cb || function(){})
+	},
 	
-	pick: function(e){
+	pick: function(e) {
+		e.stopPropagation()
+
 		var target = e.currentTarget
 		var $target = $(target)
 		var media = $target.data('media')
+		var image = $target.find('img')
 
 		if (this.deleteIsArmed) {
 			this.destroy(media._id)
 			$target.remove()
+			return
 		}
-		else {
-			// pick this image ...
-		}
-	},
 
-	destroy: function(_id, cb){
-		$.ajax({
-			type: "delete",
-			url: this.destroyAction,
-			data: { _id: _id, _csrf: $("[name=_csrf]").val() }
-		}).complete(cb || function(){})
+		this.hide()
+		
+		var $ants = $('.ants');
+		var $floatingImg = $('.floatingImg');
+		
+		Scenery.nextMedia = media
+		$floatingImg.attr('src', image.attr('src'));
+
+		var height = $floatingImg.height()
+		var width = $floatingImg.width()
+
+		function _followCursor(e) {
+			$floatingImg.parent().css({
+				top: (e.pageY - (height / 2)) + 'px',
+				left: (e.pageX - (width / 2)) + 'px'
+			});
+		}
+		$(window).on('mousemove', _followCursor);
+		$(window).one('click', function () {
+			var $floatingImg = $('.floatingImg')
+			$floatingImg.attr('src', '');
+			$(window).off('mousemove', _followCursor);
+			$floatingImg.parent().removeClass('edit');
+		});
+		$ants.addClass('edit');
+		_followCursor(e);
 	},
 
 })
-
-//   function placeMedia(evt, img) {
-//   	// JULES DO YO THANG
-//   	alert('Place media at (' + evt.pageX + ', ' + evt.pageY + ')');
-//   }
-// 
-// 	$('.mediaContainer img').mousedown(function(e){
-// 		e.preventDefault()
-// 		e.stopPropagation()
-// 	})
-//   $('.mediaContainer img').click(function (e) {
-// 		e.stopPropagation()
-//   	$(".mediaDrawer, .fileUpload, .addMedia").removeClass("active icon-close");
-//   	$floatingImg.attr('src', $(this).attr('src'));
-//   	function _followCursor(e) {
-//   		$floatingImg.parent().css({
-//   			top: (e.pageY - ($floatingImg.height() / 2)) + 'px',
-//   			left: (e.pageX - ($floatingImg.width() / 2)) + 'px'
-//   		});
-//   	}
-//   	$(window).on('mousemove', _followCursor);
-//   	$(window, this).one('click', function () {
-//   		$floatingImg.attr('src', '');
-//   		$(window).off('mousemove', _followCursor);
-//   		$floatingImg.parent().removeClass('edit');
-//   	});
-//   	$floatingImg.parent().addClass('edit');
-//   	_followCursor(e);
-//   });