open.source/stylus
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

use pageshow/pagehide events

Browse Source 
...to avoid DOM update/scroll on switching tabs
This commit is contained in:
tophf 2022-01-29 02:46:12 +03:00
parent 554d121c45
commit 46785b0550
2 changed files with 10 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
manage/events.js
View File

@ -225,23 +225,14 @@ async function handleUpdateForId(id, opts) {
} }
/* exported handleVisibilityChange */ /* exported handleVisibilityChange */
function handleVisibilityChange() { function handleVisibilityChange(e) {
switch (document.visibilityState) { const id = Number(sessionStore.justEditedStyleId);
// page restored without reloading via history navigation (currently only in FF) if (e.type === 'pageshow' && e.persisted && id) {
// the catch here is that DOM may be outdated so we'll at least refresh the just edited style // TODO: update all elements in-place, not just the last edited style
// assuming other changes aren't important enough to justify making a complicated DOM sync handleUpdateForId(id, {method: 'styleUpdated'});
case 'visible': {
const id = sessionStore.justEditedStyleId;
if (id) {
handleUpdateForId(Number(id), {method: 'styleUpdated'});
delete sessionStore.justEditedStyleId; delete sessionStore.justEditedStyleId;
} } else if (e.type === 'pagehide') {
break;
}
// going away
case 'hidden':
history.replaceState({scrollY: window.scrollY}, document.title); history.replaceState({scrollY: window.scrollY}, document.title);
break;
} }
} }

3
manage/manage.js
View File

@ -64,7 +64,8 @@ newUI.renderClass();
$('#injection-order-button').onclick = () => router.updateHash('#injection-order'); $('#injection-order-button').onclick = () => router.updateHash('#injection-order');
$('#sync-styles').onclick = () => router.updateHash('#stylus-options'); $('#sync-styles').onclick = () => router.updateHash('#stylus-options');
$$('#header a[href^="http"]').forEach(a => (a.onclick = Events.external)); $$('#header a[href^="http"]').forEach(a => (a.onclick = Events.external));
document.on('visibilitychange', handleVisibilityChange); window.on('pageshow', handleVisibilityChange);
window.on('pagehide', handleVisibilityChange);
setupLivePrefs(); setupLivePrefs();
router.update(); router.update();
prefs.subscribe(newUI.ids.map(newUI.prefKeyForId), () => switchUI()); prefs.subscribe(newUI.ids.map(newUI.prefKeyForId), () => switchUI());