WordPress.org

Make WordPress Core

Ticket #16434: 16434.22.diff

File 16434.22.diff, 10.3 KB (added by obenland, 3 years ago)
  • src/wp-admin/admin-ajax.php

     
    6262        'send-attachment-to-editor', 'save-attachment-order', 'heartbeat', 'get-revision-diffs',
    6363        'save-user-color-scheme', 'update-widget', 'query-themes', 'parse-embed', 'set-attachment-thumbnail',
    6464        'parse-media-shortcode', 'destroy-sessions', 'install-plugin', 'update-plugin', 'press-this-save-post',
    65         'press-this-add-category', 'crop-image',
     65        'press-this-add-category', 'crop-image', 'set-site-icon',
    6666);
    6767
    6868// Deprecated
  • src/wp-admin/css/site-icon.css

     
    22  28.0 - Site Icon
    33------------------------------------------------------------------------------*/
    44
     5#site-icon[src=""],
     6#site-icon[src=""] ~ p .remove-site-icon {
     7        display: none;
     8}
     9
    510.site-icon-image {
    611        float: left;
    712        margin: 0 20px 0 0;
  • src/wp-admin/includes/ajax-actions.php

     
    30883088                        $attachment_id = $wp_site_icon->insert_attachment( $object, $cropped );
    30893089                        remove_filter( 'intermediate_image_sizes_advanced', array( $wp_site_icon, 'additional_sizes' ) );
    30903090
    3091                         // Additional sizes in wp_prepare_attachment_for_js().
    3092                         add_filter( 'image_size_names_choose', array( $wp_site_icon, 'additional_sizes' ) );
     3091                        if ( isset( $_POST['customize'] ) && 'on' == $_POST['customize'] ) {
     3092                                // Additional sizes in wp_prepare_attachment_for_js().
     3093                                add_filter( 'image_size_names_choose', array( $wp_site_icon, 'additional_sizes' ) );
     3094                        } else {
     3095                                update_option( 'site_icon', $attachment_id );
     3096                        }
    30933097                        break;
    30943098
    30953099                default:
     
    31523156
    31533157        wp_send_json_success( wp_prepare_attachment_for_js( $attachment_id ) );
    31543158}
     3159
     3160
     3161/**
     3162 * AJAX handler for saving a Site Icon.
     3163 *
     3164 * @since 4.3.0
     3165 */
     3166function wp_ajax_set_site_icon() {
     3167        $attachment_id = absint( $_POST['id'] );
     3168
     3169        check_ajax_referer( 'image_editor-' . $attachment_id, 'nonce' );
     3170        if ( ! current_user_can( 'manage_options' ) ) {
     3171                wp_send_json_error();
     3172        }
     3173
     3174        if ( update_option( 'site_icon', $attachment_id ) ) {
     3175                wp_send_json_success();
     3176        } else {
     3177                wp_send_json_error();
     3178        }
     3179}
  • src/wp-admin/js/site-icon.js

     
    11(function($) {
    2         var frame;
     2        var frame, siteIcon;
    33
    44        $( function() {
    55                // Build the choose from library frame.
     
    77                        var $el = $(this);
    88                        event.preventDefault();
    99
    10                         // If the media frame already exists, reopen it.
    11                         if ( frame ) {
    12                                 frame.open();
    13                                 return;
    14                         }
    15 
    1610                        // Create the media frame.
    1711                        frame = wp.media({
    1812                                // Customize the submit button.
    1913                                button: {
    2014                                        // Set the text of the button.
    21                                         text: $el.data('update'),
    22                                         // Tell the button not to close the modal, since we're
    23                                         // going to refresh the page when the image is selected.
     15                                        text: $el.data( 'update' ),
     16
     17                                        // Don't close the modal, we're going to refresh the page when the image is selected.
    2418                                        close: false
    2519                                },
    2620                                states: [
     21                                        new wp.media.controller.SiteIconCropper({
     22                                                imgSelectOptions: siteIcon.calculateImageSelectOptions
     23                                        }),
    2724                                        new wp.media.controller.Library({
    2825                                                title: $el.data( 'choose' ),
    2926                                                library: wp.media.query({ type: 'image' }),
     
    3633
    3734                        // When an image is selected, run a callback.
    3835                        frame.on( 'select', function() {
    39                                 // Grab the selected attachment.
    40                                 var attachment = frame.state().get('selection').first(),
    41                                         link = $el.data('updateLink');
     36                                var attachment = frame.state().get( 'selection' ).first().toJSON(),
     37                                        min_size   = $( '#choose-from-library-link' ).data( 'size' );
    4238
    43                                 // Tell the browser to navigate to the crop step.
    44                                 window.location = link + '&file=' + attachment.id;
     39                                if ( min_size === attachment.width && min_size === attachment.height ) {
     40                                        siteIcon.setImageFromAttachment( attachment );
     41                                        siteIcon.setSiteIcon( attachment );
     42                                } else {
     43                                        frame.setState( 'cropper' );
     44                                }
     45                        });
     46
     47                        /**
     48                         * After the image has been cropped, apply the cropped image data to the setting.
     49                         *
     50                         * @param {object} croppedImage Cropped attachment data.
     51                         */
     52                        frame.on( 'cropped', function( croppedImage ) {
     53                                siteIcon.setImageFromAttachment( croppedImage );
    4554                        });
    4655
    4756                        frame.open();
    4857                });
    4958        });
    50 }(jQuery));
     59
     60        siteIcon = {
     61                setImageFromAttachment: function( attachment ) {
     62                        $( '#site-icon').attr( 'src', attachment.sizes.thumbnail.url );
     63
     64                        if ( frame ) {
     65                                frame.close();
     66                        }
     67                },
     68
     69                setSiteIcon: function( attachment ) {console.log(attachment);
     70                        return wp.ajax.post( 'set-site-icon', {
     71                                nonce: attachment.nonces.edit,
     72                                id: attachment.id
     73                        } );
     74                },
     75
     76                /**
     77                 * Returns a set of options, computed from the attached image data and
     78                 * control-specific data, to be fed to the imgAreaSelect plugin in
     79                 * wp.media.view.Cropper.
     80                 *
     81                 * @param {wp.media.model.Attachment} attachment
     82                 * @param {wp.media.controller.Cropper} controller
     83                 * @returns {Object} Options
     84                 */
     85                calculateImageSelectOptions: function( attachment, controller ) {
     86                        var $el        = $( '#choose-from-library-link' ),
     87                                realWidth  = attachment.get( 'width' ),
     88                                realHeight = attachment.get( 'height' ),
     89                                xInit = parseInt( $el.data( 'size' ), 10),
     90                                yInit = parseInt( $el.data( 'size' ), 10),
     91                                ratio = xInit / yInit;
     92
     93                        controller.set( 'canSkipCrop', ( xInit === realWidth && yInit === realHeight ) || ( realWidth < xInit ) );
     94
     95                        if (realWidth / realHeight > ratio) {
     96                                yInit = realHeight;
     97                                xInit = yInit * ratio;
     98                        } else {
     99                                xInit = realWidth;
     100                                yInit = xInit / ratio;
     101                        }
     102
     103                        return {
     104                                handles: true,
     105                                keys: true,
     106                                instance: true,
     107                                persistent: true,
     108                                imageWidth: realWidth,
     109                                imageHeight: realHeight,
     110                                aspectRatio: xInit + ':' + yInit,
     111                                maxHeight: yInit,
     112                                maxWidth: xInit,
     113                                x1: 0,
     114                                y1: 0,
     115                                x2: xInit,
     116                                y2: yInit
     117                        };
     118                }
     119        };
     120
     121        /**
     122         * Use a custom ajax action for the site icon cropper.
     123         */
     124        wp.media.controller.SiteIconCropper = wp.media.controller.Cropper.extend( {
     125                doCrop: function( attachment ) {
     126                        var cropDetails = attachment.get( 'cropDetails' ),
     127                                $el = $( '#choose-from-library-link' );
     128
     129                        cropDetails.dst_width  = $el.data( 'size' );
     130                        cropDetails.dst_height = $el.data( 'size' );
     131
     132                        return wp.ajax.post( 'crop-image', {
     133                                nonce: attachment.get( 'nonces' ).edit,
     134                                id: attachment.get( 'id' ),
     135                                context: 'site-icon',
     136                                cropDetails: cropDetails
     137                        } );
     138                }
     139        } );
     140}(jQuery));
     141 No newline at end of file
  • src/wp-admin/options-general.php

     
    128128<th scope="row"><?php _e( 'Site Icon' ); ?></th>
    129129<td>
    130130        <?php
    131         $upload_url = admin_url( 'options-general.php?page=site-icon' );
    132         $update_url = esc_url( add_query_arg( array(
    133                 'page'   => 'site-icon',
    134                 'action' => 'crop_site_icon',
    135         ), wp_nonce_url( admin_url( 'options-general.php' ), 'crop-site-icon' ) ) );
    136 
    137         wp_enqueue_media();
    138         wp_enqueue_script( 'site-icon' );
    139 
    140         if ( has_site_icon() ) :
     131                $upload_url = admin_url( 'options-general.php?page=site-icon' );
    141132                $remove_url = add_query_arg( array(
    142133                        'action' => 'remove_site_icon',
    143134                ), wp_nonce_url( admin_url( 'options-general.php' ), 'remove-site-icon' ) );
     135
     136                wp_enqueue_media();
     137                wp_enqueue_script( 'site-icon' );
    144138        ?>
    145139
    146         <img class="avatar avatar-150" src="<?php site_icon_url( null, 150 ); ?>" height="150" width="150" alt="" />
     140        <img id="site-icon" class="avatar avatar-150" src="<?php site_icon_url( null, 150 ); ?>" height="150" width="150" alt="" />
    147141        <p class="hide-if-no-js">
    148                 <button type="button" id="choose-from-library-link" class="button" data-size="<?php echo absint( $GLOBALS['wp_site_icon']->min_size ); ?>" data-update-link="<?php echo esc_attr( $update_url ); ?>" data-choose="<?php esc_attr_e( 'Choose a Site Icon' ); ?>" data-update="<?php esc_attr_e( 'Set as Site Icon' ); ?>"><?php _e( 'Update Site Icon' ); ?></button>
    149                 <a href="<?php echo esc_url( $remove_url ); ?>"><?php _e( 'Remove Site Icon' ); ?></a>
     142                <button type="button" id="choose-from-library-link" class="button" data-size="<?php echo absint( $GLOBALS['wp_site_icon']->get_min_size() ); ?>" data-choose="<?php esc_attr_e( 'Choose a Site Icon' ); ?>" data-update="<?php esc_attr_e( 'Set as Site Icon' ); ?>" aria-label="<?php esc_attr_e( 'Choose an image from your media library' ); ?>" aria-describedby="site-icon-description"><?php _e( 'Choose Image' ); ?></button>
     143                <a class="remove-site-icon" href="<?php echo esc_url( $remove_url ); ?>"><?php _e( 'Remove Site Icon' ); ?></a>
    150144        </p>
    151145        <p class="hide-if-js">
    152                 <a href="<?php echo esc_url( $upload_url ); ?>" class="button"><?php _e( 'Update Site Icon' ); ?></a>
    153                 <a href="<?php echo esc_url( $remove_url ); ?>"><?php _e( 'Remove Site Icon' ); ?></a>
    154         </p>
    155 
    156         <?php else : ?>
    157 
    158         <p class="hide-if-no-js">
    159                 <button type="button" id="choose-from-library-link" class="button" data-size="<?php echo absint( $GLOBALS['wp_site_icon']->min_size ); ?>" data-update-link="<?php echo esc_attr( $update_url ); ?>" data-choose="<?php esc_attr_e( 'Choose a Site Icon' ); ?>" data-update="<?php esc_attr_e( 'Set as Site Icon' ); ?>" aria-label="<?php esc_attr_e( 'Choose an image from your media library' ); ?>" aria-describedby="site-icon-description"><?php _e( 'Choose Image' ); ?></button>
     146                <a class="button" href="<?php echo esc_url( $upload_url ); ?>"><?php _e( 'Choose Image' ); ?></a>
     147                <a class="remove-site-icon" href="<?php echo esc_url( $remove_url ); ?>"><?php _e( 'Remove Site Icon' ); ?></a>
    160148        </p>
    161         <a class="button hide-if-js" href="<?php echo esc_url( $upload_url ); ?>"><?php _e( 'Add a Site Icon' ); ?></a>
    162 
    163         <?php endif; ?>
    164149        <p id="site-icon-description" class="description"><?php _e( 'The Site Icon is used as a browser and app icon for your site.' ); ?></p>
    165150</td>
    166151</tr>