Prevent stutter effect invoking popover

This commit is contained in:
Jaifroid 2024-05-17 14:10:59 +01:00
parent e01a1e230c
commit 5984f28aef

View File

@ -1588,15 +1588,16 @@ 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 || link.popoverisloading) return; if (link.articleloading || link.popoverisloading) return;
// Do not show popover if we are on Wikivoyage landing page var linkHref = link.getAttribute('href');
if (/^wikivoyage/i.test(appstate.selectedArchive.file.name) && (appstate.expectedArticleURLToBeDisplayed === appstate.selectedArchive.landingPageUrl || // Do not show popover if there is no href or with certain landing pages
if (!linkHref || /^wikivoyage/i.test(appstate.selectedArchive.file.name) &&
(appstate.expectedArticleURLToBeDisplayed === appstate.selectedArchive.landingPageUrl ||
appstate.expectedArticleURLToBeDisplayed === 'A/Wikivoyage:Offline_reader_Expedition/Home_page')) { appstate.expectedArticleURLToBeDisplayed === 'A/Wikivoyage:Offline_reader_Expedition/Home_page')) {
return; return;
} }
link.popoverisloading = true; 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');
if (kiwixPopover && kiwixPopover.dataset.href === linkHref) return; if (kiwixPopover && kiwixPopover.dataset.href === linkHref) return;
// console.debug('Attaching popover...'); // console.debug('Attaching popover...');
var currentDocument = ev.target.ownerDocument; var currentDocument = ev.target.ownerDocument;
@ -1606,7 +1607,10 @@ 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) return; if (link.articleloading) return;
// 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 (!link.matches(':hover') && currentDocument.activeElement !== link) {
link.popoverisloading = false;
return;
}
var div = document.createElement('div'); var div = document.createElement('div');
div.popoverisloading = true; // console.debug('div.popoverisloading', div.popoverisloading); div.popoverisloading = true; // console.debug('div.popoverisloading', div.popoverisloading);
var screenWidth = articleWindow.innerWidth - 40; var screenWidth = articleWindow.innerWidth - 40;
@ -1710,7 +1714,7 @@ function attachKiwixPopoverDiv (ev, link, articleBaseUrl, dark) {
addEventListenersToPopoverIcons(link, div, currentDocument); addEventListenersToPopoverIcons(link, div, currentDocument);
setTimeout(function () { setTimeout(function () {
div.popoverisloading = false; // console.debug('div.popoverisloading', div.popoverisloading); div.popoverisloading = false; // console.debug('div.popoverisloading', div.popoverisloading);
}, 1000); }, 900);
}).catch(function (err) { }).catch(function (err) {
console.warn(err); console.warn(err);
// Remove the div // Remove the div
@ -1720,7 +1724,7 @@ function attachKiwixPopoverDiv (ev, link, articleBaseUrl, dark) {
link.dataset.touchevoked = false; link.dataset.touchevoked = false;
link.popoverisloading = false; link.popoverisloading = false;
}); });
}, 500); }, 600);
} }
/** /**
@ -1774,9 +1778,9 @@ function removeKiwixPopoverDivs (doc) {
timeoutID = setTimeout(fadeOutDiv, 250); timeoutID = setTimeout(fadeOutDiv, 250);
} }
}; };
timeoutID = setTimeout(fadeOutDiv, 250); timeoutID = setTimeout(fadeOutDiv, 0);
}); });
}, 300); }, 400);
} }
// Directly close any popovers // Directly close any popovers