Browse Source

Tweak blockbase font provider to register the fonts from theme.json and force CORE to NOT register them

Jason Crist 3 years ago
parent
commit
215ed56fd9
2 changed files with 241 additions and 34 deletions
  1. 39 3
      blockbase/inc/fonts/blockbase-fonts-provider.php
  2. 202 31
      blockbase/theme.json

+ 39 - 3
blockbase/inc/fonts/blockbase-fonts-provider.php

@@ -18,7 +18,7 @@ class Blockbase_Fonts_Provider extends \WP_Webfonts_Provider {
 	}
 
 	/**
-	 * Gets the `@font-face` CSS styles for Blockbase Fonts.
+	 * Gets the `@font-face` CSS styles for enqueued Blockbase Fonts.
 	 *
 	 * @return string The `@font-face` CSS.
 	 */
@@ -44,7 +44,6 @@ function provider_enqueue_global_styles_fonts() {
 
 	foreach ( $global_styles_fonts as $font ) {
 		$font_is_registered = is_font_family_registered( $font );
-
 		if ( $font_is_registered ) {
 			wp_enqueue_webfont( $font );
 		}
@@ -92,7 +91,44 @@ function register_blockbase_fonts_provider() {
 		return;
 	}
 
-	$result = wp_register_webfont_provider( 'blockbase-fonts', 'Blockbase_Fonts_Provider' );
+	$settings = WP_Theme_JSON_Resolver::get_merged_data()->get_settings();
+
+	// Bail out early if there are no settings for webfonts.
+	if ( empty( $settings['typography'] ) || empty( $settings['typography']['fontFamilies'] ) ) {
+		return;
+	}
+
+	wp_register_webfont_provider( 'blockbase-fonts', 'Blockbase_Fonts_Provider' );
+
+	foreach ( $settings['typography']['fontFamilies'] as $font_families ) {
+		foreach ( $font_families as $font_family ) {
+
+			// Skip if fontFace is not defined.
+			if ( empty( $font_family['fontFace'] ) ) {
+				continue;
+			}
+
+			$font_family['fontFace'] = (array) $font_family['fontFace'];
+
+			foreach ( $font_family['fontFace'] as $font_face ) {
+				// Skip if the provider isn't blockbase-fonts
+				if ( ! 'blockbase-fonts' === $font_face['provider'] ) {
+					continue;
+				}
+
+				// Convert keys to kebab-case.
+				foreach ( $font_face as $property => $value ) {
+					$kebab_case               = _wp_to_kebab_case( $property );
+					$font_face[ $kebab_case ] = $value;
+					if ( $kebab_case !== $property ) {
+						unset( $font_face[ $property ] );
+					}
+				}
+
+				wp_webfonts()->register_webfont( $font_face );
+			}
+		}
+	}
 
 	// NOTE: As far as I can tell you can't assign a font-family at the individual block level
 	// which is what this logic is for.  This may someday be necessary but I don't believe it is now.

+ 202 - 31
blockbase/theme.json

@@ -372,7 +372,8 @@
 					"fontFace": [
 						{
 							"provider": "blockbase-fonts",
-							"fontFamily": "Arvo"
+							"fontFamily": "Arvo",
+							"origin": "gutenberg_wp_webfonts_api"
 						}
 					]
 				},
@@ -380,7 +381,13 @@
 					"fontFamily": "'Bodoni Moda', serif",
 					"slug": "bodoni-moda",
 					"name": "Bodoni Moda",
-					"provider": "blockbase-fonts"
+					"fontFace": [
+						{
+							"provider": "blockbase-fonts",
+							"fontFamily": "Bodoni Moda",
+							"origin": "gutenberg_wp_webfonts_api"
+						}
+					]
 				},
 				{
 					"fontFamily": "Cabin, sans-serif",
@@ -389,7 +396,8 @@
 					"fontFace": [
 						{
 							"provider": "blockbase-fonts",
-							"fontFamily": "Cabin"
+							"fontFamily": "Cabin",
+							"origin": "gutenberg_wp_webfonts_api"
 						}
 					]
 				},
@@ -397,31 +405,61 @@
 					"fontFamily": "Chivo, sans-serif",
 					"slug": "chivo",
 					"name": "Chivo",
