mainfileinfodetailview.js 5.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195
  1. /*
  2. * Copyright (c) 2015
  3. *
  4. * This file is licensed under the Affero General Public License version 3
  5. * or later.
  6. *
  7. * See the COPYING-README file.
  8. *
  9. */
  10. (function() {
  11. /**
  12. * @class OCA.Files.MainFileInfoDetailView
  13. * @classdesc
  14. *
  15. * Displays main details about a file
  16. *
  17. */
  18. var MainFileInfoDetailView = OCA.Files.DetailFileInfoView.extend(
  19. /** @lends OCA.Files.MainFileInfoDetailView.prototype */ {
  20. className: 'mainFileInfoView',
  21. /**
  22. * Associated file list instance, for file actions
  23. *
  24. * @type {OCA.Files.FileList}
  25. */
  26. _fileList: null,
  27. /**
  28. * File actions
  29. *
  30. * @type {OCA.Files.FileActions}
  31. */
  32. _fileActions: null,
  33. /**
  34. * @type {OCA.Files.SidebarPreviewManager}
  35. */
  36. _previewManager: null,
  37. events: {
  38. 'click a.action-favorite': '_onClickFavorite',
  39. 'click a.action-default': '_onClickDefaultAction',
  40. 'click a.permalink': '_onClickPermalink',
  41. 'focus .permalink-field>input': '_onFocusPermalink'
  42. },
  43. template: function(data) {
  44. return OCA.Files.Templates['mainfileinfodetailsview'](data);
  45. },
  46. initialize: function(options) {
  47. options = options || {};
  48. this._fileList = options.fileList;
  49. this._fileActions = options.fileActions;
  50. if (!this._fileList) {
  51. throw 'Missing required parameter "fileList"';
  52. }
  53. if (!this._fileActions) {
  54. throw 'Missing required parameter "fileActions"';
  55. }
  56. this._previewManager = new OCA.Files.SidebarPreviewManager(this._fileList);
  57. this._setupClipboard();
  58. },
  59. _setupClipboard: function() {
  60. var clipboard = new Clipboard('.permalink');
  61. clipboard.on('success', function(e) {
  62. OC.Notification.show(t('files', 'Direct link was copied (only works for people who have access to this file/folder)'), {type: 'success'});
  63. });
  64. clipboard.on('error', function(e) {
  65. var $row = this.$('.permalink-field');
  66. $row.toggleClass('hidden');
  67. if (!$row.hasClass('hidden')) {
  68. $row.find('>input').focus();
  69. }
  70. });
  71. },
  72. _onClickPermalink: function(e) {
  73. e.preventDefault();
  74. return;
  75. },
  76. _onFocusPermalink: function() {
  77. this.$('.permalink-field>input').select();
  78. },
  79. _onClickFavorite: function(event) {
  80. event.preventDefault();
  81. this._fileActions.triggerAction('Favorite', this.model, this._fileList);
  82. },
  83. _onClickDefaultAction: function(event) {
  84. event.preventDefault();
  85. this._fileActions.triggerAction(null, this.model, this._fileList);
  86. },
  87. _onModelChanged: function() {
  88. // simply re-render
  89. this.render();
  90. },
  91. _makePermalink: function(fileId) {
  92. var baseUrl = OC.getProtocol() + '://' + OC.getHost();
  93. return baseUrl + OC.generateUrl('/f/{fileId}', {fileId: fileId});
  94. },
  95. setFileInfo: function(fileInfo) {
  96. if (this.model) {
  97. this.model.off('change', this._onModelChanged, this);
  98. }
  99. this.model = fileInfo;
  100. if (this.model) {
  101. this.model.on('change', this._onModelChanged, this);
  102. }
  103. if (this.model) {
  104. var properties = [];
  105. if( !this.model.has('size') ) {
  106. properties.push(OC.Files.Client.PROPERTY_SIZE);
  107. properties.push(OC.Files.Client.PROPERTY_GETCONTENTLENGTH);
  108. }
  109. if( properties.length > 0){
  110. this.model.reloadProperties(properties);
  111. }
  112. }
  113. this.render();
  114. },
  115. /**
  116. * Renders this details view
  117. */
  118. render: function() {
  119. this.trigger('pre-render');
  120. if (this.model) {
  121. var isFavorite = (this.model.get('tags') || []).indexOf(OC.TAG_FAVORITE) >= 0;
  122. var availableActions = this._fileActions.get(
  123. this.model.get('mimetype'),
  124. this.model.get('type'),
  125. this.model.get('permissions'),
  126. this.model.get('name')
  127. );
  128. var hasFavoriteAction = 'Favorite' in availableActions;
  129. this.$el.html(this.template({
  130. type: this.model.isImage()? 'image': '',
  131. nameLabel: t('files', 'Name'),
  132. name: this.model.get('displayName') || this.model.get('name'),
  133. pathLabel: t('files', 'Path'),
  134. path: this.model.get('path'),
  135. hasSize: this.model.has('size'),
  136. sizeLabel: t('files', 'Size'),
  137. size: OC.Util.humanFileSize(this.model.get('size'), true, false),
  138. altSize: n('files', '%n byte', '%n bytes', this.model.get('size')),
  139. dateLabel: t('files', 'Modified'),
  140. altDate: OC.Util.formatDate(this.model.get('mtime')),
  141. timestamp: this.model.get('mtime'),
  142. date: OC.Util.relativeModifiedDate(this.model.get('mtime')),
  143. hasFavoriteAction: hasFavoriteAction,
  144. starAltText: isFavorite ? t('files', 'Favorited') : t('files', 'Favorite'),
  145. starClass: isFavorite ? 'icon-starred' : 'icon-star',
  146. permalink: this._makePermalink(this.model.get('id')),
  147. permalinkTitle: t('files', 'Copy direct link (only works for people who have access to this file/folder)')
  148. }));
  149. // TODO: we really need OC.Previews
  150. var $iconDiv = this.$el.find('.thumbnail');
  151. var $container = this.$el.find('.thumbnailContainer');
  152. if (!this.model.isDirectory()) {
  153. $iconDiv.addClass('icon-loading icon-32');
  154. this._previewManager.loadPreview(this.model, $iconDiv, $container);
  155. } else {
  156. var iconUrl = this.model.get('icon') || OC.MimeType.getIconUrl('dir');
  157. if (typeof this.model.get('mountType') !== 'undefined') {
  158. iconUrl = OC.MimeType.getIconUrl('dir-' + this.model.get('mountType'))
  159. }
  160. $iconDiv.css('background-image', 'url("' + iconUrl + '")');
  161. }
  162. } else {
  163. this.$el.empty();
  164. }
  165. this.delegateEvents();
  166. this.trigger('post-render');
  167. }
  168. });
  169. OCA.Files.MainFileInfoDetailView = MainFileInfoDetailView;
  170. })();