suzanne.soy/scribble-mathjax
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Use line-height:0 to make alignments easier, and line-height:normal for character boxes. Add ascent/descent data to fonts, and use that to get correct bounding boxes for characters (requires fixing the fonts to get PC/Mac ascent/descent to be the same).

Browse Source
This commit is contained in:
Davide P. Cervone 2015-02-25 10:36:53 -05:00
parent 22a19a18e2
commit 89d259dac4
2 changed files with 50 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
unpacked/jax/output/CommonHTML/fonts/TeX/fontdata.js
View File

@ -585,6 +585,8 @@
CHTML.FONTDATA.FONTS['MathJax_Caligraphic'] = { CHTML.FONTDATA.FONTS['MathJax_Caligraphic'] = {
directory: 'Caligraphic/Regular', directory: 'Caligraphic/Regular',
ascent: .789,
descent: .216,
skew: { skew: {
0x41: 0.194, 0x41: 0.194,
0x42: 0.139, 0x42: 0.139,
@ -656,6 +658,8 @@
CHTML.FONTDATA.FONTS['MathJax_Main-bold'] = { CHTML.FONTDATA.FONTS['MathJax_Main-bold'] = {
directory: 'Main/Bold', directory: 'Main/Bold',
weight: 'bold', weight: 'bold',
ascent: .951,
descent: .267,
skew: { skew: {
0x131: 0.0319, 0x131: 0.0319,
0x237: 0.0958, 0x237: 0.0958,
@ -792,6 +796,8 @@
CHTML.FONTDATA.FONTS['MathJax_Main-italic'] = { CHTML.FONTDATA.FONTS['MathJax_Main-italic'] = {
directory: 'Main/Italic', directory: 'Main/Italic',
style: 'italic', style: 'italic',
ascent: .750,
descent: .250,
Ranges: [ Ranges: [
[0xA0,0xFF,"Latin1Supplement"], [0xA0,0xFF,"Latin1Supplement"],
[0x300,0x36F,"CombDiacritMarks"], [0x300,0x36F,"CombDiacritMarks"],
@ -903,6 +909,8 @@
CHTML.FONTDATA.FONTS['MathJax_Main'] = { CHTML.FONTDATA.FONTS['MathJax_Main'] = {
directory: 'Main/Regular', directory: 'Main/Regular',
ascent: .900,
descent: .272,
skew: { skew: {
0x131: 0.0278, 0x131: 0.0278,
0x237: 0.0833, 0x237: 0.0833,
@ -1183,6 +1191,8 @@
CHTML.FONTDATA.FONTS['MathJax_Math-italic'] = { CHTML.FONTDATA.FONTS['MathJax_Math-italic'] = {
directory: 'Math/Italic', directory: 'Math/Italic',
style: 'italic', style: 'italic',
ascent: .717,
descent: .218,
skew: { skew: {
0x41: 0.139, 0x41: 0.139,
0x42: 0.0833, 0x42: 0.0833,
@ -1361,6 +1371,8 @@
CHTML.FONTDATA.FONTS['MathJax_Size1'] = { CHTML.FONTDATA.FONTS['MathJax_Size1'] = {
directory: 'Size1/Regular', directory: 'Size1/Regular',
ascent: .850,
descent: .350,
0x20: [0,0,250,0,0], // SPACE 0x20: [0,0,250,0,0], // SPACE
0x28: [850,349,458,152,422], // LEFT PARENTHESIS 0x28: [850,349,458,152,422], // LEFT PARENTHESIS
0x29: [850,349,458,35,305], // RIGHT PARENTHESIS 0x29: [850,349,458,35,305], // RIGHT PARENTHESIS
@ -1410,6 +1422,8 @@
CHTML.FONTDATA.FONTS['MathJax_Size2'] = { CHTML.FONTDATA.FONTS['MathJax_Size2'] = {
directory: 'Size2/Regular', directory: 'Size2/Regular',
ascent: 1.360,
descent: .862,
0x20: [0,0,250,0,0], // SPACE 0x20: [0,0,250,0,0], // SPACE
0x28: [1150,649,597,180,561], // LEFT PARENTHESIS 0x28: [1150,649,597,180,561], // LEFT PARENTHESIS
0x29: [1150,649,597,35,416], // RIGHT PARENTHESIS 0x29: [1150,649,597,35,416], // RIGHT PARENTHESIS
@ -1451,6 +1465,8 @@
CHTML.FONTDATA.FONTS['MathJax_Size3'] = { CHTML.FONTDATA.FONTS['MathJax_Size3'] = {
directory: 'Size3/Regular', directory: 'Size3/Regular',
ascent: 1.450,
descent: .950,
0x20: [0,0,250,0,0], // SPACE 0x20: [0,0,250,0,0], // SPACE
0x28: [1450,949,736,209,701], // LEFT PARENTHESIS 0x28: [1450,949,736,209,701], // LEFT PARENTHESIS
0x29: [1450,949,736,34,526], // RIGHT PARENTHESIS 0x29: [1450,949,736,34,526], // RIGHT PARENTHESIS
@ -1476,6 +1492,8 @@
CHTML.FONTDATA.FONTS['MathJax_Size4'] = { CHTML.FONTDATA.FONTS['MathJax_Size4'] = {
directory: 'Size4/Regular', directory: 'Size4/Regular',
ascent: 1.750,
descent: 1.250,
0x20: [0,0,250,0,0], // SPACE 0x20: [0,0,250,0,0], // SPACE
0x28: [1750,1249,792,237,758], // LEFT PARENTHESIS 0x28: [1750,1249,792,237,758], // LEFT PARENTHESIS
0x29: [1750,1249,792,33,554], // RIGHT PARENTHESIS 0x29: [1750,1249,792,33,554], // RIGHT PARENTHESIS
@ -1569,7 +1587,7 @@
var family = "MJX_TeX_"+suffix; FONTS[name].className = "MJXc-TeX-"+suffix; var family = "MJX_TeX_"+suffix; FONTS[name].className = "MJXc-TeX-"+suffix;
STYLES[".MJXc-TeX-"+suffix] = {"font-family":family}; STYLES[".MJXc-TeX-"+suffix] = {"font-family":family};
font = {"font-family":family}; name = name.replace(/-.*/,""); font = {"font-family":family}; name = name.replace(/-.*/,"");
if (names[1] === "Regular") {font.src = "local('"+name+"')"} if (names[1] === "Regular") {font.src = "local('"+name+"'), local('"+name+"-Regular+')"}
else {font.src = "local('"+name+" "+names[1]+"'), local('"+name+"-"+names[1]+"')"} else {font.src = "local('"+name+" "+names[1]+"'), local('"+name+"-"+names[1]+"')"}
faces.push(font); faces.push(font);
}} }}

78
unpacked/jax/output/CommonHTML/jax.js
View File

@ -33,7 +33,6 @@
var EVENT, TOUCH, HOVER; // filled in later var EVENT, TOUCH, HOVER; // filled in later
var SCRIPTFACTOR = Math.sqrt(1/2), var SCRIPTFACTOR = Math.sqrt(1/2),
LINEHEIGHT = 1.2, LINEH = .9, LINED = .3,
AXISHEIGHT = .25; AXISHEIGHT = .25;
var STYLES = { var STYLES = {
@ -48,7 +47,7 @@
".MJXc-math": { ".MJXc-math": {
"display":"inline-block", "display":"inline-block",
"line-height":LINEHEIGHT, "line-height":"0",
"text-indent":"0", "text-indent":"0",
"white-space":"nowrap", "white-space":"nowrap",
"border-collapse":"collapse" "border-collapse":"collapse"
@ -61,38 +60,34 @@
".MJXc-math span": {"display":"inline-block"}, ".MJXc-math span": {"display":"inline-block"},
".MJXc-box": {"display":"block!important", "text-align":"center"}, ".MJXc-box": {"display":"block!important", "text-align":"center"},
".MJXc-rule": {"display":"block!important", "margin-top":"1px"}, ".MJXc-rule": {"display":"block!important", "margin-top":"1px"},
".MJXc-char": {"display":"block!important"}, ".MJXc-char": {"display":"block!important","line-height":"normal"},
".MJXc-mfrac": {"margin":"0 .125em", "vertical-align":AXISHEIGHT+"em", ".MJXc-mfrac": {"margin":"0 .125em", "vertical-align":AXISHEIGHT+"em",
"display":"inline-table!important", "text-align":"center"}, "display":"inline-table!important", "text-align":"center"},
".MJXc-mfrac > *": {"display":"table-row!important"}, ".MJXc-mfrac > span": {"display":"table-row!important"},
".MJXc-num": {"line-height":0}, ".MJXc-num > span": {"display":"inline-block", "width":"100%"},
".MJXc-num > span": {"display":"inline-block"}, ".MJXc-num > span > span": {"display":"table!important", "width":"100%"},
".MJXc-num > *": {"line-height":LINEHEIGHT, "width":"100%"}, ".MJXc-den > span": {"display":"table-cell!important"},
".MJXc-num > * > *": {"display":"table!important", "width":"100%"},
".MJXc-den": {"line-height":LINEHEIGHT*SCRIPTFACTOR},
".MJXc-den > *": {"display":"table-cell!important"},
".MJXc-den > * > *": {"line-height":LINEHEIGHT},
".MJXc-mfrac-row": {"display":"table-row!important"}, ".MJXc-mfrac-row": {"display":"table-row!important"},
".MJXc-mfrac-row > *": {"display":"table-cell!important", "width":"100%"}, ".MJXc-mfrac-row > span": {"display":"table-cell!important", "width":"100%"},
".MJXc-surd": {"vertical-align":"top"}, ".MJXc-surd": {"vertical-align":"top"},
".MJXc-surd > *": {"display":"block!important"}, ".MJXc-surd > span": {"display":"block!important"},
".MJXc-script-box > * ": {"display":"table!important", "height":"50%"}, ".MJXc-script-box > span ": {"display":"table!important", "height":"50%"},
".MJXc-script-box > * > *": {"display":"table-cell!important", "vertical-align":"top"}, ".MJXc-script-box > span > span": {"display":"table-cell!important", "vertical-align":"top"},
".MJXc-script-box > *:last-child > *": {"vertical-align":"bottom"}, ".MJXc-script-box > span:last-child > span": {"vertical-align":"bottom"},
".MJXc-script-box > * > * > *": {"display":"block!important"}, ".MJXc-script-box > span > span > span": {"display":"block!important"},
".MJXc-mphantom": {"visibility":"hidden"}, ".MJXc-mphantom": {"visibility":"hidden"},
".MJXc-munderover": {"display":"inline-table!important"}, ".MJXc-munderover": {"display":"inline-table!important"},
".MJXc-over": {"display":"inline-block!important", "text-align":"center"}, ".MJXc-over": {"display":"inline-block!important", "text-align":"center"},
".MJXc-over > *": {"display":"block!important"}, ".MJXc-over > span": {"display":"block!important"},
".MJXc-munderover > *": {"display":"table-row!important"}, ".MJXc-munderover > span": {"display":"table-row!important"},
".MJXc-mtable": {"vertical-align":AXISHEIGHT+"em", "margin":"0 .125em"}, ".MJXc-mtable": {"vertical-align":AXISHEIGHT+"em", "margin":"0 .125em"},
".MJXc-mtable > *": {"display":"inline-table!important", "vertical-align":"middle"}, ".MJXc-mtable > span": {"display":"inline-table!important", "vertical-align":"middle"},
".MJXc-mtr": {"display":"table-row!important"}, ".MJXc-mtr": {"display":"table-row!important"},
".MJXc-mtd": {"display":"table-cell!important", "text-align":"center", "padding":".5em 0 0 .5em"}, ".MJXc-mtd": {"display":"table-cell!important", "text-align":"center", "padding":".5em 0 0 .5em"},
".MJXc-mtr > .MJXc-mtd:first-child": {"padding-left":0}, ".MJXc-mtr > .MJXc-mtd:first-child": {"padding-left":0},
@ -480,17 +475,20 @@
var item = list[i]; var item = list[i];
switch (item.type) { switch (item.type) {
case "char": case "char":
if (className && item.font.className !== className) { var font = item.font;
if (className && font.className !== className) {
HTML.addElement(span,"span",{className:className},[text]); HTML.addElement(span,"span",{className:className},[text]);
text = ""; className = null; text = ""; className = null;
} }
var C = item.font[item.n]; var C = font[item.n];
text += C.c; className = item.font.className; text += C.c; className = font.className;
if (bbox.h < C[0]) bbox.h = C[0]; if (bbox.h < C[0]) bbox.h = C[0];
if (bbox.d < C[1]) bbox.d = C[1]; if (bbox.d < C[1]) bbox.d = C[1];
if (bbox.l > bbox.w+C[3]) bbox.l = bbox.w+C[3]; if (bbox.l > bbox.w+C[3]) bbox.l = bbox.w+C[3];
if (bbox.r < bbox.w+C[4]) bbox.r = bbox.w+C[4]; if (bbox.r < bbox.w+C[4]) bbox.r = bbox.w+C[4];
bbox.w += C[2]; bbox.w += C[2];
if (bbox.H < font.ascent) bbox.H = font.ascent;
if (bbox.D < font.descent) bbox.D = font.descent;
} }
} }
if (span.childNodes.length) { if (span.childNodes.length) {
@ -592,7 +590,6 @@
this.CHTMLhandleStyle(span); this.CHTMLhandleStyle(span);
this.CHTMLhandleColor(span); this.CHTMLhandleColor(span);
for (var i = 0, m = this.data.length; i < m; i++) this.CHTMLaddChild(span,i,options); for (var i = 0, m = this.data.length; i < m; i++) this.CHTMLaddChild(span,i,options);
if (!options.noMargins && !options.noBBox) this.CHTMLhandleMargins(span);
return span; return span;
}, },
CHTMLaddChild: function (span,i,options) { CHTMLaddChild: function (span,i,options) {
@ -668,24 +665,11 @@
} }
}, },
CHTMLhandleMargins: function (span,box) {
var bbox = this.CHTML;
// ### FIXME: should these be FONTDATA values?
if (bbox.h < LINEH || bbox.d < LINED) {
if (box == null) {
box = HTML.Element("span",{className:"MJXc-box"});
while (span.firstChild) box.appendChild(span.firstChild);
span.appendChild(box);
}
if (bbox.h < LINEH) box.style.marginTop = CHTML.Em(bbox.h-LINEH);
if (bbox.d < LINED) box.style.marginBottom = CHTML.Em(bbox.d-LINED);
}
},
CHTMLhandleText: function (span,text,variant) { CHTMLhandleText: function (span,text,variant) {
if (span.childNodes.length === 0) { if (span.childNodes.length === 0) {
HTML.addElement(span,"span",{className:"MJXc-char"}); HTML.addElement(span,"span",{className:"MJXc-char"});
this.CHTML = {h:-BIGDIMEN, d:-BIGDIMEN, w:0, l:BIGDIMEN, r:-BIGDIMEN}; this.CHTML = {h:-BIGDIMEN, d:-BIGDIMEN, w:0, l:BIGDIMEN, r:-BIGDIMEN,
D:-BIGDIMEN, H:-BIGDIMEN};
} }
var bbox = this.CHTML, string = {text:text, i:0, length:text.length}; var bbox = this.CHTML, string = {text:text, i:0, length:text.length};
if (typeof(variant) === "string") variant = CHTML.FONTDATA.VARIANT[variant]; if (typeof(variant) === "string") variant = CHTML.FONTDATA.VARIANT[variant];
@ -700,14 +684,15 @@
if (bbox.d === -BIGDIMEN) bbox.d = 0; if (bbox.d === -BIGDIMEN) bbox.d = 0;
if (bbox.l === BIGDIMEN) bbox.l = 0; if (bbox.l === BIGDIMEN) bbox.l = 0;
if (bbox.r === -BIGDIMEN) bbox.r = 0; if (bbox.r === -BIGDIMEN) bbox.r = 0;
// ### FIXME: should these be FONTDATA values? if (bbox.H === -BIGDIMEN) bbox.H = .8;
span.firstChild.style.marginTop = CHTML.Em(bbox.h-LINEH); if (bbox.D === -BIGDIMEN) bbox.D = .2;
span.firstChild.style.marginBottom = CHTML.Em(bbox.d-LINED); span.firstChild.style.marginTop = CHTML.Em(bbox.h-bbox.H);
span.firstChild.style.marginBottom = CHTML.Em(bbox.d-bbox.D);
}, },
CHTMLbboxFor: function (n) { CHTMLbboxFor: function (n) {
if (this.data[n] && this.data[n].CHTML) return this.data[n].CHTML; if (this.data[n] && this.data[n].CHTML) return this.data[n].CHTML;
return {w:0, h:0, d:0, l:0, r:0, t:0, b:0}; return {w:0, h:0, d:0, l:0, r:0};
}, },
CHTMLcanStretch: function (direction,H,D) { CHTMLcanStretch: function (direction,H,D) {
@ -1046,21 +1031,20 @@
["span",{}, // inline-block ["span",{}, // inline-block
[["span",{},[ // table, 100% [["span",{},[ // table, 100%
["span",{className:"MJXc-mfrac-row"}], // numerator row, 100% ["span",{className:"MJXc-mfrac-row"}], // numerator row, 100%
["span",{className:"MJXc-mfrac-row", style:"font-size:0"}, ["span",{className:"MJXc-mfrac-row"},
[["span",{},[["span",{className:"MJXc-rule"}]]]]] // division line [["span",{},[["span",{className:"MJXc-rule"}]]]]] // division line
]]] ]]]
] ]
]); ]);
num.firstChild.firstChild.firstChild.appendChild(span.firstChild); num.firstChild.firstChild.firstChild.appendChild(span.firstChild);
var denom = HTML.Element("span",{className:"MJXc-den"}); var denom = HTML.Element("span",{className:"MJXc-den"});
if (sscale === 1) denom.style.lineHeight = LINEHEIGHT;
if (scale !== 1) span.style.margin = "0 "+CHTML.Em(.125/scale); if (scale !== 1) span.style.margin = "0 "+CHTML.Em(.125/scale);
denom.appendChild(span.firstChild); denom.appendChild(span.firstChild);
span.appendChild(num); span.appendChild(denom); span.appendChild(num); span.appendChild(denom);
var nbox = this.CHTMLbboxFor(0), dbox = this.CHTMLbboxFor(1), bbox = this.CHTML; var nbox = this.CHTMLbboxFor(0), dbox = this.CHTMLbboxFor(1), bbox = this.CHTML;
if (nbox.h < LINEH) if (nbox.h < .9)
num.firstChild.firstChild.style.marginTop = CHTML.Em(sscale*(nbox.h-LINEH)); num.firstChild.firstChild.style.marginTop = CHTML.Em(sscale*(nbox.h-.9));
bbox.w = sscale*Math.max(nbox.w,dbox.w); bbox.w = sscale*Math.max(nbox.w,dbox.w);
bbox.h = sscale*(nbox.h+nbox.d) + AXISHEIGHT; bbox.h = sscale*(nbox.h+nbox.d) + AXISHEIGHT;
bbox.d = sscale*(dbox.h+dbox.d) - AXISHEIGHT; bbox.d = sscale*(dbox.h+dbox.d) - AXISHEIGHT;