mirror of
https://github.com/blitzkit/blitzkit.git
synced 2026-10-21 02:37:05 +02:00
Mark Greene
643e1dd352
The fade flag images are 2:1 but the flag only fills the left part, with the rest transparent. That made `cover` + `center` in the tech tree node crop and offset the visible flag. - Trim the transparent border from the fade flag in the `/flags/fade/[id].webp` route using `sharp` - Revert the tech tree node back to `cover` + `center`, since the image is now just the flag
40 lines
1.1 KiB
TypeScript
40 lines
1.1 KiB
TypeScript
import sharp from "sharp";
|
|
import type { APIContext, GetStaticPathsItem } from "astro";
|
|
import { mixStaticPaths } from "../../../../core/blitzkit/mixStaticPaths";
|
|
import { vfs } from "../../../../core/blitzkit/vfs";
|
|
import { getStaticPaths as _getStaticPaths } from "../../_index";
|
|
|
|
export const getStaticPaths = mixStaticPaths(_getStaticPaths, async () => {
|
|
const paths: GetStaticPathsItem[] = [];
|
|
|
|
const fadedFiles = await vfs
|
|
.dir(`Data/Gfx/Lobby/flags`)
|
|
.then((files) =>
|
|
files.filter(
|
|
(flag) =>
|
|
flag.startsWith("flag_filter_") && flag.endsWith("@2x.packed.webp"),
|
|
),
|
|
);
|
|
|
|
for (const flag of fadedFiles) {
|
|
const path = `Data/Gfx/Lobby/flags/${flag}`;
|
|
const id = flag.match(/flag_filter_(.+)@2x\.packed\.webp/)![1];
|
|
|
|
paths.push({
|
|
params: { id },
|
|
props: { path },
|
|
});
|
|
}
|
|
|
|
return paths;
|
|
});
|
|
|
|
export async function GET({ props }: APIContext<{ path: string }>) {
|
|
const bytes = await sharp(new Uint8Array(await vfs.file(props.path)))
|
|
.trim({ background: { r: 0, g: 0, b: 0, alpha: 0 }, threshold: 1 })
|
|
.webp()
|
|
.toBuffer();
|
|
|
|
return new Response(new Uint8Array(bytes));
|
|
}
|