-
Notifications
You must be signed in to change notification settings - Fork 21
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* Remove the preview stylesheet before adding the declarations for the new active font * Add the previous active font as fallback font of the new one
- Loading branch information
1 parent
8e9d0e3
commit ca2b3f9
Showing
3 changed files
with
81 additions
and
55 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,52 +1,77 @@ | ||
| import { Font, Script, Variant } from "../shared/types"; | ||
| import { Font, FontList, Script, Variant } from "../shared/types"; | ||
| import extractFontStyles from "./google-fonts/extractFontStyles"; | ||
| import getStylesheet from "./google-fonts/fontStylesheet"; | ||
| import { applyActiveFont, applyFontPreview } from "./styles/declarations"; | ||
| import { createStylesheet, deleteStylesheet, stylesheetExists } from "./styles/stylesheets"; | ||
|
|
||
| /** | ||
| * Get the Google Fonts stylesheet for the specified fonts (in the specified scripts and variants), | ||
| * split up the returned CSS rules into stylesheets per font and add these to the document head. | ||
| * If previewsOnly is set to true, only download the font parts for writing all characters contained | ||
| * in the fonts' names. | ||
| * Get the Google Fonts stylesheet for the specified font (in the specified scripts and variants, | ||
| * only the characters needed for creating the font previews), add the necessary CSS declarations to | ||
| * apply them and add the fonts' stylesheets to the document head | ||
| */ | ||
| export default async function loadFonts( | ||
| fonts: Font[], | ||
| export async function loadFontPreviews( | ||
| fonts: FontList, | ||
| scripts: Script[], | ||
| variants: Variant[], | ||
| previewsOnly: boolean, | ||
| selectorSuffix: string, | ||
| ): Promise<void> { | ||
| let fontsToFetch: Font[]; | ||
| if (previewsOnly) { | ||
| // Only load previews of fonts which don't have a stylesheet (for preview or full font) yet | ||
| fontsToFetch = fonts.filter( | ||
| font => !stylesheetExists(font.id, false) && !stylesheetExists(font.id, true), | ||
| ); | ||
| } else { | ||
| // Only load fonts which don't have a stylesheet (for full font) yet | ||
| fontsToFetch = fonts.filter(font => !stylesheetExists(font.id, false)); | ||
| } | ||
| // Only load previews of fonts which don't have a stylesheet (for preview or full font) yet | ||
| const fontsArray: Font[] = Array.from(fonts.values()); | ||
| const fontsToFetch = fontsArray | ||
| .map((font: Font) => font.id) | ||
| .filter(fontId => !stylesheetExists(fontId, false) && !stylesheetExists(fontId, true)); | ||
|
|
||
| // Get Google Fonts stylesheet containing all requested styles | ||
| const response = await getStylesheet(fonts, scripts, variants, previewsOnly); | ||
| const response = await getStylesheet(fontsArray, scripts, variants, true); | ||
| // Parse response and assign styles to the corresponding font | ||
| const fontStyles = extractFontStyles(response); | ||
|
|
||
| // Create separate stylesheets for the fonts | ||
| fontsToFetch.forEach(font => { | ||
| // Make sure response contains styles for the font | ||
| if (!(font.id in fontStyles)) { | ||
| console.error( | ||
| `Missing styles for font "${font.family}" (fontId "${font.id}") in Google Fonts response`, | ||
| ); | ||
| return; | ||
| } | ||
| if (!previewsOnly) { | ||
| // Delete preview stylesheet if exists | ||
| if (stylesheetExists(font.id, true)) { | ||
| deleteStylesheet(font.id); | ||
| fontsArray.forEach(font => { | ||
| applyFontPreview(font, selectorSuffix); | ||
|
|
||
| // Add stylesheets for fonts which need to be downloaded | ||
| if (fontsToFetch.includes(font.id)) { | ||
| // Make sure response contains styles for the font | ||
| if (!(font.id in fontStyles)) { | ||
| console.error( | ||
| `Missing styles for font "${font.family}" (fontId "${font.id}") in Google Fonts response`, | ||
| ); | ||
| return; | ||
| } | ||
| createStylesheet(font.id, fontStyles[font.id], true); | ||
| } | ||
| // Create stylesheet with the font's corresponding styles from the response | ||
| createStylesheet(font.id, fontStyles[font.id], previewsOnly); | ||
| }); | ||
| } | ||
|
|
||
| /** | ||
| * Get the Google Fonts stylesheet for the specified font (in the specified scripts and variants), | ||
| * add the necessary CSS declarations to apply it and add the font's stylesheet to the document head | ||
| */ | ||
| export async function loadActiveFont( | ||
| font: Font, | ||
| previousFontFamily: string, | ||
| scripts: Script[], | ||
| variants: Variant[], | ||
| selectorSuffix: string, | ||
| ): Promise<void> { | ||
| // Only load font if it doesn't have a stylesheet yet | ||
| if (stylesheetExists(font.id, false)) { | ||
| // Add CSS declaration to apply the new active font | ||
| applyActiveFont(font, previousFontFamily, selectorSuffix); | ||
| } else { | ||
| // Get Google Fonts stylesheet containing all requested styles | ||
| const fontStyle = await getStylesheet([font], scripts, variants, false); | ||
|
|
||
| // Delete preview stylesheet if exists | ||
| if (stylesheetExists(font.id, true)) { | ||
| deleteStylesheet(font.id); | ||
| } | ||
|
|
||
| // Add CSS declaration to apply the new active font | ||
| applyActiveFont(font, previousFontFamily, selectorSuffix); | ||
|
|
||
| // Create stylesheet with the font's corresponding styles from the response | ||
| createStylesheet(font.id, fontStyle, false); | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters