Skip to content
Permalink
Browse files

Prebuild

  • Loading branch information...
sugarshin committed Apr 24, 2019
1 parent 9bf0322 commit ca7c8ca1dcea4ae092f69ae1764dedf2b36d5eeb
Showing with 5,961 additions and 1 deletion.
  1. +0 −1 .gitignore
  2. +176 −0 dist/helpers.js
  3. +546 −0 dist/index.js
  4. +3,221 −0 dist/standalone/react-easy-crop.js
  5. +1,877 −0 dist/standalone/react-easy-crop.min.js
  6. +141 −0 dist/styles.js
@@ -1,5 +1,4 @@
node_modules
dist
cypress/fixtures
cypress/videos
cypress/screenshots
@@ -0,0 +1,176 @@
'use strict'

Object.defineProperty(exports, '__esModule', {
value: true,
})
exports.getCropSize = getCropSize
exports.restrictPosition = restrictPosition
exports.getDistanceBetweenPoints = getDistanceBetweenPoints
exports.computeCroppedArea = computeCroppedArea
exports.getCenter = getCenter

function _objectSpread(target) {
for (var i = 1; i < arguments.length; i++) {
var source = arguments[i] != null ? arguments[i] : {}
var ownKeys = Object.keys(source)
if (typeof Object.getOwnPropertySymbols === 'function') {
ownKeys = ownKeys.concat(
Object.getOwnPropertySymbols(source).filter(function(sym) {
return Object.getOwnPropertyDescriptor(source, sym).enumerable
})
)
}
ownKeys.forEach(function(key) {
_defineProperty(target, key, source[key])
})
}
return target
}

function _defineProperty(obj, key, value) {
if (key in obj) {
Object.defineProperty(obj, key, {
value: value,
enumerable: true,
configurable: true,
writable: true,
})
} else {
obj[key] = value
}
return obj
}

/**
* Compute the dimension of the crop area based on image size and aspect ratio
* @param {number} imgWidth width of the src image in pixels
* @param {number} imgHeight height of the src image in pixels
* @param {number} aspect aspect ratio of the crop
*/
function getCropSize(imgWidth, imgHeight, aspect) {
if (imgWidth >= imgHeight * aspect) {
return {
width: imgHeight * aspect,
height: imgHeight,
}
}

return {
width: imgWidth,
height: imgWidth / aspect,
}
}
/**
* Ensure a new image position stays in the crop area.
* @param {{x: number, y number}} position new x/y position requested for the image
* @param {{width: number, height: number}} imageSize width/height of the src image
* @param {{width: number, height: number}} cropSize width/height of the crop area
* @param {number} zoom zoom value
* @returns {{x: number, y number}}
*/

function restrictPosition(position, imageSize, cropSize, zoom) {
return {
x: restrictPositionCoord(position.x, imageSize.width, cropSize.width, zoom),
y: restrictPositionCoord(position.y, imageSize.height, cropSize.height, zoom),
}
}

function restrictPositionCoord(position, imageSize, cropSize, zoom) {
var maxPosition = (imageSize * 10 * zoom) / 2 - cropSize / 2
return Math.min(maxPosition, Math.max(position, -maxPosition))
}

function getDistanceBetweenPoints(pointA, pointB) {
return Math.sqrt(Math.pow(pointA.y - pointB.y, 2) + Math.pow(pointA.x - pointB.x, 2))
}
/**
* Compute the output cropped area of the image in percentages and pixels.
* x/y are the top-left coordinates on the src image
* @param {{x: number, y number}} crop x/y position of the current center of the image
* @param {{width: number, height: number, naturalWidth: number, naturelHeight: number}} imageSize width/height of the src image (default is size on the screen, natural is the original size)
* @param {{width: number, height: number}} cropSize width/height of the crop area
* @param {number} aspect aspect value
* @param {number} zoom zoom value
*/

function computeCroppedArea(crop, imgSize, cropSize, aspect, zoom) {
var croppedAreaPercentages = {
x: limitArea(
100,
(((imgSize.width - cropSize.width / zoom) / 2 - crop.x / zoom) / imgSize.width) * 100
),
y: limitArea(
100,
(((imgSize.height - cropSize.height / zoom) / 2 - crop.y / zoom) / imgSize.height) * 100
),
width: limitArea(100, ((cropSize.width / imgSize.width) * 100) / zoom),
height: limitArea(100, ((cropSize.height / imgSize.height) * 100) / zoom), // we compute the pixels size naively
}
var widthInPixels = limitArea(
imgSize.naturalWidth,
(croppedAreaPercentages.width * imgSize.naturalWidth) / 100,
true
)
var heightInPixels = limitArea(
imgSize.naturalHeight,
(croppedAreaPercentages.height * imgSize.naturalHeight) / 100,
true
)
var isImgWiderThanHigh = imgSize.naturalWidth >= imgSize.naturalHeight * aspect // then we ensure the width and height exactly match the aspect (to avoid rounding approximations)
// if the image is wider than high, when zoom is 0, the crop height will be equals to iamge height
// thus we want to compute the width from the height and aspect for accuracy.
// Otherwise, we compute the height from width and aspect.

var sizePixels = isImgWiderThanHigh
? {
width: Math.round(heightInPixels * aspect),
height: heightInPixels,
}
: {
width: widthInPixels,
height: Math.round(widthInPixels / aspect),
}

var croppedAreaPixels = _objectSpread({}, sizePixels, {
x: limitArea(
imgSize.naturalWidth - sizePixels.width,
(croppedAreaPercentages.x * imgSize.naturalWidth) / 100,
true
),
y: limitArea(
imgSize.naturalHeight - sizePixels.height,
(croppedAreaPercentages.y * imgSize.naturalHeight) / 100,
true
),
})

return {
croppedAreaPercentages: croppedAreaPercentages,
croppedAreaPixels: croppedAreaPixels,
}
}
/**
* Ensure the returned value is between 0 and max
* @param {number} max
* @param {number} value
* @param {boolean} shouldRound
*/

function limitArea(max, value) {
var shouldRound = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false
var v = shouldRound ? Math.round(value) : value
return Math.min(max, Math.max(0, v))
}
/**
* Return the point that is the center of point a and b
* @param {{x: number, y: number}} a
* @param {{x: number, y: number}} b
*/

function getCenter(a, b) {
return {
x: (b.x + a.x) / 2,
y: (b.y + a.y) / 2,
}
}

0 comments on commit ca7c8ca

Please sign in to comment.
You can’t perform that action at this time.