Salle d'Attente

La Salle d'Attente (WaitingRoomPageComponent) est l'interface où les joueurs se rassemblent avant le début d'une partie. Elle permet aux joueurs de voir qui rejoint la partie, de discuter via le chat, et à l'administrateur de gérer la partie (verrouiller/déverrouiller, ajouter des joueurs virtuels, démarrer la partie, etc.).

WaitingRoomPageComponent

Propriétés

Propriété Type Description
@ViewChild('neonCursorApp') ElementRef Référence à l'élément DOM du mini-jeu d'effet néon
onGoingGame OnGoingGame Instance du jeu en attente
gameCode string Code d'accès à la partie
isLocked boolean Indique si la partie est verrouillée
isGameFull boolean Indique si la partie a atteint sa capacité maximale
mode string Mode d'entrée ('create' pour créateur, 'join' pour participant)
isAdmin boolean Indique si l'utilisateur est l'administrateur de la partie
players Player[] Liste des joueurs dans la salle d'attente
defaultPlayers (Player | null)[] Tableau des emplacements de joueurs (avec des valeurs null pour les emplacements vides)
showMiniGame boolean Contrôle l'affichage du mini-jeu Néon
neonCursorInstance unknown Instance du script du mini-jeu
isPopupActive boolean Contrôle l'affichage du popup d'erreur général
isValidationPopupActive boolean Contrôle l'affichage du popup de validation
isGameCancelledPopup boolean Contrôle l'affichage du popup d'annulation de partie
isPlayerKickedPopupActive boolean Contrôle l'affichage du popup d'exclusion
isKickValidationPopupActive boolean Contrôle l'affichage du popup de confirmation d'exclusion
isVirtualPlayerChoiceActive boolean Contrôle l'affichage du popup de choix de joueur virtuel
playerNameToKick string Nom du joueur à exclure
popupMessage string Message à afficher dans les popups
gridLimits { [key: number]: number } Limite de joueurs en fonction de la taille de la grille
private subscriptions Subscription[] Liste des abonnements aux observables

Méthodes

constructor(private router: Router, private route: ActivatedRoute, private characterCreation: CharacterCreationService, private waitingRoomService: WaitingRoomService, private renderer: Renderer2)

Description : Initialise le composant avec les services nécessaires et configure les abonnements aux événements socket.
Paramètres :

Détails : Configure plusieurs abonnements pour gérer les mises à jour de l'état du jeu, le verrouillage, le démarrage, l'annulation et l'exclusion des joueurs.

ngOnInit()

Description : Initialise le composant au chargement et détermine si l'utilisateur est l'administrateur.
Retour : void
Détails : Utilise les paramètres de route pour déterminer le mode ('create' ou 'join') et définit isAdmin en conséquence.

toggleLock()

Description : Bascule l'état de verrouillage de la partie si possible.
Retour : void
Détails : Vérifie d'abord si la partie est pleine avant de permettre le déverrouillage. Communique avec le service waitingRoomService pour mettre à jour l'état sur le serveur.

startGame()

Description : Vérifie les conditions pour démarrer la partie et l'initialise si tout est en ordre.
Retour : void
Détails : Vérifie que la partie est verrouillée, qu'il y a au moins 2 joueurs, et que le mode CTF a un nombre pair de joueurs si nécessaire. Utilise le service waitingRoomService pour démarrer la partie.

kickPlayerValidation(playerName: string)

Description : Prépare l'exclusion d'un joueur en affichant un popup de confirmation.
Paramètres : playerName: Nom du joueur à exclure
Retour : void
Détails : Stocke le nom du joueur et affiche le popup de confirmation.

kickPlayer()

Description : Confirme l'exclusion d'un joueur de la partie.
Retour : void
Détails : Vérifie que la partie et le code existent, puis utilise le service waitingRoomService pour exclure le joueur.

quitRoomValidation()

Description : Affiche un popup de confirmation pour quitter la salle d'attente ou annuler la partie.
Retour : void
Détails : Adapte le message selon que l'utilisateur est l'administrateur ou un joueur normal.

quitRoom()

Description : Quitte la salle d'attente ou annule la partie.
Retour : void
Détails : Utilise le service waitingRoomService pour notifier le serveur, déverrouille la partie si en mode 'join', et redirige vers la page d'accueil.

addTypeChoice()

Description : Prépare l'ajout d'un joueur virtuel en affichant le popup de choix du type.
Retour : void
Détails : Vérifie d'abord que la partie n'est pas verrouillée avant de permettre l'ajout.

addVirtualPlayer(playerType: string)

Description : Ajoute un joueur virtuel du type spécifié à la partie.
Paramètres : playerType: Type de joueur virtuel ('AggressiveBot' ou 'DefensiveBot')
Retour : void
Détails : Vérifie d'abord que la partie n'est pas pleine avant d'ajouter le joueur virtuel.

