More fixes to the right sidebar

Sidebar now works in all file list views.
Moved owner to share tab.

3 files changed, 56 insertions, 54 deletions

diff --git a/apps/files/js/detailsview.js b/apps/files/js/detailsview.js
index 719299485a6..d69d8c09c16 100644
--- a/apps/files/js/detailsview.js
+++ b/apps/files/js/detailsview.js
@@ -18,6 +18,7 @@
 		'        <ul class="tabHeadsContainer">' +
 		'        </ul>' +
 		'    </div>' +
+		'    <a class="close icon-close" href="#" alt="{{closeLabel}}"></a>' +
 		'</div>';
 
 	var TEMPLATE_TAB_HEADER =
@@ -72,10 +73,16 @@
 		 * Initialize the details view
 		 */
 		initialize: function() {
+			var self = this;
 			this.$el = $('<div class="detailsView"></div>');
 			this.fileInfo = null;
 			this._tabViews = [];
 			this._detailFileInfoViews = [];
+
+			this.$el.on('click', 'a.close', function(event) {
+				self.$el.addClass('disappear');
+				event.preventDefault();
+			});
 		},
 
 		/**
@@ -102,7 +109,9 @@
 				this._templateTabHeader = Handlebars.compile(TEMPLATE_TAB_HEADER);
 			}
 
-			var $el = $(this._template());
+			var $el = $(this._template({
+				closeLabel: t('files', 'Close')
+			}));
 			var $tabsContainer = $el.find('.tabsContainer');
 			var $tabHeadsContainer = $el.find('.tabHeadsContainer');
 			var $detailsContainer = $el.find('.detailFileInfoContainer');
@@ -144,6 +153,8 @@
 		setFileInfo: function(fileInfo) {
 			this._fileInfo = fileInfo;
 
+			this.render();
+
 			// notify all panels
 			_.each(this._tabViews, function(tabView) {
 				tabView.setFileInfo(fileInfo);
diff --git a/apps/files/js/filelist.js b/apps/files/js/filelist.js
index 355c76f9c64..9f0d48ff011 100644
--- a/apps/files/js/filelist.js
+++ b/apps/files/js/filelist.js
@@ -210,6 +210,11 @@
 			}
 			this.breadcrumb = new OCA.Files.BreadCrumb(breadcrumbOptions);
 
+			this._detailsView = new OCA.Files.DetailsView();
+			this._detailsView.addDetailView(new OCA.Files.MainFileInfoDetailView());
+			this.$el.append(this._detailsView.$el);
+			this._detailsView.$el.addClass('disappear');
+
 			this.$el.find('#controls').prepend(this.breadcrumb.$el);
 
 			this.$el.find('thead th .columntitle').click(_.bind(this._onClickHeader, this));
@@ -224,7 +229,7 @@
 			this.$el.on('click', function(event) {
 				var $target = $(event.target);
 				// click outside file row ?
-				if (!$target.closest('tbody').length) {
+				if (!$target.closest('tbody').length && !$target.closest('.detailsView').length) {
 					self._updateDetailsView(null);
 				}
 			});
@@ -282,32 +287,16 @@
 		_updateDetailsView: function(fileInfo) {
 			var self = this;
 			if (!fileInfo) {
-				if (this._detailsView) {
-					// hide it
-					this._detailsView.$el.addClass('disappear');
-					this._detailsView.setFileInfo(null);
-				}
+				this._detailsView.$el.addClass('disappear');
+				this._detailsView.setFileInfo(null);
 				return;
 			}
 
-			if (!this._detailsView) {
-				this._detailsView = new OCA.Files.DetailsView();
-				this._detailsView.addDetailView(new OCA.Files.MainFileInfoDetailView());
-				_.each(this._detailFileInfoViews, function(view) {
-					self._detailsView.addDetailView(view);
-				});
-				_.each(this._tabViews, function(view) {
-					self._detailsView.addTabView(view);
-				});
-				this.$el.append(this._detailsView.$el);
-				this._detailsView.$el.addClass('disappear');
-				this._detailsView.render();
-			}
 			this._detailsView.setFileInfo(_.extend({
 				path: this.getCurrentDirectory()
 			}, fileInfo));
 			_.defer(function() {
-				self._detailsView.$el.removeClass('disappear');
+				self._detailsView.$el.removeClass('disappear hidden');
 			});
 		},
 
@@ -364,6 +353,12 @@
 				delete this._selectedFiles[$tr.data('id')];
 				this._selectionSummary.remove(data);
 			}
+			if (this._selectionSummary.getTotal() === 1) {
+				this._updateDetailsView(_.values(this._selectedFiles)[0]);
+			} else {
+				// show nothing when multiple files are selected
+				this._updateDetailsView(null);
+			}
 			this.$el.find('.select-all').prop('checked', this._selectionSummary.getTotal() === this.files.length);
 		},
 
@@ -2233,6 +2228,20 @@
 
 				}
 			});
+		},
+
+		/**
+		 * Register a tab view to be added to all views
+		 */
+		registerTabView: function(tabView) {
+			this._detailsView.addTabView(tabView);
+		},
+
+		/**
+		 * Register a detail view to be added to all views
+		 */
+		registerDetailView: function(detailView) {
+			this._detailsView.addDetailView(detailView);
 		}
 	};
 
