@aurigma/design-atoms
Version:
Design Atoms is a part of Customer's Canvas SDK which allows for manipulating individual design elements through your code.
211 lines • 12.5 kB
JavaScript
import { EqualsOfFloatNumbers, RotatedRectangleF } from "@aurigma/design-atoms-model/Math";
import { GripsResizeType, ResizeHelper, ResizeType } from "../Utils/Grips";
export class ImageCropperHandler {
get selection() {
var _a;
return (_a = this._canvas) === null || _a === void 0 ? void 0 : _a.selection;
}
set canvas(cnv) {
this._canvas = cnv;
}
isRotated(curRect, newRect) {
return curRect.angle != newRect.angle;
}
isMoved(curRect, newRect) {
return EqualsOfFloatNumbers(curRect.width, newRect.width) && EqualsOfFloatNumbers(curRect.height, newRect.height) && !this.isRotated(curRect, newRect);
}
modifyRectangle(placeholder, currentRect, newRect) {
var _a, _b, _c;
this._rectangle = currentRect;
this._placeholder = placeholder;
if (this.isRotated(currentRect, newRect)) {
return { rectangle: newRect, needUpdate: false };
}
if (((_a = this.selection) === null || _a === void 0 ? void 0 : _a.isDragging) || this.isMoved(currentRect, newRect)) {
return { rectangle: newRect, needUpdate: false };
}
const gripsResizeType = ResizeHelper.geTypeOfResizeByGrips(this._placeholder.rectangle, this._placeholder.previousRectangle, (_b = this.selection) === null || _b === void 0 ? void 0 : _b.resizeIndex);
if (gripsResizeType !== GripsResizeType.none) {
return { rectangle: this._resizeByGrips(gripsResizeType), needUpdate: false };
}
const resizeType = ResizeHelper.getTypeResize(newRect, this._rectangle);
if (gripsResizeType === GripsResizeType.none && ((_c = this.selection) === null || _c === void 0 ? void 0 : _c.resizeIndex) == null && resizeType !== ResizeType.none) {
return { rectangle: this._resize(resizeType, newRect), needUpdate: true };
}
return { rectangle: this._rectangle, needUpdate: false };
}
_resizeByGrips(type) {
const placeholderRect = this._placeholder.rectangle;
const { top: containerTop, right: containerRight, left: containerLeft, bottom: containerBottom } = placeholderRect.bounds;
const rectangle = this._rectangle.clone().rotateAt(-this._rectangle.angle, placeholderRect.center);
const { top: imageTop, right: imageRight, left: imageLeft, bottom: imageBottom } = rectangle.bounds;
const { top: startTop, bottom: startBottom, left: startLeft, right: startRight } = this._placeholder.startRectangle.bounds;
switch (type) {
case GripsResizeType.increaseTop: {
if (containerTop > imageTop) {
return this._rectangle;
}
else {
const deltaTop = imageTop - containerTop;
const finalHeight = this._rectangle.bounds.height + deltaTop;
const scale = finalHeight / this._rectangle.height;
const resized = this._resizeProportional(rectangle, scale);
const alignmentRect = RotatedRectangleF.FromLTRB(resized.bounds.left, containerTop, resized.bounds.right, containerTop + resized.bounds.height);
return alignmentRect.rotateAt(this._rectangle.angle, alignmentRect.center);
}
}
case GripsResizeType.decreaseTop: {
if (containerTop < startTop) {
const scale = placeholderRect.bounds.height / this._rectangle.bounds.height;
const diff = imageBottom - containerBottom;
const resized = this._resizeProportional(rectangle, scale);
const final = RotatedRectangleF.FromLTRB(resized.bounds.left, containerTop, resized.bounds.right, containerTop + resized.height);
if (final.width < placeholderRect.bounds.width || final.height < placeholderRect.bounds.height) {
return this._rectangle;
}
else {
return RotatedRectangleF.FromLTRB(final.bounds.left, final.bounds.top + diff, final.bounds.right, final.bounds.bottom + diff).rotateAt(this._rectangle.angle, final.center);
}
}
else {
return this._rectangle;
}
}
case GripsResizeType.increaseLeft: {
if (containerLeft > imageLeft) {
return this._rectangle;
}
else {
const deltaLeft = imageLeft - containerLeft;
const finalHeight = this._rectangle.bounds.width + deltaLeft;
const scale = finalHeight / this._rectangle.width;
const resized = this._resizeProportional(rectangle, scale);
const alignmentRect = RotatedRectangleF.FromLTRB(containerLeft, resized.bounds.top, containerLeft + resized.bounds.width, resized.bounds.bottom);
return alignmentRect.rotateAt(this._rectangle.angle, alignmentRect.center);
}
}
case GripsResizeType.decreaseLeft: {
if (containerLeft < startLeft) {
const scale = placeholderRect.bounds.width / this._rectangle.bounds.width;
const diff = imageRight - containerRight;
const { bounds } = this._resizeProportional(rectangle, scale);
const final = RotatedRectangleF.FromLTRB(containerLeft, bounds.top, containerLeft + bounds.width, bounds.bottom);
if (final.width < placeholderRect.bounds.width || final.height < placeholderRect.bounds.height) {
return this._rectangle;
}
else {
return RotatedRectangleF.FromLTRB(final.bounds.left + diff, final.bounds.top, final.bounds.right + diff, final.bounds.bottom).rotateAt(this._rectangle.angle, final.center);
}
}
else {
return this._rectangle;
}
}
case GripsResizeType.increaseRight: {
if (containerRight < imageRight) {
return this._rectangle;
}
else {
const deltaRight = containerRight - imageRight;
const finalHeight = this._rectangle.bounds.width + deltaRight;
const scale = finalHeight / this._rectangle.width;
const resized = this._resizeProportional(rectangle, scale);
const alignmentRect = RotatedRectangleF.FromLTRB(containerRight - resized.bounds.width, resized.bounds.top, containerRight, resized.bounds.bottom);
return alignmentRect.rotateAt(this._rectangle.angle, alignmentRect.center);
}
}
case GripsResizeType.decreaseRight: {
if (containerRight > startRight) {
const scale = placeholderRect.width / this._rectangle.bounds.width;
const diff = imageLeft - containerLeft;
const { bounds } = this._resizeProportional(rectangle, scale);
const final = RotatedRectangleF.FromLTRB(containerRight - bounds.width, bounds.top, containerRight, bounds.bottom);
if (final.width < placeholderRect.bounds.width || final.height < placeholderRect.bounds.height) {
return this._rectangle;
}
else {
return RotatedRectangleF.FromLTRB(final.bounds.left + diff, final.bounds.top, final.bounds.right + diff, final.bounds.bottom).rotateAt(this._rectangle.angle, final.center);
}
}
else {
return this._rectangle;
}
}
case GripsResizeType.increaseBottom: {
if (containerBottom < imageBottom) {
return this._rectangle;
}
else {
const deltaBottom = containerBottom - imageBottom;
const finalHeight = this._rectangle.bounds.height + deltaBottom;
const scale = finalHeight / this._rectangle.height;
const resized = this._resizeProportional(rectangle, scale); // ??
const alignmentRect = RotatedRectangleF.FromLTRB(resized.bounds.left, containerBottom - resized.bounds.height, resized.bounds.right, containerBottom);
return alignmentRect.rotateAt(this._rectangle.angle, alignmentRect.center);
}
}
case GripsResizeType.decreaseBottom: {
if (containerBottom > startBottom) {
const scale = placeholderRect.height / this._rectangle.bounds.height;
const diff = imageTop - containerTop;
const resized = this._resizeProportional(rectangle, scale);
const final = RotatedRectangleF.FromLTRB(resized.bounds.left, containerBottom - resized.bounds.height, resized.bounds.right, containerBottom);
if (final.width < placeholderRect.bounds.width || final.height < placeholderRect.bounds.height) {
return this._rectangle;
}
else {
return RotatedRectangleF.FromLTRB(final.bounds.left, final.bounds.top + diff, final.bounds.right, final.bounds.bottom + diff).rotateAt(this._rectangle.angle, final.center);
}
}
else {
return this._rectangle;
}
}
case GripsResizeType.cornerTopLeftDecrease:
case GripsResizeType.cornerTopRightDecrease:
case GripsResizeType.cornerBottomLeftDecrease:
case GripsResizeType.cornerBottomRightDecrease:
case GripsResizeType.cornerTopLeftIncrease:
case GripsResizeType.cornerTopRightIncrease:
case GripsResizeType.cornerBottomLeftIncrease:
case GripsResizeType.cornerBottomRightIncrease: {
const diffX = this._placeholder.previousRectangle.center.x - placeholderRect.center.x;
const diffY = this._placeholder.previousRectangle.center.y - placeholderRect.center.y;
const scale = placeholderRect.width / this._placeholder.previousRectangle.width;
const result = this._resizeProportional(rectangle, scale);
result.translate(-diffX, -diffY);
return result.rotateAt(this._rectangle.angle, result.center);
}
case GripsResizeType.none:
return this._rectangle;
default:
return this._rectangle;
}
}
_resize(type, newRect) {
switch (type) {
case ResizeType.incWidth:
case ResizeType.decWidth: {
const scale = newRect.width / this._rectangle.width;
const resized = this._resizeProportional(this._rectangle.clone(), scale);
return RotatedRectangleF.FromLTRB(this._rectangle.bounds.left, this._rectangle.bounds.top, this._rectangle.bounds.left + resized.width, this._rectangle.bounds.top + resized.height);
}
case ResizeType.incHeight:
case ResizeType.decHeight:
case ResizeType.decHeightAndWidth:
case ResizeType.incHeightAndWidth: {
const scale = newRect.height / this._rectangle.height;
const resized = this._resizeProportional(this._rectangle.clone(), scale);
return RotatedRectangleF.FromLTRB(this._rectangle.bounds.left, this._rectangle.bounds.top, this._rectangle.bounds.left + resized.width, this._rectangle.bounds.top + resized.height);
}
default:
return newRect;
}
}
_resizeProportional(rectangle, scale) {
rectangle.width = rectangle.width * scale;
rectangle.height = rectangle.height * scale;
return rectangle.clone();
}
}
//# sourceMappingURL=ImageCropperHandler.js.map