@aurigma/design-atoms
Version:
Design Atoms is a part of Customer's Canvas SDK which allows for manipulating individual design elements through your code.
333 lines • 19.2 kB
JavaScript
import { RotatedRectangleF, PointF, RectangleF, EqualsOfFloatNumbers, normalizeAngle, SizeF, ConvertDegreeToRadian } from "@aurigma/design-atoms-model/Math";
import { PlaceholderItemHandler, BaseRectangleItemHandler } from "../../ItemHandlers";
import { getRotatedRectangleWithBorder } from "../../Utils/Math";
import { MinDpiResizeConstraint } from "./Constraints/Resize/MinDpiResizeConstraint";
var SelectionProcessModifier = /** @class */ (function () {
function SelectionProcessModifier(_selectionHandler, _canvas, _snapLinesHandler) {
this._selectionHandler = _selectionHandler;
this._canvas = _canvas;
this._snapLinesHandler = _snapLinesHandler;
this._minDpiResizeConstraint = new MinDpiResizeConstraint();
}
Object.defineProperty(SelectionProcessModifier.prototype, "ignoreSnapLines", {
set: function (value) {
this._ignoreSnapLines = value;
},
enumerable: true,
configurable: true
});
SelectionProcessModifier.prototype.beforeMovePerformed = function (data) {
var _a;
var contentEditingPlaceholderItemHandler = this._canvas.contentEditingPlaceholderItemHandler;
var result = data.delta;
if (this._ignoreSnapLines) {
this._snapLinesHandler.resetActiveLines();
}
else if (this._canvas.contentEditingPlaceholderItemHandler == null) {
var perms = this._selectionHandler.manipulationPermissions;
data.border = this._selectionHandler.border;
result = this._snapLinesHandler.constrainMoveDataToSnapLines(data, this._canvas, perms.allowMoveHorizontal, perms.allowMoveVertical);
}
var startRectWithFrames = this.getRectWithFrames(data.startRectangle);
if (contentEditingPlaceholderItemHandler == null) {
result = this._constrainMoveDataToRegion(startRectWithFrames.bounds, result);
}
else if (contentEditingPlaceholderItemHandler.item.isCoverMode) {
result = this._constrainMoveDataToPlaceholderCover(data.startRectangle, contentEditingPlaceholderItemHandler.rectangle, result);
}
return (_a = result !== null && result !== void 0 ? result : data.delta) !== null && _a !== void 0 ? _a : data.momentDelta;
};
SelectionProcessModifier.prototype.beforeResizePerformed = function (data) {
var _a, _b;
var result = null;
var contentEditingPlaceholderItemHandler = this._canvas.contentEditingPlaceholderItemHandler;
if (contentEditingPlaceholderItemHandler != null && contentEditingPlaceholderItemHandler.item.isCoverMode) {
result = this._constrainResizeDataToPlaceholderCover(data.currentRect, data.startRectangle, contentEditingPlaceholderItemHandler.rectangle, data.resizeIndex);
}
var _c = this._getMinSizeConstraintConfiguration(data.startRectangle, data.startItemHandlersRects), minWidth = _c.minWidth, minHeight = _c.minHeight;
result = this._constrainResizeDataToMinSize(data.startRectangle, result !== null && result !== void 0 ? result : data.currentRect, data.arbitraryResize, data.resizeIndex, minWidth, minHeight);
if (this._canvas.contentEditingPlaceholderItemHandler == null)
result = this._constrainResizeDataToSnapLines(data, result !== null && result !== void 0 ? result : data.currentRect);
var minDpi = (_b = (_a = this._canvas.viewer.configuration) === null || _a === void 0 ? void 0 : _a.handlers) === null || _b === void 0 ? void 0 : _b.imageMinDpi;
if (minDpi != null)
result = this._minDpiResizeConstraint.applyTo(result !== null && result !== void 0 ? result : data.currentRect, data, minDpi);
result = result !== null && result !== void 0 ? result : data.currentRect;
return this._validateRectRelativeToRegion(result) ? result : data.previousRectangle;
};
SelectionProcessModifier.prototype.beforeRotatePerformed = function (data) {
return this._validateRectRelativeToRegion(data.currentRect) ? data.currentRect : data.previousRectangle;
};
SelectionProcessModifier.prototype.getRectWithFrames = function (rectangle) {
var itemHandlers = this._selectionHandler.selectedItemHandlers;
var rectWithFrames = this.getRectangleWithBorder(rectangle);
for (var j = 0; j < itemHandlers.length; j++) {
var itemHandler = itemHandlers.getItem(j);
if (itemHandler == null || !(itemHandler instanceof PlaceholderItemHandler))
continue;
var placeholderRectWithFrames = itemHandler.getRectangleIncludingFrames();
var updatedPlaceholderRectWithFrames = BaseRectangleItemHandler.transformRectangleByTwoRectanglesDiff(placeholderRectWithFrames, this._selectionHandler.rectangle, rectangle);
rectWithFrames =
RotatedRectangleF.union(updatedPlaceholderRectWithFrames, rectWithFrames);
}
return rectWithFrames;
};
SelectionProcessModifier.prototype.getRectangleWithBorder = function (rectangle) {
var border = this._selectionHandler.border;
return getRotatedRectangleWithBorder(rectangle, border);
};
Object.defineProperty(SelectionProcessModifier.prototype, "_region", {
get: function () {
return this._selectionHandler.region;
},
enumerable: true,
configurable: true
});
SelectionProcessModifier.prototype._validateRectRelativeToRegion = function (rect) {
if (!this._canvas.suppressOutOfRegionManipulation ||
this._canvas.contentEditingPlaceholderItemHandler != null ||
this._region == null)
return true;
var extendedRectBounds = this.getRectWithFrames(rect).bounds;
return this._region.containsRectangle(extendedRectBounds);
};
SelectionProcessModifier.prototype._constrainMoveDataToRegion = function (bounds, diff) {
if (!this._canvas.suppressOutOfRegionManipulation || this._region == null)
return diff;
if (bounds.left + diff.x < this._region.left)
diff.x = this._region.left - bounds.left;
if (bounds.top + diff.y < this._region.top)
diff.y = this._region.top - bounds.top;
if (bounds.right + diff.x > this._region.left + this._region.width)
diff.x = this._region.left + this._region.width - bounds.right;
if (bounds.bottom + diff.y > this._region.top + this._region.height)
diff.y = this._region.top + this._region.height - bounds.bottom;
return diff;
};
SelectionProcessModifier.prototype._constrainMoveDataToPlaceholderCover = function (placeholderContentRectangle, placeholderRectangle, diff) {
var angle = placeholderRectangle.angle;
placeholderRectangle.angle = 0;
var placeholderBounds = placeholderRectangle.bounds;
var placeholderContentRectangleWithoutAngle = placeholderContentRectangle.clone();
placeholderContentRectangleWithoutAngle.rotateAt(-angle, placeholderRectangle.center);
var placeholderContentBounds = placeholderContentRectangleWithoutAngle.bounds;
diff.rotate(-angle);
if (placeholderContentBounds.left + diff.x > placeholderBounds.left)
diff.x = placeholderBounds.left - placeholderContentBounds.left;
if (placeholderContentBounds.top + diff.y > placeholderBounds.top)
diff.y = placeholderBounds.top - placeholderContentBounds.top;
if (placeholderContentBounds.right + diff.x < placeholderBounds.left + placeholderBounds.width)
diff.x = placeholderBounds.left + placeholderBounds.width - placeholderContentBounds.right;
if (placeholderContentBounds.bottom + diff.y < placeholderBounds.top + placeholderBounds.height)
diff.y = placeholderBounds.top + placeholderBounds.height - placeholderContentBounds.bottom;
diff.rotate(angle);
return diff;
};
SelectionProcessModifier.prototype._constrainResizeDataToPlaceholderCover = function (r, startRectangle, placeholderRectangle, resizeIndex) {
var contentAngle = r.angle;
var angle = placeholderRectangle.angle;
var isContentAngleRotatedOn90Or270 = EqualsOfFloatNumbers(90, normalizeAngle(contentAngle - angle) % 180);
placeholderRectangle.angle = 0;
var placeholderBounds = placeholderRectangle.bounds;
r.rotateAt(-angle, placeholderRectangle.center);
var rectangleBounds = r.bounds;
var left = Math.min(rectangleBounds.left, placeholderBounds.left);
var top = Math.min(rectangleBounds.top, placeholderBounds.top);
var right = Math.max(rectangleBounds.right, placeholderBounds.right);
var bottom = Math.max(rectangleBounds.bottom, placeholderBounds.bottom);
var width = right - left;
var height = bottom - top;
var xyScale = isContentAngleRotatedOn90Or270 ? startRectangle.height / startRectangle.width : startRectangle.width / startRectangle.height;
var curXyScale = width / height;
var grip = (((resizeIndex - 1) + Math.round(normalizeAngle(contentAngle - angle) / 90)) % 4) + 1;
if (curXyScale > xyScale) {
var dh = Math.abs(width / xyScale - width / curXyScale);
if (grip === 1 || grip === 2)
top = top - dh;
else // 3 || 4
bottom = bottom + dh;
}
if (curXyScale < xyScale) {
var dw = Math.abs(height * xyScale - height * curXyScale);
if (grip === 2 || grip === 3)
right = right + dw;
else // 1 || 4
left = left - dw;
}
var rf = new RectangleF(left, top, right - left, bottom - top);
if (!EqualsOfFloatNumbers(0, contentAngle - angle % 360)) {
var rotatedRectangle = RotatedRectangleF.fromRectangleF(rf);
rotatedRectangle.rotateAt(angle - contentAngle, placeholderRectangle.center);
rf = rotatedRectangle.bounds;
}
var result = RotatedRectangleF.fromRectangleF(rf);
result.rotateAt(contentAngle, placeholderRectangle.center);
return result;
};
SelectionProcessModifier.prototype._getMinSizeConstraintConfiguration = function (startRect, handlersRects) {
var _this = this;
var getHandlerMinSize = function (e) {
var _a, _b;
var resizeLimitConfig = (_b = (_a = _this._canvas.viewer.configuration) === null || _a === void 0 ? void 0 : _a.handlers) === null || _b === void 0 ? void 0 : _b.resizeLimits;
if (resizeLimitConfig) {
for (var prop in resizeLimitConfig) {
if ((prop + "Item").toLowerCase() == e.itemType.toLowerCase())
return resizeLimitConfig[prop];
}
}
if ((resizeLimitConfig === null || resizeLimitConfig === void 0 ? void 0 : resizeLimitConfig.common) != null)
return resizeLimitConfig.common;
return new SizeF(null, null);
};
var calcResizeWidthCoeff = function (elementStartRect, deltaAngleRad) {
var cos = Math.abs(Math.cos(deltaAngleRad));
var sin = Math.abs(Math.sin(deltaAngleRad));
var projectedWidth = cos * elementStartRect.width;
var projectedHeight = sin * elementStartRect.width;
return { projectedWidth: projectedWidth, projectedHeight: projectedHeight, cos: cos, sin: sin };
};
var calcResizeHeightCoeff = function (elementStartRect, deltaAngleRad) {
var cos = Math.abs(Math.cos(deltaAngleRad));
var sin = Math.abs(Math.sin(deltaAngleRad));
var projectedHeight = cos * elementStartRect.height;
var projectedWidth = sin * elementStartRect.height;
return { projectedWidth: projectedWidth, projectedHeight: projectedHeight, cos: cos, sin: sin };
};
var globalMinWidth = null;
var globalMinHeight = null;
handlersRects.forEach(function (element) {
var minSize = getHandlerMinSize(element);
var deltaAngle = (element.startRectangle.angle - startRect.angle) % 180;
var deltaAngleRad = ConvertDegreeToRadian(deltaAngle);
var fromWidthCoeff = calcResizeWidthCoeff(element.startRectangle, deltaAngleRad);
if (!EqualsOfFloatNumbers(fromWidthCoeff.cos, 0) && minSize.width !== null) {
var minPw = fromWidthCoeff.cos * minSize.width;
var minGw = minPw * startRect.width / fromWidthCoeff.projectedWidth;
if (globalMinWidth == null || globalMinWidth < minGw)
globalMinWidth = minGw;
}
if (!EqualsOfFloatNumbers(fromWidthCoeff.sin, 0) && minSize.width !== null) {
var minPh = minSize.width * fromWidthCoeff.sin;
var minGh = minPh * startRect.height / fromWidthCoeff.projectedHeight;
if (globalMinWidth == null || globalMinWidth < minGh)
globalMinHeight = minGh;
}
var fromHeightCoeff = calcResizeHeightCoeff(element.startRectangle, deltaAngleRad);
if (!EqualsOfFloatNumbers(fromHeightCoeff.cos, 0) && minSize.height !== null) {
var minPh = minSize.height * fromHeightCoeff.cos;
var minGh = minPh * startRect.height / fromHeightCoeff.projectedHeight;
if (globalMinHeight == null || globalMinHeight < minGh)
globalMinHeight = minGh;
}
if (!EqualsOfFloatNumbers(fromHeightCoeff.sin, 0) && minSize.height !== null) {
var minPw = minSize.height * fromHeightCoeff.sin;
var minGw = minPw * startRect.width / fromHeightCoeff.projectedWidth;
if (globalMinHeight == null || globalMinHeight < minGw)
globalMinHeight = minGw;
}
});
return { minWidth: globalMinWidth, minHeight: globalMinHeight };
};
SelectionProcessModifier.prototype._constrainResizeDataToMinSize = function (startRect, rect, arbitraryResize, resizeIndex, minWidth, minHeight) {
minWidth = Math.min(minWidth, startRect.width);
minHeight = Math.min(minHeight, startRect.height);
var resultRect = rect.clone();
var inverseWidth = false;
var inverseHeight = false;
if (resultRect.width < 0)
inverseWidth = true;
if (resultRect.height < 0)
inverseHeight = true;
var whRatio = startRect.width / startRect.height;
var _a = this._calculateMinWidthAndHeight(Math.abs(rect.width), Math.abs(rect.height), minWidth, minHeight, whRatio, arbitraryResize), resultWidth = _a.resultWidth, resultHeight = _a.resultHeight, isChanged = _a.isChanged;
if (isChanged) {
resultRect.width = inverseWidth ? -resultWidth : resultWidth;
resultRect.height = inverseHeight ? -resultHeight : resultHeight;
this._alignRectangleWithStartRectangle(startRect, resultRect, resizeIndex);
}
return resultRect;
};
SelectionProcessModifier.prototype._calculateMinWidthAndHeight = function (curWidth, curHeight, minWidth, minHeight, whRatio, arbitraryResize) {
var resultWidth = curWidth;
var resultHeight = curHeight;
var isChangedWidth = false;
var isChangedHeight = false;
if (resultWidth < minWidth) {
resultWidth = minWidth;
isChangedWidth = true;
}
if (resultHeight < minHeight) {
resultHeight = minHeight;
isChangedHeight = true;
}
var isChanged = isChangedHeight || isChangedWidth;
if (isChanged && !arbitraryResize) {
var correctWidth = function (h) { return h * whRatio; };
var correctHeight = function (w) { return w * (1 / whRatio); };
if (isChangedWidth) {
resultHeight = correctHeight(resultWidth);
if (resultHeight < minHeight) {
resultHeight = minHeight;
resultWidth = correctWidth(resultHeight);
}
}
else if (isChangedHeight) {
resultWidth = correctWidth(resultHeight);
if (resultWidth < minWidth) {
resultWidth = minWidth;
resultHeight = correctHeight(resultWidth);
}
}
}
return { resultWidth: resultWidth, resultHeight: resultHeight, isChanged: isChanged };
};
SelectionProcessModifier.prototype._alignRectangleWithStartRectangle = function (startRect, rect, resizeIndex) {
// resize index
// 1 6 2
// 5 7
// 4 8 3
var startPoint;
var rectPoint;
switch (resizeIndex) {
case 1:
startPoint = startRect.getBottomRightCorner();
rectPoint = rect.getBottomRightCorner();
break;
case 2:
startPoint = startRect.getBottomLeftCorner();
rectPoint = rect.getBottomLeftCorner();
break;
case 3:
startPoint = startRect.getUpperLeftCorner();
rectPoint = rect.getUpperLeftCorner();
break;
case 4:
startPoint = startRect.getUpperRightCorner();
rectPoint = rect.getUpperRightCorner();
break;
case 5:
startPoint = startRect.getRightCenterPoint();
rectPoint = rect.getRightCenterPoint();
break;
case 6:
startPoint = startRect.getBottomCenterPoint();
rectPoint = rect.getBottomCenterPoint();
break;
case 7:
startPoint = startRect.getLeftCenterPoint();
rectPoint = rect.getLeftCenterPoint();
break;
case 8:
startPoint = startRect.getUpperCenterPoint();
rectPoint = rect.getUpperCenterPoint();
break;
}
var diff = new PointF(startPoint.x - rectPoint.x, startPoint.y - rectPoint.y);
rect.translate(diff.x, diff.y);
};
SelectionProcessModifier.prototype._constrainResizeDataToSnapLines = function (params, currentRect) {
return this._snapLinesHandler.constrainRectangleToSnapLines(currentRect, this.getRectangleWithBorder(params.previousRectangle), params.arbitraryResize, params.resizeIndex, this.getRectWithFrames(currentRect), this.getRectangleWithBorder(currentRect), this._canvas, this._selectionHandler.border);
};
return SelectionProcessModifier;
}());
export { SelectionProcessModifier };
//# sourceMappingURL=SelectionProcessModifier.js.map