Changeset 33329
- Timestamp:
- 07/20/2015 03:56:19 PM (9 years ago)
- Location:
- trunk/src
- Files:
-
- 4 added
- 2 deleted
- 13 edited
Legend:
- Unmodified
- Added
- Removed
-
trunk/src/wp-admin/css/site-icon.css
r33180 r33329 3 3 ------------------------------------------------------------------------------*/ 4 4 5 .site-icon-image { 6 float: left; 7 margin: 0 20px 0 0; 5 .site-icon-preview .favicon-preview { 6 margin-bottom: 20px; 7 overflow: hidden; 8 position: relative; 9 max-width: 180px; 8 10 } 9 11 10 .site-icon-content { 11 overflow: hidden; 12 padding: 10px; 13 position: relative; 14 } 15 16 .site-icon-crop-shell { 17 max-width: 720px; 18 } 19 20 .site-icon-crop-wrapper { 21 float: left; 22 } 23 24 .site-icon-crop-preview-shell { 25 float: right; 26 overflow: hidden; 27 } 28 29 .site-icon-crop-preview-shell h2 { 30 padding-top: 0; 31 } 32 33 .site-icon-crop-favicon-preview-shell { 34 margin-bottom: 20px; 35 position: relative; 36 } 37 38 .site-icon-crop-preview-favicon, 39 .site-icon-browser-title { 12 .site-icon-preview .favicon, 13 .site-icon-preview .browser-title { 40 14 height: 16px; 41 15 left: 88px; … … 45 19 } 46 20 47 .site-icon- crop-preview-favicon {21 .site-icon-preview .favicon { 48 22 width: 16px; 49 23 } 50 24 51 .site-icon- browser-title {25 .site-icon-preview .browser-title { 52 26 left: 109px; 53 27 } 54 28 55 .site-icon- crop-preview-homeicon{29 .site-icon-preview .app-icon-preview { 56 30 background-color: #000; 57 31 -webkit-border-radius: 16px; … … 61 35 width: 64px; 62 36 } 63 64 .site-icon-crop-shell .submit {65 clear: both;66 }67 68 @media only screen and (max-width: 768px) {69 .site-icon-crop-wrapper,70 .site-icon-crop-preview-shell {71 float: none;72 }73 74 .site-icon-crop-wrapper {75 max-width: 100%;76 margin-bottom: 20px;77 }78 79 .site-icon-crop-wrapper img {80 max-width: 100%;81 height: auto;82 }83 } -
trunk/src/wp-admin/includes/class-wp-site-icon.php
r33202 r33329 66 66 */ 67 67 public function __construct() { 68 69 // Add the favicon to the backend.70 add_action( 'admin_menu', array( $this, 'admin_menu_upload_site_icon' ) );71 72 add_action( 'admin_action_set_site_icon', array( $this, 'set_site_icon' ) );73 add_action( 'admin_action_remove_site_icon', array( $this, 'remove_site_icon' ) );74 75 68 add_action( 'delete_attachment', array( $this, 'delete_attachment_data' ), 10, 1 ); 76 69 add_filter( 'get_post_metadata', array( $this, 'get_post_metadata' ), 10, 4 ); 77 }78 79 /**80 * Adds a hidden upload page.81 *82 * There is no need to access it directly.83 *84 * @since 4.3.085 * @access public86 */87 public function admin_menu_upload_site_icon() {88 $hook = add_submenu_page( null, __( 'Site Icon' ), __( 'Site Icon' ), 'manage_options', 'site-icon', array( $this, 'upload_site_icon_page' ) );89 90 add_action( "load-$hook", array( $this, 'add_upload_settings' ) );91 add_action( "load-$hook", array( $this, 'maybe_skip_cropping' ) );92 add_action( "admin_print_scripts-$hook", array( $this, 'enqueue_scripts' ) );93 }94 95 /**96 * Adds scripts to admin settings pages.97 *98 * @since 4.3.099 * @access public100 */101 public function enqueue_scripts() {102 wp_enqueue_style( 'jcrop' );103 wp_enqueue_script( 'site-icon-crop' );104 }105 106 /**107 * Loads the settings when the admin is initialized.108 *109 * @since 4.3.0110 * @access public111 */112 public function add_upload_settings() {113 add_settings_section( 'site-icon-upload', false, false, 'site-icon-upload' );114 add_settings_field( 'site-icon-upload', __( 'Upload Image' ), array( $this, 'upload_field' ), 'site-icon-upload', 'site-icon-upload', array(115 'label_for' => 'site-icon-upload',116 ) );117 }118 119 /**120 * Removes the site icon.121 *122 * @since 4.3.0123 * @access public124 */125 public function remove_site_icon() {126 check_admin_referer( 'remove-site-icon' );127 128 $this->delete_site_icon();129 130 add_settings_error( 'site-icon', 'icon-removed', __( 'Site Icon removed.' ), 'updated' );131 }132 133 /**134 * Handle uploading a site icon.135 *136 * Uploading a site_icon is a 3 step process137 *138 * 1. Select the file to upload139 * 2. Crop the file140 * 3. Confirmation141 *142 * @since 4.3.0143 * @access public144 */145 public function upload_site_icon_page() {146 $action = isset( $_REQUEST['action'] ) ? $_REQUEST['action'] : 'select_site_icon';147 148 switch ( $action ) {149 case 'select_site_icon':150 $this->select_page();151 break;152 153 case 'crop_site_icon':154 $this->crop_page();155 break;156 157 default:158 wp_safe_redirect( admin_url( 'options-general.php#site-icon' ) );159 exit;160 }161 }162 163 /**164 * Displays the site_icon form to upload the image.165 *166 * @since 4.3.0167 * @access public168 */169 public function select_page() {170 ?>171 <div class="wrap">172 <h1><?php _e( 'Add Site Icon' ); ?></h1>173 <?php settings_errors( 'site-icon' ); ?>174 <?php do_settings_sections( 'site-icon-upload' ); ?>175 </div>176 <?php177 }178 179 /**180 * Handles settings field for file upload.181 *182 * @since 4.3.0183 * @access public184 */185 public function upload_field() {186 wp_enqueue_media();187 wp_enqueue_script( 'site-icon' );188 wp_dequeue_script( 'site-icon-crop' );189 190 $update_url = esc_url( add_query_arg( array(191 'page' => 'site-icon',192 'action' => 'crop_site_icon',193 ), wp_nonce_url( admin_url( 'options-general.php' ), 'crop-site-icon' ) ) );194 ?>195 <p class="hide-if-no-js">196 <label class="screen-reader-text" for="choose-from-library-link"><?php _e( 'Choose an image from your media library:' ); ?></label>197 <button type="button" id="choose-from-library-link" class="button" data-size="<?php echo absint( $this->min_size ); ?>" data-update-link="<?php echo esc_attr( $update_url ); ?>" data-choose="<?php esc_attr_e( 'Choose a Site Icon' ); ?>" data-update="<?php esc_attr_e( 'Set as Site Icon' ); ?>"><?php _e( 'Choose Image' ); ?></button>198 </p>199 <form class="hide-if-js" action="<?php echo esc_url( admin_url( 'options-general.php?page=site-icon' ) ); ?>" method="post" enctype="multipart/form-data">200 <input name="action" value="crop_site_icon" type="hidden" />201 <input name="site-icon" type="file" />202 <input name="submit" value="<?php esc_attr_e( 'Upload Image' ); ?>" type="submit" class="button button-primary" />203 <p class="description">204 <?php printf( __( 'The image is recommended to be a square image of at least %spx in both width and height.' ), "<strong>$this->min_size</strong>" ); ?>205 </p>206 <?php wp_nonce_field( 'crop-site-icon' ); ?>207 </form>208 <?php209 }210 211 /**212 * Checks if the image needs cropping.213 *214 * If it doesn't need cropping, proceed to set the icon.215 *216 * @since 4.3.0217 * @access public218 */219 public function maybe_skip_cropping() {220 if ( empty( $_REQUEST['action'] ) || 'crop_site_icon' !== $_REQUEST['action'] ) {221 return;222 }223 224 check_admin_referer( 'crop-site-icon' );225 226 list( $attachment_id, $url, $image_size ) = $this->get_upload_data();227 228 if ( $image_size[0] == $image_size[1] && $image_size[0] == $this->min_size ) {229 // No cropping required.230 231 $url = add_query_arg( array(232 'attachment_id' => $attachment_id,233 'skip-cropping' => true,234 'create-new-attachment' => true,235 'action' => 'set_site_icon',236 ), wp_nonce_url( admin_url( 'options-general.php' ), 'set-site-icon' ) );237 238 wp_safe_redirect( $url );239 die();240 }241 }242 243 /**244 * Handles the image crop admin view.245 *246 * @since 4.3.0247 * @access public248 */249 public function crop_page() {250 check_admin_referer( 'crop-site-icon' );251 252 list( $attachment_id, $url, $image_size ) = $this->get_upload_data();253 254 if ( $image_size[0] < $this->min_size ) {255 add_settings_error( 'site-icon', 'too-small', sprintf( __( 'The selected image is smaller than %upx in width.' ), $this->min_size ) );256 257 // back to step one258 $this->select_page();259 260 return;261 }262 263 if ( $image_size[1] < $this->min_size ) {264 add_settings_error( 'site-icon', 'too-small', sprintf( __( 'The selected image is smaller than %upx in height.' ), $this->min_size ) );265 266 // Back to step one.267 $this->select_page();268 269 return;270 }271 272 wp_localize_script( 'site-icon-crop', 'wpSiteIconCropData', array(273 'init_x' => 0,274 'init_y' => 0,275 'init_size' => $this->min_size,276 'min_size' => $this->min_size,277 'width' => $image_size[0],278 'height' => $image_size[1],279 ) );280 ?>281 282 <div class="wrap">283 <h1 class="site-icon-title"><?php _e( 'Site Icon' ); ?></h1>284 <?php settings_errors( 'site-icon' ); ?>285 286 <div class="site-icon-crop-shell">287 <form action="options-general.php" method="post" enctype="multipart/form-data">288 <p class="hide-if-no-js description"><?php _e('Choose the part of the image you want to use as your site icon.'); ?></p>289 <p class="hide-if-js description"><strong><?php _e( 'You need JavaScript to choose a part of the image.'); ?></strong></p>290 291 <div class="site-icon-crop-wrapper">292 <img src="<?php echo esc_url( $url ); ?>" id="crop-image" class="site-icon-crop-image" width="512" height="" alt="<?php esc_attr_e( 'Image to be cropped' ); ?>"/>293 </div>294 295 <div class="site-icon-crop-preview-shell hide-if-no-js">296 <h2><?php _e( 'Preview' ); ?></h2>297 <strong><?php _e( 'As a browser icon' ); ?></strong>298 <div class="site-icon-crop-favicon-preview-shell">299 <img src="images/browser.png" class="site-icon-browser-preview" width="182" height="" alt=""/>300 301 <div class="site-icon-crop-preview-favicon">302 <img src="<?php echo esc_url( $url ); ?>" id="preview-favicon" alt="<?php esc_attr_e( 'Preview as a browser icon' ); ?>"/>303 </div>304 <span class="site-icon-browser-title"><?php bloginfo( 'name' ); ?></span>305 </div>306 307 <strong><?php _e( 'As an app icon' ); ?></strong>308 <div class="site-icon-crop-preview-homeicon">309 <img src="<?php echo esc_url( $url ); ?>" id="preview-homeicon" alt="<?php esc_attr_e( 'Preview as an app icon' ); ?>"/>310 </div>311 </div>312 313 <input type="hidden" id="crop-x" name="crop-x" value="0" />314 <input type="hidden" id="crop-y" name="crop-y" value="0" />315 <input type="hidden" id="crop-width" name="crop-w" value="<?php echo esc_attr( $this->min_size ); ?>" />316 <input type="hidden" id="crop-height" name="crop-h" value="<?php echo esc_attr( $this->min_size ); ?>" />317 318 <input type="hidden" name="action" value="set_site_icon" />319 <input type="hidden" name="attachment_id" value="<?php echo esc_attr( $attachment_id ); ?>" />320 <?php if ( empty( $_POST ) && isset( $_GET['file'] ) ) : ?>321 <input type="hidden" name="create-new-attachment" value="true" />322 <?php endif; ?>323 <?php wp_nonce_field( 'set-site-icon' ); ?>324 325 <p class="submit">326 <?php submit_button( __( 'Crop and Publish' ), 'primary hide-if-no-js', 'submit', false ); ?>327 <?php submit_button( __( 'Publish' ), 'primary hide-if-js', 'submit', false ); ?>328 <a class="button secondary" href="options-general.php"><?php _e( 'Cancel' ); ?></a>329 </p>330 </form>331 </div>332 </div>333 <?php334 }335 336 /**337 * Handles saving a new Site Icon.338 *339 * @since 4.3.0340 * @access public341 */342 public function set_site_icon() {343 check_admin_referer( 'set-site-icon' );344 345 $attachment_id = absint( $_REQUEST['attachment_id'] );346 $create_new_attachement = ! empty( $_REQUEST['create-new-attachment'] );347 348 // If the current attachment as been set as site icon don't delete it.349 if ( get_option( 'site_icon' ) == $attachment_id ) {350 // Get the file path.351 $image_url = get_attached_file( $attachment_id );352 353 // Update meta data and possibly regenerate intermediate sizes.354 add_filter( 'intermediate_image_sizes_advanced', array( $this, 'additional_sizes' ) );355 $this->update_attachment_metadata( $attachment_id, $image_url );356 remove_filter( 'intermediate_image_sizes_advanced', array( $this, 'additional_sizes' ) );357 358 } else {359 // Delete any existing site icon images.360 $this->delete_site_icon();361 362 if ( empty( $_REQUEST['skip-cropping'] ) ) {363 $cropped = wp_crop_image( $attachment_id, $_REQUEST['crop-x'], $_REQUEST['crop-y'], $_REQUEST['crop-w'], $_REQUEST['crop-h'], $this->min_size, $this->min_size );364 365 } elseif ( $create_new_attachement ) {366 $cropped = _copy_image_file( $attachment_id );367 368 } else {369 $cropped = get_attached_file( $attachment_id );370 }371 372 if ( ! $cropped || is_wp_error( $cropped ) ) {373 wp_die( __( 'Image could not be processed. Please go back and try again.' ), __( 'Image Processing Error' ) );374 }375 376 $object = $this->create_attachment_object( $cropped, $attachment_id );377 378 if ( $create_new_attachement ) {379 unset( $object['ID'] );380 }381 382 // Update the attachment.383 add_filter( 'intermediate_image_sizes_advanced', array( $this, 'additional_sizes' ) );384 $attachment_id = $this->insert_attachment( $object, $cropped );385 remove_filter( 'intermediate_image_sizes_advanced', array( $this, 'additional_sizes' ) );386 387 // Save the site_icon data into option388 update_option( 'site_icon', $attachment_id );389 }390 391 add_settings_error( 'site-icon', 'icon-updated', __( 'Site Icon updated.' ), 'updated' );392 }393 394 /**395 * Handles uploading the file to be cropped in the second step.396 *397 * @since 4.3.0398 * @access public399 */400 public function handle_upload() {401 $uploaded_file = $_FILES['site-icon'];402 $file_type = wp_check_filetype_and_ext( $uploaded_file['tmp_name'], $uploaded_file['name'] );403 if ( ! wp_match_mime_types( 'image', $file_type['type'] ) ) {404 wp_die( __( 'The uploaded file is not a valid image. Please try again.' ) );405 }406 407 $file = wp_handle_upload( $uploaded_file, array( 'test_form' => false ) );408 409 if ( isset( $file['error'] ) ) {410 wp_die( $file['error'], __( 'Image Upload Error' ) );411 }412 413 $url = $file['url'];414 $type = $file['type'];415 $file = $file['file'];416 $filename = basename( $file );417 418 // Construct the object array419 $object = array(420 'post_title' => $filename,421 'post_content' => $url,422 'post_mime_type' => $type,423 'guid' => $url,424 'context' => 'site-icon',425 );426 427 // Save the data428 $attachment_id = wp_insert_attachment( $object, $file );429 430 return compact( 'attachment_id', 'file', 'filename', 'url', 'type' );431 70 } 432 71 … … 566 205 567 206 /** 568 * Deletes all additional image sizes, used for site icons.569 *570 * @since 4.3.0571 * @access public572 *573 * @return bool Whether the site icon was successfully deleted.574 */575 public function delete_site_icon() {576 // We add the filter to make sure that we also delete all the added images.577 add_filter( 'intermediate_image_sizes', array( $this, 'intermediate_image_sizes' ) );578 wp_delete_attachment( get_option( 'site_icon' ), true );579 remove_filter( 'intermediate_image_sizes', array( $this, 'intermediate_image_sizes' ) );580 581 return delete_option( 'site_icon' );582 }583 584 /**585 207 * Deletes the Site Icon when the image file is deleted. 586 208 * … … 620 242 return $value; 621 243 } 622 623 /**624 * Gets the data required to work with the uploaded image625 *626 * @since 4.3.0627 * @access private628 *629 * @return array containing the collected data630 */631 private function get_upload_data() {632 if ( isset( $_GET['file'] ) ) {633 $attachment_id = absint( $_GET['file'] );634 $file = get_attached_file( $attachment_id, true );635 $url = wp_get_attachment_image_src( $attachment_id, 'full' );636 $url = $url[0];637 } else {638 $upload = $this->handle_upload();639 $attachment_id = $upload['attachment_id'];640 $file = $upload['file'];641 $url = $upload['url'];642 }643 644 $image_size = getimagesize( $file );645 646 return array( $attachment_id, $url, $image_size );647 }648 244 } 649 245 -
trunk/src/wp-admin/js/customize-controls.js
r33324 r33329 2039 2039 */ 2040 2040 api.SiteIconControl = api.CroppedImageControl.extend({ 2041 2042 /** 2043 * Create a media modal select frame, and store it so the instance can be reused when needed. 2044 */ 2045 initFrame: function() { 2046 var l10n = _wpMediaViewsL10n; 2047 2048 this.frame = wp.media({ 2049 button: { 2050 text: l10n.select, 2051 close: false 2052 }, 2053 states: [ 2054 new wp.media.controller.Library({ 2055 title: this.params.button_labels.frame_title, 2056 library: wp.media.query({ type: 'image' }), 2057 multiple: false, 2058 date: false, 2059 priority: 20, 2060 suggestedWidth: this.params.width, 2061 suggestedHeight: this.params.height 2062 }), 2063 new wp.media.controller.SiteIconCropper({ 2064 imgSelectOptions: this.calculateImageSelectOptions, 2065 control: this 2066 }) 2067 ] 2068 }); 2069 2070 this.frame.on( 'select', this.onSelect, this ); 2071 this.frame.on( 'cropped', this.onCropped, this ); 2072 this.frame.on( 'skippedcrop', this.onSkippedCrop, this ); 2073 }, 2074 2041 2075 /** 2042 2076 * Updates the setting and re-renders the control UI. -
trunk/src/wp-admin/options-general.php
r33180 r33329 124 124 <td><input name="blogdescription" type="text" id="blogdescription" aria-describedby="tagline-description" value="<?php form_option('blogdescription'); ?>" class="regular-text" /> 125 125 <p class="description" id="tagline-description"><?php _e( 'In a few words, explain what this site is about.' ) ?></p></td> 126 </tr>127 <tr>128 <th scope="row"><?php _e( 'Site Icon' ); ?></th>129 <td>130 <?php131 $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" alt="" />147 <p class="hide-if-no-js">148 <button type="button" id="choose-from-library-link" class="button" data-size="<?php echo absint( $GLOBALS['wp_site_icon']->min_size ); ?>" data-update-link="<?php echo esc_attr( $update_url ); ?>" data-choose="<?php esc_attr_e( 'Choose a Site Icon' ); ?>" data-update="<?php esc_attr_e( 'Set as Site Icon' ); ?>"><?php _e( 'Update Site Icon' ); ?></button>149 <a href="<?php echo esc_url( $remove_url ); ?>"><?php _e( 'Remove Site Icon' ); ?></a>150 </p>151 <p class="hide-if-js">152 <a href="<?php echo esc_url( $upload_url ); ?>" class="button"><?php _e( 'Update Site Icon' ); ?></a>153 <a href="<?php echo esc_url( $remove_url ); ?>"><?php _e( 'Remove Site Icon' ); ?></a>154 </p>155 156 <?php else : ?>157 158 <p class="hide-if-no-js">159 <button type="button" id="choose-from-library-link" class="button" data-size="<?php echo absint( $GLOBALS['wp_site_icon']->min_size ); ?>" data-update-link="<?php echo esc_attr( $update_url ); ?>" data-choose="<?php esc_attr_e( 'Choose a Site Icon' ); ?>" data-update="<?php esc_attr_e( 'Set as Site Icon' ); ?>" aria-label="<?php esc_attr_e( 'Choose an image from your media library' ); ?>" aria-describedby="site-icon-description"><?php _e( 'Choose Image' ); ?></button>160 </p>161 <a class="button hide-if-js" href="<?php echo esc_url( $upload_url ); ?>"><?php _e( 'Add a Site Icon' ); ?></a>162 163 <?php endif; ?>164 <p id="site-icon-description" class="description"><?php _e( 'The Site Icon is used as a browser and app icon for your site.' ); ?></p>165 </td>166 126 </tr> 167 127 <?php if ( !is_multisite() ) { ?> -
trunk/src/wp-includes/class-wp-customize-manager.php
r33217 r33329 1358 1358 ) ); 1359 1359 1360 $icon = wp_get_attachment_image_src( absint( get_option( 'site_icon' ) ), 'full' );1361 1360 $this->add_setting( 'site_icon', array( 1362 'default' => $icon[0] ? $icon[0] : '',1363 1361 'type' => 'option', 1364 1362 'capability' => 'manage_options', -
trunk/src/wp-includes/css/media-views.css
r32952 r33329 697 697 } 698 698 699 .wp-customizer:not(.mobile) .media-frame-content .crop-content.site-icon { 700 margin-right: 300px; 701 } 702 699 703 .media-frame-content .crop-content .crop-image { 700 704 display: block; … … 2476 2480 @media only screen and (max-width: 480px) { 2477 2481 .media-modal-close { 2478 top: 5px; 2479 right: 5px; 2482 top: -5px; 2480 2483 } 2481 2484 2482 2485 .media-modal .media-frame-title { 2483 2486 height: 40px; 2487 } 2488 2489 .wp-core-ui.wp-customizer .media-button { 2490 margin-top: 13px; 2484 2491 } 2485 2492 -
trunk/src/wp-includes/js/customize-views.js
r33154 r33329 3 3 if ( ! wp || ! wp.customize ) { return; } 4 4 var api = wp.customize; 5 6 /**7 * Use a custom ajax action for cropped image controls.8 */9 wp.media.controller.customizeImageCropper = wp.media.controller.Cropper.extend( {10 doCrop: function( attachment ) {11 var cropDetails = attachment.get( 'cropDetails' ),12 control = this.get( 'control' );13 14 cropDetails.dst_width = control.params.width;15 cropDetails.dst_height = control.params.height;16 17 return wp.ajax.post( 'crop-image', {18 wp_customize: 'on',19 nonce: attachment.get( 'nonces' ).edit,20 id: attachment.get( 'id' ),21 context: control.id,22 cropDetails: cropDetails23 } );24 }25 } );26 5 27 6 /** -
trunk/src/wp-includes/js/imgareaselect/jquery.imgareaselect.js
r25545 r33329 1 1 /* 2 2 * imgAreaSelect jQuery plugin 3 * version 0.9.10 3 * version 0.9.10-monkey 4 4 * 5 5 * Copyright (c) 2008-2013 Michal Wojciechowski (odyniec.net) … … 190 190 */ 191 191 function evX(event) { 192 return event.pageX- parOfs.left;192 return max(event.pageX || 0, touchCoords(event).x) - parOfs.left; 193 193 } 194 194 … … 201 201 */ 202 202 function evY(event) { 203 return event.pageY - parOfs.top; 203 return max(event.pageY || 0, touchCoords(event).y) - parOfs.top; 204 } 205 206 /** 207 * Get X and Y coordinates of a touch event 208 * 209 * @param event 210 * The event object 211 * @return Coordinates object 212 */ 213 function touchCoords(event) { 214 var oev = event.originalEvent || {}; 215 216 if (oev.touches && oev.touches.length) 217 return { x: oev.touches[0].pageX, y: oev.touches[0].pageY }; 218 else 219 return { x: 0, y: 0 }; 204 220 } 205 221 … … 487 503 hide($box.add($outer), function () { $(this).hide(); }); 488 504 489 $(document). unbind('mousemove', selectingMouseMove);490 $box. mousemove(areaMouseMove);505 $(document).off('mousemove touchmove', selectingMouseMove); 506 $box.on('mousemove touchmove', areaMouseMove); 491 507 492 508 options.onSelectEnd(img, getSelection()); … … 501 517 */ 502 518 function areaMouseDown(event) { 503 if (event.which != 1) return false; 519 if (event.type == 'mousedown' && event.which != 1) return false; 520 521 /* 522 * With mobile browsers, there is no "moving the pointer over" action, 523 * so we need to simulate one mousemove event happening prior to 524 * mousedown/touchstart. 525 */ 526 areaMouseMove(event); 504 527 505 528 adjust(); … … 512 535 y1 = viewY(selection[/n/.test(resize) ? 'y2' : 'y1']); 513 536 514 $(document). mousemove(selectingMouseMove)515 .one('mouseup ', docMouseUp);516 $box. unbind('mousemove', areaMouseMove);537 $(document).on('mousemove touchmove', selectingMouseMove) 538 .one('mouseup touchend', docMouseUp); 539 $box.off('mousemove touchmove', areaMouseMove); 517 540 } 518 541 else if (options.movable) { … … 520 543 startY = top + selection.y1 - evY(event); 521 544 522 $box. unbind('mousemove', areaMouseMove);523 524 $(document). mousemove(movingMouseMove)525 .one('mouseup ', function () {545 $box.off('mousemove touchmove', areaMouseMove); 546 547 $(document).on('mousemove touchmove', movingMouseMove) 548 .one('mouseup touchend', function () { 526 549 options.onSelectEnd(img, getSelection()); 527 550 528 $(document). unbind('mousemove', movingMouseMove);529 $box. mousemove(areaMouseMove);551 $(document).off('mousemove touchmove', movingMouseMove); 552 $box.on('mousemove touchmove', areaMouseMove); 530 553 }); 531 554 } … … 677 700 */ 678 701 function startSelection() { 679 $(document). unbind('mousemove', startSelection);702 $(document).off('mousemove touchmove', startSelection); 680 703 adjust(); 681 704 … … 692 715 shown = true; 693 716 694 $(document).unbind('mouseup', cancelSelection) 695 .mousemove(selectingMouseMove).one('mouseup', docMouseUp); 696 $box.unbind('mousemove', areaMouseMove); 717 $(document).off('mouseup touchend', cancelSelection) 718 .on('mousemove touchmove', selectingMouseMove) 719 .one('mouseup touchend', docMouseUp); 720 $box.off('mousemove touchmove', areaMouseMove); 697 721 698 722 options.onSelectStart(img, getSelection()); … … 703 727 */ 704 728 function cancelSelection() { 705 $(document). unbind('mousemove', startSelection)706 . unbind('mouseup', cancelSelection);729 $(document).off('mousemove touchmove', startSelection) 730 .off('mouseup touchend', cancelSelection); 707 731 hide($box.add($outer)); 708 732 … … 732 756 733 757 /* Selection will start when the mouse is moved */ 734 $(document).mousemove(startSelection).mouseup(cancelSelection); 758 $(document).on({ 'mousemove touchmove': startSelection, 759 'mouseup touchend': cancelSelection }); 735 760 736 761 return false; … … 990 1015 if (options.disable || options.enable === false) { 991 1016 /* Disable the plugin */ 992 $box.unbind('mousemove', areaMouseMove).unbind('mousedown', areaMouseDown); 993 $(window).unbind('resize', windowResize); 1017 $box.off({ 'mousemove touchmove': areaMouseMove, 1018 'mousedown touchstart': areaMouseDown }); 1019 $(window).off('resize', windowResize); 994 1020 } 995 1021 else { … … 997 1023 /* Enable the plugin */ 998 1024 if (options.resizable || options.movable) 999 $box.mousemove(areaMouseMove).mousedown(areaMouseDown); 1025 $box.on({ 'mousemove touchmove': areaMouseMove, 1026 'mousedown touchstart': areaMouseDown }); 1000 1027 1001 1028 $(window).resize(windowResize); … … 1003 1030 1004 1031 if (!options.persistent) 1005 $img.add($outer). mousedown(imgMouseDown);1032 $img.add($outer).on('mousedown touchstart', imgMouseDown); 1006 1033 } 1007 1034 -
trunk/src/wp-includes/js/imgareaselect/jquery.imgareaselect.min.js
r25545 r33329 1 (function($){var abs=Math.abs,max=Math.max,min=Math.min,round=Math.round;function div(){return $('<div/>')}$.imgAreaSelect=function(img,options){var $img=$(img),imgLoaded,$box=div(),$area=div(),$border=div().add(div()).add(div()).add(div()),$outer=div().add(div()).add(div()).add(div()),$handles=$([]),$areaOpera,left,top,imgOfs={left:0,top:0},imgWidth,imgHeight,$parent,parOfs={left:0,top:0},zIndex=0,position='absolute',startX,startY,scaleX,scaleY,resize,minWidth,minHeight,maxWidth,maxHeight,aspectRatio,shown,x1,y1,x2,y2,selection={x1:0,y1:0,x2:0,y2:0,width:0,height:0},docElem=document.documentElement,ua=navigator.userAgent,$p,d,i,o,w,h,adjusted;function viewX(x){return x+imgOfs.left-parOfs.left}function viewY(y){return y+imgOfs.top-parOfs.top}function selX(x){return x-imgOfs.left+parOfs.left}function selY(y){return y-imgOfs.top+parOfs.top}function evX(event){return event.pageX-parOfs.left}function evY(event){return event.pageY-parOfs.top}function getSelection(noScale){var sx=noScale||scaleX,sy=noScale||scaleY;return{x1:round(selection.x1*sx),y1:round(selection.y1*sy),x2:round(selection.x2*sx),y2:round(selection.y2*sy),width:round(selection.x2*sx)-round(selection.x1*sx),height:round(selection.y2*sy)-round(selection.y1*sy)}}function setSelection(x1,y1,x2,y2,noScale){var sx=noScale||scaleX,sy=noScale||scaleY;selection={x1:round(x1/sx||0),y1:round(y1/sy||0),x2:round(x2/sx||0),y2:round(y2/sy||0)};selection.width=selection.x2-selection.x1;selection.height=selection.y2-selection.y1}function adjust(){if(!imgLoaded||!$img.width())return;imgOfs={left:round($img.offset().left),top:round($img.offset().top)};imgWidth=$img.innerWidth();imgHeight=$img.innerHeight();imgOfs.top+=($img.outerHeight()-imgHeight)>>1;imgOfs.left+=($img.outerWidth()-imgWidth)>>1;minWidth=round(options.minWidth/scaleX)||0;minHeight=round(options.minHeight/scaleY)||0;maxWidth=round(min(options.maxWidth/scaleX||1<<24,imgWidth));maxHeight=round(min(options.maxHeight/scaleY||1<<24,imgHeight));if($().jquery=='1.3.2'&&position=='fixed'&&!docElem['getBoundingClientRect']){imgOfs.top+=max(document.body.scrollTop,docElem.scrollTop);imgOfs.left+=max(document.body.scrollLeft,docElem.scrollLeft)}parOfs=/absolute|relative/.test($parent.css('position'))?{left:round($parent.offset().left)-$parent.scrollLeft(),top:round($parent.offset().top)-$parent.scrollTop()}:position=='fixed'?{left:$(document).scrollLeft(),top:$(document).scrollTop()}:{left:0,top:0};left=viewX(0);top=viewY(0);if(selection.x2>imgWidth||selection.y2>imgHeight)doResize()}function update(resetKeyPress){if(!shown)return;$box.css({left:viewX(selection.x1),top:viewY(selection.y1)}).add($area).width(w=selection.width).height(h=selection.height);$area.add($border).add($handles).css({left:0,top:0});$border.width(max(w-$border.outerWidth()+$border.innerWidth(),0)).height(max(h-$border.outerHeight()+$border.innerHeight(),0));$($outer[0]).css({left:left,top:top,width:selection.x1,height:imgHeight});$($outer[1]).css({left:left+selection.x1,top:top,width:w,height:selection.y1});$($outer[2]).css({left:left+selection.x2,top:top,width:imgWidth-selection.x2,height:imgHeight});$($outer[3]).css({left:left+selection.x1,top:top+selection.y2,width:w,height:imgHeight-selection.y2});w-=$handles.outerWidth();h-=$handles.outerHeight();switch($handles.length){case 8:$($handles[4]).css({left:w>>1});$($handles[5]).css({left:w,top:h>>1});$($handles[6]).css({left:w>>1,top:h});$($handles[7]).css({top:h>>1});case 4:$handles.slice(1,3).css({left:w});$handles.slice(2,4).css({top:h})}if(resetKeyPress!==false){if($.imgAreaSelect.onKeyPress!=docKeyPress)$(document).unbind($.imgAreaSelect.keyPress,$.imgAreaSelect.onKeyPress);if(options.keys)$(document)[$.imgAreaSelect.keyPress]($.imgAreaSelect.onKeyPress=docKeyPress)}if(msie&&$border.outerWidth()-$border.innerWidth()==2){$border.css('margin',0);setTimeout(function(){$border.css('margin','auto')},0)}}function doUpdate(resetKeyPress){adjust();update(resetKeyPress);x1=viewX(selection.x1);y1=viewY(selection.y1);x2=viewX(selection.x2);y2=viewY(selection.y2)}function hide($elem,fn){options.fadeSpeed?$elem.fadeOut(options.fadeSpeed,fn):$elem.hide()}function areaMouseMove(event){var x=selX(evX(event))-selection.x1,y=selY(evY(event))-selection.y1;if(!adjusted){adjust();adjusted=true;$box.one('mouseout',function(){adjusted=false})}resize='';if(options.resizable){if(y<=options.resizeMargin)resize='n';else if(y>=selection.height-options.resizeMargin)resize='s';if(x<=options.resizeMargin)resize+='w';else if(x>=selection.width-options.resizeMargin)resize+='e'}$box.css('cursor',resize?resize+'-resize':options.movable?'move':'');if($areaOpera)$areaOpera.toggle()}function docMouseUp(event){$('body').css('cursor','');if(options.autoHide||selection.width*selection.height==0)hide($box.add($outer),function(){$(this).hide()});$(document).unbind('mousemove',selectingMouseMove);$box.mousemove(areaMouseMove);options.onSelectEnd(img,getSelection())}function areaMouseDown(event){if(event.which!=1)return false;adjust();if(resize){$('body').css('cursor',resize+'-resize');x1=viewX(selection[/w/.test(resize)?'x2':'x1']);y1=viewY(selection[/n/.test(resize)?'y2':'y1']);$(document).mousemove(selectingMouseMove).one('mouseup',docMouseUp);$box.unbind('mousemove',areaMouseMove)}else if(options.movable){startX=left+selection.x1-evX(event);startY=top+selection.y1-evY(event);$box.unbind('mousemove',areaMouseMove);$(document).mousemove(movingMouseMove).one('mouseup',function(){options.onSelectEnd(img,getSelection());$(document).unbind('mousemove',movingMouseMove);$box.mousemove(areaMouseMove)})}else $img.mousedown(event);return false}function fixAspectRatio(xFirst){if(aspectRatio)if(xFirst){x2=max(left,min(left+imgWidth,x1+abs(y2-y1)*aspectRatio*(x2>x1||-1)));y2=round(max(top,min(top+imgHeight,y1+abs(x2-x1)/aspectRatio*(y2>y1||-1))));x2=round(x2)}else{y2=max(top,min(top+imgHeight,y1+abs(x2-x1)/aspectRatio*(y2>y1||-1)));x2=round(max(left,min(left+imgWidth,x1+abs(y2-y1)*aspectRatio*(x2>x1||-1))));y2=round(y2)}}function doResize(){x1=min(x1,left+imgWidth);y1=min(y1,top+imgHeight);if(abs(x2-x1)<minWidth){x2=x1-minWidth*(x2<x1||-1);if(x2<left)x1=left+minWidth;else if(x2>left+imgWidth)x1=left+imgWidth-minWidth}if(abs(y2-y1)<minHeight){y2=y1-minHeight*(y2<y1||-1);if(y2<top)y1=top+minHeight;else if(y2>top+imgHeight)y1=top+imgHeight-minHeight}x2=max(left,min(x2,left+imgWidth));y2=max(top,min(y2,top+imgHeight));fixAspectRatio(abs(x2-x1)<abs(y2-y1)*aspectRatio);if(abs(x2-x1)>maxWidth){x2=x1-maxWidth*(x2<x1||-1);fixAspectRatio()}if(abs(y2-y1)>maxHeight){y2=y1-maxHeight*(y2<y1||-1);fixAspectRatio(true)}selection={x1:selX(min(x1,x2)),x2:selX(max(x1,x2)),y1:selY(min(y1,y2)),y2:selY(max(y1,y2)),width:abs(x2-x1),height:abs(y2-y1)};update();options.onSelectChange(img,getSelection())}function selectingMouseMove(event){x2=/w|e|^$/.test(resize)||aspectRatio?evX(event):viewX(selection.x2);y2=/n|s|^$/.test(resize)||aspectRatio?evY(event):viewY(selection.y2);doResize();return false}function doMove(newX1,newY1){x2=(x1=newX1)+selection.width;y2=(y1=newY1)+selection.height;$.extend(selection,{x1:selX(x1),y1:selY(y1),x2:selX(x2),y2:selY(y2)});update();options.onSelectChange(img,getSelection())}function movingMouseMove(event){x1=max(left,min(startX+evX(event),left+imgWidth-selection.width));y1=max(top,min(startY+evY(event),top+imgHeight-selection.height));doMove(x1,y1);event.preventDefault();return false}function startSelection(){$(document).unbind('mousemove',startSelection);adjust();x2=x1;y2=y1;doResize();resize='';if(!$outer.is(':visible'))$box.add($outer).hide().fadeIn(options.fadeSpeed||0);shown=true;$(document).unbind('mouseup',cancelSelection).mousemove(selectingMouseMove).one('mouseup',docMouseUp);$box.unbind('mousemove',areaMouseMove);options.onSelectStart(img,getSelection())}function cancelSelection(){$(document).unbind('mousemove',startSelection).unbind('mouseup',cancelSelection);hide($box.add($outer));setSelection(selX(x1),selY(y1),selX(x1),selY(y1));if(!(this instanceof $.imgAreaSelect)){options.onSelectChange(img,getSelection());options.onSelectEnd(img,getSelection())}}function imgMouseDown(event){if(event.which!=1||$outer.is(':animated'))return false;adjust();startX=x1=evX(event);startY=y1=evY(event);$(document).mousemove(startSelection).mouseup(cancelSelection);return false}function windowResize(){doUpdate(false)}function imgLoad(){imgLoaded=true;setOptions(options=$.extend({classPrefix:'imgareaselect',movable:true,parent:'body',resizable:true,resizeMargin:10,onInit:function(){},onSelectStart:function(){},onSelectChange:function(){},onSelectEnd:function(){}},options));$box.add($outer).css({visibility:''});if(options.show){shown=true;adjust();update();$box.add($outer).hide().fadeIn(options.fadeSpeed||0)}setTimeout(function(){options.onInit(img,getSelection())},0)}var docKeyPress=function(event){var k=options.keys,d,t,key=event.keyCode;d=!isNaN(k.alt)&&(event.altKey||event.originalEvent.altKey)?k.alt:!isNaN(k.ctrl)&&event.ctrlKey?k.ctrl:!isNaN(k.shift)&&event.shiftKey?k.shift:!isNaN(k.arrows)?k.arrows:10;if(k.arrows=='resize'||(k.shift=='resize'&&event.shiftKey)||(k.ctrl=='resize'&&event.ctrlKey)||(k.alt=='resize'&&(event.altKey||event.originalEvent.altKey))){switch(key){case 37:d=-d;case 39:t=max(x1,x2);x1=min(x1,x2);x2=max(t+d,x1);fixAspectRatio();break;case 38:d=-d;case 40:t=max(y1,y2);y1=min(y1,y2);y2=max(t+d,y1);fixAspectRatio(true);break;default:return}doResize()}else{x1=min(x1,x2);y1=min(y1,y2);switch(key){case 37:doMove(max(x1-d,left),y1);break;case 38:doMove(x1,max(y1-d,top));break;case 39:doMove(x1+min(d,imgWidth-selX(x2)),y1);break;case 40:doMove(x1,y1+min(d,imgHeight-selY(y2)));break;default:return}}return false};function styleOptions($elem,props){for(var option in props)if(options[option]!==undefined)$elem.css(props[option],options[option])}function setOptions(newOptions){if(newOptions.parent)($parent=$(newOptions.parent)).append($box.add($outer));$.extend(options,newOptions);adjust();if(newOptions.handles!=null){$handles.remove();$handles=$([]);i=newOptions.handles?newOptions.handles=='corners'?4:8:0;while(i--)$handles=$handles.add(div());$handles.addClass(options.classPrefix+'-handle').css({position:'absolute',fontSize:0,zIndex:zIndex+1||1});if(!parseInt($handles.css('width'))>=0)$handles.width(5).height(5);if(o=options.borderWidth)$handles.css({borderWidth:o,borderStyle:'solid'});styleOptions($handles,{borderColor1:'border-color',borderColor2:'background-color',borderOpacity:'opacity'})}scaleX=options.imageWidth/imgWidth||1;scaleY=options.imageHeight/imgHeight||1;if(newOptions.x1!=null){setSelection(newOptions.x1,newOptions.y1,newOptions.x2,newOptions.y2);newOptions.show=!newOptions.hide}if(newOptions.keys)options.keys=$.extend({shift:1,ctrl:'resize'},newOptions.keys);$outer.addClass(options.classPrefix+'-outer');$area.addClass(options.classPrefix+'-selection');for(i=0;i++<4;)$($border[i-1]).addClass(options.classPrefix+'-border'+i);styleOptions($area,{selectionColor:'background-color',selectionOpacity:'opacity'});styleOptions($border,{borderOpacity:'opacity',borderWidth:'border-width'});styleOptions($outer,{outerColor:'background-color',outerOpacity:'opacity'});if(o=options.borderColor1)$($border[0]).css({borderStyle:'solid',borderColor:o});if(o=options.borderColor2)$($border[1]).css({borderStyle:'dashed',borderColor:o});$box.append($area.add($border).add($areaOpera)).append($handles);if(msie){if(o=($outer.css('filter')||'').match(/opacity=(\d+)/))$outer.css('opacity',o[1]/100);if(o=($border.css('filter')||'').match(/opacity=(\d+)/))$border.css('opacity',o[1]/100)}if(newOptions.hide)hide($box.add($outer));else if(newOptions.show&&imgLoaded){shown=true;$box.add($outer).fadeIn(options.fadeSpeed||0);doUpdate()}aspectRatio=(d=(options.aspectRatio||'').split(/:/))[0]/d[1];$img.add($outer).unbind('mousedown',imgMouseDown);if(options.disable||options.enable===false){$box.unbind('mousemove',areaMouseMove).unbind('mousedown',areaMouseDown);$(window).unbind('resize',windowResize)}else{if(options.enable||options.disable===false){if(options.resizable||options.movable)$box.mousemove(areaMouseMove).mousedown(areaMouseDown);$(window).resize(windowResize)}if(!options.persistent)$img.add($outer).mousedown(imgMouseDown)}options.enable=options.disable=undefined}this.remove=function(){setOptions({disable:true});$box.add($outer).remove()};this.getOptions=function(){return options};this.setOptions=setOptions;this.getSelection=getSelection;this.setSelection=setSelection;this.cancelSelection=cancelSelection;this.update=doUpdate;var msie=(/msie ([\w.]+)/i.exec(ua)||[])[1],opera=/opera/i.test(ua),safari=/webkit/i.test(ua)&&!/chrome/i.test(ua);$p=$img;while($p.length){zIndex=max(zIndex,!isNaN($p.css('z-index'))?$p.css('z-index'):zIndex);if($p.css('position')=='fixed')position='fixed';$p=$p.parent(':not(body)')}zIndex=options.zIndex||zIndex;if(msie)$img.attr('unselectable','on');$.imgAreaSelect.keyPress=msie||safari?'keydown':'keypress';if(opera)$areaOpera=div().css({width:'100%',height:'100%',position:'absolute',zIndex:zIndex+2||2});$box.add($outer).css({visibility:'hidden',position:position,overflow:'hidden',zIndex:zIndex||'0'});$box.css({zIndex:zIndex+2||2});$area.add($border).css({position:'absolute',fontSize:0});img.complete||img.readyState=='complete'||!$img.is('img')?imgLoad():$img.one('load',imgLoad);if(!imgLoaded&&msie&&msie>=7)img.src=img.src};$.fn.imgAreaSelect=function(options){options=options||{};this.each(function(){if($(this).data('imgAreaSelect')){if(options.remove){$(this).data('imgAreaSelect').remove();$(this).removeData('imgAreaSelect')}else $(this).data('imgAreaSelect').setOptions(options)}else if(!options.remove){if(options.enable===undefined&&options.disable===undefined)options.enable=true;$(this).data('imgAreaSelect',new $.imgAreaSelect(this,options))}});if(options.instance)return $(this).data('imgAreaSelect');return this}})(jQuery);1 !function(e){function t(){return e("<div/>")}var o=Math.abs,i=Math.max,s=Math.min,n=Math.round;e.imgAreaSelect=function(r,c){function d(e){return e+gt.left-vt.left}function a(e){return e+gt.top-vt.top}function u(e){return e-gt.left+vt.left}function l(e){return e-gt.top+vt.top}function h(e){return i(e.pageX||0,m(e).x)-vt.left}function f(e){return i(e.pageY||0,m(e).y)-vt.top}function m(e){var t=e.originalEvent||{};return t.touches&&t.touches.length?{x:t.touches[0].pageX,y:t.touches[0].pageY}:{x:0,y:0}}function p(e){var t=e||B,o=e||Q;return{x1:n(wt.x1*t),y1:n(wt.y1*o),x2:n(wt.x2*t),y2:n(wt.y2*o),width:n(wt.x2*t)-n(wt.x1*t),height:n(wt.y2*o)-n(wt.y1*o)}}function y(e,t,o,i,s){var r=s||B,c=s||Q;wt={x1:n(e/r||0),y1:n(t/c||0),x2:n(o/r||0),y2:n(i/c||0)},wt.width=wt.x2-wt.x1,wt.height=wt.y2-wt.y1}function g(){T&<.width()&&(gt={left:n(lt.offset().left),top:n(lt.offset().top)},R=lt.innerWidth(),X=lt.innerHeight(),gt.top+=lt.outerHeight()-X>>1,gt.left+=lt.outerWidth()-R>>1,G=n(c.minWidth/B)||0,J=n(c.minHeight/Q)||0,U=n(s(c.maxWidth/B||1<<24,R)),V=n(s(c.maxHeight/Q||1<<24,X)),"1.3.2"!=e().jquery||"fixed"!=xt||St.getBoundingClientRect||(gt.top+=i(document.body.scrollTop,St.scrollTop),gt.left+=i(document.body.scrollLeft,St.scrollLeft)),vt=/absolute|relative/.test(Y.css("position"))?{left:n(Y.offset().left)-Y.scrollLeft(),top:n(Y.offset().top)-Y.scrollTop()}:"fixed"==xt?{left:e(document).scrollLeft(),top:e(document).scrollTop()}:{left:0,top:0},j=d(0),D=a(0),(wt.x2>R||wt.y2>X)&&C())}function v(t){if(_){switch(ht.css({left:d(wt.x1),top:a(wt.y1)}).add(ft).width(dt=wt.width).height(at=wt.height),ft.add(mt).add(yt).css({left:0,top:0}),mt.width(i(dt-mt.outerWidth()+mt.innerWidth(),0)).height(i(at-mt.outerHeight()+mt.innerHeight(),0)),e(pt[0]).css({left:j,top:D,width:wt.x1,height:X}),e(pt[1]).css({left:j+wt.x1,top:D,width:dt,height:wt.y1}),e(pt[2]).css({left:j+wt.x2,top:D,width:R-wt.x2,height:X}),e(pt[3]).css({left:j+wt.x1,top:D+wt.y2,width:dt,height:X-wt.y2}),dt-=yt.outerWidth(),at-=yt.outerHeight(),yt.length){case 8:e(yt[4]).css({left:dt>>1}),e(yt[5]).css({left:dt,top:at>>1}),e(yt[6]).css({left:dt>>1,top:at}),e(yt[7]).css({top:at>>1});case 4:yt.slice(1,3).css({left:dt}),yt.slice(2,4).css({top:at})}t!==!1&&(e.imgAreaSelect.onKeyPress!=kt&&e(document).unbind(e.imgAreaSelect.keyPress,e.imgAreaSelect.onKeyPress),c.keys&&e(document)[e.imgAreaSelect.keyPress](e.imgAreaSelect.onKeyPress=kt)),Ct&&mt.outerWidth()-mt.innerWidth()==2&&(mt.css("margin",0),setTimeout(function(){mt.css("margin","auto")},0))}}function b(e){g(),v(e),et=d(wt.x1),tt=a(wt.y1),ot=d(wt.x2),it=a(wt.y2)}function x(e,t){c.fadeSpeed?e.fadeOut(c.fadeSpeed,t):e.hide()}function w(e){var t=u(h(e))-wt.x1,o=l(f(e))-wt.y1;ut||(g(),ut=!0,ht.one("mouseout",function(){ut=!1})),F="",c.resizable&&(o<=c.resizeMargin?F="n":o>=wt.height-c.resizeMargin&&(F="s"),t<=c.resizeMargin?F+="w":t>=wt.width-c.resizeMargin&&(F+="e")),ht.css("cursor",F?F+"-resize":c.movable?"move":""),L&&L.toggle()}function S(){e("body").css("cursor",""),(c.autoHide||wt.width*wt.height==0)&&x(ht.add(pt),function(){e(this).hide()}),e(document).off("mousemove touchmove",A),ht.on("mousemove touchmove",w),c.onSelectEnd(r,p())}function z(t){return"mousedown"==t.type&&1!=t.which?!1:(w(t),g(),F?(e("body").css("cursor",F+"-resize"),et=d(wt[/w/.test(F)?"x2":"x1"]),tt=a(wt[/n/.test(F)?"y2":"y1"]),e(document).on("mousemove touchmove",A).one("mouseup touchend",S),ht.off("mousemove touchmove",w)):c.movable?($=j+wt.x1-h(t),q=D+wt.y1-f(t),ht.off("mousemove touchmove",w),e(document).on("mousemove touchmove",I).one("mouseup touchend",function(){c.onSelectEnd(r,p()),e(document).off("mousemove touchmove",I),ht.on("mousemove touchmove",w)})):lt.mousedown(t),!1)}function k(e){Z&&(e?(ot=i(j,s(j+R,et+o(it-tt)*Z*(ot>et||-1))),it=n(i(D,s(D+X,tt+o(ot-et)/Z*(it>tt||-1)))),ot=n(ot)):(it=i(D,s(D+X,tt+o(ot-et)/Z*(it>tt||-1))),ot=n(i(j,s(j+R,et+o(it-tt)*Z*(ot>et||-1)))),it=n(it)))}function C(){et=s(et,j+R),tt=s(tt,D+X),o(ot-et)<G&&(ot=et-G*(et>ot||-1),j>ot?et=j+G:ot>j+R&&(et=j+R-G)),o(it-tt)<J&&(it=tt-J*(tt>it||-1),D>it?tt=D+J:it>D+X&&(tt=D+X-J)),ot=i(j,s(ot,j+R)),it=i(D,s(it,D+X)),k(o(ot-et)<o(it-tt)*Z),o(ot-et)>U&&(ot=et-U*(et>ot||-1),k()),o(it-tt)>V&&(it=tt-V*(tt>it||-1),k(!0)),wt={x1:u(s(et,ot)),x2:u(i(et,ot)),y1:l(s(tt,it)),y2:l(i(tt,it)),width:o(ot-et),height:o(it-tt)},v(),c.onSelectChange(r,p())}function A(e){return ot=/w|e|^$/.test(F)||Z?h(e):d(wt.x2),it=/n|s|^$/.test(F)||Z?f(e):a(wt.y2),C(),!1}function W(t,o){ot=(et=t)+wt.width,it=(tt=o)+wt.height,e.extend(wt,{x1:u(et),y1:l(tt),x2:u(ot),y2:l(it)}),v(),c.onSelectChange(r,p())}function I(e){return et=i(j,s($+h(e),j+R-wt.width)),tt=i(D,s(q+f(e),D+X-wt.height)),W(et,tt),e.preventDefault(),!1}function K(){e(document).off("mousemove touchmove",K),g(),ot=et,it=tt,C(),F="",pt.is(":visible")||ht.add(pt).hide().fadeIn(c.fadeSpeed||0),_=!0,e(document).off("mouseup touchend",P).on("mousemove touchmove",A).one("mouseup touchend",S),ht.off("mousemove touchmove",w),c.onSelectStart(r,p())}function P(){e(document).off("mousemove touchmove",K).off("mouseup touchend",P),x(ht.add(pt)),y(u(et),l(tt),u(et),l(tt)),this instanceof e.imgAreaSelect||(c.onSelectChange(r,p()),c.onSelectEnd(r,p()))}function N(t){return 1!=t.which||pt.is(":animated")?!1:(g(),$=et=h(t),q=tt=f(t),e(document).on({"mousemove touchmove":K,"mouseup touchend":P}),!1)}function H(){b(!1)}function M(){T=!0,O(c=e.extend({classPrefix:"imgareaselect",movable:!0,parent:"body",resizable:!0,resizeMargin:10,onInit:function(){},onSelectStart:function(){},onSelectChange:function(){},onSelectEnd:function(){}},c)),ht.add(pt).css({visibility:""}),c.show&&(_=!0,g(),v(),ht.add(pt).hide().fadeIn(c.fadeSpeed||0)),setTimeout(function(){c.onInit(r,p())},0)}function E(e,t){for(var o in t)void 0!==c[o]&&e.css(t[o],c[o])}function O(o){if(o.parent&&(Y=e(o.parent)).append(ht.add(pt)),e.extend(c,o),g(),null!=o.handles){for(yt.remove(),yt=e([]),rt=o.handles?"corners"==o.handles?4:8:0;rt--;)yt=yt.add(t());yt.addClass(c.classPrefix+"-handle").css({position:"absolute",fontSize:0,zIndex:bt+1||1}),!parseInt(yt.css("width"))>=0&&yt.width(5).height(5),(ct=c.borderWidth)&&yt.css({borderWidth:ct,borderStyle:"solid"}),E(yt,{borderColor1:"border-color",borderColor2:"background-color",borderOpacity:"opacity"})}for(B=c.imageWidth/R||1,Q=c.imageHeight/X||1,null!=o.x1&&(y(o.x1,o.y1,o.x2,o.y2),o.show=!o.hide),o.keys&&(c.keys=e.extend({shift:1,ctrl:"resize"},o.keys)),pt.addClass(c.classPrefix+"-outer"),ft.addClass(c.classPrefix+"-selection"),rt=0;rt++<4;)e(mt[rt-1]).addClass(c.classPrefix+"-border"+rt);E(ft,{selectionColor:"background-color",selectionOpacity:"opacity"}),E(mt,{borderOpacity:"opacity",borderWidth:"border-width"}),E(pt,{outerColor:"background-color",outerOpacity:"opacity"}),(ct=c.borderColor1)&&e(mt[0]).css({borderStyle:"solid",borderColor:ct}),(ct=c.borderColor2)&&e(mt[1]).css({borderStyle:"dashed",borderColor:ct}),ht.append(ft.add(mt).add(L)).append(yt),Ct&&((ct=(pt.css("filter")||"").match(/opacity=(\d+)/))&&pt.css("opacity",ct[1]/100),(ct=(mt.css("filter")||"").match(/opacity=(\d+)/))&&mt.css("opacity",ct[1]/100)),o.hide?x(ht.add(pt)):o.show&&T&&(_=!0,ht.add(pt).fadeIn(c.fadeSpeed||0),b()),Z=(nt=(c.aspectRatio||"").split(/:/))[0]/nt[1],lt.add(pt).unbind("mousedown",N),c.disable||c.enable===!1?(ht.off({"mousemove touchmove":w,"mousedown touchstart":z}),e(window).off("resize",H)):((c.enable||c.disable===!1)&&((c.resizable||c.movable)&&ht.on({"mousemove touchmove":w,"mousedown touchstart":z}),e(window).resize(H)),c.persistent||lt.add(pt).on("mousedown touchstart",N)),c.enable=c.disable=void 0}var T,L,j,D,R,X,Y,$,q,B,Q,F,G,J,U,V,Z,_,et,tt,ot,it,st,nt,rt,ct,dt,at,ut,lt=e(r),ht=t(),ft=t(),mt=t().add(t()).add(t()).add(t()),pt=t().add(t()).add(t()).add(t()),yt=e([]),gt={left:0,top:0},vt={left:0,top:0},bt=0,xt="absolute",wt={x1:0,y1:0,x2:0,y2:0,width:0,height:0},St=document.documentElement,zt=navigator.userAgent,kt=function(e){var t,o,n=c.keys,r=e.keyCode;if(t=isNaN(n.alt)||!e.altKey&&!e.originalEvent.altKey?!isNaN(n.ctrl)&&e.ctrlKey?n.ctrl:!isNaN(n.shift)&&e.shiftKey?n.shift:isNaN(n.arrows)?10:n.arrows:n.alt,"resize"==n.arrows||"resize"==n.shift&&e.shiftKey||"resize"==n.ctrl&&e.ctrlKey||"resize"==n.alt&&(e.altKey||e.originalEvent.altKey)){switch(r){case 37:t=-t;case 39:o=i(et,ot),et=s(et,ot),ot=i(o+t,et),k();break;case 38:t=-t;case 40:o=i(tt,it),tt=s(tt,it),it=i(o+t,tt),k(!0);break;default:return}C()}else switch(et=s(et,ot),tt=s(tt,it),r){case 37:W(i(et-t,j),tt);break;case 38:W(et,i(tt-t,D));break;case 39:W(et+s(t,R-u(ot)),tt);break;case 40:W(et,tt+s(t,X-l(it)));break;default:return}return!1};this.remove=function(){O({disable:!0}),ht.add(pt).remove()},this.getOptions=function(){return c},this.setOptions=O,this.getSelection=p,this.setSelection=y,this.cancelSelection=P,this.update=b;var Ct=(/msie ([\w.]+)/i.exec(zt)||[])[1],At=/opera/i.test(zt),Wt=/webkit/i.test(zt)&&!/chrome/i.test(zt);for(st=lt;st.length;)bt=i(bt,isNaN(st.css("z-index"))?bt:st.css("z-index")),"fixed"==st.css("position")&&(xt="fixed"),st=st.parent(":not(body)");bt=c.zIndex||bt,Ct&<.attr("unselectable","on"),e.imgAreaSelect.keyPress=Ct||Wt?"keydown":"keypress",At&&(L=t().css({width:"100%",height:"100%",position:"absolute",zIndex:bt+2||2})),ht.add(pt).css({visibility:"hidden",position:xt,overflow:"hidden",zIndex:bt||"0"}),ht.css({zIndex:bt+2||2}),ft.add(mt).css({position:"absolute",fontSize:0}),r.complete||"complete"==r.readyState||!lt.is("img")?M():lt.one("load",M),!T&&Ct&&Ct>=7&&(r.src=r.src)},e.fn.imgAreaSelect=function(t){return t=t||{},this.each(function(){e(this).data("imgAreaSelect")?t.remove?(e(this).data("imgAreaSelect").remove(),e(this).removeData("imgAreaSelect")):e(this).data("imgAreaSelect").setOptions(t):t.remove||(void 0===t.enable&&void 0===t.disable&&(t.enable=!0),e(this).data("imgAreaSelect",new e.imgAreaSelect(this,t)))}),t.instance?e(this).data("imgAreaSelect"):this}}(jQuery); -
trunk/src/wp-includes/js/media-views.js
r32952 r33329 388 388 389 389 /** 390 * wp.media.controller.CustomizeImageCropper 391 * 392 * A state for cropping an image. 393 * 394 * @class 395 * @augments wp.media.controller.Cropper 396 * @augments wp.media.controller.State 397 * @augments Backbone.Model 398 */ 399 var Controller = wp.media.controller, 400 CustomizeImageCropper; 401 402 CustomizeImageCropper = Controller.Cropper.extend({ 403 doCrop: function( attachment ) { 404 var cropDetails = attachment.get( 'cropDetails' ), 405 control = this.get( 'control' ); 406 407 cropDetails.dst_width = control.params.width; 408 cropDetails.dst_height = control.params.height; 409 410 return wp.ajax.post( 'crop-image', { 411 wp_customize: 'on', 412 nonce: attachment.get( 'nonces' ).edit, 413 id: attachment.get( 'id' ), 414 context: control.id, 415 cropDetails: cropDetails 416 } ); 417 } 418 }); 419 420 module.exports = CustomizeImageCropper; 421 422 },{}],5:[function(require,module,exports){ 423 /*globals wp */ 424 425 /** 390 426 * wp.media.controller.EditImage 391 427 * … … 462 498 module.exports = EditImage; 463 499 464 },{}], 5:[function(require,module,exports){500 },{}],6:[function(require,module,exports){ 465 501 /*globals wp, _, Backbone */ 466 502 … … 600 636 module.exports = Embed; 601 637 602 },{}], 6:[function(require,module,exports){638 },{}],7:[function(require,module,exports){ 603 639 /*globals wp, _ */ 604 640 … … 724 760 module.exports = FeaturedImage; 725 761 726 },{}], 7:[function(require,module,exports){762 },{}],8:[function(require,module,exports){ 727 763 /*globals wp, _ */ 728 764 … … 817 853 module.exports = GalleryAdd; 818 854 819 },{}], 8:[function(require,module,exports){855 },{}],9:[function(require,module,exports){ 820 856 /*globals wp */ 821 857 … … 961 997 module.exports = GalleryEdit; 962 998 963 },{}], 9:[function(require,module,exports){999 },{}],10:[function(require,module,exports){ 964 1000 /*globals wp, _ */ 965 1001 … … 1025 1061 module.exports = ImageDetails; 1026 1062 1027 },{}],1 0:[function(require,module,exports){1063 },{}],11:[function(require,module,exports){ 1028 1064 /*globals wp, _, Backbone */ 1029 1065 … … 1299 1335 module.exports = Library; 1300 1336 1301 },{}],1 1:[function(require,module,exports){1337 },{}],12:[function(require,module,exports){ 1302 1338 /*globals wp, _ */ 1303 1339 … … 1351 1387 module.exports = MediaLibrary; 1352 1388 1353 },{}],1 2:[function(require,module,exports){1389 },{}],13:[function(require,module,exports){ 1354 1390 /*globals Backbone, _ */ 1355 1391 … … 1532 1568 module.exports = Region; 1533 1569 1534 },{}],1 3:[function(require,module,exports){1570 },{}],14:[function(require,module,exports){ 1535 1571 /*globals wp, _ */ 1536 1572 … … 1642 1678 module.exports = ReplaceImage; 1643 1679 1644 },{}],14:[function(require,module,exports){ 1680 },{}],15:[function(require,module,exports){ 1681 /*globals wp, Backbone */ 1682 1683 /** 1684 * wp.media.controller.SiteIconCropper 1685 * 1686 * A state for cropping a Site Icon. 1687 * 1688 * @class 1689 * @augments wp.media.controller.Cropper 1690 * @augments wp.media.controller.State 1691 * @augments Backbone.Model 1692 */ 1693 var Controller = wp.media.controller, 1694 SiteIconCropper; 1695 1696 SiteIconCropper = Controller.Cropper.extend({ 1697 activate: function() { 1698 this.frame.on( 'content:create:crop', this.createCropContent, this ); 1699 this.frame.on( 'close', this.removeCropper, this ); 1700 this.set('selection', new Backbone.Collection(this.frame._selection.single)); 1701 }, 1702 1703 createCropContent: function() { 1704 this.cropperView = new wp.media.view.SiteIconCropper({ 1705 controller: this, 1706 attachment: this.get('selection').first() 1707 }); 1708 this.cropperView.on('image-loaded', this.createCropToolbar, this); 1709 this.frame.content.set(this.cropperView); 1710 1711 }, 1712 1713 doCrop: function( attachment ) { 1714 var cropDetails = attachment.get( 'cropDetails' ), 1715 control = this.get( 'control' ); 1716 1717 cropDetails.dst_width = control.params.width; 1718 cropDetails.dst_height = control.params.height; 1719 1720 return wp.ajax.post( 'crop-image', { 1721 nonce: attachment.get( 'nonces' ).edit, 1722 id: attachment.get( 'id' ), 1723 context: 'site-icon', 1724 cropDetails: cropDetails 1725 } ); 1726 } 1727 }); 1728 1729 module.exports = SiteIconCropper; 1730 1731 },{}],16:[function(require,module,exports){ 1645 1732 /*globals _, Backbone */ 1646 1733 … … 1768 1855 module.exports = StateMachine; 1769 1856 1770 },{}],1 5:[function(require,module,exports){1857 },{}],17:[function(require,module,exports){ 1771 1858 /*globals _, Backbone */ 1772 1859 … … 2011 2098 module.exports = State; 2012 2099 2013 },{}],1 6:[function(require,module,exports){2100 },{}],18:[function(require,module,exports){ 2014 2101 /*globals _ */ 2015 2102 … … 2079 2166 module.exports = selectionSync; 2080 2167 2081 },{}],1 7:[function(require,module,exports){2168 },{}],19:[function(require,module,exports){ 2082 2169 /*globals wp, jQuery, _, Backbone */ 2083 2170 … … 2172 2259 media.controller.Embed = require( './controllers/embed.js' ); 2173 2260 media.controller.Cropper = require( './controllers/cropper.js' ); 2261 media.controller.CustomizeImageCropper = require( './controllers/customize-image-cropper.js' ); 2262 media.controller.SiteIconCropper = require( './controllers/site-icon-cropper.js' ); 2174 2263 2175 2264 media.View = require( './views/view.js' ); … … 2225 2314 media.view.ImageDetails = require( './views/image-details.js' ); 2226 2315 media.view.Cropper = require( './views/cropper.js' ); 2316 media.view.SiteIconCropper = require( './views/site-icon-cropper.js' ); 2317 media.view.SiteIconPreview = require( './views/site-icon-preview.js' ); 2227 2318 media.view.EditImage = require( './views/edit-image.js' ); 2228 2319 media.view.Spinner = require( './views/spinner.js' ); 2229 2320 2230 },{"./controllers/collection-add.js":1,"./controllers/collection-edit.js":2,"./controllers/cropper.js":3,"./controllers/ edit-image.js":4,"./controllers/embed.js":5,"./controllers/featured-image.js":6,"./controllers/gallery-add.js":7,"./controllers/gallery-edit.js":8,"./controllers/image-details.js":9,"./controllers/library.js":10,"./controllers/media-library.js":11,"./controllers/region.js":12,"./controllers/replace-image.js":13,"./controllers/state-machine.js":14,"./controllers/state.js":15,"./utils/selection-sync.js":16,"./views/attachment-compat.js":18,"./views/attachment-filters.js":19,"./views/attachment-filters/all.js":20,"./views/attachment-filters/date.js":21,"./views/attachment-filters/uploaded.js":22,"./views/attachment.js":23,"./views/attachment/details.js":24,"./views/attachment/edit-library.js":25,"./views/attachment/edit-selection.js":26,"./views/attachment/library.js":27,"./views/attachment/selection.js":28,"./views/attachments.js":29,"./views/attachments/browser.js":30,"./views/attachments/selection.js":31,"./views/button-group.js":32,"./views/button.js":33,"./views/cropper.js":34,"./views/edit-image.js":35,"./views/embed.js":36,"./views/embed/image.js":37,"./views/embed/link.js":38,"./views/embed/url.js":39,"./views/focus-manager.js":40,"./views/frame.js":41,"./views/frame/image-details.js":42,"./views/frame/post.js":43,"./views/frame/select.js":44,"./views/iframe.js":45,"./views/image-details.js":46,"./views/label.js":47,"./views/media-frame.js":48,"./views/menu-item.js":49,"./views/menu.js":50,"./views/modal.js":51,"./views/priority-list.js":52,"./views/router-item.js":53,"./views/router.js":54,"./views/search.js":55,"./views/selection.js":56,"./views/settings.js":57,"./views/settings/attachment-display.js":58,"./views/settings/gallery.js":59,"./views/settings/playlist.js":60,"./views/sidebar.js":61,"./views/spinner.js":62,"./views/toolbar.js":63,"./views/toolbar/embed.js":64,"./views/toolbar/select.js":65,"./views/uploader/editor.js":66,"./views/uploader/inline.js":67,"./views/uploader/status-error.js":68,"./views/uploader/status.js":69,"./views/uploader/window.js":70,"./views/view.js":71}],18:[function(require,module,exports){2321 },{"./controllers/collection-add.js":1,"./controllers/collection-edit.js":2,"./controllers/cropper.js":3,"./controllers/customize-image-cropper.js":4,"./controllers/edit-image.js":5,"./controllers/embed.js":6,"./controllers/featured-image.js":7,"./controllers/gallery-add.js":8,"./controllers/gallery-edit.js":9,"./controllers/image-details.js":10,"./controllers/library.js":11,"./controllers/media-library.js":12,"./controllers/region.js":13,"./controllers/replace-image.js":14,"./controllers/site-icon-cropper.js":15,"./controllers/state-machine.js":16,"./controllers/state.js":17,"./utils/selection-sync.js":18,"./views/attachment-compat.js":20,"./views/attachment-filters.js":21,"./views/attachment-filters/all.js":22,"./views/attachment-filters/date.js":23,"./views/attachment-filters/uploaded.js":24,"./views/attachment.js":25,"./views/attachment/details.js":26,"./views/attachment/edit-library.js":27,"./views/attachment/edit-selection.js":28,"./views/attachment/library.js":29,"./views/attachment/selection.js":30,"./views/attachments.js":31,"./views/attachments/browser.js":32,"./views/attachments/selection.js":33,"./views/button-group.js":34,"./views/button.js":35,"./views/cropper.js":36,"./views/edit-image.js":37,"./views/embed.js":38,"./views/embed/image.js":39,"./views/embed/link.js":40,"./views/embed/url.js":41,"./views/focus-manager.js":42,"./views/frame.js":43,"./views/frame/image-details.js":44,"./views/frame/post.js":45,"./views/frame/select.js":46,"./views/iframe.js":47,"./views/image-details.js":48,"./views/label.js":49,"./views/media-frame.js":50,"./views/menu-item.js":51,"./views/menu.js":52,"./views/modal.js":53,"./views/priority-list.js":54,"./views/router-item.js":55,"./views/router.js":56,"./views/search.js":57,"./views/selection.js":58,"./views/settings.js":59,"./views/settings/attachment-display.js":60,"./views/settings/gallery.js":61,"./views/settings/playlist.js":62,"./views/sidebar.js":63,"./views/site-icon-cropper.js":64,"./views/site-icon-preview.js":65,"./views/spinner.js":66,"./views/toolbar.js":67,"./views/toolbar/embed.js":68,"./views/toolbar/select.js":69,"./views/uploader/editor.js":70,"./views/uploader/inline.js":71,"./views/uploader/status-error.js":72,"./views/uploader/status.js":73,"./views/uploader/window.js":74,"./views/view.js":75}],20:[function(require,module,exports){ 2231 2322 /*globals _ */ 2232 2323 … … 2315 2406 module.exports = AttachmentCompat; 2316 2407 2317 },{}], 19:[function(require,module,exports){2408 },{}],21:[function(require,module,exports){ 2318 2409 /*globals _, jQuery */ 2319 2410 … … 2394 2485 module.exports = AttachmentFilters; 2395 2486 2396 },{}],2 0:[function(require,module,exports){2487 },{}],22:[function(require,module,exports){ 2397 2488 /*globals wp */ 2398 2489 … … 2486 2577 module.exports = All; 2487 2578 2488 },{}],2 1:[function(require,module,exports){2579 },{}],23:[function(require,module,exports){ 2489 2580 /*globals wp, _ */ 2490 2581 … … 2529 2620 module.exports = DateFilter; 2530 2621 2531 },{}],2 2:[function(require,module,exports){2622 },{}],24:[function(require,module,exports){ 2532 2623 /*globals wp */ 2533 2624 … … 2590 2681 module.exports = Uploaded; 2591 2682 2592 },{}],2 3:[function(require,module,exports){2683 },{}],25:[function(require,module,exports){ 2593 2684 /*globals wp, _, jQuery */ 2594 2685 … … 3138 3229 module.exports = Attachment; 3139 3230 3140 },{}],2 4:[function(require,module,exports){3231 },{}],26:[function(require,module,exports){ 3141 3232 /*globals wp, _ */ 3142 3233 … … 3278 3369 module.exports = Details; 3279 3370 3280 },{}],2 5:[function(require,module,exports){3371 },{}],27:[function(require,module,exports){ 3281 3372 /*globals wp */ 3282 3373 … … 3298 3389 module.exports = EditLibrary; 3299 3390 3300 },{}],2 6:[function(require,module,exports){3391 },{}],28:[function(require,module,exports){ 3301 3392 /*globals wp */ 3302 3393 … … 3319 3410 module.exports = EditSelection; 3320 3411 3321 },{}],2 7:[function(require,module,exports){3412 },{}],29:[function(require,module,exports){ 3322 3413 /*globals wp */ 3323 3414 … … 3339 3430 module.exports = Library; 3340 3431 3341 },{}], 28:[function(require,module,exports){3432 },{}],30:[function(require,module,exports){ 3342 3433 /*globals wp */ 3343 3434 … … 3363 3454 module.exports = Selection; 3364 3455 3365 },{}], 29:[function(require,module,exports){3456 },{}],31:[function(require,module,exports){ 3366 3457 /*globals wp, _, jQuery */ 3367 3458 … … 3664 3755 module.exports = Attachments; 3665 3756 3666 },{}],3 0:[function(require,module,exports){3757 },{}],32:[function(require,module,exports){ 3667 3758 /*globals wp, _, jQuery */ 3668 3759 … … 4110 4201 module.exports = AttachmentsBrowser; 4111 4202 4112 },{}],3 1:[function(require,module,exports){4203 },{}],33:[function(require,module,exports){ 4113 4204 /*globals wp, _ */ 4114 4205 … … 4142 4233 module.exports = Selection; 4143 4234 4144 },{}],3 2:[function(require,module,exports){4235 },{}],34:[function(require,module,exports){ 4145 4236 /*globals _, Backbone */ 4146 4237 … … 4190 4281 module.exports = ButtonGroup; 4191 4282 4192 },{}],3 3:[function(require,module,exports){4283 },{}],35:[function(require,module,exports){ 4193 4284 /*globals _, Backbone */ 4194 4285 … … 4278 4369 module.exports = Button; 4279 4370 4280 },{}],3 4:[function(require,module,exports){4371 },{}],36:[function(require,module,exports){ 4281 4372 /*globals wp, _, jQuery */ 4282 4373 … … 4347 4438 module.exports = Cropper; 4348 4439 4349 },{}],3 5:[function(require,module,exports){4440 },{}],37:[function(require,module,exports){ 4350 4441 /*globals wp, _ */ 4351 4442 … … 4405 4496 module.exports = EditImage; 4406 4497 4407 },{}],3 6:[function(require,module,exports){4498 },{}],38:[function(require,module,exports){ 4408 4499 /** 4409 4500 * wp.media.view.Embed … … 4469 4560 module.exports = Embed; 4470 4561 4471 },{}],3 7:[function(require,module,exports){4562 },{}],39:[function(require,module,exports){ 4472 4563 /*globals wp */ 4473 4564 … … 4504 4595 module.exports = EmbedImage; 4505 4596 4506 },{}], 38:[function(require,module,exports){4597 },{}],40:[function(require,module,exports){ 4507 4598 /*globals wp, _, jQuery */ 4508 4599 … … 4595 4686 module.exports = EmbedLink; 4596 4687 4597 },{}], 39:[function(require,module,exports){4688 },{}],41:[function(require,module,exports){ 4598 4689 /*globals wp, _, jQuery */ 4599 4690 … … 4676 4767 module.exports = EmbedUrl; 4677 4768 4678 },{}],4 0:[function(require,module,exports){4769 },{}],42:[function(require,module,exports){ 4679 4770 /** 4680 4771 * wp.media.view.FocusManager … … 4722 4813 module.exports = FocusManager; 4723 4814 4724 },{}],4 1:[function(require,module,exports){4815 },{}],43:[function(require,module,exports){ 4725 4816 /*globals _, Backbone */ 4726 4817 … … 4890 4981 module.exports = Frame; 4891 4982 4892 },{}],4 2:[function(require,module,exports){4983 },{}],44:[function(require,module,exports){ 4893 4984 /*globals wp */ 4894 4985 … … 5069 5160 module.exports = ImageDetails; 5070 5161 5071 },{}],4 3:[function(require,module,exports){5162 },{}],45:[function(require,module,exports){ 5072 5163 /*globals wp, _ */ 5073 5164 … … 5806 5897 module.exports = Post; 5807 5898 5808 },{}],4 4:[function(require,module,exports){5899 },{}],46:[function(require,module,exports){ 5809 5900 /*globals wp, _ */ 5810 5901 … … 5979 6070 module.exports = Select; 5980 6071 5981 },{}],4 5:[function(require,module,exports){6072 },{}],47:[function(require,module,exports){ 5982 6073 /** 5983 6074 * wp.media.view.Iframe … … 6003 6094 module.exports = Iframe; 6004 6095 6005 },{}],4 6:[function(require,module,exports){6096 },{}],48:[function(require,module,exports){ 6006 6097 /*globals wp, _, jQuery */ 6007 6098 … … 6173 6264 module.exports = ImageDetails; 6174 6265 6175 },{}],4 7:[function(require,module,exports){6266 },{}],49:[function(require,module,exports){ 6176 6267 /** 6177 6268 * wp.media.view.Label … … 6199 6290 module.exports = Label; 6200 6291 6201 },{}], 48:[function(require,module,exports){6292 },{}],50:[function(require,module,exports){ 6202 6293 /*globals wp, _, jQuery */ 6203 6294 … … 6448 6539 module.exports = MediaFrame; 6449 6540 6450 },{}], 49:[function(require,module,exports){6541 },{}],51:[function(require,module,exports){ 6451 6542 /*globals jQuery */ 6452 6543 … … 6522 6613 module.exports = MenuItem; 6523 6614 6524 },{}],5 0:[function(require,module,exports){6615 },{}],52:[function(require,module,exports){ 6525 6616 /** 6526 6617 * wp.media.view.Menu … … 6639 6730 module.exports = Menu; 6640 6731 6641 },{}],5 1:[function(require,module,exports){6732 },{}],53:[function(require,module,exports){ 6642 6733 /*globals wp, _, jQuery */ 6643 6734 … … 6854 6945 module.exports = Modal; 6855 6946 6856 },{}],5 2:[function(require,module,exports){6947 },{}],54:[function(require,module,exports){ 6857 6948 /*globals _, Backbone */ 6858 6949 … … 6953 7044 module.exports = PriorityList; 6954 7045 6955 },{}],5 3:[function(require,module,exports){7046 },{}],55:[function(require,module,exports){ 6956 7047 /** 6957 7048 * wp.media.view.RouterItem … … 6977 7068 module.exports = RouterItem; 6978 7069 6979 },{}],5 4:[function(require,module,exports){7070 },{}],56:[function(require,module,exports){ 6980 7071 /*globals wp */ 6981 7072 … … 7016 7107 module.exports = Router; 7017 7108 7018 },{}],5 5:[function(require,module,exports){7109 },{}],57:[function(require,module,exports){ 7019 7110 /*globals wp */ 7020 7111 … … 7066 7157 module.exports = Search; 7067 7158 7068 },{}],5 6:[function(require,module,exports){7159 },{}],58:[function(require,module,exports){ 7069 7160 /*globals wp, _, Backbone */ 7070 7161 … … 7151 7242 module.exports = Selection; 7152 7243 7153 },{}],5 7:[function(require,module,exports){7244 },{}],59:[function(require,module,exports){ 7154 7245 /*globals _, Backbone */ 7155 7246 … … 7274 7365 module.exports = Settings; 7275 7366 7276 },{}], 58:[function(require,module,exports){7367 },{}],60:[function(require,module,exports){ 7277 7368 /*globals wp, _ */ 7278 7369 … … 7370 7461 module.exports = AttachmentDisplay; 7371 7462 7372 },{}], 59:[function(require,module,exports){7463 },{}],61:[function(require,module,exports){ 7373 7464 /*globals wp */ 7374 7465 … … 7389 7480 module.exports = Gallery; 7390 7481 7391 },{}],6 0:[function(require,module,exports){7482 },{}],62:[function(require,module,exports){ 7392 7483 /*globals wp */ 7393 7484 … … 7408 7499 module.exports = Playlist; 7409 7500 7410 },{}],6 1:[function(require,module,exports){7501 },{}],63:[function(require,module,exports){ 7411 7502 /** 7412 7503 * wp.media.view.Sidebar … … 7424 7515 module.exports = Sidebar; 7425 7516 7426 },{}],62:[function(require,module,exports){ 7517 },{}],64:[function(require,module,exports){ 7518 /*globals wp, _ */ 7519 7520 /** 7521 * wp.media.view.SiteIconCropper 7522 * 7523 * Uses the imgAreaSelect plugin to allow a user to crop a Site Icon. 7524 * 7525 * Takes imgAreaSelect options from 7526 * wp.customize.SiteIconControl.calculateImageSelectOptions. 7527 * 7528 * @class 7529 * @augments wp.media.view.Cropper 7530 * @augments wp.media.View 7531 * @augments wp.Backbone.View 7532 * @augments Backbone.View 7533 */ 7534 var View = wp.media.view, 7535 SiteIconCropper; 7536 7537 SiteIconCropper = View.Cropper.extend({ 7538 className: 'crop-content site-icon', 7539 7540 ready: function () { 7541 View.Cropper.prototype.ready.apply( this, arguments ); 7542 7543 this.$( '.crop-image' ).on( 'load', _.bind( this.addSidebar, this ) ); 7544 }, 7545 7546 addSidebar: function() { 7547 this.sidebar = new wp.media.view.Sidebar({ 7548 controller: this.controller 7549 }); 7550 7551 this.sidebar.set( 'preview', new wp.media.view.SiteIconPreview({ 7552 controller: this.controller, 7553 attachment: this.options.attachment 7554 }) ); 7555 7556 this.controller.cropperView.views.add( this.sidebar ); 7557 } 7558 }); 7559 7560 module.exports = SiteIconCropper; 7561 7562 },{}],65:[function(require,module,exports){ 7563 /*globals wp, jQuery */ 7564 7565 /** 7566 * wp.media.view.SiteIconPreview 7567 * 7568 * Shows a preview of the Site Icon as a favicon and app icon while cropping. 7569 * 7570 * @class 7571 * @augments wp.media.View 7572 * @augments wp.Backbone.View 7573 * @augments Backbone.View 7574 */ 7575 var View = wp.media.View, 7576 $ = jQuery, 7577 SiteIconPreview; 7578 7579 SiteIconPreview = View.extend({ 7580 className: 'site-icon-preview', 7581 template: wp.template( 'site-icon-preview' ), 7582 7583 ready: function() { 7584 this.controller.imgSelect.setOptions({ 7585 onInit: this.updatePreview, 7586 onSelectChange: this.updatePreview 7587 }); 7588 }, 7589 7590 prepare: function() { 7591 return { 7592 url: this.options.attachment.get( 'url' ) 7593 }; 7594 }, 7595 7596 updatePreview: function( img, coords ) { 7597 var rx = 64 / coords.width, 7598 ry = 64 / coords.height, 7599 preview_rx = 16 / coords.width, 7600 preview_ry = 16 / coords.height; 7601 7602 $( '#preview-app-icon' ).css({ 7603 width: Math.round(rx * this.imageWidth ) + 'px', 7604 height: Math.round(ry * this.imageHeight ) + 'px', 7605 marginLeft: '-' + Math.round(rx * coords.x1) + 'px', 7606 marginTop: '-' + Math.round(ry * coords.y1) + 'px' 7607 }); 7608 7609 $( '#preview-favicon' ).css({ 7610 width: Math.round( preview_rx * this.imageWidth ) + 'px', 7611 height: Math.round( preview_ry * this.imageHeight ) + 'px', 7612 marginLeft: '-' + Math.round( preview_rx * coords.x1 ) + 'px', 7613 marginTop: '-' + Math.floor( preview_ry* coords.y1 ) + 'px' 7614 }); 7615 } 7616 }); 7617 7618 module.exports = SiteIconPreview; 7619 7620 },{}],66:[function(require,module,exports){ 7427 7621 /*globals _ */ 7428 7622 … … 7461 7655 module.exports = Spinner; 7462 7656 7463 },{}],6 3:[function(require,module,exports){7657 },{}],67:[function(require,module,exports){ 7464 7658 /*globals _, Backbone */ 7465 7659 … … 7623 7817 module.exports = Toolbar; 7624 7818 7625 },{}],6 4:[function(require,module,exports){7819 },{}],68:[function(require,module,exports){ 7626 7820 /*globals wp, _ */ 7627 7821 … … 7662 7856 module.exports = Embed; 7663 7857 7664 },{}],6 5:[function(require,module,exports){7858 },{}],69:[function(require,module,exports){ 7665 7859 /*globals wp, _ */ 7666 7860 … … 7734 7928 module.exports = Select; 7735 7929 7736 },{}], 66:[function(require,module,exports){7930 },{}],70:[function(require,module,exports){ 7737 7931 /*globals wp, _, jQuery */ 7738 7932 … … 7957 8151 module.exports = EditorUploader; 7958 8152 7959 },{}], 67:[function(require,module,exports){8153 },{}],71:[function(require,module,exports){ 7960 8154 /*globals wp, _ */ 7961 8155 … … 8090 8284 module.exports = UploaderInline; 8091 8285 8092 },{}], 68:[function(require,module,exports){8286 },{}],72:[function(require,module,exports){ 8093 8287 /*globals wp */ 8094 8288 … … 8108 8302 module.exports = UploaderStatusError; 8109 8303 8110 },{}], 69:[function(require,module,exports){8304 },{}],73:[function(require,module,exports){ 8111 8305 /*globals wp, _ */ 8112 8306 … … 8248 8442 module.exports = UploaderStatus; 8249 8443 8250 },{}],7 0:[function(require,module,exports){8444 },{}],74:[function(require,module,exports){ 8251 8445 /*globals wp, _, jQuery */ 8252 8446 … … 8361 8555 module.exports = UploaderWindow; 8362 8556 8363 },{}],7 1:[function(require,module,exports){8557 },{}],75:[function(require,module,exports){ 8364 8558 /*globals wp */ 8365 8559 … … 8429 8623 module.exports = View; 8430 8624 8431 },{}]},{},[1 7]);8625 },{}]},{},[19]); -
trunk/src/wp-includes/js/media/views.manifest.js
r31494 r33329 91 91 media.controller.Embed = require( './controllers/embed.js' ); 92 92 media.controller.Cropper = require( './controllers/cropper.js' ); 93 media.controller.CustomizeImageCropper = require( './controllers/customize-image-cropper.js' ); 94 media.controller.SiteIconCropper = require( './controllers/site-icon-cropper.js' ); 93 95 94 96 media.View = require( './views/view.js' ); … … 144 146 media.view.ImageDetails = require( './views/image-details.js' ); 145 147 media.view.Cropper = require( './views/cropper.js' ); 148 media.view.SiteIconCropper = require( './views/site-icon-cropper.js' ); 149 media.view.SiteIconPreview = require( './views/site-icon-preview.js' ); 146 150 media.view.EditImage = require( './views/edit-image.js' ); 147 151 media.view.Spinner = require( './views/spinner.js' ); -
trunk/src/wp-includes/media-template.php
r33090 r33329 1244 1244 </script> 1245 1245 1246 <script type="text/html" id="tmpl-site-icon-preview"> 1247 <h2><?php _e( 'Preview' ); ?></h2> 1248 <strong><?php _e( 'As a browser icon' ); ?></strong> 1249 <div class="favicon-preview"> 1250 <img src="images/browser.png" class="browser-preview" width="182" height="" alt=""/> 1251 1252 <div class="favicon"> 1253 <img id="preview-favicon" src="{{ data.url }}" alt="<?php esc_attr_e( 'Preview as a browser icon' ); ?>"/> 1254 </div> 1255 <span class="browser-title"><?php bloginfo( 'name' ); ?></span> 1256 </div> 1257 1258 <strong><?php _e( 'As an app icon' ); ?></strong> 1259 <div class="app-icon-preview"> 1260 <img id="preview-app-icon" src="{{ data.url }}" alt="<?php esc_attr_e( 'Preview as an app icon' ); ?>"/> 1261 </div> 1262 </script> 1263 1246 1264 <?php 1247 1265 -
trunk/src/wp-includes/script-loader.php
r33321 r33329 619 619 ) ); 620 620 621 $scripts->add( 'site-icon', '/wp-admin/js/site-icon.js', array( 'jquery' ), false, 1 );622 $scripts->add( 'site-icon-crop', '/wp-admin/js/site-icon-crop.js', array( 'jcrop' ), false, 1 );623 624 621 $scripts->add( 'custom-header', "/wp-admin/js/custom-header.js", array( 'jquery-masonry' ), false, 1 ); 625 622 $scripts->add( 'custom-background', "/wp-admin/js/custom-background$suffix.js", array( 'wp-color-picker', 'media-views' ), false, 1 );
Note: See TracChangeset
for help on using the changeset viewer.