tag api working

2025-07-10 15:05:57 +02:00
parent de8d6bfe1c
commit a2da535291
2 changed files with 107 additions and 1 deletions
@@ -2,7 +2,74 @@ const router = require('express').Router();


 router.get('/tag', (req, res) => {
-	res.status(200).send('OK');
+	const {
+		tag = 'badgedex',
+		label = 'BadgeDex',
+		style = 'rect', // badge stílusa: rect (négyzetes), flat (lekerekített sarkok)
+		bgtag = 'none',   // ikon háttérszín, alap: világosszürke
+		bglabel = 'none',  // label háttérszín, alap: sötétszürke
+		color = '#000000',
+		size = 24,
+		labelpos = 'right',
+		fontweight = 'normal',
+	} = req.query;
+
+	const fontFamily = "Verdana,Geneva,DejaVu Sans,sans-serif";
+	const fontWeight = fontweight;
+
+	// A flat badge esetén a szöveg középre igazítása miatt a szöveg pozícióját módosítjuk
+	//const labelX = labelpos === 'left' ? 165 : 455;
+	//const tagX = labelpos === 'left' ? 455 : 165;
+
+	// A méretet pixelben adjuk meg, alapértelmezett 24px
+	const textPadding = Number(5);
+	const badgeSize = Number(size);
+	const badgeFontSize = Math.round(badgeSize * 0.6); // A szöveg mérete a badge méretéhez igazítva
+	const tagTextLength = tag.length * (badgeFontSize * 0.7); // A tag szöveg hossza
+	const labelTextLength = label.length * (badgeFontSize * 0.8); // A label szöveg hossza
+	const badgeWidth = tagTextLength + labelTextLength + 10; // A badge szélessége a szövegek hosszától függően
+	const tagTextX = textPadding;
+	const labelTextX = ( 2 * tagTextX ) + tagTextLength;
+
+	const rect = `
+<g shape-rendering="crispEdges">
+	<rect width="${tagTextLength+textPadding}" height="${badgeSize}" fill="${bgtag}"/>
+	<rect x="${tagTextLength}" width="${labelTextLength+(textPadding*2)}" height="${badgeSize}" fill="${bglabel}"/>
+</g>
+<g fill="#fff" text-anchor="start" font-family="${fontFamily}" text-rendering="geometricPrecision" font-size="${badgeFontSize}">
+	<text x="${tagTextX}" y="${badgeFontSize + textPadding}"  fill="${color}">${tag.toLowerCase()}</text>
+	<text x="${labelTextX}" y="${badgeFontSize + textPadding}" fill="${color}" font-weight="${fontWeight}">${label.toUpperCase()}</text>
+</g>`;
+
+	
+	const flat = `
+<linearGradient id="s" x2="0" y2="100%">
+	<stop offset="0" stop-color="#bbb" stop-opacity=".1"/>
+	<stop offset="1" stop-opacity=".1"/>
+</linearGradient>
+<clipPath id="r">
+	<rect width="62" height="20" rx="3" fill="#fff"/>
+</clipPath>
+<g clip-path="url(#r)">
+	<rect width="31" height="20" fill="#555"/>
+	<rect x="31" width="31" height="20" fill="#007ec6"/>
+	<rect width="62" height="20" fill="url(#s)"/>
+</g>
+<g fill="#fff" text-anchor="middle" font-family="${fontFamily}" text-rendering="geometricPrecision" font-size="110" font-weight="${fontWeight}">
+	<text aria-hidden="true" x="165" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="210">${tag}</text>
+	<text x="165" y="140" transform="scale(.1)" fill="#fff" textLength="210">${tag}</text>
+	<text aria-hidden="true" x="455" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="210">${label}</text>
+	<text x="455" y="140" transform="scale(.1)" fill="#fff" textLength="210">${label}</text>
+</g>`;
+
+const svg = `<svg xmlns="http://www.w3.org/2000/svg" width="${badgeWidth}" height="${badgeSize}" role="img" aria-label="${tag}: ${label}">
+	<title>${tag}: ${label}</title>
+	${style === 'rect' ? rect : flat}
+</svg>`;
+	
+  	res.setHeader('Content-Type', 'image/svg+xml');
+    res.send(svg);
+	//res.status(200).send('OK');
 });

 module.exports = router;