feat : buzz feedback
This commit is contained in:
@@ -1,12 +1,10 @@
|
||||
/* eslint-disable @next/next/no-img-element */
|
||||
import { join } from "node:path";
|
||||
|
||||
import { ImageResponse } from "next/og";
|
||||
import sharp from "sharp";
|
||||
|
||||
import { rarityGradient, rarityTextColor } from "@/lib/catalog/rarity";
|
||||
import { getCachedPublicWeaponExport } from "@/lib/cache/public";
|
||||
import { imageContentDisposition } from "@/lib/guides/export-image";
|
||||
import { getPublicWeaponExport } from "@/lib/guides/queries";
|
||||
|
||||
const anuphanFonts = Promise.all(
|
||||
[
|
||||
@@ -46,26 +44,17 @@ async function pngDataUrl(url: string): Promise<string | null> {
|
||||
}
|
||||
}
|
||||
|
||||
async function localPngDataUrl(fileName: string, size: number | null = 96): Promise<string> {
|
||||
const image = sharp(join(process.cwd(), "public", "icon", fileName));
|
||||
const png = await (size === null ? image : image.resize(size, size, { fit: "contain" }))
|
||||
.png()
|
||||
.toBuffer();
|
||||
return `data:image/png;base64,${png.toString("base64")}`;
|
||||
}
|
||||
|
||||
export async function GET(
|
||||
_request: Request,
|
||||
context: { params: Promise<{ guideId: string }> },
|
||||
) {
|
||||
const { guideId } = await context.params;
|
||||
const guide = await getPublicWeaponExport(guideId);
|
||||
const guide = await getCachedPublicWeaponExport(guideId);
|
||||
if (!guide) return new Response("Guide not found", { status: 404 });
|
||||
|
||||
const [fonts, weaponImages, watermark] = await Promise.all([
|
||||
const [fonts, weaponImages] = await Promise.all([
|
||||
anuphanFonts,
|
||||
Promise.all(guide.weapons.map((row) => pngDataUrl(row.weapon.imageUrl))),
|
||||
localPngDataUrl("Watermark.png", null),
|
||||
]);
|
||||
const weaponHeights = guide.weapons.map((row) => Math.max(126, 126 + (row.note ? Math.ceil(row.note.length / 52) * 22 : 0)));
|
||||
const height = Math.max(360, 190 + weaponHeights.reduce((sum, rowHeight) => sum + rowHeight, 0) + Math.max(0, guide.weapons.length - 1) * 14);
|
||||
@@ -85,7 +74,6 @@ export async function GET(
|
||||
position: "relative",
|
||||
}}
|
||||
>
|
||||
<img src={watermark} alt="" style={{ position: "absolute", inset: 0, width: "100%", height: "100%", objectFit: "cover", opacity: 0.2 }} />
|
||||
<div style={{ position: "relative", zIndex: 1, display: "flex", flex: 1, flexDirection: "column", gap: 14 }}>
|
||||
<div style={{ display: "flex", flexDirection: "column", alignItems: "center", gap: 8, marginBottom: 6 }}>
|
||||
<div style={{ display: "flex", color: "#f0b72f", fontSize: 16, fontWeight: 700 }}>อาวุธที่แนะนำ</div>
|
||||
@@ -104,26 +92,28 @@ export async function GET(
|
||||
>
|
||||
<div
|
||||
style={{
|
||||
position: "relative",
|
||||
display: "flex",
|
||||
flex: 3,
|
||||
alignItems: "center",
|
||||
gap: 18,
|
||||
overflow: "hidden",
|
||||
borderBottomRightRadius: 80,
|
||||
background: rarityGradient(row.weapon.rarity),
|
||||
color: "white",
|
||||
padding: "10px 40px 10px 24px",
|
||||
padding: 0,
|
||||
}}
|
||||
>
|
||||
{weaponImages[index] ? (
|
||||
<img src={weaponImages[index]!} alt="" width={92} height={92} style={{ objectFit: "contain" }} />
|
||||
) : (
|
||||
<div style={{ display: "flex", width: 92, height: 92, alignItems: "center", justifyContent: "center", fontSize: 32 }}>{index + 1}</div>
|
||||
)}
|
||||
<div style={{ display: "flex", flexDirection: "column", gap: 5 }}>
|
||||
<div style={{ display: "flex", fontSize: 24, fontWeight: 700 }}>
|
||||
{index + 1}. {row.weapon.name} R{row.refinement}
|
||||
<div style={{ position: "relative", zIndex: 1, display: "flex", flex: 1, alignItems: "center", gap: 18, padding: "10px 40px 10px 24px" }}>
|
||||
{weaponImages[index] ? (
|
||||
<img src={weaponImages[index]!} alt="" width={92} height={92} style={{ objectFit: "contain" }} />
|
||||
) : (
|
||||
<div style={{ display: "flex", width: 92, height: 92, alignItems: "center", justifyContent: "center", fontSize: 32 }}>{index + 1}</div>
|
||||
)}
|
||||
<div style={{ display: "flex", flexDirection: "column", gap: 5 }}>
|
||||
<div style={{ display: "flex", fontSize: 24, fontWeight: 700 }}>
|
||||
{index + 1}. {row.weapon.name} R{row.refinement}
|
||||
</div>
|
||||
{row.note ? <div style={{ display: "flex", fontSize: 14, lineHeight: 1.55 }}>{row.note}</div> : null}
|
||||
</div>
|
||||
{row.note ? <div style={{ display: "flex", fontSize: 14, lineHeight: 1.55 }}>{row.note}</div> : null}
|
||||
</div>
|
||||
</div>
|
||||
<div style={{ display: "flex", flex: 1, alignItems: "center", justifyContent: "space-around", gap: 12, color: "#17171c", padding: "12px 16px" }}>
|
||||
|
||||
Reference in New Issue
Block a user