First Commit

templates/games/littlebac/finish.html

@@ -0,0 +1,32 @@
+{% extends 'layout.html' %}
+
+{% block content %}
+    <div class="container" data-game-id="{{ game.id }}">
+        <h2>{{ game.name }}</h2>
+        <h3>Partie {{ round.round_counter }}</h3>
+        <div class="game-bac-letter">{{ round.letter }}</div>
+        <div>Le célèbre jeu du petit bac ! Le Petit Bac est un jeu où les joueurs trouvent des mots correspondant à des catégories spécifiques, en commençant par une lettre donnée, pour marquer des points.</div>
+        <form action="" method="post">
+            {% csrf_token %}
+            <table class="bac">
+                <thead>
+                    <tr>
+                        <th>Lettre</th>
+                        {% for categorie in categories%}
+                            <th>{{ categorie.name }}</th>
+                        {% endfor %}
+                    </tr>
+                </thead>
+                <tbody>
+                    <tr>
+                        <td>{{ round.letter }}</td>
+                        {% for response in responses %}
+                            <td>{{ response.answer }}</td>
+                        {% endfor %}
+                    </tr>
+                </tbody>
+            </table>
+            <h1 style="color:orange">Réponse soumise.</h1>
+        </form>
+    </div>
+{% endblock %}

templates/games/littlebac/game.html

@@ -0,0 +1,28 @@
+{% extends 'layout.html' %}
+{% load static %}
+
+{% block extrajs %}
+    <script>
+        const csrfToken = "{{ csrf_token }}";
+    </script>
+    <script src="{% static 'js/games/bac-start.js' %}" defer></script>
+    <script src="{% static 'js/games/bac-utils.js' %}" defer></script>
+{% endblock %} 
+
+{% block content %}
+<div class="container" data-game-id="{{ game.id }}">
+    <h2>{{ game.name }}</h2>
+    <h3>Partie {{ round.round_counter }}</h3>
+    <h5>Status : <span id="status">{{ game.status }}</span></h5>
+    <p style="display:flex;flex-direction:row;">
+        <strong>Joueur(s) actuellement connecté(s) : </strong>
+        <ul id="playersList" class="inline"></ul>
+    </p>
+    <p><strong>Lien de la partie : </strong><input type="text" value="https://www.passion-retro.com/games/bac/party/{{ game.id }}/join"></p>
+    <center>
+        <button id="playButton" class="btn btn-default btn-large" style="display:none;" data-player-id="{{ request.user.id }}">Jouer !</button>
+        <h4 id="infoNbPlayersReady" style="display: none;">Joueurs prêt: <span id="readyCount">0</span></h4>
+        <p id="waitingPlayers" style="color:orange">En attente de joueurs...</p>
+    </center>
+</div>
+{% endblock %}

templates/games/littlebac/home.html

@@ -0,0 +1,13 @@
+{% extends 'layout.html' %}
+
+{% block content %}
+    <div class="container">
+        <h2>Le petit bac</h2>
+        <p>Le Petit Bac, également connu sous le nom de Baccalauréat, est un jeu de société classique qui allie réflexion, rapidité et convivialité. Que ce soit en famille, entre amis ou même en ligne, ce jeu promet des moments d’amusement tout en stimulant votre esprit.</p>
+        <p>Le principe est simple : les joueurs doivent trouver des mots correspondant à des catégories données (comme “Prénom”, “Ville”, “Animal”, “Objet”, etc.) et commençant par une lettre tirée au sort. Plus vous êtes rapide et original dans vos réponses, plus vous marquez de points ! Mais attention, les réponses répétées entre joueurs rapportent moins de points, et les erreurs ne sont pas pardonnées.</p>
+        <p>Accessible à tous, le Petit Bac est un excellent moyen de tester vos connaissances, de faire travailler votre créativité, et de passer un moment agréable. Alors, préparez vos stylos ou vos claviers, et que le meilleur gagne !</p>
+        <p>
+            <center><a href="{% url 'bac_start_games' %}" class="btn default btn-large">Démarrer une partie</a></center>
+        </p>
+    </div>
+{% endblock %}

templates/games/littlebac/play.html

