--- a/wp/wp-includes/media-template.php Tue Dec 15 15:52:01 2020 +0100
+++ b/wp/wp-includes/media-template.php Wed Sep 21 18:19:35 2022 +0200
@@ -160,7 +160,7 @@
/* translators: 1: Link to tutorial, 2: Additional link attributes, 3: Accessibility text. */
__( '<a href="%1$s" %2$s>Describe the purpose of the image%3$s</a>. Leave empty if the image is purely decorative.' ),
esc_url( 'https://www.w3.org/WAI/tutorials/images/decision-tree' ),
- 'target="_blank" rel="noopener noreferrer"',
+ 'target="_blank" rel="noopener"',
sprintf(
'<span class="screen-reader-text"> %s</span>',
/* translators: Accessibility text. */
@@ -252,12 +252,12 @@
<div class="upload-ui">
<h2 class="upload-instructions drop-instructions"><?php _e( 'Drop files to upload' ); ?></h2>
<p class="upload-instructions drop-instructions"><?php _ex( 'or', 'Uploader: Drop files here - or - Select Files' ); ?></p>
- <button type="button" class="browser button button-hero"><?php _e( 'Select Files' ); ?></button>
+ <button type="button" class="browser button button-hero" aria-labelledby="post-upload-info"><?php _e( 'Select Files' ); ?></button>
</div>
<div class="upload-inline-status"></div>
- <div class="post-upload-ui">
+ <div class="post-upload-ui" id="post-upload-info">
<?php
/** This action is documented in wp-admin/includes/media.php */
do_action( 'pre-upload-ui' ); // phpcs:ignore WordPress.NamingConventions.ValidHookName.UseUnderscores
@@ -309,10 +309,10 @@
<?php // Template for the view switchers, used for example in the Media Grid. ?>
<script type="text/html" id="tmpl-media-library-view-switcher">
- <a href="<?php echo esc_url( add_query_arg( 'mode', 'list', $_SERVER['REQUEST_URI'] ) ); ?>" class="view-list">
+ <a href="<?php echo esc_url( add_query_arg( 'mode', 'list', admin_url( 'upload.php' ) ) ); ?>" class="view-list">
<span class="screen-reader-text"><?php _e( 'List view' ); ?></span>
</a>
- <a href="<?php echo esc_url( add_query_arg( 'mode', 'grid', $_SERVER['REQUEST_URI'] ) ); ?>" class="view-grid current" aria-current="page">
+ <a href="<?php echo esc_url( add_query_arg( 'mode', 'grid', admin_url( 'upload.php' ) ) ); ?>" class="view-grid current" aria-current="page">
<span class="screen-reader-text"><?php _e( 'Grid view' ); ?></span>
</a>
</script>
@@ -366,9 +366,9 @@
<# } #>
<# if ( 'audio' === data.type ) { #>
- <div class="wp-media-wrapper">
+ <div class="wp-media-wrapper wp-audio">
<audio style="visibility: hidden" controls class="wp-audio-shortcode" width="100%" preload="none">
- <source type="{{ data.mime }}" src="{{ data.url }}"/>
+ <source type="{{ data.mime }}" src="{{ data.url }}" />
</audio>
</div>
<# } else if ( 'video' === data.type ) {
@@ -384,7 +384,7 @@
<# if ( data.width ) { #>width="{{ data.width }}"<# } #>
<# if ( data.height ) { #>height="{{ data.height }}"<# } #>
<# if ( data.image && data.image.src !== data.icon ) { #>poster="{{ data.image.src }}"<# } #>>
- <source type="{{ data.mime }}" src="{{ data.url }}"/>
+ <source type="{{ data.mime }}" src="{{ data.url }}" />
</video>
</div>
<# } #>
@@ -405,10 +405,27 @@
</span>
<div class="details">
<h2 class="screen-reader-text"><?php _e( 'Details' ); ?></h2>
+ <div class="uploaded"><strong><?php _e( 'Uploaded on:' ); ?></strong> {{ data.dateFormatted }}</div>
+ <div class="uploaded-by">
+ <strong><?php _e( 'Uploaded by:' ); ?></strong>
+ <# if ( data.authorLink ) { #>
+ <a href="{{ data.authorLink }}">{{ data.authorName }}</a>
+ <# } else { #>
+ {{ data.authorName }}
+ <# } #>
+ </div>
+ <# if ( data.uploadedToTitle ) { #>
+ <div class="uploaded-to">
+ <strong><?php _e( 'Uploaded to:' ); ?></strong>
+ <# if ( data.uploadedToLink ) { #>
+ <a href="{{ data.uploadedToLink }}">{{ data.uploadedToTitle }}</a>
+ <# } else { #>
+ {{ data.uploadedToTitle }}
+ <# } #>
+ </div>
+ <# } #>
<div class="filename"><strong><?php _e( 'File name:' ); ?></strong> {{ data.filename }}</div>
- <div class="filename"><strong><?php _e( 'File type:' ); ?></strong> {{ data.mime }}</div>
- <div class="uploaded"><strong><?php _e( 'Uploaded on:' ); ?></strong> {{ data.dateFormatted }}</div>
-
+ <div class="file-type"><strong><?php _e( 'File type:' ); ?></strong> {{ data.mime }}</div>
<div class="file-size"><strong><?php _e( 'File size:' ); ?></strong> {{ data.filesizeHumanReadable }}</div>
<# if ( 'image' === data.type && ! data.uploading ) { #>
<# if ( data.width && data.height ) { #>
@@ -442,6 +459,10 @@
</div>
<# } #>
+ <# if ( data.mediaStates ) { #>
+ <div class="media-states"><strong><?php _e( 'Used as:' ); ?></strong> {{ data.mediaStates }}</div>
+ <# } #>
+
<div class="compat-meta">
<# if ( data.compat && data.compat.meta ) { #>
{{{ data.compat.meta }}}
@@ -485,25 +506,11 @@
<label for="attachment-details-two-column-description" class="name"><?php _e( 'Description' ); ?></label>
<textarea id="attachment-details-two-column-description" {{ maybeReadOnly }}>{{ data.description }}</textarea>
</span>
- <span class="setting">
- <span class="name"><?php _e( 'Uploaded By' ); ?></span>
- <span class="value">{{ data.authorName }}</span>
- </span>
- <# if ( data.uploadedToTitle ) { #>
- <span class="setting">
- <span class="name"><?php _e( 'Uploaded To' ); ?></span>
- <# if ( data.uploadedToLink ) { #>
- <span class="value"><a href="{{ data.uploadedToLink }}">{{ data.uploadedToTitle }}</a></span>
- <# } else { #>
- <span class="value">{{ data.uploadedToTitle }}</span>
- <# } #>
- </span>
- <# } #>
<span class="setting" data-setting="url">
<label for="attachment-details-two-column-copy-link" class="name"><?php _e( 'File URL:' ); ?></label>
<input type="text" class="attachment-details-copy-link" id="attachment-details-two-column-copy-link" value="{{ data.url }}" readonly />
<span class="copy-to-clipboard-container">
- <button type="button" class="button button-small copy-attachment-url" data-clipboard-target="#attachment-details-two-column-copy-link"><?php _e( 'Copy URL' ); ?></button>
+ <button type="button" class="button button-small copy-attachment-url" data-clipboard-target="#attachment-details-two-column-copy-link"><?php _e( 'Copy URL to clipboard' ); ?></button>
<span class="success hidden" aria-hidden="true"><?php _e( 'Copied!' ); ?></span>
</span>
</span>
@@ -511,11 +518,19 @@
</div>
<div class="actions">
- <a class="view-attachment" href="{{ data.link }}"><?php _e( 'View attachment page' ); ?></a>
- <# if ( data.can.save ) { #> |
+ <# if ( data.link ) { #>
+ <a class="view-attachment" href="{{ data.link }}"><?php _e( 'View attachment page' ); ?></a>
+ <# } #>
+ <# if ( data.can.save ) { #>
+ <# if ( data.link ) { #>
+ <span class="links-separator">|</span>
+ <# } #>
<a href="{{ data.editLink }}"><?php _e( 'Edit more details' ); ?></a>
<# } #>
- <# if ( ! data.uploading && data.can.remove ) { #> |
+ <# if ( ! data.uploading && data.can.remove ) { #>
+ <# if ( data.link || data.can.save ) { #>
+ <span class="links-separator">|</span>
+ <# } #>
<?php if ( MEDIA_TRASH ) : ?>
<# if ( 'trash' === data.status ) { #>
<button type="button" class="button-link untrash-attachment"><?php _e( 'Restore from Trash' ); ?></button>
@@ -536,7 +551,7 @@
<div class="thumbnail">
<# if ( data.uploading ) { #>
<div class="media-progress-bar"><div style="width: {{ data.percent }}%"></div></div>
- <# } else if ( 'image' === data.type && data.sizes ) { #>
+ <# } else if ( 'image' === data.type && data.size && data.size.url ) { #>
<div class="centered">
<img src="{{ data.size.url }}" draggable="false" alt="" />
</div>
@@ -595,15 +610,41 @@
</span>
</h2>
<div class="attachment-info">
- <div class="thumbnail thumbnail-{{ data.type }}">
- <# if ( data.uploading ) { #>
- <div class="media-progress-bar"><div></div></div>
- <# } else if ( 'image' === data.type && data.sizes ) { #>
- <img src="{{ data.size.url }}" draggable="false" alt="" />
- <# } else { #>
- <img src="{{ data.icon }}" class="icon" draggable="false" alt="" />
- <# } #>
- </div>
+
+ <# if ( 'audio' === data.type ) { #>
+ <div class="wp-media-wrapper wp-audio">
+ <audio style="visibility: hidden" controls class="wp-audio-shortcode" width="100%" preload="none">
+ <source type="{{ data.mime }}" src="{{ data.url }}" />
+ </audio>
+ </div>
+ <# } else if ( 'video' === data.type ) {
+ var w_rule = '';
+ if ( data.width ) {
+ w_rule = 'width: ' + data.width + 'px;';
+ } else if ( wp.media.view.settings.contentWidth ) {
+ w_rule = 'width: ' + wp.media.view.settings.contentWidth + 'px;';
+ }
+ #>
+ <div style="{{ w_rule }}" class="wp-media-wrapper wp-video">
+ <video controls="controls" class="wp-video-shortcode" preload="metadata"
+ <# if ( data.width ) { #>width="{{ data.width }}"<# } #>
+ <# if ( data.height ) { #>height="{{ data.height }}"<# } #>
+ <# if ( data.image && data.image.src !== data.icon ) { #>poster="{{ data.image.src }}"<# } #>>
+ <source type="{{ data.mime }}" src="{{ data.url }}" />
+ </video>
+ </div>
+ <# } else { #>
+ <div class="thumbnail thumbnail-{{ data.type }}">
+ <# if ( data.uploading ) { #>
+ <div class="media-progress-bar"><div></div></div>
+ <# } else if ( 'image' === data.type && data.size && data.size.url ) { #>
+ <img src="{{ data.size.url }}" draggable="false" alt="" />
+ <# } else { #>
+ <img src="{{ data.icon }}" class="icon" draggable="false" alt="" />
+ <# } #>
+ </div>
+ <# } #>
+
<div class="details">
<div class="filename">{{ data.filename }}</div>
<div class="uploaded">{{ data.dateFormatted }}</div>
@@ -636,6 +677,10 @@
</div>
<# } #>
+ <# if ( data.mediaStates ) { #>
+ <div class="media-states"><strong><?php _e( 'Used as:' ); ?></strong> {{ data.mediaStates }}</div>
+ <# } #>
+
<# if ( ! data.uploading && data.can.remove ) { #>
<?php if ( MEDIA_TRASH ) : ?>
<# if ( 'trash' === data.status ) { #>
@@ -694,7 +739,7 @@
<label for="attachment-details-copy-link" class="name"><?php _e( 'File URL:' ); ?></label>
<input type="text" class="attachment-details-copy-link" id="attachment-details-copy-link" value="{{ data.url }}" readonly />
<div class="copy-to-clipboard-container">
- <button type="button" class="button button-small copy-attachment-url" data-clipboard-target="#attachment-details-copy-link"><?php _e( 'Copy URL' ); ?></button>
+ <button type="button" class="button button-small copy-attachment-url" data-clipboard-target="#attachment-details-copy-link"><?php _e( 'Copy URL to clipboard' ); ?></button>
<span class="success hidden" aria-hidden="true"><?php _e( 'Copied!' ); ?></span>
</div>
</span>
@@ -975,7 +1020,7 @@
?>
<span class="setting caption">
<label for="embed-image-settings-caption" class="name"><?php _e( 'Caption' ); ?></label>
- <textarea id="embed-image-settings-caption" data-setting="caption" />
+ <textarea id="embed-image-settings-caption" data-setting="caption"></textarea>
</span>
<?php endif; ?>
@@ -1446,14 +1491,14 @@
<img src="<?php echo esc_url( admin_url( 'images/' . ( is_rtl() ? 'browser-rtl.png' : 'browser.png' ) ) ); ?>" class="browser-preview" width="182" height="" alt="" />
<div class="favicon">
- <img id="preview-favicon" src="{{ data.url }}" alt="<?php esc_attr_e( 'Preview as a browser icon' ); ?>"/>
+ <img id="preview-favicon" src="{{ data.url }}" alt="<?php esc_attr_e( 'Preview as a browser icon' ); ?>" />
</div>
<span class="browser-title" aria-hidden="true"><# print( '<?php bloginfo( 'name' ); ?>' ) #></span>
</div>
<strong aria-hidden="true"><?php _e( 'As an app icon' ); ?></strong>
<div class="app-icon-preview">
- <img id="preview-app-icon" src="{{ data.url }}" alt="<?php esc_attr_e( 'Preview as an app icon' ); ?>"/>
+ <img id="preview-app-icon" src="{{ data.url }}" alt="<?php esc_attr_e( 'Preview as an app icon' ); ?>" />
</div>
</script>