Geburtstagsanzeige in allen Listen

.env_default

@@ -9,3 +9,4 @@ TELEBOT=
 TELECHAT=
 HOST=
 WEEKDAY=4
+ABTEILUNG=KiTu/ABENTEUERSPIELPLATZ/KKT

app.js

@@ -97,6 +97,21 @@ const calculateAge = (birthdate) => {
   return age;
 };
 
+const isBirthday = (birthdate, date, previousTraining) => {
+  let adjustedBirthdate = new Date(birthdate);
+  adjustedBirthdate.setFullYear(date.getFullYear());
+
+  if (adjustedBirthdate === date) {
+    console.log("birthday");
+    return 2;
+  }
+  if (adjustedBirthdate >= previousTraining && adjustedBirthdate <= date) {
+    console.log("had birthday", adjustedBirthdate, date, previousTraining);
+    return 1;
+  }
+  return 0;
+};
+
 // Datumsformatierung
 const formatDate = (date) => {
   const d = new Date(date);
@@ -683,12 +698,12 @@ app.get("/training", requireAuth, async (req, res) => {
 
     // Vorheriges Training ermitteln
     const previousTrainingResult = await pool.query(
-      "SELECT * FROM trainings WHERE kw < $1 ORDER BY kw DESC LIMIT 1",
+      "SELECT * FROM trainings WHERE id < $1 ORDER BY id DESC LIMIT 1",
-      [selectedKW]
+      [training.id]
     );
     const nextTrainingResult = await pool.query(
-      "SELECT * FROM trainings WHERE kw > $1 ORDER BY kw ASC LIMIT 1",
+      "SELECT * FROM trainings WHERE id > $1 ORDER BY id ASC LIMIT 1",
-      [selectedKW]
+      [training.id]
     );
     const previousTraining =
       previousTrainingResult.rows.length > 0
@@ -696,7 +711,6 @@ app.get("/training", requireAuth, async (req, res) => {
         : null;
     const nextTraining =
       nextTrainingResult.rows.length > 0 ? nextTrainingResult.rows[0] : null;
-
     // Abrufen der Riegendaten einschließlich der Teilnehmer und deren Altersberechnung
     const result = await pool.query(`
   SELECT r.riegennummer, 
@@ -719,6 +733,11 @@ ORDER BY r.riegennummer, t.geburtsdatum ASC;
     const riegen = {};
     result.rows.forEach((row) => {
       const age = calculateAge(row.geburtsdatum);
+      const hasBirthday = isBirthday(
+        row.geburtsdatum,
+        training.datum,
+        previousTraining.datum
+      );
       const tnAnwesend = getAnwesenheit(row.id, anwesend);
       if (!riegen[row.riegennummer]) {
         riegen[row.riegennummer] = [];
@@ -728,6 +747,8 @@ ORDER BY r.riegennummer, t.geburtsdatum ASC;
         name: row.name,
         vorname: row.vorname,
         nachname: row.nachname,
+        geb: row.geburtsdatum,
+        hasBirthday: hasBirthday,
         age: age,
         helfer: row.helfer,
         probe: row.probe,
@@ -746,7 +767,17 @@ ORDER BY r.riegennummer, t.geburtsdatum ASC;
     const spielCandidates = await getAllSpiele();
     const aufwaermenCandidates = await getAllSpiele();
 
-    res.render("trainings", {
+    const abteilung = process.env.ABTEILUNG;
+
+    let view;
+
+    if (abteilung == "KiTu") {
+      view = "trainings_riegen";
+    } else {
+      view = "trainings";
+    }
+
+    res.render(view, {
       training,
       trainingsDates,
       selectedKW: training.kw,
@@ -790,6 +821,9 @@ ORDER BY r.riegennummer, t.geburtsdatum ASC;
 
     `);
     // Gruppieren der Riegenteilnehmer nach Riegennummer
+    const date = new Date();
+    let previous = new Date(date);
+    previous.setDate(date.getDate() - 7);
     const riegen = {};
     result.rows.forEach((row) => {
       const age = calculateAge(row.geburtsdatum);
@@ -801,6 +835,7 @@ ORDER BY r.riegennummer, t.geburtsdatum ASC;
         name: row.name,
         vorname: row.vorname,
         nachname: row.nachname,
+        hasBirthday: isBirthday(row.geburtsdatum, date, previous),
         age: age,
         helfer: row.helfer,
         probe: row.probe,
@@ -821,10 +856,13 @@ app.get("/teilnehmer", requireAuth, requireAdmin, async (req, res) => {
     const teilnehmendeResult = await pool.query(
       "SELECT m.*, COUNT(a.fid_teilnehmer) AS anwesenheit FROM teilnehmende m LEFT JOIN anwesend a ON m.id = a.fid_teilnehmer GROUP BY m.id ORDER BY helfer DESC, vorname ASC"
     );
-
+    const date = new Date();
+    let previous = new Date(date);
+    previous.setDate(date.getDate() - 7);
     const teilnehmende = teilnehmendeResult.rows.map((t) => ({
       ...t,
       age: calculateAge(t.geburtsdatum),
+      hasBirthday: isBirthday(t.geburtsdatum, date, previous),
     }));
 
     res.render("teilnehmer", { teilnehmende, session: req.session });

views/riegen.ejs

@@ -49,11 +49,13 @@
             <a href="/mitglied/<%= teilnehmer.id %>"
               ><strong><%= teilnehmer.vorname %></strong></a
             >
-            <% } else { %>
+            <%= teilnehmer.hasBirthday == 2 ? '🎂🎂' : '' %><%=
+            teilnehmer.hasBirthday == 1 ? '🎂' : '' %> <% } else { %>
             <a href="/mitglied/<%= teilnehmer.id %>"
               ><%= teilnehmer.vorname %></a
             >
-            <% } %>
+            <%= teilnehmer.hasBirthday == 2 ? '🎂🎂' : '' %><%=
+            teilnehmer.hasBirthday == 1 ? '🎂' : '' %> <% } %>
           </td>
           <td>
             <% if (teilnehmer.helfer) { %>

views/teilnehmer.ejs

@@ -18,7 +18,7 @@
           <% if (teilnehmer.helfer) { %>
             <a href="/mitglied/<%= teilnehmer.id %>"><strong><%= teilnehmer.vorname %></strong></a>
           <% } else { %>
-            <a href="/mitglied/<%= teilnehmer.id %>"><%= teilnehmer.vorname %></a>
+            <a href="/mitglied/<%= teilnehmer.id %>"><%= teilnehmer.vorname %> <%= teilnehmer.hasBirthday == 2 ? '🎂🎂' : '' %><%= teilnehmer.hasBirthday == 1 ? '🎂' : '' %></a>
           <% } %>
         </td>
         <td>

views/trainings.ejs

@@ -14,127 +14,15 @@
 <!-- Nav tabs -->
 <ul class="nav nav-tabs" id="myTab" role="tablist">
   <li class="nav-item" role="presentation">
-    <button class="nav-link <%= activeTab === 'geraete' ? 'active' : '' %>" id="tab-geraete" data-bs-toggle="tab" data-bs-target="#geraete" type="button" role="tab" aria-controls="geraete" aria-selected="true">Geräteplan</button>
+    <button class="nav-link <%= activeTab === 'spiel' ? 'active' : '' %>" id="tab-spiel" data-bs-toggle="tab" data-bs-target="#spiel" type="button" role="tab" aria-controls="spiel" aria-selected="false">Spiel</button>
-  </li>
-  <li class="nav-item" role="presentation">
-    <button class="nav-link <%= activeTab === 'spiel' ? 'active' : '' %>" id="tab-spiel" data-bs-toggle="tab" data-bs-target="#spiel" type="button" role="tab" aria-controls="spiel" aria-selected="false">Aufwärmen / Spiel</button>
   </li><li class="nav-item" role="presentation">
     <button class="nav-link <%= activeTab === 'anwesend' ? 'active' : '' %>" id="tab-anwesend" data-bs-toggle="tab" data-bs-target="#anwesend" type="button" role="tab" aria-controls="anwesend" aria-selected="false">Anwesenheit</button>
   </li>
 </ul>
 
 <% if (training) { %>
-  <div class="tab-content" id="myTabContent">
+  
-    <div class="tab-pane fade <%= activeTab === 'geraete' ? 'show active' : '' %>" id="geraete" role="tabpanel" aria-labelledby="tab-geraete">
- <h2> Geräte </h2>
- <ul>
-    <li>Riege 1 (Klaas): <%= training.geraet_riege_1_name %></li>
-    <li>Riege 2 (Rabea): <%= training.geraet_riege_2_name %></li>
-    <li>Riege 3 (Laura): <%= training.geraet_riege_3_name %></li>
-    <li>Riege 4 (Laila / Carlotta): <%= training.geraet_riege_4_name %></li>
-    <li>Riege 5 (Simon): <%= training.geraet_riege_5_name %></li>
-</ul>
-</div>
 <div class="tab-pane fade <%= activeTab === 'spiel' ? 'show active' : '' %>" id="spiel" role="tabpanel" aria-labelledby="tab-spiel">
-<div id="aufwaermen">
-      <h3>Aufwärmen:</h3>
-      <% if (training.aufwaermleiter_name) { %>
-        <div id="viewAufwaermenLeiter" class="mt-0" style="margin: 0; padding: 0;">
-          <strong>Leitung:</strong>
-            <%= training.aufwaermleiter_name %>
-          <% if (session && session.role === 'admin') { %><button class="btn btn-primary" onclick="toggleDivsAufwaermenLeiter()">Edit</button><% } %>
-          </div>
-          <% if (session && session.role === 'admin') { %>
-          <div id="editAufwaermenLeiter" class="mt-0 d-none" style="margin: 0; padding: 0;">
-            <form method="POST" action="/update-leader">
-              <strong>Leitung:</strong>
-              <input type="hidden" name="trainingId" value="<%= training.id %>">
-              <input type="hidden" name="type" value="aufwaermleiter">
-              <select name="leaderId">
-                <% aufwaermleiterCandidates.forEach(candidate => { %>
-                  <option value="<%= candidate.id %>"><%= candidate.name %> (<%= Math.floor(candidate.weeks_since_last) %> Wochen)</option>
-                <% }) %>
-              </select>
-              <button class="btn btn-primary" type="submit">Speichern</button>
-              <button class="btn btn-danger" type="button" onclick="toggleDivsAufwaermenLeiter()">cancel</button>        
-        </form>
-        
-          </div>
-          <% } %>
-          
-          <script>
-              function toggleDivsAufwaermenLeiter() {
-                  $('#viewAufwaermenLeiter').toggleClass('d-none d-block');
-                  $('#editAufwaermenLeiter').toggleClass('d-none d-block');
-              }
-          </script>
-          
- 
-      <% } else { %>
-        <form method="POST" action="/update-leader">
-          <p><strong>Leitung:</strong>
-          <input type="hidden" name="trainingId" value="<%= training.id %>">
-          <input type="hidden" name="type" value="aufwaermleiter">
-          <select name="leaderId">
-            <% aufwaermleiterCandidates.forEach(candidate => { %>
-              <option value="<%= candidate.id %>"><%= candidate.name %> (<%= Math.floor(candidate.weeks_since_last) %> Wochen)</option>
-            <% }) %>
-          </select>
-          <% if (session && session.role === 'admin') { %>
-          <button class="btn btn-primary" type="submit">Speichern</button>
-          <% } %>
-        </form></p>
-      <% } %>
-      
-        <% if (training.aufwaermen_name) { %>
-          <div id="viewAufwaermen" class="mt-0">
-            <strong>Spiel:</strong> 
-              <%= training.aufwaermen_name %>
-            <% if (session && session.role === 'admin') { %>
-                <button class="btn btn-primary" onclick="toggleDivsAufwaermen()">edit</button>
-              <% } %>
-            </div>
-            <% if (session && session.role === 'admin') { %>
-            <div id="editAufwaermen" class="mt-0 d-none"  style="margin: 0; padding: 0;">
-              <form method="POST" action="/update-training">
-                <p><strong>Spiel:</strong> 
-                <input type="hidden" name="trainingId" value="<%= training.id %>">
-                <input type="hidden" name="type" value="aufwaermen">
-                <datalist id="spiele">
-                    <% aufwaermenCandidates.forEach(candidate => { %>
-                    <option value="<%= candidate.name %>"><%= candidate.name %></option>
-                  <% }) %>
-              </datalist>
-              <input list="spiele" value="<%= training.aufwaermen_name %>" id="spielName" name="spielName">
-                <button class="btn btn-primary" type="submit">Speichern</button>
-                <button class="btn btn-danger" type="button" onclick="toggleDivsAufwaermen()">cancel</button>
-              </form>
-          </p></div>
-            <% } %>
-            
-            <script>
-                function toggleDivsAufwaermen() {
-                    $('#viewAufwaermen').toggleClass('d-none d-block');
-                    $('#editAufwaermen').toggleClass('d-none d-block');
-                }
-            </script>
-        <% } else { %>
-          <form method="POST" action="/update-training">
-            <p><strong>Spiel:</strong> 
-            <input type="hidden" name="trainingId" value="<%= training.id %>">
-            <input type="hidden" name="type" value="aufwaermen">
-            <datalist id="spiele">
-                <% aufwaermenCandidates.forEach(candidate => { %>
-                <option value="<%= candidate.name %>"><%= candidate.name %></option>
-              <% }) %>
-          </datalist>
-          <input list="spiele" id="spielName" name="spielName">
-          <% if (session && session.role === 'admin') { %>
-            <button class="btn btn-primary" type="submit">Speichern</button>
-            <% } %>
-          </form></p>
-        <% } %>
-  </div>
 <div id="spiel">
       <h3>Spiel: </h3>
       
@@ -282,7 +170,7 @@
         <% riegen[riegennummer].forEach(teilnehmer => { if(teilnehmer.helfer) { %> 
           <tr>
             <td>
-              <%= teilnehmer.vorname %> 
+              <%= teilnehmer.vorname %> <%= teilnehmer.hasBirthday == 2 ? '🎂🎂' : '' %><%= teilnehmer.hasBirthday == 1 ? '🎂' : '' %>
             </td>
             <td>
               <%= teilnehmer.nachname %>
@@ -292,14 +180,14 @@
             </td>
             <td>
             <input type="hidden" name="inriege" value="<%= teilnehmer.id %>" />          <input type="checkbox" name="anw" <%= teilnehmer.anwesend  ? 'checked' : ''  %> value="<%= teilnehmer.id %>">
-            <% }}) %>
           </td>
-      </tr>
+        </tr>
+        <% }}) %>
     
           <% riegen[riegennummer].forEach(teilnehmer => { if(!teilnehmer.helfer) { %> 
           <tr>      
             <td>
-              <%= teilnehmer.vorname %>             
+              <%= teilnehmer.vorname %>  <%= teilnehmer.hasBirthday == 2 ? '🎂🎂' : '' %><%= teilnehmer.hasBirthday == 1 ? '🎂' : '' %>       
             </td>
             <td> 
               <%= teilnehmer.nachname %>

views/trainings_riegen.ejs

@@ -0,0 +1,435 @@
+<%- include('partials/header') %>
+<h1>
+<div>
+  <% if (previousTraining) { %>
+      <a href="/training?kw=<%= previousTraining.kw %>"> &lt; </a>
+  <% } %>
+  Training <%= moment(training.datum).format('DD.MM.YYYY') %>
+  <% if (nextTraining) { %>
+    <a href="/training?kw=<%= nextTraining.kw %>"> &gt; </a>
+  <% } %>
+  </h1>
+</div>
+
+<!-- Nav tabs -->
+<ul class="nav nav-tabs" id="myTab" role="tablist">
+  <li class="nav-item" role="presentation">
+    <button class="nav-link <%= activeTab === 'geraete' ? 'active' : '' %>" id="tab-geraete" data-bs-toggle="tab" data-bs-target="#geraete" type="button" role="tab" aria-controls="geraete" aria-selected="true">Geräteplan</button>
+  </li>
+  <li class="nav-item" role="presentation">
+    <button class="nav-link <%= activeTab === 'spiel' ? 'active' : '' %>" id="tab-spiel" data-bs-toggle="tab" data-bs-target="#spiel" type="button" role="tab" aria-controls="spiel" aria-selected="false">Aufwärmen / Spiel</button>
+  </li><li class="nav-item" role="presentation">
+    <button class="nav-link <%= activeTab === 'anwesend' ? 'active' : '' %>" id="tab-anwesend" data-bs-toggle="tab" data-bs-target="#anwesend" type="button" role="tab" aria-controls="anwesend" aria-selected="false">Anwesenheit</button>
+  </li>
+</ul>
+
+<% if (training) { %>
+  <div class="tab-content" id="myTabContent">
+    <div class="tab-pane fade <%= activeTab === 'geraete' ? 'show active' : '' %>" id="geraete" role="tabpanel" aria-labelledby="tab-geraete">
+ <h2> Geräte </h2>
+ <ul>
+    <li>Riege 1 (Klaas): <%= training.geraet_riege_1_name %></li>
+    <li>Riege 2 (Rabea): <%= training.geraet_riege_2_name %></li>
+    <li>Riege 3 (Laura): <%= training.geraet_riege_3_name %></li>
+    <li>Riege 4 (Laila / Carlotta): <%= training.geraet_riege_4_name %></li>
+    <li>Riege 5 (Simon): <%= training.geraet_riege_5_name %></li>
+</ul>
+</div>
+<div class="tab-pane fade <%= activeTab === 'spiel' ? 'show active' : '' %>" id="spiel" role="tabpanel" aria-labelledby="tab-spiel">
+<div id="aufwaermen">
+      <h3>Aufwärmen:</h3>
+      <% if (training.aufwaermleiter_name) { %>
+        <div id="viewAufwaermenLeiter" class="mt-0" style="margin: 0; padding: 0;">
+          <strong>Leitung:</strong>
+            <%= training.aufwaermleiter_name %>
+          <% if (session && session.role === 'admin') { %><button class="btn btn-primary" onclick="toggleDivsAufwaermenLeiter()">Edit</button><% } %>
+          </div>
+          <% if (session && session.role === 'admin') { %>
+          <div id="editAufwaermenLeiter" class="mt-0 d-none" style="margin: 0; padding: 0;">
+            <form method="POST" action="/update-leader">
+              <strong>Leitung:</strong>
+              <input type="hidden" name="trainingId" value="<%= training.id %>">
+              <input type="hidden" name="type" value="aufwaermleiter">
+              <select name="leaderId">
+                <% aufwaermleiterCandidates.forEach(candidate => { %>
+                  <option value="<%= candidate.id %>"><%= candidate.name %> (<%= Math.floor(candidate.weeks_since_last) %> Wochen)</option>
+                <% }) %>
+              </select>
+              <button class="btn btn-primary" type="submit">Speichern</button>
+              <button class="btn btn-danger" type="button" onclick="toggleDivsAufwaermenLeiter()">cancel</button>        
+        </form>
+        
+          </div>
+          <% } %>
+          
+          <script>
+              function toggleDivsAufwaermenLeiter() {
+                  $('#viewAufwaermenLeiter').toggleClass('d-none d-block');
+                  $('#editAufwaermenLeiter').toggleClass('d-none d-block');
+              }
+          </script>
+          
+ 
+      <% } else { %>
+        <form method="POST" action="/update-leader">
+          <p><strong>Leitung:</strong>
+          <input type="hidden" name="trainingId" value="<%= training.id %>">
+          <input type="hidden" name="type" value="aufwaermleiter">
+          <select name="leaderId">
+            <% aufwaermleiterCandidates.forEach(candidate => { %>
+              <option value="<%= candidate.id %>"><%= candidate.name %> (<%= Math.floor(candidate.weeks_since_last) %> Wochen)</option>
+            <% }) %>
+          </select>
+          <% if (session && session.role === 'admin') { %>
+          <button class="btn btn-primary" type="submit">Speichern</button>
+          <% } %>
+        </form></p>
+      <% } %>
+      
+        <% if (training.aufwaermen_name) { %>
+          <div id="viewAufwaermen" class="mt-0">
+            <strong>Spiel:</strong> 
+              <%= training.aufwaermen_name %>
+            <% if (session && session.role === 'admin') { %>
+                <button class="btn btn-primary" onclick="toggleDivsAufwaermen()">edit</button>
+              <% } %>
+            </div>
+            <% if (session && session.role === 'admin') { %>
+            <div id="editAufwaermen" class="mt-0 d-none"  style="margin: 0; padding: 0;">
+              <form method="POST" action="/update-training">
+                <p><strong>Spiel:</strong> 
+                <input type="hidden" name="trainingId" value="<%= training.id %>">
+                <input type="hidden" name="type" value="aufwaermen">
+                <datalist id="spiele">
+                    <% aufwaermenCandidates.forEach(candidate => { %>
+                    <option value="<%= candidate.name %>"><%= candidate.name %></option>
+                  <% }) %>
+              </datalist>
+              <input list="spiele" value="<%= training.aufwaermen_name %>" id="spielName" name="spielName">
+                <button class="btn btn-primary" type="submit">Speichern</button>
+                <button class="btn btn-danger" type="button" onclick="toggleDivsAufwaermen()">cancel</button>
+              </form>
+          </p></div>
+            <% } %>
+            
+            <script>
+                function toggleDivsAufwaermen() {
+                    $('#viewAufwaermen').toggleClass('d-none d-block');
+                    $('#editAufwaermen').toggleClass('d-none d-block');
+                }
+            </script>
+        <% } else { %>
+          <form method="POST" action="/update-training">
+            <p><strong>Spiel:</strong> 
+            <input type="hidden" name="trainingId" value="<%= training.id %>">
+            <input type="hidden" name="type" value="aufwaermen">
+            <datalist id="spiele">
+                <% aufwaermenCandidates.forEach(candidate => { %>
+                <option value="<%= candidate.name %>"><%= candidate.name %></option>
+              <% }) %>
+          </datalist>
+          <input list="spiele" id="spielName" name="spielName">
+          <% if (session && session.role === 'admin') { %>
+            <button class="btn btn-primary" type="submit">Speichern</button>
+            <% } %>
+          </form></p>
+        <% } %>
+  </div>
+<div id="spiel">
+      <h3>Spiel: </h3>
+      
+      <% if (training.spielleiter_name) { %>
+        <div id="viewSpielLeiter" class="0" style="margin: 0; padding: 0;">
+          <p><strong>Leitung:</strong>
+            <%= training.spielleiter_name %>
+
+          <% if (session && session.role === 'admin') { %>
+              <button class="btn btn-primary" onclick="toggleDivsSpielLeiter()">edit</button>
+            <% } %>
+          </p>
+          </div>
+          
+          <% if (session && session.role === 'admin') { %>
+          <div id="editSpielLeiter" class="mt-0 d-none" style="margin: 0; padding: 0;">
+            <form method="POST" action="/update-leader">
+              <p><strong>Leitung:</strong>
+              <input type="hidden" name="trainingId" value="<%= training.id %>">
+              <input type="hidden" name="type" value="spielleiter">
+              <select name="leaderId">
+                <% spielleiterCandidates.forEach(candidate => { %>
+                  <option value="<%= candidate.id %>"><%= candidate.name %> (<%= Math.floor(candidate.weeks_since_last) %> Wochen)</option>
+                <% }) %>
+              </select>
+              <button class="btn btn-primary" type="submit">Speichern</button>
+              <button class="btn btn-danger" type="button" onclick="toggleDivsSpielLeiter()">cancel</button>
+            </form></p>
+          
+
+          </div>
+          <% } %>
+          
+          <script>
+              function toggleDivsSpielLeiter() {
+                  $('#viewSpielLeiter').toggleClass('d-none d-block');
+                  $('#editSpielLeiter').toggleClass('d-none d-block');
+              }
+          </script>
+          
+
+      <% } else { %>
+        <form method="POST" action="/update-leader">
+          <p><strong>Leitung:</strong>
+          <input type="hidden" name="trainingId" value="<%= training.id %>">
+          <input type="hidden" name="type" value="spielleiter">
+          <select name="leaderId">
+            <% spielleiterCandidates.forEach(candidate => { %>
+              <option value="<%= candidate.id %>"><%= candidate.name %> (<%= Math.floor(candidate.weeks_since_last) %> Wochen)</option>
+            <% }) %>
+          </select>
+          <% if (session && session.role === 'admin') { %>
+          <button class="btn btn-primary" type="submit">Speichern</button>
+          <% } %>
+        </form></p>
+      <% } %>
+
+    
+        <% if (training.spiel_name) { %>
+          <div id="viewSpiel" class="mt-0" style="margin: 0; padding: 0;">
+            <p><strong>Spiel:</strong> 
+              <%= training.spiel_name %>
+
+            <% if (session && session.role === 'admin') { %>
+                <button class="btn btn-primary" onclick="toggleDivsSpiel()">edit</button>
+              <% } %>
+            </div>
+            
+            <% if (session && session.role === 'admin') { %>
+            <div id="editSpiel" class="mt-0 d-none" style="margin: 0; padding: 0;">
+              <form method="POST" action="/update-training">
+                <p><strong>Spiel:</strong> 
+                <input type="hidden" name="trainingId" value="<%= training.id %>">
+                <input type="hidden" name="type" value="spiel">
+                <datalist id="spiele">
+                  <% aufwaermenCandidates.forEach(candidate => { %>
+                  <option value="<%= candidate.name %>"><%= candidate.name %></option>
+                <% }) %>
+            </datalist>
+            <input list="spiele" id="spielName" name="spielName" value=" <%= training.spiel_name %>">
+                <button class="btn btn-primary" type="submit">Speichern</button>
+                <button class="btn btn-danger" type="button" onclick="toggleDivsSpiel()">cancel</button>
+              </form>
+            
+            </div>
+            <% } %>
+            
+            <script>
+                function toggleDivsSpiel() {
+                    $('#viewSpiel').toggleClass('d-none d-block');
+                    $('#editSpiel').toggleClass('d-none d-block');
+                }
+            </script>
+            
+
+
+        <% } else { %>
+          
+          <form method="POST" action="/update-training">
+            <p><strong>Spiel:</strong> 
+            <input type="hidden" name="trainingId" value="<%= training.id %>">
+            <input type="hidden" name="type" value="spiel">
+            <datalist id="spiele">
+              <% aufwaermenCandidates.forEach(candidate => { %>
+              <option value="<%= candidate.name %>"><%= candidate.name %></option>
+            <% }) %>
+        </datalist>
+        <input list="spiele" id="spielName" name="spielName">
+        <% if (session && session.role === 'admin') { %>
+            <button class="btn btn-primary" type="submit">Speichern</button>
+            <% } %>
+          </form>
+
+        <% } %>
+      </div>
+
+
+</div>
+<div class="tab-pane fade <%= activeTab === 'anwesend' ? 'show active' : '' %>" id="anwesend" role="tabpanel" aria-labelledby="tab-anwesend"> 
+  <h3>Anwesenheit</h3>
+  <p>Anwesend: <%= anwesend.length %></p>
+  <!-- Nav tabs -->
+<ul class="nav nav-tabs" id="RiegenTab" role="tablist">
+  <% Object.keys(riegen).forEach((riegennummer, index) => { %>
+    <li class="nav-item" role="presentation">
+      <button class="nav-link <%= activeRiege == riegennummer ? 'active' : '' %>" id="tab-<%= riegennummer %>" data-bs-toggle="tab" data-bs-target="#riege-<%= riegennummer %>" type="button" role="tab" aria-controls="riege-<%= riegennummer %>" aria-selected="<%= index === 0 ? 'true' : 'false' %>">Riege <%= riegennummer %></button>
+    </li>
+  <% }) %>
+</ul>
+
+<!-- Tab panes -->
+<div class="tab-content" id="myTabContent">
+  <% Object.keys(riegen).forEach((riegennummer, index) => { %>
+    <div class="tab-pane fade <%= activeRiege == riegennummer ? 'show active' : '' %>" id="riege-<%= riegennummer %>" role="tabpanel" aria-labelledby="tab-<%= riegennummer %>">
+      <form method="post" action="/anwesend">
+      <table id="anwesend-<%= riegennummer %>">
+        <thead>
+    <tr>
+      <th onclick="sortTable(0, <%= riegennummer %>)">Vorname</th>
+      <th onclick="sortTable(1, <%= riegennummer %>)">Nachname</th>
+      <th onclick="sortTable(2, <%= riegennummer %>)">Alter</th>
+      <th onclick="sortTable(2, <%= riegennummer %>)">Anw.</th>
+    </tr>
+  </thead>
+        <% riegen[riegennummer].forEach(teilnehmer => { if(teilnehmer.helfer) { %> 
+          <tr>
+            <td>
+              <%= teilnehmer.vorname %> <%= teilnehmer.hasBirthday == 2 ? '🎂🎂' : '' %><%= teilnehmer.hasBirthday == 1 ? '🎂' : '' %>
+            </td>
+            <td>
+              <%= teilnehmer.nachname %>
+            </td>
+            <td>
+              <%= teilnehmer.age %>
+            </td>
+            <td>
+            <input type="hidden" name="inriege" value="<%= teilnehmer.id %>" />          <input type="checkbox" name="anw" <%= teilnehmer.anwesend  ? 'checked' : ''  %> value="<%= teilnehmer.id %>">
+            <% }}) %>
+          </td>
+      </tr>
+    
+          <% riegen[riegennummer].forEach(teilnehmer => { if(!teilnehmer.helfer) { %> 
+          <tr>      
+            <td>
+              <%= teilnehmer.vorname %> <%= teilnehmer.hasBirthday == 2 ? '🎂🎂' : '' %><%= teilnehmer.hasBirthday == 1 ? '🎂' : '' %>            
+            </td>
+            <td> 
+              <%= teilnehmer.nachname %>
+              <% if (teilnehmer.probe) { %>
+            <span
+              style="color: <%= teilnehmer.anwesenheit <= 3 ? 'green' : 'red' %>;"
+            >
+              (<%= teilnehmer.anwesenheit %>)
+            </span>
+            <% } %>
+            </td>
+            <td>
+              <%= teilnehmer.age %>
+            </td>
+            <td>    
+              <input type="hidden" name="inriege" value="<%= teilnehmer.id %>" /><input type="checkbox" name="anw" <%= teilnehmer.anwesend  ? 'checked' : ''  %> value="<%= teilnehmer.id %>">
+            </td>
+          </tr>             
+            <% }}) %>
+      
+    </table>
+
+    <input type="hidden" name="trainingId" value="<%= training.id %>">
+    <input type="hidden" name="riege" value="<%= riegennummer %>">
+    <% if (session && session.role === 'admin') { %>
+      <button type="submit">Speichern</button>
+      <% } %>
+    </form>
+
+    <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#newMemberModal-<%= riegennummer %>">
+  Neues Mitglied
+  </button>
+
+  <!-- Modal -->
+<div class="modal fade" id="newMemberModal-<%= riegennummer %>" tabindex="-1" aria-labelledby="newMemberModalLabel" aria-hidden="true">
+  <div class="modal-dialog">
+    <div class="modal-content">
+      <div class="modal-header">
+        <h1 class="modal-title fs-5" id="exampleModalLabel">Neues Mitglied</h1>
+        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+      </div>
+      <div class="modal-body">
+        <form method="POST" action="/new-member">
+          Name: <input type="text" id="vorname" placeholder="Vorname" name="vorname">
+          <input type="text" id="nachname" placeholder="Nachname" name="nachname"></br>
+          Geburtsdatum: <input type="date" id="geburt" name="geburt"></br>
+          <select name="riege" value="<%= riegennummer %>">
+            <option value=1 <%= riegennummer == 1 ? 'selected' : '' %>> Riege 1</option>
+            <option value=2 <%= riegennummer == 2 ? 'selected' : '' %>> Riege 2</option>
+            <option value=3 <%= riegennummer == 3 ? 'selected' : '' %>> Riege 3</option>
+            <option value=4 <%= riegennummer == 4 ? 'selected' : '' %>> Riege 4</option>
+            <option value=5 <%= riegennummer == 5 ? 'selected' : '' %>> Riege 5</option>
+          </select></br>
+          Adresse: <input type="text" id="adresse" placeholder="Adresse" name="adresse"></br>
+          Probe: <input type="checkbox" name="probe" value="true"></br>
+          <input type="hidden" name="from" value="training">
+          <input type="hidden" name="training" value="<%= training.id %>">
+        </div>
+          <div class="modal-footer">
+          <button type="submit">Speichern</button>
+        </form>
+        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
+      </div>
+    </div>
+  </div>
+</div>
+
+
+
+
+
+    </div>
+  <% }) %>
+</div>
+
+
+
+</div>
+
+    </div>
+      <% } else { %>
+  <p>Kein Training gefunden für das ausgewählte Datum.</p>
+<% } %>
+
+<div>
+<form method="GET" action="/training">
+  <label for="training-date">Datum wählen:</label>
+  <select id="training-date" name="kw" onchange="this.form.submit()">
+    <% trainingsDates.forEach(date => { %>
+      <option value="<%= date.kw %>" <%= selectedKW === date.kw ? 'selected' : '' %>>
+        <%= date.datum %> %>
+      </option>
+    <% }) %>
+  </select>
+</form>
+
+</div>
+
+<script>
+function sortTable(spaltenIndex, riege) {
+  const table = document.getElementById("anwesend-" + riege);
+  let rows = Array.from(table.rows).slice(1); // Überschrift auslassen
+  let isAscending = table.getAttribute('data-sort') === 'asc';
+  
+  rows.sort((rowA, rowB) => {
+    let cellA = rowA.cells[spaltenIndex].innerText.toLowerCase();
+    let cellB = rowB.cells[spaltenIndex].innerText.toLowerCase();
+    
+    if (!isNaN(cellA) && !isNaN(cellB)) {
+      // Wenn die Zellen Zahlen sind, sortiere nach Zahlengröße
+      cellA = parseFloat(cellA);
+      cellB = parseFloat(cellB);
+    }
+
+    if (cellA < cellB) return isAscending ? 1 : -1;
+    if (cellA > cellB) return isAscending ? -1 : 1;
+    return 0;
+  });
+
+  // Tabelle neu anordnen
+  rows.forEach(row => table.tBodies[0].appendChild(row));
+
+  // Sortierrichtung ändern
+  table.setAttribute('data-sort', isAscending ? 'desc' : 'asc');
+}
+</script>
+
+
+
+</body>
+</html>
+
+<%- include('partials/footer') %>