Merge pull request #57 from nextcloud/fdrop-template

smaller files drop fixes

2 files changed, 38 insertions, 3 deletions

diff --git a/apps/files/ajax/upload.php b/apps/files/ajax/upload.php
index 98066845734..d243b6ad97e 100644
--- a/apps/files/ajax/upload.php
+++ b/apps/files/ajax/upload.php
@@ -43,6 +43,7 @@ OCP\JSON::setContentTypeHeader('text/plain');
 // If no token is sent along, rely on login only
 
 $errorCode = null;
+$errorFileName = null;
 
 $l = \OC::$server->getL10N('files');
 if (empty($_POST['dirToken'])) {
@@ -225,6 +226,7 @@ if (\OC\Files\Filesystem::isValidPath($dir) === true) {
 
 				} else {
 					$error = $l->t('Upload failed. Could not find uploaded file');
+					$errorFileName = $files['name'][$i];
 				}
 			} catch(Exception $ex) {
 				$error = $ex->getMessage();
@@ -272,5 +274,9 @@ if ($error === false) {
 	}
 	OCP\JSON::encodedPrint($result);
 } else {
-	OCP\JSON::error(array(array('data' => array_merge(array('message' => $error, 'code' => $errorCode), $storageStats))));
+	OCP\JSON::error(array(array('data' => array_merge(array(
+		'message' => $error,
+		'code' => $errorCode,
+		'filename' => $errorFileName
+	), $storageStats))));
 }
diff --git a/apps/files_sharing/js/files_drop.js b/apps/files_sharing/js/files_drop.js
index 0a6a1c7567f..984eb06b9e3 100644
--- a/apps/files_sharing/js/files_drop.js
+++ b/apps/files_sharing/js/files_drop.js
@@ -9,12 +9,24 @@
  */
 
 (function ($) {
+	var TEMPLATE =
+		'<li data-toggle="tooltip" title="{{name}}" data-name="{{name}}">' +
+		'{{#if isUploading}}' +
+		'<span class="icon-loading-small"></span> {{name}}' +
+		'{{else}}' +
+		'<img src="' + OC.imagePath('core', 'actions/error.svg') + '"/> {{name}}' +
+		'{{/if}}' +
+		'</li>';
 	var Drop = {
+		/** @type {Function} **/
+		_template: undefined,
+
 		initialize: function () {
 			$(document).bind('drop dragover', function (e) {
 				// Prevent the default browser drop action:
 				e.preventDefault();
 			});
+			var output = this.template();
 			$('#public-upload').fileupload({
 				url: OC.linkTo('files', 'ajax/upload.php'),
 				dataType: 'json',
@@ -32,12 +44,12 @@
 					$('#drop-upload-progress-indicator').removeClass('hidden');
 					_.each(data['files'], function(file) {
 						if(errors.length === 0) {
-							$('#public-upload ul').append('<li data-toggle="tooltip" title="'+escapeHTML(file.name)+'" data-name="'+escapeHTML(file.name)+'"><span class="icon-loading-small"></span> '+escapeHTML(file.name)+'</li>');
+							$('#public-upload ul').append(output({isUploading: true, name: escapeHTML(file.name)}));
 							$('[data-toggle="tooltip"]').tooltip();
 							data.submit();
 						} else {
 							OC.Notification.showTemporary(OC.L10N.translate('files_sharing', 'Could not upload "{filename}"', {filename: file.name}));
-							$('#public-upload ul').append('<li data-toggle="tooltip" title="'+escapeHTML(file.name)+'" data-name="'+escapeHTML(file.name)+'"><img src="'+OC.imagePath('core', 'actions/error.svg')+'"/> '+escapeHTML(file.name)+'</li>');
+							$('#public-upload ul').append(output({isUploading: false, name: escapeHTML(file.name)}));
 							$('[data-toggle="tooltip"]').tooltip();
 						}
 					});
@@ -47,7 +59,13 @@
 						var mimeTypeUrl = OC.MimeType.getIconUrl(response['mimetype']);
 						$('#public-upload ul li[data-name="' + escapeHTML(response['filename']) + '"]').html('<img src="' + escapeHTML(mimeTypeUrl) + '"/> ' + escapeHTML(response['filename']));
 						$('[data-toggle="tooltip"]').tooltip();
+					} else {
+						var name = response[0]['data']['filename'];
+						OC.Notification.showTemporary(OC.L10N.translate('files_sharing', 'Could not upload "{filename}"', {filename: name}));
+						$('#public-upload ul li[data-name="' + escapeHTML(name) + '"]').html(output({isUploading: false, name: escapeHTML(name)}));
+						$('[data-toggle="tooltip"]').tooltip();
 					}
+
 				},
 				progressall: function (e, data) {
 					var progress = parseInt(data.loaded / data.total * 100, 10);
@@ -64,6 +82,17 @@
 				e.preventDefault();
 				$('#public-upload #emptycontent input').focus().trigger('click');
 			});
+		},
+
+		/**
+		 * @returns {Function} from Handlebars
+		 * @private
+		 */
+		template: function () {
+			if (!this._template) {
+				this._template = Handlebars.compile(TEMPLATE);
+			}
+			return this._template;
 		}
 	};