kiwix/kiwix-js-pwa
1
0
Fork 0
mirror of https://github.com/kiwix/kiwix-js-pwa.git synced 2025-08-04 03:48:41 -04:00
Code Issues Packages Projects Releases Wiki Activity

Add popover loading protection

Browse Source
This commit is contained in:
Jaifroid 2024-05-13 11:24:37 +01:00
parent 89ff4beba6
commit 51a5e61b47
2 changed files with 10 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
www/js/app.js
View File

@ -6819,6 +6819,7 @@ function addListenersToLink (a, href, baseUrl) {
loadingContainer = false; loadingContainer = false;
a.articleloading = false; a.articleloading = false;
a.dataset.touchevoked = false; a.dataset.touchevoked = false;
a.popoverisloading = false;
}; };
var onDetectedClick = function (e) { var onDetectedClick = function (e) {
// Restore original values for this window/tab // Restore original values for this window/tab
@ -6997,6 +6998,7 @@ function addListenersToLink (a, href, baseUrl) {
a.addEventListener('mouseout', function (e) { a.addEventListener('mouseout', function (e) {
if (a.dataset.touchevoked === 'true') return; if (a.dataset.touchevoked === 'true') return;
uiUtil.removeKiwixPopoverDivs(e.target.ownerDocument); uiUtil.removeKiwixPopoverDivs(e.target.ownerDocument);
setTimeout(reset, 1400);
}); });
a.addEventListener('focus', function (e) { a.addEventListener('focus', function (e) {
setTimeout(function () { // Delay focus event so touchstart can fire first setTimeout(function () { // Delay focus event so touchstart can fire first

9
www/js/lib/uiUtil.js
View File

@ -1582,10 +1582,11 @@ function attachKiwixPopoverCss (doc, dark) {
*/ */
function attachKiwixPopoverDiv (ev, link, articleBaseUrl, dark) { function attachKiwixPopoverDiv (ev, link, articleBaseUrl, dark) {
// Do not show popover if the user has initiated an article load // Do not show popover if the user has initiated an article load
if (link.articleloading) { if (link.articleloading || link.popoverisloading) {
// console.debug('Cancelled display of popover because user is loading the underlying article'); // console.debug('Cancelled display of popover because user is loading the underlying article');
return; return;
} }
link.popoverisloading = true;
// Do not disply a popover if one is already showing for the current link // Do not disply a popover if one is already showing for the current link
var kiwixPopover = ev.target.ownerDocument.querySelector('.kiwixtooltip'); var kiwixPopover = ev.target.ownerDocument.querySelector('.kiwixtooltip');
var linkHref = link.getAttribute('href'); var linkHref = link.getAttribute('href');
@ -1598,6 +1599,7 @@ function attachKiwixPopoverDiv (ev, link, articleBaseUrl, dark) {
// Check if the link is still being hovered over, and abort display of popover if not // Check if the link is still being hovered over, and abort display of popover if not
if (!linkHref || !link.matches(':hover') && currentDocument.activeElement !== link) return; if (!linkHref || !link.matches(':hover') && currentDocument.activeElement !== link) return;
var div = document.createElement('div'); var div = document.createElement('div');
div.popoverisloading = true; // console.debug('div.popoverisloading', div.popoverisloading);
var screenWidth = articleWindow.innerWidth - 40; var screenWidth = articleWindow.innerWidth - 40;
var screenHeight = document.documentElement.clientHeight; var screenHeight = document.documentElement.clientHeight;
var margin = 40; var margin = 40;
@ -1695,6 +1697,9 @@ function attachKiwixPopoverDiv (ev, link, articleBaseUrl, dark) {
} }
// Programme the icons // Programme the icons
addEventListenersToPopoverIcons(link, div, currentDocument); addEventListenersToPopoverIcons(link, div, currentDocument);
setTimeout(function () {
div.popoverisloading = false; // console.debug('div.popoverisloading', div.popoverisloading);
}, 1000);
}).catch(function (err) { }).catch(function (err) {
console.warn(err); console.warn(err);
// Remove the div // Remove the div
@ -1702,6 +1707,7 @@ function attachKiwixPopoverDiv (ev, link, articleBaseUrl, dark) {
div.parentElement.removeChild(div); div.parentElement.removeChild(div);
link.articleloading = false; link.articleloading = false;
link.dataset.touchevoked = false; link.dataset.touchevoked = false;
link.popoverisloading = false;
}); });
}, 500); }, 500);
} }
@ -1747,6 +1753,7 @@ function removeKiwixPopoverDivs (doc) {
var divs = doc.getElementsByClassName('kiwixtooltip'); var divs = doc.getElementsByClassName('kiwixtooltip');
setTimeout(function () { setTimeout(function () {
Array.prototype.slice.call(divs).forEach(function (div) { Array.prototype.slice.call(divs).forEach(function (div) {
if (div.popoverisloading) return;
var timeoutID; var timeoutID;
var fadeOutDiv = function () { var fadeOutDiv = function () {
clearTimeout(timeoutID); clearTimeout(timeoutID);