closeVirtualPlayerChoice()

Description : Ferme le popup de choix de joueur virtuel.
Retour : void

closeValidationPopup()

Description : Ferme les popups de validation et de confirmation d'exclusion.
Retour : void

closePopup()

Description : Ferme le popup d'erreur général.
Retour : void

closeGameCancelledPopup()

Description : Ferme le popup d'annulation de partie et redirige vers la page d'accueil.
Retour : void

closePlayerKickedPopup()

Description : Ferme le popup d'exclusion et redirige vers la page d'accueil.
Retour : void

playMiniGames()

Description : Active l'affichage du mini-jeu d'effet néon.
Retour : void
Détails : Utilise un délai pour charger le script après l'affichage de l'interface.

closeMiniGame()

Description : Ferme le mini-jeu et nettoie les ressources associées.
Retour : void
Détails : Supprime les éléments canvas ajoutés et réinitialise l'instance.

quitGame()

Description : Redirige directement vers la page d'accueil.
Retour : void

ngOnDestroy()

Description : Nettoie les abonnements lors de la destruction du composant.
Retour : void
Détails : Annule tous les abonnements pour éviter les fuites de mémoire.

loadNeonCursorScript()

Description : Charge dynamiquement le script pour le mini-jeu d'effet néon.
Retour : void
Détails : Crée un élément script et l'ajoute au DOM pour charger et initialiser l'effet néon.

updateUI(game: OnGoingGame)

Description : Met à jour l'interface utilisateur avec les informations de la partie.
Paramètres : game: Instance mise à jour du jeu
Retour : void
Détails : Met à jour les propriétés du composant et réorganise le tableau des emplacements de joueurs.

Éléments HTML importants

Composants utilisés

ChatboxComponent

Le ChatboxComponent est un composant de chat intégré qui permet aux joueurs de communiquer pendant l'attente et pendant la partie.

Propriétés

Propriété Type Description
@ViewChild('chatMessages') ElementRef Référence à l'élément DOM contenant les messages du chat
@ViewChild(GameLogComponent) GameLogComponent Référence au composant de journal de jeu intégré
@Input() initialVisibility boolean État initial de visibilité du chat
messages ChatMessage[] Liste des messages du chat
newMessage string Contenu du nouveau message à envoyer
isChatboxVisible boolean Contrôle la visibilité du chat
isJournalMode boolean Indique si le chat est en mode journal
isLogFiltered boolean Indique si le journal est filtré
unreadMessagesCount number Nombre de messages non lus
private messagesSubscription Subscription Abonnement aux messages du chat
private playerName string Nom du joueur actuel
private gameCode string Code de la partie actuelle

Méthodes

constructor(private chatService: ChatService, private socketService: SocketService, private statsService: StatsService)

Description : Initialise le composant avec les services nécessaires.
Paramètres :

ngOnInit()

Description : Initialise le composant au chargement.
Retour : void
Détails :

  1. S'abonne au flux de messages du chat
  2. Réinitialise le compteur de messages non lus
  3. Récupère le nom du joueur et le code de la partie
  4. Se connecte au chat avec le code de la partie
  5. S'abonne aux événements de mise à jour du jeu

ngAfterViewInit()

Description : Exécute des actions après le rendu du composant.
Retour : void
Détails : Fait défiler la vue vers le bas pour afficher les derniers messages.

ngOnDestroy()

Description : Nettoie les ressources lors de la destruction du composant.
Retour : void
Détails : Annule l'abonnement aux messages pour éviter les fuites de mémoire.

sendMessage()

Description : Envoie un nouveau message dans le chat.
Retour : void
Détails : Vérifie que le message n'est pas vide, puis utilise le service pour l'envoyer.

scrollToBottom()

Description : Fait défiler la vue des messages vers le bas.
Retour : void
Détails : Utilise l'élément de référence pour modifier le défilement.

toggleChatbox()

Description : Bascule la visibilité du chat.
Retour : void
Détails : Réinitialise le compteur de messages non lus lorsque le chat devient visible.

toggleJournalMode()

Description : Bascule entre le mode chat et le mode journal.
Retour : void
Détails : Réinitialise le filtre si on quitte le mode journal.

toggleLogFilter()

Description : Active/désactive le filtrage des entrées du journal.
Retour : void
Détails : Propage le changement au composant de journal.

connectToChat(gameCode: string)

Description : Établit la connexion au chat pour une partie spécifique.
Paramètres : gameCode: Code de la partie
Retour : void
Détails : Rejoint la salle socket et configure le service de chat.

getGameCodeAndConnectToChat()

Description : Récupère le code de la partie et établit la connexion au chat.
Retour : void
Détails : Tente de récupérer le code depuis différentes sources.

OneButtonPopupComponent

