Merge pull request #165 from fleizean/mpa

rps sounds, little css fix and tournament update.
fleizean · Mar 5, 2024 · bb46aab · bb46aab
2 parents 05f6870 + 3832a65
commit bb46aab
Show file tree

Hide file tree

Showing 20 changed files with 138 additions and 51 deletions.
diff --git a/indianpong/pong/templates/play-rps-ai.html b/indianpong/pong/templates/play-rps-ai.html
@@ -10,7 +10,7 @@
   {% include '_nav.html' %}
   <link rel="stylesheet" href="{% static 'css/rps.css' %}" />
 
-  <div class="container-top" data-cheater="{{ cheater_rps }}" data-godthings="{{godthings_rps}}" data-username="{{request.user.username}}">
+  <div class="container-top" data-cheater="{{ cheater_rps }}" data-godthings="{{godthings_rps}}" data-username="{{request.user.username}}" data-musicpath="{% static "music/" %}">
     <div class="header-top">
       <div class="header">
         <div class="score" style="margin-right: 15px;">
@@ -71,8 +71,8 @@ <h3 class="results__text"></h3>
   </section>
 
   <div id="gameOverScreen" class="game-over">
-    <h1 style="color: white;">Game Over</h1>
-    <p id="winnerText" class="winnerName"></p>
+    <h1 id="winnerText" class="winnerName"></h1>
+    <h2 style="color: white;">Game Over</h2>
     <button id="restartButton">Restart</button>
     <button id="exitButton">Exit</button>
   </div>

diff --git a/indianpong/pong/templates/profile.html b/indianpong/pong/templates/profile.html
@@ -39,9 +39,9 @@ <h5 class="my-3" style="margin-bottom: 0 !important;">{{profile.username}}</h5>
                         {% if request.user.username != profile.username %}
                             {% csrf_token %}
                             {% if is_friend %}
-                                <button data-username="{{ profile.username }}" class="unfollow-btn" ><i class="bi bi-heartbreak-fill"></i> Unfollow</button>
+                                <button data-username="{{ profile.username }}" class="unfollow-btn" style="margin-top: -15px;"><i class="bi bi-heartbreak-fill"></i> Unfollow</button>
                             {% else %}
-                                <button data-username="{{ profile.username }}" class="btn btn-danger"><i class="bi bi-heart-fill"></i> Follow</button>
+                                <button data-username="{{ profile.username }}" class="btn btn-danger" style="margin-top: -10px;"><i class="bi bi-heart-fill"></i> Follow</button>
                             {% endif %}
                         {% endif %}
                     </div>
@@ -203,7 +203,7 @@ <h5 class="my-3" style="margin-bottom: 0 !important;">{{profile.username}}</h5>
                                             {% if profile.username == game_rps.player1.username %}
                                                 {{ game_rps.player1_score }} - {{ game_rps.player2_score }}
                                             {% else %}
-                                                {{ gagame_rpsme.player2_score }} - {{ game_rps.player1_score }}
+                                                {{ game_rps.player2_score }} - {{ game_rps.player1_score }}
                                             {% endif %}
                                         </td>
                                         <td>

diff --git a/indianpong/pong/templates/rankings.html b/indianpong/pong/templates/rankings.html
@@ -48,7 +48,8 @@ <h3>{{ user.displayname }}</h3>
                     <div class="data-container">
                         <div class="data-head">
                             <div class="data-row">
-                                <div class="data-cell data-cell--sm">
+                                <div class="data-cell data-cell--sm" style="display: flex">
+                                    <div class="data-filter" style="visibility: hidden">Images</div>
                                     <div class="data-filter"></div>
                                 </div>
                                 <div class="data-cell data-cell--sm">

diff --git a/indianpong/pong/templates/tournament-room.html b/indianpong/pong/templates/tournament-room.html
@@ -55,17 +55,30 @@ <h3 class="pong-game-text">Room #{{tournament.id}} - Ping Pong Tournament Room {
         {% endif %}
         <section id="game-room-section">
             <div class="player-wrapper">
