Lea/web-apps
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

Fix keydown in menu

Browse source
This commit is contained in:
Julia Radzhabova 2021-09-19 21:28:47 +03:00
parent 9be440c3b3
commit 5fa14b63fe
3 changed files with 33 additions and 81 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
apps/common/main/lib/component/Menu.js
View file

@ -171,6 +171,7 @@ define([
this.menuAlignEl = this.options.menuAlignEl; this.menuAlignEl = this.options.menuAlignEl;
this.scrollAlwaysVisible = this.options.scrollAlwaysVisible; this.scrollAlwaysVisible = this.options.scrollAlwaysVisible;
this.search = this.options.search; this.search = this.options.search;
this.outerMenu = this.options.outerMenu;
if (this.options.restoreHeight) { if (this.options.restoreHeight) {
this.options.restoreHeight = (typeof (this.options.restoreHeight) == "number") ? this.options.restoreHeight : (this.options.maxHeight ? this.options.maxHeight : 100000); this.options.restoreHeight = (typeof (this.options.restoreHeight) == "number") ? this.options.restoreHeight : (this.options.maxHeight ? this.options.maxHeight : 100000);
@ -267,6 +268,7 @@ define([
this.parentEl.on('hide.bs.dropdown', _.bind(me.onBeforeHideMenu, me)); this.parentEl.on('hide.bs.dropdown', _.bind(me.onBeforeHideMenu, me));
this.parentEl.on('hidden.bs.dropdown', _.bind(me.onAfterHideMenu, me)); this.parentEl.on('hidden.bs.dropdown', _.bind(me.onAfterHideMenu, me));
this.parentEl.on('keydown.after.bs.dropdown', _.bind(me.onAfterKeydownMenu, me)); this.parentEl.on('keydown.after.bs.dropdown', _.bind(me.onAfterKeydownMenu, me));
this.parentEl.on('keydown.before.bs.dropdown', _.bind(me.onBeforeKeydownMenu, me));
this.options.innerMenus && this.on('keydown:before', _.bind(me.onBeforeKeyDown, me)); this.options.innerMenus && this.on('keydown:before', _.bind(me.onBeforeKeyDown, me));
menuRoot.hover( menuRoot.hover(
@ -454,6 +456,21 @@ define([
} }
}, },
onBeforeKeydownMenu: function(e) {
if (e.isDefaultPrevented() || !(this.outerMenu && this.outerMenu.menu))
return;
if (e.keyCode == Common.UI.Keys.UP || e.keyCode == Common.UI.Keys.DOWN) {
var $items = this.menuRoot.find('> li').find('> a'),
index = $items.index($items.filter(':focus'));
if (e.keyCode==Common.UI.Keys.UP && index==0 || e.keyCode == Common.UI.Keys.DOWN && index==$items.length-1) {
this.outerMenu.menu.focusOuter(e, this.outerMenu.index);
e.preventDefault();
e.stopPropagation();
}
}
},
selectCandidate: function() { selectCandidate: function() {
var index = this._search.index || 0, var index = this._search.index || 0,
re = new RegExp('^' + ((this._search.full) ? this._search.text : this._search.char), 'i'), re = new RegExp('^' + ((this._search.full) ? this._search.text : this._search.char), 'i'),

54
apps/spreadsheeteditor/main/app/view/FormulaTab.js
View file

@ -367,40 +367,6 @@ define([
}, this); }, this);
}, },
focusInner: function(menu, e) {
if (e.keyCode == Common.UI.Keys.UP)
menu.items[menu.items.length-1].cmpEl.find('> a').focus();
else
menu.items[0].cmpEl.find('> a').focus();
},
focusOuter: function(menu, e) {
menu.items[2].cmpEl.find('> a').focus();
},
onBeforeKeyDown: function(menu, e) {
if (e.keyCode == Common.UI.Keys.RETURN) {
e.preventDefault();
e.stopPropagation();
var li = $(e.target).closest('li');
(li.length>0) && li.click();
Common.UI.Menu.Manager.hideAll();
} else if (e.namespace!=="after.bs.dropdown" && (e.keyCode == Common.UI.Keys.DOWN || e.keyCode == Common.UI.Keys.UP)) {
var $items = $('> [role=menu] > li:not(.divider):not(.disabled):visible', menu.$el).find('> a');
if (!$items.length) return;
var index = $items.index($items.filter(':focus')),
me = this;
if (menu._outerMenu && (e.keyCode == Common.UI.Keys.UP && index==0 || e.keyCode == Common.UI.Keys.DOWN && index==$items.length - 1) ||
menu._innerMenu && (e.keyCode == Common.UI.Keys.UP || e.keyCode == Common.UI.Keys.DOWN) && index!==-1) {
e.preventDefault();
e.stopPropagation();
_.delay(function() {
menu._outerMenu ? me.focusOuter(menu._outerMenu, e) : me.focusInner(menu._innerMenu, e);
}, 10);
}
}
},
setButtonMenu: function(btn, name) { setButtonMenu: function(btn, name) {
var me = this, var me = this,
arr = [], arr = [],
@ -445,12 +411,13 @@ define([
_.delay(function() { _.delay(function() {
menu._innerMenu && menu._innerMenu.cmpEl.focus(); menu._innerMenu && menu._innerMenu.cmpEl.focus();
}, 10); }, 10);
}).on('keydown:before', _.bind(me.onBeforeKeyDown, this)); });
var menu = new Common.UI.Menu({ var menu = new Common.UI.Menu({
maxHeight: 300, maxHeight: 300,
cls: 'internal-menu', cls: 'internal-menu',
items: arr items: arr,
outerMenu: {menu: btn.menu, index: 0}
}); });
menu.render(btn.menu.items[0].cmpEl.children(':first')); menu.render(btn.menu.items[0].cmpEl.children(':first'));
menu.cmpEl.css({ menu.cmpEl.css({
@ -462,9 +429,9 @@ define([
menu.cmpEl.attr({tabindex: "-1"}); menu.cmpEl.attr({tabindex: "-1"});
menu.on('item:click', function (menu, item, e) { menu.on('item:click', function (menu, item, e) {
me.fireEvent('function:apply', [{name: item.caption, origin: item.value}, false, name]); me.fireEvent('function:apply', [{name: item.caption, origin: item.value}, false, name]);
}).on('keydown:before', _.bind(me.onBeforeKeyDown, this)); });
btn.menu._innerMenu = menu; btn.menu._innerMenu = menu;
menu._outerMenu = btn.menu; btn.menu.setInnerMenu([{menu: menu, index: 0}]);
} }
} }
Common.Utils.lockControls(SSE.enumLock.noSubitems, arr.length<1, {array: [btn]}); Common.Utils.lockControls(SSE.enumLock.noSubitems, arr.length<1, {array: [btn]});
@ -509,8 +476,7 @@ define([
_.delay(function() { _.delay(function() {
menu._innerMenu && menu._innerMenu.items[0].cmpEl.find('> a').focus(); menu._innerMenu && menu._innerMenu.items[0].cmpEl.find('> a').focus();
}, 10); }, 10);
}).on('keydown:before', _.bind(me.onBeforeKeyDown, this)) }).on('keydown:before', function(menu, e) {
.on('keydown:before', function(menu, e) {
if (e.keyCode == Common.UI.Keys.LEFT || e.keyCode == Common.UI.Keys.ESC) { if (e.keyCode == Common.UI.Keys.LEFT || e.keyCode == Common.UI.Keys.ESC) {
var $parent = menu.cmpEl.parent(); var $parent = menu.cmpEl.parent();
if ($parent.hasClass('dropdown-submenu') && $parent.hasClass('over')) { // close submenu if ($parent.hasClass('dropdown-submenu') && $parent.hasClass('over')) { // close submenu
@ -524,13 +490,15 @@ define([
var menu = new Common.UI.Menu({ var menu = new Common.UI.Menu({
maxHeight: 300, maxHeight: 300,
cls: 'internal-menu', cls: 'internal-menu',
items: arr items: arr,
outerMenu: {menu: mnu.menu, index: 0}
}); });
menu.on('item:click', function (menu, item, e) { menu.on('item:click', function (menu, item, e) {
me.fireEvent('function:apply', [{name: item.caption, origin: item.value}, false, name]); me.fireEvent('function:apply', [{name: item.caption, origin: item.value}, false, name]);
}).on('keydown:before', _.bind(me.onBeforeKeyDown, this)); });
mnu.menu._innerMenu = menu; mnu.menu._innerMenu = menu;
menu._outerMenu = mnu.menu; mnu.menu.setInnerMenu([{menu: menu, index: 0}]);
return mnu; return mnu;
} }
} }

43
apps/spreadsheeteditor/main/app/view/ViewTab.js
View file

@ -254,40 +254,6 @@ define([
}); });
}, },
focusInner: function(menu, e) {
if (e.keyCode == Common.UI.Keys.UP)
menu.items[menu.items.length-1].cmpEl.find('> a').focus();
else
menu.items[0].cmpEl.find('> a').focus();
},
focusOuter: function(menu, e) {
menu.items[2].cmpEl.find('> a').focus();
},
onBeforeKeyDown: function(menu, e) {
if (e.keyCode == Common.UI.Keys.RETURN) {
e.preventDefault();
e.stopPropagation();
var li = $(e.target).closest('li');
(li.length>0) && li.click();
Common.UI.Menu.Manager.hideAll();
} else if (e.namespace!=="after.bs.dropdown" && (e.keyCode == Common.UI.Keys.DOWN || e.keyCode == Common.UI.Keys.UP)) {
var $items = $('> [role=menu] > li:not(.divider):not(.disabled):visible', menu.$el).find('> a');
if (!$items.length) return;
var index = $items.index($items.filter(':focus')),
me = this;
if (menu._outerMenu && (e.keyCode == Common.UI.Keys.UP && index==0 || e.keyCode == Common.UI.Keys.DOWN && index==$items.length - 1) ||
menu._innerMenu && (e.keyCode == Common.UI.Keys.UP || e.keyCode == Common.UI.Keys.DOWN) && index!==-1) {
e.preventDefault();
e.stopPropagation();
_.delay(function() {
menu._outerMenu ? me.focusOuter(menu._outerMenu, e) : me.focusInner(menu._innerMenu, e);
}, 10);
}
}
},
setButtonMenu: function(btn) { setButtonMenu: function(btn) {
var me = this, var me = this,
arr = [{caption: me.textDefault, value: 'default', checkable: true, allowDepress: false}]; arr = [{caption: me.textDefault, value: 'default', checkable: true, allowDepress: false}];
@ -312,12 +278,13 @@ define([
}, 10); }, 10);
}).on('show:before', function (menu, e) { }).on('show:before', function (menu, e) {
me.fireEvent('viewtab:showview'); me.fireEvent('viewtab:showview');
}).on('keydown:before', _.bind(me.onBeforeKeyDown, this)); });
var menu = new Common.UI.Menu({ var menu = new Common.UI.Menu({
maxHeight: 300, maxHeight: 300,
cls: 'internal-menu', cls: 'internal-menu',
items: arr items: arr,
outerMenu: {menu: btn.menu, index: 0}
}); });
menu.render(btn.menu.items[0].cmpEl.children(':first')); menu.render(btn.menu.items[0].cmpEl.children(':first'));
menu.cmpEl.css({ menu.cmpEl.css({
@ -330,9 +297,9 @@ define([
menu.on('item:toggle', function (menu, item, state, e) { menu.on('item:toggle', function (menu, item, state, e) {
if (!!state) if (!!state)
me.fireEvent('viewtab:openview', [{name: item.caption, value: item.value}]); me.fireEvent('viewtab:openview', [{name: item.caption, value: item.value}]);
}).on('keydown:before', _.bind(me.onBeforeKeyDown, this)); });
btn.menu._innerMenu = menu; btn.menu._innerMenu = menu;
menu._outerMenu = btn.menu; btn.menu.setInnerMenu([{menu: menu, index: 0}]);
}, },
show: function () { show: function () {