-					"provider": "blockbase-fonts"
+					"fontFace": [
+						{
+							"provider": "blockbase-fonts",
+							"fontFamily": "Chivo",
+							"origin": "gutenberg_wp_webfonts_api"
+						}
+					]
 				},
 				{
 					"fontFamily": "'Courier Prime', serif",
 					"slug": "courier-prime",
 					"name": "Courier Prime",
-					"provider": "blockbase-fonts"
+					"fontFace": [
+						{
+							"provider": "blockbase-fonts",
+							"fontFamily": "Courier Prime",
+							"origin": "gutenberg_wp_webfonts_api"
+						}
+					]
 				},
 				{
 					"fontFamily": "'DM Sans', sans-serif",
 					"slug": "dm-sans",
 					"name": "DM Sans",
-					"provider": "blockbase-fonts"
+					"fontFace": [
+						{
+							"provider": "blockbase-fonts",
+							"fontFamily": "DM Sans",
+							"origin": "gutenberg_wp_webfonts_api"
+						}
+					]
 				},
 				{
 					"fontFamily": "Domine, serif",
 					"slug": "domine",
 					"name": "Domine",
-					"provider": "blockbase-fonts"
+					"fontFace": [
+						{
+							"provider": "blockbase-fonts",
+							"fontFamily": "Domine",
+							"origin": "gutenberg_wp_webfonts_api"
+						}
+					]
 				},
 				{
 					"fontFamily": "'EB Garamond', serif",
 					"slug": "eb-garamond",
 					"name": "EB Garamond",
-					"provider": "blockbase-fonts"
+					"fontFace": [
+						{
+							"provider": "blockbase-fonts",
+							"fontFamily": "EB Garamond",
+							"origin": "gutenberg_wp_webfonts_api"
+						}
+					]
 				},
 				{
 					"fontFamily": "'Fira Sans', sans-serif",
@@ -430,7 +468,8 @@
 					"fontFace": [
 						{
 							"provider": "blockbase-fonts",
-							"fontFamily": "Fira Sans"
+							"fontFamily": "Fira Sans",
+							"origin": "gutenberg_wp_webfonts_api"
 						}
 					]
 				},
@@ -438,133 +477,265 @@
 					"fontFamily": "'IBM Plex Mono', monospace",
 					"slug": "ibm-plex-mono",
 					"name": "IBM Plex Mono",
