First commit for broadcast page

tournaments/models/match.py

@@ -155,6 +155,15 @@ class Team:
         self.weight = weight
         self.is_winner = is_winner
 
+    # def to_dict(self):
+    #     return {
+    #         "image": self.image,
+    #         "names": self.names,
+    #         "scores": self.scores,
+    #         "weight": self.weight,
+    #         "is_winner": self.is_winner,
+    #     }
+
 class LiveMatch:
     def __init__(self, title, date, duration, court, started):
         self.title = title
@@ -166,3 +175,13 @@ class LiveMatch:
 
     def add_team(self, team):
         self.teams.append(team)
+
+    # def to_dict(self):
+    #     return {
+    #         "title": self.title,
+    #         "date": self.date,
+    #         "teams": [team.to_dict() for team in self.teams],
+    #         "duration": self.duration,
+    #         "court": self.court,
+    #         "started": self.started,
+    #     }

tournaments/models/round.py

@@ -42,6 +42,6 @@ class Round(models.Model):
         return matches
 
     def all_matches(self):
-        matches = self.match_set.all()
+        matches = list(self.match_set.all())
         matches.extend(self.ranking_matches(True))
         return matches

tournaments/models/tournament.py

@@ -151,7 +151,7 @@ class Tournament(models.Model):
         else:
             matches = self.group_stages_matches()
 
-        return matches
+        return [match.live_match() for match in matches]
 
     def last_match(self):
         matches = []
@@ -161,7 +161,7 @@ class Tournament(models.Model):
             matches.extend(group_stage.match_set.all())
 
         matches = [m for m in matches if m.start_date]
-        matches.sort(key=lambda m: -m.start_date)
+        matches.sort(key=lambda m: m.start_date, reverse=True)
         return matches[0]
 
     def round_for_index(self, index):

tournaments/templates/tournaments/broadcasted.html

@@ -0,0 +1,90 @@
+{% extends 'tournaments/broadcast_base.html' %}
+
+{% block head_title %}Convocations{% endblock %}
+{% block first_title %}{{ tournament.name }}{% endblock %}
+{% block second_title %}Convocations{% endblock %}
+
+{% block content %}
+
+{% load static %}
+
+<div x-data="{
+        paginatedMatches: null,
+        paginatedGroupStages: null,
+        paginatedSummons: null,
+        active: 1,
+        retrieveData() {
+            fetch('/tournament/{{ tournament.id }}/broadcast/json/')
+                .then(res => res.json())
+                .then((data) => {
+                    this.paginatedMatches = this.paginate(data.matches, 8)
+                    this.paginatedGroupStages = this.paginate(data.group_stages, 4)
+                    this.paginatedSummons = this.paginateSummons(data.summons)
+                })
+        },
+        paginateSummons(array) {
+            let pageSize = 20
+            pages = this.paginate(array, pageSize)
+
+            const splitGroups = []
+            pages.forEach(group => {
+                const firstHalf = group.slice(0, pageSize / 2)
+                const secondHalf = group.slice(pageSize / 2)
+                if (secondHalf.length > 0) {
+                    splitGroups.push([firstHalf, secondHalf])
+                } else {
+                    splitGroups.push([firstHalf])
+                }
+            });
+            return splitGroups
+        },
+        paginate(array, pageSize) {
+            let paginatedArray = [];
+            for (let i = 0; i < array.length; i += pageSize) {
+                paginatedArray.push(array.slice(i, i + pageSize))
+            }
+            return paginatedArray;
+        },
+        loop() {
+            this.retrieveData()
+            setInterval(() => {
+                this.retrieveData()
+                this.active = this.active === this.pageCount() ? 1 : this.active+1
+            }, 15000)
+        },
+        pageCount() {
+            return this.paginatedMatches.length + this.paginatedGroupStages.length + this.paginatedSummons.length
+        }
+
+    }" x-init="loop()">
+
+    <div class="grid-x">
+
+        <template x-for="i in paginatedSummons.length">
+            <template x-for="column in paginatedSummons[i-1]">
+                <div class="cell medium-6 large-6 topblock my-block" x-show="active === i">
+                    {% include 'tournaments/broadcasted_summon.html' %}
+                </div>
+            </template>
+        </template>
+
+        <template x-for="i in paginatedMatches.length" >
+            <template x-for="match in paginatedMatches[i-1]" >
+                <div class="cell medium-6 large-3 my-block" x-show="active === i + paginatedSummons.length">
+                    {% include 'tournaments/broadcasted_match.html' %}
+                </div>
+            </template>
+        </template>
+
+        <template x-for="i in paginatedGroupStages.length">
+            <template x-for="group_stage in paginatedGroupStages[i-1]">
+                <div class="cell medium-6 large-3 my-block" x-show="active === i + paginatedSummons.length + paginatedMatches.length">
+                    {% include 'tournaments/broadcasted_group_stage.html' %}
+                </div>
+            </template>
+        </template>
+
+    </div>
+</div>
+
+{% endblock %}

