# WebSocket Implementation for FencerJudge

This document explains how to use the WebSocket functionality in the FencerJudge application for real-time match updates.

## Overview

The WebSocket implementation allows for real-time updates of match information, including:
- Match creation
- Score updates
- Match completion
- Match cancellation

## WebSocket Endpoints

### Connection Endpoint
```
ws://localhost:8080/ws
```

The WebSocket endpoint supports SockJS for fallback in browsers that don't support WebSockets natively.

## Message Topics

### Subscribe to Match Updates
To receive real-time match updates, subscribe to:
```
/topic/match.updates
```

### Send Match Updates
To send match updates from the client to the server:
```
/app/match.update
```

## Message Format

Match update messages use the following JSON format:

```json
{
  "matchId": 1,
  "player1Id": 101,
  "player2Id": 102,
  "refereeId": 201,
  "score1": 5,
  "score2": 3,
  "date": "2023-06-01",
  "type": "SCORE_UPDATE"
}
```

The `type` field can have the following values:
- `SCORE_UPDATE`: When a match score is updated
- `MATCH_START`: When a new match is created
- `MATCH_END`: When a match is completed
- `MATCH_CANCEL`: When a match is cancelled

## Integration with REST API

The WebSocket functionality is integrated with the REST API. Any changes made through the REST endpoints will automatically trigger WebSocket messages to all connected clients.

REST endpoints:
- `GET /api/matches`: Get all matches
- `GET /api/matches/{id}`: Get a match by ID
- `POST /api/matches`: Create a new match (triggers MATCH_START WebSocket message)
- `PUT /api/matches/{id}`: Update a match (triggers SCORE_UPDATE WebSocket message)
- `PATCH /api/matches/{id}/score`: Update just the score (triggers SCORE_UPDATE WebSocket message)
- `DELETE /api/matches/{id}`: Delete a match (triggers MATCH_CANCEL WebSocket message)

## Client-Side Example (JavaScript)

```javascript
// Using SockJS and STOMP client
import SockJS from 'sockjs-client';
import { Client } from '@stomp/stompjs';

// Create a new STOMP client
const socket = new SockJS('http://localhost:8080/ws');
const stompClient = new Client({
  webSocketFactory: () => socket,
  debug: (str) => console.log(str)
});

// Connect to the WebSocket server
stompClient.activate();

// Subscribe to match updates
stompClient.onConnect = (frame) => {
  console.log('Connected to WebSocket');
  
  // Subscribe to match updates
  stompClient.subscribe('/topic/match.updates', (message) => {
    const matchUpdate = JSON.parse(message.body);
    console.log('Received match update:', matchUpdate);
    
    // Handle the update in your application
    // e.g., update UI, play sound, etc.
  });
};

// Send a match update (e.g., when a referee updates a score)
function sendMatchUpdate(matchId, score1, score2) {
  if (stompClient.connected) {
    stompClient.publish({
      destination: '/app/match.update',
      body: JSON.stringify({
        matchId: matchId,
        score1: score1,
        score2: score2,
        type: 'SCORE_UPDATE'
      })
    });
  }
}
```

## Security Considerations

The WebSocket endpoint is currently configured to allow connections from any origin (`*`). For production environments, this should be restricted to specific allowed origins.