@aurigma/design-atoms
Version:
Design Atoms is a part of Customer's Canvas SDK which allows for manipulating individual design elements through your code.
202 lines • 8.15 kB
JavaScript
var __read = (this && this.__read) || function (o, n) {
var m = typeof Symbol === "function" && o[Symbol.iterator];
if (!m) return o;
var i = m.call(o), r, ar = [], e;
try {
while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
}
catch (error) { e = { error: error }; }
finally {
try {
if (r && !r.done && (m = i["return"])) m.call(i);
}
finally { if (e) throw e.error; }
}
return ar;
};
import { Collection } from "@aurigma/design-atoms-model/Collection";
import { Container } from "@aurigma/design-atoms-model/Product/Container";
import { GridItem } from "@aurigma/design-atoms-model/Product/Items/GridItem";
import { EventObject } from "@aurigma/design-atoms-model/EventObject";
import { getUnitScale } from "./Interfaces";
var GridHandler = /** @class */ (function () {
function GridHandler(colorParser) {
var _this = this;
this._visible = false;
this._changedEvent = new EventObject();
this._onBleedChange = function (sender, propertyName) {
switch (propertyName) {
case "bleed":
case "slug":
_this._reCreateItem();
break;
}
};
this._onSurfacePropertyChanged = function (sender, propertyName) {
switch (propertyName) {
case "width":
case "height":
_this._updateGrid();
break;
}
};
this._colorParser = colorParser;
}
Object.defineProperty(GridHandler.prototype, "surface", {
get: function () {
return this._surface;
},
set: function (value) {
if (this._surface === value)
return;
if (this._surface != null) {
this.surface.removePropertyChanged(this._onSurfacePropertyChanged);
this.removeBleedListener();
}
this._surface = value;
if (this._surface != null) {
this.surface.addPropertyChanged(this._onSurfacePropertyChanged);
this.addBleedListener();
}
this._updateGrid();
},
enumerable: true,
configurable: true
});
GridHandler.prototype.setConfig = function (config, rulersConfig) {
this._config = config;
this._rulersConfig = rulersConfig;
if (!this.gridContainer)
return;
this._reCreateItem();
};
GridHandler.prototype.removeBleedListener = function () {
var _this = this;
this.surface.printAreas.forEach(function (pa) { return pa.removePropertyChanged(_this._onBleedChange); });
};
GridHandler.prototype.addBleedListener = function () {
var _this = this;
this.surface.printAreas.forEach(function (pa) { return pa.addPropertyChanged(_this._onBleedChange); });
};
Object.defineProperty(GridHandler.prototype, "gridContainers", {
get: function () {
var result = new Collection();
if (this._gridContainer != null)
result.add(this._gridContainer);
return result;
},
enumerable: true,
configurable: true
});
Object.defineProperty(GridHandler.prototype, "gridContainer", {
get: function () {
return this._gridContainer;
},
enumerable: true,
configurable: true
});
Object.defineProperty(GridHandler.prototype, "visible", {
get: function () {
return this._visible;
},
set: function (value) {
if (this._visible === value)
return;
this._visible = value;
this._updateGrid();
},
enumerable: true,
configurable: true
});
GridHandler.prototype.getGridParameters = function () {
var grid = this._gridContainer.items.get(0);
if (grid == null)
return null;
return {
location: grid.location,
cols: grid.cols,
stepX: grid.stepX,
rows: grid.rows,
stepY: grid.stepY
};
};
GridHandler.prototype.addChanged = function (listener) {
this._changedEvent.add(listener);
};
GridHandler.prototype.removeChanged = function (listener) {
this._changedEvent.remove(listener);
};
GridHandler.prototype._updateGrid = function () {
if (this._gridContainer == null || this._width != this.surface.width || this._height != this.surface.height)
this._gridContainer = this._createGrid();
if (this._gridContainer != null && this._gridContainer.visible !== this._visible) {
this._gridContainer.visible = this._visible;
this._changedEvent.fire();
}
};
GridHandler.prototype._createGrid = function () {
if (this.surface == null)
return null;
this._width = this.surface.width;
this._height = this.surface.height;
if (this.surface.width === 0 || this.surface.height === 0)
return null;
if (this._config == null)
return null;
var container = new Container();
container.locked = true;
container.visible = false;
container.name = "Grid";
this._createGridItem(container);
return container;
};
GridHandler.prototype._getSteps = function () {
var scale = getUnitScale(this._rulersConfig);
var stepX = this._config.stepX / scale;
var stepY = this._config.stepY / scale;
return [stepX, stepY];
};
GridHandler.prototype._createGridItem = function (container) {
var mainPrintArea = this._getMainPrintArea();
var bleed = mainPrintArea.bleed;
var slug = mainPrintArea.slug;
var left = (bleed.left || 0) + (slug.left || 0);
var right = (bleed.right || 0) + (slug.right || 0);
var top = (bleed.top || 0) + (slug.top || 0);
var bottom = (bleed.bottom || 0) + (slug.bottom || 0);
var _a = __read(this._getSteps(), 2), stepX = _a[0], stepY = _a[1];
if (stepX > 0 && stepY > 0) {
var colsNumber = Math.round((this._width + left + right + stepX) / stepX) + 1;
var rowsNumber = Math.round((this._height + top + bottom + stepY) / stepY) + 1;
var offsetX = left > stepX ? stepX - (left % stepX) : stepX - left;
var offsetY = top > stepY ? stepY - (top % stepY) : stepY - top;
if (colsNumber > 0 && colsNumber !== Number.POSITIVE_INFINITY && rowsNumber > 0 && rowsNumber !== Number.POSITIVE_INFINITY) {
var gridItem = new GridItem(-1 * (left + offsetX), -1 * (top + offsetY), colsNumber, rowsNumber, stepX, stepY);
gridItem.horizontalLineColor = this._colorParser.parse(this._config.horizontalColor);
gridItem.verticalLineColor = this._colorParser.parse(this._config.verticalColor);
gridItem.lineWidth = this._config.lineWidthPx;
gridItem.fixedLineWidth = true;
container.items.add(gridItem);
}
}
};
GridHandler.prototype._getMainPrintArea = function () {
var main = this.surface.printAreas.get(0);
this.surface.printAreas.toArray().forEach(function (pa) {
var _a = pa.bounds, top = _a.top, left = _a.left;
var mainBounds = main.bounds;
if (left < mainBounds.left && top < mainBounds.top) {
main = pa;
}
});
return main;
};
GridHandler.prototype._reCreateItem = function () {
this.gridContainer.items.clear();
this._createGridItem(this.gridContainer);
this._changedEvent.fire();
};
return GridHandler;
}());
export { GridHandler };
//# sourceMappingURL=GridHandler.js.map