thm/kollagen
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

add concentric mode

Browse source
This commit is contained in:
Tomáš Mládek 2020-07-15 22:54:24 +02:00
parent 494c308f94
commit 9c0fa5fdfa
1 changed files with 39 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

42
src/collages.ts
View file

@ -1,17 +1,19 @@
import {CollageMode} from "@/types";
import {randint, shuffle} from "@/utils";
const collageModeType = ["grid", "row", "irow", "col", "icol"] as const;
const collageModeType = ["grid", "row", "irow", "col", "icol", "center"] as const;
export type CollageModeType = typeof collageModeType[number];
function cleanDraw(ctx: CanvasRenderingContext2D, image: ImageBitmap,
x: number, y: number, w: number, h: number) {
const scaleRatio = Math.max(w / image.width, h / image.height);
ctx.drawImage(image,
ctx.drawImage(
image,
image.width / 2 - w / scaleRatio / 2, image.height / 2 - h / scaleRatio / 2,
w / scaleRatio, h / scaleRatio,
x - w / 2, y - h / 2,
w, h);
w, h
);
}
const modes: { [key in CollageModeType]: CollageMode } = {
@ -124,6 +126,40 @@ const modes: { [key in CollageModeType]: CollageMode } = {
});
},
},
"center": {
name: "Concentric",
minImages: 2,
forceConfig: {
cleanCrops: true
},
place: (ctx, images, config) => {
const selectedImages = shuffle(images).slice(0, config.numImages || randint(4) + 2);
const x = ctx.canvas.width / 2;
const y = ctx.canvas.height / 2;
if (Math.random() < .66) {
selectedImages.forEach((image, idx) => {
cleanDraw(
ctx, image, x, y,
ctx.canvas.width - (ctx.canvas.width / selectedImages.length * idx),
ctx.canvas.height - (ctx.canvas.height / selectedImages.length * idx),
);
});
} else {
let factor: number;
if (Math.random() > .5) {
const factors = [1 / Math.sqrt(2), .5, .88];
factor = factors[Math.floor(Math.random() * factors.length)];
} else {
factor = 1 - (1 / selectedImages.length);
}
selectedImages.forEach((image, idx) => {
const ratio = Math.pow(factor, idx);
cleanDraw(ctx, image, x, y, ctx.canvas.width * ratio, ctx.canvas.height * ratio);
});
}
}
}
};
export default modes;