Difuse/luci
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

luci-base: ui.js: improve mobile dropdown scroll behaviour

Browse source 
Signed-off-by: Jo-Philipp Wich <jo@mein.io>
This commit is contained in:
Jo-Philipp Wich 2020-03-25 12:34:46 +01:00
parent 81693ff2c8
commit 0fb2f8f1d1
1 changed files with 27 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

31
modules/luci-base/htdocs/luci-static/resources/ui.js
View file

@ -619,8 +619,6 @@ var UIDropdown = UIElement.extend({
if ('ontouchstart' in window) { if ('ontouchstart' in window) {
var vpWidth = Math.max(document.documentElement.clientWidth, window.innerWidth || 0), var vpWidth = Math.max(document.documentElement.clientWidth, window.innerWidth || 0),
vpHeight = Math.max(document.documentElement.clientHeight, window.innerHeight || 0), vpHeight = Math.max(document.documentElement.clientHeight, window.innerHeight || 0),
scrollFrom = window.pageYOffset,
scrollTo = scrollFrom + rect.top - vpHeight * 0.5,
start = null; start = null;
ul.style.top = sb.offsetHeight + 'px'; ul.style.top = sb.offsetHeight + 'px';
@ -629,6 +627,31 @@ var UIDropdown = UIElement.extend({
ul.style.maxHeight = (vpHeight * 0.5) + 'px'; ul.style.maxHeight = (vpHeight * 0.5) + 'px';
ul.style.WebkitOverflowScrolling = 'touch'; ul.style.WebkitOverflowScrolling = 'touch';
function getScrollParent(element) {
var parent = element,
style = getComputedStyle(element),
excludeStaticParent = (style.position === 'absolute');
if (style.position === 'fixed')
return document.body;
while ((parent = parent.parentElement) != null) {
style = getComputedStyle(parent);
if (excludeStaticParent && style.position === 'static')
continue;
if (/(auto|scroll)/.test(style.overflow + style.overflowY + style.overflowX))
return parent;
}
return document.body;
}
var scrollParent = getScrollParent(sb),
scrollFrom = scrollParent.scrollTop,
scrollTo = scrollFrom + rect.top - vpHeight * 0.5;
var scrollStep = function(timestamp) { var scrollStep = function(timestamp) {
if (!start) { if (!start) {
start = timestamp; start = timestamp;
@ -637,11 +660,11 @@ var UIDropdown = UIElement.extend({
var duration = Math.max(timestamp - start, 1); var duration = Math.max(timestamp - start, 1);
if (duration < 100) { if (duration < 100) {
document.body.scrollTop = scrollFrom + (scrollTo - scrollFrom) * (duration / 100); scrollParent.scrollTop = scrollFrom + (scrollTo - scrollFrom) * (duration / 100);
window.requestAnimationFrame(scrollStep); window.requestAnimationFrame(scrollStep);
} }
else { else {
document.body.scrollTop = scrollTo; scrollParent.scrollTop = scrollTo;
} }
}; };