28 lines
1.1 KiB
TypeScript
28 lines
1.1 KiB
TypeScript
import { env } from '../env/index';
|
|
import { createCanvas, createCanvasFromMedia } from './createCanvas';
|
|
import { getContext2dOrThrow } from './getContext2dOrThrow';
|
|
import { getMediaDimensions } from './getMediaDimensions';
|
|
|
|
export function imageToSquare(input: HTMLImageElement | HTMLCanvasElement, inputSize: number, centerImage: boolean = false) {
|
|
const { Image, Canvas } = env.getEnv();
|
|
|
|
if (!(input instanceof Image || input instanceof Canvas)) {
|
|
throw new Error('imageToSquare - expected arg0 to be HTMLImageElement | HTMLCanvasElement');
|
|
}
|
|
|
|
const dims = getMediaDimensions(input);
|
|
const scale = inputSize / Math.max(dims.height, dims.width);
|
|
const width = scale * dims.width;
|
|
const height = scale * dims.height;
|
|
|
|
const targetCanvas = createCanvas({ width: inputSize, height: inputSize });
|
|
const inputCanvas = input instanceof Canvas ? input : createCanvasFromMedia(input);
|
|
|
|
const offset = Math.abs(width - height) / 2;
|
|
const dx = centerImage && width < height ? offset : 0;
|
|
const dy = centerImage && height < width ? offset : 0;
|
|
getContext2dOrThrow(targetCanvas).drawImage(inputCanvas, dx, dy, width, height);
|
|
|
|
return targetCanvas;
|
|
}
|