@@ -2285,34 +2294,6 @@
 	};
 
 	/**
-	 * Globally registered tab views
-	 *
-	 * @type OCA.Files.DetailTabView
-	 */
-	FileList.prototype._tabViews = [];
-
-	/**
-	 * Globally registered detail views
-	 *
-	 * @type OCA.Files.DetailFileInfoView
-	 */
-	FileList.prototype._detailFileInfoViews = [];
-
-	/**
-	 * Register a tab view to be added to all views
-	 */
-	FileList.prototype.registerTabView = function(tabView) {
-		this._tabViews.push(tabView);
-	};
-
-	/**
-	 * Register a detail view to be added to all views
-	 */
-	FileList.prototype.registerDetailView = function(detailView) {
-		this._detailFileInfoViews.push(detailView);
-	};
-
-	/**
 	 * File info attributes.
 	 *
 	 * @todo make this a real class in the future
diff --git a/apps/files/js/mainfileinfodetailview.js b/apps/files/js/mainfileinfodetailview.js
index 5eb74145f12..88463bda9e6 100644
--- a/apps/files/js/mainfileinfodetailview.js
+++ b/apps/files/js/mainfileinfodetailview.js
@@ -11,7 +11,14 @@
 (function() {
 	var TEMPLATE =
 		'<div class="thumbnail"></div><div class="fileName">{{name}}</div>' +
-		'<div><span title="{{altSize}}">{{size}}</span>, <span title="{{altDate}}">{{date}}</span></div>';
+		'<div>' +
+		'    <a href="#" ' +
+		'    alt="{{starAltText}}"' +
+		'    class="action action-favorite {{#isFavorite}}permanent{{/isFavorite}}">' +
+		'    <img class="svg" src="{{starIcon}}" />' +
+		'    </a>' +
+		'    <span title="{{altSize}}">{{size}}</span>, <span title="{{altDate}}">{{date}}</span>' +
+		'</div>';
 
 	/**
 	 * @class OCA.Files.MainFileInfoDetailView
@@ -48,6 +55,7 @@
 			}
 
 			if (this._fileInfo) {
+				var isFavorite = (this._fileInfo.tags || []).indexOf(OC.TAG_FAVORITE) >= 0
 				this.$el.append(this._template({
 					nameLabel: t('files', 'Name'),
 					name: this._fileInfo.name,
@@ -56,10 +64,13 @@
 					sizeLabel: t('files', 'Size'),
 					// TODO: refactor and use size formatter
 					size: OC.Util.humanFileSize(this._fileInfo.size, true),
-					altSize: this._fileInfo.size,
+					altSize: n('files', '%n byte', '%n bytes', this._fileInfo.size),
 					dateLabel: t('files', 'Modified'),
 					altDate: OC.Util.formatDate(this._fileInfo.mtime),
-					date: OC.Util.relativeModifiedDate(this._fileInfo.mtime)
+					date: OC.Util.relativeModifiedDate(this._fileInfo.mtime),
+					isFavorite: isFavorite,
+					starAltText: isFavorite ? t('files', 'Favorited') : t('files', 'Favorite'),
+					starIcon: OC.imagePath('core', isFavorite ? 'actions/starred' : 'actions/star')
 				}));
 
 				var $iconDiv = this.$el.find('.thumbnail');
@@ -78,8 +89,7 @@
 					// TODO: special icons / shared / external
 					$iconDiv.css('background-image', 'url("' + OC.MimeType.getIconUrl('dir') + '")');
 				}
-			} else {
-				// TODO: render placeholder text?
+				this.$el.find('[title]').tipsy();
 			}
 		}
 	});