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

Fix mathsize in HTML-CSS output so that it acts as a zoom (spaces, math axis, etc, are all scaled). Issue #703.

Browse Source
This commit is contained in:
Davide P. Cervone 2014-04-09 13:54:56 -04:00
parent 3614cd1671
commit defe996cf7
2 changed files with 26 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
unpacked/jax/output/HTML-CSS/autoload/menclose.js
View File

@ -41,8 +41,9 @@ MathJax.Hub.Register.StartupHook("HTML-CSS Jax Ready",function () {
if (values.padding == null) {values.padding = ".2em"} if (values.padding == null) {values.padding = ".2em"}
span = this.HTMLcreateSpan(span); span = this.HTMLcreateSpan(span);
var mu = this.HTMLgetMu(span), scale = this.HTMLgetScale(); var mu = this.HTMLgetMu(span), scale = this.HTMLgetScale();
var p = HTMLCSS.length2em(values.padding,mu,1/HTMLCSS.em) * scale; // padding for enclosure var p = HTMLCSS.length2em(values.padding,mu,1/HTMLCSS.em) * scale; // padding for enclosure
var t = HTMLCSS.length2em(values.thickness,mu,1/HTMLCSS.em); // thickness of lines (not scaled, see issue #414) var t = HTMLCSS.length2em(values.thickness,mu,1/HTMLCSS.em) * scale; // thickness of lines
t = Math.max(1/HTMLCSS.em,t); // see issue #414
var SOLID = HTMLCSS.Em(t)+" solid"; var SOLID = HTMLCSS.Em(t)+" solid";
var stack = HTMLCSS.createStack(span); var stack = HTMLCSS.createStack(span);
@ -154,7 +155,7 @@ MathJax.Hub.Register.StartupHook("HTML-CSS Jax Ready",function () {
this.HTMLvmlElement(line,"stroke",{endarrow:"classic"}); this.HTMLvmlElement(line,"stroke",{endarrow:"classic"});
} else { } else {
if (!svg) {svg = this.HTMLsvg(stack,H,D,W,t,values.mathcolor)} if (!svg) {svg = this.HTMLsvg(stack,H,D,W,t,values.mathcolor)}
var l = Math.sqrt(W*W + (H+D)*(H+D)), f = 1/l * 10*scale/HTMLCSS.em * t/.075; var l = Math.sqrt(W*W + (H+D)*(H+D)), f = 1/l * 10*this.scale/HTMLCSS.em * t/.075;
w = W * f; h = (H+D) * f; var x = W - t/2, y = t/2; w = W * f; h = (H+D) * f; var x = W - t/2, y = t/2;
if (y+h-.4*w < 0) {y = .4*w-h} if (y+h-.4*w < 0) {y = .4*w-h}
this.HTMLsvgElement(svg.firstChild,"line",{ this.HTMLsvgElement(svg.firstChild,"line",{

42
unpacked/jax/output/HTML-CSS/jax.js
View File

@ -1834,7 +1834,8 @@
} else { } else {
var space = this.texSpacing(); var space = this.texSpacing();
if (space !== "") { if (space !== "") {
space = HTMLCSS.length2em(space,this.HTMLgetScale())/(span.scale||1); this.HTMLgetScale();
space = HTMLCSS.length2em(space,this.scale)/(span.scale||1)*this.mscale;
if (span.style.paddingLeft) {space += HTMLCSS.unEm(span.style.paddingLeft)} if (span.style.paddingLeft) {space += HTMLCSS.unEm(span.style.paddingLeft)}
span.style.paddingLeft = HTMLCSS.Em(space); span.style.paddingLeft = HTMLCSS.Em(space);
} }
@ -1842,6 +1843,7 @@
}, },
HTMLgetScale: function () { HTMLgetScale: function () {
if (this.scale) {return this.scale * this.mscale}
var scale = 1, values = this.getValues("mathsize","scriptlevel","fontsize"); var scale = 1, values = this.getValues("mathsize","scriptlevel","fontsize");
if (this.style) { if (this.style) {
var span = this.HTMLspanElement(); var span = this.HTMLspanElement();
@ -1854,8 +1856,8 @@
values.scriptminsize = HTMLCSS.length2em(this.Get("scriptminsize")); values.scriptminsize = HTMLCSS.length2em(this.Get("scriptminsize"));
if (scale < values.scriptminsize) {scale = values.scriptminsize} if (scale < values.scriptminsize) {scale = values.scriptminsize}
} }
if (this.isToken) {scale *= HTMLCSS.length2em(values.mathsize)} this.scale = scale; this.mscale = HTMLCSS.length2em(values.mathsize);
return scale; return scale * this.mscale;
}, },
HTMLgetMu: function (span) { HTMLgetMu: function (span) {
var mu = 1, values = this.getValues("scriptlevel","scriptsizemultiplier"); var mu = 1, values = this.getValues("scriptlevel","scriptsizemultiplier");
@ -1990,7 +1992,7 @@
if (bbox.skew && text.length !== 1) {delete bbox.skew} if (bbox.skew && text.length !== 1) {delete bbox.skew}
if (bbox.rw > bbox.w && text.length === 1 && !variant.noIC) { if (bbox.rw > bbox.w && text.length === 1 && !variant.noIC) {
bbox.ic = bbox.rw - bbox.w; bbox.ic = bbox.rw - bbox.w;
HTMLCSS.createBlank(span,bbox.ic); HTMLCSS.createBlank(span,bbox.ic/this.mscale);
bbox.w = bbox.rw; bbox.w = bbox.rw;
} }
this.HTMLhandleSpace(span); this.HTMLhandleSpace(span);
@ -2062,7 +2064,8 @@
// Handle large operator centering // Handle large operator centering
// //
if (values.largeop) { if (values.largeop) {
var p = (span.bbox.h - span.bbox.d)/2 - HTMLCSS.TeX.axis_height*span.scale; var a = HTMLCSS.TeX.axis_height * this.scale * this.mscale
var p = (span.bbox.h - span.bbox.d)/2 - a;
if (HTMLCSS.safariVerticalAlignBug && span.lastChild.nodeName === "IMG") { if (HTMLCSS.safariVerticalAlignBug && span.lastChild.nodeName === "IMG") {
span.lastChild.style.verticalAlign = span.lastChild.style.verticalAlign =
HTMLCSS.Em(HTMLCSS.unEm(span.lastChild.style.verticalAlign||0)/HTMLCSS.em-p/span.scale); HTMLCSS.Em(HTMLCSS.unEm(span.lastChild.style.verticalAlign||0)/HTMLCSS.em-p/span.scale);
@ -2076,7 +2079,7 @@
span.bbox.h -= p; span.bbox.d += p; span.bbox.h -= p; span.bbox.d += p;
if (span.bbox.rw > span.bbox.w) { if (span.bbox.rw > span.bbox.w) {
span.bbox.ic = span.bbox.rw-span.bbox.w; span.bbox.ic = span.bbox.rw-span.bbox.w;
HTMLCSS.createBlank(span,span.bbox.ic); HTMLCSS.createBlank(span,span.bbox.ic/this.mscale);
span.bbox.w = span.bbox.rw; span.bbox.w = span.bbox.rw;
} }
} }
@ -2137,7 +2140,7 @@
this.HTMLremoveColor(); this.HTMLremoveColor();
var values = this.getValues("symmetric","maxsize","minsize"); var values = this.getValues("symmetric","maxsize","minsize");
var span = this.HTMLspanElement(), mu = this.HTMLgetMu(span), H; var span = this.HTMLspanElement(), mu = this.HTMLgetMu(span), H;
var scale = span.scale, axis = HTMLCSS.TeX.axis_height * scale; var scale = this.HTMLgetScale(), axis = HTMLCSS.TeX.axis_height * scale;
if (values.symmetric) {H = 2*Math.max(h-axis,d+axis)} else {H = h + d} if (values.symmetric) {H = 2*Math.max(h-axis,d+axis)} else {H = h + d}
values.maxsize = HTMLCSS.length2em(values.maxsize,mu,span.bbox.h+span.bbox.d); values.maxsize = HTMLCSS.length2em(values.maxsize,mu,span.bbox.h+span.bbox.d);
values.minsize = HTMLCSS.length2em(values.minsize,mu,span.bbox.h+span.bbox.d); values.minsize = HTMLCSS.length2em(values.minsize,mu,span.bbox.h+span.bbox.d);
@ -2213,12 +2216,12 @@
toHTML: function (span) { toHTML: function (span) {
span = this.HTMLcreateSpan(span); span = this.HTMLcreateSpan(span);
var values = this.getValues("height","depth","width"); var values = this.getValues("height","depth","width");
var mu = this.HTMLgetMu(span); var mu = this.HTMLgetMu(span); this.HTMLgetScale();
values.mathbackground = this.mathbackground; values.mathbackground = this.mathbackground;
if (this.background && !this.mathbackground) {values.mathbackground = this.background} if (this.background && !this.mathbackground) {values.mathbackground = this.background}
var h = HTMLCSS.length2em(values.height,mu), var h = HTMLCSS.length2em(values.height,mu) * this.mscale,
d = HTMLCSS.length2em(values.depth,mu), d = HTMLCSS.length2em(values.depth,mu) * this.mscale,
w = HTMLCSS.length2em(values.width,mu); w = HTMLCSS.length2em(values.width,mu) * this.mscale;
HTMLCSS.createSpace(span,h,d,w,values.mathbackground,true); HTMLCSS.createSpace(span,h,d,w,values.mathbackground,true);
return span; return span;
} }
@ -2256,9 +2259,10 @@
else {HTMLCSS.Measured(child,box)} else {HTMLCSS.Measured(child,box)}
var values = this.getValues("height","depth","width","lspace","voffset"), var values = this.getValues("height","depth","width","lspace","voffset"),
x = 0, y = 0, mu = this.HTMLgetMu(span); x = 0, y = 0, mu = this.HTMLgetMu(span);
this.HTMLgetScale();
if (values.lspace) {x = this.HTMLlength2em(box,values.lspace,mu)} if (values.lspace) {x = this.HTMLlength2em(box,values.lspace,mu)}
if (values.voffset) {y = this.HTMLlength2em(box,values.voffset,mu)} if (values.voffset) {y = this.HTMLlength2em(box,values.voffset,mu)}
HTMLCSS.placeBox(box,x,y); HTMLCSS.placeBox(box,x,y); x /= this.mscale; y /= this.mscale;
span.bbox = { span.bbox = {
h: box.bbox.h, d: box.bbox.d, w: box.bbox.w, exactW: true, h: box.bbox.h, d: box.bbox.d, w: box.bbox.w, exactW: true,
lw: Math.min(0,box.bbox.lw+x), rw: Math.max(box.bbox.w,box.bbox.rw+x), lw: Math.min(0,box.bbox.lw+x), rw: Math.max(box.bbox.w,box.bbox.rw+x),
@ -2283,7 +2287,7 @@
if (m == null) {m = -HTMLCSS.BIGDIMEN} if (m == null) {m = -HTMLCSS.BIGDIMEN}
var match = String(length).match(/width|height|depth/); var match = String(length).match(/width|height|depth/);
var size = (match ? span.bbox[match[0].charAt(0)] : (d ? span.bbox[d] : 0)); var size = (match ? span.bbox[match[0].charAt(0)] : (d ? span.bbox[d] : 0));
var v = HTMLCSS.length2em(length,mu,size); var v = HTMLCSS.length2em(length,mu,size/this.mscale) * this.mscale;
if (d && String(length).match(/^\s*[-+]/)) if (d && String(length).match(/^\s*[-+]/))
{return Math.max(m,span.bbox[d]+v)} else {return v} {return Math.max(m,span.bbox[d]+v)} else {return v}
}, },
@ -2351,7 +2355,7 @@
HTMLCSS.placeBox(den,num.bbox.w+bevel.bbox.w-delta,(den.bbox.d-den.bbox.h)/2+a-delta); HTMLCSS.placeBox(den,num.bbox.w+bevel.bbox.w-delta,(den.bbox.d-den.bbox.h)/2+a-delta);
} else { } else {
var W = Math.max(num.bbox.w,den.bbox.w); var W = Math.max(num.bbox.w,den.bbox.w);
var t = HTMLCSS.thickness2em(values.linethickness,scale), p,q, u,v; var t = HTMLCSS.thickness2em(values.linethickness,this.scale)*this.mscale, p,q, u,v;
var mt = HTMLCSS.TeX.min_rule_thickness/this.em; var mt = HTMLCSS.TeX.min_rule_thickness/this.em;
if (isDisplay) {u = HTMLCSS.TeX.num1; v = HTMLCSS.TeX.denom1} if (isDisplay) {u = HTMLCSS.TeX.num1; v = HTMLCSS.TeX.denom1}
else {u = (t === 0 ? HTMLCSS.TeX.num3 : HTMLCSS.TeX.num2); v = HTMLCSS.TeX.denom2} else {u = (t === 0 ? HTMLCSS.TeX.num3 : HTMLCSS.TeX.num2); v = HTMLCSS.TeX.denom2}
@ -2382,7 +2386,7 @@
// Add nulldelimiterspace around the fraction // Add nulldelimiterspace around the fraction
// (TeXBook pg 150 and Appendix G rule 15e) // (TeXBook pg 150 and Appendix G rule 15e)
// //
var space = HTMLCSS.TeX.nulldelimiterspace; var space = HTMLCSS.TeX.nulldelimiterspace * this.mscale;
var style = span.firstChild.style; var style = span.firstChild.style;
style.marginLeft = style.marginRight = HTMLCSS.Em(space); style.marginLeft = style.marginRight = HTMLCSS.Em(space);
span.bbox.w += 2*space; span.bbox.r += 2*space; span.bbox.w += 2*space; span.bbox.r += 2*space;
@ -2621,13 +2625,11 @@
if (sup) {sup.bbox.w += s; sup.bbox.rw = Math.max(sup.bbox.w,sup.bbox.rw)} if (sup) {sup.bbox.w += s; sup.bbox.rw = Math.max(sup.bbox.w,sup.bbox.rw)}
if (sub) {sub.bbox.w += s; sub.bbox.rw = Math.max(sub.bbox.w,sub.bbox.rw)} if (sub) {sub.bbox.w += s; sub.bbox.rw = Math.max(sub.bbox.w,sub.bbox.rw)}
HTMLCSS.placeBox(base,0,0); HTMLCSS.placeBox(base,0,0);
var sscale; var sscale = scale;
if (sup) { if (sup) {
sscale = this.data[this.sup].HTMLgetScale(); sscale = this.data[this.sup].HTMLgetScale();
} else if (sub) { } else if (sub) {
sscale = this.data[this.sub].HTMLgetScale(); sscale = this.data[this.sub].HTMLgetScale();
} else {
sscale = this.HTMLgetScale();
} }
var q = HTMLCSS.TeX.sup_drop * sscale, r = HTMLCSS.TeX.sub_drop * sscale; var q = HTMLCSS.TeX.sup_drop * sscale, r = HTMLCSS.TeX.sub_drop * sscale;
var u = base.bbox.h - q, v = base.bbox.d + r, delta = 0, p; var u = base.bbox.h - q, v = base.bbox.d + r, delta = 0, p;
@ -2759,8 +2761,8 @@
if (D != null) {HTMLCSS.Remeasured(this.data[0].HTMLstretchV(box,HW,D),box)} if (D != null) {HTMLCSS.Remeasured(this.data[0].HTMLstretchV(box,HW,D),box)}
else if (HW != null) {HTMLCSS.Remeasured(this.data[0].HTMLstretchH(box,HW),box)} else if (HW != null) {HTMLCSS.Remeasured(this.data[0].HTMLstretchH(box,HW),box)}
else {HTMLCSS.Measured(child,box)} else {HTMLCSS.Measured(child,box)}
// FIXME: should the axis height be scaled? var a = HTMLCSS.TeX.axis_height * this.HTMLgetScale();
HTMLCSS.placeBox(box,0,HTMLCSS.TeX.axis_height-(box.bbox.h+box.bbox.d)/2+box.bbox.d); HTMLCSS.placeBox(box,0,a-(box.bbox.h+box.bbox.d)/2+box.bbox.d);
} else { } else {
var html = this.data[0].toHTML(span,HW,D); var html = this.data[0].toHTML(span,HW,D);
if (D != null) {html = this.data[0].HTMLstretchV(box,HW,D)} if (D != null) {html = this.data[0].HTMLstretchV(box,HW,D)}