Merge branch 'main' of https://gitea.staxriver.com/staxriver/padelclub_backend

tournaments/models/match.py

@@ -480,7 +480,6 @@ class LiveMatch:
             "group_stage_name": self.group_stage_name,
             "format": self.format,
             "disabled": self.disabled,
-            "start_date": self.start_date,
             "court_index": self.court_index
         }
 

tournaments/services/email_service.py

@@ -69,7 +69,7 @@ class TournamentEmailService:
         if waiting_list_position >= 0:
             base_subject = "Liste d'attente"
         else:
-            base_subject = "Participation confirmé"
+            base_subject = "Participation confirmée"
         return TournamentEmailService.email_subject(tournament, base_subject)
 
     @staticmethod

tournaments/templates/tournaments/bracket_match_cell.html

@@ -2,16 +2,7 @@
 
         <div class="cell medium-12 large-3 my-block">
             <div class="bubble">
-
-                <div class="flex-row">
-                    <label class="matchtitle">{{ match.title }}</label>
-                    {% if not match.ended %}
-                    <label class="right-label minor-info bold">{{ match.court }}</label>
-                    {% endif %}
-                </div>
-
                 <div>
-
                 {% for team in match.teams %}
                 <div class="match-result {% cycle 'bottom-border' '' %}">
                     <div class="player">
@@ -62,19 +53,5 @@
                 {% endfor %}
 
                 </div>
-                <div class="status-container {% if not match.ended and match.started %}running{% endif %}">
-                    <div class="flex-row top-margin">
-                        <label class="left-label minor-info bold">
-                            {% if match.show_time_indication %}
-                            {{ match.time_indication }}
-                            {% endif %}
-                        </label>
-                        <label class="right-label minor-info">
-                            {% if not match.ended %}
-                            {{ match.format }}
-                            {% endif %}
-                        </label>
-                    </div>
-                </div>
             </div>
         </div>

tournaments/templates/tournaments/matches.html

@@ -6,7 +6,6 @@
 
 {% block content %}
 
-{% if tournament.display_matches %}
 {% include 'tournaments/navigation_tournament.html' %}
 
 {% if tournament.display_matches or tournament.display_group_stages %}
@@ -43,6 +42,5 @@
 
 {% endfor %}
 
-{% endif %}
 {% endif %}
 {% endblock %}

tournaments/templates/tournaments/tournament_bracket.html

@@ -18,6 +18,8 @@
                 <div data-match-round="{{ forloop.parentloop.counter0 }}"
                      data-match-index="{{ forloop.counter0 }}"
                      data-disabled="{{ match.disabled|lower }}"
+                     data-match-group-name="{{ match_group.name }}"
+                     data-match-format="{{ match.format }}"
                      class="match-template">
                     {% include 'tournaments/bracket_match_cell.html' %}
                 </div>
