WordPress.org
Get WordPress

Make WordPress Core


Ignore:
Timestamp:
08/15/2014 04:09:58 AM (10 years ago)
Author:
helen
Message:

Small screen responsive for attachment details modal. see #28844.

File:
1 edited

Legend:

Unmodified
Added
Removed

  • trunk/src/wp-includes/media-template.php

    r29491 r29496  
    273273
    274274    <script type="text/html" id="tmpl-attachment-details-two-column">
    275         <div class="attachment-media-view">
     275        <div class="attachment-media-view {{ data.orientation }}">
    276276            <div class="thumbnail thumbnail-{{ data.type }}">
    277277                <# if ( data.uploading ) { #>
    … …  
    314314                        <a class="button edit-attachment" href="#"><?php _e( 'Edit Image' ); ?></a>
    315315                    <# } #>
    316 
    317                     <# if ( ! data.uploading && data.can.remove ) { #>
     316                </div>
     317            </div>
     318        </div>
     319        <div class="attachment-info">
     320            <span class="settings-save-status">
     321                <span class="spinner"></span>
     322                <span class="saved"><?php esc_html_e('Saved.'); ?></span>
     323            </span>
     324            <div class="details">
     325                <div class="filename"><strong><?php _e( 'File name:' ); ?></strong> {{ data.filename }}</div>
     326                <div class="filename"><strong><?php _e( 'File type:' ); ?></strong> {{ data.mime }}</div>
     327                <div class="uploaded"><strong><?php _e( 'Uploaded on:' ); ?></strong> {{ data.dateFormatted }}</div>
     328
     329                <div class="file-size"><strong><?php _e( 'File size:' ); ?></strong> {{ data.filesizeHumanReadable }}</div>
     330                <# if ( 'image' === data.type && ! data.uploading ) { #>
     331                    <# if ( data.width && data.height ) { #>
     332                        <div class="dimensions"><strong><?php _e( 'Dimensions:' ); ?></strong> {{ data.width }} &times; {{ data.height }}</div>
     333                    <# } #>
     334                <# } #>
     335
     336                <# if ( data.fileLength ) { #>
     337                    <div class="file-length"><strong><?php _e( 'Length:' ); ?></strong> {{ data.fileLength }}</div>
     338                <# } #>
     339
     340                <# if ( 'audio' === data.type && data.meta.bitrate ) { #>
     341                    <div class="bitrate">
     342                        <strong><?php _e( 'Bitrate:' ); ?></strong> {{ Math.round( data.meta.bitrate / 1000 ) }}kb/s
     343                        <# if ( data.meta.bitrate_mode ) { #>
     344                        {{ ' ' + data.meta.bitrate_mode.toUpperCase() }}
     345                        <# } #>
     346                    </div>
     347                <# } #>
     348
     349                <div class="compat-meta">
     350                    <# if ( data.compat && data.compat.meta ) { #>
     351                        {{{ data.compat.meta }}}
     352                    <# } #>
     353                </div>
     354            </div>
     355
     356            <div class="settings">
     357                <label class="setting" data-setting="url">
     358                    <span class="name"><?php _e('URL'); ?></span>
     359                    <input type="text" value="{{ data.url }}" readonly />
     360                </label>
     361                <# var maybeReadOnly = data.can.save || data.allowLocalEdits ? '' : 'readonly'; #>
     362                <label class="setting" data-setting="title">
     363                    <span class="name"><?php _e('Title'); ?></span>
     364                    <input type="text" value="{{ data.title }}" {{ maybeReadOnly }} />
     365                </label>
     366                <# if ( 'audio' === data.type ) { #>
     367                <?php foreach ( array(
     368                    'artist' => __( 'Artist' ),
     369                    'album' => __( 'Album' ),
     370                ) as $key => $label ) : ?>
     371                <label class="setting" data-setting="<?php echo esc_attr( $key ) ?>">
     372                    <span class="name"><?php echo $label ?></span>
     373                    <input type="text" value="{{ data.<?php echo $key ?> || data.meta.<?php echo $key ?> || '' }}" />
     374                </label>
     375                <?php endforeach; ?>
     376                <# } #>
     377                <label class="setting" data-setting="caption">
     378                    <span class="name"><?php _e( 'Caption' ); ?></span>
     379                    <textarea {{ maybeReadOnly }}>{{ data.caption }}</textarea>
     380                </label>
     381                <# if ( 'image' === data.type ) { #>
     382                    <label class="setting" data-setting="alt">
     383                        <span class="name"><?php _e( 'Alt Text' ); ?></span>
     384                        <input type="text" value="{{ data.alt }}" {{ maybeReadOnly }} />
     385                    </label>
     386                <# } #>
     387                <label class="setting" data-setting="description">
     388                    <span class="name"><?php _e('Description'); ?></span>
     389                    <textarea {{ maybeReadOnly }}>{{ data.description }}</textarea>
     390                </label>
     391                <label class="setting">
     392                    <span class="name"><?php _e( 'Uploaded By' ); ?></span>
     393                    <span class="value">{{ data.authorName }}</span>
     394                </label>
     395                <# if ( data.uploadedTo ) { #>
     396                    <label class="setting">
     397                        <span class="name"><?php _e( 'Uploaded To' ); ?></span>
     398                        <span class="value"><a href="{{ data.uploadedToLink }}">{{ data.uploadedToTitle }}</a></span>
     399                    </label>
     400                <# } #>
     401                <div class="attachment-compat"></div>
     402            </div>
     403
     404            <div class="actions">
     405                <a class="view-attachment" href="{{ data.link }}"><?php _e( 'View attachment page' ); ?></a> |
     406                <a href="post.php?post={{ data.id }}&action=edit"><?php _e( 'Edit more details' ); ?></a>
     407                <# if ( ! data.uploading && data.can.remove ) { #> |
    318408                        <?php if ( MEDIA_TRASH ): ?>
    319409                        <# if ( 'trash' === data.status ) { #>
    … …  
    326416                        <?php endif; ?>
    327417                    <# } #>
    328                 </div>
    329             </div>
    330         </div>
    331         <div class="attachment-info">
    332             <span class="settings-save-status">
    333                 <span class="spinner"></span>
    334                 <span class="saved"><?php esc_html_e('Saved.'); ?></span>
    335             </span>
    336             <div class="details">
    337                 <div class="filename"><strong><?php _e( 'File name:' ); ?></strong> {{ data.filename }}</div>
    338                 <div class="filename"><strong><?php _e( 'File type:' ); ?></strong> {{ data.mime }}</div>
    339                 <div class="uploaded"><strong><?php _e( 'Uploaded on:' ); ?></strong> {{ data.dateFormatted }}</div>
    340 
    341                 <div class="file-size"><strong><?php _e( 'File size:' ); ?></strong> {{ data.filesizeHumanReadable }}</div>
    342                 <# if ( 'image' === data.type && ! data.uploading ) { #>
    343                     <# if ( data.width && data.height ) { #>
    344                         <div class="dimensions"><strong><?php _e( 'Dimensions:' ); ?></strong> {{ data.width }} &times; {{ data.height }}</div>
    345                     <# } #>
    346                 <# } #>
    347 
    348                 <# if ( data.fileLength ) { #>
    349                     <div class="file-length"><strong><?php _e( 'Length:' ); ?></strong> {{ data.fileLength }}</div>
    350                 <# } #>
    351 
    352                 <# if ( 'audio' === data.type && data.meta.bitrate ) { #>
    353                     <div class="bitrate">
    354                         <strong><?php _e( 'Bitrate:' ); ?></strong> {{ Math.round( data.meta.bitrate / 1000 ) }}kb/s
    355                         <# if ( data.meta.bitrate_mode ) { #>
    356                         {{ ' ' + data.meta.bitrate_mode.toUpperCase() }}
    357                         <# } #>
    358                     </div>
    359                 <# } #>
    360 
    361                 <div class="compat-meta">
    362                     <# if ( data.compat && data.compat.meta ) { #>
    363                         {{{ data.compat.meta }}}
    364                     <# } #>
    365                 </div>
    366             </div>
    367 
    368             <div class="settings">
    369                 <label class="setting" data-setting="url">
    370                     <span class="name"><?php _e('URL'); ?></span>
    371                     <input type="text" value="{{ data.url }}" readonly />
    372                 </label>
    373                 <# var maybeReadOnly = data.can.save || data.allowLocalEdits ? '' : 'readonly'; #>
    374                 <label class="setting" data-setting="title">
    375                     <span class="name"><?php _e('Title'); ?></span>
    376                     <input type="text" value="{{ data.title }}" {{ maybeReadOnly }} />
    377                 </label>
    378                 <# if ( 'audio' === data.type ) { #>
    379                 <?php foreach ( array(
    380                     'artist' => __( 'Artist' ),
    381                     'album' => __( 'Album' ),
    382                 ) as $key => $label ) : ?>
    383                 <label class="setting" data-setting="<?php echo esc_attr( $key ) ?>">
    384                     <span class="name"><?php echo $label ?></span>
    385                     <input type="text" value="{{ data.<?php echo $key ?> || data.meta.<?php echo $key ?> || '' }}" />
    386                 </label>
    387                 <?php endforeach; ?>
    388                 <# } #>
    389                 <label class="setting" data-setting="caption">
    390                     <span class="name"><?php _e( 'Caption' ); ?></span>
    391                     <textarea {{ maybeReadOnly }}>{{ data.caption }}</textarea>
    392                 </label>
    393                 <# if ( 'image' === data.type ) { #>
    394                     <label class="setting" data-setting="alt">
    395                         <span class="name"><?php _e( 'Alt Text' ); ?></span>
    396                         <input type="text" value="{{ data.alt }}" {{ maybeReadOnly }} />
    397                     </label>
    398                 <# } #>
    399                 <label class="setting" data-setting="description">
    400                     <span class="name"><?php _e('Description'); ?></span>
    401                     <textarea {{ maybeReadOnly }}>{{ data.description }}</textarea>
    402                 </label>
    403                 <label class="setting">
    404                     <span class="name"><?php _e( 'Uploaded By' ); ?></span>
    405                     <span class="value">{{ data.authorName }}</span>
    406                 </label>
    407                 <# if ( data.uploadedTo ) { #>
    408                     <label class="setting">
    409                         <span class="name"><?php _e( 'Uploaded To' ); ?></span>
    410                         <span class="value"><a href="{{ data.uploadedToLink }}">{{ data.uploadedToTitle }}</a></span>
    411                     </label>
    412                 <# } #>
    413                 <div class="attachment-compat"></div>
    414             </div>
    415 
    416             <a class="view-attachment" href="{{ data.link }}"><?php _e( 'View attachment page' ); ?></a> |
    417             <a href="post.php?post={{ data.id }}&action=edit"><?php _e( 'Edit more details' ); ?></a>
     418            </div>
    418419
    419420        </div>
Note: See TracChangeset for help on using the changeset viewer.