@aurigma/design-atoms
Version:
Design Atoms is a part of Customer's Canvas SDK which allows for manipulating individual design elements through your code.
221 lines • 16.4 kB
JavaScript
import { PointF, RectangleF } from "@aurigma/design-atoms-model/Math";
var CoordinatesConvertUtils = /** @class */ (function () {
function CoordinatesConvertUtils() {
}
CoordinatesConvertUtils.workspaceToContentPoint = function (point, context) {
return CoordinatesConvertUtils.controlToContentPoint(CoordinatesConvertUtils.workspaceToControlPoint(point, context), context);
};
CoordinatesConvertUtils.controlToContentPoint = function (point, context) {
var viewportLocation = context.getViewportLocation();
var sp = context.getActualScrollPosition();
var pt = new PointF(0, 0);
var x = point.x;
var y = point.y;
pt.x = x - viewportLocation.x + sp.x;
pt.y = y - viewportLocation.y + sp.y;
return pt.round();
};
CoordinatesConvertUtils.controlToPagePoint = function (point, viewerElement) {
var pageCoords = this.getElementPageCoord(viewerElement);
var x = point.x;
var y = point.y;
var pageX = x + pageCoords.left;
var pageY = y + pageCoords.top;
return new PointF(Math.round(pageX), Math.round(pageY));
};
CoordinatesConvertUtils.contentToControlPoint = function (point, context) {
var vl = context.getViewportLocation();
var sp = context.getActualScrollPosition();
var pt = new PointF(0, 0);
pt.x = point.x + vl.x - sp.x;
pt.y = point.y + vl.y - sp.y;
return pt.round();
};
CoordinatesConvertUtils.controlToContentRectangle = function (rect, context) {
var pt1 = new PointF(rect.left, rect.top);
var pt2 = new PointF(rect.left + rect.width, rect.top + rect.height);
pt1 = CoordinatesConvertUtils.controlToContentPoint(pt1, context);
pt2 = CoordinatesConvertUtils.controlToContentPoint(pt2, context);
return new RectangleF(pt1.x, pt1.y, pt2.x - pt1.x, pt2.y - pt1.y);
};
CoordinatesConvertUtils.contentToControlRectangle = function (rect, context) {
var pt1 = new PointF(rect.left, rect.top);
var pt2 = new PointF(rect.left + rect.width, rect.top + rect.height);
pt1 = CoordinatesConvertUtils.contentToControlPoint(pt1, context);
pt2 = CoordinatesConvertUtils.contentToControlPoint(pt2, context);
return new RectangleF(pt1.x, pt1.y, pt2.x - pt1.x, pt2.y - pt1.y);
};
CoordinatesConvertUtils.workspaceToControlPoint = function (point, context) {
var z = context.zoom;
var x = point.x;
var y = point.y;
var pt = new PointF(Math.round(x * z * context.screenXDpi / 72), Math.round(y * z * context.screenYDpi / 72));
return CoordinatesConvertUtils.contentToControlPoint(pt, context).round();
};
CoordinatesConvertUtils.productToControlPoint = function (point, context, offset) {
var wkPoint = this.productToWorkspace(point, offset);
return this.workspaceToControlPoint(wkPoint, context);
};
CoordinatesConvertUtils.workspaceToWhiteSpacePoint = function (point, context) {
var result = CoordinatesConvertUtils.workspaceToContentPoint(point, context);
var rulerWidth = context.rulerEnabled ? context.rulerWidth : 0;
var viewportLocation = context.getViewportLocation();
return new PointF(result.x - rulerWidth + viewportLocation.x, result.y - rulerWidth + viewportLocation.y);
};
CoordinatesConvertUtils.workspaceToWhiteSpacePointCorrect = function (point, context) {
var ws = this._transformByContentAngleWsToPage(point, context);
var result = CoordinatesConvertUtils.workspaceToWhiteSpacePoint(ws, context);
return result;
};
CoordinatesConvertUtils.whitespaceToWorkspacePoint = function (point, context) {
var rulerWidth = context.rulerEnabled ? context.rulerWidth : 0;
var viewportLocation = context.getViewportLocation();
return CoordinatesConvertUtils.controlToWorkspacePoint(this.contentToControlPoint(new PointF(point.x - viewportLocation.x + rulerWidth, point.y - viewportLocation.y + rulerWidth), context), context);
};
CoordinatesConvertUtils.whitespaceToWorkspacePointCorrect = function (point, context) {
var rulerWidth = context.rulerEnabled ? context.rulerWidth : 0;
var viewportLocation = context.getViewportLocation();
var pt = CoordinatesConvertUtils.controlToWorkspacePoint(this.contentToControlPoint(new PointF(point.x - viewportLocation.x + rulerWidth, point.y - viewportLocation.y + rulerWidth), context), context);
pt = this._transformByContentAnglePageToWs(pt, context);
return pt;
};
CoordinatesConvertUtils.controlToWorkspacePoint = function (point, context) {
/// <summary>Translates coordinates from the control-related coordinate system to the workspace-related one.</summary>
/// <param name="point" type="AjaxControlsPointF">Coordinates in the control coordinate system.</param>
/// <returns type="PointF">Coordinates in the workspace coordinate system.</returns>
/// <remarks><para>The <see cref="T:J:BitmapViewer" /> allows to handle two coordinate systems: workspace-related and control-related and provides the <see cref="M:J:BaseViewer.controlToWorkspacePoint" /> method to translate the point from the control-related coordinate system to the workspace-related one.</para><para>The workspace-related coordinate system represents logical coordinates of the image loaded in the control and allows to work with it regardless of zoom, scroll or alignment. The control-related one is used to measure parameters of standard control events (e.g. position of the mouse pointer).</para><para>This method corresponds to <see cref="M:Aurigma.AjaxControls.BaseViewer.ControlToWorkspace(System.Drawing.PointF)">BaseViewer.ControlToWorkspace(System.Drawing.PointF)</see> server-side member.</para></remarks>
/// <seealso cref="M:J:BaseViewer.workspaceToControlPoint" />
var zoom = context.zoom;
var contentPoint = CoordinatesConvertUtils.controlToContentPoint(point, context);
return new PointF(contentPoint.x / (zoom * context.screenXDpi / 72), contentPoint.y / (zoom * context.screenYDpi / 72));
};
CoordinatesConvertUtils.controlToWorkspacePointCorrect = function (point, context) {
/// <summary>Translates coordinates from the control-related coordinate system to the workspace-related one.</summary>
/// <param name="point" type="AjaxControlsPointF">Coordinates in the control coordinate system.</param>
/// <returns type="PointF">Coordinates in the workspace coordinate system.</returns>
/// <remarks><para>The <see cref="T:J:BitmapViewer" /> allows to handle two coordinate systems: workspace-related and control-related and provides the <see cref="M:J:BaseViewer.controlToWorkspacePoint" /> method to translate the point from the control-related coordinate system to the workspace-related one.</para><para>The workspace-related coordinate system represents logical coordinates of the image loaded in the control and allows to work with it regardless of zoom, scroll or alignment. The control-related one is used to measure parameters of standard control events (e.g. position of the mouse pointer).</para><para>This method corresponds to <see cref="M:Aurigma.AjaxControls.BaseViewer.ControlToWorkspace(System.Drawing.PointF)">BaseViewer.ControlToWorkspace(System.Drawing.PointF)</see> server-side member.</para></remarks>
/// <seealso cref="M:J:BaseViewer.workspaceToControlPoint" />
var z = context.zoom;
var pt = CoordinatesConvertUtils.controlToContentPoint(point, context);
pt = new PointF(pt.x / (z * context.screenXDpi / 72), pt.y / (z * context.screenYDpi / 72));
pt = this._transformByContentAnglePageToWs(pt, context);
return pt;
};
CoordinatesConvertUtils.workspaceToControlRectangle = function (rect, context) {
/// <summary>Translates rectangle coordinates from the workspace-related coordinate system to the control-related one.</summary>
/// <param name="rect" type="Rectangle">Rectangle coordinates in the workspace coordinate system.</param>
/// <returns type="Rectangle">Rectangle coordinates in the control coordinate system.</returns>
/// <remarks><para>The <see cref="T:J:BitmapViewer" /> allows to handle two coordinate systems: workspace-related and control-related and provides the <see cref="M:J:BaseViewer.workspaceToControlRectangle" /> method to translate the rectangle from the workspace-related coordinate system to the control-related one.</para><para>The workspace-related coordinate system represents logical coordinates of the image loaded in the control and allows to work with it regardless of zoom, scroll or alignment. The control-related one is used to measure parameters of standard control events (e.g. position of the mouse pointer).</para><para>This method corresponds to <see cref="M:Aurigma.AjaxControls.BaseViewer.WorkspaceToControl(System.Drawing.RectangleF)">BaseViewer.WorkspaceToControl(System.Drawing.RectangleF)</see> server-side member.</para></remarks>
/// <seealso cref="M:J:BaseViewer.controlToWorkspaceRectangle" />
var z = context.zoom;
var hs = context.screenXDpi / 72 * z;
var vs = context.screenYDpi / 72 * z;
var newRect = new RectangleF(Math.round(rect.left * hs), Math.round(rect.top * vs), Math.round(rect.width * hs), Math.round(rect.height * vs));
return CoordinatesConvertUtils.contentToControlRectangle(newRect, context);
};
CoordinatesConvertUtils.pageToControlPoint = function (pagePoint, viewer) {
/// <summary>Translates coordinates from the page-related coordinate system to the control-related one.</summary>
/// <param name="point" type="AjaxControlsPointF">Coordinates in the page coordinate system.</param>
var pageCoords = this.getElementPageCoord(viewer.element);
var holderX = pagePoint.x - pageCoords.left;
var holderY = pagePoint.y - pageCoords.top;
return new PointF(Math.round(holderX), Math.round(holderY));
};
CoordinatesConvertUtils.pageToWorkspacePoint = function (pagePoint, viewer, dontRotate) {
/// <summary>Translates coordinates from the page-related coordinate system to the workspace-related one.</summary>
/// <param name="point" type="AjaxControlsPointF">Coordinates in the page coordinate system.</param>
if (dontRotate === void 0) { dontRotate = false; }
//TODO: get rid of canvas workspace reference
var p = CoordinatesConvertUtils.controlToWorkspacePoint(this.pageToControlPoint(pagePoint, viewer), viewer);
var point = new PointF(p.x, p.y);
if (dontRotate !== true)
point = this._transformByContentAnglePageToWs(point, viewer);
return point;
};
CoordinatesConvertUtils.pageToWhitespace = function (pagePoint, viewer) {
var workspacePoint = this.pageToWorkspacePoint(pagePoint, viewer, true);
var whitespace = this.workspaceToWhiteSpacePoint(workspacePoint, viewer);
return whitespace;
};
CoordinatesConvertUtils.workspaceToPagePoint = function (source, viewer) {
var controlPoint = this.workspaceToControlPointCorrect(source, viewer);
return this.controlToPagePoint(controlPoint, viewer.element);
};
CoordinatesConvertUtils._transformByContentAnglePageToWs = function (source, context) {
var pagePoint = new PointF(source.x, source.y);
var angle = context.contentAngle;
if (angle > 0) {
pagePoint.rotate(-angle);
if (angle === 90)
pagePoint.translate(0, context.workspaceHeight);
else if (angle === 180)
pagePoint.translate(context.workspaceWidth, context.workspaceHeight);
else if (angle === 270)
pagePoint.translate(context.workspaceWidth, 0);
}
return pagePoint;
};
CoordinatesConvertUtils._transformByContentAngleWsToPage = function (source, context) {
var wsPoint = new PointF(source.x, source.y);
var angle = context.contentAngle;
if (angle > 0) {
switch (angle) {
case 0:
break;
case 90:
wsPoint.translate(0, -context.workspaceHeight);
break;
case 180:
wsPoint.translate(-context.workspaceWidth, -context.workspaceHeight);
break;
case 270:
wsPoint.translate(-context.workspaceWidth, 0);
break;
default:
throw new Error("Unexpected content angle: " + angle);
}
wsPoint.rotate(angle);
}
return wsPoint;
};
CoordinatesConvertUtils.workspaceToControlPointCorrect = function (source, context) {
var wsPoint = this._transformByContentAngleWsToPage(source, context);
var controlPoint = this.workspaceToControlPoint(wsPoint, context);
return controlPoint;
};
CoordinatesConvertUtils.controlToWorkspaceRectangle = function (rectangle, context) {
/// <summary>Translates rectangle coordinates from the control-related coordinate system to the workspace-related one.</summary>
/// <param name="rect" type="Rectangle">Rectangle coordinates in the control coordinate system.</param>
/// <returns type="Rectangle">Rectangle coordinates in the workspace coordinate system.</returns>
/// <remarks><para>The <see cref="T:J:BitmapViewer" /> allows to handle two coordinate systems: workspace-related and control-related and provides the <see cref="M:J:BaseViewer.controlToWorkspaceRectangle" /> method to translate the rectangle from the control-related coordinate system to the workspace-related one.</para><para>The workspace-related coordinate system represents logical coordinates of the image loaded in the control and allows to work with it regardless of zoom, scroll or alignment. The control-related one is used to measure parameters of standard control events (e.g. position of the mouse pointer).</para><para>This method corresponds to <see cref="M:Aurigma.AjaxControls.BaseViewer.ControlToWorkspace(System.Drawing.RectangleF)">BaseViewer.ControlToWorkspace(System.Drawing.RectangleF)</see> server-side member.</para></remarks>
/// <seealso cref="M:J:BaseViewer.workspaceToControlRectangle" />
var z = context.zoom;
var hs = 1 / (z * context.screenXDpi / 72);
var vs = 1 / (z * context.screenYDpi / 72);
var newRect = CoordinatesConvertUtils.controlToContentRectangle(rectangle, context);
return new RectangleF(newRect.left * hs, newRect.top * vs, newRect.width * hs, newRect.height * vs);
};
CoordinatesConvertUtils.contentToWhitespaceRectangle = function (rect, context) {
var rulerWidth = context.rulerEnabled ? context.rulerWidth : 0;
var viewportLocation = context.getViewportLocation();
return new RectangleF(rect.left + viewportLocation.x - rulerWidth, rect.top + viewportLocation.y - rulerWidth, rect.width, rect.height);
};
CoordinatesConvertUtils.workspaceToProduct = function (workspacePoint, offset) {
if (offset == null || offset.isOrigin())
return workspacePoint.clone();
return new PointF(workspacePoint.x - offset.x, workspacePoint.y - offset.y);
};
CoordinatesConvertUtils.productToWorkspace = function (product, offset) {
if (offset == null || offset.isOrigin())
return product.clone();
return new PointF(product.x + offset.x, product.y + offset.y);
};
CoordinatesConvertUtils.getElementPageCoord = function (domElement) {
//TODO for IE pinch zoom need specific calculation?
var offset = domElement.getBoundingClientRect();
return { left: offset.left, top: offset.top };
};
return CoordinatesConvertUtils;
}());
export { CoordinatesConvertUtils };
//# sourceMappingURL=CoordinatesConvertUtils.js.map