Skip to content

Commit

Permalink
Merge pull request #51 from mathjax/lab-menu-update
Browse files Browse the repository at this point in the history 
Update the lab to handle the new menu structure
  • Loading branch information
@dpvc
dpvc authored Mar 8, 2024
2 parents a3c930e + 5439370 commit 5922496
Show file tree
Hide file tree
Showing 2 changed files with 82 additions and 62 deletions.
137 changes: 78 additions & 59 deletions lib/v4-lab.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -44,18 +44,6 @@ function V3DocumentMixin(documentClass) {

return class extends documentClass {

/**
* Call the superclass' enrich() method depending on the checkbox settings.
*
* @override
*/
enrich() {
if (Lab.menu.enrich) {
super.enrich(true);
}
return this;
}

/**
* Call the superclass' complexity() method depending on the checkbox settings.
*
Expand Down Expand Up @@ -191,10 +179,11 @@ const Lab = window.Lab = {
matchFontHeight: true
},
menu: {
enrich: false, // true when semantic enrichment is to be performed
compute: false, // true when complexity should be computed
speech: false, // true when speech should be generated
braille: false, // true when Braille should be generated
collapse: false, // true when mactions should be inserted for complex math
explore: false // true when the explorer is enabled
compute: false, // true when complexity should be computed
enrich: false // true when semantic enrichment is to be performed
},
packages: {
mml: {}, // the list of element ids for the MML package checkboxes
Expand Down Expand Up @@ -521,7 +510,7 @@ const Lab = window.Lab = {
}
tex.packages = this.getPackages('tex');
if (this.packages.tex.textmacros.checked) {
ex.textmacros = {packages: this.getPackages('text')};
tex.textmacros = {packages: this.getPackages('text')};
this.disablePackages('text', false);
} else {
delete tex.textmacros;
Expand Down Expand Up @@ -803,13 +792,34 @@ const Lab = window.Lab = {
*/
setEnrich(checked) {
this.menu.enrich = checked;
if (checked) {
this.loadA11y('complexity');
this.Typeset();
} else {
if (!checked) {
this.setVariable('speech', false, true);
this.setVariable('braille', false, true);
this.setVariable('collapsible', false, true);
this.setVariable('explorer', false, true);
}
this.setVariable('enrich', checked);
},

/**
* @param {boolean} checked Whether to generate speech
*/
setSpeech(checked) {
this.menu.speech = checked;
if (checked) {
this.setEnrich(true);
}
this.setVariable('speech', checked);
},

/**
* @param {boolean} checked Whether to generate braille
*/
setBraille(checked) {
this.menu.braille = checked;
if (checked) {
this.setEnrich(true);
}
this.setVariable('braille', checked);
},

/**
Expand All @@ -820,14 +830,9 @@ const Lab = window.Lab = {
setCompute(checked) {
this.menu.compute = checked;
if (checked) {
this.menu.enrich = true;
document.getElementById('enrich').checked = true;
this.loadA11y('complexity');
this.Typeset();
this.setEnrich(true);
} else {
this.menu.collapse = false;
document.getElementById('collapse').checked = false;
this.menuVariable('collapsible').setValue(false); // don't clear other a11y checkboxes
this.setCollapse(false);
}
},

Expand All @@ -838,21 +843,7 @@ const Lab = window.Lab = {
*/
setCollapse(checked) {
this.menu.collapse = checked;
if (checked) {
this.setVariable('collapsible', true);
} else {
this.menuVariable('collapsible').setValue(false); // don't clear other a11y checkboxes
}
},

/**
* Sets whether or not to enable the Explorer module
*
* @param {boolean} checked Whether to add the Explorer or not (true = add)
*/
setExplorer(checked) {
this.menu.explore = checked;
this.setVariable('explorer', checked);
this.setVariable('collapsible', checked);
},

/**
Expand Down Expand Up @@ -903,29 +894,54 @@ const Lab = window.Lab = {
*/
initMenu() {
this.setVariable('renderer', this.render.jax, true);
this.setVariable('enrich', this.menu.enrich, true);
this.setVariable('speech', this.menu.speech, true);
this.setVariable('braille', this.menu.braille, true);
this.setVariable('collapsible', this.menu.collapse, true);
this.setVariable('explorer', this.menu.explore, true);
this.setVariable('showSRE', this.mmlincludes.showSRE, true);
this.setVariable('showTex', this.mmlincludes.showTex, true);
this.setVariable('texHints', this.mmlincludes.texHints, true);
this.setVariable('overflow', this.capitalize(this.output.displayOverflow), true);
this.setVariable('breakInline', this.output.breakInline, true);

this.menuVariable('explorer').registerCallback(() => {
this.menu.explore = this.doc.menu.settings.explorer;
document.getElementById('explore').checked = this.menu.explore;
if (this.menu.explore) {
this.menu.enrich = true;
document.getElementById('enrich').checked = true;
this.menuVariable('enrich').registerCallback(() => {
const checked = this.doc.menu.settings.enrich;
this.menu.enrich = checked;
document.getElementById('enrich').checked = checked;
if (!checked) {
for (const key of ['speech', 'braille', 'collapse', 'compute']) {
this.menu[key] = false,
document.getElementById(key).checked = false;
}
}
});

this.menuVariable('speech').registerCallback(() => {
const checked = this.doc.menu.settings.speech;
this.menu.speech = checked;
document.getElementById('speech').checked = checked;
if (checked) {
this.menu.enrich = checked;
document.getElementById('enrich').checked = checked;
}
this.Typeset();
});

this.menuVariable('braille').registerCallback(() => {
const checked = this.doc.menu.settings.braille;
this.menu.braille = checked;
document.getElementById('braille').checked = checked;
if (checked) {
this.menu.enrich = checked;
document.getElementById('enrich').checkd = checked;
}
});

this.menuVariable('collapsible').registerCallback(() => {
const checked = this.doc.menu.settings.collapsible;
document.getElementById('collapse').checked = checked;
this.menu.compute = this.menu.collapse = checked;
document.getElementById('compute').checked = checked;
if (checked || !this.doc.menu.settings.explorer) {
if (checked) {
this.menu.enrich = checked;
document.getElementById('enrich').checked = checked;
}
Expand Down Expand Up @@ -1060,18 +1076,19 @@ const Lab = window.Lab = {
// and add our hooks into the menu for synchronizing the checkboxes
//
this.jax = {
TeX: startup.input[0],
MathML: startup.input[1]
TeX: startup.input.tex,
MathML: startup.input.mml
};
this.jax.MathML.mmlFilters.add(() => document.getElementById('mml-mml3').checked, 0);
this.doc = startup.document;
this.initMenu();
//
// Load any needed extensions
//
if (this.menu.explore) {
if (this.menu.enrich) {
this.loadA11y('explorer')
} else if (this.menu.enrich || this.complexity) {
}
if (this.menu.complexity) {
this.loadA11y('complexity');
}

Expand Down Expand Up @@ -1179,19 +1196,21 @@ const Lab = window.Lab = {
},

/**
* Set the MathJax configuration to be the initivial values given in the form
* Set the MathJax configuration to be the initial values given in the form
*/
initOptions() {
MathJax.config.options.menuOptions = {
settings: {
renderer: this.render.jax,
enrich: this.menu.enrich,
speech: this.menu.speech,
braille: this.menu.braille,
collapsible: this.menu.collapse,
explorer: this.menu.explore,
showSRE: this.mmlincludes.showSRE,
showTex: this.mmlincludes.showTex,
texHints: this.mmlincludes.texHints,
overflow: this.capitalize(this.output.displayOverflow),
breakInline: this.output.breakInLine
breakInline: !!this.output.breakInLine
}
};
this.initTeX();
Expand Down
7 changes: 4 additions & 3 deletions v4-lab.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -188,10 +188,11 @@ <h1>MathJax v4 Interactive Lab</h1>
<details id="menu-details" ontoggle="Lab.setDetails(this)">
<summary><b>Assistive Options:</b></summary>
<div>
<input type="checkbox" id="enrich" onchange="Lab.setEnrich(this.checked)" /><label for="enrich"> Enrich MathML</label><br/>
<input type="checkbox" id="compute" onchange="Lab.setCompute(this.checked)" /><label for="compute"> Compute Complexity</label><br/>
<input type="checkbox" id="speech" onchange="Lab.setSpeech(this.checked)" /><label for="speech"> Generate Speech</label><br/>
<input type="checkbox" id="braille" onchange="Lab.setBraille(this.checked)" /><label for="braille"> Generate Braille</label><br/>
<input type="checkbox" id="collapse" onchange="Lab.setCollapse(this.checked)" /><label for="collapse"> Collapse Complex Math</label><br/>
<input type="checkbox" id="explore" onchange="Lab.setExplorer(this.checked)" /><label for="explore"> Math Explorer</label><br/>
<input type="checkbox" id="compute" onchange="Lab.setCompute(this.checked)" /><label for="compute"> Compute Complexity</label><br/>
<input type="checkbox" id="enrich" onchange="Lab.setEnrich(this.checked)" /><label for="enrich"> Enrich MathML</label><br/>
</div>
</details>
</div>
Expand Down

0 comments on commit 5922496

Please sign in to comment.