@@ -0,0 +1,59 @@
+{% extends 'layout.html' %}
+{% load static %}
+
+{% block extrajs %}
+    <script>
+        const csrfToken = "{{ csrf_token }}";
+    </script>
+    <script src="{% static 'js/games/bac-play.js' %}" defer></script>
+    <script src="{% static 'js/games/bac-utils.js' %}" defer></script>
+{% endblock %} 
+
+
+{% block content %}
+    <div class="container" data-game-id="{{ game.id }}" data-round-id="{{ round.id }}">
+        <h2>{{ game.name }}</h2>
+        <h3>Partie {{ round.round_counter }}</h3>
+        <h5 style="color:rgb(34, 146, 233)">Mon score actuel : {{ player.score }}</h5>
+        <div class="game-bac-letter">{{ round.letter }}</div>
+        <h5>Status : <span id="status">{{ game.status }}</span></h5>
+        <p style="display:flex;flex-direction:row;">
+            <strong>Joueurs dans le salon : </strong>
+            <ul id="playersList" class="inline"></ul>
+        </p>
+        <p>Le célèbre jeu du petit bac ! Le Petit Bac est un jeu où les joueurs trouvent des mots correspondant à des catégories spécifiques, en commençant par une lettre donnée, pour marquer des points.</p>
+        <form action="" method="post">
+            {% csrf_token %}
+            <input type="hidden" name="form_submitted" value="true">
+            <table class="bac responsive-table">
+                <thead>
+                    <tr>
+                        <th>Lettre</th>
+                        {% for categorie in categories%}
+                            <th>{{ categorie.name }}</th>
+                        {% endfor %}
+                    </tr>
+                </thead>
+                <tbody>
+                    <tr>
+                        <td>{{ round.letter }}</td>
+                        {% for categorie in categories%}
+                            <td data-label="{{ categorie.name }}">
+                                <input type="text" name="col-{{ categorie.id }}">
+                            </td>
+                        {% endfor %}
+                    </tr>
+                </tbody>
+            </table>
+            <center>
+                <button id="buttonFinish" data-player-id="{{ request.user.username }}">Valider mes choix</button>
+                <h1 id="textFinished" style="color:orange;display:none">Vos réponses on été soumises</h1>
+                <div id="countdownDisplay" style="display:none;color:orange">
+                    {% if countdown_remaining %}
+                        Temps restant : {{ countdown_remaining }} secondes
+                    {% endif %}
+                </div>
+            </center>
+        </form>
+    </div>
+{% endblock %}

templates/games/littlebac/results.html

@@ -0,0 +1,72 @@
+{% extends 'layout.html' %}
+{% load static %}
+{% load custom_filters %}
+
+{% block extrajs %}
+    <script>
+        const csrfToken = "{{ csrf_token }}";
+    </script>
+    <script src="{% static 'js/games/bac-results.js' %}" defer></script>
+    <script src="{% static 'js/games/bac-utils.js' %}" defer></script>
+{% endblock %} 
+
+{% block content %}
+<div class="container" data-game-id="{{ game.id }}">
+    <h2>{{ game.name }}</h2>
+    <h5>Status : <span id="status">{{ game.status }}</span></h5>
+    <p style="display:flex;flex-direction:row;">
+        <strong>Joueur(s) actuellement connecté(s) : </strong>
+        <ul id="playersList" class="inline"></ul>
+    </p>
+    <!-- On affiche le resultat de chaque round -->
+    {% for round in rounds %}
+        <h3>Résultats du Round {{ round.round_counter }} - Lettre : {{ round.letter }}</h3>
+        <table class="bac">
+            <thead>
+                <tr>
+                    <th>Joueur</th>
+                    {% for categorie in categories %}
+                        <th>{{ categorie.name }}</th>
+                    {% endfor %}
+                    <th>Score</th>
+                </tr>
+            </thead>
+            <tbody>
+                {% for player in players %}
+                    <tr>
+                        <td>{{ player.user.username }}</td>
+                        {% for category in categories %}
+                            <td>{{ all_organized_answers|get_item:round.id|get_item:player.id|get_item:category.id }}</td>
+                        {% endfor %}
+                        <td>{{ scores_by_round|get_item:round.id|get_item:player.id }}</td>
+                    </tr>
+                {% endfor %}
+            </tbody>
+        </table>
+    {% endfor %}
+    <h3>Score Total</h3>
+    <table class="bac">
+        <thead>
+            <tr>
+                <th>Joueur</th>
+                <th>Score</th>
+            </tr>
+        </thead>
+        <tbody>
+            {% for player in players %}
+                <tr>
+                    <td>{{ player.user.username }}</td>
+                    <td>{{ total_scores|get_item:player.id }}</td>
+                </tr>
+            {% endfor %}
+        </tbody>
+    </table>
+    <center><a href="{% url 'bac_start_new_round' game.id %}" class="btn btn-default btn-large">
+        {% if game.author == request.user %}
+            Relancer une partie
+        {% else %}
+            Rejoindre une nouvelle partie
+        {% endif %}
+    </a></center>
+</div>
+{% endblock %}

