@aurigma/design-atoms
Version:
Design Atoms is a part of Customer's Canvas SDK which allows for manipulating individual design elements through your code.
331 lines • 16.7 kB
JavaScript
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
var __values = (this && this.__values) || function(o) {
var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
if (m) return m.call(o);
if (o && typeof o.length === "number") return {
next: function () {
if (o && i >= o.length) o = void 0;
return { value: o && o[i++], done: !o };
}
};
throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
};
import { Collection } from "@aurigma/design-atoms-model/Collection";
import { Container } from "@aurigma/design-atoms-model/Product/Container";
import { EventWithSenderArg, EventObject } from "@aurigma/design-atoms-model/EventObject";
import { ShapeItem } from "@aurigma/design-atoms-model/Product/Items/ShapeItem";
import { Path } from "@aurigma/design-atoms-model/Math/Path";
import * as _ from "underscore";
import { PrintAreaBoundsType } from "@aurigma/design-atoms-model/Product/PrintAreaBoundsType";
var SafetyLinesHandler = /** @class */ (function () {
function SafetyLinesHandler(conf, colorParser) {
var _this = this;
this._changedEvent = new EventWithSenderArg();
this._visibilityChangedEvent = new EventObject();
this._containers = null;
this._visible = false;
this._printZoneConf = SafetyLinesHandler._getDefaultPrintZoneConfig();
this._onPrintAreaAdded = function (data) {
_this._clearCurrentSafetyLinesContainers();
_this._subscribePrintAreaEvents(data.item);
_this._changedEvent.notify(_this);
};
this._onPrintAreaRemoved = function (data) {
_this._clearCurrentSafetyLinesContainers();
_this._unsubscribePrintAreaEvents(data.item);
_this._changedEvent.notify(_this);
};
this._onSafetyLinePropertyChanged = function () {
_this._clearCurrentSafetyLinesContainers();
_this._changedEvent.notify(_this);
};
this._onSafetyLinesCollectionRemoved = function (data) {
_this._unsubscribeSafetyLineEvents(data.item);
_this._clearCurrentSafetyLinesContainers();
_this._changedEvent.notify(_this);
};
this._onSafetyLinesCollectionAdded = function (data) {
_this._subscribeSafetyLineEvents(data.item);
_this._clearCurrentSafetyLinesContainers();
_this._changedEvent.notify(_this);
};
this._onSurfaceContainerAdded = function (data) {
_this._clearCurrentSafetyLinesContainers();
_this._subscribeContainerEvents(data.item);
_this._changedEvent.notify(_this);
};
this._onSurfaceContainerRemoved = function (data) {
_this._clearCurrentSafetyLinesContainers();
_this._unsubscribeContainerEvents(data.item);
_this._changedEvent.notify(_this);
};
this._onPrintAreaPropertyChanged = function (sender, propName) {
if (propName !== "bleed" && propName !== "slug" && propName !== "bounds" && propName !== "region")
return;
_this._clearCurrentSafetyLinesContainers();
_this._changedEvent.notify(_this);
};
this._onPrintAreaPropertyChangedDebounce = _.debounce(this._onPrintAreaPropertyChanged, 100);
this.conf = conf;
this._colorParser = colorParser;
}
Object.defineProperty(SafetyLinesHandler.prototype, "conf", {
get: function () {
return this._printZoneConf;
},
set: function (value) {
var defaultConfig = SafetyLinesHandler._getDefaultPrintZoneConfig();
this._printZoneConf.bleed = __assign(__assign({}, defaultConfig.bleed), ((value === null || value === void 0 ? void 0 : value.bleed) || {}));
this._printZoneConf.trim = __assign(__assign({}, defaultConfig.trim), ((value === null || value === void 0 ? void 0 : value.trim) || {}));
this._printZoneConf.region = __assign(__assign({}, defaultConfig.region), ((value === null || value === void 0 ? void 0 : value.region) || {}));
this._clearCurrentSafetyLinesContainers();
this._changedEvent.notify(this);
},
enumerable: true,
configurable: true
});
Object.defineProperty(SafetyLinesHandler.prototype, "surface", {
get: function () {
return this._surface;
},
set: function (value) {
var _this = this;
if (this._surface === value)
return;
if (this._surface != null) {
this._surface.printAreas.remove_itemAdded(this._onPrintAreaAdded);
this._surface.printAreas.remove_itemRemoved(this._onPrintAreaRemoved);
this._surface.printAreas.forEach(function (printArea) { return _this._unsubscribePrintAreaEvents(printArea); });
this._surface.containers.remove_itemAdded(this._onSurfaceContainerAdded);
this._surface.containers.remove_itemRemoved(this._onSurfaceContainerRemoved);
this._surface.containers.forEach(function (containers) { return _this._unsubscribeContainerEvents(containers); });
}
this._surface = value;
this._clearCurrentSafetyLinesContainers();
if (this._surface == null)
return;
this._surface.printAreas.add_itemAdded(this._onPrintAreaAdded);
this._surface.printAreas.add_itemRemoved(this._onPrintAreaRemoved);
this._surface.printAreas.forEach(function (printArea) { return _this._subscribePrintAreaEvents(printArea); });
this._surface.containers.add_itemAdded(this._onSurfaceContainerAdded);
this._surface.containers.add_itemRemoved(this._onSurfaceContainerRemoved);
this._surface.containers.forEach(function (containers) { return _this._subscribeContainerEvents(containers); });
},
enumerable: true,
configurable: true
});
Object.defineProperty(SafetyLinesHandler.prototype, "safetyLinesContainers", {
get: function () {
if (this._containers == null)
this._containers = this._buildSafetyLinesContainers();
return this._containers;
},
enumerable: true,
configurable: true
});
Object.defineProperty(SafetyLinesHandler.prototype, "visible", {
get: function () {
return this._visible;
},
set: function (value) {
var e_1, _a;
if (this._visible === value)
return;
this._visible = value;
if (this._containers != null) {
var changed = false;
try {
for (var _b = __values(this._containers), _c = _b.next(); !_c.done; _c = _b.next()) {
var c = _c.value;
if (c.visible === this._visible)
continue;
c.visible = this._visible;
changed = true;
}
}
catch (e_1_1) { e_1 = { error: e_1_1 }; }
finally {
try {
if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
}
finally { if (e_1) throw e_1.error; }
}
if (changed)
this._visibilityChangedEvent.notify();
}
},
enumerable: true,
configurable: true
});
SafetyLinesHandler.prototype.addChanged = function (h) {
this._changedEvent.add(h);
};
SafetyLinesHandler.prototype.removeChanged = function (h) {
this._changedEvent.remove(h);
};
SafetyLinesHandler.prototype.addVisibilityChanged = function (listener) {
this._visibilityChangedEvent.add(listener);
};
SafetyLinesHandler.prototype.removeVisibilityChanged = function (listener) {
this._visibilityChangedEvent.remove(listener);
};
SafetyLinesHandler.prototype._clearCurrentSafetyLinesContainers = function () {
this._containers = null;
};
SafetyLinesHandler.prototype._subscribePrintAreaEvents = function (printArea) {
var _this = this;
printArea.safetyLines.add_itemAdded(this._onSafetyLinesCollectionAdded);
printArea.safetyLines.add_itemRemoved(this._onSafetyLinesCollectionRemoved);
printArea.safetyLines.forEach(function (safetyLine) { return _this._subscribeSafetyLineEvents(safetyLine); });
printArea.addPropertyChanged(this._onPrintAreaPropertyChangedDebounce);
};
SafetyLinesHandler.prototype._unsubscribePrintAreaEvents = function (printArea) {
var _this = this;
printArea.safetyLines.forEach(function (safetyLine) { return _this._unsubscribeSafetyLineEvents(safetyLine); });
printArea.safetyLines.remove_itemAdded(this._onSafetyLinesCollectionAdded);
printArea.safetyLines.remove_itemRemoved(this._onSafetyLinesCollectionRemoved);
printArea.removePropertyChanged(this._onPrintAreaPropertyChangedDebounce);
};
SafetyLinesHandler.prototype._subscribeSafetyLineEvents = function (safetyLine) {
safetyLine.addPropertyChanged(this._onSafetyLinePropertyChanged);
};
SafetyLinesHandler.prototype._unsubscribeSafetyLineEvents = function (safetyLine) {
safetyLine.removePropertyChanged(this._onSafetyLinePropertyChanged);
};
SafetyLinesHandler.prototype._subscribeContainerEvents = function (container) {
container.addPropertyChanged(this._onPrintAreaPropertyChangedDebounce);
};
SafetyLinesHandler.prototype._unsubscribeContainerEvents = function (container) {
container.removePropertyChanged(this._onPrintAreaPropertyChangedDebounce);
};
SafetyLinesHandler.prototype._buildSafetyLinesContainers = function () {
var e_2, _a, e_3, _b;
var _this = this;
var result = new Collection();
var bleedConf = this._printZoneConf.bleed;
var trimConf = this._printZoneConf.trim;
var regionConf = this._printZoneConf.region;
if (this.surface == null)
return result;
try {
for (var _c = __values(this.surface.printAreas), _d = _c.next(); !_d.done; _d = _c.next()) {
var printArea = _d.value;
if (printArea.safetyLines != null) {
try {
for (var _e = (e_3 = void 0, __values(printArea.safetyLines)), _f = _e.next(); !_f.done; _f = _e.next()) {
var safetyLine = _f.value;
var container = this._createContainer("SafetyLines[" + printArea.name + "]");
var item = this._createDashedRectangleFromSafetyLine(printArea.bounds, safetyLine);
container.items.add(item);
result.add(container);
}
}
catch (e_3_1) { e_3 = { error: e_3_1 }; }
finally {
try {
if (_f && !_f.done && (_b = _e.return)) _b.call(_e);
}
finally { if (e_3) throw e_3.error; }
}
}
if (!printArea.bleed.isEmpty && bleedConf.visible)
this._addSafetyLineContainer(result, printArea.name, printArea.getBounds(PrintAreaBoundsType.Bleed), bleedConf.width, bleedConf.step, bleedConf.color, "bleed", bleedConf.altColor);
if ((!printArea.slug.isEmpty || !printArea.bleed.isEmpty) && trimConf.visible)
this._addSafetyLineContainer(result, printArea.name, printArea.bounds, trimConf.width, trimConf.step, trimConf.color, "trim", trimConf.altColor);
}
}
catch (e_2_1) { e_2 = { error: e_2_1 }; }
finally {
try {
if (_d && !_d.done && (_a = _c.return)) _a.call(_c);
}
finally { if (e_2) throw e_2.error; }
}
if (regionConf.visible) {
this.surface.containers.where(function (c) { return c.region != null; }).forEach(function (c) {
_this._addSafetyLineContainer(result, c.name, c.region, regionConf.width, regionConf.step, regionConf.color, "region");
});
}
return result;
};
SafetyLinesHandler.prototype._addSafetyLineContainer = function (collection, name, bounds, width, step, color, propName, altColor) {
var container = this._createContainer(propName.charAt(0).toUpperCase() + propName.slice(1) + "[" + name + "]");
collection.add(container);
var item = this._createDashedRect(bounds, width, step, this._colorParser.parse(color), propName, altColor && this._colorParser.parse(altColor));
container.items.add(item);
};
SafetyLinesHandler.prototype._createContainer = function (name) {
var container = new Container();
container.locked = true;
container.name = "Bleed[" + name + "]";
container.visible = this._visible;
return container;
};
SafetyLinesHandler.prototype._createDashedRectangleFromSafetyLine = function (bounds, safetyLine) {
var rectangle = safetyLine.getRectangle(bounds);
var radiuses = safetyLine.getCornerRadiuses(bounds);
return this._createDashedRect(rectangle, safetyLine.widthPx, safetyLine.stepPx, safetyLine.color, safetyLine.name, safetyLine.altColor, radiuses);
};
SafetyLinesHandler.prototype._createDashedRect = function (bounds, width, step, color, name, altColor, radiuses) {
var path = Path.roundedRectangle(bounds.left, bounds.top, bounds.width, bounds.height, radiuses);
var shapeItem = new ShapeItem(path);
(shapeItem.name = SafetyLinesHandler.handlerPrefix + "_" + name + "_shape"), (shapeItem.borderColor = color);
shapeItem.fillColor = this._colorParser.parse("transparent");
shapeItem.fixedBorderWidth = true;
shapeItem.borderWidth = width;
if (altColor != null)
shapeItem.altBorderColor = altColor;
shapeItem.dash = [step, 3];
return shapeItem;
};
SafetyLinesHandler.prototype.dispose = function () {
var _this = this;
if (this._surface == null)
return;
this._surface.printAreas.remove_itemAdded(this._onPrintAreaAdded);
this._surface.printAreas.remove_itemRemoved(this._onPrintAreaRemoved);
this._surface.printAreas.forEach(function (printArea) { return _this._unsubscribePrintAreaEvents(printArea); });
this._surface.containers.remove_itemAdded(this._onSurfaceContainerAdded);
this._surface.containers.remove_itemRemoved(this._onSurfaceContainerRemoved);
this._surface.containers.forEach(function (containers) { return _this._unsubscribeContainerEvents(containers); });
};
SafetyLinesHandler._getDefaultPrintZoneConfig = function () {
return {
bleed: {
color: "rgb(255, 0, 0)",
altColor: "rgb(255, 0, 0)",
step: 1,
width: 1,
visible: true
},
trim: {
color: "rgb(255, 0, 0)",
step: 5,
width: 1,
visible: true
},
region: {
color: "rgb(74, 255, 255)",
altColor: "rgb(255, 0, 0)",
step: 5,
width: 1,
visible: false
}
};
};
SafetyLinesHandler.handlerPrefix = "$SAFETY_LINE";
SafetyLinesHandler.isSafetyLineItemHandler = function (h) { return h.name.startsWith(SafetyLinesHandler.handlerPrefix); };
return SafetyLinesHandler;
}());
export { SafetyLinesHandler };
//# sourceMappingURL=SafetyLinesHandler.js.map