tournaments/templates/tournaments/broadcasted_group_stage.html

@@ -0,0 +1,48 @@
+<div class="dark_bubble">
+
+    <div class="flex-row">
+        <label class="left-label matchtitle winner"><span x-text="group_stage.title"></span></label>
+        <!-- <label class="right-label info"><span x-text="group_stage.date"></span></label> -->
+    </div>
+
+    <template x-for="i in group_stage.teams.length">
+
+            <div>
+                <div class="table-row-2-colums team-names-box padding-bottom-small">
+
+                    <div class="table-cell table-cell-large">
+                        <template x-for="name in group_stage.teams[i-1].names">
+
+                            <div class="semibold" x-data="{
+                                showName(name, team) {
+                                    let html = `<span class='`
+                                    if (team.is_winner) html += `winner`
+                                    html += `'>`
+                                    html += name
+                                    html += `</span>`
+                                    return html
+                                },
+                                }" x-html="showName(name, group_stage.teams[i-1])">
+                            </div>
+                        </template>
+
+                    </div>
+                    <div class="table-cell center">
+                        <div class="score ws"><span x-text="group_stage.teams[i-1].win_loss"></span></div>
+                        <div class="ws"><span x-text="group_stage.teams[i-1].diff"></span></div>
+                    </div>
+                </div>
+
+                <div x-show="i != group_stage.teams.length">
+                    <div class="dark-bottom-border"></div>
+                </div>
+
+            </div>
+    </template>
+
+    <div class="top-margin flex-row">
+        <label class="left-label minor-info"><span class="beige" x-text="group_stage.duration"></span></label>
+        <!-- <label class="right-label minor-info"><span x-text="group_stage.court"></span></label> -->
+    </div>
+
+</div>

tournaments/templates/tournaments/broadcasted_match.html

@@ -0,0 +1,63 @@
+ <div class="bubble">
+
+     <div class="flex-row">
+         <label class="left-label matchtitle"><span x-text="match.title"></span></label>
+         <!-- <label class="right-label info"><span x-text="match.date"></span></label> -->
+     </div>
+
+     <template x-for="i in match.teams.length">
+
+         <div>
+             <div class="table-row-3-colums team-names-box padding-bottom-small">
+
+                 <div class="table-cell table-cell-large">
+                     <template x-for="name in match.teams[i-1].names">
+
+                         <div class="ws" x-data="{
+                             showName(name, team) {
+                                 let html = `<span class='`
+                                 if (team.is_winner) html += `winner`
+                                 html += `'>`
+                                 html += name
+                                 html += `</span>`
+                                 return html
+                             },
+                             }" x-html="showName(name, match.teams[i-1])">
+                         </div>
+
+                     </template>
+                 </div>
+                 <div class="table-cell alignright">
+                     <template x-for="score in match.teams[i-1].scores">
+
+                         <span class="score ws" x-data="{
+                             showScore(score, team) {
+                                 let html = `<span class='`
+                                 if (team.is_winner) html += `winner`
+                                 html += `'>`
+                                 html += score
+                                 html += `</span>`
+                                 return html
+                             },
+                             }" x-html="showScore(score, match.teams[i-1])">
+                         </span>
+
+                         <!-- <span class="score ws" x-text="score"></span> -->
+                     </template>
+                 </div>
+
+             </div>
+
+             <div x-show="i === 1">
+                 <div class="bottom-border"></div>
+             </div>
+
+         </div>
+     </template>
+
+     <div class="top-margin flex-row">
+         <label class="left-label minor-info bold"><span x-text="match.duration"></span></label>
+         <label class="right-label minor-info semibold"><span x-text="match.court"></span></label>
+     </div>
+
+ </div>

