golem
/
Math
9
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Use the mathoidStyle property instead of parsing the SVG 

This attribute was added in Ia0f601c1d5. Use it instead of
extracting the information from the SVG.

Change-Id: Ib6d6f4c9480ae00ccb2977b57c7b93de8ebb03f2
This commit is contained in:
Ed Sanders 2016-03-22 12:57:08 +00:00 committed by Physikerwelt
parent 62ff45c262
commit 49fc247004
2 changed files with 23 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
modules/ve-math/tools/makeSvgsAndCss.js
View File

@ -22,7 +22,6 @@
{ convertTransform: false }
]
} ),
xml2js = require( 'xml2js' ),
mathoidMaxConnections = 20,
// If symbol.alignBaseline is true, a background-position property will be added to the
// CSS rule to shift the baseline of the SVG to be a certain proportion of the way up the
@ -76,7 +75,8 @@
res.on( 'end', function () {
var className = texToClass( symbol.tex ),
svg = JSON.parse( body ).svg;
data = JSON.parse( body ),
svg = data.svg;
if ( !svg ) {
console.log( symbol.tex + ' FAILED: ' + body );
@ -85,27 +85,27 @@
}
svgo.optimize( svg, function ( result ) {
var cssRule = cssPrefix + className + ' {\n' +
'\tbackground-image: url(data:image/svg+xml,' + encodeURIComponentForCSS( result.data ) + ');\n';
if ( symbol.alignBaseline ) {
xml2js.parseString( svg, function ( err, xml ) {
var xmlObject = xml.svg.$,
// Convert buttonHeight from em to ex, because SVG height is given in ex. (This is an
// approximation, since the em:ex ratio differs from font to font.)
buttonHeight = symbol.largeLayout ? singleButtonHeight * 4 : singleButtonHeight * 1.9931,
// height and verticalAlign rely on the format of the SVG parameters
// HACK: Adjust these by a factor of 0.8 to match VE's default font size of 0.8em
height = parseFloat( xmlObject.height.slice( 0, -2 ) ) * 0.8,
verticalAlign = -parseFloat( xmlObject.style.match( /vertical-align\:\s*(.*)ex/ )[ 1 ] ) * 0.8,
// CSS percentage positioning is based on the difference between the image and container sizes
heightDifference = buttonHeight - height,
offset = 100 * ( verticalAlign - height + ( baseline * buttonHeight ) ) / heightDifference;
var cssRule, buttonHeight, height, verticalAlign, heightDifference, offset;
cssRule += '\tbackground-position: 50% ' + offset + '%;\n' +
'}';
cssRules.push( cssRule );
console.log( symbol.tex + ' -> ' + className );
} );
cssRule = cssPrefix + className + ' {\n' +
'\tbackground-image: url(data:image/svg+xml,' + encodeURIComponentForCSS( result.data ) + ');\n';
if ( symbol.alignBaseline ) {
// Convert buttonHeight from em to ex, because SVG height is given in ex. (This is an
// approximation, since the em:ex ratio differs from font to font.)
buttonHeight = symbol.largeLayout ? singleButtonHeight * 4 : singleButtonHeight * 1.9931;
// height and verticalAlign rely on the format of the SVG parameters
// HACK: Adjust these by a factor of 0.8 to match VE's default font size of 0.8em
height = parseFloat( data.mathoidStyle.match( /height\:\s*(.*)ex/ )[ 1 ] ) * 0.8;
verticalAlign = -parseFloat( data.mathoidStyle.match( /vertical-align\:\s*(.*)ex/ )[ 1 ] ) * 0.8;
// CSS percentage positioning is based on the difference between the image and container sizes
heightDifference = buttonHeight - height;
offset = 100 * ( verticalAlign - height + ( baseline * buttonHeight ) ) / heightDifference;
cssRule += '\tbackground-position: 50% ' + offset + '%;\n' +
'}';
cssRules.push( cssRule );
console.log( symbol.tex + ' -> ' + className );
} else {
cssRule += '}';
cssRules.push( cssRule );

3
modules/ve-math/tools/package.json
View File

@ -1,7 +1,6 @@
{
"name": "math-icons-generator",
"dependencies": {
"svgo": "^0.6.0",
"xml2js": "^0.4.16"
"svgo": "^0.6.0"
}
}