6 files changed, 117 insertions, 5 deletions

diff --git a/public/assets/javascripts/ui/AlertModal.js b/public/assets/javascripts/ui/AlertModal.js
new file mode 100644
index 0000000..c5693ad
--- /dev/null
+++ b/public/assets/javascripts/ui/AlertModal.js
@@ -0,0 +1,25 @@
+
+
+var AlertModal = ModalFormView.extend({
+	el: ".mediaDrawer.alert",
+
+	events: {
+		"click .ok": "advance",
+		"click .close": "advance",
+	},
+	
+	alert: function(message, callback){
+		this.$(".message").html(message)
+		this.callback = callback
+		this.show()
+	},
+	
+	advance: function(e){
+		e && e.preventDefault()
+		this.hide()
+		this.callback && this.callback()
+		this.callback = null
+	}
+
+})
+
diff --git a/public/assets/javascripts/ui/ConfirmModal.js b/public/assets/javascripts/ui/ConfirmModal.js
new file mode 100644
index 0000000..868ce8e
--- /dev/null
+++ b/public/assets/javascripts/ui/ConfirmModal.js
@@ -0,0 +1,25 @@
+
+
+var ConfirmModal = ModalFormView.extend({
+	el: ".mediaDrawer.confirm",
+
+	events: {
+		"click .yes": "advance",
+		"click .no": "hide",
+	},
+	
+	confirm: function(question, callback){
+		this.$(".question").html(question)
+		this.callback = callback
+		this.show()
+	},
+	
+	advance: function(e){
+		e && e.preventDefault()
+		this.hide()
+		this.callback && this.callback()
+		this.callback = null
+	}
+
+})
+
diff --git a/public/assets/javascripts/ui/DocumentModal.js b/public/assets/javascripts/ui/DocumentModal.js
index d9901bd..6f16169 100644
--- a/public/assets/javascripts/ui/DocumentModal.js
+++ b/public/assets/javascripts/ui/DocumentModal.js
@@ -3,6 +3,7 @@ var DocumentModal = ModalFormView.extend({
 	el: ".mediaDrawer.editDocument",
 	createAction: "/api/docs/new",
 	updateAction: "/api/docs/edit",
+	destroyAction: "/api/docs/destroy",
 
 	load: function(name, isNew){
 		this.reset()
@@ -32,9 +33,17 @@ var DocumentModal = ModalFormView.extend({
 			this.show()
 		}, this))
 	},
-
+	
 	success: function(res){
 		window.location.pathname = "/about/" + res.name
-	}
+	},
+
+	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/Router.js b/public/assets/javascripts/ui/Router.js
index a7aa566..85ed1aa 100644
--- a/public/assets/javascripts/ui/Router.js
+++ b/public/assets/javascripts/ui/Router.js
@@ -10,6 +10,7 @@ var Router = View.extend({
 		"click [data-role='edit-profile-modal']": 'editProfile',
 		"click [data-role='new-document-modal']": 'newDocument',
 		"click [data-role='edit-document-modal']": 'editDocument',
+		"click [data-role='delete-document-modal']": 'destroyDocument',
 	},
 	
 	routes: {
@@ -30,6 +31,8 @@ var Router = View.extend({
 		this.editProjectModal = new EditProjectModal()
 		this.editProfileModal = new EditProfileModal()
 		this.documentModal = new DocumentModal()
+		this.confirmModal = new ConfirmModal()
+		this.alertModal = new AlertModal()
 		
 		this.originalPath = window.location.pathname
 		
@@ -115,5 +118,21 @@ var Router = View.extend({
 		this.documentModal.load(name, false)
 	},
 
+	destroyDocument: function(e, name){
+		e && e.preventDefault()
+		
+		var name = e ? $(e.currentTarget).data("name") : name
+		
+		this.confirmModal.confirm("Are you sure you want to delete " + name + "?", $.proxy(function(){
+			this.documentModal.destroy(name, $.proxy(function(){
+				this.alertModal.alert("Document deleted!", $.proxy(function(){
+					window.location.href = "/about"
+				}, this))
+			}, this))
+		}, this))
+		
+		// this.documentModal.destroy(name)
+	},
+
 })
 
diff --git a/public/assets/javascripts/vendor/ModalFormView.js b/public/assets/javascripts/vendor/ModalFormView.js
index f99317b..d084031 100644
--- a/public/assets/javascripts/vendor/ModalFormView.js
+++ b/public/assets/javascripts/vendor/ModalFormView.js
@@ -50,9 +50,11 @@ var ModalFormView = ModalView.extend({
 				}
 			}
 			else {
-				fd.append(this.name, $(this).val());
+				fd.append(this.name, this.value);
 			}
 		});
+		
+		return fd
 	},
 	
 	submit: function(e){
@@ -67,7 +69,7 @@ var ModalFormView = ModalView.extend({
 				return
 			}
 		}
-		
+
 		var request = $.ajax({
 			url: this.action,
 			type: this.method,
diff --git a/public/assets/stylesheets/app.css b/public/assets/stylesheets/app.css
index 7335dc8..53a198a 100755
--- a/public/assets/stylesheets/app.css
+++ b/public/assets/stylesheets/app.css
@@ -325,6 +325,19 @@ h5{
 	margin: 0 auto;
 	text-align: left;
 }
+.docs .content img {
+	max-width: 90%;
+	margin: 0 auto;
+	display: block;
+}
+
+.docs .options {
+	margin: 50px auto 0 auto;
+	padding: 10px;
+	border-top: 1px solid #bbb;
+	font-weight: 300;
+	width: 400px;
+}
 
 .docs .content p {
 	margin: 1em 0;
@@ -712,9 +725,28 @@ content: "\e736"!important;
   -moz-transform:translateY(0%);
   transform:translateY(0%);
 }
-.mediaDrawer.signin, .mediaDrawer.signup{
+.mediaDrawer.signin, .mediaDrawer.signup,
+.mediaDrawer.alert, .mediaDrawer.confirm{
     display:table;
 }
+.confirm button {
+	float: auto;
+	width: 200px;
+	margin: 10px;
+}
+.confirm button.yes {
+	color: red;	
+}
+.confirm button.yes:hover {
+	animation: flicker 0.1s infinite;
+	background: white;
+}
+@keyframes flicker {
+	49% { background: white; color: red; }
+	50% { background: red; color: white; }
+}
+
+
 .image.active {
   background-image:url(https://s3.amazonaws.com/luckyplop/735c46b0268cd511a22c37bc0c11e9f60c4459b2.png)!important;
   cursor:move;