From 376a2e27fb2f2ebc18742f2a2f37a18eac2bdddc Mon Sep 17 00:00:00 2001
From: James Y Rauhut <james@seejamescode.com>
Date: Mon, 16 Apr 2018 09:44:23 -0500
Subject: [PATCH] fix(css): reference complete woff file, do not reference
 split woff files (#160)

* fix(css): reference complete woff file, do not reference split woff files

* chore(scripts): unnecessary default object property

* chore(package): bump version number to v1.0.2
---
 package.json           |  2 +-
 scripts/export-scss.js |  8 ++++++--
 scripts/tools/index.js | 22 ++++++++++++++--------
 3 files changed, 21 insertions(+), 11 deletions(-)

diff --git a/package.json b/package.json
index 8af1d4b3a..2e5842322 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@ibm/plex",
   "description": "The package of IBM’s typeface, IBM Plex",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "repository": "https://github.com/ibm/plex.git",
   "license": "OFL-1.1",
   "keywords": [
diff --git a/scripts/export-scss.js b/scripts/export-scss.js
index fa1170347..965fb585f 100644
--- a/scripts/export-scss.js
+++ b/scripts/export-scss.js
@@ -64,7 +64,7 @@ const filesToWrite = families
           Latin2: 4,
           Latin1: 5
         };
-        const content = innerFiles
+        const contentSplit = innerFiles
           .sort((a, b) => order[a.unicode.type] - order[b.unicode.type])
           .filter(({ unicode }) => family.unicodes.includes(unicode.type))
           .map(({ unicode }) => {
@@ -72,16 +72,20 @@ const filesToWrite = families
             return `@import '${importPath}';`;
           })
           .join("\n");
+        const contentWhole = createFontFace(filename, family, weight);
 
         // We spread all the inner files, since they are valid files that we'll
         // want to create in the future, and then reduce over the whole
         // collection to flatten the array entries.
+        // String contentWhole (woff) goes before contentSplit (woff2) so modern
+        // browsers will look for split files.
         return [
           ...innerFiles,
           {
             filename: `${OUTPUT_DIRECTORY}/${filename.replace(" ", "-")}`,
             content: `$font-prefix: '..' !default;
-${content}`,
+${contentWhole}
+${contentSplit}`,
             weight
           }
         ];
diff --git a/scripts/tools/index.js b/scripts/tools/index.js
index 155fadfe0..fca08a28a 100644
--- a/scripts/tools/index.js
+++ b/scripts/tools/index.js
@@ -16,7 +16,7 @@ exports.formatFilename = formatFilename;
  * `createFontFace` is used to generate the actual `@font-face` declarations
  * that get written to the appropriate files.
  */
-const createFontFace = (filename, family, weight, unicode) => {
+const createFontFace = (filename, family, weight, unicode = {}) => {
   const fontFileName = [
     `IBMPlex${family.type.replace(" ", "")}`,
     weight.variant ? weight.type + weight.variant : weight.type,
@@ -39,20 +39,26 @@ const createFontFace = (filename, family, weight, unicode) => {
     .filter(Boolean)
     .join("");
 
+  const local = `local('${localFileName}'),
+    local('${localPostscriptName}')`;
+
   const urls = {
-    woff2: `#{$font-prefix}/IBM-Plex-${family.type.replace(" ", "-")}/fonts/split/woff2/${fontFileName}.woff2`,
-    woff: `#{$font-prefix}/IBM-Plex-${family.type.replace(" ", "-")}/fonts/split/woff/${fontFileName}.woff`
+    woff: `#{$font-prefix}/IBM-Plex-${family.type.replace(" ", "-")}/fonts/complete/woff/${fontFileName}.woff`,
+    woff2: `#{$font-prefix}/IBM-Plex-${family.type.replace(" ", "-")}/fonts/split/woff2/${fontFileName}.woff2`
   };
 
+  const src = unicode.characters
+    ? `src: ${local},
+    url('${urls.woff2}') format('woff2');
+    unicode-range: ${unicode.characters.join(", ")};` 
+    : `src: ${local},
+    url('${urls.woff}') format('woff');`
+
   return `@font-face {
   font-family: '${family.name}';
   font-style: ${weight.properties.fontStyle};
   font-weight: ${weight.properties.fontWeight};
-  src: local('${localFileName}'),
-    local('${localPostscriptName}'),
-    url('${urls.woff2}') format('woff2'),
-    url('${urls.woff}') format('woff');
-  unicode-range: '${unicode.characters.join(", ")}';
+  ${src}
 }
 `;
 };