Merge pull request #15436 from nextcloud/refactor/oc-menu-helpers-bundle
Move OC legacy menu helpers to the bundle
This commit is contained in:
Morris Jobke
GitHub
commit
a3800a6810
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
110
core/js/js.js
110
core/js/js.js
|
|
@ -419,116 +419,6 @@ Object.assign(window.OC, {
|
|||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* For menu toggling
|
||||
* @todo Write documentation
|
||||
*
|
||||
* @param {jQuery} $toggle
|
||||
* @param {jQuery} $menuEl
|
||||
* @param {function|undefined} toggle callback invoked everytime the menu is opened
|
||||
* @param {boolean} headerMenu is this a top right header menu?
|
||||
* @returns {undefined}
|
||||
*/
|
||||
registerMenu: function($toggle, $menuEl, toggle, headerMenu) {
|
||||
var self = this;
|
||||
$menuEl.addClass('menu');
|
||||
|
||||
// On link, the enter key trigger a click event
|
||||
// Only use the click to avoid two fired events
|
||||
$toggle.on($toggle.prop('tagName') === 'A'
|
||||
? 'click.menu'
|
||||
: 'click.menu keyup.menu', function(event) {
|
||||
// prevent the link event (append anchor to URL)
|
||||
event.preventDefault();
|
||||
|
||||
// allow enter key as a trigger
|
||||
if (event.key && event.key !== "Enter") {
|
||||
return;
|
||||
}
|
||||
|
||||
if ($menuEl.is(OC._currentMenu)) {
|
||||
self.hideMenus();
|
||||
return;
|
||||
}
|
||||
// another menu was open?
|
||||
else if (OC._currentMenu) {
|
||||
// close it
|
||||
self.hideMenus();
|
||||
}
|
||||
|
||||
if (headerMenu === true) {
|
||||
$menuEl.parent().addClass('openedMenu');
|
||||
}
|
||||
|
||||
// Set menu to expanded
|
||||
$toggle.attr('aria-expanded', true);
|
||||
|
||||
$menuEl.slideToggle(OC.menuSpeed, toggle);
|
||||
OC._currentMenu = $menuEl;
|
||||
OC._currentMenuToggle = $toggle;
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* @todo Write documentation
|
||||
*/
|
||||
unregisterMenu: function($toggle, $menuEl) {
|
||||
// close menu if opened
|
||||
if ($menuEl.is(OC._currentMenu)) {
|
||||
this.hideMenus();
|
||||
}
|
||||
$toggle.off('click.menu').removeClass('menutoggle');
|
||||
$menuEl.removeClass('menu');
|
||||
},
|
||||
|
||||
/**
|
||||
* Hides any open menus
|
||||
*
|
||||
* @param {Function} complete callback when the hiding animation is done
|
||||
*/
|
||||
hideMenus: function(complete) {
|
||||
if (OC._currentMenu) {
|
||||
var lastMenu = OC._currentMenu;
|
||||
OC._currentMenu.trigger(new $.Event('beforeHide'));
|
||||
OC._currentMenu.slideUp(OC.menuSpeed, function() {
|
||||
lastMenu.trigger(new $.Event('afterHide'));
|
||||
if (complete) {
|
||||
complete.apply(this, arguments);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Set menu to closed
|
||||
$('.menutoggle').attr('aria-expanded', false);
|
||||
|
||||
$('.openedMenu').removeClass('openedMenu');
|
||||
OC._currentMenu = null;
|
||||
OC._currentMenuToggle = null;
|
||||
},
|
||||
|
||||
/**
|
||||
* Shows a given element as menu
|
||||
*
|
||||
* @param {Object} [$toggle=null] menu toggle
|
||||
* @param {Object} $menuEl menu element
|
||||
* @param {Function} complete callback when the showing animation is done
|
||||
*/
|
||||
showMenu: function($toggle, $menuEl, complete) {
|
||||
if ($menuEl.is(OC._currentMenu)) {
|
||||
return;
|
||||
}
|
||||
this.hideMenus();
|
||||
OC._currentMenu = $menuEl;
|
||||
OC._currentMenuToggle = $toggle;
|
||||
$menuEl.trigger(new $.Event('beforeShow'));
|
||||
$menuEl.show();
|
||||
$menuEl.trigger(new $.Event('afterShow'));
|
||||
// no animation
|
||||
if (_.isFunction(complete)) {
|
||||
complete();
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Returns the user's locale as a BCP 47 compliant language tag
|
||||
*
|
||||
|
|
|
|||
|
|
@ -40,6 +40,12 @@ import ContactsMenu from './contactsmenu'
|
|||
import Dialogs from './dialogs'
|
||||
import EventSource from './eventsource'
|
||||
import {get, set} from './get_set'
|
||||
import {
|
||||
hideMenus,
|
||||
registerMenu,
|
||||
showMenu,
|
||||
unregisterMenu,
|
||||
} from './menu'
|
||||
import {isUserAdmin} from './admin'
|
||||
import L10N from './l10n'
|
||||
import {
|
||||
|
|
@ -88,6 +94,15 @@ export default {
|
|||
EventSource,
|
||||
isUserAdmin,
|
||||
L10N,
|
||||
|
||||
/*
|
||||
* Legacy menu helpers
|
||||
*/
|
||||
hideMenus,
|
||||
registerMenu,
|
||||
showMenu,
|
||||
unregisterMenu,
|
||||
|
||||
msg,
|
||||
Notification,
|
||||
PasswordConfirmation,
|
||||
|
|
|
|||
|
|
@ -0,0 +1,135 @@
|
|||
/*
|
||||
* @copyright 2019 Christoph Wurst <christoph@winzerhof-wurst.at>
|
||||
*
|
||||
* @author 2019 Christoph Wurst <christoph@winzerhof-wurst.at>
|
||||
*
|
||||
* @license GNU AGPL version 3 or any later version
|
||||
*
|
||||
* This program is free software: you can redistribute it and/or modify
|
||||
* it under the terms of the GNU Affero General Public License as
|
||||
* published by the Free Software Foundation, either version 3 of the
|
||||
* License, or (at your option) any later version.
|
||||
*
|
||||
* This program is distributed in the hope that it will be useful,
|
||||
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
* GNU Affero General Public License for more details.
|
||||
*
|
||||
* You should have received a copy of the GNU Affero General Public License
|
||||
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||
*/
|
||||
|
||||
import _ from 'underscore'
|
||||
import $ from 'jquery'
|
||||
|
||||
import {menuSpeed} from './constants'
|
||||
|
||||
let currentMenu = null
|
||||
let currentMenuToggle = null
|
||||
|
||||
/**
|
||||
* For menu toggling
|
||||
*
|
||||
* @param {jQuery} $toggle
|
||||
* @param {jQuery} $menuEl
|
||||
* @param {function|undefined} toggle callback invoked everytime the menu is opened
|
||||
* @param {boolean} headerMenu is this a top right header menu?
|
||||
* @returns {undefined}
|
||||
*/
|
||||
export const registerMenu = ($toggle, $menuEl, toggle, headerMenu) => {
|
||||
$menuEl.addClass('menu')
|
||||
|
||||
// On link, the enter key trigger a click event
|
||||
// Only use the click to avoid two fired events
|
||||
$toggle.on($toggle.prop('tagName') === 'A'
|
||||
? 'click.menu'
|
||||
: 'click.menu keyup.menu', function (event) {
|
||||
// prevent the link event (append anchor to URL)
|
||||
event.preventDefault()
|
||||
|
||||
// allow enter key as a trigger
|
||||
if (event.key && event.key !== "Enter") {
|
||||
return
|
||||
}
|
||||
|
||||
if ($menuEl.is(currentMenu)) {
|
||||
hideMenus()
|
||||
return
|
||||
} else if (currentMenu) {
|
||||
// another menu was open?
|
||||
// close it
|
||||
hideMenus()
|
||||
}
|
||||
|
||||
if (headerMenu === true) {
|
||||
$menuEl.parent().addClass('openedMenu')
|
||||
}
|
||||
|
||||
// Set menu to expanded
|
||||
$toggle.attr('aria-expanded', true)
|
||||
|
||||
$menuEl.slideToggle(menuSpeed, toggle)
|
||||
currentMenu = $menuEl
|
||||
currentMenuToggle = $toggle
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* @todo Write documentation
|
||||
*/
|
||||
export const unregisterMenu = ($toggle, $menuEl) => {
|
||||
// close menu if opened
|
||||
if ($menuEl.is(currentMenu)) {
|
||||
hideMenus()
|
||||
}
|
||||
$toggle.off('click.menu').removeClass('menutoggle')
|
||||
$menuEl.removeClass('menu')
|
||||
}
|
||||
|
||||
/**
|
||||
* Hides any open menus
|
||||
*
|
||||
* @param {Function} complete callback when the hiding animation is done
|
||||
*/
|
||||
export const hideMenus = function(complete) {
|
||||
if (currentMenu) {
|
||||
const lastMenu = currentMenu
|
||||
currentMenu.trigger(new $.Event('beforeHide'))
|
||||
currentMenu.slideUp(menuSpeed, function () {
|
||||
lastMenu.trigger(new $.Event('afterHide'))
|
||||
if (complete) {
|
||||
complete.apply(this, arguments)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// Set menu to closed
|
||||
$('.menutoggle').attr('aria-expanded', false)
|
||||
|
||||
$('.openedMenu').removeClass('openedMenu')
|
||||
currentMenu = null
|
||||
currentMenuToggle = null
|
||||
}
|
||||
|
||||
/**
|
||||
* Shows a given element as menu
|
||||
*
|
||||
* @param {Object} [$toggle=null] menu toggle
|
||||
* @param {Object} $menuEl menu element
|
||||
* @param {Function} complete callback when the showing animation is done
|
||||
*/
|
||||
export const showMenu = ($toggle, $menuEl, complete) => {
|
||||
if ($menuEl.is(currentMenu)) {
|
||||
return
|
||||
}
|
||||
hideMenus()
|
||||
currentMenu = $menuEl
|
||||
currentMenuToggle = $toggle
|
||||
$menuEl.trigger(new $.Event('beforeShow'))
|
||||
$menuEl.show()
|
||||
$menuEl.trigger(new $.Event('afterShow'))
|
||||
// no animation
|
||||
if (_.isFunction(complete)) {
|
||||
complete()
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue