SVGHMI: fading page switch : defer update of classList to next animate() call when finishing transition.
classList update was happening in the same call as switch_page(), but this call is not meant to do any change in the DOM. This was triggering unwanted style and layout recomputation.
--- a/svghmi/svghmi.js Tue Jun 14 11:56:05 2022 +0200
+++ b/svghmi/svghmi.js Wed Jun 15 11:39:14 2022 +0200
@@ -203,13 +203,14 @@
}
+var page_fading_in_progress = false;
function fading_page_switch(...args){
svg_root.classList.add("fade-out-page");
+ page_fading_in_progress = true;
setTimeout(function(){
switch_page(...args);
- svg_root.classList.remove("fade-out-page");
- },10);
+ },1);
}
document.body.style.backgroundColor = "black";
@@ -513,6 +514,9 @@
}
svg_root.setAttribute('viewBox',new_desc.bbox.join(" "));
+ if(page_fading_in_progress)
+ svg_root.classList.remove("fade-out-page");
+ page_fading_in_progress = false;
current_visible_page = page_name;
};