WordPress.org

Make WordPress Core

Ticket #16434: 16434.3.diff

File 16434.3.diff, 37.0 KB (added by obenland, 2 years ago)

First pass at site icon for settings.

  • 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-filters.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
    Added: svn:executable
    ## -0,0 +1 ##
    +*
    \ No newline at end of property
     
    6565// Nav Menu hooks. 
    6666add_action( 'admin_head-nav-menus.php', '_wp_delete_orphaned_draft_menu_items' ); 
    6767 
     68// Site Icon hooks. 
     69add_action( 'admin_menu', 'site_icon_admin', 1 ); 
     70 
    6871// Plugin hooks. 
    6972add_filter( 'whitelist_options', 'option_update_filter' ); 
    7073 
  • src/wp-admin/includes/admin.php

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

    Property changes on: src/wp-admin/js/site-icon-crop.js
    ___________________________________________________________________
    Added: svn:executable
    ## -0,0 +1 ##
    +*
    \ No newline at end of property
     
     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                'step' => 2, 
     135        ), wp_nonce_url( admin_url( 'options-general.php' ), 'site-icon-crop' ) ) ); 
     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                        '_wpnonce' => wp_create_nonce( 'remove_site_icon' ), 
     144                ), admin_url( 'options-general.php' ) ); 
     145 
     146                ?> 
     147                <img class="avatar avatar-150" src="<?php site_icon_url( null, 150 ); ?>" height="150" width="150" /> 
     148                <p class="hide-if-no-js"> 
     149                        <label class="screen-reader-text" for="choose-from-library-link"><?php _e( 'Choose an image from your media library:' ); ?></label> 
     150                        <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> 
     151                        <a href="<?php echo esc_url( $remove_url ); ?>" id="site-icon-remove"><?php esc_html_e( 'Remove Site Icon' ); ?></a> 
     152                </p> 
     153                <p class="button hide-if-js"> 
     154                        <a href="<?php echo esc_url( $upload_url ); ?>"><?php _e( 'Update Site Icon' ); ?></a> 
     155                        <a href="<?php echo esc_url( $remove_url ); ?>" id="site-icon-remove"><?php esc_html_e( 'Remove Site Icon' ); ?></a> 
     156                </p> 
     157 
     158        <?php else : ?> 
     159 
     160                <p class="hide-if-no-js"> 
     161                        <label class="screen-reader-text" for="choose-from-library-link"><?php _e( 'Choose an image from your media library:' ); ?></label> 
     162                        <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> 
     163                </p> 
     164                <a class="button hide-if-js" href="<?php echo esc_url( $upload_url ); ?>"><?php _e( 'Add a Site Icon' ); ?></a> 
     165 
     166        <?php endif; ?> 
     167<p class="description" id="site-icon-description"><?php _e( 'Site Icon creates a favicon and app icons for your site.' ) ?></p></td> 
     168</tr> 
    127169<?php if ( !is_multisite() ) { ?> 
    128170<tr> 
    129171<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'                          ); 
    225 add_action( 'wp_footer',           'wp_print_footer_scripts',         20    ); 
    226225add_action( 'wp_head',             'wp_shortlink_wp_head',            10, 0 ); 
     226add_action( 'wp_head',             'wp_site_icon',                    99    ); 
     227add_action( 'wp_footer',           'wp_print_footer_scripts',         20    ); 
    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 = 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        $icon = site_icon_url( null, 32 ); 
     614        if ( $icon ) { 
     615                echo ' 
     616<image> 
     617        <url>' . convert_chars( $icon ) . '</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        $meta_tags = array( 
     2449                sprintf( '<link rel="icon" href="%s" sizes="32x32" />', esc_url( get_site_icon_url( null, 32 ) ) ), 
     2450                sprintf( '<link rel="apple-touch-icon-precomposed" href="%s">', esc_url( get_site_icon_url( null, 180 ) ) ), 
     2451                sprintf( '<meta name="msapplication-TileImage" content="%s">', esc_url( get_site_icon_url( null, 270 ) ) ), 
     2452        ); 
     2453 
     2454        /** 
     2455         * Filters the site icon meta tags, so Plugins can add their own. 
     2456         * 
     2457         * @since 4.3.0 
     2458         * 
     2459         * @param array $meta_tags Site Icon Meta Elements. 
     2460         */ 
     2461        $meta_tags = apply_filters( 'site_icon_meta_tags', $meta_tags ); 
     2462        $meta_tags = array_filter( $meta_tags ); 
     2463 
     2464        foreach ( $meta_tags as $meta_tag ) { 
     2465                echo "$meta_tag\n"; 
     2466        } 
     2467} 
     2468 
     2469/** 
    23892470 * Whether the user should have a WYSIWIG editor. 
    23902471 * 
    23912472 * 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 );