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

[SSE] Formula tab: move in function list using keyboard

Browse source
This commit is contained in:
Julia Radzhabova 2019-08-14 15:21:20 +03:00
parent c6c0bfffc2
commit efc05d5b6d
1 changed files with 46 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -247,6 +247,40 @@ 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 = [],
@ -263,7 +297,7 @@ define([
} }
if (arr.length) { if (arr.length) {
if (btn.menu && btn.menu.rendered) { if (btn.menu && btn.menu.rendered) {
var menu = btn.menu.items[0]._internalMenu; var menu = btn.menu._innerMenu;
if (menu) { if (menu) {
menu.removeAll(); menu.removeAll();
arr.forEach(function(item){ arr.forEach(function(item){
@ -285,25 +319,19 @@ define([
me.fireEvent('function:apply', [{name: item.caption, origin: item.value}, false, name]); me.fireEvent('function:apply', [{name: item.caption, origin: item.value}, false, name]);
}); });
btn.menu.on('show:after', function (menu, e) { btn.menu.on('show:after', function (menu, e) {
var internalMenu = menu.items[0]._internalMenu; var internalMenu = menu._innerMenu;
internalMenu.scroller.update({alwaysVisibleY: true}); internalMenu.scroller.update({alwaysVisibleY: true});
_.delay(function() { _.delay(function() {
menu.items[0]._internalMenu && menu.items[0]._internalMenu.cmpEl.focus(); menu._innerMenu && menu._innerMenu.cmpEl.focus();
}, 10); }, 10);
}).on('keydown:before', function(menu, e) { }).on('keydown:before', _.bind(me.onBeforeKeyDown, this));
if (e.keyCode == Common.UI.Keys.RETURN) {
e.preventDefault();
e.stopPropagation();
}
} );
var menuContainer = btn.menu.items[0].cmpEl.children(':first');
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
}); });
menu.render(menuContainer); menu.render(btn.menu.items[0].cmpEl.children(':first'));
menu.cmpEl.css({ menu.cmpEl.css({
display : 'block', display : 'block',
position : 'relative', position : 'relative',
@ -313,8 +341,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.items[0]._internalMenu = menu; btn.menu._innerMenu = menu;
menu._outerMenu = btn.menu;
} }
} }
btn.setDisabled(arr.length<1); btn.setDisabled(arr.length<1);
@ -353,10 +382,10 @@ define([
me.fireEvent('function:apply', [{name: item.caption, origin: item.value}, false, name]); me.fireEvent('function:apply', [{name: item.caption, origin: item.value}, false, name]);
}); });
mnu.menu.on('show:after', function (menu, e) { mnu.menu.on('show:after', function (menu, e) {
var internalMenu = menu.items[0]._internalMenu; var internalMenu = menu._innerMenu;
internalMenu.scroller.update({alwaysVisibleY: true}); internalMenu.scroller.update({alwaysVisibleY: true});
_.delay(function() { _.delay(function() {
menu.items[0]._internalMenu && menu.items[0]._internalMenu.cmpEl.focus(); menu._innerMenu && menu._innerMenu.cmpEl.focus();
}, 10); }, 10);
}).on('keydown:before', function(menu, e) { }).on('keydown:before', function(menu, e) {
if (e.keyCode == Common.UI.Keys.RETURN) { if (e.keyCode == Common.UI.Keys.RETURN) {
@ -380,7 +409,7 @@ define([
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]);
}); });
mnu.menu.items[0]._internalMenu = menu; mnu.menu._innerMenu = menu;
return mnu; return mnu;
} }
} }
@ -423,7 +452,7 @@ define([
} }
btn.menu.items.forEach(function(mnu){ btn.menu.items.forEach(function(mnu){
var menuContainer = mnu.menu.items[0].cmpEl.children(':first'), var menuContainer = mnu.menu.items[0].cmpEl.children(':first'),
menu = mnu.menu.items[0]._internalMenu; menu = mnu.menu._innerMenu;
menu.render(menuContainer); menu.render(menuContainer);
menu.cmpEl.css({ menu.cmpEl.css({
display : 'block', display : 'block',