Skip to content

Commit

Permalink
Register builtin fonts into fontstore
Browse files Browse the repository at this point in the history
  • Loading branch information
mocanew committed Jun 19, 2023
1 parent a37d927 commit 3745604
Show file tree
Hide file tree
Showing 4 changed files with 223 additions and 26 deletions.
6 changes: 5 additions & 1 deletion packages/font/src/font.js
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,7 @@ class FontSource {
this.fontStyle = fontStyle || 'normal';
this.fontWeight = fontWeight || 400;

this.data = null;
this.data = typeof src === 'object' && src.builtin ? src.builtin : null;
this.options = options;
this.loadResultPromise = null;
}
Expand All @@ -75,6 +75,10 @@ class FontSource {
}

async load() {
if (typeof this.src === 'object' && this.src.builtin) {
return Promise.resolve();
}

if (this.loadResultPromise === null) {
this.loadResultPromise = this._load();
}
Expand Down
73 changes: 62 additions & 11 deletions packages/font/src/index.js
Original file line number Diff line number Diff line change
@@ -1,8 +1,67 @@
import font from './font';
import standard from './standard';

const CourierFont = font.create('Courier');
CourierFont.register({
src: { builtin: 'Courier' },
});
CourierFont.register({
fontStyle: 'oblique',
src: { builtin: 'Courier-Oblique' },
});
CourierFont.register({
fontWeight: 700,
src: { builtin: 'Courier-Bold' },
});
CourierFont.register({
fontWeight: 700,
fontStyle: 'oblique',
src: { builtin: 'Courier-BoldOblique' },
});

const HelveticaFont = font.create('Helvetica');
HelveticaFont.register({
src: { builtin: 'Helvetica' },
});
HelveticaFont.register({
fontStyle: 'oblique',
src: { builtin: 'Helvetica-Oblique' },
});
HelveticaFont.register({
fontWeight: 700,
src: { builtin: 'Helvetica-Bold' },
});
HelveticaFont.register({
fontWeight: 700,
fontStyle: 'oblique',
src: { builtin: 'Helvetica-BoldOblique' },
});

const TimesRomanFont = font.create('Times-Roman');
TimesRomanFont.register({
src: { builtin: 'Times-Roman' },
});
TimesRomanFont.register({
fontStyle: 'italic',
src: { builtin: 'Times-Italic' },
});
TimesRomanFont.register({
fontWeight: 700,
src: { builtin: 'Times-Bold' },
});
TimesRomanFont.register({
fontWeight: 700,
fontStyle: 'italic',
src: { builtin: 'Times-BoldItalic' },
});

export const builtinFonts = {
Courier: CourierFont,
Helvetica: HelveticaFont,
'Times-Roman': TimesRomanFont,
};

function FontStore() {
let fonts = {};
let fonts = { ...builtinFonts };

let emojiSource = null;

Expand Down Expand Up @@ -35,9 +94,6 @@ function FontStore() {

this.getFont = descriptor => {
const { fontFamily } = descriptor;
const isStandard = standard.includes(fontFamily);

if (isStandard) return null;

if (!fonts[fontFamily]) {
throw new Error(
Expand All @@ -49,11 +105,6 @@ function FontStore() {
};

this.load = async descriptor => {
const { fontFamily } = descriptor;
const isStandard = standard.includes(fontFamily);

if (isStandard) return;

const f = this.getFont(descriptor);

// We cache the font to avoid fetching it many times
Expand All @@ -70,7 +121,7 @@ function FontStore() {
};

this.clear = () => {
fonts = {};
fonts = { ...builtinFonts };
};

this.getRegisteredFonts = () => fonts;
Expand Down
14 changes: 0 additions & 14 deletions packages/font/src/standard.js

This file was deleted.

156 changes: 156 additions & 0 deletions packages/font/tests/builtinFonts.test.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,156 @@
import FontStore from '../src';

describe('fontStore default fonts', () => {
test('should return builtin Courier', () => {
const fontStore = new FontStore();

expect(
fontStore.getFont({
fontFamily: 'Courier',
fontWeight: 400,
fontStyle: 'normal',
}).data,
).toBe('Courier');
expect(
fontStore.getFont({
fontFamily: 'Courier',
fontWeight: 400,
fontStyle: 'oblique',
}).data,
).toBe('Courier-Oblique');
expect(
fontStore.getFont({
fontFamily: 'Courier',
fontWeight: 700,
fontStyle: 'normal',
}).data,
).toBe('Courier-Bold');
expect(
fontStore.getFont({
fontFamily: 'Courier',
fontWeight: 700,
fontStyle: 'oblique',
}).data,
).toBe('Courier-BoldOblique');
});
test('should return builtin Helvetica', () => {
const fontStore = new FontStore();

expect(
fontStore.getFont({
fontFamily: 'Helvetica',
fontWeight: 400,
fontStyle: 'normal',
}).data,
).toBe('Helvetica');
expect(
fontStore.getFont({
fontFamily: 'Helvetica',
fontWeight: 400,
fontStyle: 'oblique',
}).data,
).toBe('Helvetica-Oblique');
expect(
fontStore.getFont({
fontFamily: 'Helvetica',
fontWeight: 700,
fontStyle: 'normal',
}).data,
).toBe('Helvetica-Bold');
expect(
fontStore.getFont({
fontFamily: 'Helvetica',
fontWeight: 700,
fontStyle: 'oblique',
}).data,
).toBe('Helvetica-BoldOblique');
});
test('should return builtin Times-Roman', () => {
const fontStore = new FontStore();

expect(
fontStore.getFont({
fontFamily: 'Times-Roman',
fontWeight: 400,
fontStyle: 'normal',
}).data,
).toBe('Times-Roman');
expect(
fontStore.getFont({
fontFamily: 'Times-Roman',
fontWeight: 400,
fontStyle: 'italic',
}).data,
).toBe('Times-Italic');
expect(
fontStore.getFont({
fontFamily: 'Times-Roman',
fontWeight: 700,
fontStyle: 'normal',
}).data,
).toBe('Times-Bold');
expect(
fontStore.getFont({
fontFamily: 'Times-Roman',
fontWeight: 700,
fontStyle: 'italic',
}).data,
).toBe('Times-BoldItalic');
});

test('should return builtin fonts after reset', () => {
const fontStore = new FontStore();

fontStore.reset();

expect(
fontStore.getFont({
fontFamily: 'Courier',
fontWeight: 400,
fontStyle: 'normal',
}).data,
).toBe('Courier');
expect(
fontStore.getFont({
fontFamily: 'Helvetica',
fontWeight: 400,
fontStyle: 'normal',
}).data,
).toBe('Helvetica');
expect(
fontStore.getFont({
fontFamily: 'Times-Roman',
fontWeight: 400,
fontStyle: 'normal',
}).data,
).toBe('Times-Roman');
});

test('should return builtin fonts after clear', () => {
const fontStore = new FontStore();

fontStore.clear();

expect(
fontStore.getFont({
fontFamily: 'Courier',
fontWeight: 400,
fontStyle: 'normal',
}).data,
).toBe('Courier');
expect(
fontStore.getFont({
fontFamily: 'Helvetica',
fontWeight: 400,
fontStyle: 'normal',
}).data,
).toBe('Helvetica');
expect(
fontStore.getFont({
fontFamily: 'Times-Roman',
fontWeight: 400,
fontStyle: 'normal',
}).data,
).toBe('Times-Roman');
});
});

0 comments on commit 3745604

Please sign in to comment.