diff --git a/index.php b/index.php index 189acd625bab233c56a3513163fa8d528fd875fa..596a5c4a46517433b928ae6fe5ea0fa2c5530f38 100644 --- a/index.php +++ b/index.php @@ -11,7 +11,41 @@ <body> <section class="memory-game"> <div class="memory-card" data-framework="A"> - <?php $text = 'A'; $style = 'background-color: #FFCCCB'; $width = 640 * 0.25 - 10; $height = 640 * 0.33333 - 10; $textSize = min($width, $height) * 0.4; $svg = "<svg xmlns='http://www.w3.org/2000/svg' width='$width' height='$height'><text x='50%' y='50%' text-anchor='middle' alignment-baseline='middle' font-size='$textSize'>$text</text></svg>"; $svgData = base64_encode($svg); $src = 'data:image/svg+xml;base64,'.$svgData; $imgTag = "<img class='front-face' src='$src' alt='$text' style='$style'/>"; echo $imgTag; ?> + <?php + $text = 'Dies ist ein Testtext!'; + $style = 'background-color: #FFCCCB'; + $width = 640 * 0.25 - 10; + $height = 640 * 0.33333 - 10; + $textSize = min($width, $height) * 0.4; + + // Text in mehrere Zeilen aufteilen + $words = explode(' ', $text); + $lines = array(''); + $currentLine = 0; + foreach ($words as $word) { + $testLine = $lines[$currentLine] . ' ' . $word; + $testWidth = $textSize * strlen($testLine) / 2; + if ($testWidth > $width * 0.9) { // 90% der Breite für Zeilenumbruch verwenden + $currentLine++; + $lines[$currentLine] = $word; + } else { + $lines[$currentLine] = $testLine; + } + } + $text = implode("\n", $lines); + + // SVG-Code generieren + $svg = "<svg xmlns='http://www.w3.org/2000/svg' width='$width' height='$height'>"; + $svg .= "<text x='50%' y='50%' text-anchor='middle' alignment-baseline='middle' font-size='$textSize'>"; + $svg .= $text; + $svg .= "</text></svg>"; + + $svgData = base64_encode($svg); + $src = 'data:image/svg+xml;base64,'.$svgData; + $imgTag = "<img class='front-face' src='$src' alt='$text' style='$style'/>"; + echo $imgTag; + ?> + <!-- <img class="front-face" src="img/aurelia.svg" alt="Aurelia" style="background-color: #FFCCCB"/> --> <!-- <img class="back-face" src="img/js-badge.svg" alt="" /> --> <?php echo $backface; ?>