@vendure/asset-server-plugin 1.2.1

package/lib/src/transform-image.js

@@ -0,0 +1,102 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.resizeToFocalPoint = exports.transformImage = void 0;
+const sharp_1 = __importDefault(require("sharp"));
+/**
+ * Applies transforms to the given image according to the query params passed.
+ */
+async function transformImage(originalImage, queryParams, presets) {
+    let targetWidth = Math.round(+queryParams.w) || undefined;
+    let targetHeight = Math.round(+queryParams.h) || undefined;
+    let mode = queryParams.mode || 'crop';
+    const fpx = +queryParams.fpx || undefined;
+    const fpy = +queryParams.fpy || undefined;
+    if (queryParams.preset) {
+        const matchingPreset = presets.find(p => p.name === queryParams.preset);
+        if (matchingPreset) {
+            targetWidth = matchingPreset.width;
+            targetHeight = matchingPreset.height;
+            mode = matchingPreset.mode;
+        }
+    }
+    const options = {};
+    if (mode === 'crop') {
+        options.position = sharp_1.default.strategy.entropy;
+    }
+    else {
+        options.fit = 'inside';
+    }
+    const image = sharp_1.default(originalImage);
+    if (fpx && fpy && targetWidth && targetHeight && mode === 'crop') {
+        const metadata = await image.metadata();
+        if (metadata.width && metadata.height) {
+            const xCenter = fpx * metadata.width;
+            const yCenter = fpy * metadata.height;
+            const { width, height, region } = resizeToFocalPoint({ w: metadata.width, h: metadata.height }, { w: targetWidth, h: targetHeight }, { x: xCenter, y: yCenter });
+            return image.resize(width, height).extract(region);
+        }
+    }
+    return image.resize(targetWidth, targetHeight, options);
+}
+exports.transformImage = transformImage;
+/**
+ * Resize an image but keep it centered on the focal point.
+ * Based on the method outlined in https://github.com/lovell/sharp/issues/1198#issuecomment-384591756
+ */
+function resizeToFocalPoint(original, target, focalPoint) {
+    const { width, height, factor } = getIntermediateDimensions(original, target);
+    const region = getExtractionRegion(factor, focalPoint, target, { w: width, h: height });
+    return { width, height, region };
+}
+exports.resizeToFocalPoint = resizeToFocalPoint;
+/**
+ * Calculates the dimensions of the intermediate (resized) image.
+ */
+function getIntermediateDimensions(original, target) {
+    const hRatio = original.h / target.h;
+    const wRatio = original.w / target.w;
+    let factor;
+    let width;
+    let height;
+    if (hRatio < wRatio) {
+        factor = hRatio;
+        height = Math.round(target.h);
+        width = Math.round(original.w / factor);
+    }
+    else {
+        factor = wRatio;
+        width = Math.round(target.w);
+        height = Math.round(original.h / factor);
+    }
+    return { width, height, factor };
+}
+/**
+ * Calculates the Region to extract from the intermediate image.
+ */
+function getExtractionRegion(factor, focalPoint, target, intermediate) {
+    const newXCenter = focalPoint.x / factor;
+    const newYCenter = focalPoint.y / factor;
+    const region = {
+        left: 0,
+        top: 0,
+        width: target.w,
+        height: target.h,
+    };
+    if (intermediate.h < intermediate.w) {
+        region.left = clamp(0, intermediate.w - target.w, Math.round(newXCenter - target.w / 2));
+    }
+    else {
+        region.top = clamp(0, intermediate.h - target.h, Math.round(newYCenter - target.h / 2));
+    }
+    return region;
+}
+/**
+ * Limit the input value to the specified min and max values.
+ */
+function clamp(min, max, input) {
+    return Math.min(Math.max(min, input), max);
+}
+//# sourceMappingURL=transform-image.js.map

package/lib/src/transform-image.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"transform-image.js","sourceRoot":"","sources":["../../src/transform-image.ts"],"names":[],"mappings":"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"}

package/lib/src/types.d.ts

