From 0d078e48ce71d35bf240ec2b3d48a37f1b96115a Mon Sep 17 00:00:00 2001
From: pdessauw <pdessauw@gmail.com>
Date: Thu, 19 Jun 2014 14:11:57 -0400
Subject: Highlight every uploaded files and scroll down to the last one

---
 apps/files/css/upload.css    | 24 +++++++++++++++++++++
 apps/files/js/file-upload.js |  8 +++++++
 apps/files/js/filelist.js    | 50 ++++++++++++++++++++++++++++++++++++++++++++
 3 files changed, 82 insertions(+)

(limited to 'apps/files')

diff --git a/apps/files/css/upload.css b/apps/files/css/upload.css
index bdc258b5064..98754b910de 100644
--- a/apps/files/css/upload.css
+++ b/apps/files/css/upload.css
@@ -137,3 +137,27 @@
 .oc-dialog .oc-dialog-buttonrow .cancel {
 	float:left;
 }
+
+.highlightUploaded {
+	-webkit-animation: highlightAnimation 2s 1;
+	-moz-animation: highlightAnimation 2s 1;
+	-o-animation: highlightAnimation 2s 1;
+	animation: highlightAnimation 2s 1;
+}
+
+@-webkit-keyframes highlightAnimation {
+  0% { background-color: rgba(255, 255, 140, 1); }
+  100% { background-color: rgba(0, 0, 0, 0); }
+}
+@-moz-keyframes highlightAnimation {
+  0% { background-color: rgba(255, 255, 140, 1); }
+  100% { background-color: rgba(0, 0, 0, 0); }
+}
+@-o-keyframes highlightAnimation {
+  0% { background-color: rgba(255, 255, 140, 1); }
+  100% { background-color: rgba(0, 0, 0, 0); }
+}
+@keyframes highlightAnimation {
+  0% { background-color: rgba(255, 255, 140, 1); }
+  100% { background-color: rgba(0, 0, 0, 0); }
+}
diff --git a/apps/files/js/file-upload.js b/apps/files/js/file-upload.js
index ff999bae4ff..310799b9513 100644
--- a/apps/files/js/file-upload.js
+++ b/apps/files/js/file-upload.js
@@ -427,6 +427,14 @@ OC.Upload = {
 						data.textStatus = 'servererror';
 						data.errorThrown = result[0].data.message; // error message has been translated on server
 						fu._trigger('fail', e, data);
+					} else { // Successful upload
+						// Checking that the uploaded file is the last one and contained in the current directory
+						if (data.files[0] === data.originalFiles[data.originalFiles.length - 1] &&
+							result[0].directory === FileList.getCurrentDirectory()) {
+							// Scroll to the last uploaded file and highlight all of them
+							var fileList = _.pluck(data.originalFiles, 'name');
+							FileList.highlightFiles(fileList);
+						}
 					}
 				},
 				/**
diff --git a/apps/files/js/filelist.js b/apps/files/js/filelist.js
index fd11a80248d..037e04db21c 100644
--- a/apps/files/js/filelist.js
+++ b/apps/files/js/filelist.js
@@ -1856,6 +1856,56 @@
 				self.updateStorageStatistics();
 			});
 
+		},
+
+		/**
+		 * Scroll to the last file of the given list
+		 * Highlight the list of files
+		 * @param files array of filenames
+		 */
+		highlightFiles: function(files) {
+			// Detection of the uploaded element
+			var filename = files[files.length - 1];
+			var $fileRow = this.findFileEl(filename);
+
+			while(!$fileRow.exists() && this._nextPage(false) !== false) { // Checking element existence
+				$fileRow = this.findFileEl(filename);
+			}
+
+			if (!$fileRow.exists()) { // Element not present in the file list
+				return;
+			}
+
+			var currentOffset = this.$container.scrollTop();
+			var additionalOffset = this.$el.find("#controls").height()+this.$el.find("#controls").offset().top;
+
+			// Animation
+			var _this = this;
+			this.$container.animate({
+				// Scrolling to the top of the new element
+				scrollTop: currentOffset + $fileRow.offset().top - $fileRow.height() * 2 - additionalOffset
+			}, {
+				duration: 500,
+				complete: function() {
+					// Highlighting function
+					var highlightRow = function($fileRow) {
+						$fileRow.addClass("highlightUploaded");
+						setTimeout(function() {
+							$fileRow.removeClass("highlightUploaded");
+						}, 2500);
+					};
+
+					// Loop over uploaded files
+					for(var i=0; i<files.length; i++) {
+						var $fileRow = _this.findFileEl(files[i]);
+
+						if($fileRow.length !== 0) { // Checking element existence
+							highlightRow($fileRow);
+						}
+					}
+
+				}
+			});
 		}
 	};
 
-- 
cgit v1.2.3