Andal.LND/edx-platform
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: MathJax equations flickering (#32696)

Browse Source 
* Revert "Revert "fix: mathjax resize on sindow resize (#32606)""

This reverts commit 9dac65a35a.

* fix: mathjax wrap overflow and flickering
This commit is contained in:
leangseu-edx
2023-07-11 11:19:44 -04:00
committed by GitHub
parent 5c0dddd9bd
commit 2025a3b55f
3 changed files with 77 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
cms/djangoapps/pipeline_js/js/xmodule.js
View File

@@ -32,7 +32,10 @@ define(
['\\[', '\\]'],
['[mathjax]', '[/mathjax]']
]
}
},
CommonHTML: { linebreaks: { automatic: true } },
SVG: { linebreaks: { automatic: true } },
"HTML-CSS": { linebreaks: { automatic: true } },
});
// In order to eliminate all flashing during interactive
@@ -42,6 +45,25 @@ define(
// the fast preview setting as shown in the context menu.
window.MathJax.Hub.processSectionDelay = 0;
window.MathJax.Hub.Configured();
window.addEventListener('resize', MJrenderer);
let t = -1;
let delay = 1000;
let oldWidth = document.documentElement.scrollWidth;
function MJrenderer() {
// don't rerender if the window is the same size as before
if (t >= 0) {
window.clearTimeout(t);
}
if (oldWidth !== document.documentElement.scrollWidth) {
t = window.setTimeout(function() {
oldWidth = document.documentElement.scrollWidth;
MathJax.Hub.Queue(["Rerender", MathJax.Hub]);
t = -1;
}, delay);
}
};
}
);
window.CodeMirror = CodeMirror;

24
cms/templates/content_libraries/xblock_iframe.html
View File

@@ -81,6 +81,12 @@
<!-- Configure and load MathJax -->
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
styles: {
'.MathJax_SVG>svg': { 'max-width': '100%' },
},
CommonHTML: { linebreaks: { automatic: true } },
SVG: { linebreaks: { automatic: true } },
"HTML-CSS": { linebreaks: { automatic: true } },
tex2jax: {
inlineMath: [
["\\(","\\)"],
@@ -92,6 +98,24 @@
]
}
});
window.addEventListener('resize', MJrenderer);
let t = -1;
let delay = 1000;
let oldWidth = document.documentElement.scrollWidth;
function MJrenderer() {
// don't rerender if the window is the same size as before
if (t >= 0) {
window.clearTimeout(t);
}
if (oldWidth !== document.documentElement.scrollWidth) {
t = window.setTimeout(function() {
oldWidth = document.documentElement.scrollWidth;
MathJax.Hub.Queue(["Rerender", MathJax.Hub]);
t = -1;
}, delay);
}
};
</script>
<script type="text/x-mathjax-config">
MathJax.Hub.signal.Interest(function(message) {

30
common/templates/mathjax_include.html
View File

@@ -29,6 +29,12 @@
%if mathjax_mode is not Undefined and mathjax_mode == 'wiki':
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
styles: {
'.MathJax_SVG>svg': { 'max-width': '100%', },
},
CommonHTML: { linebreaks: { automatic: true } },
SVG: { linebreaks: { automatic: true } },
"HTML-CSS": { linebreaks: { automatic: true } },
tex2jax: {inlineMath: [ ['$','$'], ["\\(","\\)"]],
displayMath: [ ['$$','$$'], ["\\[","\\]"]]}
});
@@ -36,7 +42,13 @@
%else:
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
styles: {
'.MathJax_SVG>svg': { 'max-width': '100%', },
},
messageStyle: "none",
CommonHTML: { linebreaks: { automatic: true } },
SVG: { linebreaks: { automatic: true } },
"HTML-CSS": { linebreaks: { automatic: true } },
tex2jax: {
inlineMath: [
["\\(","\\)"],
@@ -85,6 +97,24 @@
explorer: true
}
};
window.addEventListener('resize', MJrenderer);
let t = -1;
let delay = 1000;
let oldWidth = document.documentElement.scrollWidth;
function MJrenderer() {
// don't rerender if the window is the same size as before
if (t >= 0) {
window.clearTimeout(t);
}
if (oldWidth !== document.documentElement.scrollWidth) {
t = window.setTimeout(function() {
oldWidth = document.documentElement.scrollWidth;
MathJax.Hub.Queue(["Rerender", MathJax.Hub]);
t = -1;
}, delay);
}
};
</script>
<!-- This must appear after all mathjax-config blocks, so it is after the imports from the other templates.