templates/games/portal.html

@@ -0,0 +1,61 @@
+{% extends 'layout.html' %}
+
+{% block content %}
+    <div class="container">
+        <h2>Portail des Jeux</h2>
+        <ul class="breadcrumbs">
+            <li><a href="{% url 'portal_games' %}">Portail de jeux</a></li>
+        </ul>
+        <p>
+            Afin que les membres qui parcourent ce site web aient aussi dequoi se divertir, vous avez la possibilité sur cette page de jouer à différents jeux online. Ces jeux ont été entièrement réalisé par le fondateur de passion-retro. Vous pouvez remarquer que les jeux rapporte des points, ce qui veux dire qu'un ladderboard existe ! Soyez le meilleur, et restez le !
+        </p>
+        <div class="row">
+            <div class="col-3">
+                <div class="card-game">
+                    <div class="header"><a href="{% url 'bac_games' %}">Le petit bac</a></div>
+                    <div class="body">Le célèbre jeu du petit bac ! Le Petit Bac est un jeu où les joueurs trouvent des mots correspondant à des catégories spécifiques, en commençant par une lettre donnée, pour marquer des points.</div>
+                    <div class="footer"><marquee>Jouer {{ nb_parties }} fois | Meilleur joueur : Toine | Dernière partie : {{ last_party.created }}</marquee></div>
+                </div>
+            </div>
+            <div class="col-3">
+                <div class="card-game">
+                    <div class="header">
+                        <a href="{% url 'quiz_home' %}">Quiz</a>
+                        {% if pending_quizes_count > 0 %}
+                            <span class="badge badge-warning">{{ pending_quizes_count }}</span>
+                        {% endif %}
+                    </div>
+                    <div class="body">Teste tes connaissances avec des quiz variés créés par nos utilisateurs. Que tu sois passionné par la culture générale, le sport, le cinéma, ou tout autre sujet, il y a forcément un quiz fait pour toi.</div>
+                    <div class="footer"><marquee></marquee></div>
+                </div>
+            </div>
+        </div>
+        {% if user.is_authenticated %}
+        <h3>Mes parties en cours</h3>
+        {% if games %}
+            <table class="bac">
+                <thead>
+                    <tr>
+                        <th>Nom</th>
+                        <th>Statut</th>
+                        <th>Actions</th>
+                    </tr>
+                </thead>
+                <tbody>
+                    {% for game in games %}
+                    <tr>
+                        <td>{{ game.name }}</td>
+                        <td>{{ game.status }}</td>
+                        <td>
+                            <a href="{% url 'bac_party_games' game.id %}">Rejoindre</a>
+                        </td>
+                    </tr>
+                    {% endfor %}
+                </tbody>
+            </table>
+            {% else %}
+            <p>Vous n'avez aucune partie en cours.</p>
+            {% endif %}
+        {% endif %}
+    </div>
+{% endblock %}

templates/games/quiz/create_quiz.html

@@ -0,0 +1,21 @@
+{% extends 'layout.html' %}
+
+{% block content %}
+    <div class="container">
+        <h2>Créer un quiz</h2>
+        <ul class="breadcrumbs">
+            <li><a href="{% url 'portal_games' %}">Portail de jeux</a> »</li>
+            <li><a href="{% url 'quiz_home' %}">Quiz</a> »</li>
+            <li>Créer un quiz</li>
+        </ul>
+        <p>
+            Créez un quiz pour tester les connaissances des autres membres de la communauté. Vous pouvez ajouter autant de questions que vous le souhaitez, et pour chaque question, autant de réponses que vous le souhaitez. Pour chaque question, une seule réponse est correcte.
+        </p>
+
+        <form method="post">
+            {% csrf_token %}
+            {{ form.as_p }}
+            <button type="submit" class="btn btn-add">Créer le quiz et ajouter des réponses</button>
+        </form>  
+    </div>
+{% endblock %}

templates/games/quiz/create_responses_quiz.html

