Fixed auto-hiding of the toolbar

This commit is contained in:
Veloman Yunkan 2022-09-24 20:07:14 +04:00 committed by Matthieu Gautier
parent ff192cba49
commit 0a866fa914
2 changed files with 24 additions and 34 deletions

View File

@ -152,6 +152,27 @@ function updateSearchBoxForBookChange() {
} }
} }
let previousScrollTop = Infinity;
function updateToolbarVisibilityState() {
const iframeDoc = contentIframe.contentDocument;
const st = iframeDoc.documentElement.scrollTop || iframeDoc.body.scrollTop;
if ( Math.abs(previousScrollTop - st) <= 5 )
return;
const kiwixToolBar = document.querySelector('#kiwixtoolbar');
if (st > previousScrollTop) {
kiwixToolBar.style.position = 'fixed';
kiwixToolBar.style.top = '-100%';
} else {
kiwixToolBar.style.position = 'static';
kiwixToolBar.style.top = '0';
}
previousScrollTop = st;
}
function handle_visual_viewport_change() { function handle_visual_viewport_change() {
contentIframe.height = window.visualViewport.height - contentIframe.offsetTop - 4; contentIframe.height = window.visualViewport.height - contentIframe.offsetTop - 4;
} }
@ -165,6 +186,7 @@ function handle_location_hash_change() {
contentIframe.contentWindow.location.replace(iframeContentUrl); contentIframe.contentWindow.location.replace(iframeContentUrl);
} }
updateSearchBoxForLocationChange(); updateSearchBoxForLocationChange();
previousScrollTop = Infinity;
} }
function handle_content_url_change() { function handle_content_url_change() {
@ -276,39 +298,7 @@ function htmlDecode(input) {
} }
function setupAutoHidingOfTheToolbar() { function setupAutoHidingOfTheToolbar() {
let lastScrollTop = 0; setInterval(updateToolbarVisibilityState, 250);
const delta = 5;
let didScroll = false;
const kiwixToolBar = document.querySelector('#kiwixtoolbar');
contentIframe.contentWindow.addEventListener('scroll', () => {
didScroll = true;
});
setInterval(function() {
if (didScroll) {
hasScrolled();
didScroll = false;
}
}, 250);
function hasScrolled() {
const iframeDoc = contentIframe.contentDocument;
const st = iframeDoc.documentElement.scrollTop || iframeDoc.body.scrollTop;
if (Math.abs(lastScrollTop - st) <= delta)
return;
if (st > lastScrollTop) {
kiwixToolBar.style.position = 'fixed';
kiwixToolBar.style.top = '-100%';
} else {
kiwixToolBar.style.position = 'static';
kiwixToolBar.style.top = '0';
}
lastScrollTop = st;
}
} }
function setupSuggestions() { function setupSuggestions() {

View File

@ -199,7 +199,7 @@ R"EXPECTEDRESULT( <img src="../skin/download.png?
/* url */ "/ROOT/viewer", /* url */ "/ROOT/viewer",
R"EXPECTEDRESULT( <link type="text/css" href="./skin/taskbar.css?cacheid=216d6b5d" rel="Stylesheet" /> R"EXPECTEDRESULT( <link type="text/css" href="./skin/taskbar.css?cacheid=216d6b5d" rel="Stylesheet" />
<link type="text/css" href="./skin/css/autoComplete.css?cacheid=08951e06" rel="Stylesheet" /> <link type="text/css" href="./skin/css/autoComplete.css?cacheid=08951e06" rel="Stylesheet" />
<script type="text/javascript" src="./skin/viewer.js?cacheid=17213478" defer></script> <script type="text/javascript" src="./skin/viewer.js?cacheid=51e745c2" defer></script>
<script type="text/javascript" src="./skin/autoComplete.min.js?cacheid=1191aaaf"></script> <script type="text/javascript" src="./skin/autoComplete.min.js?cacheid=1191aaaf"></script>
const blankPageUrl = `${root}/skin/blank.html`; const blankPageUrl = `${root}/skin/blank.html`;
<label for="kiwix_button_show_toggle"><img src="./skin/caret.png?cacheid=22b942b4" alt=""></label> <label for="kiwix_button_show_toggle"><img src="./skin/caret.png?cacheid=22b942b4" alt=""></label>