-
Notifications
You must be signed in to change notification settings - Fork 4.3k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Update/image block #11377
Update/image block #11377
Changes from 26 commits
9d5091f
4b3d889
be16a73
041d1a5
64648c1
28d9315
0a73bc9
1d0d17e
dbba831
b6dc78f
108ea54
22207ba
4cb8189
ae95eab
d9ef233
0aea270
a476203
8d37181
9d0899e
22007e6
5b5be6f
5525986
83ca683
15520ea
17c5563
6a98975
e8dfda2
e1a5a86
39bbfec
5102f35
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -116,6 +116,66 @@ function gutenberg_wpautop( $content ) { | |
remove_filter( 'the_content', 'wpautop' ); | ||
add_filter( 'the_content', 'gutenberg_wpautop', 6 ); | ||
|
||
/** | ||
* Add `srcset` to the image meta `sizes` array in the REST API response. | ||
* | ||
* @param WP_REST_Response $response Response object. | ||
* @param WP_Post $attachment Attachment post object. | ||
* @return WP_REST_Response Response object. | ||
*/ | ||
function gutenberg_rest_prepare_attachment( $response, $attachment ) { | ||
if ( ! isset( $response->data['media_type'] ) ) { | ||
return $response; | ||
} | ||
|
||
if ( $response->data['media_type'] === 'image' && ! empty( $response->data['media_details']['sizes'] ) ) { | ||
$meta = wp_get_attachment_metadata( $attachment->ID ); | ||
$sizes = $response->data['media_details']['sizes']; | ||
|
||
foreach ( $sizes as $size_name => $size ) { | ||
$srcset = wp_calculate_image_srcset( array( $size['width'], $size['height'] ), $size['source_url'], $meta, $attachment->ID ); | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. This is an interesting solution, but I wonder if it would be better to create the equivalent of There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Additionally, for the REST API, we should open a ticket to add this properly via There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Yeah, looked into making a JS version of There is a performance hit for recalculating the A good optimization would be to calculate only one Also, in order to handle this better in JS we may need to pass the
Right. Both of these functions will be "merged" to the appropriate places once this is added to core. There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Makes sense, thanks for the explanation. I don't think it would be out of the question to add a JS hook to a javascript function, but if the performance hit is negligible, I'm not opposed to including that data in REST responses. Perhaps doing one There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more.
Right, good idea! We also need to look a bit more into the "image meta", can expand it a bit and store some more info about the sub-sizes that were created, when, why, etc. Lets schedule a review of that in 5.1? |
||
|
||
if ( $srcset ) { | ||
$sizes[ $size_name ]['srcset'] = $srcset; | ||
} | ||
} | ||
|
||
$response->data['media_details']['sizes'] = $sizes; | ||
} | ||
|
||
return $response; | ||
} | ||
add_filter( 'rest_prepare_attachment', 'gutenberg_rest_prepare_attachment', 10, 2 ); | ||
|
||
/** | ||
* Add `srcset` to the prepared attachment data for the Media Library. | ||
* | ||
* @param array $response Array of prepared attachment data. | ||
* @param WP_Post $attachment Attachment object. | ||
* @param array $meta Array of attachment meta data. | ||
* @return array Array of prepared attachment data. | ||
*/ | ||
function gutenberg_prepare_attachment_for_js( $response, $attachment, $meta ) { | ||
if ( ! empty( $response['type'] ) && $response['type'] === 'image' && ! empty( $response['sizes'] ) ) { | ||
foreach ( $response['sizes'] as $size_name => $size ) { | ||
$srcset = wp_calculate_image_srcset( array( $size['width'], $size['height'] ), $size['url'], $meta, $attachment->ID ); | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Same concern as above. There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Yep, lets handle this the same as above. |
||
|
||
if ( $srcset ) { | ||
$response['sizes'][ $size_name ]['srcset'] = $srcset; | ||
} | ||
|
||
if ( array_key_exists( $size_name, $meta['sizes'] ) ) { | ||
$response['sizes'][ $size_name ]['actual_size'] = array( | ||
'width' => (int) $meta['sizes'][ $size_name ]['width'], | ||
'height' => (int) $meta['sizes'][ $size_name ]['height'], | ||
); | ||
} | ||
} | ||
} | ||
|
||
return $response; | ||
} | ||
add_filter( 'wp_prepare_attachment_for_js', 'gutenberg_prepare_attachment_for_js', 10, 3 ); | ||
|
||
/** | ||
* Check if we need to load the block warning in the Classic Editor. | ||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Is this supposed to be part of this PR?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Not really. Still work-in-progress though, will do the
TODO
:)