tournaments/templates/tournaments/broadcasted_summon.html

@@ -0,0 +1,15 @@
+<div class="bubble">
+    <template x-for="summon in column" >
+        <div class="table-row-4-colums bottom-border">
+            <div class="table-cell table-cell-large semibold">
+                <template x-for="i in summon.names.length">
+                    <div x-text="summon.names[i-1]"></div>
+                </template>
+            </div>
+
+            <div class="table-cell center"><span x-text="summon.weight"></span></div>
+            <div class="table-cell large center"><span x-text="summon.date"></span></div>
+            <div class="table-cell"><div class="mybox center"><span x-text="summon.stage"></span></div></div>
+        </div>
+    </template>
+</div>

tournaments/templates/tournaments/broadcasted_summons.html

@@ -51,7 +51,6 @@
 
     }" x-init="loop()">
 
-
     <div class="grid-x">
         <template x-for="i in paginatedMatches.length" >
             <template x-for="column in paginatedMatches[i-1]" >
@@ -77,9 +76,4 @@
     </div>
 </div>
 
-
-
-
-
-
 {% endblock %}

tournaments/urls.py

@@ -15,6 +15,7 @@ urlpatterns = [
             path('broadcast/matches/', views.tournament_matches, name='broadcasted-matches'),
             path('broadcast/', views.tournament_broadcast, name='broadcast'),
             path('matches/json/', views.tournament_matches_json, name='tournament-matches-json'),
+            path('broadcast/json/', views.broadcast_json, name='broadcast-json'),
             path('broadcast/group-stages/', views.tournament_broadcasted_group_stages, name='broadcasted-group-stages'),
             path('group-stages/', views.tournament_group_stages, name='group-stages'),
             path('group-stages/json/', views.tournament_live_group_stage_json, name='group-stages-json'),

tournaments/views.py

@@ -109,7 +109,7 @@ def tournament_summons_json(request, tournament_id):
 
 def tournament_broadcast(request, tournament_id):
     tournament = get_object_or_404(Tournament, pk=tournament_id)
-    return render(request, 'tournaments/broadcast.html', {
+    return render(request, 'tournaments/broadcasted.html', {
         'tournament': tournament,
     })
 
@@ -119,9 +119,25 @@ def tournament_matches(request, tournament_id):
         'tournament': tournament,
     })
 
+def broadcast_json(request, tournament_id):
+    tournament = get_object_or_404(Tournament, pk=tournament_id)
+
+    matches = [m.__dict__ for m in tournament.live_matches()]
+    group_stages = [gs.to_dict() for gs in tournament.live_group_stages()]
+    team_summons = [summon.to_dict() for summon in tournament.team_summons()]
+
+    broadcast = {
+        'matches': matches,
+        'group_stages': group_stages,
+        'summons': team_summons,
+    }
+
+    data = json.dumps(broadcast)
+    return HttpResponse(data, content_type='application/json')
+
 def tournament_matches_json(request, tournament_id):
     tournament = get_object_or_404(Tournament, pk=tournament_id)
-    live_matches = tournament.live_matches(broadcasted=True)
+    live_matches = tournament.live_matches()
     data = json.dumps(live_matches, default=vars)
     return HttpResponse(data, content_type='application/json')
 
@@ -150,6 +166,8 @@ def tournament_live_group_stage_json(request, tournament_id):
 def players(request):
     return render(request, 'tournaments/test.html')
 
+##### API #####
+
 @api_view(['GET'])
 def user_by_token(request):
     # return Response({"message": "Hello for today! See you tomorrow!"})