aknuth/troxler-skat
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

card game

Browse Source
This commit is contained in:
Andreas Knuth
2026-05-31 14:39:45 -05:00
parent 5cc62433bd
commit 6abe253547
18 changed files with 2713 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

95
card-game/generate_back.js Normal file
View File

@@ -0,0 +1,95 @@
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.');