Make WordPress Core

Ticket #16434: 16434.6.diff

File 16434.6.diff, 36.6 KB (added by tyxla, 9 years ago)

Updatign last patch to include minor no-js improvements

  • src/wp-admin/css/site-icon.css

     
     1/*------------------------------------------------------------------------------
     2  28.0 - Site Icon
     3------------------------------------------------------------------------------*/
     4
     5.site-icon-image {
     6        float: left;
     7        margin: 0 20px 0 0;
     8}
     9.site-icon-content {
     10        overflow: hidden;
     11        padding: 10px;
     12        position: relative;
     13}
     14.site-icon-crop-shell {
     15        max-width: 720px;
     16}
     17.site-icon-crop-preview-shell {
     18        float: right;
     19        overflow: hidden;
     20        width: 172px;
     21}
     22.site-icon-crop-preview-shell h3 {
     23        margin-top: 0;
     24}
     25.site-icon-crop-favicon-preview-shell {
     26        margin-bottom: 20px;
     27        position: relative;
     28}
     29.site-icon-crop-preview-favicon {
     30        height: 16px;
     31        left: 102px;
     32        overflow: hidden;
     33        position: absolute;
     34        top: 23px;
     35        width: 16px;
     36}
     37.site-icon-browser-title {
     38        height: 16px;
     39        left: 128px;
     40        overflow: hidden;
     41        position: absolute;
     42        top: 23px;
     43        width: 100px;
     44}
     45.site-icon-crop-preview-homeicon {
     46        border-radius: 16px;
     47        height: 64px;
     48        overflow: hidden;
     49        width: 64px;
     50}
  • src/wp-admin/css/wp-admin.css

     
    1111@import url(nav-menus.css);
    1212@import url(widgets.css);
    1313@import url(l10n.css);
     14@import url(site-icon.css);
  • src/wp-admin/images/browser.png

    Cannot display: file marked as a binary type.
    svn:mime-type = application/octet-stream
  • src/wp-admin/includes/admin.php

    Property changes on: src/wp-admin/images/browser.png
    ___________________________________________________________________
    Added: svn:mime-type
    ## -0,0 +1 ##
    +application/octet-stream
    \ No newline at end of property
     
    6464/** WordPress User Administration API */
    6565require_once(ABSPATH . 'wp-admin/includes/user.php');
    6666
     67/** WordPress Site Icon API */
     68require_once(ABSPATH . 'wp-admin/includes/site-icon.php');
     69
    6770/** WordPress Update Administration API */
    6871require_once(ABSPATH . 'wp-admin/includes/update.php');
    6972
  • src/wp-admin/includes/site-icon.php

     
     1<?php
     2
     3/**
     4 * Class WP_Site_Icon.
     5 *
     6 * @since 4.3.0
     7 */
     8class WP_Site_Icon {
     9
     10        /**
     11         * The minimum size of the site icon.
     12         *
     13         * @since 4.3.0
     14         *
     15         * @var int
     16         */
     17        public $min_size  = 512;
     18
     19        /**
     20         * The size to which to crop the image so that we can display it in the UI nicely.
     21         *
     22         * @since 4.3.0
     23         *
     24         * @var int
     25         */
     26        public $page_crop = 512;
     27
     28        /**
     29         *
     30         * @since 4.3.0
     31         *
     32         * @var array
     33         */
     34        public $site_icon_sizes = array(
     35                /**
     36                 * Square, medium sized tiles for IE11+.
     37                 *
     38                 * @link https://msdn.microsoft.com/library/dn455106(v=vs.85).aspx
     39                 */
     40                270,
     41
     42                /**
     43                 * App icons up to iPhone 6 Plus.
     44                 *
     45                 * @link https://developer.apple.com/library/prerelease/ios/documentation/UserExperience/Conceptual/MobileHIG/IconMatrix.html
     46                 */
     47                180,
     48
     49                // Our regular Favicon.
     50                32,
     51        );
     52
     53        /**
     54         * Register our actions and filters.
     55         *
     56         * @since 4.3.0
     57         */
     58        public function __construct() {
     59
     60                // Add the favicon to the backend.
     61                add_action( 'admin_head', 'wp_site_icon' );
     62
     63                add_action( 'admin_menu', array( $this, 'admin_menu_upload_site_icon' ) );
     64
     65                add_action( 'admin_action_set_site_icon',    array( $this, 'set_site_icon'    ) );
     66                add_action( 'admin_action_remove_site_icon', array( $this, 'remove_site_icon' ) );
     67
     68                add_action( 'delete_attachment', array( $this, 'delete_attachment_data' ), 10, 1 );
     69                add_filter( 'get_post_metadata', array( $this, 'get_post_metadata' ), 10, 4 );
     70        }
     71
     72        /**
     73         * Add a hidden upload page.
     74         *
     75         * There is no need to access it directly.
     76         *
     77         * @since 4.3.0
     78         */
     79        public function admin_menu_upload_site_icon() {
     80                $hook = add_submenu_page( null, __( 'Site Icon' ), __( 'Site Icon' ), 'manage_options', 'site-icon', array( $this, 'upload_site_icon_page' ) );
     81
     82                add_action( "load-$hook", array( $this, 'add_upload_settings' ) );
     83                add_action( "admin_print_scripts-$hook", array( $this, 'enqueue_scripts' ) );
     84        }
     85
     86        /**
     87         * Add scripts to admin settings pages.
     88         *
     89         * @since 4.3.0
     90         */
     91        public function enqueue_scripts() {
     92                wp_enqueue_style( 'jcrop' );
     93                wp_enqueue_script( 'site-icon-crop' );
     94        }
     95
     96        /**
     97         * Load on when the admin is initialized.
     98         *
     99         * @since 4.3.0
     100         */
     101        public function add_upload_settings() {
     102                add_settings_section( 'site-icon-upload', false, false, 'site-icon-upload' );
     103                add_settings_field( 'site-icon-upload', __( 'Upload Image' ), array( $this, 'upload_field' ), 'site-icon-upload', 'site-icon-upload', array(
     104                        'label_for' => 'site-icon-upload',
     105                ) );
     106        }
     107
     108        /**
     109         * Removes site icon.
     110         *
     111         * @since 4.3.0
     112         */
     113        public function remove_site_icon() {
     114                check_admin_referer( 'remove-site-icon' );
     115
     116                $this->delete_site_icon();
     117
     118                add_settings_error( 'site-icon', 'icon-removed', __( 'Site Icon removed.' ), 'updated' );
     119        }
     120
     121        /**
     122         * Uploading a site_icon is a 3 step process
     123         *
     124         * 1. Select the file to upload
     125         * 2. Crop the file
     126         * 3. Confirmation
     127         *
     128         * @since 4.3.0
     129         */
     130        public function upload_site_icon_page() {
     131                $action = isset( $_REQUEST['action'] ) ? $_REQUEST['action'] : 'select_site_icon';
     132
     133                switch ( $action ) {
     134                        case 'select_site_icon':
     135                                $this->select_page();
     136                                break;
     137
     138                        case 'crop_site_icon':
     139                                $this->crop_page();
     140                                break;
     141
     142                        default:
     143                                wp_safe_redirect( admin_url( 'options-general.php#site-icon' ) );
     144                                exit;
     145                }
     146        }
     147
     148        /**
     149         * Displays the site_icon form to upload the image.
     150         *
     151         * @since 4.3.0
     152         */
     153        public function select_page() {
     154                ?>
     155                <div class="wrap">
     156                        <h2><?php _e( 'Add Site Icon' ); ?></h2>
     157                        <?php settings_errors( 'site-icon' ); ?>
     158                        <?php do_settings_sections( 'site-icon-upload' ); ?>
     159                </div>
     160        <?php
     161        }
     162
     163        /**
     164         * Settings field for file upload.
     165         *
     166         * @since 4.3.0
     167         */
     168        public function upload_field() {
     169                wp_enqueue_media();
     170                wp_enqueue_script( 'site-icon' );
     171                wp_dequeue_script( 'site-icon-crop' );
     172
     173                $update_url = esc_url( add_query_arg( array(
     174                        'page' => 'site-icon',
     175                        'action' => 'crop_site_icon',
     176                ), wp_nonce_url( admin_url( 'options-general.php' ), 'crop-site-icon' ) ) );
     177                ?>
     178                <p class="hide-if-no-js">
     179                        <label class="screen-reader-text" for="choose-from-library-link"><?php _e( 'Choose an image from your media library:' ); ?></label>
     180                        <button type="button" id="choose-from-library-link" class="button" 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( 'Choose Image' ); ?></button>
     181                </p>
     182                <form class="hide-if-js" action="<?php echo esc_url( admin_url( 'options-general.php?page=site-icon' ) ); ?>" method="post" enctype="multipart/form-data">
     183                        <input name="action" value="crop_site_icon" type="hidden" />
     184                        <input name="site-icon" type="file" />
     185                        <input name="submit" value="<?php esc_attr_e( 'Upload Image' ); ?>" type="submit" class="button button-primary" />
     186                        <p class="description">
     187                                <?php printf( __( 'The image needs to be exactly %spx in both width and height.' ), "<strong>$this->min_size</strong>" ); ?>
     188                        </p>
     189                        <?php wp_nonce_field( 'crop-site-icon' ); ?>
     190                </form>
     191        <?php
     192        }
     193
     194        /**
     195         * Crop a the image admin view.
     196         *
     197         * @since 4.3.0
     198         */
     199        public function crop_page() {
     200                check_admin_referer( 'crop-site-icon' );
     201
     202                if ( isset( $_GET['file'] ) ) {
     203                        $attachment_id = absint( $_GET['file'] );
     204                        $file          = get_attached_file( $attachment_id, true );
     205                        $url           = wp_get_attachment_image_src( $attachment_id, 'full' );
     206                        $url           = $url[0];
     207                } else {
     208                        $upload        = $this->handle_upload();
     209                        $attachment_id = $upload['attachment_id'];
     210                        $file          = $upload['file'];
     211                        $url           = $upload['url'];
     212                }
     213
     214                $image_size = getimagesize( $file );
     215
     216                if ( $image_size[0] < $this->min_size ) {
     217                        add_settings_error( 'site-icon', 'too-small', sprintf( __( 'The selected image is smaller than %upx in width.' ), $this->min_size ) );
     218
     219                        // back to step one
     220                        $this->select_page();
     221
     222                        return;
     223                }
     224
     225                if ( $image_size[1] < $this->min_size ) {
     226                        add_settings_error( 'site-icon', 'too-small', sprintf( __( 'The selected image is smaller than %upx in height.' ), $this->min_size ) );
     227
     228                        // Back to step one.
     229                        $this->select_page();
     230
     231                        return;
     232                }
     233
     234                // Let's resize the image so that the user can easier crop a image that in the admin view.
     235                $crop_height = absint( $this->page_crop * $image_size[1] / $image_size[0] );
     236                $cropped = wp_crop_image( $attachment_id, 0, 0, 0, 0, $this->page_crop, $crop_height );
     237                if ( ! $cropped || is_wp_error( $cropped ) ) {
     238                        wp_die( __( 'Image could not be processed. Please go back and try again.' ), __( 'Image Processing Error' ) );
     239                }
     240                $cropped_size = getimagesize( $cropped );
     241                $crop_ratio   = $image_size[0] / $cropped_size[0];
     242                wp_delete_file( $cropped );
     243
     244                wp_localize_script( 'site-icon-crop', 'wpSiteIconCropData', $this->initial_crop_data( $crop_ratio, $cropped_size ) );
     245                ?>
     246
     247                <div class="wrap">
     248                        <h2 class="site-icon-title"><?php esc_html_e( 'Site Icon' ); ?></h2>
     249                        <?php settings_errors( 'site-icon' ); ?>
     250
     251                        <div class="site-icon-crop-shell">
     252                                <form action="options-general.php" method="post" enctype="multipart/form-data">
     253                                        <p class="hide-if-no-js description"><?php _e('Choose the part of the image you want to use as your site icon.'); ?></p>
     254                                        <p class="hide-if-js description"><strong><?php _e( 'You need Javascript to choose a part of the image.'); ?></strong></p>
     255
     256                                        <div class="site-icon-crop-preview-shell">
     257                                                <h3><?php esc_html_e( 'Preview' ); ?></h3>
     258                                                <strong><?php esc_html_e( 'As your favicon' ); ?></strong>
     259                                                <div class="site-icon-crop-favicon-preview-shell">
     260                                                        <img src="images/browser.png" class="site-icon-browser-preview" width="172" height="79" alt="<?php esc_attr_e( 'Browser Chrome' ); ?>"/>
     261
     262                                                        <div class="site-icon-crop-preview-favicon">
     263                                                                <img src="<?php echo esc_url( $url ); ?>" id="preview-favicon" alt="<?php esc_attr_e( 'Preview Favicon' ); ?>"/>
     264                                                        </div>
     265                                                        <span class="site-icon-browser-title"><?php bloginfo( 'name' ); ?></span>
     266                                                </div>
     267
     268                                                <strong><?php esc_html_e( 'As a mobile icon' ); ?></strong>
     269                                                <div class="site-icon-crop-preview-homeicon">
     270                                                        <img src="<?php echo esc_url( $url ); ?>" id="preview-homeicon" alt="<?php esc_attr_e( 'Preview Home Icon' ); ?>"/>
     271                                                </div>
     272                                        </div>
     273                                        <img src="<?php echo esc_url( $url ); ?>" id="crop-image" class="site-icon-crop-image" width="<?php echo esc_attr( $cropped_size[0] ); ?>" height="<?php echo esc_attr( $cropped_size[1] ); ?>" alt="<?php esc_attr_e( 'Image to be cropped' ); ?>"/>
     274
     275                                        <input type="hidden" id="crop-x" name="crop-x" />
     276                                        <input type="hidden" id="crop-y" name="crop-y" />
     277                                        <input type="hidden" id="crop-width" name="crop-w" />
     278                                        <input type="hidden" id="crop-height" name="crop-h" />
     279
     280                                        <input type="hidden" name="action" value="set_site_icon" />
     281                                        <input type="hidden" name="attachment_id" value="<?php echo esc_attr( $attachment_id ); ?>" />
     282                                        <input type="hidden" name="crop_ratio" value="<?php echo esc_attr( $crop_ratio ); ?>" />
     283                                        <?php if ( empty( $_POST ) && isset( $_GET['file'] ) ) : ?>
     284                                                <input type="hidden" name="create-new-attachment" value="true" />
     285                                        <?php endif; ?>
     286                                        <?php wp_nonce_field( 'set-site-icon' ); ?>
     287
     288                                        <p class="submit">
     289                                                <?php submit_button( __( 'Crop and Publish' ), 'primary hide-if-no-js', 'submit', false ); ?>
     290                                                <?php submit_button( __( 'Publish' ), 'primary hide-if-js', 'submit', false ); ?>
     291                                                <a class="button secondary" href="options-general.php"><?php _e( 'Cancel' ); ?></a>
     292                                        </p>
     293                                </form>
     294                        </div>
     295                </div>
     296        <?php
     297        }
     298
     299        /**
     300         * Saves a new Site Icon.
     301         *
     302         * @since 4.3.0
     303         */
     304        public function set_site_icon() {
     305                check_admin_referer( 'set-site-icon' );
     306
     307                // Delete any existing site icon images.
     308                $this->delete_site_icon();
     309
     310                $attachment_id = absint( $_POST['attachment_id'] );
     311
     312                $crop_ratio = (float) $_POST['crop_ratio'];
     313                $crop_data = $this->convert_coordinates_from_resized_to_full( $_POST['crop-x'], $_POST['crop-y'], $_POST['crop-w'], $_POST['crop-h'], $crop_ratio );
     314
     315                // TODO
     316                if ( empty( $_POST['skip-cropping'] ) ) {
     317                        $cropped = wp_crop_image( $attachment_id, $crop_data['crop_x'], $crop_data['crop_y'], $crop_data['crop_width'], $crop_data['crop_height'], $this->min_size, $this->min_size );
     318                } elseif ( ! empty( $_POST['create-new-attachment'] ) ) {
     319                        $cropped = _copy_image_file( $attachment_id );
     320                } else {
     321                        $cropped = get_attached_file( $attachment_id );
     322                }
     323
     324                if ( ! $cropped || is_wp_error( $cropped ) ) {
     325                        wp_die( __( 'Image could not be processed. Please go back and try again.' ), __( 'Image Processing Error' ) );
     326                }
     327
     328                $object = $this->create_attachment_object( $cropped, $attachment_id );
     329
     330                if ( ! empty( $_POST['create-new-attachment'] ) ) {
     331                        unset( $object['ID'] );
     332                }
     333
     334                // Update the attachment
     335                add_filter( 'intermediate_image_sizes_advanced', array( $this, 'additional_sizes' ) );
     336                $attachment_id = $this->insert_attachment( $object, $cropped );
     337                remove_filter( 'intermediate_image_sizes_advanced', array( $this, 'additional_sizes' ) );
     338
     339                // Save the site_icon data into option
     340                update_option( 'site_icon', $attachment_id );
     341
     342                add_settings_error( 'site-icon', 'icon-updated', __( 'Site Icon updated.' ), 'updated' );
     343        }
     344
     345        /**
     346         * This function is used to pass data to the localize script
     347         * so that we can center the cropper and also set the minimum
     348         * cropper if we still want to show the
     349         *
     350         * @since 4.3.0
     351         *
     352         * @param float $ratio
     353         * @param array $cropped_size
     354         * @return array
     355         */
     356        public function initial_crop_data( $ratio, $cropped_size ) {
     357                $init_x = $init_y = $init_size = 0;
     358
     359                $min_crop_size  = ( $this->min_size / $ratio );
     360                $resized_width  = $cropped_size[0];
     361                $resized_height = $cropped_size[1];
     362
     363                // Landscape format ( width > height )
     364                if ( $resized_width > $resized_height ) {
     365                        $init_x    = ( $this->page_crop - $resized_height ) / 2;
     366                        $init_size = $resized_height;
     367                }
     368
     369                // Portrait format ( height > width )
     370                if ( $resized_width < $resized_height ) {
     371                        $init_y    = ( $this->page_crop - $resized_width ) / 2;
     372                        $init_size = $resized_height;
     373                }
     374
     375                // Square height == width
     376                if ( $resized_width == $resized_height ) {
     377                        $init_size = $resized_height;
     378                }
     379
     380                return array(
     381                        'init_x'    => $init_x,
     382                        'init_y'    => $init_y,
     383                        'init_size' => $init_size,
     384                        'min_size'  => $min_crop_size,
     385                );
     386        }
     387
     388        /**
     389         * Converts the coordinates from the downsized image to the original image for accurate cropping.
     390         *
     391         * @since 4.3.0
     392         *
     393         * @param int   $crop_x
     394         * @param int   $crop_y
     395         * @param int   $crop_width
     396         * @param int   $crop_height
     397         * @param float $ratio
     398         * @return array
     399         */
     400        public function convert_coordinates_from_resized_to_full( $crop_x, $crop_y, $crop_width, $crop_height, $ratio ) {
     401                return array(
     402                        'crop_x'      => floor( $crop_x * $ratio ),
     403                        'crop_y'      => floor( $crop_y * $ratio ),
     404                        'crop_width'  => floor( $crop_width * $ratio ),
     405                        'crop_height' => floor( $crop_height * $ratio ),
     406                );
     407        }
     408
     409        /**
     410         * Upload the file to be cropped in the second step.
     411         *
     412         * @since 4.3.0
     413         */
     414        public function handle_upload() {
     415                $uploaded_file = $_FILES['site-icon'];
     416                $file_type     = wp_check_filetype_and_ext( $uploaded_file['tmp_name'], $uploaded_file['name'] );
     417                if ( ! wp_match_mime_types( 'image', $file_type['type'] ) ) {
     418                        wp_die( __( 'The uploaded file is not a valid image. Please try again.' ) );
     419                }
     420
     421                $file = wp_handle_upload( $uploaded_file, array( 'test_form' => false ) );
     422
     423                if ( isset( $file['error'] ) ) {
     424                        wp_die( $file['error'], __( 'Image Upload Error' ) );
     425                }
     426
     427                $url      = $file['url'];
     428                $type     = $file['type'];
     429                $file     = $file['file'];
     430                $filename = basename( $file );
     431
     432                // Construct the object array
     433                $object = array(
     434                        'post_title'     => $filename,
     435                        'post_content'   => $url,
     436                        'post_mime_type' => $type,
     437                        'guid'           => $url,
     438                        'context'        => 'site-icon',
     439                );
     440
     441                // Save the data
     442                $attachment_id = wp_insert_attachment( $object, $file );
     443
     444                return compact( 'attachment_id', 'file', 'filename', 'url', 'type' );
     445        }
     446
     447        /**
     448         * Create an attachment 'object'.
     449         *
     450         * @since 4.3.0
     451         *
     452         * @param string $cropped              Cropped image URL.
     453         * @param int    $parent_attachment_id Attachment ID of parent image.
     454         * @return array Attachment object.
     455         */
     456        public function create_attachment_object( $cropped, $parent_attachment_id ) {
     457                $parent     = get_post( $parent_attachment_id );
     458                $parent_url = $parent->guid;
     459                $url        = str_replace( basename( $parent_url ), basename( $cropped ), $parent_url );
     460
     461                $size       = @getimagesize( $cropped );
     462                $image_type = ( $size ) ? $size['mime'] : 'image/jpeg';
     463
     464                $object = array(
     465                        'ID'             => $parent_attachment_id,
     466                        'post_title'     => basename( $cropped ),
     467                        'post_content'   => $url,
     468                        'post_mime_type' => $image_type,
     469                        'guid'           => $url,
     470                        'context'        => 'site-icon'
     471                );
     472
     473                return $object;
     474        }
     475
     476        /**
     477         * Insert an attachment and its metadata.
     478         *
     479         * @since 4.3.0
     480         *
     481         * @param array  $object  Attachment object.
     482         * @param string $cropped Cropped image URL.
     483         * @return int Attachment ID.
     484         */
     485        public function insert_attachment( $object, $cropped ) {
     486                $attachment_id = wp_insert_attachment( $object, $cropped );
     487                $metadata      = wp_generate_attachment_metadata( $attachment_id, $cropped );
     488
     489                /**
     490                 * Filter the site icon attachment metadata.
     491                 *
     492                 * @since 4.3.0
     493                 *
     494                 * @see wp_generate_attachment_metadata()
     495                 *
     496                 * @param array $metadata Attachment metadata.
     497                 */
     498                $metadata = apply_filters( 'site_icon_attachment_metadata', $metadata );
     499                wp_update_attachment_metadata( $attachment_id, $metadata );
     500
     501                return $attachment_id;
     502        }
     503
     504        /**
     505         * Add additional sizes to be made when creating the site_icon images.
     506         *
     507         * @since 4.3.0
     508         *
     509         * @param array $sizes
     510         * @return array
     511         */
     512        public function additional_sizes( $sizes = array() ) {
     513                $only_crop_sizes = array();
     514
     515                /**
     516                 * Filters the different dimensions that a site icon is saved in.
     517                 *
     518                 * @since 4.3.0
     519                 *
     520                 * @param array $site_icon_sizes Sizes available for the Site Icon.
     521                 */
     522                $this->site_icon_sizes = apply_filters( 'site_icon_image_sizes', $this->site_icon_sizes );
     523                // use a natural sort of numbers
     524                natsort( $this->site_icon_sizes );
     525                $this->site_icon_sizes = array_reverse( $this->site_icon_sizes );
     526
     527                // ensure that we only resize the image into
     528                foreach ( $sizes as $name => $size_array ) {
     529                        if ( $size_array['crop'] ) {
     530                                $only_crop_sizes[ $name ] = $size_array;
     531                        }
     532                }
     533
     534                foreach ( $this->site_icon_sizes as $size ) {
     535                        if ( $size < $this->min_size ) {
     536                                $only_crop_sizes[ 'site_icon-' . $size ] = array(
     537                                        'width ' => $size,
     538                                        'height' => $size,
     539                                        'crop'   => true,
     540                                );
     541                        }
     542                }
     543
     544                return $only_crop_sizes;
     545        }
     546
     547        /**
     548         * Add Site Icon sizes to the array of image sizes on demand.
     549         *
     550         * @since 4.3.0
     551         *
     552         * @param array $sizes
     553         * @return array
     554         */
     555        public function intermediate_image_sizes( $sizes = array() ) {
     556                /** This filter is documented in wp-admin/site-icon.php */
     557                $this->site_icon_sizes = apply_filters( 'site_icon_image_sizes', $this->site_icon_sizes );
     558                foreach ( $this->site_icon_sizes as $size ) {
     559                        $sizes[] = 'site_icon-' . $size;
     560                }
     561
     562                return $sizes;
     563        }
     564
     565        /**
     566         * Deletes all additional image sizes, used for site icons.
     567         *
     568         * @since 4.3.0
     569         *
     570         * @return bool
     571         */
     572        public function delete_site_icon() {
     573                // We add the filter to make sure that we also delete all the added images
     574                add_filter( 'intermediate_image_sizes', array( $this, 'intermediate_image_sizes' ) );
     575                wp_delete_attachment( get_option( 'site_icon' ), true );
     576                remove_filter( 'intermediate_image_sizes', array( $this, 'intermediate_image_sizes' ) );
     577
     578                return delete_option( 'site_icon' );
     579        }
     580
     581        /**
     582         * Deletes the Site Icon when the image file is deleted.
     583         *
     584         * @since 4.3.0
     585         *
     586         * @param int $post_id Attachment ID.
     587         */
     588        public function delete_attachment_data( $post_id ) {
     589                // The user could be deleting the site_icon image
     590                $site_icon_id = get_option( 'site_icon' );
     591
     592                if ( $site_icon_id && $post_id == $site_icon_id ) {
     593                        delete_option( 'site_icon' );
     594                }
     595        }
     596
     597        /**
     598         * Adds custom image sizes when meta data for an image is requested, that happens to be used as Site Icon.
     599         *
     600         * @since 4.3.0
     601         *
     602         * @param null|array|string $value    The value get_metadata() should
     603         *                                    return - a single metadata value,
     604         *                                    or an array of values.
     605         * @param int               $post_id  Post ID.
     606         * @param string            $meta_key Meta key.
     607         * @param string|array      $single   Meta value, or an array of values.
     608         * @return array|null|string
     609         */
     610        public function get_post_metadata( $value, $post_id, $meta_key, $single ) {
     611                $site_icon_id = get_option( 'site_icon' );
     612
     613                if ( $post_id == $site_icon_id && '_wp_attachment_backup_sizes' == $meta_key && $single ) {
     614                        add_filter( 'intermediate_image_sizes', array( $this, 'intermediate_image_sizes' ) );
     615                }
     616
     617                return $value;
     618        }
     619}
     620
     621$GLOBALS['wp_site_icon'] = new WP_Site_Icon;
  • src/wp-admin/includes/template.php

     
    17781778                        $media_states[] = __( 'Background Image' );
    17791779        }
    17801780
     1781        if ( $post->ID == get_option( 'site_icon_id' ) ) {
     1782                $media_states[] = __( 'Site Icon' );
     1783        }
     1784
    17811785        /**
    17821786         * Filter the default media display states for items in the Media list table.
    17831787         *
  • src/wp-admin/js/site-icon-crop.js

     
     1/* global wpSiteIconCropData, jQuery */
     2(function($) {
     3        var jcrop_api = {},
     4                siteIconCrop = {
     5
     6                updateCoords : function ( coords ) {
     7
     8                        $('#crop-x').val( coords.x );
     9                        $('#crop-y').val( coords.y );
     10                        $('#crop-width').val( coords.w );
     11                        $('#crop-height').val( coords.h );
     12
     13                        siteIconCrop.showPreview( coords );
     14                },
     15
     16                showPreview : function( coords ){
     17                        var rx, ry, crop_image, home_icon, preview_rx, preview_ry, favicon;
     18                        rx = 64 / coords.w;
     19                        ry = 64 / coords.h;
     20                        crop_image = $('#crop-image');
     21                        home_icon = $('#preview-homeicon');
     22                        home_icon.css({
     23                                width: Math.round(rx * crop_image.attr( 'width' ) ) + 'px',
     24                                height: Math.round(ry * crop_image.attr( 'height' ) ) + 'px',
     25                                marginLeft: '-' + Math.round(rx * coords.x) + 'px',
     26                                marginTop: '-' + Math.round(ry * coords.y) + 'px'
     27                        });
     28                        preview_rx = 16 / coords.w;
     29                        preview_ry = 16 / coords.h;
     30                        favicon = $('#preview-favicon');
     31                        favicon.css({
     32                                width: Math.round( preview_rx *  crop_image.attr( 'width' ) ) + 'px',
     33                                height: Math.round( preview_ry * crop_image.attr( 'height' ) ) + 'px',
     34                                marginLeft: '-' + Math.round( preview_rx * coords.x ) + 'px',
     35                                marginTop: '-' + Math.floor( preview_ry* coords.y ) + 'px'
     36                        });
     37                },
     38
     39                ready: function() {
     40                        jcrop_api = $.Jcrop('#crop-image');
     41                        jcrop_api.setOptions({
     42                                aspectRatio: 1,
     43                                onSelect: siteIconCrop.updateCoords,
     44                                onChange: siteIconCrop.updateCoords,
     45                                minSize: [ wpSiteIconCropData.min_size, wpSiteIconCropData.min_size ]
     46                        });
     47                        jcrop_api.animateTo([wpSiteIconCropData.init_x, wpSiteIconCropData.init_y, wpSiteIconCropData.init_size, wpSiteIconCropData.init_size]);
     48                }
     49
     50        };
     51
     52        siteIconCrop.ready();
     53
     54})(jQuery);
     55 No newline at end of file
  • src/wp-admin/js/site-icon.js

     
     1(function($) {
     2        var frame;
     3
     4        $( function() {
     5                // Build the choose from library frame.
     6                $( '#choose-from-library-link' ).click( function( event ) {
     7                        var $el = $(this);
     8                        event.preventDefault();
     9
     10                        // If the media frame already exists, reopen it.
     11                        if ( frame ) {
     12                                frame.open();
     13                                return;
     14                        }
     15
     16                        // Create the media frame.
     17                        frame = wp.media.frames.customHeader = wp.media({
     18                                // Set the title of the modal.
     19                                title: $el.data('choose'),
     20
     21                                // Tell the modal to show only images.
     22                                library: {
     23                                        type: 'image'
     24                                },
     25
     26                                // Customize the submit button.
     27                                button: {
     28                                        // Set the text of the button.
     29                                        text: $el.data('update'),
     30                                        // Tell the button not to close the modal, since we're
     31                                        // going to refresh the page when the image is selected.
     32                                        close: false
     33                                }
     34                        });
     35
     36                        // When an image is selected, run a callback.
     37                        frame.on( 'select', function() {
     38                                // Grab the selected attachment.
     39                                var attachment = frame.state().get('selection').first(),
     40                                        link = $el.data('updateLink');
     41
     42                                // Tell the browser to navigate to the crop step.
     43                                window.location = link + '&file=' + attachment.id;
     44                        });
     45
     46                        frame.open();
     47                });
     48        });
     49}(jQuery));
  • src/wp-admin/options-general.php

     
    124124<td><input name="blogdescription" type="text" id="blogdescription" aria-describedby="tagline-description" value="<?php form_option('blogdescription'); ?>" class="regular-text" />
    125125<p class="description" id="tagline-description"><?php _e( 'In a few words, explain what this site is about.' ) ?></p></td>
    126126</tr>
     127<tr>
     128<th scope="row"><label for="site_icon"><?php _e( 'Site Icon' ); ?></label></th>
     129<td>
     130        <?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() ) :
     141                $remove_url = add_query_arg( array(
     142                        'action' => 'remove_site_icon',
     143                ), wp_nonce_url( admin_url( 'options-general.php' ), 'remove-site-icon' ) );
     144
     145                ?>
     146                <img class="avatar avatar-150" src="<?php site_icon_url( null, 150 ); ?>" height="150" width="150" />
     147                <p class="hide-if-no-js">
     148                        <label class="screen-reader-text" for="choose-from-library-link"><?php _e( 'Choose an image from your media library:' ); ?></label>
     149                        <button type="button" id="choose-from-library-link" class="button" 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>
     150                        <a href="<?php echo esc_url( $remove_url ); ?>" id="site-icon-remove"><?php esc_html_e( 'Remove Site Icon' ); ?></a>
     151                </p>
     152                <p class="hide-if-js">
     153                        <a href="<?php echo esc_url( $upload_url ); ?>" class="button"><?php _e( 'Update Site Icon' ); ?></a>
     154                        <a href="<?php echo esc_url( $remove_url ); ?>" class="button" id="site-icon-remove"><?php esc_html_e( 'Remove Site Icon' ); ?></a>
     155                </p>
     156
     157        <?php else : ?>
     158
     159                <p class="hide-if-no-js">
     160                        <label class="screen-reader-text" for="choose-from-library-link"><?php _e( 'Choose an image from your media library:' ); ?></label>
     161                        <button type="button" id="choose-from-library-link" class="button" 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( 'Choose Image' ); ?></button>
     162                </p>
     163                <a class="button hide-if-js" href="<?php echo esc_url( $upload_url ); ?>"><?php _e( 'Add a Site Icon' ); ?></a>
     164
     165        <?php endif; ?>
     166<p class="description" id="site-icon-description"><?php _e( 'Site Icon creates a favicon and app icons for your site.' ) ?></p></td>
     167</tr>
    127168<?php if ( !is_multisite() ) { ?>
    128169<tr>
    129170<th scope="row"><label for="siteurl"><?php _e('WordPress Address (URL)') ?></label></th>
  • src/wp-admin/options.php

     
    7272        wp_die( __( 'Cheatin&#8217; uh?' ), 403 );
    7373
    7474$whitelist_options = array(
    75         'general' => array( 'blogname', 'blogdescription', 'gmt_offset', 'date_format', 'time_format', 'start_of_week', 'timezone_string', 'WPLANG' ),
     75        'general' => array( 'blogname', 'blogdescription', 'site_icon', 'gmt_offset', 'date_format', 'time_format', 'start_of_week', 'timezone_string', 'WPLANG' ),
    7676        'discussion' => array( 'default_pingback_flag', 'default_ping_status', 'default_comment_status', 'comments_notify', 'moderation_notify', 'comment_moderation', 'require_name_email', 'comment_whitelist', 'comment_max_links', 'moderation_keys', 'blacklist_keys', 'show_avatars', 'avatar_rating', 'avatar_default', 'close_comments_for_old_posts', 'close_comments_days_old', 'thread_comments', 'thread_comments_depth', 'page_comments', 'comments_per_page', 'default_comments_page', 'comment_order', 'comment_registration' ),
    7777        'media' => array( 'thumbnail_size_w', 'thumbnail_size_h', 'thumbnail_crop', 'medium_size_w', 'medium_size_h', 'large_size_w', 'large_size_h', 'image_default_size', 'image_default_align', 'image_default_link_type' ),
    7878        'reading' => array( 'posts_per_page', 'posts_per_rss', 'rss_use_excerpt', 'show_on_front', 'page_on_front', 'page_for_posts', 'blog_public' ),
  • src/wp-includes/default-filters.php

     
    222222add_action( 'wp_head',             'wp_print_head_scripts',            9    );
    223223add_action( 'wp_head',             'wp_generator'                           );
    224224add_action( 'wp_head',             'rel_canonical'                          );
     225add_action( 'wp_head',             'wp_shortlink_wp_head',            10, 0 );
     226add_action( 'wp_head',             'wp_site_icon',                    99    );
    225227add_action( 'wp_footer',           'wp_print_footer_scripts',         20    );
    226 add_action( 'wp_head',             'wp_shortlink_wp_head',            10, 0 );
    227228add_action( 'template_redirect',   'wp_shortlink_header',             11, 0 );
    228229add_action( 'wp_print_footer_scripts', '_wp_footer_scripts'                 );
    229230add_action( 'init',                'check_theme_switched',            99    );
     
    243244        add_action( $action, 'the_generator' );
    244245}
    245246
     247// Feed Site Icon
     248add_action( 'atom_head', 'atom_site_icon' );
     249add_action( 'rss2_head', 'rss2_site_icon' );
     250
     251
    246252// WP Cron
    247253if ( !defined( 'DOING_CRON' ) )
    248254        add_action( 'init', 'wp_cron' );
  • src/wp-includes/feed.php

     
    588588}
    589589
    590590/**
     591 * Display Site Icon in atom feeds.
     592 *
     593 * @since 4.3.0
     594 */
     595function atom_site_icon() {
     596        $url = get_site_icon_url( null, 32 );
     597        if ( $url ) {
     598                echo "<icon>$url</icon>\n";
     599        }
     600}
     601
     602/**
     603 * Display Site Icon in RSS2.
     604 *
     605 * @since 4.3.0
     606 */
     607function rss2_site_icon() {
     608        $rss_title = get_wp_title_rss();
     609        if ( empty( $rss_title ) ) {
     610                $rss_title = get_bloginfo_rss( 'name' );
     611        }
     612
     613        $url = get_site_icon_url( null, 32 );
     614        if ( $url ) {
     615                echo '
     616<image>
     617        <url>' . convert_chars( $url ) . '</url>
     618        <title>' . $rss_title . '</title>
     619        <link>' . get_bloginfo_rss( 'url' ) . '</link>
     620        <width>32</width>
     621        <height>32</height>
     622</image> ' . "\n";
     623        }
     624}
     625
     626/**
    591627 * Display the link for the currently displayed feed in a XSS safe way.
    592628 *
    593629 * Generate a correct link for the atom:self element.
  • src/wp-includes/formatting.php

     
    34213421                case 'thread_comments_depth':
    34223422                case 'users_can_register':
    34233423                case 'start_of_week':
     3424                case 'site_icon':
    34243425                        $value = absint( $value );
    34253426                        break;
    34263427
  • src/wp-includes/general-template.php

     
    722722}
    723723
    724724/**
     725 * Returns the Site Icon URL.
     726 *
     727 * @param  null|int $blog_id Id of the blog to get the site icon for.
     728 * @param  int      $size    Size of the site icon.
     729 * @param  string   $url     Fallback url if no site icon is found.
     730 * @return string            Site Icon URL.
     731 */
     732function get_site_icon_url( $blog_id = null, $size = 512, $url = '' ) {
     733        if ( function_exists( 'get_blog_option' ) ) {
     734                if ( ! is_int( $blog_id ) ) {
     735                        $blog_id = get_current_blog_id();
     736                }
     737                $site_icon_id = get_blog_option( $blog_id, 'site_icon' );
     738        } else {
     739                $site_icon_id = get_option( 'site_icon' );
     740        }
     741
     742        if ( $site_icon_id  ) {
     743                if ( $size >= 512 ) {
     744                        $size_data = 'full';
     745                } else {
     746                        $size_data = array( $size, $size );
     747                }
     748                $url_data = wp_get_attachment_image_src( $site_icon_id, $size_data );
     749                $url = $url_data[0];
     750        }
     751
     752        return $url;
     753}
     754
     755/**
     756 * Displays the Site Icon URL.
     757 *
     758 * @param null|int $blog_id Id of the blog to get the site icon for.
     759 * @param int      $size    Size of the site icon.
     760 * @param string   $url     Fallback url if no site icon is found.
     761 */
     762function site_icon_url( $blog_id = null, $size = 512, $url = '' ) {
     763        echo esc_url( get_site_icon_url( $blog_id, $size, $url ) );
     764}
     765
     766/**
     767 * Whether the site has a Site Icon.
     768 *
     769 * @param int|null $blog_id Optional. Blog ID. Default: Current blog.
     770 * @return bool
     771 */
     772function has_site_icon( $blog_id = null ) {
     773        return !! get_site_icon_url( $blog_id, 512 );
     774}
     775
     776/**
    725777 * Display title tag with contents.
    726778 *
    727779 * @ignore
     
    23862438}
    23872439
    23882440/**
     2441 * Display site icon meta tags.
     2442 *
     2443 * @since 4.3.0
     2444 *
     2445 * @link http://www.whatwg.org/specs/web-apps/current-work/multipage/links.html#rel-icon HTML5 specification link icon.
     2446 */
     2447function wp_site_icon() {
     2448        if ( ! has_site_icon() ) {
     2449                return;
     2450        }
     2451
     2452        $meta_tags = array(
     2453                sprintf( '<link rel="icon" href="%s" sizes="32x32" />', esc_url( get_site_icon_url( null, 32 ) ) ),
     2454                sprintf( '<link rel="apple-touch-icon-precomposed" href="%s">', esc_url( get_site_icon_url( null, 180 ) ) ),
     2455                sprintf( '<meta name="msapplication-TileImage" content="%s">', esc_url( get_site_icon_url( null, 270 ) ) ),
     2456        );
     2457
     2458        /**
     2459         * Filters the site icon meta tags, so Plugins can add their own.
     2460         *
     2461         * @since 4.3.0
     2462         *
     2463         * @param array $meta_tags Site Icon meta elements.
     2464         */
     2465        $meta_tags = apply_filters( 'site_icon_meta_tags', $meta_tags );
     2466        $meta_tags = array_filter( $meta_tags );
     2467
     2468        foreach ( $meta_tags as $meta_tag ) {
     2469                echo "$meta_tag\n";
     2470        }
     2471}
     2472
     2473/**
    23892474 * Whether the user should have a WYSIWIG editor.
    23902475 *
    23912476 * Checks that the user requires a WYSIWIG editor and that the editor is
  • src/wp-includes/script-loader.php

     
    612612                        'untitled' => _x( '(no label)', 'missing menu item navigation label' )
    613613                ) );
    614614
     615                $scripts->add( 'site-icon', '/wp-admin/js/site-icon.js', array( 'jquery' ), false, 1 );
     616                $scripts->add( 'site-icon-crop', '/wp-admin/js/site-icon-crop.js', array( 'jcrop' ), false, 1 );
     617
    615618                $scripts->add( 'custom-header', "/wp-admin/js/custom-header.js", array( 'jquery-masonry' ), false, 1 );
    616619                $scripts->add( 'custom-background', "/wp-admin/js/custom-background$suffix.js", array( 'wp-color-picker', 'media-views' ), false, 1 );
    617620                $scripts->add( 'media-gallery', "/wp-admin/js/media-gallery$suffix.js", array('jquery'), false, 1 );