Skip to content

Commit bcf5129

Browse files
committed
Merge branch 'master' into stretchy-cells
2 parents 0ec2894 + 98be32d commit bcf5129

File tree

4 files changed

+206
-0
lines changed

4 files changed

+206
-0
lines changed

Mml-lab.html

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>MathJax v3 MathML lab</title>
5+
<script src="lib/traceur.min.js"></script>
6+
<script src="lib/system.js"></script>
7+
<style>
8+
#output {
9+
border: 1px solid black;
10+
padding: 10px;
11+
width: auto;
12+
min-width: 50%;
13+
display: inline-block;
14+
font-size: 200%;
15+
}
16+
#container {
17+
display: inline-block;
18+
text-align: right;
19+
}
20+
</style>
21+
</head>
22+
<body>
23+
24+
<div id="container">
25+
<textarea id="mml" cols="80" rows="15" onkeypress="Lab.checkKey(this,event)"></textarea><br>
26+
<input type="button" value="Keep" onclick="Lab.Keep()" />
27+
<input type="button" value="Typeset" onclick="Lab.Typeset()" />
28+
</div>
29+
<p>
30+
<div id="output"></div>
31+
32+
<script>
33+
System.import('Mml-lab.js').catch(function (error) {console.log(error.message)});
34+
</script>
35+
</body>
36+
</html>
37+
38+

Mml-lab.js

Lines changed: 60 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
import {MathML} from "mathjax3/input/MathML.js";
2+
import {CHTML} from "mathjax3/output/chtml.js";
3+
import {AbstractMathItem} from "mathjax3/core/MathItem.js";
4+
import {AbstractMathDocument} from "mathjax3/core/MathDocument.js";
5+
import {DOM} from "mathjax3/util/DOM.js";
6+
import {handleRetriesFor} from "mathjax3/util/Retries.js";
7+
8+
let mml = new MathML();
9+
let chtml = new CHTML();
10+
11+
let doc = new AbstractMathDocument(DOM.document,{OutputJax: chtml});
12+
13+
chtml.nodes.document = doc.document;
14+
DOM.document.head.appendChild(chtml.styleSheet(doc));
15+
16+
const Lab = DOM.window.Lab = {
17+
mml: DOM.document.getElementById('mml'),
18+
output: DOM.document.getElementById('output'),
19+
display: true,
20+
21+
Typeset() {
22+
let MML = this.mml.value;
23+
let math = new AbstractMathItem(MML,mml);
24+
math.setMetrics(16,8,1000000,100000,1);
25+
math.display = this.display;
26+
this.jax = math;
27+
28+
handleRetriesFor(function () {
29+
math.compile();
30+
math.typeset(doc);
31+
}).then(() => Lab.Update(math.typesetRoot.outerHTML))
32+
.catch(err => console.log("Error: "+err.message));
33+
},
34+
35+
Keep() {
36+
DOM.window.location.search = "?" + encodeURIComponent(this.mml.value);
37+
},
38+
39+
Update(html) {
40+
this.output.innerHTML = html;
41+
},
42+
43+
checkKey: function (textarea, event) {
44+
if (!event) event = window.event;
45+
var code = event.which || event.keyCode;
46+
if ((event.ctrlKey || event.metaKey || event.shiftKey || event.altKey) &&
47+
(code === 13 || code === 10)) {
48+
if (event.preventDefault) event.preventDefault();
49+
event.returnValue = false;
50+
this.Typeset();
51+
}
52+
}
53+
54+
}
55+
56+
if (DOM.window.location.search !== "") {
57+
Lab.mml.value = decodeURIComponent(DOM.window.location.search.substr(1));
58+
Lab.Typeset();
59+
}
60+

TeX-lab.html

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>MathJax v3 TeX lab</title>
5+
<script src="lib/traceur.min.js"></script>
6+
<script src="lib/system.js"></script>
7+
<style>
8+
#output {
9+
border: 1px solid black;
10+
padding: 10px;
11+
width: auto;
12+
min-width: 50%;
13+
display: inline-block;
14+
font-size: 200%;
15+
}
16+
#container {
17+
display: inline-block;
18+
text-align: right;
19+
}
20+
</style>
21+
</head>
22+
<body>
23+
24+
<div id="container">
25+
<textarea id="tex" cols="80" rows="15" onkeypress="Lab.checkKey(this,event)"></textarea><br>
26+
<span style="float:left">
27+
<input type="checkbox" id="display" onchange="Lab.setDisplay(this.checked)" checked /> display mode
28+
</span>
29+
<input type="button" value="Keep" onclick="Lab.Keep()" />
30+
<input type="button" value="Typeset" onclick="Lab.Typeset()" />
31+
</div>
32+
<p>
33+
<div id="output"></div>
34+
35+
<script>
36+
System.import('TeX-lab.js').catch(function (error) {console.log(error.message)});
37+
</script>
38+
</body>
39+
</html>
40+
41+

TeX-lab.js

Lines changed: 67 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,67 @@
1+
import {TeX} from "mathjax3/input/tex.js";
2+
import {CHTML} from "mathjax3/output/chtml.js";
3+
import {AbstractMathItem} from "mathjax3/core/MathItem.js";
4+
import {AbstractMathDocument} from "mathjax3/core/MathDocument.js";
5+
import {DOM} from "mathjax3/util/DOM.js";
6+
import {handleRetriesFor} from "mathjax3/util/Retries.js";
7+
8+
let tex = new TeX();
9+
let chtml = new CHTML();
10+
11+
let doc = new AbstractMathDocument(DOM.document,{OutputJax: chtml});
12+
13+
chtml.nodes.document = doc.document;
14+
DOM.document.head.appendChild(chtml.styleSheet(doc));
15+
16+
const Lab = DOM.window.Lab = {
17+
tex: DOM.document.getElementById('tex'),
18+
output: DOM.document.getElementById('output'),
19+
display: true,
20+
21+
Typeset() {
22+
let TeX = this.tex.value;
23+
let math = new AbstractMathItem(TeX,tex);
24+
math.setMetrics(16,8,1000000,100000,1);
25+
math.display = this.display;
26+
this.jax = math;
27+
28+
handleRetriesFor(function () {
29+
math.compile();
30+
math.typeset(doc);
31+
}).then(() => Lab.Update(math.typesetRoot.outerHTML))
32+
.catch(err => {console.log("Error: "+err.message); console.log(err.stack)});
33+
},
34+
35+
Keep() {
36+
DOM.window.location.search = "?" + (this.display ? 1 : 0) + encodeURIComponent(this.tex.value);
37+
},
38+
39+
Update(html) {
40+
this.output.innerHTML = html;
41+
},
42+
43+
setDisplay(checked) {
44+
this.display = checked;
45+
this.Typeset();
46+
},
47+
48+
checkKey: function (textarea, event) {
49+
if (!event) event = window.event;
50+
var code = event.which || event.keyCode;
51+
if ((event.ctrlKey || event.metaKey || event.shiftKey || event.altKey) &&
52+
(code === 13 || code === 10)) {
53+
if (event.preventDefault) event.preventDefault();
54+
event.returnValue = false;
55+
this.Typeset();
56+
}
57+
}
58+
59+
}
60+
61+
if (DOM.window.location.search !== "") {
62+
Lab.tex.value = decodeURIComponent(DOM.window.location.search.substr(2));
63+
Lab.display = DOM.window.location.search.substr(1,1) === '1';
64+
DOM.document.getElementById('display').checked = Lab.display;
65+
Lab.Typeset();
66+
}
67+

0 commit comments

Comments
 (0)