96 lines
5.1 KiB
JavaScript
96 lines
5.1 KiB
JavaScript
const fs = require('fs');
|
||
const path = require('path');
|
||
|
||
/* ============================================================
|
||
TROX – Kartenrückseite Generator
|
||
node generate_back.js tgc | original | both
|
||
============================================================ */
|
||
|
||
const MODE = (process.argv[2] || 'both').toLowerCase();
|
||
|
||
const SPECS = {
|
||
tgc: { width: 825, height: 1125, safe: 75, cornerRadius: 0, dir: 'karten_export_tgc' },
|
||
original: { width: 694, height: 1069, safe: 35, cornerRadius: 35, dir: 'karten_export_original' }
|
||
};
|
||
|
||
function buildBack(spec) {
|
||
const { width, height, safe, cornerRadius } = spec;
|
||
const cx = width / 2, cy = height / 2;
|
||
|
||
return `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 ${width} ${height}" width="${width}" height="${height}">
|
||
<defs>
|
||
<linearGradient id="bgGradient" x1="0%" y1="0%" x2="100%" y2="100%">
|
||
<stop offset="0%" stop-color="#111827" />
|
||
<stop offset="100%" stop-color="#1F2937" />
|
||
</linearGradient>
|
||
<linearGradient id="goldGradient" x1="0%" y1="0%" x2="100%" y2="100%">
|
||
<stop offset="0%" stop-color="#D4AF37" />
|
||
<stop offset="50%" stop-color="#F3E5AB" />
|
||
<stop offset="100%" stop-color="#AA7C11" />
|
||
</linearGradient>
|
||
<g id="pattern-quarter">
|
||
<path d="M 0 0 L 150 150 L 0 300 Z" fill="none" stroke="#E53935" stroke-width="2" opacity="0.4"/>
|
||
<path d="M 0 0 L 120 120 L 0 240 Z" fill="none" stroke="#FDD835" stroke-width="2" opacity="0.4"/>
|
||
<path d="M 0 0 L 90 90 L 0 180 Z" fill="none" stroke="#43A047" stroke-width="2" opacity="0.4"/>
|
||
<path d="M 0 0 L 60 60 L 0 120 Z" fill="none" stroke="#2196F3" stroke-width="2" opacity="0.3"/>
|
||
</g>
|
||
</defs>
|
||
|
||
<!-- Vollflächiger Hintergrund bis zum Bleed-Rand -->
|
||
<rect width="${width}" height="${height}" ${cornerRadius ? `rx="${cornerRadius}"` : ''} fill="url(#bgGradient)" />
|
||
|
||
<!-- Zierrahmen an der Safe Zone -->
|
||
<rect x="${safe}" y="${safe}" width="${width - 2 * safe}" height="${height - 2 * safe}" rx="${Math.max(0, cornerRadius - 15)}" fill="none" stroke="url(#goldGradient)" stroke-width="3" opacity="0.8" />
|
||
<rect x="${safe + 10}" y="${safe + 10}" width="${width - 2 * safe - 20}" height="${height - 2 * safe - 20}" rx="${Math.max(0, cornerRadius - 20)}" fill="none" stroke="#ffffff" stroke-width="1" opacity="0.1" />
|
||
|
||
<!-- Eckornamente (innerhalb Safe Zone) -->
|
||
<g transform="translate(${safe}, ${safe})">
|
||
<use href="#pattern-quarter" />
|
||
<use href="#pattern-quarter" transform="rotate(90) scale(1,-1)" />
|
||
</g>
|
||
<g transform="translate(${width - safe}, ${safe}) scale(-1, 1)">
|
||
<use href="#pattern-quarter" />
|
||
<use href="#pattern-quarter" transform="rotate(90) scale(1,-1)" />
|
||
</g>
|
||
<g transform="translate(${safe}, ${height - safe}) scale(1, -1)">
|
||
<use href="#pattern-quarter" />
|
||
<use href="#pattern-quarter" transform="rotate(90) scale(1,-1)" />
|
||
</g>
|
||
<g transform="translate(${width - safe}, ${height - safe}) scale(-1, -1)">
|
||
<use href="#pattern-quarter" />
|
||
<use href="#pattern-quarter" transform="rotate(90) scale(1,-1)" />
|
||
</g>
|
||
|
||
<!-- Zentrales Emblem -->
|
||
<g transform="translate(${cx}, ${cy})">
|
||
<rect x="-120" y="-120" width="240" height="240" rx="20" fill="none" stroke="url(#goldGradient)" stroke-width="4" transform="rotate(45)" />
|
||
<rect x="-100" y="-100" width="200" height="200" rx="15" fill="none" stroke="#ffffff" stroke-width="1" opacity="0.2" transform="rotate(45)" />
|
||
<circle cx="0" cy="0" r="70" fill="none" stroke="#E53935" stroke-width="3" opacity="0.7" />
|
||
<circle cx="0" cy="0" r="60" fill="none" stroke="#FDD835" stroke-width="3" opacity="0.7" />
|
||
<circle cx="0" cy="0" r="50" fill="none" stroke="#43A047" stroke-width="3" opacity="0.7" />
|
||
<circle cx="0" cy="0" r="40" fill="none" stroke="#212121" stroke-width="3" opacity="0.7" />
|
||
<circle cx="0" cy="0" r="30" fill="#111827" stroke="url(#goldGradient)" stroke-width="2" />
|
||
|
||
<g transform="translate(0, -250)">
|
||
<text x="0" y="0" font-family="'Helvetica Neue', Helvetica, Arial, sans-serif" font-weight="900" font-size="36" fill="url(#goldGradient)" text-anchor="middle" letter-spacing="6">TROX</text>
|
||
</g>
|
||
<g transform="rotate(180) translate(0, -250)">
|
||
<text x="0" y="0" font-family="'Helvetica Neue', Helvetica, Arial, sans-serif" font-weight="900" font-size="36" fill="url(#goldGradient)" text-anchor="middle" letter-spacing="6">TROX</text>
|
||
</g>
|
||
</g>
|
||
</svg>`;
|
||
}
|
||
|
||
function generate(variant) {
|
||
const spec = SPECS[variant];
|
||
const outputDir = path.join(__dirname, spec.dir);
|
||
if (!fs.existsSync(outputDir)) fs.mkdirSync(outputDir, { recursive: true });
|
||
fs.writeFileSync(path.join(outputDir, 'trox_card_back.svg'), buildBack(spec));
|
||
console.log(` [${variant}] Rückseite -> ${spec.dir}/trox_card_back.svg (${spec.width}x${spec.height})`);
|
||
}
|
||
|
||
console.log('TROX – Rückseite wird generiert ...');
|
||
if (MODE === 'tgc' || MODE === 'both') generate('tgc');
|
||
if (MODE === 'original' || MODE === 'both') generate('original');
|
||
console.log('Fertig.');
|