@@ -0,0 +1,51 @@
+{% extends 'layout.html' %}
+{% load static %}
+
+{% block extrajs %}
+    <script src="{% static 'js/games/quiz.js' %}" defer></script>
+{% endblock %} 
+
+{% block content %}
+    <div class="container">
+        <h2>{{ quiz.name }}</h2>
+        <ul class="breadcrumbs">
+            <li><a href="{% url 'portal_games' %}">Portail de jeux</a> »</li>
+            <li><a href="{% url 'quiz_home' %}">Quiz</a> »</li>
+            <li><a href="{% url 'quiz' quiz.id %}">{{ quiz.name }}</a> »</li>
+            <li>Création</li>
+        </ul>
+        <p>
+            Créez des questions pour votre quiz. Pour chaque question, vous pouvez ajouter autant de réponses que vous le souhaitez. Pour chaque question, une seule réponse est correcte.
+        </p>
+
+        <form method="post">
+            {% csrf_token %}
+            <div id="questions"></div>
+            <a class="btn btn-default btn-small" id="add-ask">Ajouter une question</a>
+            <button type="submit" class="btn btn-add">Mettre à jour le quiz</button>
+        </form>  
+        <h3>Questions existantes pour le quiz</h3>
+        <table class="quiz">
+            <thead>
+                <tr>
+                    <th>Question</th>
+                    <th>Réponses</th>
+                </tr>
+            </thead>
+            <tbody>
+                {% for question in quiz.questions.all %}
+                <tr>
+                    <td>{{ question.question }}</td>
+                    <td>
+                        <ul>
+                            {% for choice in question.choices.all %}
+                            <li style="{% if choice.is_correct %}color:green;{% else %}color:orange;{% endif %}">{{ choice.choice }}</li>
+                            {% endfor %}
+                        </ul>
+                    </td>
+                </tr>
+                {% endfor %}
+            </tbody>
+        </table>
+    </div>
+{% endblock %}

templates/games/quiz/home.html

@@ -0,0 +1,71 @@
+{% extends 'layout.html' %}
+{% load custom_filters %}
+
+{% block content %}
+<div class="container">
+    <h2>Liste des quiz</h2>
+    <ul class="breadcrumbs">
+        <li><a href="{% url 'portal_games' %}">Portail de jeux</a> »</li>
+        <li>Quiz</li>
+    </ul>
+    {% if request.user.is_authenticated %}
+        <a href="{% url 'create_quiz' %}" class="btn btn-primary">Créer un quiz</a>
+    {% endif %}
+    {% if pending_quizes_count > 0 %}
+        <a href="/admin/quiz/quiz/" class="btn btn-warning">Activer {{ pending_quizes_count }} quizes</a>
+    {% endif %}
+    <div class="row">
+        {% for quiz in quizes %}
+        <div class="col-5">
+            <div class="card-game {% if not quiz.is_active %}deactivate{% endif %}">
+                <div class="header">
+                    <h3>
+                        <a href="{% url 'quiz' quiz.id %}">{{ quiz.name }}</a>
+                        {% if not quiz.is_active %}
+                            <span style="color:red">Non Publié</span>
+                        {% endif %}
+                    </h3>
+                    {% if quiz.id in user_scores %}
+                        <span>Mon score: {{ user_scores|get_item:quiz.id }}/{{ quiz.questions.count }}</span>
+                    {% endif %}
+                </div>
+                <div class="body">
+                        <p>{{ quiz.description }}</p>
+                        <p>{{ quiz.questions.count }} questions</p>
+                </div>
+                <div class="footer">Créé par <span class="{{ quiz.author.username_decoration }}">{{ quiz.author }}</span> le {{ quiz.created }}</div>
+            </div>
+        </div>
+        {% endfor %}
+    </div>
+    <h3>Mes quiz</h3>
+    <table class="quiz">
+        <thead>
+            <tr>
+                <th>Nom</th>
+                <th>Créé le</th>
+                <th>Statut</th>
+                <th>Actions</th>
+            </tr>
+        </thead>
+        <tbody>
+            {% for my_quiz in my_quizes %}
+                <tr>
+                    <td><a href="{% url 'quiz' my_quiz.id %}">{{ my_quiz.name }}</a></td>
+                    <td>{{ my_quiz.created }}</td>
+                    <td>
+                        {% if my_quiz.is_active %}
+                            <span style="color:green"">Publié</span>
+                        {% else %}
+                        <span style="color:orangered"">Non Publié</span>
+                        {% endif %}
+                    </td>
+                    <td>
+                        <a href="{% url 'create_responses_quiz' my_quiz.id %}">Modifier</a>
+                    </td>
+                </tr>
+            {% endfor %}
+        </tbody>
+    </table>
+</div>
+{% endblock %}

