- Fixed wrong image offset when rotation is negative.
- Fixed bug where image background can be dragged and moved.
Markup in v0.4:
<div class="image-editor">
<!-- .cropit-image-preview-container is needed for background image to work -->
<div class="cropit-image-preview-container">
<div class="cropit-image-preview"></div>
</div>
<!-- Other stuff -->
</div>
New markup in v0.5:
<div class="image-editor">
<div class="cropit-preview"></div>
<!-- Other stuff -->
</div>
Note that .cropit-image-preview-container
element is no longer needed, and all you need is a .cropit-preview
(previously .cropit-image-preview
) whether or not you want image background that goes beyond the preview area. New markup structure (after cropit is initialized) is as follows:
.cropit-preview
.cropit-preview-background-container
img.cropit-preview-background
.cropit-preview-image-container
img.cropit-preview-image
Note the class name changes:
.cropit-image-preview => .cropit-preview
.cropit-image-background-container => .cropit-preview-background-container
.cropit-image-background => .cropit-preview-background
Make sure to update class names in your selectors.
- Markup structure and class name changes. See migration guide above for details.
- Added rotation APIs
rotateCW
androtateCCW
, which rotates the image by 90 degrees clockwise/counterclockwise. If, after rotated by 90 degrees, the dimension of the image no longer meets the requirements, it would be rotated by 180 degrees. - Render image using CSS transformation, which drastically improved performance.
- Now remote images are loaded through AJAX and rendered as data URI strings, which addresses CORS issues.
allowCrossOrigin
option is no longer necessary and therefore removed.
- Fixed an issue where cropit exports blank images on Safari. Removed progressive resizing, which may degrade cropped image quality. For high quality resizing, using a server-side tool is recommended.
- Added getters and setters for
initialZoom
,exportZoom
,minZoom
andmaxZoom
- Added
onOffsetChange
andonZoomChange
callback - onFileChange now passes back the event object
- Fixed bug where
image-loaded
class is removed if a small image is loaded and rejected
- Fixed crossOrigin preventing image from loading in Safari and Firefox.
- Added option to allow small image to be either zoomed down its original size or stretch to fill/fit container
- Replaced
rejectSmallImage
option withsmallImage
.rejectSmallImage: true
is nowsmallImage: 'reject'
, andrejectSmallImage: false
is nowsmallImage: 'allow'
.
- Added back
allowCrossOrigin
option
- Fixed jQuery import in AMD and CommonJS.
- Center image when uploaded
- Added
maxZoom
,minZoom
,initialZoom
options - Added
rejectSmallImage
option- By default if image is smaller than preview, it won't be loaded and the old image would be preserved
- Added
onFileReaderError
callback
- Removed
allowCrossOrigin
option
- Major refactor -- rewrote in ES6! No more CoffeeScript.
- Now build with Webpack and removed Grunt
- Added drag & drop support via
allowDragNDrop
option, default to true - Added free move support via
freeMove
option, default to false - Added CommonJS support
- Renamed option
freeImageMove
->freeMove
- Added touch support
- Added disable and reenable APIs
- Support varying backgroung image border size
- Added white background in jpeg format exports