<?php
/**
* Server-side rendering of the `core/image` block.
*
* @package WordPress
*/
/**
* Renders the `core/image` block on the server,
* adding a data-id attribute to the element if core/gallery has added on pre-render.
*
* @since 5.9.0
*
* @param array $attributes The block attributes.
* @param string $content The block content.
* @param WP_Block $block The block object.
*
* @return string The block content with the data-id attribute added.
*/
function render_block_core_image( $attributes, $content, $block ) {
if ( false === stripos( $content, '<img' ) ) {
return '';
}
$p = new WP_HTML_Tag_Processor( $content );
if ( ! $p->next_tag( 'img' ) || ! $p->get_attribute( 'src' ) ) {
return '';
}
$has_id_binding = isset( $attributes['metadata']['bindings']['id'] ) && isset( $attributes['id'] );
// Ensure the `wp-image-id` classname on the image block supports block bindings.
if ( $has_id_binding ) {
// If there's a mismatch with the 'wp-image-' class and the actual id, the id was
// probably overridden by block bindings. Update it to the correct value.
// See https://github.com/WordPress/gutenberg/issues/62886 for why this is needed.
$id = $attributes['id'];
$image_classnames = $p->get_attribute( 'class' );
$class_with_binding_value = "wp-image-$id";
if ( is_string( $image_classnames ) && ! str_contains( $image_classnames, $class_with_binding_value ) ) {
$image_classnames = preg_replace( '/wp-image-(\d+)/', $class_with_binding_value, $image_classnames );
$p->set_attribute( 'class', $image_classnames );
}
}
// For backwards compatibility, the data-id html attribute is only set for
// image blocks nested in a gallery. Detect if the image is in a gallery by
// checking the data-id attribute.
// See the `block_core_gallery_data_id_backcompatibility` function.
if ( isset( $attributes['data-id'] ) ) {
// If there's a binding for the `id`, the `id` attribute is used for the
// value, since `data-id` does not support block bindings.
// Else the `data-id` is used for backwards compatibility, since
// third parties may be filtering its value.
$data_id = $has_id_binding ? $attributes['id'] : $attributes['data-id'];
$p->set_attribute( 'data-id', $data_id );
}
$link_destination = isset( $attributes['linkDestination'] ) ? $attributes['linkDestination'] : 'none';
$lightbox_settings = block_core_image_get_lightbox_settings( $block->parsed_block );
/*
* If the lightbox is enabled and the image is not linked, adds the filter and
* the JavaScript view file.
*/
if (
isset( $lightbox_settings ) &&
'none' === $link_destination &&
isset( $lightbox_settings['enabled'] ) &&
true === $lightbox_settings['enabled']
) {
wp_enqueue_script_module( '@wordpress/block-library/image/view' );
/*
* This render needs to happen in a filter with priority 15 to ensure that
* it runs after the duotone filter and that duotone styles are applied to
* the image in the lightbox. Lightbox has to work with any plugins that
* might use filters as well. Removing this can be considered in the future
* if the way the blocks are rendered changes, or if a new kind of filter is
* introduced.
*/
add_filter( 'render_block_core/image', 'block_core_image_render_lightbox', 15, 2 );
} else {
/*
* Remove the filter if previously added by other Image blocks.
*/
remove_filter( 'render_block_core/image', 'block_core_image_render_lightbox', 15 );
}
return $p->get_updated_html();
}
/**
* Adds the lightboxEnabled flag to the block data.
*
* This is used to determine whether the lightbox should be rendered or not.
*
* @since 6.4.0
*
* @param array $block Block data.
*
* @return array Filtered block data.
*/
function block_core_image_get_lightbox_settings( $block ) {
// Gets the lightbox setting from the block attributes.
if ( isset( $block['attrs']['lightbox'] ) ) {
$lightbox_settings = $block['attrs']['lightbox'];
}
if ( ! isset( $lightbox_settings ) ) {
$lightbox_settings = wp_get_global_sett