wp/wp-includes/media-template.php
changeset 22 8c2e4d02f4ef
parent 21 48c4eec2b7e6
equal deleted inserted replaced
21:48c4eec2b7e6 22:8c2e4d02f4ef
   159 	$alt_text_description = sprintf(
   159 	$alt_text_description = sprintf(
   160 		/* translators: 1: Link to tutorial, 2: Additional link attributes, 3: Accessibility text. */
   160 		/* translators: 1: Link to tutorial, 2: Additional link attributes, 3: Accessibility text. */
   161 		__( '<a href="%1$s" %2$s>Learn how to describe the purpose of the image%3$s</a>. Leave empty if the image is purely decorative.' ),
   161 		__( '<a href="%1$s" %2$s>Learn how to describe the purpose of the image%3$s</a>. Leave empty if the image is purely decorative.' ),
   162 		/* translators: Localized tutorial, if one exists. W3C Web Accessibility Initiative link has list of existing translations. */
   162 		/* translators: Localized tutorial, if one exists. W3C Web Accessibility Initiative link has list of existing translations. */
   163 		esc_url( __( 'https://www.w3.org/WAI/tutorials/images/decision-tree/' ) ),
   163 		esc_url( __( 'https://www.w3.org/WAI/tutorials/images/decision-tree/' ) ),
   164 		'target="_blank" rel="noopener"',
   164 		'target="_blank"',
   165 		sprintf(
   165 		sprintf(
   166 			'<span class="screen-reader-text"> %s</span>',
   166 			'<span class="screen-reader-text"> %s</span>',
   167 			/* translators: Hidden accessibility text. */
   167 			/* translators: Hidden accessibility text. */
   168 			__( '(opens in a new tab)' )
   168 			__( '(opens in a new tab)' )
   169 		)
   169 		)
   221 		<div class="uploader-editor-content">
   221 		<div class="uploader-editor-content">
   222 			<div class="uploader-editor-title"><?php _e( 'Drop files to upload' ); ?></div>
   222 			<div class="uploader-editor-title"><?php _e( 'Drop files to upload' ); ?></div>
   223 		</div>
   223 		</div>
   224 	</script>
   224 	</script>
   225 
   225 
   226 	<?php // Template for the inline uploader, used for example in the Media Library admin page - Add New. ?>
   226 	<?php // Template for the inline uploader, used for example in the Media Library admin page - Add. ?>
   227 	<script type="text/html" id="tmpl-uploader-inline">
   227 	<script type="text/html" id="tmpl-uploader-inline">
   228 		<# var messageClass = data.message ? 'has-upload-message' : 'no-upload-message'; #>
   228 		<# var messageClass = data.message ? 'has-upload-message' : 'no-upload-message'; #>
   229 		<# if ( data.canClose ) { #>
   229 		<# if ( data.canClose ) { #>
   230 		<button class="close dashicons dashicons-no"><span class="screen-reader-text">
   230 		<button class="close dashicons dashicons-no"><span class="screen-reader-text">
   231 			<?php
   231 			<?php
   354 		<button type="button" class="button upload-dismiss-errors"><?php _e( 'Dismiss errors' ); ?></button>
   354 		<button type="button" class="button upload-dismiss-errors"><?php _e( 'Dismiss errors' ); ?></button>
   355 	</script>
   355 	</script>
   356 
   356 
   357 	<?php // Template for the uploading status errors. ?>
   357 	<?php // Template for the uploading status errors. ?>
   358 	<script type="text/html" id="tmpl-uploader-status-error">
   358 	<script type="text/html" id="tmpl-uploader-status-error">
   359 		<span class="upload-error-filename">{{{ data.filename }}}</span>
   359 		<span class="upload-error-filename word-wrap-break-word">{{{ data.filename }}}</span>
   360 		<span class="upload-error-message">{{ data.message }}</span>
   360 		<span class="upload-error-message">{{ data.message }}</span>
   361 	</script>
   361 	</script>
   362 
   362 
   363 	<?php // Template for the Attachment Details layout in the media browser. ?>
   363 	<?php // Template for the Attachment Details layout in the media browser. ?>
   364 	<script type="text/html" id="tmpl-edit-attachment-frame">
   364 	<script type="text/html" id="tmpl-edit-attachment-frame">
   603 					</div>
   603 					</div>
   604 				<# } else { #>
   604 				<# } else { #>
   605 					<div class="centered">
   605 					<div class="centered">
   606 						<# if ( data.image && data.image.src && data.image.src !== data.icon ) { #>
   606 						<# if ( data.image && data.image.src && data.image.src !== data.icon ) { #>
   607 							<img src="{{ data.image.src }}" class="thumbnail" draggable="false" alt="" />
   607 							<img src="{{ data.image.src }}" class="thumbnail" draggable="false" alt="" />
   608 						<# } else if ( data.sizes && data.sizes.medium ) { #>
   608 						<# } else if ( data.sizes ) { 
   609 							<img src="{{ data.sizes.medium.url }}" class="thumbnail" draggable="false" alt="" />
   609 								if ( data.sizes.medium ) { #>
       
   610 									<img src="{{ data.sizes.medium.url }}" class="thumbnail" draggable="false" alt="" />
       
   611 								<# } else { #>
       
   612 									<img src="{{ data.sizes.full.url }}" class="thumbnail" draggable="false" alt="" />
       
   613 								<# } #>
   610 						<# } else { #>
   614 						<# } else { #>
   611 							<img src="{{ data.icon }}" class="icon" draggable="false" alt="" />
   615 							<img src="{{ data.icon }}" class="icon" draggable="false" alt="" />
   612 						<# } #>
   616 						<# } #>
   613 					</div>
   617 					</div>
   614 					<div class="filename">
   618 					<div class="filename">
  1540 		<img class="crop-image" src="{{ data.url }}" alt="<?php esc_attr_e( 'Image crop area preview. Requires mouse interaction.' ); ?>" />
  1544 		<img class="crop-image" src="{{ data.url }}" alt="<?php esc_attr_e( 'Image crop area preview. Requires mouse interaction.' ); ?>" />
  1541 		<div class="upload-errors"></div>
  1545 		<div class="upload-errors"></div>
  1542 	</script>
  1546 	</script>
  1543 
  1547 
  1544 	<?php // Template for the Site Icon preview, used for example in the Customizer. ?>
  1548 	<?php // Template for the Site Icon preview, used for example in the Customizer. ?>
  1545 	<script type="text/html" id="tmpl-site-icon-preview">
  1549 	<script type="text/html" id="tmpl-site-icon-preview-crop">
  1546 		<h2><?php _e( 'Preview' ); ?></h2>
  1550 		<style>
  1547 		<strong aria-hidden="true"><?php _e( 'As a browser icon' ); ?></strong>
  1551 			:root{
  1548 		<div class="favicon-preview">
  1552 				--site-icon-url: url( "{{ data.url }}" );
  1549 			<img src="<?php echo esc_url( admin_url( 'images/' . ( is_rtl() ? 'browser-rtl.png' : 'browser.png' ) ) ); ?>" class="browser-preview" width="182" height="" alt="" />
  1553 			}
  1550 
  1554 		</style>
  1551 			<div class="favicon">
  1555 		<h2><?php _ex( 'Site Icon Preview', 'noun' ); ?></h2>
  1552 				<img id="preview-favicon" src="{{ data.url }}" alt="<?php esc_attr_e( 'Preview as a browser icon' ); ?>" />
  1556 		<p><?php _e( 'As an app icon and a browser icon.' ); ?></p>
  1553 			</div>
  1557 		<div class="site-icon-preview crop">
  1554 			<span class="browser-title" aria-hidden="true"><# print( '<?php echo esc_js( get_bloginfo( 'name' ) ); ?>' ) #></span>
  1558 			<div class="image-preview-wrap app-icon-preview">
  1555 		</div>
  1559 				<img id="preview-app-icon" src="{{ data.url }}" class="app-icon-preview" alt="<?php esc_attr_e( 'Preview as an app icon' ); ?>" />
  1556 
  1560 			</div>
  1557 		<strong aria-hidden="true"><?php _e( 'As an app icon' ); ?></strong>
  1561 			<div class="site-icon-preview-browser">
  1558 		<div class="app-icon-preview">
  1562 				<svg role="img" aria-hidden="true" fill="none" xmlns="http://www.w3.org/2000/svg" class="browser-buttons"><path fill-rule="evenodd" clip-rule="evenodd" d="M0 20a6 6 0 1 1 12 0 6 6 0 0 1-12 0Zm18 0a6 6 0 1 1 12 0 6 6 0 0 1-12 0Zm24-6a6 6 0 1 0 0 12 6 6 0 0 0 0-12Z" /></svg>
  1559 			<img id="preview-app-icon" src="{{ data.url }}" alt="<?php esc_attr_e( 'Preview as an app icon' ); ?>" />
  1563 				<div class="site-icon-preview-tab">
       
  1564 					<div class="image-preview-wrap browser">
       
  1565 						<img id="preview-favicon" src="{{ data.url }}" class="browser-icon-preview" alt="<?php esc_attr_e( 'Preview as a browser icon' ); ?>" />
       
  1566 					</div>
       
  1567 					<div class="site-icon-preview-site-title" aria-hidden="true"><# print( '<?php echo esc_js( get_bloginfo( 'name' ) ); ?>' ) #></div>
       
  1568 						<svg role="img" aria-hidden="true" fill="none" xmlns="http://www.w3.org/2000/svg" class="close-button">
       
  1569 							<path d="M12 13.0607L15.7123 16.773L16.773 15.7123L13.0607 12L16.773 8.28772L15.7123 7.22706L12 10.9394L8.28771 7.22705L7.22705 8.28771L10.9394 12L7.22706 15.7123L8.28772 16.773L12 13.0607Z" />
       
  1570 						</svg>
       
  1571 					</div>
       
  1572 				</div>
       
  1573 			</div>
  1560 		</div>
  1574 		</div>
  1561 	</script>
  1575 	</script>
  1562 
  1576 
  1563 	<?php
  1577 	<?php
  1564 
  1578