photobooth/frontend/js/websocket.js

/* Communication WebSocket avec le backend — reconnexion résiliente */

let ws = null;
let _wsReconnectDelay = 1000;
let _wsWasConnected = false;
const wsCallbacks = {};

function wsConnecter() {
  const proto = location.protocol === 'https:' ? 'wss:' : 'ws:';
  try { ws = new WebSocket(`${proto}//${location.host}/ws`); } catch(e) { _wsScheduleReconnect(); return; }

  ws.onopen = () => {
    console.log('WebSocket connecte');
    _wsReconnectDelay = 1000;
    if (_wsWasConnected) {
      _masquerPause();
      // Recharger la config pour resynchroniser l'état
      if (typeof chargerConfig === 'function') chargerConfig();
    }
    _wsWasConnected = true;
  };

  ws.onmessage = (event) => {
    try {
      const msg = JSON.parse(event.data);
      const cbs = wsCallbacks[msg.type];
      if (cbs) cbs.forEach(cb => cb(msg));
    } catch(e) {}
  };

  ws.onclose = () => {
    console.log('WebSocket deconnecte');
    ws = null;
    _afficherPause();
    _wsScheduleReconnect();
  };

  ws.onerror = () => {
    ws.close();
  };
}

function _wsScheduleReconnect() {
  const delay = Math.min(_wsReconnectDelay, 10000);
  _wsReconnectDelay = Math.min(_wsReconnectDelay * 1.5, 10000);
  setTimeout(wsConnecter, delay);
}

function _afficherPause() {
  const el = document.getElementById('ecran-pause');
  if (el) el.style.display = 'flex';
}

function _masquerPause() {
  const el = document.getElementById('ecran-pause');
  if (el) { el.style.display = 'none'; }
  // Relancer le preview si on était sur l'accueil
  if (typeof lancerPreview === 'function' && document.getElementById('ecran-accueil')?.classList.contains('actif')) {
    lancerPreview();
  }
}

function wsEnvoyer(msg) {
  if (ws && ws.readyState === WebSocket.OPEN) {
    ws.send(JSON.stringify(msg));
  }
}

function wsOnMessage(type, callback) {
  if (!wsCallbacks[type]) wsCallbacks[type] = [];
  wsCallbacks[type].push(callback);
}

// Connexion au demarrage
wsConnecter();