Composant de popup simple avec un seul bouton pour les messages d'information ou d'erreur.

Propriétés

Propriété Type Description
@Input() isPopupActive boolean Contrôle l'affichage du popup
@Input() popupMessage string Message à afficher
@Input() closePopup () => void Fonction de fermeture

TwoButtonsPopupComponent

Composant de popup avec deux boutons pour les demandes de confirmation.

Propriétés

Propriété Type Description
@Input() isPopupActive boolean Contrôle l'affichage du popup
@Input() popupMessage string Message à afficher
@Input() validatePopup () => void Fonction de validation
@Input() closePopup () => void Fonction de fermeture

Services utilisés

WaitingRoomService

Service principal pour gérer les communications liées à la salle d'attente.

Méthodes

constructor(private socketService: SocketService)

Description : Initialise le service avec le service socket.
Paramètres : socketService: Service de gestion des communications socket

onGameUpdated()

Description : Retourne un Observable pour les mises à jour du jeu.
Retour : Observable(OnGoingGame)
Détails : Écoute l'événement GameUpdated sur le socket.

requestGameUpdate(gameCode: string)

Description : Demande une mise à jour du jeu au serveur.
Paramètres : gameCode: Code de la partie
Retour : void
Détails : Émet l'événement RequestGameUpdate sur le socket.

onGameLockUpdated()

Description : Retourne un Observable pour les mises à jour de l'état de verrouillage.
Retour : Observable(boolean)
Détails : Écoute l'événement GameLockUpdated sur le socket et extrait l'état de verrouillage.

toggleGameLock(isLocked: boolean)

Description : Change l'état de verrouillage de la partie.
Paramètres : isLocked: Nouvel état de verrouillage
Retour : void
Détails : Émet l'événement ToggleGameLock sur le socket.

leaveWaitingRoom()

Description : Notifie le serveur que le joueur quitte la salle d'attente.
Retour : void
Détails : Émet l'événement LeaveWaitingRoom sur le socket.

kickPlayer(nip: string, playerName: string)

Description : Exclut un joueur de la partie.
Paramètres :

Retour : void
Détails : Émet l'événement KickPlayer sur le socket.

addVirtualPlayer(nip: string, playerType: string)

Description : Ajoute un joueur virtuel à la partie.
Paramètres :

Retour : void
Détails : Émet l'événement AddVirtualPlayer sur le socket.

onPlayerKicked()

Description : Retourne un Observable pour les notifications d'exclusion.
Retour : Observable(string)
Détails : Écoute l'événement Kicked sur le socket et extrait le message.

onGameCancelled()

Description : Retourne un Observable pour les notifications d'annulation de partie.
Retour : Observable(string)
Détails : Écoute l'événement GameCancelled sur le socket et extrait le message.

startGame(gameCode: string)

Description : Démarre la partie.
Paramètres : gameCode: Code de la partie
Retour : void
Détails : Émet l'événement StartGame sur le socket.

onStartGame()

Description : Retourne un Observable pour les notifications de démarrage de partie.
Retour : Observable(OnGoingGame)
Détails : Écoute l'événement StartGame sur le socket.

getCurrentGame()

Description : Obtient le sujet BehaviorSubject contenant le jeu actuel.
Retour : BehaviorSubject(OnGoingGame)

setCurrentGame(game: OnGoingGame)

Description : Définit le jeu actuel dans le service.
Paramètres : game: Jeu à définir
Retour : void

getCurrentPlayer()

Description : Obtient le sujet BehaviorSubject contenant le joueur actuel.
Retour : BehaviorSubject(Player)

setCurrentPlayer(player: Player)

Description : Définit le joueur actuel dans le service.
Paramètres : player: Joueur à définir
Retour : void

updatePlayer()

Description : Met à jour les informations du joueur actuel.
Retour : void
Détails : Trouve le joueur dans la liste des joueurs du jeu actuel et met à jour le joueur actuel.

CharacterCreationService

Service qui gère la création de personnage et la création/participation à une partie.

Méthodes pertinentes pour la salle d'attente

createGame(player: Player, game: Game)

Description : Crée une nouvelle partie avec le joueur comme administrateur.
Paramètres :

Retour : void
Détails : Définit le joueur comme administrateur, crée une instance OnGoingGame et émet l'événement CreateGame.

onGameCreated()

Description : Retourne un Observable pour les notifications de création de partie.
Retour : Observable(OnGoingGame)
Détails : Écoute l'événement GameCreated sur le socket.

joinWaitingRoom(player: Player)

Description : Fait rejoindre au joueur une salle d'attente existante.
Paramètres : player: Joueur qui rejoint
Retour : void
Détails : Émet l'événement JoinWaitingRoom sur le socket.

SocketService

Le SocketService est un service fondamental qui gère les communications en temps réel avec le serveur via Socket.IO.