@@ -0,0 +1,98 @@
+import { AssetNamingStrategy, AssetStorageStrategy, RequestContext } from '@vendure/core';
+/**
+ * @description
+ * Specifies the way in which an asset preview image will be resized to fit in the
+ * proscribed dimensions:
+ *
+ * * crop: crops the image to cover both provided dimensions
+ * * resize: Preserving aspect ratio, resizes the image to be as large as possible
+ * while ensuring its dimensions are less than or equal to both those specified.
+ *
+ * @docsCategory AssetServerPlugin
+ */
+export declare type ImageTransformMode = 'crop' | 'resize';
+/**
+ * @description
+ * A configuration option for an image size preset for the AssetServerPlugin.
+ *
+ * Presets allow a shorthand way to generate a thumbnail preview of an asset. For example,
+ * the built-in "tiny" preset generates a 50px x 50px cropped preview, which can be accessed
+ * by appending the string `preset=tiny` to the asset url:
+ *
+ * `http://localhost:3000/assets/some-asset.jpg?preset=tiny`
+ *
+ * is equivalent to:
+ *
+ * `http://localhost:3000/assets/some-asset.jpg?w=50&h=50&mode=crop`
+ *
+ * @docsCategory AssetServerPlugin
+ */
+export interface ImageTransformPreset {
+    name: string;
+    width: number;
+    height: number;
+    mode: ImageTransformMode;
+}
+/**
+ * @description
+ * The configuration options for the AssetServerPlugin.
+ *
+ * @docsCategory AssetServerPlugin
+ */
+export interface AssetServerOptions {
+    /**
+     * @description
+     * The route to the asset server.
+     */
+    route: string;
+    /**
+     * @description
+     * The local directory to which assets will be uploaded when using the {@link LocalAssetStorageStrategy}.
+     */
+    assetUploadDir: string;
+    /**
+     * @description
+     * The complete URL prefix of the asset files. For example, "https://demo.vendure.io/assets/". A
+     * function can also be provided to handle more complex cases, such as serving multiple domains
+     * from a single server. In this case, the function should return a string url prefix.
+     *
+     * If not provided, the plugin will attempt to guess based off the incoming
+     * request and the configured route. However, in all but the simplest cases,
+     * this guess may not yield correct results.
+     */
+    assetUrlPrefix?: string | ((ctx: RequestContext, identifier: string) => string);
+    /**
+     * @description
+     * The max width in pixels of a generated preview image.
+     *
+     * @default 1600
+     */
+    previewMaxWidth?: number;
+    /**
+     * @description
+     * The max height in pixels of a generated preview image.
+     *
+     * @default 1600
+     */
+    previewMaxHeight?: number;
+    /**
+     * @description
+     * An array of additional {@link ImageTransformPreset} objects.
+     */
+    presets?: ImageTransformPreset[];
+    /**
+     * @description
+     * Defines how asset files and preview images are named before being saved.
+     *
+     * @default HashedAssetNamingStrategy
+     */
+    namingStrategy?: AssetNamingStrategy;
+    /**
+     * @description
+     * A function which can be used to configure an {@link AssetStorageStrategy}. This is useful e.g. if you wish to store your assets
+     * using a cloud storage provider. By default, the {@link LocalAssetStorageStrategy} is used.
+     *
+     * @default () => LocalAssetStorageStrategy
+     */
+    storageStrategyFactory?: (options: AssetServerOptions) => AssetStorageStrategy | Promise<AssetStorageStrategy>;
+}

package/lib/src/types.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=types.js.map

package/lib/src/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/types.ts"],"names":[],"mappings":""}

package/package.json

@@ -0,0 +1,41 @@
+{
+  "name": "@vendure/asset-server-plugin",
+  "version": "1.2.1",
+  "main": "lib/index.js",
+  "types": "lib/index.d.ts",
+  "files": [
+    "lib/**/*"
+  ],
+  "license": "MIT",
+  "scripts": {
+    "watch": "tsc -p ./tsconfig.build.json --watch",
+    "build": "rimraf lib && tsc -p ./tsconfig.build.json && node build.js",
+    "lint": "tslint --fix --project ./",
+    "test": "jest --config ./jest.config.js",
+    "e2e": "jest --config ../../e2e-common/jest-config.js --runInBand --package=asset-server-plugin"
+  },
+  "homepage": "https://www.vendure.io/",
+  "funding": "https://github.com/sponsors/michaelbromley",
+  "publishConfig": {
+    "access": "public"
+  },
+  "devDependencies": {
+    "@types/express": "^4.17.8",
+    "@types/fs-extra": "^9.0.8",
+    "@types/node-fetch": "^2.5.8",
+    "@types/sharp": "^0.27.1",
+    "@vendure/common": "^1.2.1",
+    "@vendure/core": "^1.2.1",
+    "aws-sdk": "^2.856.0",
+    "express": "^4.17.1",
+    "node-fetch": "^2.6.1",
+    "rimraf": "^3.0.2",
+    "typescript": "4.3.5"
+  },
+  "dependencies": {
+    "file-type": "^16.2.0",
+    "fs-extra": "^10.0.0",
+    "sharp": "~0.29.0"
+  },
+  "gitHead": "d764852f00ab55b16ccbf88f6e8bb76bd76e9b08"
+}