From cef5d35be71a046df4774fe4a1144419137e3acd Mon Sep 17 00:00:00 2001 From: Ole Date: Sun, 14 Jun 2026 15:26:44 +0200 Subject: [PATCH] Room-Code-Logik raus, QR zeigt wieder volles SDP (STUN-frei). Room-Code/Storage/Polling entfernt, QR-Hauptcode immer sichtbar --- app.js | 23 +----------- index.html | 21 ++--------- p2p.js | 108 +---------------------------------------------------- style.css | 25 ------------- 4 files changed, 8 insertions(+), 169 deletions(-) diff --git a/app.js b/app.js index 43fc7e4..64b61d3 100644 --- a/app.js +++ b/app.js @@ -187,10 +187,6 @@ showQR('qr-host', d); const raw = $('host-qr-raw'); if (raw) raw.textContent = d; - const codeEl = $('host-room-code'); - if (codeEl && mesh.roomCode) codeEl.textContent = mesh.roomCode; - const fullSDP = mesh.getFullSDPData ? mesh.getFullSDPData() : null; - if (fullSDP) showQR('qr-host-full', fullSDP); }; mesh.onreadyupdate = (ready, total) => { $('btn-start-game').disabled = ready < total || total === 0; @@ -268,15 +264,10 @@ let scanned = false; camScan('join-camera', 'join-camera-canvas', (parsed, raw) => { if (scanned) return; - if (!parsed.id) return; + if (!parsed.s || !parsed.id) return; scanned = true; $('join-scan-status').textContent = 'Verbinde...'; - if (parsed.room) { - $('join-room-input').value = parsed.room; - mesh.joinFromRoomCode(parsed.room); - } else if (parsed.s) { - mesh.joinFromQR(raw); - } + mesh.joinFromQR(raw); }); } catch (e) { $('join-scan-status').textContent = 'Kamera nicht verfügbar'; @@ -293,16 +284,6 @@ $('join-scan-status').textContent = 'Verbinde...'; }); - $('btn-join-room').addEventListener('click', () => { - const code = $('join-room-input').value.trim().toUpperCase(); - if (!code) return; - if (!mesh) { show('start'); return; } - camStop(); - $('join-scan-status').textContent = 'Verbinde...'; - $('join-camera').classList.remove('active'); - mesh.joinFromRoomCode(code); - }); - /* ─── Host: start game button (in host screen) ─── */ $('btn-start-game').addEventListener('click', () => { setupGame(false); diff --git a/index.html b/index.html index f851d63..d2c294a 100644 --- a/index.html +++ b/index.html @@ -27,11 +27,10 @@

Scannen lassen, um beizutreten

-
-
- Raum-Code - -

Auf gleichem Rechner: Code in anderem Tab eingeben

+
+ QR-Rohdaten + 

+        

       

       

         
Spieler

@@ -42,19 +41,11 @@
         
         
         

-        

-          QR-Rohdaten
-          

-        

         

           Antwort manuell einfügen
           
           
         

-        

-          Full-SDP-QR (für andere Geräte)
-          

-        

       

       
     
@@ -68,10 +59,6 @@
         
         
         
QR-Code scannen...

-        

-          
-          
-        

         

           QR manuell einfügen
           
diff --git a/p2p.js b/p2p.js
index 646ea6b..0bf55ea 100644
--- a/p2p.js
+++ b/p2p.js
@@ -11,9 +11,6 @@ class MeshNet {
     this.roster = [];
     this.readyPeers = new Set();
     this._meshReadySent = false;
-    this.roomCode = null;
-    this._processedAnswers = new Set();
-    this._answerPollInterval = null;
 
     this.onpeerconnect = null;
     this.onpeerdisconnect = null;
@@ -23,59 +20,11 @@ class MeshNet {
     this.onreadyupdate = null;
   }
 
-  _generateRoomCode() {
-    return Math.random().toString(36).substring(2, 6).toUpperCase();
-  }
-
-  _startAnswerPolling() {
-    this._stopAnswerPolling();
-    this._answerPollInterval = setInterval(() => {
-      if (!this.isHost || !this.roomCode || !this._pendingPeer || this._pendingPeer.signalReceived) return;
-      const prefix = `rp2p_answer_${this.roomCode}_`;
-      for (let i = 0; i < localStorage.length; i++) {
-        const key = localStorage.key(i);
-        if (key && key.startsWith(prefix) && !this._processedAnswers.has(key)) {
-          this._processedAnswers.add(key);
-          try {
-            const raw = localStorage.getItem(key);
-            if (!raw) continue;
-            const data = JSON.parse(raw);
-            this.feedAnswer(JSON.stringify({ v: 1, id: data.id, s: data.s }));
-          } catch (err) {
-            console.error('poll answer error:', err);
-          }
-        }
-      }
-    }, 400);
-  }
-
-  _stopAnswerPolling() {
-    if (this._answerPollInterval) {
-      clearInterval(this._answerPollInterval);
-      this._answerPollInterval = null;
-    }
-  }
-
   /* ─── Host: room ─── */
 
   createRoom() {
     this.isHost = true;
-    this.roomCode = this._generateRoomCode();
-    this._processedAnswers = new Set();
-    this._cleanupStorage();
     this._createPendingPeer();
-    this._startAnswerPolling();
-  }
-
-  _cleanupStorage() {
-    const toRemove = [];
-    for (let i = 0; i < localStorage.length; i++) {
-      const key = localStorage.key(i);
-      if (key && (key.startsWith('rp2p_offer_') || key.startsWith('rp2p_answer_'))) {
-        toRemove.push(key);
-      }
-    }
-    toRemove.forEach(k => localStorage.removeItem(k));
   }
 
   _createPendingPeer() {
@@ -90,15 +39,8 @@ class MeshNet {
       if (signalSent) return;
       signalSent = true;
 
-      const sdpJson = JSON.stringify({ v: 1, id: this.myPeerId, s: signal });
-      this._fullSDPData = sdpJson;
-
-      if (this.roomCode) {
-        localStorage.setItem(`rp2p_offer_${this.roomCode}`, sdpJson);
-        this._currentQRData = JSON.stringify({ v: 1, id: this.myPeerId, room: this.roomCode });
-      } else {
-        this._currentQRData = sdpJson;
-      }
+      this._currentQRData = JSON.stringify({ v: 1, id: this.myPeerId, s: signal });
+      this._fullSDPData = this._currentQRData;
 
       if (this.onqrupdate) this.onqrupdate(this._currentQRData);
     });
@@ -175,51 +117,6 @@ class MeshNet {
     this._pendingPeer = { peer, peerId: remoteId, connected: answerSent };
   }
 
-  joinFromRoomCode(code, _retries = 10) {
-    const key = `rp2p_offer_${code.toUpperCase()}`;
-    const offerStr = localStorage.getItem(key);
-    if (!offerStr) {
-      if (_retries > 0) {
-        setTimeout(() => this.joinFromRoomCode(code, _retries - 1), 500);
-      }
-      return;
-    }
-    const offerData = JSON.parse(offerStr);
-    const remoteId = offerData.id;
-    this.hostPeerId = remoteId;
-    const offer = offerData.s;
-
-    const peer = new SimplePeer({ initiator: false, trickle: false, config: { iceServers: [] } });
-    let answerSent = false;
-
-    peer.on('signal', signal => {
-      if (answerSent) return;
-      answerSent = true;
-      const answerKey = `rp2p_answer_${code.toUpperCase()}_${this.myPeerId}`;
-      localStorage.setItem(answerKey, JSON.stringify({ id: this.myPeerId, s: signal }));
-    });
-
-    peer.on('connect', () => {
-      this.connections.set(remoteId, peer);
-      peer.send(JSON.stringify({ type: 'identity', peerId: this.myPeerId }));
-      if (this.onpeerconnect) this.onpeerconnect(remoteId);
-    });
-
-    peer.on('data', data => {
-      try {
-        const msg = JSON.parse(data.toString());
-        this._handleMessage(msg, peer);
-      } catch (e) { console.error('p2p data error:', e); }
-    });
-
-    peer.on('close', () => this._cleanupPeer(peer));
-    peer.on('error', err => console.error('p2p error:', err));
-
-    peer.signal(offer);
-    this.connections.set(remoteId, peer);
-    this._pendingPeer = { peer, peerId: remoteId, connected: answerSent };
-  }
-
   /* ─── Mesh helpers ─── */
 
   _createSimplePeer(initiator, onSignal, onConnect) {
@@ -451,7 +348,6 @@ class MeshNet {
   }
 
   destroy() {
-    this._stopAnswerPolling();
     for (const peer of this.connections.values()) {
       try { peer.destroy(); } catch (e) {}
     }
diff --git a/style.css b/style.css
index 1bcfcd7..80d98b6 100644
--- a/style.css
+++ b/style.css
@@ -382,30 +382,5 @@ h3 {
   background: var(--bg-hover);
 }
 
-/* Room code (debug mode) */
-.room-code {
-  margin: 16px 0;
-  text-align: center;
-}
-.room-code-label {
-  display: block;
-  font-size: 0.8rem;
-  color: var(--text-dim);
-  margin-bottom: 4px;
-}
-.room-code-value {
-  display: inline-block;
-  font-family: 'Courier New', monospace;
-  font-size: 2.5rem;
-  font-weight: 800;
-  letter-spacing: 6px;
-  color: var(--gold);
-  background: var(--bg-card);
-  border: 2px dashed var(--border);
-  border-radius: var(--radius);
-  padding: 8px 24px;
-  user-select: all;
-}
-
 /* Utility */
 .hidden { display: none !important; }