From 106d733fec8ae2bc6e94c398e68363ea1ca10af7 Mon Sep 17 00:00:00 2001 From: Surma Date: Mon, 2 Nov 2020 16:56:45 +0000 Subject: [PATCH] Add rotate support --- cli/rollup.config.js | 19 +++++++++++-------- cli/src/codecs.js | 33 +++++++++++++++++++++++++++++++++ 2 files changed, 44 insertions(+), 8 deletions(-) diff --git a/cli/rollup.config.js b/cli/rollup.config.js index a00aaae9..64fe6d1f 100644 --- a/cli/rollup.config.js +++ b/cli/rollup.config.js @@ -3,8 +3,8 @@ import cjs from "@rollup/plugin-commonjs"; import asset from "./lib/asset-plugin.js"; import json from "./lib/json-plugin.js"; import autojson from "./lib/autojson-plugin.js"; -import { getBabelOutputPlugin } from '@rollup/plugin-babel'; -import { builtinModules } from 'module'; +import { getBabelOutputPlugin } from "@rollup/plugin-babel"; +import { builtinModules } from "module"; /** @type {import('rollup').RollupOptions} */ export default ({ @@ -29,12 +29,15 @@ export default ({ minified: true, comments: false, presets: [ - ['@babel/preset-env', { - targets: { - node: 12 - }, - loose: true - }] + [ + "@babel/preset-env", + { + targets: { + node: 12 + }, + loose: true + } + ] ] }) ], diff --git a/cli/src/codecs.js b/cli/src/codecs.js index d38b4f5c..62e02487 100644 --- a/cli/src/codecs.js +++ b/cli/src/codecs.js @@ -36,6 +36,9 @@ import * as resize from "../../codecs/resize/pkg/squoosh_resize.js"; import resizeWasm from "asset-url:../../codecs/resize/pkg/squoosh_resize_bg.wasm"; const resizePromise = resize.default(fsp.readFile(pathify(resizeWasm))); +// rotate +import rotateWasm from "asset-url:../../codecs/rotate/rotate.wasm"; + // ImageQuant import imageQuant from "../../codecs/imagequant/imagequant.js"; import imageQuantWasm from "asset-url:../../codecs/imagequant/imagequant.wasm"; @@ -127,6 +130,7 @@ export const preprocessors = { linearRGB: true } }, + // TODO: Need to handle SVGs and HQX quant: { name: "ImageQuant", description: "Reduce the number of colors used (aka. paletting)", @@ -143,6 +147,35 @@ export const preprocessors = { numColors: 255, dither: 1.0 } + }, + rotate: { + name: "Rotate", + description: "Rotate image", + instantiate: async () => { + return async (buffer, width, height, { degrees }) => { + const sameDimensions = degrees == 0 || degrees == 180; + const size = width * height * 4; + const { instance } = await WebAssembly.instantiate( + await fsp.readFile(pathify(rotateWasm)) + ); + const { memory } = instance.exports; + const pagesNeeded = Math.ceil( + (size * 2 - memory.buffer.byteLength) / (64 * 1024) + ); + memory.grow(pagesNeeded); + const view = new Uint8ClampedArray(memory.buffer); + view.set(buffer, 8); + instance.exports.rotate(width, height, degrees); + return new ImageData( + new Uint8ClampedArray(view.slice(size + 8, size * 2 + 8)), + sameDimensions ? width : height, + sameDimensions ? height : width + ); + }; + }, + defaultOptions: { + numRotations: 0 + } } };