Propriétés

Propriété Type Description
socket Socket Instance de la connexion Socket.IO
private currentGameSubject BehaviorSubject<OnGoingGame> Sujet contenant l'état actuel du jeu
private currentPlayerSubject BehaviorSubject<Player> Sujet contenant l'état actuel du joueur

Méthodes

constructor(server: Server, private onGoingGameService: OnGoingGameService, private waitingSocketService: WaitingSocketService, private joinRoomService: JoinGameService, private timerService: TimerSocketService, private combatService: CombatSocketService, private chatService: ChatService)

Description : Initialise le service avec les dépendances requises.
Paramètres :

Détails : Récupère l'instance IO du serveur et initialise les connexions.

sendToRoom(nip: string, dir: string, data?: unknown)

Description : Envoie un événement à tous les sockets dans une salle spécifique.
Paramètres :

Retour : void

getIO()

Description : Récupère l'instance du serveur Socket.IO.
Retour : SocketIOServer

init()

Description : Initialise les écouteurs d'événements socket.
Retour : void
Détails : Configure les écouteurs pour l'événement de connexion.

activateNewSocket(socket: Socket)

Description : Configure un nouveau socket avec tous les gestionnaires d'événements nécessaires.
Paramètres : socket: Nouvelle connexion socket
Retour : void
Détails : Initialise le socket avec les gestionnaires pour la salle d'attente, le jeu, le chat, etc.

listen<T>(event: string)

Description : Crée un Observable pour écouter un type spécifique d'événement.
Paramètres : event: Nom de l'événement à écouter
Retour : Observable(T)
Détails : Transforme les événements socket en flux Observable pour une utilisation avec RxJS.

reconnect()

Description : Rétablit la connexion socket après une déconnexion.
Retour : void
Détails : Déconnecte d'abord le socket existant, puis crée une nouvelle connexion.

emit(event: string, data?: unknown)

Description : Émet un événement au serveur.
Paramètres :

Retour : void

joinRoom(nip: string)

Description : Fait rejoindre au socket une salle spécifique.
Paramètres : nip: Code de la salle/partie
Retour : void
Détails : Vérifie d'abord que le socket est connecté avant de tenter de rejoindre.

disconnect()

Description : Déconnecte le socket du serveur.
Retour : void

on<T>(event: string, callback: (data: T) => void)

Description : Ajoute un écouteur d'événement direct au socket.
Paramètres :

Retour : void

Communication avec le Serveur

La communication avec le serveur se fait via Socket.IO, géré par le SocketService et abstrait par les services spécifiques. Les principaux événements sont:

  1. Émissions:

    • SocketIOEvents.ToggleGameLock: Pour verrouiller/déverrouiller la partie
    • SocketIOEvents.LeaveWaitingRoom: Pour quitter la salle d'attente
    • SocketIOEvents.KickPlayer: Pour exclure un joueur
    • SocketIOEvents.AddVirtualPlayer: Pour ajouter un joueur virtuel
    • SocketIOEvents.StartGame: Pour démarrer la partie

  2. Réceptions:

    • SocketIOEvents.GameUpdated: Mise à jour des informations de la partie
    • SocketIOEvents.GameLockUpdated: Mise à jour de l'état de verrouillage
    • SocketIOEvents.StartGame: Notification de démarrage de partie
    • SocketIOEvents.GameCancelled: Notification d'annulation de partie
    • SocketIOEvents.Kicked: Notification d'exclusion

Navigation

La Salle d'Attente peut rediriger vers:

  1. Page d'Accueil (MainPageComponent) - Lorsque le joueur quitte ou est exclu, ou que la partie est annulée
  2. Page de Jeu (GameViewPageComponent) - Lorsque la partie démarre

Mini-jeu d'Effet Néon

Un mini-jeu d'effet néon est disponible pour les joueurs pendant l'attente:

  1. Activation: Via le bouton "MINI JEUX D'ATTENTE" pour les joueurs non-administrateurs
  2. Fonctionnement: Un effet visuel interactif où le curseur laisse une traînée lumineuse (utilise la bibliothèque threejs-toys)
  3. Technique: Le script est chargé dynamiquement via la méthode loadNeonCursorScript() et intégré à l'élément DOM référencé par neonCursorApp

Gestion des Joueurs Virtuels

Les administrateurs peuvent ajouter des joueurs virtuels (bots) pour compléter la partie:

  1. Types:
    • AggressiveBot: Un bot avec une stratégie agressive
    • DefensiveBot: Un bot avec une stratégie défensive
  2. Limites: La partie a une limite de joueurs basée sur la taille de la grille (définie dans gridLimits)
  3. Verrouillage: Les joueurs virtuels ne peuvent être ajoutés que lorsque la partie n'est pas verrouillée