templates/games/quiz/quiz.html

@@ -0,0 +1,41 @@
+{% extends 'layout.html' %}
+
+{% block content %}
+<div class="container">
+    <h2 class="quiz-title">{{ quiz.name }}</h2>
+    <ul class="breadcrumbs">
+        <li><a href="{% url 'portal_games' %}">Portail de jeux</a> »</li>
+        <li><a href="{% url 'quiz_home' %}">Quiz</a> »</li>
+        <li>{{ quiz.name }}</li>
+    </ul>
+
+    <form method="post" class="quiz-form">
+        {% csrf_token %}
+        {% for question in questions %}
+        <div class="quiz-question">
+            <div class="question-header">Question {{ forloop.counter }}</div>
+            <div class="question-content">
+                <h3>{{ question.question }}</h3>
+                <div class="choices-container">
+                    {% for choice in question.choices.all %}
+                    <div class="choice-item">
+                        <input type="radio" 
+                               name="question_{{ question.id }}" 
+                               value="{{ choice.id }}" 
+                               id="choice_{{ choice.id }}" 
+                               required>
+                        <label for="choice_{{ choice.id }}">
+                            {{ choice.choice }}
+                        </label>
+                    </div>
+                    {% endfor %}
+                </div>
+            </div>
+        </div>
+        {% endfor %}
+        <div class="submit-container">
+            <button type="submit" class="submit-button">Valider mes réponses</button>
+        </div>
+    </form>
+</div>
+{% endblock %}

templates/games/quiz/result.html

@@ -0,0 +1,62 @@
+{% extends 'layout.html' %}
+
+{% block content %}
+<div class="container">
+    <h2>{{ user_quiz.quiz.name }}</h2>
+    <ul class="breadcrumbs">
+        <li><a href="{% url 'portal_games' %}">Portail de jeux</a> »</li>
+        <li><a href="{% url 'quiz_home' %}">Quiz</a> »</li>
+        <li><a href="{% url 'quiz' user_quiz.quiz.id %}">{{ user_quiz.quiz.name }}</a> »</li>
+        <li>Résultas</li>
+    </ul>
+    <div class="quiz-result-card"> 
+        <!-- Progress Circle -->
+        <div class="progress-circle-container">
+            <div class="progress-circle">
+                <svg viewBox="0 0 36 36" class="circular-chart">
+                    <!-- Cercle de fond -->
+                    <path d="M18 2.0845
+                          a 15.9155 15.9155 0 0 1 0 31.831
+                          a 15.9155 15.9155 0 0 1 0 -31.831"
+                          stroke="#eee"
+                          fill="none"
+                          stroke-width="3"/>
+                    <!-- Cercle de progression -->
+                    <path d="M18 2.0845
+                          a 15.9155 15.9155 0 0 1 0 31.831
+                          a 15.9155 15.9155 0 0 1 0 -31.831"
+                          stroke-dasharray="{{ percentage }}, 100"
+                          class="progress-path {% if percentage >= 75 %}high{% elif percentage >= 50 %}medium{% else %}low{% endif %}"
+                          fill="none"
+                          stroke-width="3"/>
+                </svg>
+                <div class="percentage-text">
+                    {{ percentage|floatformat:0 }}%
+                </div>
+            </div>
+        </div>
+
+        <!-- Score Details -->
+        <div class="score-details">
+            <h3>Score final</h3>
+            <div class="score-number {% if percentage >= 75 %}high{% elif percentage >= 50 %}medium{% else %}low{% endif %}">
+                {{ user_quiz.score }} / {{ total_questions }}
+            </div>
+            <p class="score-message">
+                {% if percentage >= 75 %}
+                    🎉 Excellent travail !
+                {% elif percentage >= 50 %}
+                    🎯 Bon effort !
+                {% else %}
+                    💪 Continue tes efforts !
+                {% endif %}
+            </p>
+        </div>
+
+        <!-- Actions -->
+        <div class="actions">
+            <a href="{% url 'quiz_home' %}" class="btn btn-large">Retour aux quiz</a>
+        </div>
+    </div>
+</div>
+{% endblock %}