diff options
Diffstat (limited to 'apps/files/js')
| -rw-r--r-- | apps/files/js/filelist.js | 53 | ||||
| -rw-r--r-- | apps/files/js/fileselectionmenu.js | 100 | ||||
| -rw-r--r-- | apps/files/js/merged-index.json | 1 |
3 files changed, 144 insertions, 10 deletions
diff --git a/apps/files/js/filelist.js b/apps/files/js/filelist.js index 307147076b2..ec203043e4f 100644 --- a/apps/files/js/filelist.js +++ b/apps/files/js/filelist.js @@ -126,7 +126,11 @@ * @type OCA.Files.FileActions */ fileActions: null, - + /** + * File selection menu, defaults to OCA.Files.FileSelectionMenu + * @type OCA.Files.FileSelectionMenu + */ + fileSelectionMenu: null, /** * Whether selection is allowed, checkboxes and selection overlay will * be rendered @@ -271,7 +275,8 @@ if (_.isUndefined(options.detailsViewEnabled) || options.detailsViewEnabled) { this._detailsView = new OCA.Files.DetailsView(); this._detailsView.$el.insertBefore(this.$el); - this._detailsView.$el.addClass('disappear'); + // this._detailsView.$el.addClass('disappear'); + this.showDetailsView('/'); } this._initFileActions(options.fileActions); @@ -288,6 +293,28 @@ this.fileSummary = this._createSummary(); + this.fileSelectionMenu = new OCA.Files.FileSelectionMenu([ + { + name: 'moveCopy', + displayName: t('files', 'Move or copy'), + iconClass: 'icon-external', + method: _.bind(this._onClickCopyMoveSelected, this) + }, + { + name: 'download', + displayName: t('files', 'Download'), + iconClass: 'icon-download', + method: _.bind(this._onClickDownloadSelected, this) + }, + { + name: 'delete', + displayName: t('files', 'Delete'), + iconClass: 'icon-delete', + method: _.bind(this._onClickDeleteSelected, this) + } + ]); + this.$el.find('#selectedActionsList').append(this.fileSelectionMenu.$el); + if (options.sorting) { this.setSort(options.sorting.mode, options.sorting.direction, false, false); } else { @@ -339,6 +366,10 @@ this.$el.find('.download').click(_.bind(this._onClickDownloadSelected, this)); this.$el.find('.copy-move').click(_.bind(this._onClickCopyMoveSelected, this)); this.$el.find('.delete-selected').click(_.bind(this._onClickDeleteSelected, this)); + this.$el.find('.actions-selected').click(function () { + self.fileSelectionMenu.show(self); + return false; + }); this.$el.find('.selectedActions a').tooltip({placement:'top'}); @@ -365,6 +396,7 @@ } } + OC.Plugins.attach('OCA.Files.FileList', this); }, @@ -754,6 +786,7 @@ files = _.pluck(this.getSelectedFiles(), 'name'); } + // TODO: Update var downloadFileaction = $('#selectedActionsList').find('.download'); // don't allow a second click on the download action @@ -786,6 +819,7 @@ files = _.pluck(this.getSelectedFiles(), 'name'); + // TODO: Update var moveFileAction = $('#selectedActionsList').find('.move'); // don't allow a second click on the download action @@ -2882,22 +2916,21 @@ selection += ' (' + hiddenInfo + ')'; } + // TODO : Change here!! this.$el.find('#headerName a.name>span:first').text(selection); this.$el.find('#modified a>span:first').text(''); this.$el.find('table').addClass('multiselect'); - this.$el.find('.selectedActions .download').toggleClass('hidden', !this.isSelectedDownloadable()); - this.$el.find('.delete-selected').toggleClass('hidden', !this.isSelectedDeletable()); - var $copyMove = this.$el.find('.selectedActions .copy-move'); + + this.fileSelectionMenu.toggleItemVisibility('download', !this.isSelectedDownloadable()); + this.fileSelectionMenu.toggleItemVisibility('delete', !this.isSelectedDeletable()); + this.fileSelectionMenu.toggleItemVisibility('moveCopy', !this.isSelectedCopiable()); if (this.isSelectedCopiable()) { - $copyMove.toggleClass('hidden', false); if (this.isSelectedMovable()) { - $copyMove.find('.label').text(t('files', 'Move or copy')); + this.fileSelectionMenu.updateItemText('moveCopy', t('files', 'Move or copy')); } else { - $copyMove.find('.label').text(t('files', 'Copy')); + this.fileSelectionMenu.updateItemText('moveCopy', t('files', 'Copy')); } - } else { - $copyMove.toggleClass('hidden', true); } } }, diff --git a/apps/files/js/fileselectionmenu.js b/apps/files/js/fileselectionmenu.js new file mode 100644 index 00000000000..8cb10f08bbc --- /dev/null +++ b/apps/files/js/fileselectionmenu.js @@ -0,0 +1,100 @@ +/* + * Copyright (c) 2018 + * + * This file is licensed under the Affero General Public License version 3 + * or later. + * + * See the COPYING-README file. + * + */ + +(function() { + var TEMPLATE_MENU = + '<ul>' + + '{{#each items}}' + + '<li class="item-{{name}}">' + + '<a href="#" class="menuitem action {{name}} permanent" data-action="{{name}}">' + + '{{#if iconClass}}' + + '<span class="icon {{iconClass}}"></span>' + + '{{else}}' + + '<span class="no-icon"></span>' + + '{{/if}}' + + '<span class="label">{{displayName}}</span>' + + '</li>' + + '{{/each}}' + + '</ul>'; + + var FileSelectionMenu = OC.Backbone.View.extend({ + tagName: 'div', + className: 'filesSelectMenu popovermenu bubble menu-center', + _scopes: null, + /** + * Event handler whenever an action has been clicked within the menu + * + * @param {Object} event event object + */ + _onClickAction: function(event) { + var $target = $(event.currentTarget); + if (!$target.hasClass('menuitem')) { + $target = $target.closest('.menuitem'); + } + + OC.hideMenus(); + + var action = $target.data('action'); + if (!action) { + return; + } + + for (var i = 0; i !== this._scopes.length; ++i) { + var name = this._scopes[i].name; + var method = this._scopes[i].method; + if (name === action) { + method(event); + break; + } + } + + }, + initialize: function(menuItems) { + console.log('init-fileseleectionmenu'); + console.log(menuItems); + this._scopes = menuItems; + }, + events: { + 'click a.action': '_onClickAction' + }, + template: Handlebars.compile(TEMPLATE_MENU), + /** + * Renders the menu with the currently set items + */ + render: function() { + this.$el.html(this.template({ + items: this._scopes + })); + }, + /** + * Displays the menu under the given element + * + * @param {OCA.Files.FileActionContext} context context + * @param {Object} $trigger trigger element + */ + show: function(context) { + this._context = context; + + this.render(); + this.$el.removeClass('hidden'); + + OC.showMenu(null, this.$el); + return false; + }, + toggleItemVisibility: function (itemName, hide) { + this.$el.find('.item-' + itemName).toggleClass('hidden', hide); + }, + updateItemText: function (itemName, translation) { + this.$el.find('.item-' + itemName).find('label').text(translation); + } + }); + + OCA.Files.FileSelectionMenu = FileSelectionMenu; +})(OC, OCA);
\ No newline at end of file diff --git a/apps/files/js/merged-index.json b/apps/files/js/merged-index.json index 127bbb46b29..05b33139e95 100644 --- a/apps/files/js/merged-index.json +++ b/apps/files/js/merged-index.json @@ -6,6 +6,7 @@ "jquery-visibility.js", "fileinfomodel.js", "filesummary.js", + "fileselectionmenu.js", "breadcrumb.js", "filelist.js", "search.js", |