@aurigma/design-atoms
Version:
Design Atoms is a part of Customer's Canvas SDK which allows for manipulating individual design elements through your code.
85 lines • 4.64 kB
JavaScript
import { ArgumentException } from "@aurigma/design-atoms-model/Exception";
import Environment from "@aurigma/design-atoms-model/Utils/Environment";
import { ImageEffect } from "@aurigma/design-atoms-model/Product/Items/ImageEffect";
import { ColorUtils } from "./ColorUtils";
export var CrossOrigin;
(function (CrossOrigin) {
CrossOrigin[CrossOrigin["none"] = 0] = "none";
CrossOrigin[CrossOrigin["anonymous"] = 1] = "anonymous";
})(CrossOrigin || (CrossOrigin = {}));
export class ImageUtils {
static getImageUrl(renderingConfigProvider, designAtomsApiClient, sourceId, pixelWidth, pixelHeight, squared, effect, keepProportions, overlayEffect, pageIndex, alphaMask, colorizeColor, isBackendEffect, rectWidth, rectHeight, ditherType, ditherAmount) {
if (!Number.isInteger(pixelWidth) || !Number.isInteger(pixelHeight))
throw new ArgumentException(`Wrong "${!Number.isInteger(pixelWidth) ? pixelWidth : pixelHeight}" type!`);
let handler = "/img";
if (sourceId.endsWith(".svg") && !squared && !Environment.IsFirefox() && !Environment.IsIE() && !isBackendEffect)
handler = "/svg";
let url = designAtomsApiClient.serviceEndpoint + handler +
"?f=" + encodeURIComponent(sourceId) +
"&w=" + encodeURIComponent(pixelWidth.toString()) +
"&h=" + encodeURIComponent(pixelHeight.toString());
url = ImageUtils._addColorSettings(url, renderingConfigProvider);
if (squared != null && squared)
url += "&sq=true";
if (effect != null) {
if (effect !== ImageEffect.None)
url += `&effect=${encodeURIComponent(effect.toString())}`;
if (effect === ImageEffect.Colorize && colorizeColor != null)
url += `&colorizeColor=${encodeURIComponent(ColorUtils.toUriComponent(colorizeColor))}`;
}
if (keepProportions != null && keepProportions)
url += `&kp=${encodeURIComponent(keepProportions.toString())}`;
if (overlayEffect != null) {
const { color, blendMode, opacity } = overlayEffect;
if (color != null)
url += `&color=${encodeURIComponent(ColorUtils.toUriComponent(color))}`;
if (blendMode != null)
url += `&obm=${encodeURIComponent(blendMode.toString())}`;
if (opacity != null)
url += `&oo=${encodeURIComponent(opacity.toString())}`;
}
if (pageIndex != null && parseInt(pageIndex.toString()) > 0)
url += `&page=${encodeURIComponent(pageIndex.toString())}`;
if (alphaMask != null && alphaMask)
url += `&alphaMask=${encodeURIComponent(alphaMask.toString())}`;
if (rectWidth && rectHeight) {
url += `&rw=${encodeURIComponent(rectWidth.toFixed(2))}&rh=${encodeURIComponent(rectHeight.toFixed(2))}`;
}
if (ditherType != null)
url += `&dt=${encodeURIComponent(ditherType)}`;
if (ditherAmount != null)
url += `&da=${encodeURIComponent(ditherAmount.toString())}`;
return url;
}
static async getImageSizeByUrl(imageUrl, crossOrigin) {
const imgElement = await toImageElement(imageUrl);
return { width: imgElement.width, height: imgElement.height };
function toImageElement(url) {
return new Promise((resolve, reject) => {
const img = new Image();
if (crossOrigin == CrossOrigin.anonymous)
img.crossOrigin = "anonymous";
img.src = url;
img.onload = () => resolve(img);
img.onerror = e => resolve(null);
return img;
});
}
}
static _addColorSettings(url, renderingConfigProvider) {
if (renderingConfigProvider.cmykModeEnabled()) {
if (renderingConfigProvider.getRgbColorProfileName() != null) {
url += `&rgb=${renderingConfigProvider.getRgbColorProfileName()}`;
}
if (renderingConfigProvider.getCmykColorProfileName() != null) {
url += `&cmyk=${renderingConfigProvider.getCmykColorProfileName()}`;
}
if (renderingConfigProvider.getGrayscaleColorProfileName() != null) {
url += `&grayscale=${renderingConfigProvider.getGrayscaleColorProfileName()}`;
}
url += `&target=${renderingConfigProvider.getHiResDestinationColorProfileName()}`;
}
return url;
}
}
//# sourceMappingURL=ImageUtils.js.map