mml2svg

#! /usr/bin/env -S node -r esm

/*************************************************************************
 *
 *  preload/mml2chtml
 *
 *  Uses MathJax v3 to convert a MathML string to an SVG string.
 *
 * ----------------------------------------------------------------------
 *
 *  Copyright (c) 2019 The MathJax Consortium
 *
 *  Licensed under the Apache License, Version 2.0 (the "License");
 *  you may not use this file except in compliance with the License.
 *  You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 *  Unless required by applicable law or agreed to in writing, software
 *  distributed under the License is distributed on an "AS IS" BASIS,
 *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 *  See the License for the specific language governing permissions and
 *  limitations under the License.
 */


//
//  Get the command-line arguments
//
var argv = require('yargs')
    .demand(0).strict()
    .usage('$0 [options] "math" > file.html')
    .options({
        inline: {
            boolean: true,
            describe: "process as inline math"
        },
        em: {
            default: 16,
            describe: 'em-size in pixels'
        },
        ex: {
            default: 8,
            describe: 'ex-size in pixels'
        },
        width: {
            default: 80 * 16,
            describe: 'width of container in pixels'
        },
        styles: {
            boolean: true,
            default: true,
            describe: 'include css styles for stand-alone image'
        },
        container: {
            boolean: true,
            describe: 'include <mjx-container> element'
        },
        css: {
            boolean: true,
            describe: 'output the required CSS rather than the HTML itself'
        },
        fontCache: {
            boolean: true,
            default: true,
            describe: 'whether to use a local font cache or not'
        },
        assistiveMml: {
            boolean: true,
            default: false,
            describe: 'whether to include assistive MathML output'
        }
    })
    .argv;

//
//  Minimal CSS needed for stand-alone image
//
const CSS = [
  'svg a{fill:blue;stroke:blue}',
  '[data-mml-node="merror"]>g{fill:red;stroke:red}',
  '[data-mml-node="merror"]>rect[data-background]{fill:yellow;stroke:none}',
  '[data-frame],[data-line]{stroke-width:70px;fill:none}',
  '.mjx-dashed{stroke-dasharray:140}',
  '.mjx-dotted{stroke-linecap:round;stroke-dasharray:0,140}',
  'use[data-c]{stroke-width:3px}'
].join('');

//
//  Configure MathJax
//
MathJax = {
    options: {enableAssistiveMml: argv.assistiveMml},
    svg: {fontCache: (argv.fontCache ? 'local' : 'none')},
    startup: {typeset: false}
};

//
//  Load the needed components
//
require('mathjax-full/components/src/mml-svg/mml-svg.js');
require('mathjax-full/components/src/adaptors/liteDOM/liteDOM.js');

//
//  Let MathJax know these are loaded
//
MathJax.loader.preLoad(
    'mml-svg',
    'adaptors/liteDOM'
);

//
//  Create the MathJax methods for the input and output that is loaded
//
MathJax.config.startup.ready();

//
//  Typeset the math from the command line
//
const adaptor = MathJax.startup.adaptor;
const node = MathJax.mathml2svg(argv._[0] || '', {
    display: !argv.inline,
    em: argv.em,
    ex: argv.ex,
    containerWidth: argv.width
});

//
//  If the --css option was specified, output the CSS,
//  Otherwise, output the typeset math as SVG
//
if (argv.css) {
    console.log(adaptor.textContent(MathJax.svgStylesheet()));
} else {
    let html = (argv.container ? adaptor.outerHTML(node) : adaptor.innerHTML(node));
    console.log(argv.styles ? html.replace(/<defs>/, `<defs><style>${CSS}</style>`) : html);
};