bartvdbraak/hellob.art
1
0
Fork 0
mirror of https://github.com/bartvdbraak/hellob.art.git synced 2025-04-28 10:01:21 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

refacotr: move fs to server-side code

Browse source
This commit is contained in:
Bart van der Braak 2024-01-20 17:53:21 +01:00
parent a6c7c09ede
commit d94e6d1fc3
2 changed files with 7 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
src/lib/components/site/opengraph-image.svelte
View file

@ -1,13 +1,10 @@
<script lang="ts"> <script lang="ts">
import fs from 'fs';
import { Icons } from '.'; import { Icons } from '.';
export let title: string = 'I made this for you'; export let title: string = 'I made this for you';
export let subTitle: string = export let subTitle: string =
'Featuring current work and studies in a SvelteKit-based portfolio.'; 'Featuring current work and studies in a SvelteKit-based portfolio.';
export let imageData: string = '';
const buffer = fs.readFileSync('src/lib/assets/og/me.jpg');
const imageData = buffer.toString('base64');
</script> </script>
<div class="flex h-full w-full items-center justify-center bg-black"> <div class="flex h-full w-full items-center justify-center bg-black">

7
src/routes/og.png/+server.ts
View file

@ -5,16 +5,21 @@ import { OgImage } from '$lib/components/site';
import GeistRegular from '$lib/assets/og/Geist-Regular.woff'; import GeistRegular from '$lib/assets/og/Geist-Regular.woff';
import GeistBold from '$lib/assets/og/Geist-Bold.woff'; import GeistBold from '$lib/assets/og/Geist-Bold.woff';
import { readFileSync } from 'fs';
const height = 630; const height = 630;
const width = 1200; const width = 1200;
const meImage = readFileSync(`${process.cwd()}/src/lib/assets/og/me.jpg`);
const imageData = Buffer.from(meImage).toString('base64');
/** @type {import('./$types').RequestHandler} */ /** @type {import('./$types').RequestHandler} */
export const GET = async ({ url }) => { export const GET = async ({ url }) => {
const title = url.searchParams.get('title') ?? undefined; const title = url.searchParams.get('title') ?? undefined;
const subTitle = url.searchParams.get('subTitle') ?? undefined; const subTitle = url.searchParams.get('subTitle') ?? undefined;
// eslint-disable-next-line @typescript-eslint/no-explicit-any // eslint-disable-next-line @typescript-eslint/no-explicit-any
const result = (OgImage as any).render({ title, subTitle }); const result = (OgImage as any).render({ title, subTitle, imageData });
const element = toReactNode(`${result.html}<style>${result.css.code}</style>`); const element = toReactNode(`${result.html}<style>${result.css.code}</style>`);
const svg = await satori(element, { const svg = await satori(element, {