cep-vfstring

CEP Variable Font String

Parse Variable Font values in extensions for Adobe Creative Cloud apps, in JavaScript & ExtendScript (ES3).

npm install https://github.com/kennethormandy/cep-vfstring

Getting started

If you are using ExtendScript (ES3) without any kind of build toolchain, you can include the file by copying the index.js file somewhere into your project, and using ExtendScript’s //@include statement:

//@include "./path/to/vendor/cep-vfstring/index.js"

However, you’ll almost certainly want to use some kind of build toolchain to make the development process easier.

// Load the library in the JS environment
import vfString from 'cep-vfstring'

// Using https://npm.im/cep-interface
import {
  inCEPEnvironment,
  loadExtendscript,
  evalExtendscript,
} from "cep-interface";

if (inCEPEnvironment()) {
  // Load the library in the ExtendScript environment
  loadExtendscript(
    "node_modules/cep-vfstring/index.js"
  );

  // $.global.vfString now available, ex. for use
  // in another ExtendScript file
  loadExtendscript('./another-extendscript-file.jsx')
}

API

parse

var textFontStr = "[TextFont EncodeSans_660wght_50wdth]";
vfString.parse(textFontStr);

format

vfString.format("EncodeSans", {
  wght: 835,
  wdth: 72,
});

Examples

Shouldn’t it be possible to pass the result of parse directly to format, and vice versa, like JSON.parse and JSON.stringify? Maybe. In this case I’ve optimised for use within the CEP environment, so the result of vfString.format can be immediately used to get a font.

Here’s a contrived but complete example of going from parse to format and back in ExtendScript.

ExtendScript example

var fontString = "[TextFont EncodeSans_550wght_120wdth]"

// You’d probably actually get this from a selection
var result = $.global.vfString.parse(fontString);

$.writeln(result.fontFamily);
// Logs: `EncodeSans`

$.writeln(result.fontVariations.wght);
// Logs: `550`

$.writeln(result.fontVariations.wdth);
// Logs: `120`

var ccFontName = $.global.vfString.format(
  result.fontFamily,
  result.fontVariations
);

$.writeln(ccFontName);
// Logs: `EncodeSans_550wght_120wdth`

var font = app.textFonts.getFontByName(ccFontName)

JavaScript example

// You’d might get this from passing some ExtendScript
// back into the JavaScript environment
let fontString = "[TextFont EncodeSans_550wght_120wdth]"

let result = vfString.parse(fontString);

console.log(result)
// Logs:
// {
//  fontFamily: "EncodeSans",
//  fontVariations: {
//    wght: 660,
//    wdth: 50
//  }
// }

let ccFontName = vfString.format(result.fontFamily, result.fontVariations)

console.log(ccFontName)
// Logs: `EncodeSans_660wght_50wdth`

License

Apache 2.0