From e209511f86ec33222f92c80db1c59c3305bef9d5 Mon Sep 17 00:00:00 2001
From: Robin Appelman <icewind1991@gmail.com>
Date: Thu, 4 Aug 2011 00:22:44 +0200
Subject: [PATCH] provide undo button when deleting files from the web
 interface

---
 files/css/files.css       | 13 +++++++++
 files/js/fileactions.js   | 24 +--------------
 files/js/filelist.js      | 61 +++++++++++++++++++++++++++++++++++++++
 files/js/files.js         | 40 ++-----------------------
 files/templates/index.php |  1 +
 5 files changed, 79 insertions(+), 60 deletions(-)

diff --git a/files/css/files.css b/files/css/files.css
index ba2783d8e5..61af30b74e 100644
--- a/files/css/files.css
+++ b/files/css/files.css
@@ -52,3 +52,16 @@ table thead.fixed {height:2em}
 
 /* add breadcrumb divider to the File item in navigation panel */
 #navigation>ul>li:first-child { background:url('../../core/img/breadcrumb-divider-start.png') no-repeat 12.5em 0px; width:12.5em; padding-right:1em; }
+
+#notification{
+	z-index:150;
+	border-radius:10px;
+	background-color:#eee;
+	border:1px solid #ccc;
+	padding-left:1em;
+	padding-right:1em;
+	display:none;
+	position:fixed;
+	top:2.8em;
+	left:40%;
+}
\ No newline at end of file
diff --git a/files/js/fileactions.js b/files/js/fileactions.js
index 359e54dda3..a8de2f9977 100644
--- a/files/js/fileactions.js
+++ b/files/js/fileactions.js
@@ -118,29 +118,7 @@ FileActions.register('all','Download',OC.imagePath('core','actions/download'),fu
 });
 
 FileActions.register('all','Delete',OC.imagePath('core','actions/delete'),function(filename){
-	$( "#delete-confirm" ).dialog({
-		resizable: false,
-		height:200,
-		title:"Delete "+filename,
-		modal: true,
-		buttons: {
-			"Delete": function() {
-				$( this ).dialog( "close" );
-				$.ajax({
-					url: 'ajax/delete.php',
-					data: "dir="+encodeURIComponent($('#dir').val())+"&file="+encodeURIComponent(filename),
-					complete: function(data){
-						boolOperationFinished(data, function(){
-							FileList.remove(filename);
-						});
-					}
-				});
-			},
-			Cancel: function() {
-				$( this ).dialog( "close" );
-			}
-		}
-	});
+	FileList.delete(filename);
 });
 
 FileActions.register('all','Rename',OC.imagePath('core','actions/rename'),function(filename){
diff --git a/files/js/filelist.js b/files/js/filelist.js
index 243c1113a4..b4d0adf982 100644
--- a/files/js/filelist.js
+++ b/files/js/filelist.js
@@ -149,5 +149,66 @@ FileList={
 		input.blur(function(){
 			form.trigger('submit');
 		});
+	},
+	delete:function(files){
+		if(FileList.deleteFiles){//finish any ongoing deletes first
+			FileList.finishDelete(function(){
+				FileList.delete(files);
+			});
+			return;
+		}
+		if(files.substr){
+			files=[files];
+		}
+		$.each(files,function(index,file){
+			$('tr[data-file="'+file+'"]').hide();
+			$('tr[data-file="'+file+'"]').find('input[type="checkbox"]').removeAttr('checked');
+			$('tr[data-file="'+file+'"]').removeClass('selected');
+		});
+		procesSelection();
+		FileList.deleteCanceled=false;
+		FileList.deleteFiles=files;
+		$('#notification').text(files.length+' file'+((files.length>1)?'s':'')+' deleted, click here to undo');
+		
+		$('#notification').show();
+	},
+	finishDelete:function(ready,sync){
+		if(!FileList.deleteCanceled && FileList.deleteFiles){
+			var fileNames=FileList.deleteFiles.join(';');
+			$.ajax({
+				url: 'ajax/delete.php',
+				async:!sync,
+				data: "dir="+$('#dir').val()+"&files="+encodeURIComponent(fileNames),
+				complete: function(data){
+					boolOperationFinished(data, function(){
+						$('#notification').hide();
+						$.each(FileList.deleteFiles,function(index,file){
+// 							alert(file);
+							FileList.remove(file);
+						});
+						FileList.deleteCanceled=true;
+						FileList.deleteFiles=null;
+						if(ready){
+							ready();
+						}
+					});
+				}
+			});
+		}
 	}
 }
+
+$(document).ready(function(){
+	$('#notification').click(function(){
+		FileList.deleteCanceled=true;
+		$('#notification').hide();
+		$.each(FileList.deleteFiles,function(index,file){
+			$('tr[data-file="'+file+'"]').show();
+// 			alert(file);
+		});
+		FileList.deleteFiles=null;
+	});
+	$(window).bind('beforeunload', function (){
+		FileList.finishDelete(null,true);
+	});
+});
diff --git a/files/js/files.js b/files/js/files.js
index ae3561cfa0..49e7cecd09 100644
--- a/files/js/files.js
+++ b/files/js/files.js
@@ -92,43 +92,9 @@ $(document).ready(function() {
 	});
 	
 	$('.delete').click(function(event) {
-		var fileNames=getSelectedFiles('name');
-		var files=fileNames.join(';');
-		var lastFileName=fileNames.pop();
-		if(fileNames.length>0){
-			fileNames=fileNames.join(', ')+' and '+lastFileName;
-		}else{
-			fileNames=lastFileName;
-		}
-
-		$( "#delete-confirm" ).dialog({
-			resizable: false,
-			height:200,
-			modal: true,
-			title:"Delete "+fileNames,
-			buttons: {
-				"Delete": function() {
-					$( this ).dialog( "close" );
-					$.ajax({
-						url: 'ajax/delete.php',
-						data: "dir="+$('#dir').val()+"&files="+encodeURIComponent(files),
-						complete: function(data){
-							boolOperationFinished(data, function(){
-								var files=getSelectedFiles('name');
-							for(var i=0;i<files.length;i++){
-								FileList.remove(files[i]);
-							}
-							procesSelection();
-							});
-						}
-					});
-				},
-				Cancel: function() {
-					$( this ).dialog( "close" );
-				}
-			}
-		});
-		
+		var files=getSelectedFiles('name');
+		event.preventDefault();
+		FileList.delete(files);
 		return false;
 	});
 
diff --git a/files/templates/index.php b/files/templates/index.php
index df78cf0bb2..3f7b45ca85 100644
--- a/files/templates/index.php
+++ b/files/templates/index.php
@@ -20,6 +20,7 @@
 	<div id="file_action_panel">
 	</div>
 </div>
+<div id='notification'></div>
 
 <table cellspacing="0">
 	<thead>