| 1 |
<?php |
| 2 |
/** |
| 3 |
* Server-side rendering of the `core/media-text` block. |
| 4 |
* |
| 5 |
* @package WordPress |
| 6 |
*/ |
| 7 |
|
| 8 |
/** |
| 9 |
* Renders the `core/media-text` block on server. |
| 10 |
* |
| 11 |
* @since 6.6.0 |
| 12 |
* |
| 13 |
* @param array $attributes The block attributes. |
| 14 |
* @param string $content The block rendered content. |
| 15 |
* |
| 16 |
* @return string Returns the Media & Text block markup, if useFeaturedImage is true. |
| 17 |
*/ |
| 18 |
function gutenberg_render_block_core_media_text( $attributes, $content ) { |
| 19 |
if ( false === $attributes['useFeaturedImage'] ) { |
| 20 |
return $content; |
| 21 |
} |
| 22 |
|
| 23 |
if ( in_the_loop() ) { |
| 24 |
update_post_thumbnail_cache(); |
| 25 |
} |
| 26 |
|
| 27 |
$current_featured_image = get_the_post_thumbnail_url(); |
| 28 |
if ( ! $current_featured_image ) { |
| 29 |
return $content; |
| 30 |
} |
| 31 |
|
| 32 |
$has_media_on_right = 'right' === ( $attributes['mediaPosition'] ?? null ); |
| 33 |
$image_fill = (bool) ( $attributes['imageFill'] ?? false ); |
| 34 |
$focal_point_attr = $attributes['focalPoint'] ?? null; |
| 35 |
$focal_point_x = null; |
| 36 |
$focal_point_y = null; |
| 37 |
if ( is_array( $focal_point_attr ) ) { |
| 38 |
$focal_point_x = isset( $focal_point_attr['x'] ) && is_numeric( $focal_point_attr['x'] ) ? $focal_point_attr['x'] : null; |
| 39 |
$focal_point_y = isset( $focal_point_attr['y'] ) && is_numeric( $focal_point_attr['y'] ) ? $focal_point_attr['y'] : null; |
| 40 |
} |
| 41 |
$focal_point = null !== $focal_point_x && null !== $focal_point_y |
| 42 |
? round( $focal_point_x * 100 ) . '% ' . round( $focal_point_y * 100 ) . '%' |
| 43 |
: '50% 50%'; |
| 44 |
$unique_id = 'wp-block-media-text__media-' . wp_unique_id(); |
| 45 |
|
| 46 |
$block_tag_processor = new WP_HTML_Tag_Processor( $content ); |
| 47 |
$block_query = array( |
| 48 |
'tag_name' => 'div', |
| 49 |
'class_name' => 'wp-block-media-text', |
| 50 |
); |
| 51 |
|
| 52 |
while ( $block_tag_processor->next_tag( $block_query ) ) { |
| 53 |
if ( $image_fill ) { |
| 54 |
// The markup below does not work with the deprecated `is-image-fill` class. |
| 55 |
$block_tag_processor->remove_class( 'is-image-fill' ); |
| 56 |
$block_tag_processor->add_class( 'is-image-fill-element' ); |
| 57 |
} |
| 58 |
} |
| 59 |
|
| 60 |
$content = $block_tag_processor->get_updated_html(); |
| 61 |
|
| 62 |
$media_tag_processor = new WP_HTML_Tag_Processor( $content ); |
| 63 |
$wrapping_figure_query = array( |
| 64 |
'tag_name' => 'figure', |
| 65 |
'class_name' => 'wp-block-media-text__media', |
| 66 |
); |
| 67 |
|
| 68 |
if ( $has_media_on_right ) { |
| 69 |
// Loop through all the figure tags and set a bookmark on the last figure tag. |
| 70 |
while ( $media_tag_processor->next_tag( $wrapping_figure_query ) ) { |
| 71 |
$media_tag_processor->set_bookmark( 'last_figure' ); |
| 72 |
} |
| 73 |
if ( $media_tag_processor->has_bookmark( 'last_figure' ) ) { |
| 74 |
$media_tag_processor->seek( 'last_figure' ); |
| 75 |
// Insert a unique ID to identify the figure tag. |
| 76 |
$media_tag_processor->set_attribute( 'id', $unique_id ); |
| 77 |
} |
| 78 |
} else { |
| 79 |
if ( $media_tag_processor->next_tag( $wrapping_figure_query ) ) { |
| 80 |
// Insert a unique ID to identify the figure tag. |
| 81 |
$media_tag_processor->set_attribute( 'id', $unique_id ); |
| 82 |
} |
| 83 |
} |
| 84 |
|
| 85 |
$content = $media_tag_processor->get_updated_html(); |
| 86 |
|
| 87 |
// Add the image tag inside the figure tag, and update the image attributes |
| 88 |
// in order to display the featured image. |
| 89 |
$media_size_slug = $attributes['mediaSizeSlug'] ?? 'full'; |
| 90 |
$image_tag = '<img class="wp-block-media-text__featured_image">'; |
| 91 |
$content = preg_replace( |
| 92 |
'/(<figure\s+id="' . preg_quote( $unique_id, '/' ) . '"\s+class="wp-block-media-text__media"\s*>)/', |
| 93 |
'$1' . $image_tag, |
| 94 |
$content |
| 95 |
); |
| 96 |
|
| 97 |
$image_tag_processor = new WP_HTML_Tag_Processor( $content ); |
| 98 |
if ( $image_tag_processor->next_tag( |
| 99 |
array( |
| 100 |
'tag_name' => 'figure', |
| 101 |
'id' => $unique_id, |
| 102 |
) |
| 103 |
) ) { |
| 104 |
// The ID is only used to ensure that the correct figure tag is selected, |
| 105 |
// and can now be removed. |
| 106 |
$image_tag_processor->remove_attribute( 'id' ); |
| 107 |
if ( $image_tag_processor->next_tag( |
| 108 |
array( |
| 109 |
'tag_name' => 'img', |
| 110 |
'class_name' => 'wp-block-media-text__featured_image', |
| 111 |
) |
| 112 |
) ) { |
| 113 |
$image_tag_processor->set_attribute( 'src', esc_url( $current_featured_image ) ); |
| 114 |
$image_tag_processor->set_attribute( 'class', 'wp-image-' . get_post_thumbnail_id() . ' size-' . $media_size_slug ); |
| 115 |
$image_tag_processor->set_attribute( 'alt', trim( strip_tags( get_post_meta( get_post_thumbnail_id(), '_wp_attachment_image_alt', true ) ) ) ); |
| 116 |
if ( $image_fill ) { |
| 117 |
$image_tag_processor->set_attribute( 'style', 'object-position:' . $focal_point . ';' ); |
| 118 |
} |
| 119 |
|
| 120 |
$content = $image_tag_processor->get_updated_html(); |
| 121 |
} |
| 122 |
} |
| 123 |
|
| 124 |
return $content; |
| 125 |
} |
| 126 |
|
| 127 |
/** |
| 128 |
* Registers the `core/media-text` block renderer on server. |
| 129 |
* |
| 130 |
* @since 6.6.0 |
| 131 |
*/ |
| 132 |
function gutenberg_register_block_core_media_text() { |
| 133 |
register_block_type_from_metadata( |
| 134 |
__DIR__ . '/media-text', |
| 135 |
array( |
| 136 |
'render_callback' => 'gutenberg_render_block_core_media_text', |
| 137 |
) |
| 138 |
); |
| 139 |
} |
| 140 |
add_action( 'init', 'gutenberg_register_block_core_media_text', 20 ); |
| 141 |
|
