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

ComboBox, Menu: refactoring scrolling to element on opening and searching item by keypress.

Browse source
This commit is contained in:
Julia Radzhabova 2019-10-16 17:45:14 +03:00
parent d8da495bc8
commit f54bd052e7
2 changed files with 30 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
apps/common/main/lib/component/ComboBox.js
View file

@ -300,11 +300,13 @@ define([
if ($selected.length) { if ($selected.length) {
var itemTop = $selected.position().top, var itemTop = $selected.position().top,
itemHeight = $selected.height(), itemHeight = $selected.outerHeight(),
listHeight = $list.height(); listHeight = $list.outerHeight();
if (itemTop < 0 || itemTop + itemHeight > listHeight) { if (itemTop < 0 || itemTop + itemHeight > listHeight) {
$list.scrollTop($list.scrollTop() + itemTop + itemHeight - (listHeight/2)); var height = $list.scrollTop() + itemTop + (itemHeight - listHeight)/2;
height = (Math.floor(height/itemHeight) * itemHeight);
$list.scrollTop(height);
} }
setTimeout(function(){$selected.find('a').focus();}, 1); setTimeout(function(){$selected.find('a').focus();}, 1);
} }
@ -389,10 +391,12 @@ define([
this.scroller.update({alwaysVisibleY: this.scrollAlwaysVisible}); this.scroller.update({alwaysVisibleY: this.scrollAlwaysVisible});
var $list = $(this.el).find('ul'); var $list = $(this.el).find('ul');
var itemTop = item.position().top, var itemTop = item.position().top,
itemHeight = item.height(), itemHeight = item.outerHeight(),
listHeight = $list.height(); listHeight = $list.outerHeight();
if (itemTop < 0 || itemTop + itemHeight > listHeight) { if (itemTop < 0 || itemTop + itemHeight > listHeight) {
$list.scrollTop($list.scrollTop() + itemTop + itemHeight - (listHeight/2)); var height = $list.scrollTop() + itemTop;
height = (Math.floor(height/itemHeight) * itemHeight);
$list.scrollTop(height);
} }
} }
item.focus(); item.focus();

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

@ -391,10 +391,12 @@ define([
var $selected = menuRoot.find('> li .checked'); var $selected = menuRoot.find('> li .checked');
if ($selected.length) { if ($selected.length) {
var itemTop = $selected.position().top, var itemTop = $selected.position().top,
itemHeight = $selected.height(), itemHeight = $selected.outerHeight(),
listHeight = menuRoot.height(); listHeight = menuRoot.outerHeight();
if (itemTop < 0 || itemTop + itemHeight > listHeight) { if (itemTop < 0 || itemTop + itemHeight > listHeight) {
menuRoot.scrollTop(menuRoot.scrollTop() + itemTop + itemHeight - (listHeight/2)); var height = menuRoot.scrollTop() + itemTop + (itemHeight - listHeight)/2;
height = (Math.floor(height/itemHeight) * itemHeight);
menuRoot.scrollTop(height);
} }
setTimeout(function(){$selected.focus();}, 1); setTimeout(function(){$selected.focus();}, 1);
} }
@ -477,10 +479,12 @@ define([
if (this.scroller) { if (this.scroller) {
this.scroller.update({alwaysVisibleY: this.scrollAlwaysVisible, wheelSpeed: this.wheelSpeed}); this.scroller.update({alwaysVisibleY: this.scrollAlwaysVisible, wheelSpeed: this.wheelSpeed});
var itemTop = item.position().top, var itemTop = item.position().top,
itemHeight = item.height(), itemHeight = item.outerHeight(),
listHeight = this.menuRoot.height(); listHeight = this.menuRoot.outerHeight();
if (itemTop < 0 || itemTop + itemHeight > listHeight) { if (itemTop < 0 || itemTop + itemHeight > listHeight) {
this.menuRoot.scrollTop(this.menuRoot.scrollTop() + itemTop + itemHeight - (listHeight/2)); var height = this.menuRoot.scrollTop() + itemTop;
height = (Math.floor(height/itemHeight) * itemHeight);
this.menuRoot.scrollTop(height);
} }
} }
item.focus(); item.focus();
@ -576,7 +580,6 @@ define([
if (top < 0) if (top < 0)
top = 0; top = 0;
} }
if (this.options.additionalAlign) if (this.options.additionalAlign)
this.options.additionalAlign.call(this, menuRoot, left, top); this.options.additionalAlign.call(this, menuRoot, left, top);
else else
@ -856,10 +859,12 @@ define([
$selected = menuRoot.find('> li .checked'); $selected = menuRoot.find('> li .checked');
if ($selected.length) { if ($selected.length) {
var itemTop = $selected.position().top, var itemTop = $selected.position().top,
itemHeight = $selected.height(), itemHeight = $selected.outerHeight(),
listHeight = menuRoot.height(); listHeight = menuRoot.outerHeight();
if (itemTop < 0 || itemTop + itemHeight > listHeight) { if (itemTop < 0 || itemTop + itemHeight > listHeight) {
menuRoot.scrollTop(menuRoot.scrollTop() + itemTop + itemHeight - (listHeight/2)); var height = menuRoot.scrollTop() + itemTop + (itemHeight - listHeight)/2;
height = (Math.floor(height/itemHeight) * itemHeight);
menuRoot.scrollTop(height);
} }
setTimeout(function(){$selected.focus();}, 1); setTimeout(function(){$selected.focus();}, 1);
} }
@ -944,10 +949,12 @@ define([
if (this.scroller) { if (this.scroller) {
this.scroller.update({alwaysVisibleY: this.scrollAlwaysVisible}); this.scroller.update({alwaysVisibleY: this.scrollAlwaysVisible});
var itemTop = item.position().top, var itemTop = item.position().top,
itemHeight = item.height(), itemHeight = item.outerHeight(),
listHeight = this.menuRoot.height(); listHeight = this.menuRoot.outerHeight();
if (itemTop < 0 || itemTop + itemHeight > listHeight) { if (itemTop < 0 || itemTop + itemHeight > listHeight) {
this.menuRoot.scrollTop(this.menuRoot.scrollTop() + itemTop + itemHeight - (listHeight/2)); var height = this.menuRoot.scrollTop() + itemTop;
height = (Math.floor(height/itemHeight) * itemHeight);
this.menuRoot.scrollTop(height);
} }
} }
item.focus(); item.focus();