-                {% for participant in tournament.participants.all %}
-                        <div class="place">
-                            <div class="place-container">
-                                <div class="avatar-container">
-                                    <img src="{{ participant.avatar.url }}" alt="Avatar" class="game-room-avatar">
+                {% for participant in tournament.participants.all %}   
+                        {% if participant.username == tournament.creator.username %}
+                            <div class="place">
+                                <div class="place-container">
+                                    <div class="avatar-container-creator">
+                                        <img src="{{ participant.avatar.url }}" alt="Avatar" class="game-room-avatar">
+                                    </div>
+                                    <div class="clash-info player-info">
+                                        <p class="truncate-pseudo-creator" title="{{ participant.username }}">{{ participant.username }} (L)</p>
+                                    </div>
                                 </div>
-                                <div class="clash-info player-info">
-                                    <p class="truncate-pseudo" title="{{ participant.username }}">{{ participant.username }}</p>
+                            </div>
+                        {% else %}
+                            <div class="place">
+                                <div class="place-container">
+                                    <div class="avatar-container">
+                                        <img src="{{ participant.avatar.url }}" alt="Avatar" class="game-room-avatar">
+                                    </div>
+                                    <div class="clash-info player-info">
+                                        <p class="truncate-pseudo" title="{{ participant.username }}">{{ participant.username }}</p>
+                                    </div>
                                 </div>
                             </div>
-                        </div>
+                        {% endif %}
                 {% endfor %}
                 {% for i in empty_slots %}
                         <div class="place">

diff --git a/indianpong/pong/views.py b/indianpong/pong/views.py
@@ -969,7 +969,7 @@ def tournament_room(request, id):
 
     tournament = Tournament.objects.filter(id=id).first()
     if tournament:
-        empty_slots = range(max(1, 4-tournament.participants.count()))
+        empty_slots = range(max(0, 4-tournament.participants.count()))
         is_participants = tournament.participants.filter(id=request.user.id).exists()
     else:
         empty_slots = range(0, 4)
@@ -1070,7 +1070,7 @@ def update_winner(request):
         data = json.loads(request.body)
         game = data.get("game")
         if (game == "pong"):
-            update_winner_rps(data)
+            update_winner_pong(data)
         else:
             update_winner_rps(data)
         ##############

diff --git a/indianpong/static/css/tournament-room.css b/indianpong/static/css/tournament-room.css
@@ -13,6 +13,9 @@
 
   .game-room-buttons {
     text-align: center;
+    display:flex;
+    justify-content: center;
+    align-items: center;
   }
 
   .leave-button {
@@ -26,6 +29,8 @@
       text-transform: uppercase;
       border: none;
       cursor: pointer;
+      margin-right: 1em !important;
+      margin-left: 1em !important;
       padding: 0 5px;
       width: 180px;
       min-width: 180px;
@@ -37,6 +42,10 @@
       display: inline-block;
       margin-bottom: 3em;
   }
+
+  .leave-button:hover {
+    background-color: rgba(255, 255, 255, 0.207);
+  }
 
   /* Eğer bi class'ınızı özelleştirmek istiyorsanız, bi class'ını kullanabilirsiniz. */
 
@@ -73,6 +82,14 @@
   .avatar-container img {
     height: 90px;
     width: 90px;
+    object-fit: cover;
+  }
+
+  .avatar-container-creator {
+    height: 90px;
+    width: 90px;
+    object-fit: cover;
+    border: 1px solid orangered;
   }
 
 
@@ -83,6 +100,17 @@
   }
 
   .truncate-pseudo {
+    color: orange;
+    text-align: center;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    width: 100%;
+  }
+
+  .truncate-pseudo-creator {
+    color: orangered;
+    text-align: center;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;

diff --git a/indianpong/static/js/game/play-ai.js b/indianpong/static/js/game/play-ai.js
@@ -25,8 +25,8 @@ const MUSIC_PATH = document.querySelector('.container-top').dataset.musicpath;
 var gameMusic = false;
 var defeatMusic = false;
 var victoryMusic = false;
-var victorySound = new Audio(MUSIC_PATH+ 'victory-sound.mp3');
-var defeatSound = new Audio(MUSIC_PATH+ 'defeat-sound.mp3');
+var victorySound = new Audio(MUSIC_PATH+ 'pong-victory-sound.mp3');
+var defeatSound = new Audio(MUSIC_PATH+ 'pong-defeat-sound.mp3');
 var gameSound = new Audio(MUSIC_PATH+ 'pong-music.mp3');
 var lpaddleSound = new Audio(MUSIC_PATH+ 'one_beep_2_left.mp3');
 var rpaddleSound = new Audio(MUSIC_PATH+ 'one_beep_2_right.mp3');