enmi-conf.org: comparison wp/wp-admin/js/image-edit.js

Mercurial Mercurial > enmi-conf.org / comparison

summary | shortlog | changelog | graph | tags | bookmarks | branches | files | changeset | file | latest | revisions | annotate | diff | comparison | raw | help

wp/wp-admin/js/image-edit.js

changeset 9	177826044cd9
parent 7	cf61fcea0001
child 16	a86126ab1dd4

equal deleted inserted replaced

-:c7c34916027a
+:177826044cd9
-/* global imageEditL10n, ajaxurl, confirm */
 /**
-* @summary   The functions necessary for editing images.
+* The functions necessary for editing images.
 *
-* @since     2.9.0
+* @since 2.9.0
+* @output wp-admin/js/image-edit.js
 */
+/* global imageEditL10n, ajaxurl, confirm */
 (function($) {
 	/**
 	 * Contains all the methods to initialise and control the image editor.
 	hold : {},
 	postid : '',
 	_view : false,
 	/**
-	 * @summary Converts a value to an integer.
+	 * Handle crop tool clicks.
+	 */
+	handleCropToolClick: function( postid, nonce, cropButton ) {
+		var img = $( '#image-preview-' + postid ),
+			selection = this.iasapi.getSelection();
+		// Ensure selection is available, otherwise reset to full image.
+		if ( isNaN( selection.x1 ) ) {
+			this.setCropSelection( postid, { 'x1': 0, 'y1': 0, 'x2': img.innerWidth(), 'y2': img.innerHeight(), 'width': img.innerWidth(), 'height': img.innerHeight() } );
+			selection = this.iasapi.getSelection();
+		}
+		// If we don't already have a selection, select the entire image.
+		if ( 0 === selection.x1 && 0 === selection.y1 && 0 === selection.x2 && 0 === selection.y2 ) {
+			this.iasapi.setSelection( 0, 0, img.innerWidth(), img.innerHeight(), true );
+			this.iasapi.setOptions( { show: true } );
+			this.iasapi.update();
+		} else {
+			// Otherwise, perform the crop.
+			imageEdit.crop( postid, nonce , cropButton );
+		}
+	},
+	/**
+	 * Converts a value to an integer.
 	 *
 	 * @memberof imageEdit
 	 * @since    2.9.0
 	 *
 	 * @param {number} f The float value that should be converted.
 		 */
 		return f | 0;
 	},
 	/**
-	 * @summary Adds the disabled attribute and class to a single form element
+	 * Adds the disabled attribute and class to a single form element or a field set.
-	 *          or a field set.
 	 *
 	 * @memberof imageEdit
 	 * @since    2.9.0
 	 *
 	 * @param {jQuery}         el The element that should be modified.
 			el.addClass( 'disabled' ).prop( 'disabled', true );
 		}
 	},
 	/**
-	 * @summary Initializes the image editor.
+	 * Initializes the image editor.
 	 *
 	 * @memberof imageEdit
 	 * @since    2.9.0
 	 *
 	 * @param {number} postid The post id.
 			}
 		});
 	},
 	/**
-	 * @summary Toggles the wait/load icon in the editor.
+	 * Toggles the wait/load icon in the editor.
 	 *
 	 * @memberof imageEdit
 	 * @since    2.9.0
 	 *
 	 * @param {number} postid The post id.
 			wait.fadeOut('fast');
 		}
 	},
 	/**
-	 * @summary Shows or hides the image edit help box.
+	 * Shows or hides the image edit help box.
 	 *
 	 * @memberof imageEdit
 	 * @since    2.9.0
 	 *
 	 * @param {HTMLElement} el The element to create the help window in.
 		return false;
 	},
 	/**
-	 * @summary Gets the value from the image edit target.
+	 * Gets the value from the image edit target.
 	 *
 	 * The image edit target contains the image sizes where the (possible) changes
 	 * have to be applied to.
 	 *
 	 * @memberof imageEdit
 	getTarget : function(postid) {
 		return $('input[name="imgedit-target-' + postid + '"]:checked', '#imgedit-save-target-' + postid).val() || 'full';
 	},
 	/**
-	 * @summary Recalculates the height or width and keeps the original aspect ratio.
+	 * Recalculates the height or width and keeps the original aspect ratio.
 	 *
 	 * If the original image size is exceeded a red exclamation mark is shown.
 	 *
 	 * @memberof imageEdit
 	 * @since    2.9.0
 			warn.css('visibility', 'hidden');
 		}
 	},
 	/**
-	 * @summary Gets the selected aspect ratio.
+	 * Gets the selected aspect ratio.
 	 *
 	 * @memberof imageEdit
 	 * @since    2.9.0
 	 *
 	 * @param {number} postid The post id.
 		return '1:1';
 	},
 	/**
-	 * @summary Removes the last action from the image edit history
+	 * Removes the last action from the image edit history.
 	 * The history consist of (edit) actions performed on the image.
 	 *
 	 * @memberof imageEdit
 	 * @since    2.9.0
 	 *
 			return JSON.stringify(op);
 		}
 		return '';
 	},
 	/**
-	 * @summary Binds the necessary events to the image.
+	 * Binds the necessary events to the image.
 	 *
 	 * When the image source is reloaded the image will be reloaded.
 	 *
 	 * @memberof imageEdit
 	 * @since    2.9.0
 				max1 = Math.max( t.hold.w, t.hold.h );
 				max2 = Math.max( $(img).width(), $(img).height() );
 				t.hold.sizer = max1 > max2 ? max2 / max1 : 1;
 				t.initCrop(postid, img, parent);
-				t.setCropSelection(postid, 0);
 				if ( (typeof callback !== 'undefined') && callback !== null ) {
 					callback();
 				}
 				t.toggleEditor(postid, 0);
 			})
 			.attr('src', ajaxurl + '?' + $.param(data));
 	},
 	/**
-	 * @summary Performs an image edit action.
+	 * Performs an image edit action.
 	 *
 	 * @memberof imageEdit
 	 * @since    2.9.0
 	 *
 	 * @param  {number}  postid The post id.
 			}
 		});
 	},
 	/**
-	 * @summary Stores the changes that are made to the image.
+	 * Stores the changes that are made to the image.
 	 *
 	 * @memberof imageEdit
 	 * @since    2.9.0
 	 *
 	 * @param {number}  postid   The post id to get the image from the database.
 			}
 		});
 	},
 	/**
-	 * @summary Creates the image edit window.
+	 * Creates the image edit window.
 	 *
 	 * @memberof imageEdit
 	 * @since    2.9.0
 	 *
 	 * @param {number} postid   The post id for the image.
 		return dfd;
 	},
 	/**
-	 * @summary Initializes the cropping tool and sets a default cropping selection.
+	 * Initializes the cropping tool and sets a default cropping selection.
 	 *
 	 * @memberof imageEdit
 	 * @since    2.9.0
 	 *
 	 * @param {number} postid The post id.
 		if ( 'undefined' === typeof this.hold.sizer ) {
 			this.init( postid );
 		}
 		this.initCrop(postid, img, parent);
-		this.setCropSelection(postid, 0);
+		this.setCropSelection( postid, { 'x1': 0, 'y1': 0, 'x2': 0, 'y2': 0, 'width': img.innerWidth(), 'height': img.innerHeight() } );
 		this.toggleEditor(postid, 0);
 		// Editor is ready, move focus to the first focusable element.
 		$( '.imgedit-wrap .imgedit-help-toggle' ).eq( 0 ).focus();
 	},
 	/**
-	 * @summary Initializes the cropping tool.
+	 * Initializes the cropping tool.
 	 *
 	 * @memberof imageEdit
 	 * @since    2.9.0
 	 *
 	 * @param {number}      postid The post id.
 			keys: true,
 			minWidth: 3,
 			minHeight: 3,
 			/**
-			 * @summary Sets the CSS styles and binds events for locking the aspect ratio.
+			 * Sets the CSS styles and binds events for locking the aspect ratio.
+			 *
+			 * @ignore
 			 *
 			 * @param {jQuery} img The preview image.
 			 */
 			onInit: function( img ) {
 				// Ensure that the imgAreaSelect wrapper elements are position:absolute.
 				// (even if we're in a position:fixed modal)
 				$img = $( img );
 				$img.next().css( 'position', 'absolute' )
 					.nextAll( '.imgareaselect-outer' ).css( 'position', 'absolute' );
 				/**
-				 * @summary Binds mouse down event to the cropping container.
+				 * Binds mouse down event to the cropping container.
 				 *
 				 * @returns {void}
 				 */
 				parent.children().on( 'mousedown, touchstart', function(e){
 					var ratio = false, sel, defRatio;
 					});
 				});
 			},
 			/**
-			 * @summary Event triggered when starting a selection.
+			 * Event triggered when starting a selection.
+			 *
+			 * @ignore
 			 *
 			 * @returns {void}
 			 */
 			onSelectStart: function() {
 				imageEdit.setDisabled($('#imgedit-crop-sel-' + postid), 1);
 			},
 			/**
-			 * @summary Event triggered when the selection is ended.
+			 * Event triggered when the selection is ended.
+			 *
+			 * @ignore
 			 *
 			 * @param {object} img jQuery object representing the image.
 			 * @param {object} c   The selection.
 			 *
 			 * @returns {object}
 			onSelectEnd: function(img, c) {
 				imageEdit.setCropSelection(postid, c);
 			},
 			/**
-			 * @summary Event triggered when the selection changes.
+			 * Event triggered when the selection changes.
+			 *
+			 * @ignore
 			 *
 			 * @param {object} img jQuery object representing the image.
 			 * @param {object} c   The selection.
 			 *
 			 * @returns {void}
 			}
 		});
 	},
 	/**
-	 * @summary Stores the current crop selection.
+	 * Stores the current crop selection.
 	 *
 	 * @memberof imageEdit
 	 * @since    2.9.0
 	 *
 	 * @param {number} postid The post id.
 		var sel;
 		c = c || 0;
 		if ( !c || ( c.width < 3 && c.height < 3 ) ) {
-			this.setDisabled($('.imgedit-crop', '#imgedit-panel-' + postid), 0);
+			this.setDisabled( $( '.imgedit-crop', '#imgedit-panel-' + postid ), 1 );
-			this.setDisabled($('#imgedit-crop-sel-' + postid), 0);
+			this.setDisabled( $( '#imgedit-crop-sel-' + postid ), 1 );
 			$('#imgedit-sel-width-' + postid).val('');
 			$('#imgedit-sel-height-' + postid).val('');
 			$('#imgedit-selection-' + postid).val('');
 			return false;
 		}
 		$('#imgedit-selection-' + postid).val( JSON.stringify(sel) );
 	},
 	/**
-	 * @summary Closes the image editor.
+	 * Closes the image editor.
 	 *
 	 * @memberof imageEdit
 	 * @since    2.9.0
 	 *
 	 * @param {number}  postid The post id.
 	},
 	/**
-	 * @summary Checks if the image edit history is saved.
+	 * Checks if the image edit history is saved.
 	 *
 	 * @memberof imageEdit
 	 * @since    2.9.0
 	 *
 	 * @param {number} postid The post id.
 		}
 		return false;
 	},
 	/**
-	 * @summary Adds an image edit action to the history.
+	 * Adds an image edit action to the history.
 	 *
 	 * @memberof imageEdit
 	 * @since    2.9.0
 	 *
 	 * @param {object} op     The original position.
 			t.setDisabled($('#image-redo-' + postid), false);
 		});
 	},
 	/**
-	 * @summary Rotates the image.
+	 * Rotates the image.
 	 *
 	 * @memberof imageEdit
 	 * @since    2.9.0
 	 *
 	 * @param {string} angle  The angle the image is rotated with.
 		this.addStep({ 'r': { 'r': angle, 'fw': this.hold.h, 'fh': this.hold.w }}, postid, nonce);
 	},
 	/**
-	 * @summary Flips the image.
+	 * Flips the image.
 	 *
 	 * @memberof imageEdit
 	 * @since    2.9.0
 	 *
 	 * @param {number} axis   The axle the image is flipped on.
 		this.addStep({ 'f': { 'f': axis, 'fw': this.hold.w, 'fh': this.hold.h }}, postid, nonce);
 	},
 	/**
-	 * @summary Crops the image.
+	 * Crops the image.
 	 *
 	 * @memberof imageEdit
 	 * @since    2.9.0
 	 *
 	 * @param {number} postid The post id.
 			this.addStep({ 'c': sel }, postid, nonce);
 		}
 	},
 	/**
-	 * @summary Undoes an image edit action.
+	 * Undoes an image edit action.
 	 *
 	 * @memberof imageEdit
 	 * @since    2.9.0
 	 *
 	 * @param {number} postid   The post id.
 			}
 		});
 	},
 	/**
-	 * @summary Sets the selection for the height and width in pixels.
+	 * Sets the selection for the height and width in pixels.
 	 *
 	 * @memberof imageEdit
 	 * @since    2.9.0
 	 *
 	 * @param {number} postid The post id.

enmi-conf.org