font-range 0.2.1 → 1.0.1

package/src/main.ts

@@ -1,11 +1,33 @@
-import { join, parse } from 'path';
-import { createReadStream, createWriteStream, existsSync, mkdirSync } from 'fs';
-import fetch, { Headers } from 'node-fetch';
-import { parse as parseCSS, ParseOptions } from 'css-tree';
-import { execSync } from 'child_process';
-import { RequiredByValueExcept, ValueOf } from './types';
-
-// == Resouce Basics ==========================================================
+import { join, parse } from "path";
+import { createReadStream, createWriteStream, existsSync } from "fs";
+import { mkdir } from "fs/promises";
+
+import Piscina from "piscina";
+import fetch, { Headers } from "@esm2cjs/node-fetch";
+import { parse as cssAST, ParseOptions, walk } from "css-tree";
+import type { Declaration } from "css-tree";
+
+import type WorkerFn from "./worker";
+import type { RequiredByValueExcept } from "./types";
+
+// == Worker ===================================================================
+type WorkerRT = ReturnType<typeof WorkerFn>;
+
+class Worker {
+  private static instance: Piscina;
+  private constructor() { }
+
+  public static getInstance(): Piscina {
+    if(!Worker.instance) {
+      Worker.instance = new Piscina({
+        filename: join(__dirname, "../", "build", "worker.js")
+      });
+    }
+    return Worker.instance;
+  }
+}
+
+// == Resouce Basics ===========================================================
 export const targets = {
   weston:   "https://fonts.googleapis.com/css2?family=Noto+Sans&display=swap",
   korean:   "https://fonts.googleapis.com/css2?family=Noto+Sans+KR&display=swap",
@@ -41,7 +63,7 @@ function getCSSPath(dirPath: string, url: string) {
   }
 
   if (!existsSync(url)) {
-    throw new Error(url + "Not vaild URL or PATH");
+    throw new Error("Not vaild URL or PATH: " + url);
   }
   return url;
 }
