index.php 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230
  1. <?php
  2. declare(strict_types=1);
  3. use App\App\Bootstrap;
  4. use App\Form\FormSchema;
  5. use App\Security\Csrf;
  6. require __DIR__ . '/src/autoload.php';
  7. Bootstrap::init();
  8. $schema = new FormSchema();
  9. $steps = $schema->getSteps();
  10. $csrf = Csrf::token();
  11. $app = Bootstrap::config('app');
  12. $disclaimerConfigRaw = $app['disclaimer'] ?? [];
  13. if (is_string($disclaimerConfigRaw)) {
  14. $disclaimerConfig = ['text' => $disclaimerConfigRaw];
  15. } elseif (is_array($disclaimerConfigRaw)) {
  16. $disclaimerConfig = $disclaimerConfigRaw;
  17. } else {
  18. $disclaimerConfig = [];
  19. }
  20. $disclaimerTitle = (string) ($disclaimerConfig['title'] ?? 'Hinweis');
  21. $disclaimerText = (string) ($disclaimerConfig['text'] ?? '');
  22. $disclaimerAcceptLabel = (string) ($disclaimerConfig['accept_label'] ?? 'Hinweis gelesen, weiter');
  23. $addressDisclaimerConfigRaw = $app['address_disclaimer'] ?? ($app['address_disclaimer_text'] ?? '');
  24. if (is_string($addressDisclaimerConfigRaw)) {
  25. $addressDisclaimerText = $addressDisclaimerConfigRaw;
  26. } elseif (is_array($addressDisclaimerConfigRaw)) {
  27. $addressDisclaimerText = (string) ($addressDisclaimerConfigRaw['text'] ?? '');
  28. } else {
  29. $addressDisclaimerText = '';
  30. }
  31. $baseUrl = Bootstrap::baseUrl();
  32. /** @param array<string, mixed> $field */
  33. function renderField(array $field, string $addressDisclaimerText): void
  34. {
  35. $keyRaw = (string) ($field['key'] ?? '');
  36. $key = htmlspecialchars($keyRaw);
  37. $label = htmlspecialchars((string) $field['label']);
  38. $type = (string) ($field['type'] ?? 'text');
  39. $requiredAlways = (bool) ($field['required'] ?? false);
  40. $requiredConditional = isset($field['required_if']) && is_array($field['required_if']);
  41. $required = $requiredAlways ? 'required' : '';
  42. $requiredLabel = '';
  43. if ($requiredAlways) {
  44. $requiredLabel = ' <span class="required-mark required-mark-field" aria-hidden="true">* Pflichtfeld</span>';
  45. } elseif ($requiredConditional) {
  46. $requiredLabel = ' <span class="required-mark required-mark-field required-mark-conditional" aria-hidden="true">* Bedingt Pflicht</span>';
  47. }
  48. $fieldClass = 'field';
  49. if ($requiredAlways || $requiredConditional) {
  50. $fieldClass .= ' mandatory-field';
  51. }
  52. if ($requiredAlways) {
  53. $fieldClass .= ' mandatory-field-hard';
  54. }
  55. echo '<div class="' . $fieldClass . '" data-field="' . $key . '">';
  56. if ($type === 'checkbox') {
  57. echo '<label class="checkbox-label"><input type="checkbox" name="form_data[' . $key . ']" value="1" ' . $required . '> ' . $label . $requiredLabel . '</label>';
  58. } else {
  59. echo '<label for="' . $key . '">' . $label . $requiredLabel . '</label>';
  60. if ($type === 'textarea') {
  61. echo '<textarea id="' . $key . '" name="form_data[' . $key . ']" ' . $required . '></textarea>';
  62. } elseif ($type === 'select') {
  63. echo '<select id="' . $key . '" name="form_data[' . $key . ']" ' . $required . '>';
  64. echo '<option value="">Bitte wählen</option>';
  65. foreach (($field['options'] ?? []) as $option) {
  66. if (!is_array($option)) {
  67. continue;
  68. }
  69. $value = htmlspecialchars((string) ($option['value'] ?? ''));
  70. $optLabel = htmlspecialchars((string) ($option['label'] ?? ''));
  71. echo '<option value="' . $value . '">' . $optLabel . '</option>';
  72. }
  73. echo '</select>';
  74. } elseif ($type === 'file') {
  75. $accept = htmlspecialchars((string) ($field['accept'] ?? ''));
  76. $fileInputId = $key . '_file';
  77. $cameraInputId = $key . '_camera';
  78. echo '<div class="upload-control" data-upload-key="' . $key . '">';
  79. echo '<div class="upload-actions">';
  80. echo '<label class="upload-action-btn" for="' . $fileInputId . '">Datei auswählen</label>';
  81. echo '<label class="upload-action-btn upload-action-btn-camera" for="' . $cameraInputId . '">Foto aufnehmen</label>';
  82. echo '</div>';
  83. echo '<input id="' . $fileInputId . '" class="upload-native-input" type="file" name="' . $key . '" accept="' . $accept . '">';
  84. echo '<input id="' . $cameraInputId . '" class="upload-native-input" type="file" name="' . $key . '__camera" accept="image/*" capture="environment">';
  85. echo '<p class="upload-selected" data-upload-selected="' . $key . '">Keine Datei gewählt</p>';
  86. echo '</div>';
  87. echo '<div class="upload-list" data-upload-list="' . $key . '"></div>';
  88. } else {
  89. $inputType = htmlspecialchars($type);
  90. echo '<input id="' . $key . '" type="' . $inputType . '" name="form_data[' . $key . ']" ' . $required . '>';
  91. }
  92. }
  93. $subtext = trim((string) ($field['subtext'] ?? ''));
  94. if ($subtext !== '') {
  95. echo '<small class="hint">' . nl2br(htmlspecialchars($subtext)) . '</small>';
  96. }
  97. if ($keyRaw === 'strasse' && trim($addressDisclaimerText) !== '') {
  98. echo '<div class="address-disclaimer">' . nl2br(htmlspecialchars($addressDisclaimerText)) . '</div>';
  99. }
  100. if (isset($field['required_if']) && is_array($field['required_if'])) {
  101. $depField = htmlspecialchars((string) ($field['required_if']['field'] ?? ''));
  102. $depValue = htmlspecialchars((string) ($field['required_if']['equals'] ?? ''));
  103. echo '<small class="hint">Bedingtes Pflichtfeld, wenn ' . $depField . ' = ' . $depValue . '.</small>';
  104. }
  105. echo '<div class="error" data-error-for="' . $key . '"></div>';
  106. echo '</div>';
  107. }
  108. ?><!doctype html>
  109. <html lang="de">
  110. <head>
  111. <meta charset="utf-8">
  112. <meta name="viewport" content="width=device-width, initial-scale=1">
  113. <title><?= htmlspecialchars((string) $app['project_name']) ?></title>
  114. <link rel="stylesheet" href="<?= htmlspecialchars(Bootstrap::url('assets/css/tokens.css')) ?>">
  115. <link rel="stylesheet" href="<?= htmlspecialchars(Bootstrap::url('assets/css/base.css')) ?>">
  116. </head>
  117. <body>
  118. <header class="site-header">
  119. <div class="container header-inner">
  120. <a class="brand" href="<?= htmlspecialchars(Bootstrap::url('index.php')) ?>">
  121. <img class="brand-logo" src="<?= htmlspecialchars(Bootstrap::url('assets/images/feuerwehr-Logo-invers.webp')) ?>" alt="Feuerwehr Logo">
  122. <div>
  123. <div class="brand-title"><?= htmlspecialchars((string) $app['project_name']) ?></div>
  124. <div class="brand-subtitle">Feuerwehr Freising</div>
  125. </div>
  126. </a>
  127. </div>
  128. </header>
  129. <main class="container">
  130. <h1>Digitaler Mitgliedsantrag Feuerwehrverein</h1>
  131. <section id="disclaimerSection" class="card">
  132. <h2><?= htmlspecialchars($disclaimerTitle) ?></h2>
  133. <p class="disclaimer-text"><?= nl2br(htmlspecialchars($disclaimerText)) ?></p>
  134. <div class="field disclaimer-ack-field">
  135. <label class="checkbox-label">
  136. <input id="disclaimerReadCheckbox" type="checkbox" value="1">
  137. Ich habe den Hinweis gelesen und verstanden.
  138. </label>
  139. <div id="disclaimerReadError" class="error"></div>
  140. </div>
  141. <button id="acceptDisclaimerBtn" type="button" class="btn" disabled><?= htmlspecialchars($disclaimerAcceptLabel) ?></button>
  142. </section>
  143. <section id="wizardSection" class="card hidden">
  144. <h2>Mitgliedsantrag</h2>
  145. <p class="required-legend"><span class="required-mark" aria-hidden="true">*</span> Pflichtfeld</p>
  146. <div id="progress" class="progress"></div>
  147. <form id="applicationForm" enctype="multipart/form-data" novalidate>
  148. <input type="hidden" name="csrf" value="<?= htmlspecialchars($csrf) ?>">
  149. <input type="hidden" id="applicationEmail" name="email" value="">
  150. <input type="hidden" id="applicationWebsite" name="website" value="">
  151. <?php foreach ($steps as $index => $step): ?>
  152. <section class="step hidden" data-step="<?= $index + 1 ?>">
  153. <h3>Schritt <?= $index + 1 ?>: <?= htmlspecialchars((string) ($step['title'] ?? '')) ?></h3>
  154. <p><?= htmlspecialchars((string) ($step['description'] ?? '')) ?></p>
  155. <?php foreach (($step['fields'] ?? []) as $field): ?>
  156. <?php if (is_array($field)) { renderField($field, $addressDisclaimerText); } ?>
  157. <?php endforeach; ?>
  158. </section>
  159. <?php endforeach; ?>
  160. <section id="summarySection" class="step-summary hidden">
  161. <h3>Zusammenfassung</h3>
  162. <p>Bitte prüfen Sie alle Angaben vor dem verbindlichen Absenden.</p>
  163. <div id="summaryMissingNotice" class="summary-missing-note hidden" role="status" aria-live="polite"></div>
  164. <div id="summaryContent" class="summary-content"></div>
  165. </section>
  166. <div class="wizard-actions">
  167. <button type="button" id="prevBtn" class="btn btn-secondary">Zurück</button>
  168. <button type="button" id="nextBtn" class="btn">Weiter</button>
  169. <button type="button" id="submitBtn" class="btn hidden">
  170. <span data-submit-label>Verbindlich absenden</span>
  171. <span id="submitSpinner" class="btn-spinner hidden" aria-hidden="true"></span>
  172. </button>
  173. </div>
  174. </form>
  175. </section>
  176. <section id="startSection" class="card hidden">
  177. <h2>Start</h2>
  178. <p id="startIntroText">Bitte E-Mail eingeben. Bestehende Entwürfe werden automatisch geladen.</p>
  179. <form id="startForm" novalidate>
  180. <input type="hidden" name="csrf" value="<?= htmlspecialchars($csrf) ?>">
  181. <div class="hp-field" aria-hidden="true">
  182. <label for="website">Website</label>
  183. <input id="website" type="text" name="website" autocomplete="off" tabindex="-1">
  184. </div>
  185. <div class="field" id="startEmailField">
  186. <label for="startEmail">E-Mail <span class="required-mark required-mark-field-start" aria-hidden="true">* Pflichtfeld</span></label>
  187. <input id="startEmail" type="email" name="email" required inputmode="email" autocomplete="email">
  188. <div id="startEmailError" class="error"></div>
  189. </div>
  190. <div class="inline-actions" id="startActions">
  191. <button id="startSubmitBtn" type="submit" class="btn">Formular laden</button>
  192. </div>
  193. <div id="compactStatusBox" class="compact-status hidden">
  194. <p><strong>E-Mail:</strong> <span id="statusEmailValue">-</span></p>
  195. <p><strong>Speicherstatus:</strong> <span id="draftStatusValue">Noch nicht gespeichert</span></p>
  196. <button id="resetDataBtn" type="button" class="btn btn-small">Gespeicherte Daten löschen und neu starten</button>
  197. </div>
  198. <p id="feedbackMessage" class="status-text" role="status" aria-live="polite"></p>
  199. </form>
  200. </section>
  201. </main>
  202. <script>
  203. window.APP_BOOT = {
  204. steps: <?= json_encode($steps, JSON_UNESCAPED_UNICODE | JSON_UNESCAPED_SLASHES) ?>,
  205. csrf: <?= json_encode($csrf, JSON_UNESCAPED_UNICODE | JSON_UNESCAPED_SLASHES) ?>,
  206. contactEmail: <?= json_encode((string) ($app['contact_email'] ?? ''), JSON_UNESCAPED_UNICODE | JSON_UNESCAPED_SLASHES) ?>,
  207. baseUrl: <?= json_encode($baseUrl, JSON_UNESCAPED_UNICODE | JSON_UNESCAPED_SLASHES) ?>
  208. };
  209. </script>
  210. <script src="<?= htmlspecialchars(Bootstrap::url('assets/js/form.js')) ?>"></script>
  211. </body>
  212. </html>