-					"provider": "blockbase-fonts"
+					"fontFace": [
+						{
+							"provider": "blockbase-fonts",
+							"fontFamily": "IBM Plex Mono",
+							"origin": "gutenberg_wp_webfonts_api"
+						}
+					]
 				},
 				{
 					"fontFamily": "Inter, sans-serif",
 					"slug": "inter",
 					"name": "Inter",
-					"provider": "blockbase-fonts"
+					"fontFace": [
+						{
+							"provider": "blockbase-fonts",
+							"fontFamily": "Inter",
+							"origin": "gutenberg_wp_webfonts_api"
+						}
+					]
 				},
 				{
 					"fontFamily": "'Josefin Sans', sans-serif",
 					"slug": "josefin-sans",
 					"name": "Josefin Sans",
-					"provider": "blockbase-fonts"
+					"fontFace": [
+						{
+							"provider": "blockbase-fonts",
+							"fontFamily": "Josefin Sans",
+							"origin": "gutenberg_wp_webfonts_api"
+						}
+					]
 				},
 				{
 					"fontFamily": "'Libre Baskerville', serif",
 					"slug": "libre-baskerville",
 					"name": "Libre Baskerville",
-					"provider": "blockbase-fonts"
+					"fontFace": [
+						{
+							"provider": "blockbase-fonts",
+							"fontFamily": "Libre Baskerville",
+							"origin": "gutenberg_wp_webfonts_api"
+						}
+					]
 				},
 				{
 					"fontFamily": "'Libre Franklin', sans-serif",
 					"slug": "libre-franklin",
 					"name": "Libre Franklin",
-					"provider": "blockbase-fonts"
+					"fontFace": [
+						{
+							"provider": "blockbase-fonts",
+							"fontFamily": "Libre Franklin",
+							"origin": "gutenberg_wp_webfonts_api"
+						}
+					]
 				},
 				{
 					"fontFamily": "Lora, serif",
 					"slug": "lora",
 					"name": "Lora",
-					"provider": "blockbase-fonts"
+					"fontFace": [
+						{
+							"provider": "blockbase-fonts",
+							"fontFamily": "Lora",
+							"origin": "gutenberg_wp_webfonts_api"
+						}
+					]
 				},
 				{
 					"fontFamily": "Merriweather, serif",
 					"slug": "merriweather",
 					"name": "Merriweather",
-					"provider": "blockbase-fonts"
+					"fontFace": [
+						{
+							"provider": "blockbase-fonts",
+							"fontFamily": "Merriweather",
+							"origin": "gutenberg_wp_webfonts_api"
+						}
+					]
 				},
 				{
 					"fontFamily": "Montserrat, sans-serif",
 					"slug": "montserrat",
 					"name": "Montserrat",
-					"provider": "blockbase-fonts"
+					"fontFace": [
+						{
+							"provider": "blockbase-fonts",
+							"fontFamily": "Montserrat",
+							"origin": "gutenberg_wp_webfonts_api"
+						}
+					]
 				},
 				{
 					"fontFamily": "Nunito, sans-serif",
 					"slug": "nunito",
 					"name": "Nunito",
-					"provider": "blockbase-fonts"
+					"fontFace": [
+						{
+							"provider": "blockbase-fonts",
+							"fontFamily": "Nunito",
+							"origin": "gutenberg_wp_webfonts_api"
+						}
+					]
 				},
 				{
 					"fontFamily": "'Open Sans', sans-serif",
 					"slug": "open-sans",
 					"name": "Open Sans",
-					"provider": "blockbase-fonts"
+					"fontFace": [
+						{
+							"provider": "blockbase-fonts",
+							"fontFamily": "Open Sans",
+							"origin": "gutenberg_wp_webfonts_api"
+						}
+					]
 				},
 				{
 					"fontFamily": "Overpass, sans-serif",
 					"slug": "overpass",
 					"name": "Overpass",
-					"provider": "blockbase-fonts"
+					"fontFace": [
+						{
+							"provider": "blockbase-fonts",
+							"fontFamily": "Overpass",
+							"origin": "gutenberg_wp_webfonts_api"
+						}
+					]
 				},
 				{
 					"fontFamily": "'Playfair Display', serif",
 					"slug": "playfair-display",
 					"name": "Playfair Display",
-					"provider": "blockbase-fonts"
+					"fontFace": [
+						{
+							"provider": "blockbase-fonts",
+							"fontFamily": "Playfair Display",
+							"origin": "gutenberg_wp_webfonts_api"
+						}
+					]
 				},
 				{
 					"fontFamily": "Poppins, sans-serif",
 					"slug": "poppins",
 					"name": "Poppins",
-					"provider": "blockbase-fonts"
+					"fontFace": [
+						{
+							"provider": "blockbase-fonts",
+							"fontFamily": "Poppins",
+							"origin": "gutenberg_wp_webfonts_api"
+						}
+					]
 				},
 				{
 					"fontFamily": "Raleway, sans-serif",
 					"slug": "raleway",
 					"name": "Raleway",
-					"provider": "blockbase-fonts"
+					"fontFace": [
+						{
+							"provider": "blockbase-fonts",
+							"fontFamily": "Raleway",
+							"origin": "gutenberg_wp_webfonts_api"
+						}
+					]
 				},
 				{
 					"fontFamily": "'Red Hat Display', sans-serif",
 					"slug": "red-hat-display",
 					"name": "Red Hat Display",
-					"provider": "blockbase-fonts"
+					"fontFace": [
+						{
+							"provider": "blockbase-fonts",
+							"fontFamily": "Red Hat Display",
+							"origin": "gutenberg_wp_webfonts_api"
+						}
+					]
 				},
 				{
 					"fontFamily": "Roboto, sans-serif",
 					"slug": "roboto",
 					"name": "Roboto",
-					"provider": "blockbase-fonts"
+					"fontFace": [
+						{
+							"provider": "blockbase-fonts",
+							"fontFamily": "Roboto",
+							"origin": "gutenberg_wp_webfonts_api"
+						}
+					]
 				},
 				{
 					"fontFamily": "'Roboto Slab', sans-serif",
 					"slug": "roboto-slab",
 					"name": "Roboto Slab",
-					"provider": "blockbase-fonts"
+					"fontFace": [
+						{
+							"provider": "blockbase-fonts",
+							"fontFamily": "Roboto Slab",
+							"origin": "gutenberg_wp_webfonts_api"
+						}
+					]
 				},
 				{
 					"fontFamily": "Rubik, sans-serif",
 					"slug": "rubik",
 					"name": "Rubik",
-					"provider": "blockbase-fonts"
+					"fontFace": [
+						{
+							"provider": "blockbase-fonts",
+							"fontFamily": "Rubik",
+							"origin": "gutenberg_wp_webfonts_api"
+						}
+					]
 				},
 				{
 					"fontFamily": "'Source Sans Pro', sans-serif",
 					"slug": "source-sans-pro",
 					"name": "Source Sans Pro",
-					"provider": "blockbase-fonts"
+					"fontFace": [
+						{
+							"provider": "blockbase-fonts",
+							"fontFamily": "Source Sans Pro",
+							"origin": "gutenberg_wp_webfonts_api"
+						}
+					]
 				},
 				{
 					"fontFamily": "'Source Serif Pro', sans-serif",
 					"slug": "source-serif-pro",
 					"name": "Source Serif Pro",
-					"provider": "blockbase-fonts"
+					"fontFace": [
+						{
+							"provider": "blockbase-fonts",
+							"fontFamily": "Source Serif Pro",
+							"origin": "gutenberg_wp_webfonts_api"
+						}
+					]
 				},
 				{
 					"fontFamily": "'Space Mono', sans-serif",
 					"slug": "space-mono",
 					"name": "Space Mono",
-					"provider": "blockbase-fonts"
+					"fontFace": [
+						{
+							"provider": "blockbase-fonts",
+							"fontFamily": "Space Mono",
+							"origin": "gutenberg_wp_webfonts_api"
+						}
+					]
 				},
 				{
 					"fontFamily": "'Work Sans', sans-serif",
 					"slug": "work-sans",
 					"name": "Work Sans",
-					"provider": "blockbase-fonts"
+					"fontFace": [
+						{
+							"provider": "blockbase-fonts",
+							"fontFamily": "Work Sans",
+							"origin": "gutenberg_wp_webfonts_api"
+						}
+					]
 				}
 			],
 			"fontSizes": [