@@ -49,24 +71,31 @@ function getCSSPath(dirPath: string, url: string) {
 // == CSS I/O ==================================================================
 async function saveCSS(path: string, url: string) {
   // Fake header
+  const version = "109.0";
   const headers = new Headers({
     "Accept": "text/html,application/xhtml+xml,application/xml;",
-    "User-Agent": "Mozilla/5.0 (Windows NT 10.0; rv:78.0) Gecko/20100101 Firefox/78.0"
+    "User-Agent": `Mozilla/5.0 (Windows NT 10.0; rv:${ version }) Gecko/20100101 Firefox/${ version }`
   });
 
   const res = await fetch(url, {
     method: "GET",
     headers: headers
   });
-  const fileStream = createWriteStream(path);
+  if(res.status !== 200) {
+    throw new Error("Not vaild URL: " + url);
+  }
 
-  await new Promise<void>((resolve, reject) => {
+  return new Promise<void>((resolve, reject) => {
+    const fileStream = createWriteStream(path);
     res.body.pipe(fileStream);
     res.body.on("error", (err) => {
-      console.log('File write Error.');
+      console.log("File write Error.");
       reject(err);
     });
-    fileStream.on("finish", function() {
+    res.body.on("close", () => {
+      fileStream.close();
+    });
+    fileStream.on("close", () => {
       resolve();
     });
   });
@@ -76,20 +105,19 @@ async function readCSS(path: string) {
   return new Promise<string>((resolve, reject) => {
     const readData: (string | Buffer)[] = [];
     createReadStream(path)
-      .on('data', (data) => {
+      .on("data", (data) => {
         readData.push(data);
       })
-      .on('end', async () => {
-        await Promise.all(readData);
-        const css = readData.join('');
+      .on("end", () => {
+        const css = readData.join("");
 
         resolve(css);
       })
-      .on('error', reject);
+      .on("error", reject);
   });
 }
 
-// == CSS Parse ===============================================================
+// == CSS Parse ================================================================
 const parseOptions: ParseOptions = {
   parseAtrulePrelude: false,
   parseRulePrelude:   false,
@@ -99,134 +127,356 @@ const parseOptions: ParseOptions = {
 async function loadAST(dirPath: string, url = targets.korean, parseOption = parseOptions) {
   const cssPath = getCSSPath(dirPath, url);
   if (!existsSync(dirPath)) {
-    mkdirSync(dirPath);
+    await mkdir(dirPath);
   }
   if (!existsSync(cssPath)) {
     await saveCSS(cssPath, url);
   }
 
   const css = await readCSS(cssPath);
-  const ast = await parseCSS(css, parseOption);
-  return ast;
-}
-
-function parseUnicodeRanges(parsed) {
-  const fontFaceL = parsed.children;
-  const uniRangeL = fontFaceL.map((faceValObj => {
-    const faceBlockL     = faceValObj.block.children;
-    const uniRangeBlockL = faceBlockL.filter(faceBlock => faceBlock.property === "unicode-range");
-    const uniRangeL      = uniRangeBlockL.map(uniRangeBlock => uniRangeBlock.value.value);
-    return uniRangeL.head.data;
-  }));
-
-  const uniRanges: string[] = [];
-  uniRangeL.forEach(unicodeRange => {
-    uniRanges.push(unicodeRange);
-  });
-  return uniRanges;
+  return cssAST(css, parseOption);
 }
 
-export async function getUnicodeRanges(dirPath = "src", url = targets.korean): Promise<string[]> {
-  const ast = await loadAST(dirPath, url);
-  return parseUnicodeRanges(ast);
+interface BlockI {
+  src:      string;
+  unicodes: string;
+}
+function setBlock(block: BlockI, elem: Declaration, blockProp: keyof BlockI, elemProp: string) {
+  if(elem.property === elemProp) {
+    if(elem.value.type === "Raw") {
+      block[blockProp] = elem.value.value;
+    }
+  }
+}
+
+export async function parseCSS(dirPath = "src", url = targets.korean) {
+  const ast    = await loadAST(dirPath, url);
+  const parsed = [] as BlockI[];
+
+  walk(ast, { visit: "Atrule", enter(node) {
+    if(node.name === "font-face") {
+      const block = {
+        src: "",
+        unicodes: ""
+      };
+      walk(node, { visit: "Declaration", enter(elem) {
+        setBlock(block, elem, "src",       "src");
+        setBlock(block, elem, "unicodes",  "unicode-range");
+      }});
+
+      if(block.src !== "" || block.unicodes !== "") {
+        parsed.push(block);
+      }
+    }
+  }});
+  return parsed;
 }
 
-// == Options =================================================================
-interface fontRangeOptionI {
-  savePath:    string;
-  format:      string;
+// == Options - Basics =========================================================
+export interface FontDefaultOptionI {
+  saveDir:     string;
+  format:      Format;
   nameFormat:  string;
-  defaultArgs: string;
-  etcArgs:     string;
+  logFormat:   string;
+  defaultArgs: string[];
+  etcArgs:     string[];
 }
+export interface FontRangeOptionI extends FontDefaultOptionI {
+  fromCSS:    "default" | "srcIndex" | "srcName";
+}
+export interface FontSubsetOptionI extends FontDefaultOptionI {
+  textFile:    string;
+  text:        string;
+}
+export interface FontPipeOptionI extends FontRangeOptionI, FontSubsetOptionI {
+  cssFile:     string;
+}
+type ArgOptionT<I>     = FontDefaultOptionI["saveDir"] | Partial<I>;
+type FontRangeOptionT  = ArgOptionT<FontRangeOptionI>;
+type FontSubsetOptionT = ArgOptionT<FontSubsetOptionI>;
+type FontPipeOptionT   = Partial<FontPipeOptionI>;
+type ArgOptionsT       = FontRangeOptionT | FontSubsetOptionT | FontPipeOptionT;
+type Format            = "otf" | "ttf" | "woff2" | "woff" | "woff-zopfli";
 
-function getDefaultOptions(): RequiredByValueExcept<fontRangeOptionI, 'savePath'> {
+export const defaultArgs = [
+  "--layout-features=*",
+  "--glyph-names",
+  "--symbol-cmap",
+  "--legacy-cmap",
+  "--notdef-glyph",
+  "--notdef-outline",
+  "--recommended-glyphs",
+  "--name-legacy",
+  "--drop-tables=",
+  "--name-IDs=*",
+  "--name-languages=*"
+];
+
+function getDefaultOptions(): RequiredByValueExcept<FontDefaultOptionI, "saveDir"> {
   return {
     format:      "woff2",
     nameFormat:  "{NAME}_{INDEX}{EXT}",
-    defaultArgs: "--layout-features='*' \
-                  --glyph-names \
-                  --symbol-cmap \
-                  --legacy-cmap \
-                  --notdef-glyph \
-                  --notdef-outline \
-                  --recommended-glyphs \
-                  --name-legacy \
-                  --drop-tables= \
-                  --name-IDs='*' \
-                  --name-languages='*'",
-    etcArgs:      ""
+    logFormat:    "Convert {ORIGIN} -> {OUTPUT}",
+    defaultArgs: defaultArgs,
+    etcArgs:     []
   };
 }
 
-function getOption(options: Partial<fontRangeOptionI>, key: keyof fontRangeOptionI, alterValue: ValueOf<fontRangeOptionI>) {
-  return Object.prototype.hasOwnProperty.call(options, key)
-    ? options[key]
-    : alterValue;
-}
-
-function getName(nameFormat: string, fontName: string, index: number, fontExt: string) {
-  return nameFormat
-    .replace( "{NAME}", fontName)
-    .replace("{INDEX}", index.toString())
-    .replace(  "{EXT}", fontExt);
-}
-
-// == Main ====================================================================
-function getFormat(format: string) {
+// == Options - Get Info =======================================================
+function getFormat(format: Format) {
   switch(format) {
     case "otf":   return "otf";
     case "ttf":   return "ttf";
     case "woff2": return "woff2";
     case "woff":  return "woff";
     case "woff-zopfli": return "woff";
-    default: return "woff2";
   }
 }
 
-function formatOption(format: string, ext = true) {
+function formatOption(format: Format) {
   const formatName = getFormat(format);
-  if(ext) return "." + formatName;
 
-  if(format === "otf" || format === "ttf") return "";
-  return "--flavor='" + ((format === "woff-zopfli")
-       ? formatName + "' --with-zopfli "
-       : formatName + "' ");
+  if(format === "otf" || format === "ttf") return [""];
+  return [
+    "--flavor=" + formatName,
+    (format === "woff-zopfli") ? "--with-zopfli" : ""
+  ];
+}
+
+function fileNameInit(nameFormat: string, fontName: string, fontExt: string) {
+  return nameFormat
+    .replace( "{NAME}", fontName)
+    .replace(  "{EXT}", fontExt );
+}
+function getFileName(initName: string, index?: number | string) {
+  return initName
+    .replace("{INDEX}",
+        (typeof index === "number")
+      ? index.toString()
+      : (typeof index === "string")
+      ? index
+      : ""
+    );
+}
+function getConsoleLog(logFormat: string, origin: string, output: string) {
+  return logFormat
+    .replace("{ORIGIN}", origin)
+    .replace("{OUTPUT}", output);
 }
 
-export function fontRange(
-  url = targets.korean, fontPath = "",
-  fontRangeOption?: fontRangeOptionI['savePath'] | Partial<fontRangeOptionI>
-): Promise<Buffer[]> {
-  const options = Object.assign(
+function getOptionInfos(fontPath = "", fontOption?: ArgOptionsT, indexIndicate = "") {
+  const options: FontPipeOptionT = Object.assign(
+    { fromCSS: "default" } satisfies Partial<FontRangeOptionI>,
     getDefaultOptions(),
-    typeof(fontRangeOption) === 'string'
-      ? { savePath: fontRangeOption }
-      : fontRangeOption
+    typeof(fontOption) === "string"
+      ? { saveDir: fontOption }
+      : fontOption
   );
 
   const format   = options.format;
   const pathInfo = parse(fontPath);
   const fontDir  = pathInfo.dir;
+  const fontBase = pathInfo.base;
   const fontName = pathInfo.name;
-  const fontExt  = formatOption(format);
+  const fontExt  = "." + getFormat(format);
 
-  const dirPath  = getOption(options, 'savePath', fontDir);
-  const ranges   = getUnicodeRanges(dirPath, url);
+  const dirPath    = Object.prototype.hasOwnProperty.call(options, "saveDir") ? options["saveDir"] : fontDir;
+  const nameFormat = options.nameFormat;
+  const logFormat  = options.logFormat;
+
+  const initName = fileNameInit(nameFormat, fontName, fontExt);
+  const output   = getFileName(initName, indexIndicate);
+  const logMsg   = getConsoleLog(logFormat, fontBase, output);
 
-  const convertOption = formatOption(format, false);
+  const convertOption = formatOption(format);
   const defaultOption = options.defaultArgs;
   const etcOption     = options.etcArgs;
+  const baseOption    = [
+    ...convertOption,
+    ...defaultOption,
+    ...etcOption
+  ].filter(option => option !== "");
 
-  const nameFormat = options.nameFormat;
-  return ranges.then(eachRanges => eachRanges.map((unicodes, i) => {
-    const saveOption = "--output-file='" +
-      join(dirPath, getName(nameFormat, fontName, i, fontExt)) + "' ";
-    const unicodeRanges = unicodes.split(', ').join(',');
-    const unicodeOption = "--unicodes='" + unicodeRanges + "' ";
-
-    const options = " '" + fontPath + "' " + saveOption + unicodeOption
-      + convertOption + defaultOption + etcOption;
-    return execSync("pyftsubset" + options);
-  }));
+  const worker = Worker.getInstance();
+
+  return {
+    dirPath,
+    initName,
+    logMsg,
+
+    baseOption,
+    worker,
+
+    fromCSS: options.fromCSS
+  };
+}
+
+// == Options - Others =========================================================
+function getSrcInfo(src: string) {
+  const first = src.split(",").find((str) => {
+    return str.indexOf("url(") === 0;
+  });
+  if(typeof first === "undefined") return {
+    base:  "",
+    index: 0
+  };
+
+  const reStr = "url\\(";
+  const reMdl = "(.+?)";
+  const reEnd = "\\)";
+  const quote = "(\\\\?['\"])?";
+  const regex = new RegExp(
+    reStr + quote + reMdl + quote + reEnd
+  );
+
+  const urlContent = first.match(regex)[2];
+  const parsedURL  = parse(urlContent);
+  return {
+    base:  parsedURL.base,
+    index: parseInt(
+      parsedURL.name.split(".").pop()  // google font index at latest
+    )
+  };
+}
+
+function getSaveOption(dirPath: string, initName: string, index?: number) {
+  const fileName = getFileName(initName, index);
+  return ("--output-file=" + join(dirPath, fileName));
+}
+
+function getSubsetOption(fontSubsetOption?: FontSubsetOptionT) {
+  if(
+    typeof fontSubsetOption !== "undefined" &&
+    typeof fontSubsetOption !== "string"
+  ) {
+    if("textFile" in fontSubsetOption) {
+      return ("--text-file=" + fontSubsetOption.textFile);
+    }
+    if("text"     in fontSubsetOption) {
+      return ("--text="      + fontSubsetOption.text    );
+    }
+  }
+  return "--glyphs=*";
+}
+
+// == Main =====================================================================
+export async function fontRange(fontPath = "", url = targets.korean, fontRangeOption?: FontRangeOptionT) {
+  const {
+    dirPath,
+    initName,
+    logMsg,
+
+    baseOption,
+    worker,
+
+    fromCSS
+  } = getOptionInfos(fontPath, fontRangeOption, "n");
+
+  const ranges = await parseCSS(dirPath, url);
+  const result = ranges.map(async ({src, unicodes}, i) => {
+    const srcInfo       = getSrcInfo(src);
+    const saveOption    = getSaveOption(
+      dirPath,
+      (fromCSS === "srcName"  && srcInfo.base !== "")
+        ? srcInfo.base
+        : initName,
+      (fromCSS === "srcIndex" && srcInfo.base !== "")
+        ? srcInfo.index
+        : i
+    );
+    const unicodeRanges = unicodes.split(", ").join(",");
+    const unicodeOption = "--unicodes=" + unicodeRanges;
+
+    const options = [fontPath, saveOption, unicodeOption, ...baseOption];
+    const logInfo = (i === 0) ? logMsg : "";
+    const result: WorkerRT = await worker.run({ options, log: logInfo});
+    return result;
+  });
+
+  return await Promise.all(result);
+}
+
+export async function fontSubset(fontPath = "", fontSubsetOption?: FontSubsetOptionT) {
+  const {
+    dirPath,
+    initName,
+    logMsg,
+
+    baseOption,
+    worker
+  } = getOptionInfos(fontPath, fontSubsetOption);
+  if(!existsSync(dirPath)) await mkdir(dirPath);
+
+  const subsetOption = getSubsetOption(fontSubsetOption);
+  const saveOption   = getSaveOption(dirPath, initName);
+
+  const options = [fontPath, saveOption, subsetOption, ...baseOption];
+  const result: WorkerRT = await worker.run({ options, log: logMsg});
+  return result;
+}
+
+// == Pipeline =================================================================
+export interface FontPipeI {
+  fontPath: string;
+  option?:  FontPipeOptionT;
+}
+function fontPipeExec(subsetTarget: FontPipeI) {
+  const { fontPath, option } = subsetTarget;
+
+  return ((typeof option         !== "undefined") &&
+          (typeof option.cssFile !== "undefined"))
+    ? fontRange(fontPath, option.cssFile, option)
+    : fontSubset(fontPath, option);
+}
+
+function shardNum(shardStr: string, content: string) {
+  const num = Math.abs(parseInt(shardStr, 10));
+
+  if(isNaN(num) || num <= 0) {
+    throw new Error("<" + content + "> must be a positive number");
+  }
+  return num;
+}
+function getShardInfo(shardEnv: string) {
+  const [indexStr, totalStr] = shardEnv.split("/");
+  const index = shardNum(indexStr, "index");
+  const total = shardNum(totalStr, "total");
+
+  if(index > total) {
+    throw new Error("<index> must be less then <total>")
+  }
+  return [index, total] as const;
+}
+
+interface ShardI {
+  shard:       string;
+  shardFormat: string;
+}
+type ShardT = ShardI["shard"] | Partial<ShardI>
+export async function fontPipe(subsetList: FontPipeI[], shard?: ShardT) {
+  const shardEnv    = (typeof shard === "object" && typeof shard.shard       === "string")
+    ? shard.shard
+    : (typeof shard === "object" || typeof shard === "undefined")
+    ? process.env.SHARD || "1/1"
+    : shard;
+  const shardFormat = (typeof shard === "object" && typeof shard.shardFormat === "string")
+    ? shard.shardFormat
+    : "== {START}/{END} ==========";
+
+  const [index, total] = getShardInfo(shardEnv);
+  const shardSize  = Math.ceil(subsetList.length / total);
+  const shardStart = shardSize * (index - 1);
+  const shardEnd   = shardSize * index;
+
+  if(shardEnv !== "1/1") {
+    const shardMsg = shardFormat
+      .replace("{START}", index.toString())
+      .replace("{END}",   total.toString());
+    console.log(shardMsg);
+  }
+
+  const result = subsetList
+    .slice(shardStart, shardEnd)
+    .map(fontPipeExec);
+  return await Promise.all(result);
 }

package/src/{types.ts → types.d.ts}

@@ -1,5 +1,3 @@
 // https://stackoverflow.com/questions/52703321/make-some-properties-optional-in-a-typescript-type
 type Diff<T, U> = T extends U ? never : T;
 export type RequiredByValueExcept<T, TOptional extends keyof T> = Pick<T, Diff<keyof T, TOptional>> & Partial<T>;
-
-export type ValueOf<T> = T[keyof T];

package/src/worker.ts

@@ -0,0 +1,12 @@
+import { execaSync } from "@esm2cjs/execa";
+
+export interface SubsetI {
+  options: string[],
+  log?:     string
+}
+export default function subset({options, log = ""}: SubsetI) {
+  if(log !== "") {
+    console.log(log);
+  }
+  return execaSync("pyftsubset", options);
+}

package/tsconfig.json

@@ -6,6 +6,7 @@
     ],
     "module": "commonjs",
     "moduleResolution": "node",
+    "esModuleInterop": true,
     "allowSyntheticDefaultImports": true,
     "allowJs": true,
     "importHelpers": true,

package/tsconfig.release.json

@@ -1,10 +1,11 @@
 {
   "extends": "./tsconfig.json",
   "compilerOptions": {
-    "rootDir": ".",
+    "rootDir": "src",
     "outDir": "build",
     "removeComments": true,
-    "declaration": true
+    "declaration": true,
+    "sourceMap": false
   },
   "include": [
     "src/**/*"

package/.github/workflows/nodejs.yml

@@ -1,36 +0,0 @@
-name: Node.js CI
-
-on: [push, pull_request]
-
-jobs:
-  build:
-    runs-on: ubuntu-latest
-    steps:
-    - uses: actions/checkout@v2
-    - uses: volta-cli/action@v1
-    - name: pip cache
-      id: pip-cache
-      uses: actions/cache@v2
-      with:
-        path: ~/.cache/pip
-        key: ${{ runner.os }}-pip-${{ hashFiles('**/requirements.txt') }}
-        restore-keys: |
-          ${{ runner.os }}-pip-
-    - name: node cache
-      id: node-cache
-      uses: actions/cache@v2
-      with:
-        path: node_modules
-        key: ${{ runner.os }}-node-${{ hashFiles('**/package-lock.json') }}
-        restore-keys: |
-          ${{ runner.os }}-node-
-    - run: pip install -r ./requirements.txt
-    - name: npm install
-      if: steps.node-cache.outputs.cache-hit != 'true'
-      run: npm install
-    - run: npm ci --no-audit
-    - run: npm run lint --if-present
-    - run: npm test
-    - run: npm run build --if-present
-      env:
-        CI: true