WordPress.org

Make WordPress Core

Changeset 23095


Ignore:
Timestamp:
12/06/12 05:52:19 (17 months ago)
Author:
markjaquith
Message:

Add the ability to click "Edit" and kick out to the advanced image editor from within the Media modal. New window, with "Refresh" offered on your return. fixes #22743. props koopersmith, nacin, helenyhou.

Location:
trunk
Files:
6 edited

Legend:

Unmodified
Added
Removed
  • trunk/wp-admin/css/wp-admin.css

    r23083 r23095  
    41514151} 
    41524152 
     4153.post-php .imgedit-wrap table { 
     4154    width: 100%; 
     4155} 
     4156 
    41534157.describe .imgedit-wrap table td, 
    41544158.wp_attachment_holder .imgedit-wrap table td { 
     
    41574161} 
    41584162 
    4159 .imgedit-wrap p, 
    4160 .describe .imgedit-wrap table td { 
    4161     font-size: 11px; 
    4162     line-height: 18px; 
    4163 } 
    4164  
    41654163.describe .imgedit-wrap table td.imgedit-settings { 
    41664164    padding: 0 5px; 
    41674165} 
    41684166 
     4167.wp_attachment_holder .imgedit-wrap table td.imgedit-settings { 
     4168    width: 250px; 
     4169} 
     4170 
    41694171td.imgedit-settings input { 
     4172    margin-top: 0; 
    41704173    vertical-align: middle; 
    41714174} 
     
    43504353} 
    43514354 
    4352 .imgedit-help ul li { 
    4353     font-size: 11px; 
    4354 } 
    4355  
    43564355a.imgedit-help-toggle { 
    43574356    text-decoration: none; 
    4358 } 
    4359  
    4360 #wpbody-content .imgedit-response div { 
    4361     width: 600px; 
    4362     margin: 8px; 
    43634357} 
    43644358 
     
    43904384    border-width: 1px; 
    43914385    border-style: solid; 
    4392     -webkit-border-radius: 8px; 
    4393     border-radius: 8px; 
     4386    -webkit-border-radius: 3px; 
     4387    border-radius: 3px; 
    43944388    margin-bottom: 8px; 
    43954389    padding: 2px 10px; 
  • trunk/wp-admin/includes/image-edit.php

    r22863 r23095  
    192192    </tbody></table> 
    193193    <div class="imgedit-wait" id="imgedit-wait-<?php echo $post_id; ?>"></div> 
    194     <script type="text/javascript">imageEdit.init(<?php echo $post_id; ?>);</script> 
     194    <script type="text/javascript">jQuery( function() { imageEdit.init(<?php echo $post_id; ?>); });</script> 
    195195    <div class="hidden" id="imgedit-leaving-<?php echo $post_id; ?>"><?php _e("There are unsaved changes that will be lost. 'OK' to continue, 'Cancel' to return to the Image Editor."); ?></div> 
    196196    </div> 
  • trunk/wp-admin/includes/media.php

    r23086 r23095  
    22712271    $post = get_post(); 
    22722272 
     2273    $open = isset( $_GET['image-editor'] ); 
     2274    if ( $open ) 
     2275        require_once ABSPATH . 'wp-admin/includes/image-edit.php'; 
     2276 
    22732277    $thumb_url = false; 
    22742278    if ( $attachment_id = intval( $post->ID ) ) 
    2275         $thumb_url = wp_get_attachment_image_src( $attachment_id, array( 900, 600 ), true ); 
     2279        $thumb_url = wp_get_attachment_image_src( $attachment_id, array( 900, 450 ), true ); 
    22762280 
    22772281    $filename = esc_html( basename( $post->guid ) ); 
    22782282    $title = esc_attr( $post->post_title ); 
    22792283    $alt_text = get_post_meta( $post->ID, '_wp_attachment_image_alt', true ); 
    2280  
    2281     $media_dims = ''; 
    2282     $meta = wp_get_attachment_metadata( $post->ID ); 
    2283     if ( is_array( $meta ) && array_key_exists( 'width', $meta ) && array_key_exists( 'height', $meta ) ) 
    2284         $media_dims .= "<span id='media-dims-$post->ID'>{$meta['width']}&nbsp;&times;&nbsp;{$meta['height']}</span> "; 
    2285     $media_dims = apply_filters( 'media_meta', $media_dims, $post ); 
    22862284 
    22872285    $att_url = wp_get_attachment_url( $post->ID ); 
     
    22972295        <div class="imgedit-response" id="imgedit-response-<?php echo $attachment_id; ?>"></div> 
    22982296 
    2299         <div class="wp_attachment_image" id="media-head-<?php echo $attachment_id; ?>"> 
     2297        <div<?php if ( $open ) echo ' style="display:none"'; ?> class="wp_attachment_image" id="media-head-<?php echo $attachment_id; ?>"> 
    23002298            <p id="thumbnail-head-<?php echo $attachment_id; ?>"><img class="thumbnail" src="<?php echo set_url_scheme( $thumb_url[0] ); ?>" style="max-width:100%" alt="" /></p> 
    23012299            <p><?php echo $image_edit_button; ?></p> 
    23022300        </div> 
    2303         <div style="display:none" class="image-editor" id="image-editor-<?php echo $attachment_id; ?>"></div> 
     2301        <div<?php if ( ! $open ) echo ' style="display:none"'; ?> class="image-editor" id="image-editor-<?php echo $attachment_id; ?>"> 
     2302            <?php if ( $open ) wp_image_editor( $attachment_id ); ?> 
     2303        </div> 
    23042304    </div> 
    23052305    <?php endif; ?> 
  • trunk/wp-includes/css/media-views.css

    r23077 r23095  
    13091309    max-width: 120px; 
    13101310    max-height: 120px; 
     1311    margin-top: 5px; 
    13111312    margin-right: 10px; 
    13121313    margin-bottom: 5px; 
     
    13481349} 
    13491350 
    1350 .attachment-info .delete-attachment a { 
    1351     color: red; 
    1352     padding: 2px 4px; 
    1353     margin: -2px -4px; 
     1351.attachment-info .edit-attachment, 
     1352.attachment-info .refresh-attachment, 
     1353.attachment-info .delete-attachment { 
     1354    display: block; 
    13541355    text-decoration: none; 
    13551356    white-space: nowrap; 
    13561357} 
    13571358 
    1358 .attachment-info .delete-attachment a:hover { 
    1359     color: #fff; 
    1360     background: red; 
     1359.attachment-info .refresh-attachment, 
     1360.attachment-details.needs-refresh .attachment-info .edit-attachment { 
     1361    display: none; 
     1362} 
     1363 
     1364.attachment-details.needs-refresh .attachment-info .refresh-attachment, 
     1365.attachment-info .edit-attachment { 
     1366    display: block; 
     1367} 
     1368 
     1369.attachment-info .delete-attachment { 
     1370    color: #bc0b0b; 
     1371} 
     1372 
     1373.attachment-info .delete-attachment:hover { 
     1374    color: red; 
    13611375} 
    13621376 
  • trunk/wp-includes/js/media-views.js

    r23089 r23095  
    40224022            'change [data-setting] select':   'updateSetting', 
    40234023            'change [data-setting] textarea': 'updateSetting', 
    4024             'click .delete-attachment':       'deleteAttachment' 
     4024            'click .delete-attachment':       'deleteAttachment', 
     4025            'click .edit-attachment':         'editAttachment', 
     4026            'click .refresh-attachment':      'refreshAttachment' 
    40254027        }, 
    40264028 
     
    40394041        }, 
    40404042 
    4041         deleteAttachment: function(event) { 
     4043        deleteAttachment: function( event ) { 
    40424044            event.preventDefault(); 
    40434045 
    40444046            if ( confirm( l10n.warnDelete ) ) 
    40454047                this.model.destroy(); 
     4048        }, 
     4049 
     4050        editAttachment: function( event ) { 
     4051            this.$el.addClass('needs-refresh'); 
     4052        }, 
     4053 
     4054        refreshAttachment: function( event ) { 
     4055            this.$el.removeClass('needs-refresh'); 
     4056            event.preventDefault(); 
     4057            this.model.fetch(); 
    40464058        } 
    40474059    }); 
  • trunk/wp-includes/media.php

    r23087 r23095  
    13381338            'delete' => false, 
    13391339        ), 
     1340        'editLink'   => false, 
    13401341    ); 
    13411342 
    1342     if ( current_user_can( 'edit_post', $attachment->ID ) ) 
     1343    if ( current_user_can( 'edit_post', $attachment->ID ) ) { 
    13431344        $response['nonces']['update'] = wp_create_nonce( 'update-post_' . $attachment->ID ); 
     1345        $response['editLink'] = get_edit_post_link( $attachment->ID, 'raw' ); 
     1346    } 
    13441347 
    13451348    if ( current_user_can( 'delete_post', $attachment->ID ) ) 
     
    17041707                <div class="filename">{{ data.filename }}</div> 
    17051708                <div class="uploaded">{{ data.dateFormatted }}</div> 
    1706                 <# if ( 'image' === data.type && ! data.uploading && data.width && data.height ) { #> 
    1707                     <div class="dimensions">{{ data.width }} &times; {{ data.height }}</div> 
     1709 
     1710                <# if ( 'image' === data.type && ! data.uploading ) { #> 
     1711                    <# if ( data.width && data.height ) { #> 
     1712                        <div class="dimensions">{{ data.width }} &times; {{ data.height }}</div> 
     1713                    <# } #> 
     1714 
     1715                    <# if ( data.can.save ) { #> 
     1716                        <a class="edit-attachment" href="{{ data.editLink }}&amp;image-editor" target="_blank"><?php _e( 'Edit Image' ); ?></a> 
     1717                        <a class="refresh-attachment" href="#"><?php _e( 'Refresh' ); ?></a> 
     1718                    <# } #> 
    17081719                <# } #> 
     1720 
    17091721                <# if ( ! data.uploading && data.can.remove ) { #> 
    1710                     <div class="delete-attachment"> 
    1711                         <a href="#"><?php _e( 'Delete Permanently' ); ?></a> 
    1712                     </div> 
     1722                    <a class="delete-attachment" href="#"><?php _e( 'Delete Permanently' ); ?></a> 
    17131723                <# } #> 
     1724 
    17141725                <div class="compat-meta"> 
    17151726                    <# if ( data.compat && data.compat.meta ) { #> 
Note: See TracChangeset for help on using the changeset viewer.