Add new fonts and move the font loading code from scratch-svg-renderer to here

.gitignore

@@ -0,0 +1,13 @@
+# Mac OS
+.DS_Store
+
+# NPM
+/node_modules
+npm-*
+
+# Build
+dist/*
+
+# Editors
+/#*
+*~

fonts.js

@@ -0,0 +1,42 @@
+// Synchronously load TTF fonts.
+// First, have Webpack load their data as Base 64 strings.
+/* eslint-disable global-require */
+const FONTS = {
+	// @todo get suggestions for font names and maybe replace these names
+	'Typey McTypeface': require('base64-loader!scratch-render-fonts/NotoSans-Medium.ttf'),
+	'Seriffy McSerifface': require('base64-loader!scratch-render-fonts/SourceSerifPro-Regular.otf'),
+	'Handlee McHandface': require('base64-loader!scratch-render-fonts/handlee-regular.ttf'),
+	'Knewey McKneeface': require('base64-loader!scratch-render-fonts/knewave.ttf'),
+	'Griffy McGriffface': require('base64-loader!scratch-render-fonts/Griffy-Regular.ttf'),
+	'Gameface': require('base64-loader!scratch-render-fonts/PressStart2P-Regular.ttf'),
+	// @todo remove fonts below when font conversion on import is done
+    'Donegal': require('base64-loader!scratch-render-fonts/DonegalOne-Regular.ttf'),
+    'Gloria': require('base64-loader!scratch-render-fonts/GloriaHallelujah.ttf'),
+    'Mystery': require('base64-loader!scratch-render-fonts/MysteryQuest-Regular.ttf'),
+    'Marker': require('base64-loader!scratch-render-fonts/PermanentMarker.ttf'),
+    'Scratch': require('base64-loader!scratch-render-fonts/Scratch.ttf')
+};
+/* eslint-enable global-require */
+
+// For each Base 64 string,
+// 1. Replace each with a usable @font-face tag that points to a Data URI.
+// 2. Inject the font into a style on `document.body`, so measurements
+//    can be accurately taken in SvgRenderer._transformMeasurements.
+for (const fontName in FONTS) {
+    const fontData = FONTS[fontName];
+    FONTS[fontName] = '@font-face {' +
+        `font-family: "${fontName}";src: url("data:application/x-font-ttf;charset=utf-8;base64,${fontData}");}`;
+}
+
+if (!document.getElementById('scratch-font-styles')) {
+	const documentStyleTag = document.createElement('style');
+	documentStyleTag.id = 'scratch-font-styles';
+	for (const fontName in FONTS) {
+	    documentStyleTag.textContent += FONTS[fontName];
+	}
+	document.body.insertBefore(documentStyleTag, document.body.firstChild);
+}
+
+module.exports = {
+	FONTS: FONTS
+};

package.json

@@ -2,12 +2,38 @@
   "name": "scratch-render-fonts",
   "version": "1.0.0",
   "description": "",
+  "main": "./dist/web/scratch-render-fonts.js",
   "author": "Massachusetts Institute of Technology",
   "repository": {
     "type": "git",
     "url": "git+ssh://git@github.com/LLK/scratch-render-fonts.git"
   },
   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "build": "npm run clean && webpack --progress --colors --bail",
+    "clean": "rimraf ./dist",
+    "test": "echo \"Error: no test specified\" && exit 1",
+    "watch": "webpack --progress --colors --watch"
+  },
+  "homepage": "https://github.com/LLK/scratch-render-fonts#readme",
+  "repository": {
+    "type": "git",
+    "url": "git+ssh://git@github.com/LLK/scratch-render-fonts.git"
+  },
+  "devDependencies": {
+    "base64-loader": "1.0.0",
+    "babel-core": "6.26.0",
+    "babel-eslint": "^8.1.2",
+    "babel-loader": "7.1.2",
+    "babel-preset-env": "1.6.1",
+    "base64-loader": "1.0.0",
+    "eslint": "^4.14.0",
+    "eslint-config-import": "^0.13.0",
+    "eslint-config-scratch": "^5.0.0",
+    "eslint-plugin-import": "^2.8.0",
+    "lodash.defaultsdeep": "4.6.0",
+    "minilog": "3.1.0",
+    "mkdirp": "^0.5.1",
+    "rimraf": "^2.6.1",
+    "webpack": "3.10.0"
   }
 }

webpack.config.js

@@ -0,0 +1,51 @@
+const defaultsdeep = require('lodash.defaultsdeep');
+const path = require('path');
+const webpack = require('webpack');
+
+const makeExport = function (targets, settings) {
+    const base = {
+        devtool: 'cheap-module-source-map',
+        module: {
+            rules: [{
+                include: path.resolve('src'),
+                test: /\.js$/,
+                loader: 'babel-loader',
+                options: {
+                    presets: [['env', {targets}]]
+                }
+            }]
+        },
+        entry: {
+            'scratch-render-fonts': './fonts.js'
+        },
+        plugins: []
+            .concat(process.env.NODE_ENV === 'production' ? [
+                new webpack.optimize.UglifyJsPlugin({
+                    include: /\.min\.js$/,
+                    minimize: true
+                })
+            ] : [])
+    };
+
+    return defaultsdeep(base, settings);
+};
+
+module.exports = [
+    makeExport({browsers: ['last 3 versions', 'Safari >= 8', 'iOS >= 8']}, {
+        output: {
+            library: 'ScratchRenderFonts',
+            libraryTarget: 'umd',
+            path: path.resolve('dist', 'web'),
+            filename: '[name].js'
+        }
+    }),
+    // For testing only: many features will fail outside a browser
+    makeExport({node: true, uglify: true}, {
+        output: {
+            library: 'ScratchRenderFonts',
+            libraryTarget: 'commonjs2',
+            path: path.resolve('dist', 'node'),
+            filename: '[name].js'
+        }
+    })
+];