@aurigma/design-atoms/ItemDataHandler.js

Design Atoms is a part of Customer's Canvas SDK which allows for manipulating individual design elements through your code.

import { PlaceholderItem, ImageItem } from "@aurigma/design-atoms-model/Product/Items";
import { ItemUtils } from "./Utils/ItemUtils";
import { ImageEffect } from "./ItemHandlers";
import { JsonColorParser } from "./Serialization";
import { isEqual } from "@aurigma/design-atoms-model/Utils";
export class ItemDataHandler {
    constructor(_itemData, _colorPreviewServce, _colorParser) {
        this._itemData = _itemData;
        this._colorPreviewServce = _colorPreviewServce;
        this._colorParser = _colorParser;
    }
    applyImage(image) {
        let changed = this.applyShape(image);
        changed = this._applyColor(image, "overlayColor", "fillColor") || changed;
        return changed;
    }
    applyLine(line) {
        let changed = this._applyOpacity(line);
        changed = this._applyColor(line) || changed;
        changed = this._applyVisibility(line) || changed;
        return changed;
    }
    applyDashedLine(dashedLine) {
        let changed = this._applyOpacity(dashedLine);
        changed = this._applyColor(dashedLine) || changed;
        changed = this._applyColor(dashedLine, "altColor", "altColor") || changed;
        changed = this._applyVisibility(dashedLine) || changed;
        return changed;
    }
    async applyBaseText(text) {
        let changed = this.applyShape(text);
        changed = this._applyColor(text) || changed;
        changed = this._applyFont(text) || changed;
        changed = this._applyTextProperty(text, "underline") || changed;
        changed = this._applyTextProperty(text, "tracking") || changed;
        changed = this._applyTextProperty(text, "leading") || changed;
        changed = await this._applyShadow(text) || changed;
        changed = this._applyStroke(text) || changed;
        return changed;
    }
    applyShape(shape) {
        let changed = this._applyOpacity(shape);
        changed = this._applyFillColor(shape) || changed;
        changed = this._applyBorderColor(shape) || changed;
        changed = this._applyBorderWidth(shape) || changed;
        changed = this._applyVisibility(shape) || changed;
        return changed;
    }
    applyClipart(clipart) {
        let changed = this._applyClipartColors(clipart);
        clipart.items.forEach(item => {
            changed = this._applyVisibility(item) || changed;
        });
        return changed;
    }
    applyBarcode(barcode) {
        let changed = this.applyShape(barcode);
        changed = this._applyBarcodeColor(barcode) || changed;
        return changed;
    }
    applyPlaceholder(placeholder) {
        let changed = false;
        if (ItemUtils.getContentEffect(placeholder) === ImageEffect.Colorize) {
            changed = this._applyColor(placeholder, "contentFillColor", "fillColor") || changed;
            this._itemData.fillColor = null;
        }
        changed = this.applyShape(placeholder) || changed;
        changed = this._applyColor(placeholder, "overlayColor") || changed;
        return changed;
    }
    _applyFillColor(shape) {
        return this._applyColor(shape, "fillColor", "fillColor");
    }
    _applyClipartColors(clipart) {
        let changed = false;
        this._itemData.clipartColors.forEach((colorGroupColor, index) => {
            if (colorGroupColor == null)
                return;
            this._tryApplyColor(colorGroupColor, color => {
                clipart.setColor(clipart.colorGroups[index], color);
                changed = true;
            });
        });
        return changed;
    }
    _applyTextFillColor(text) {
        return this._applyColor(text, "fillColor", "textFillColor");
    }
    _applyFont(text) {
        if (this._itemData.font == null)
            return false;
        let changed = false;
        if (this._itemData.font.postScriptName) {
            text.font.postScriptName = this._itemData.font.postScriptName;
            changed = true;
        }
        if (this._itemData.font.fauxItalic != null) {
            text.font.fauxItalic = this._itemData.font.fauxItalic;
            changed = true;
        }
        if (this._itemData.font.fauxBold != null) {
            text.font.fauxBold = this._itemData.font.fauxBold;
            changed = true;
        }
        if (this._itemData.font.size) {
            text.font.size = this._itemData.font.size;
            changed = true;
        }
        if (this._itemData.font.allCaps != null) {
            text.font.allCaps = this._itemData.font.allCaps;
            changed = true;
        }
        return changed;
    }
    _applyTextProperty(text, propertyName) {
        if (this._itemData[propertyName] == null)
            return false;
        text[propertyName] = this._itemData[propertyName];
        return true;
    }
    async _applyShadow(text) {
        if (this._itemData.shadow == null || text.shadow == null)
            return false;
        let changed = false;
        const shadowColorPreview = await this._colorPreviewServce.getPreviewAsync(text.shadow.color);
        if (this._itemData.shadow.color && isEqual(this._itemData.shadow.color, shadowColorPreview.getData()))
            changed = this._tryApplyColor(this._itemData.shadow.color, color => text.shadow.color = color);
        if (this._itemData.shadow.angle && this._itemData.shadow.angle !== text.shadow.angle) {
            text.shadow.angle = this._itemData.shadow.angle;
            changed = true;
        }
        if (this._itemData.shadow.distance && this._itemData.shadow.distance !== text.shadow.distance) {
            text.shadow.distance = this._itemData.shadow.distance;
            changed = true;
        }
        if (this._itemData.shadow.size && this._itemData.shadow.size !== text.shadow.size) {
            text.shadow.size = this._itemData.shadow.size;
            changed = true;
        }
        return changed;
    }
    _applyStroke(text) {
        if (this._itemData.stroke == null || text.stroke == null)
            return false;
        let changed = false;
        if (this._itemData.stroke.color)
            changed = this._tryApplyColor(this._itemData.stroke.color, color => text.stroke.color = color);
        if (this._itemData.stroke.size && this._itemData.stroke.size !== text.stroke.size) {
            text.stroke.size = this._itemData.stroke.size;
            changed = true;
        }
        return changed;
    }
    _applyOpacity(item) {
        if (this._itemData.opacity == null)
            return false;
        item.opacity = this._itemData.opacity;
        return true;
    }
    _applyVisibility(item) {
        if (this._itemData.visible == null)
            return false;
        item.visible = this._itemData.visible;
        return true;
    }
    _applyBorderColor(shape) {
        return this._applyColor(shape, "borderColor", "borderColor");
    }
    _applyBorderWidth(shape) {
        if (this._itemData.borderWidth == null)
            return false;
        shape.borderWidth = this._itemData.borderWidth;
        return true;
    }
    _applyColor(item, itemColorProperty = "color", itemDataColorProperty = "color") {
        if (this._itemData[itemDataColorProperty] == null)
            return false;
        return this._tryApplyColor(this._itemData[itemDataColorProperty], color => {
            if (itemColorProperty === "overlayColor" && (item instanceof ImageItem || item instanceof PlaceholderItem))
                ItemUtils.setOverlayEffectColor(item, color);
            else
                item[itemColorProperty] = color;
        });
    }
    _tryApplyColor(rawColor, updateFunc) {
        const color = typeof rawColor === "string"
            ? this._colorParser.parse(rawColor)
            : JsonColorParser.parse(rawColor);
        if (color) {
            updateFunc(color);
            return true;
        }
        return false;
    }
    _applyBarcodeColor(barcode) {
        return this._applyColor(barcode, "color", "barcodeColor");
    }
}
//# sourceMappingURL=ItemDataHandler.js.map