@danielbiegler/vendure-plugin-blurry-image-lazy-loading/dist/config/BlurHashStrategy.js

Generates image hashes for displaying blurry previews when loading images on the frontend.

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.BlurHashStrategy = void 0;
const blurhash_1 = require("../vendors/blurhash");
const PreviewImageHashStrategy_1 = require("./PreviewImageHashStrategy");
/**
 * A very compact representation of a placeholder for an image.
 * Store it inline with your data and show it while the real image is loading for a smoother loading experience.
 *
 * @category Strategy
 */
class BlurHashStrategy extends PreviewImageHashStrategy_1.PreviewImageHashBase {
    constructor(args = {}) {
        super(args);
        this.componentX = args.componentX ?? 4;
        this.componentY = args.componentY ?? 3;
    }
    componentX;
    componentY;
    async encode(buffer, input) {
        const resizeOptions = {
            // Clone so as to not overwrite `width` and or `height`
            ...this.resizeOptions,
            width: input.width ?? this.resizeOptions.width,
            height: input.height ?? this.resizeOptions.height,
        };
        const result = await buffer.resize(resizeOptions).raw().ensureAlpha().toBuffer({ resolveWithObject: true });
        const clampedArray = Uint8ClampedArray.from(result.data);
        const hash = (0, blurhash_1.encode)(clampedArray, result.info.width, result.info.height, this.componentX, this.componentY);
        // TODO might be useful to rewrite blurhash argument to buffer instead of clamped array so we dont have to reallocate
        return Buffer.from(hash).toString(this.encoding);
    }
}
exports.BlurHashStrategy = BlurHashStrategy;