Merge pull request #8791 from owncloud/share-overview-sharewithstatus

Update share action text to display owner/recipients

1 files changed, 102 insertions, 33 deletions

diff --git a/core/js/share.js b/core/js/share.js
index bcc04225b9f..7e3b0d8c65d 100644
--- a/core/js/share.js
+++ b/core/js/share.js
@@ -3,8 +3,25 @@ OC.Share={
 	SHARE_TYPE_GROUP:1,
 	SHARE_TYPE_LINK:3,
 	SHARE_TYPE_EMAIL:4,
+	/**
+	 * @deprecated use OC.Share.currentShares instead
+	 */
 	itemShares:[],
+	/**
+	 * Full list of all share statuses
+	 */
 	statuses:{},
+	/**
+	 * Shares for the currently selected file.
+	 * (for which the dropdown is open)
+	 *
+	 * Key is item type and value is an array or
+	 * shares of the given item type.
+	 */
+	currentShares: {},
+	/**
+	 * Whether the share dropdown is opened.
+	 */
 	droppedDown:false,
 	/**
 	 * Loads ALL share statuses from server, stores them in
@@ -54,8 +71,9 @@ OC.Share={
 			$fileList = fileList.$fileList;
 			currentDir = fileList.getCurrentDirectory();
 		}
+		// TODO: iterating over the files might be more efficient
 		for (item in OC.Share.statuses){
-			var image = OC.imagePath('core', 'actions/shared');
+			var image = OC.imagePath('core', 'actions/share');
 			var data = OC.Share.statuses[item];
 			var hasLink = data.link;
 			// Links override shared in terms of icon display
@@ -63,20 +81,14 @@ OC.Share={
 				image = OC.imagePath('core', 'actions/public');
 			}
 			if (itemType !== 'file' && itemType !== 'folder') {
-				$fileList.find('a.share[data-item="'+item+'"]').css('background', 'url('+image+') no-repeat center');
+				$('a.share[data-item="'+item+'"]').css('background', 'url('+image+') no-repeat center');
 			} else {
+				// TODO: ultimately this part should be moved to files_sharing app
 				var file = $fileList.find('tr[data-id="'+item+'"]');
 				var shareFolder = OC.imagePath('core', 'filetypes/folder-shared');
 				var img;
 				if (file.length > 0) {
-					var type = file.data('type');
-					if (type === 'dir') {
-						file.children('.filename').css('background-image', 'url('+shareFolder+')');
-					}
-					var action = $(file).find('.fileactions .action[data-action="Share"]');
-					img = action.find('img').attr('src', image);
-					action.addClass('permanent');
-					action.html(' <span>'+t('core', 'Shared')+'</span>').prepend(img);
+					this.markFileAsShared(file, true, hasLink);
 				} else {
 					var dir = currentDir;
 					if (dir.length > 1) {
@@ -89,6 +101,7 @@ OC.Share={
 								var files = $fileList.find('.filename');
 								var i;
 								for (i = 0; i < actions.length; i++) {
+									// TODO: use this.markFileAsShared()
 									img = $(actions[i]).find('img');
 									if (img.attr('src') !== OC.imagePath('core', 'actions/public')) {
 										img.attr('src', image);
@@ -125,35 +138,19 @@ OC.Share={
 					}
 				} else if (OC.Share.itemShares[index].length > 0) {
 					shares = true;
-					image = OC.imagePath('core', 'actions/shared');
+					image = OC.imagePath('core', 'actions/share');
 				}
 			}
 		});
 		if (itemType != 'file' && itemType != 'folder') {
 			$('a.share[data-item="'+itemSource+'"]').css('background', 'url('+image+') no-repeat center');
 		} else {
-			var file = $('tr').filterAttr('data-id', String(itemSource));
-			if (file.length > 0) {
-				var type = file.data('type');
-				var shareFolder = OC.imagePath('core', 'filetypes/folder');
-				if (type === 'dir' && shares) {
-					shareFolder = OC.imagePath('core', 'filetypes/folder-shared');
-					file.children('.filename').css('background-image', 'url('+shareFolder+')');
-				} else if (type === 'dir') {
-					file.children('.filename').css('background-image', 'url('+shareFolder+')');
-				}
-				var action = $(file).find('.fileactions .action').filterAttr('data-action', 'Share');
-				// in case of multiple lists/rows, there might be more than one visible
-				action.each(function() {
-					var action = $(this);
-					var img = action.find('img').attr('src', image);
-					if (shares) {
-						action.addClass('permanent');
-						action.html(' <span>'+ escapeHTML(t('core', 'Shared'))+'</span>').prepend(img);
-					} else {
-						action.removeClass('permanent');
-						action.html(' <span>'+ escapeHTML(t('core', 'Share'))+'</span>').prepend(img);
-					}
+			var $tr = $('tr').filterAttr('data-id', String(itemSource));
+			if ($tr.length > 0) {
+				// it might happen that multiple lists exist in the DOM
+				// with the same id
+				$tr.each(function() {
+					OC.Share.markFileAsShared($(this), shares, link);
 				});
 			}
 		}
@@ -164,6 +161,60 @@ OC.Share={
 			delete OC.Share.statuses[itemSource];
 		}
 	},
+	/**
+	 * Marks/unmarks a given file as shared by changing its action icon
+	 * and folder icon.
+	 *
+	 * @param $tr file element to mark as shared
+	 * @param hasShares whether shares are available
+	 * @param hasLink whether link share is available
+	 */
+	markFileAsShared: function($tr, hasShares, hasLink) {
+		var action = $tr.find('.fileactions .action[data-action="Share"]');
+		var type = $tr.data('type');
+		var img = action.find('img');
+		var message;
+		var recipients;
+		var owner = $tr.attr('data-share-owner');
+		var shareFolderIcon;
+		var image = OC.imagePath('core', 'actions/share');
+		// update folder icon
+		if (type === 'dir' && (hasShares || hasLink)) {
+			if (hasLink) {
+				shareFolderIcon = OC.imagePath('core', 'filetypes/folder-public');
+			}
+			else {
+				shareFolderIcon = OC.imagePath('core', 'filetypes/folder-shared');
+			}
+			$tr.children('.filename').css('background-image', 'url(' + shareFolderIcon + ')');
+		} else if (type === 'dir') {
+			shareFolderIcon = OC.imagePath('core', 'filetypes/folder');
+			$tr.children('.filename').css('background-image', 'url(' + shareFolderIcon + ')');
+		}
+		// update share action text / icon
+		if (hasShares || owner) {
+			recipients = $tr.attr('data-share-recipients');
+
+			action.addClass('permanent');
+			message = t('core', 'Shared');
+			// even if reshared, only show "Shared by"
+			if (owner) {
+				message = t('files_sharing', 'Shared by {owner}', {owner: owner});
+			}
+			else if (recipients) {
+				message = t('core', 'Shared with {recipients}', {recipients: recipients});
+			}
+			action.html(' <span>'+ message + '</span>').prepend(img);
+		}
+		else {
+			action.removeClass('permanent');
+			action.html(' <span>'+ escapeHTML(t('core', 'Share'))+'</span>').prepend(img);
+		}
+		if (hasLink) {
+			image = OC.imagePath('core', 'actions/public');
+		}
+		img.attr('src', image);
+	},
 	loadItem:function(itemType, itemSource) {
 		var data = '';
 		var checkReshare = true;
@@ -319,6 +370,7 @@ OC.Share={
 			dropDownEl = dropDownEl.appendTo(appendTo);
 			// Reset item shares
 			OC.Share.itemShares = [];
+			OC.Share.currentShares = {};
 			if (data.shares) {
 				$.each(data.shares, function(index, share) {
 					if (share.share_type == OC.Share.SHARE_TYPE_LINK) {
@@ -392,6 +444,7 @@ OC.Share={
 				OC.Share.share(itemType, itemSource, shareType, shareWith, permissions, itemSourceName, expirationDate, function() {
 					OC.Share.addShareWith(shareType, shareWith, selected.item.label, permissions, possiblePermissions);
 					$('#shareWith').val('');
+					$('#dropdown').trigger(new $.Event('sharesChanged', {shares: OC.Share.currentShares}));
 					OC.Share.updateIcon(itemType, itemSource);
 				});
 				return false;
@@ -448,6 +501,7 @@ OC.Share={
 		$('#shareWith').focus();
 	},
 	hideDropDown:function(callback) {
+		OC.Share.currentShares = null;
 		$('#dropdown').hide('blind', function() {
 			OC.Share.droppedDown = false;
 			$('#dropdown').remove();
@@ -460,6 +514,12 @@ OC.Share={
 		});
 	},
 	addShareWith:function(shareType, shareWith, shareWithDisplayName, permissions, possiblePermissions, mailSend, collection) {
+		var shareItem = {
+			share_type: shareType,
+			share_with: shareWith,
+			share_with_displayname: shareWithDisplayName,
+			permissions: permissions
+		};
 		if (shareType === 1) {
 			shareWithDisplayName = shareWithDisplayName + " (" + t('core', 'group') + ')';
 		}
@@ -538,6 +598,10 @@ OC.Share={
 				html.find('.cruds').before(showCrudsButton);
 			}
 			$('#expiration').show();
+			if (!OC.Share.currentShares[shareType]) {
+				OC.Share.currentShares[shareType] = [];
+			}
+			OC.Share.currentShares[shareType].push(shareItem);
 		}
 	},
 	showLink:function(token, password, itemSource) {
@@ -673,6 +737,9 @@ $(document).ready(function() {
 			$li.remove();
 			var index = OC.Share.itemShares[shareType].indexOf(shareWith);
 			OC.Share.itemShares[shareType].splice(index, 1);
+			// updated list of shares
+			OC.Share.currentShares[shareType].splice(index, 1);
+			$('#dropdown').trigger(new $.Event('sharesChanged', {shares: OC.Share.currentShares}));
 			OC.Share.updateIcon(itemType, itemSource);
 			if (typeof OC.Share.statuses[itemSource] === 'undefined') {
 				$('#expiration').hide('blind');
@@ -731,6 +798,7 @@ $(document).ready(function() {
 			if (oc_appconfig.core.enforcePasswordForPublicLink === false) {
 				OC.Share.share(itemType, itemSource, OC.Share.SHARE_TYPE_LINK, '', OC.PERMISSION_READ, itemSourceName, expirationDate, function(data) {
 					OC.Share.showLink(data.token, null, itemSource);
+					$('#dropdown').trigger(new $.Event('sharesChanged', {shares: OC.Share.currentShares}));
 					OC.Share.updateIcon(itemType, itemSource);
 				});
 			} else {
@@ -743,6 +811,7 @@ $(document).ready(function() {
 			if ($('#linkText').val() !== '') {
 				OC.Share.unshare(itemType, itemSource, OC.Share.SHARE_TYPE_LINK, '', function() {
 					OC.Share.itemShares[OC.Share.SHARE_TYPE_LINK] = false;
+					$('#dropdown').trigger(new $.Event('sharesChanged', {shares: OC.Share.currentShares}));
 					OC.Share.updateIcon(itemType, itemSource);
 					if (typeof OC.Share.statuses[itemSource] === 'undefined') {
 						$('#expiration').hide('blind');