@@ -34,6 +36,7 @@ function renderBracket() {
     const rounds = [];
     const matchPositions = [];
 
+
     // Group matches by round
     Array.from(matchTemplates).forEach(template => {
         const roundIndex = parseInt(template.dataset.matchRound);
@@ -54,62 +57,123 @@ function renderBracket() {
     bracket.innerHTML = '';
     const roundCount = rounds.length;
     const finalRoundIndex = (roundCount - 1) / 2;
+    let nextMatchDistance = baseDistance;
+    let minimumMatchDistance = 1;
+    if (rounds[0].length <= 2) {
+      minimumMatchDistance = 2
+      nextMatchDistance = baseDistance * 2;
+    }
 
     rounds.forEach((roundMatches, roundIndex) => {
         const roundDiv = document.createElement('div');
         roundDiv.className = 'butterfly-round';
         roundDiv.style.setProperty('--match-width', `${365}px`);
-        matchPositions[roundIndex] = [];
 
+        // Create title
+        const titleDiv = document.createElement('div');
+        titleDiv.className = 'round-title';
+
+        // Get the match group name and format
+        const firstMatchTemplate = roundMatches[0].closest('.match-template');
+        const matchGroupName = firstMatchTemplate.dataset.matchGroupName;
+        const matchFormat = firstMatchTemplate.dataset.matchFormat;
+
+        const nameSpan = document.createElement('div');
+        nameSpan.className = 'round-name';
+        nameSpan.textContent = matchGroupName;
+
+        const formatSpan = document.createElement('div');
+        formatSpan.className = 'round-format';
+        formatSpan.textContent = matchFormat;
+
+        titleDiv.appendChild(nameSpan);
+        titleDiv.appendChild(formatSpan);
+
+        // Create matches container
+        const matchesContainer = document.createElement('div');
+        matchesContainer.className = 'matches-container';
+        if (roundIndex >= finalRoundIndex - 1) {
+          if (roundCount > 5) {
+            matchesContainer.style.transform = `translateX(-50%)`;
+            if (roundIndex >= finalRoundIndex + 2) {
+                matchesContainer.style.transform = `translateX(-100%)`;
+            }
+          }
+        }
+        roundDiv.appendChild(matchesContainer);
+
+        matchPositions[roundIndex] = [];
         roundMatches.forEach((matchTemplate, matchIndex) => {
             const matchDiv = document.createElement('div');
             matchDiv.className = 'butterfly-match';
+
             matchDiv.style.position = 'absolute';
             const isDisabled = matchTemplate.dataset.disabled === 'true';
             let top;
             let left;
             let right;
-            let nextMatchDistance = baseDistance;
+            const currentMatchesCount = roundMatches.length;
-
-            // Check if this round has only one match
-            const isSingleMatchRound = roundMatches.length === 1;
-            if (isSingleMatchRound) {
-                matchDiv.classList.add('single-match-round');
-                nextMatchDistance = 0;
-            }
-
             if (roundIndex > finalRoundIndex) {
               matchDiv.classList.add('reverse-bracket');
               top = matchPositions[roundCount - roundIndex - 1][matchIndex];
-              nextMatchDistance = baseDistance * Math.pow(2, rounds.length - roundIndex - 1);
-            } else {
-              nextMatchDistance = baseDistance * Math.pow(2, roundIndex);
             }
 
             if (roundIndex === 0) {
-                top = matchIndex * (matchHeight + matchSpacing);
+              const nextMatchesCount = rounds[roundIndex + 1].length;
+
+              if (currentMatchesCount == nextMatchesCount) {
+                nextMatchDistance = 0;
+              }
+                top = matchIndex * (matchHeight + matchSpacing) * minimumMatchDistance;
+            } else if (roundIndex === roundCount - 1) {
+                const nextMatchesCount = rounds[roundIndex - 1].length;
+                if (currentMatchesCount == nextMatchesCount) {
+                  nextMatchDistance = 0;
+                }
             } else if (roundIndex == finalRoundIndex) {
                 let lgth = matchPositions[0].length / 2;
                 let index = lgth + matchIndex - 1;
                 // If index goes negative, use 0 instead
-                top = matchPositions[0][index < 0 ? 0 : index];
+                if (matchIndex == 0) {
+                  top = matchPositions[roundIndex - 1][0] - baseDistance / 2;
+                } else {
+                  top = matchPositions[roundIndex - 1][0] + baseDistance / 2;
+                }
                 nextMatchDistance = baseDistance;
             } else if (roundIndex < finalRoundIndex) {
+              const previousMatchesCount = rounds[roundIndex - 1].length;
+              const nextMatchesCount = rounds[roundIndex + 1].length;
+
+              if (currentMatchesCount == nextMatchesCount) {
+                nextMatchDistance = 0;
+              } else if (matchPositions.length > roundIndex - 1) {
+                nextMatchDistance = (matchPositions[roundIndex - 1][1] - matchPositions[roundIndex - 1][0]);
+                nextMatchDistance = nextMatchDistance * (previousMatchesCount / currentMatchesCount);
+              }
+
+              if (currentMatchesCount == previousMatchesCount) {
+                top = matchPositions[roundIndex - 1][matchIndex];
+              } else {
                 const parentIndex1 = matchIndex * 2;
                 const parentIndex2 = parentIndex1 + 1;
                 const parentPos1 = matchPositions[roundIndex - 1][parentIndex1];
                 const parentPos2 = matchPositions[roundIndex - 1][parentIndex2];
                 top = (parentPos1 + parentPos2) / 2;
-              nextMatchDistance = baseDistance * Math.pow(2, roundIndex);
               }
+            } else if (roundIndex < roundCount) {
+              const nextMatchesCount = rounds[roundIndex - 1].length;
+              const previousMatchesCount = rounds[roundIndex + 1].length;
 
-            if (roundIndex >= finalRoundIndex - 1) {
+              if (currentMatchesCount == nextMatchesCount) {
-              if (roundCount > 5) {
+                nextMatchDistance = 0;
-                matchDiv.style.transform = `translateX(-50%)`;
+              } else if (matchPositions.length > roundCount - roundIndex - 1 - 1) {
-                if (roundIndex >= finalRoundIndex + 2) {
+                nextMatchDistance = (matchPositions[roundCount - roundIndex - 1 - 1][1] - matchPositions[roundCount - roundIndex - 1 - 1][0]);
-                    matchDiv.style.transform = `translateX(-100%)`;
+                nextMatchDistance = nextMatchDistance * (previousMatchesCount / currentMatchesCount);
+              }
             }
 
+            if (roundIndex >= finalRoundIndex - 1) {
+              if (roundCount > 5) {
                 if (roundIndex == finalRoundIndex - 1) {
                   matchDiv.classList.add('inward');
                 }
@@ -121,7 +185,7 @@ function renderBracket() {
             }
 
             if (roundIndex === finalRoundIndex - 2 || roundIndex === finalRoundIndex + 2) {
-              nextMatchDistance = (nextMatchDistance - baseDistance);
+              nextMatchDistance = nextMatchDistance - baseDistance;
             }
             else if (roundIndex == finalRoundIndex - 1 || roundIndex == finalRoundIndex + 1) {
               nextMatchDistance = baseDistance;
@@ -130,6 +194,32 @@ function renderBracket() {
             matchDiv.style.setProperty('--next-match-distance', `${nextMatchDistance}px`);
             matchDiv.style.top = `${top}px`;
             matchPositions[roundIndex][matchIndex] = top;
+            if (matchIndex === 0) {
+
+              // // Add logo for final round
+              // if (roundIndex == finalRoundIndex) {
+              //     const logoDiv = document.createElement('div');
+              //     logoDiv.className = 'round-logo';
+              //     const logoImg = document.createElement('img');
+              //     logoImg.src = '/static/tournaments/images/PadelClub_logo_512.png';
+              //     logoImg.alt = 'PadelClub Logo';
+              //     logoDiv.appendChild(logoImg);
+              //     logoDiv.style.transform = `translateX(-50%)`;
+              //     matchesContainer.appendChild(logoDiv);
+              // }
+
+
+                // Position title above the first match
+                titleDiv.style.top = `${top - 80}px`; // Adjust the 60px offset as needed
+                titleDiv.style.position = 'absolute';
+                if (roundIndex == finalRoundIndex - 1) {
+                    titleDiv.style.marginLeft = '50px';
+                } else if (roundIndex == finalRoundIndex + 1) {
+                    titleDiv.style.marginLeft = '-50px';
+                }
+
+                matchesContainer.appendChild(titleDiv);
+            }
 
             matchDiv.innerHTML = `
                 <div class="incoming-line ${isDisabled ? 'disabled' : ''}"></div>
@@ -139,19 +229,14 @@ function renderBracket() {
             if (roundIndex == finalRoundIndex - 1) {
               const matchDiv2 = document.createElement('div');
               matchDiv2.className = 'butterfly-match';
-              matchDiv2.style.position = 'absolute';
-              if (roundCount > 5) {
-                matchDiv2.style.transform = `translateX(-50%)`;
-              }
               matchDiv2.classList.add('inward');
               matchDiv2.classList.add('semi-final');
               matchDiv2.style.setProperty('--next-match-distance', `${baseDistance}px`);
               matchDiv2.style.top = `${top}px`;
-              matchDiv2.innerHTML = `
+              matchDiv2.innerHTML = `<div class="match-content">${rounds[0][0].innerHTML}</div>`;
-              `;
+              matchesContainer.appendChild(matchDiv2); // Append to matchesContainer instead of roundDiv
-              roundDiv.appendChild(matchDiv2);
             }
-            roundDiv.appendChild(matchDiv);
+            matchesContainer.appendChild(matchDiv); // Append to matchesContainer instead of roundDiv
         });
 
         bracket.appendChild(roundDiv);
@@ -162,8 +247,21 @@ function renderBracket() {
 </script>
 
 <style>
+.round-logo img {
+    width: 50px;
+    height: auto;
+    display: block;
+    margin: 0 auto;
+    position: relative;
+    top: -100px; /* Increased negative value to move it higher up */
+}
 
-
+.round-logo img {
+    width: 100px; /* Adjust size as needed */
+    height: auto;
+    display: block;
+    margin: 0 auto;
+}
 .butterfly-match.same-level::before {
     display: none;
 }
@@ -183,12 +281,44 @@ function renderBracket() {
     display: flex;
     gap: 40px; /* Increased to account for horizontal lines (20px on each side) */
     position: relative;
+    margin-bottom: 80px;
+}
+
+
+.round-title {
+    position: absolute;
+    top: 0px; /* Adjust this value to position the title where you want it */
+    padding: 5px 10px;
+    text-align: center;
+    font-weight: bold;
+    width: 100%; /* Change from 100% to auto */
+}
+
+.round-name {
+    font-size: 1.5em; /* Make the round name bigger */
+    margin-bottom: 5px;
+}
+
+.round-format {
+    font-size: 0.9em;
+    color: #666;
+}
+
+.matches-container {
+    position: relative;
+    width: 100%;
+    flex-grow: 1;
 }
 
 .butterfly-round {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 20px; /* Space between title and matches */
     position: relative;
-    width: var(--match-width); /* 300px for match + 20px on each side for lines */
+    width: var(--match-width);
-    flex-shrink: 0; /* Prevents rounds from shrinking */
+    flex-shrink: 0;
+    margin-top: 100px; /* Add padding to account for absolute positioned title */
 }
 
 .butterfly-match {
@@ -211,14 +341,13 @@ function renderBracket() {
     content: "";
     position: absolute;
     left: calc(100% + 20px); /* After horizontal line */
-    top: -4px;
     width: 2px;
-    height: calc(var(--next-match-distance));
+    height: calc((var(--next-match-distance)) / 2);
     background: #666;
 }
 
 /* Vertical line connecting pair of matches */
-.butterfly-match:nth-child(2n+1)::before {
+.butterfly-match:nth-child(2n)::before {
     content: "";
     position: absolute;
     left: calc(100% + 20px); /* After horizontal line */
@@ -228,7 +357,7 @@ function renderBracket() {
     background: #666;
 }
 
-.butterfly-match:nth-child(2n)::before {
+.butterfly-match:nth-child(2n+1)::before {
     content: "";
     position: absolute;
     left: calc(100% + 20px);
@@ -239,17 +368,17 @@ function renderBracket() {
 }
 
 /* Vertical line connecting pair of matches */
-.butterfly-match.reverse-bracket:nth-child(2n+1)::before {
+.butterfly-match.reverse-bracket:nth-child(2n)::before {
     content: "";
     position: absolute;
     left: calc(0% - 20px); /* After horizontal line */
-    top: calc(50% + 2px);
+    top: 50%;
     width: 2px;
     height: calc((var(--next-match-distance)) / 2);
     background: #666;
 }
 
-.butterfly-match.reverse-bracket:nth-child(2n)::before {
+.butterfly-match.reverse-bracket:nth-child(2n+1)::before {
     content: "";
     position: absolute;
     left: calc(0% - 20px);

tournaments/views.py

@@ -987,7 +987,7 @@ def tournament_bracket(request, tournament_id):
 
     # Add first half of each round (from last to semi-finals)
     for round in main_rounds:
-        matches = round.match_set.all().order_by('index')
+        matches = round.match_set.filter(disabled=False).order_by('index')
 
         if matches:
             if len(matches) > 1:
@@ -1009,7 +1009,7 @@ def tournament_bracket(request, tournament_id):
                 serializable_match_groups.append(match_group)
 
     for round in main_rounds_reversed:
-        matches = round.match_set.all().order_by('index')
+        matches = round.match_set.filter(disabled=False).order_by('index')
         if matches:
             if len(matches) > 1:
                 midpoint = int(len(matches) / 2)