Add tool to create SVG files of LaTeX symbols

Also produces a CSS file for the symbol buttons, using the
SVG filenames. Gets the list of symbols from symbols.json.

Bug: T118660
Change-Id: Iaa792418d870a7e266b6455ef037994e31278278

i18n/en.json

@@ -24,6 +24,18 @@
 	"math-visualeditor-mwmathinspector-display-inline": "Inline",
 	"math-visualeditor-mwmathinspector-id": "Link ID (optional)",
 	"math-visualeditor-mwmathinspector-title": "Formula",
+	"math-visualeditor-symbol-group-accents": "Accents",
+	"math-visualeditor-symbol-group-arrows": "Arrows",
+	"math-visualeditor-symbol-group-derivatives": "Derivatives",
+	"math-visualeditor-symbol-group-functions": "Functions",
+	"math-visualeditor-symbol-group-geometry": "Geometry",
+	"math-visualeditor-symbol-group-logic": "Logic",
+	"math-visualeditor-symbol-group-modular": "Modular",
+	"math-visualeditor-symbol-group-operators": "Operators",
+	"math-visualeditor-symbol-group-relations": "Relations",
+	"math-visualeditor-symbol-group-root": "Root",
+	"math-visualeditor-symbol-group-special": "Special",
+	"math-visualeditor-symbol-group-unsorted": "Unsorted",
 	"math_bad_output": "Cannot write to or create math output directory",
 	"math_bad_tmpdir": "Cannot write to or create math temp directory",
 	"math_failure": "Failed to parse",

i18n/qqq.json

@@ -21,6 +21,18 @@
 	"math-visualeditor-mwmathinspector-display-inline": "Label for the 'inline' value of the display attribute\n{{Identical|Inline}}",
 	"math-visualeditor-mwmathinspector-id": "Label for the link ID attribute of the math node",
 	"math-visualeditor-mwmathinspector-title": "Title for the inspector to edit <nowiki><math></nowiki> formula blocks.\n{{Identical|Formula}}",
+	"math-visualeditor-symbol-group-accents": "Label for the accents group of math symbols",
+	"math-visualeditor-symbol-group-arrows": "Label for the arrows group of math symbols",
+	"math-visualeditor-symbol-group-derivatives": "Label for the derivatives group of math symbols",
+	"math-visualeditor-symbol-group-functions": "Label for the functions group of math symbols",
+	"math-visualeditor-symbol-group-geometry": "Label for the geometry group of math symbols",
+	"math-visualeditor-symbol-group-logic": "Label for the logic group of math symbols",
+	"math-visualeditor-symbol-group-modular": "Label for the modular group of math symbols",
+	"math-visualeditor-symbol-group-operators": "Label for the operators group of math symbols",
+	"math-visualeditor-symbol-group-relations": "Label for the relations group of math symbols",
+	"math-visualeditor-symbol-group-root": "Label for the root group of math symbols",
+	"math-visualeditor-symbol-group-special": "Label for the special group of math symbols",
+	"math-visualeditor-symbol-group-unsorted": "Label for the unsorted group of math symbols",
 	"math_bad_output": "Used as error message.\n\nThis message follows the message {{msg-mw|Math failure}}.",
 	"math_bad_tmpdir": "Used as error message.\n\nThis message follows the message {{msg-mw|Math failure}}.",
 	"math_failure": "Used as error message.\n\nThis message is followed by \"(\", Error message(*1), Additional message, \"): \"  and Source code.\n\n(*1) The error message is any one of the following messages:\n* {{msg-mw|Math unknown error}}\n* {{msg-mw|Math unknown function}}\n* {{msg-mw|Math lexing error}}\n* {{msg-mw|Math syntax error}}\n* {{msg-mw|Math image error}}\n* {{msg-mw|Math bad tmpdir}}\n* {{msg-mw|Math bad output}}\n* {{msg-mw|Math notexvc}}\n* {{msg-mw|Math notexvccheck}}\n* {{msg-mw|Math output error}}\n* {{msg-mw|Math timeout}}\n* {{msg-mw|Math invalidresponse}}\n* {{msg-mw|Math invalidxml}}\n* {{msg-mw|Math invalidjson}}",

modules/ve-math/tools/makeSvgsAndCss.js

@@ -0,0 +1,114 @@
+#!/usr/bin/env node
+
+/* jshint node: true */
+
+var i, count, group, symbols, symbolObject,
+	symbolList = [],
+	symbolsFile = '../symbols.json',
+	cssFile = '../ve.ui.MWMathSymbols.css',
+	fs = require( 'fs' ),
+	http = require( 'http' ),
+	querystring = require( 'querystring' ),
+	SVGO = require( 'svgo' ),
+	svgo = new SVGO( {
+		plugins: [
+			{ convertTransform: false }
+		]
+	} ),
+	mathoidMaxConnections = 5;
+
+fs.readFile( symbolsFile, function ( err, data ) {
+
+	function encodeURIComponentForCSS( str ) {
+		return encodeURIComponent( str )
+			.replace( /[!'\(\)\*]/g, function ( chr ) {
+				return '%' + chr.charCodeAt( 0 ).toString( 16 );
+			} );
+	}
+
+	function makeRequest( symbol ) {
+		var request,
+			data = querystring.stringify( {
+				q: symbol
+			} ),
+			// API call to mathoid
+			options = {
+				host: '192.168.37.177',
+				port: '10044',
+				path: '/',
+				method: 'POST',
+				headers: {
+					'Content-Type': 'application/x-www-form-urlencoded',
+					'Content-Length': Buffer.byteLength( data )
+				}
+			};
+
+		// Populate and make the API call
+		request = http.request( options, function ( res ) {
+			var body = '';
+			res.setEncoding( 'utf8' );
+
+			res.on( 'data', function ( data ) {
+				body += data;
+			} );
+
+			res.on( 'end', function () {
+				var classname, svg;
+				// Make the classname, replacing any non-alphanumerics with their character code
+				classname = symbol.replace( /[^\w]/g, function ( c ) {
+					return '_' + c.charCodeAt( 0 ) + '_';
+				} );
+
+				svg = JSON.parse( body ).svg;
+
+				if ( !svg ) {
+					console.log( symbol + ' FAILED: ' + body );
+					onEnd();
+					return;
+				}
+
+				svgo.optimize( svg, function ( result ) {
+					// write to the css file
+					fs.appendFileSync(
+						cssFile,
+						'\n.ve-ui-mwMathSymbol-' + classname + ' {\n' +
+						'\tbackground-image: url(data:image/svg+xml,' + encodeURIComponentForCSS( result.data ) + ');\n' +
+						'}\n'
+					);
+				} );
+				console.log( symbol + ' -> ' + classname );
+				onEnd();
+
+			} );
+		} );
+		request.setTimeout( 10000 );
+		request.write( data );
+		request.end();
+		runNext();
+	}
+
+	function onEnd() {
+		count--;
+		runNext();
+	}
+
+	function runNext() {
+		if ( count < mathoidMaxConnections && symbolList.length ) {
+			count++;
+			makeRequest( symbolList.shift() );
+		}
+	}
+
+	symbolObject = JSON.parse( data.toString() );
+	for ( group in symbolObject ) {
+		symbols = symbolObject[ group ];
+		for ( i = 0; i < symbols.length; i++ ) {
+			symbolList.push( symbols[ i ].tex );
+		}
+	}
+
+	fs.writeFileSync( cssFile, '/*!\n * This file is GENERATED by tools/getSvgsAndCss.js\n * DO NOT EDIT\n */\n' );
+	count = 0;
+	runNext();
+
+} );

modules/ve-math/tools/package.json

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