From 2381f34ce678b6f90c7633a73997852447890a60 Mon Sep 17 00:00:00 2001
From: Jerome Cukier <jerome@uber.com>
Date: Thu, 15 Mar 2018 18:36:04 -0700
Subject: [PATCH 1/2] transform text into paths, so text tags can be taken into
 account

---
 package-lock.json     | 13 ++++++++
 package.json          |  1 +
 src/App.html          |  2 ++
 src/js/pathologize.js | 74 ++++++++++++++++++++++++++++++++++++++++---
 4 files changed, 85 insertions(+), 5 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 58a409f..a441b0a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -2317,6 +2317,14 @@
       "integrity": "sha1-XG2ixdflgx6P+jlklQ+NZnSskLg=",
       "dev": true
     },
+    "opentype.js": {
+      "version": "0.8.0",
+      "resolved": "https://unpm.uberinternal.com/opentype.js/-/opentype.js-0.8.0.tgz",
+      "integrity": "sha1-rKvPoWQvvolKPk11nkO6aU4CvTU=",
+      "requires": {
+        "tiny-inflate": "1.0.2"
+      }
+    },
     "optionator": {
       "version": "0.8.2",
       "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.8.2.tgz",
@@ -3012,6 +3020,11 @@
       "integrity": "sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU=",
       "dev": true
     },
+    "tiny-inflate": {
+      "version": "1.0.2",
+      "resolved": "https://unpm.uberinternal.com/tiny-inflate/-/tiny-inflate-1.0.2.tgz",
+      "integrity": "sha1-k9nez/yIBb1X6uQxDwt0Xptvs6c="
+    },
     "tmp": {
       "version": "0.0.33",
       "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.33.tgz",
diff --git a/package.json b/package.json
index c2a572c..6296353 100644
--- a/package.json
+++ b/package.json
@@ -23,6 +23,7 @@
     "babel-core": "^6.26.0",
     "codemirror": "^5.32.0",
     "d3-array": "^1.2.1",
+    "opentype.js": "^0.8.0",
     "pathologist": "^0.1.9",
     "rollup-plugin-babel": "^3.0.2",
     "rollup-plugin-commonjs": "^8.2.6",
diff --git a/src/App.html b/src/App.html
index e111a53..bf533a6 100644
--- a/src/App.html
+++ b/src/App.html
@@ -112,6 +112,7 @@
 
 <script>
 
+
 import pathsToCoords from './js/pathsToCoords';
 import getTotalLengthAllPaths from './js/getTotalLengthAllPaths';
 import getCoordsMax from './js/getCoordsMax';
@@ -149,6 +150,7 @@
   cat
 };
 
+
 const hiddenExamples = {
   pipe,
   spotify,
diff --git a/src/js/pathologize.js b/src/js/pathologize.js
index 14ba0ce..60ec452 100644
--- a/src/js/pathologize.js
+++ b/src/js/pathologize.js
@@ -1,18 +1,82 @@
 //Thank you Rich!! https://pathologist.surge.sh/
-import * as pathologist  from 'pathologist';
+import * as pathologist from 'pathologist';
+import { load } from 'opentype.js';
 
-export default function pathologize (original) {
+const FONT_URL =
+  'https://sp-bootstrap.global.ssl.fastly.net/8.0.0/fonts/circular-book.woff';
+let loadedFont;
 
+export default function pathologize(original) {
   //handles issues with pathologist not parsing text and style elements
+  if (loadedFont !== undefined) {
+    return pathologizeWithFont(original, loadedFont);
+  }
+  return load(FONT_URL, (err, font) => {
+    if (err) {
+      return pathologizeWithFont(original, null);
+    }
+    return pathologizeWithFont(original, font);
+  });
+}
+
+export function pathologizeWithFont(original, font) {
+  // caches font as to not load it every time
+  loadedFont = font;
   const reText = /<text[\s\S]*?<\/text>/g;
   const reStyle = /<style[\s\S]*?<\/style>/g;
-  const removedText = original.replace(reText, '');
-  const removedStyle = removedText.replace(reStyle, '');
+  const transformedText = original.replace(reText, text =>
+    transformText(text, font)
+  );
+  const removedStyle = transformedText.replace(reStyle, '');
 
   try {
     const pathologized = pathologist.transform(removedStyle);
     return pathologized;
-  } catch (e)  {
+  } catch (e) {
     return original;
   }
 }
+
+export function transformText(text, font) {
+  if (font === null) {
+    return '';
+  }
+  // to generate a path from text we need
+  // x and y coordinates, font size and inner text
+  // these can be deduced from the text tag.
+  // all of the values are supposed to be in pixels
+  // defaults are: x=0, y=0,  font size=12
+  const reInnerText = />([^<]*)</;
+  const innerText = text.match(reInnerText) ? text.match(reInnerText)[1] : '';
+  if (innerText === '') {
+    return '';
+  }
+
+  const reX = / x="([^"]*)"/;
+  const reY = / y="([^"]*)"/;
+  const reFS = / font-size="([^"]*)"/;
+
+  const x = text.match(reX) ? parseFloat(text.match(reX)[1]) : 0;
+  const y = text.match(reX) ? parseFloat(text.match(reY)[1]) : 0;
+  const fontSize = text.match(reFS) ? parseFloat(text.match(reFS)[1]) : 12;
+  const { commands } = font.getPath(innerText, x, y, fontSize);
+  // commands is an array of objects where type is either M, L, Q or Z.
+  // we can build a path from that array
+  
+  const pathFromText = commands.reduce((prev, curr) => {
+    switch (curr.type) {
+    case 'M':
+      return prev + `M ${curr.x} ${curr.y} `;
+    case 'L':
+      return prev + `L ${curr.x} ${curr.y} `;
+    case 'Q':
+      return prev + `Q ${curr.x1} ${curr.y1}, ${curr.x} ${curr.y} `;
+    case 'Z':
+      return prev + 'Z ';
+    default:
+      return prev;
+    }
+  }, '');
+
+  return `<path d="${pathFromText}"/>`;
+}

From 86d658e3a322bf069244adf9e7f9ddde6ea05eb1 Mon Sep 17 00:00:00 2001
From: Jerome Cukier <jckr.github@gmail.com>
Date: Fri, 16 Mar 2018 09:39:43 -0700
Subject: [PATCH 2/2] Update package-lock.json

---
 package-lock.json | 13 -------------
 1 file changed, 13 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index a441b0a..58a409f 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -2317,14 +2317,6 @@
       "integrity": "sha1-XG2ixdflgx6P+jlklQ+NZnSskLg=",
       "dev": true
     },
-    "opentype.js": {
-      "version": "0.8.0",
-      "resolved": "https://unpm.uberinternal.com/opentype.js/-/opentype.js-0.8.0.tgz",
-      "integrity": "sha1-rKvPoWQvvolKPk11nkO6aU4CvTU=",
-      "requires": {
-        "tiny-inflate": "1.0.2"
-      }
-    },
     "optionator": {
       "version": "0.8.2",
       "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.8.2.tgz",
@@ -3020,11 +3012,6 @@
       "integrity": "sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU=",
       "dev": true
     },
-    "tiny-inflate": {
-      "version": "1.0.2",
-      "resolved": "https://unpm.uberinternal.com/tiny-inflate/-/tiny-inflate-1.0.2.tgz",
-      "integrity": "sha1-k9nez/yIBb1X6uQxDwt0Xptvs6c="
-    },
     "tmp": {
       "version": "0.0.33",
       "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.33.tgz",