18 function render_block_core_cover( $attributes, $content ) { |
18 function render_block_core_cover( $attributes, $content ) { |
19 if ( 'image' !== $attributes['backgroundType'] || false === $attributes['useFeaturedImage'] ) { |
19 if ( 'image' !== $attributes['backgroundType'] || false === $attributes['useFeaturedImage'] ) { |
20 return $content; |
20 return $content; |
21 } |
21 } |
22 |
22 |
|
23 $object_position = isset( $attributes['focalPoint'] ) |
|
24 ? round( $attributes['focalPoint']['x'] * 100 ) . '% ' . round( $attributes['focalPoint']['y'] * 100 ) . '%' |
|
25 : null; |
|
26 |
23 if ( ! ( $attributes['hasParallax'] || $attributes['isRepeated'] ) ) { |
27 if ( ! ( $attributes['hasParallax'] || $attributes['isRepeated'] ) ) { |
24 $attr = array( |
28 $attr = array( |
25 'class' => 'wp-block-cover__image-background', |
29 'class' => 'wp-block-cover__image-background', |
26 'data-object-fit' => 'cover', |
30 'data-object-fit' => 'cover', |
27 ); |
31 ); |
28 |
32 |
29 if ( isset( $attributes['focalPoint'] ) ) { |
33 if ( $object_position ) { |
30 $object_position = round( $attributes['focalPoint']['x'] * 100 ) . '% ' . round( $attributes['focalPoint']['y'] * 100 ) . '%'; |
|
31 $attr['data-object-position'] = $object_position; |
34 $attr['data-object-position'] = $object_position; |
32 $attr['style'] = 'object-position: ' . $object_position; |
35 $attr['style'] = 'object-position:' . $object_position . ';'; |
33 } |
36 } |
34 |
37 |
35 $image = get_the_post_thumbnail( null, 'post-thumbnail', $attr ); |
38 $image = get_the_post_thumbnail( null, $attributes['sizeSlug'] ?? 'post-thumbnail', $attr ); |
36 |
|
37 /* |
|
38 * Inserts the featured image between the (1st) cover 'background' `span` and 'inner_container' `div`, |
|
39 * and removes eventual whitespace characters between the two (typically introduced at template level) |
|
40 */ |
|
41 $inner_container_start = '/<div\b[^>]+wp-block-cover__inner-container[\s|"][^>]*>/U'; |
|
42 if ( 1 === preg_match( $inner_container_start, $content, $matches, PREG_OFFSET_CAPTURE ) ) { |
|
43 $offset = $matches[0][1]; |
|
44 $content = substr( $content, 0, $offset ) . $image . substr( $content, $offset ); |
|
45 } |
|
46 } else { |
39 } else { |
47 if ( in_the_loop() ) { |
40 if ( in_the_loop() ) { |
48 update_post_thumbnail_cache(); |
41 update_post_thumbnail_cache(); |
49 } |
42 } |
50 $current_featured_image = get_the_post_thumbnail_url(); |
43 $current_featured_image = get_the_post_thumbnail_url( null, $attributes['sizeSlug'] ?? null ); |
51 if ( ! $current_featured_image ) { |
44 if ( ! $current_featured_image ) { |
52 return $content; |
45 return $content; |
53 } |
46 } |
54 |
47 |
55 $processor = new WP_HTML_Tag_Processor( $content ); |
48 $current_thumbnail_id = get_post_thumbnail_id(); |
|
49 |
|
50 $processor = new WP_HTML_Tag_Processor( '<div></div>' ); |
56 $processor->next_tag(); |
51 $processor->next_tag(); |
57 |
52 |
58 $styles = $processor->get_attribute( 'style' ); |
53 $current_alt = trim( strip_tags( get_post_meta( $current_thumbnail_id, '_wp_attachment_image_alt', true ) ) ); |
59 $merged_styles = ! empty( $styles ) ? $styles . ';' : ''; |
54 if ( $current_alt ) { |
60 $merged_styles .= 'background-image:url(' . esc_url( $current_featured_image ) . ');'; |
55 $processor->set_attribute( 'role', 'img' ); |
|
56 $processor->set_attribute( 'aria-label', $current_alt ); |
|
57 } |
61 |
58 |
62 $processor->set_attribute( 'style', $merged_styles ); |
59 $processor->add_class( 'wp-block-cover__image-background' ); |
63 $content = $processor->get_updated_html(); |
60 $processor->add_class( 'wp-image-' . $current_thumbnail_id ); |
|
61 if ( $attributes['hasParallax'] ) { |
|
62 $processor->add_class( 'has-parallax' ); |
|
63 } |
|
64 if ( $attributes['isRepeated'] ) { |
|
65 $processor->add_class( 'is-repeated' ); |
|
66 } |
|
67 |
|
68 $styles = 'background-position:' . ( $object_position ?? '50% 50%' ) . ';'; |
|
69 $styles .= 'background-image:url(' . esc_url( $current_featured_image ) . ');'; |
|
70 $processor->set_attribute( 'style', $styles ); |
|
71 |
|
72 $image = $processor->get_updated_html(); |
|
73 } |
|
74 |
|
75 /* |
|
76 * Inserts the featured image between the (1st) cover 'background' `span` and 'inner_container' `div`, |
|
77 * and removes eventual whitespace characters between the two (typically introduced at template level) |
|
78 */ |
|
79 $inner_container_start = '/<div\b[^>]+wp-block-cover__inner-container[\s|"][^>]*>/U'; |
|
80 if ( 1 === preg_match( $inner_container_start, $content, $matches, PREG_OFFSET_CAPTURE ) ) { |
|
81 $offset = $matches[0][1]; |
|
82 $content = substr( $content, 0, $offset ) . $image . substr( $content, $offset ); |
64 } |
83 } |
65 |
84 |
66 return $content; |
85 return $content; |
67 } |
86 } |
68 |
87 |