better UX and UI on the room page

desktop/src/api/rooms/rooms.service.ts

@@ -10,6 +10,15 @@ interface RoomUser {
     userId?: number;
 }
 
+interface SourceContext {
+    animeId: string;
+    episode: string | number;
+    source: string;
+    extension: string;
+    server: string;
+    category: string;
+}
+
 export interface QueueItem {
     uid: string;
     metadata: RoomMetadata;
@@ -23,6 +32,7 @@ interface RoomMetadata {
     episode: number;
     image?: string;
     source?: string;
+    malId?: number;
 }
 
 interface RoomData {
@@ -38,6 +48,7 @@ interface RoomData {
         videoData?: any;
         currentTime: number;
         isPlaying: boolean;
+        context?: SourceContext;
     } | null;
     password?: string;
     metadata?: RoomMetadata | null;
@@ -168,7 +179,10 @@ export function updateRoomVideo(roomId: string, videoData: any): boolean {
     const room = rooms.get(roomId);
     if (!room) return false;
 
-    room.currentVideo = videoData;
+    room.currentVideo = {
+        ...room.currentVideo,
+        ...videoData
+    };
     return true;
 }
 

desktop/src/api/rooms/rooms.websocket.ts

@@ -303,14 +303,34 @@ function handleMessage(roomId: string, userId: string, data: any) {
             broadcastToRoom(roomId, {
                 type: 'video_update',
                 video: data.video,
-                metadata: data.metadata // ✅ CLAVE
+                metadata: data.metadata
             });
-
             break;
 
+        case 'queue_add_batch':
+            if (room.host.id !== userId) return;
+
+            if (Array.isArray(data.items)) {
+                // Añadimos el índice (i) al forEach
+                data.items.forEach((item: any, i: number) => {
+                    const newItem = {
+                        // Añadimos el índice '_${i}' al UID para garantizar unicidad en milisegundos
+                        uid: `q_${Date.now()}_${i}_${Math.random().toString(36).substr(2, 5)}`,
+                        metadata: item.metadata,
+                        videoData: item.video,
+                        addedBy: room.users.get(userId)?.username || 'Unknown'
+                    };
+                    roomService.addQueueItem(roomId, newItem);
+                });
+
+                broadcastToRoom(roomId, {
+                    type: 'queue_update',
+                    queue: room.queue
+                });
+            }
+            break;
 
         case 'sync':
-            // Solo el host puede hacer sync
             if (room.host.id !== userId) return;
 
             if (room.currentVideo) {

desktop/src/scripts/anime/player.js

@@ -78,13 +78,11 @@ const AnimePlayer = (function() {
         initElements();
         setupEventListeners();
 
-        // In Room Mode, we show the player immediately and hide extra controls
         if (_roomMode) {
             if(els.playerWrapper) {
                 els.playerWrapper.style.display = 'block';
                 els.playerWrapper.classList.add('room-mode');
             }
-            // Hide extension list loading in room mode
         } else {
             loadExtensionsList();
         }
@@ -128,10 +126,8 @@ const AnimePlayer = (function() {
         els.progressBuffer = document.querySelector('.progress-buffer');
         els.progressHandle = document.querySelector('.progress-handle');
 
-        // Subtitles canvas
         els.subtitlesCanvas = document.getElementById('subtitles-canvas');
 
-        // Create skip button if not exists
         if (!document.getElementById('skip-overlay-btn')) {
             const btn = document.createElement('button');
             btn.id = 'skip-overlay-btn';
@@ -143,13 +139,11 @@ const AnimePlayer = (function() {
     }
 
     function setupEventListeners() {
-        // Close player
         if(!_roomMode) {
             const closeBtn = document.getElementById('close-player-btn');
             if(closeBtn) closeBtn.addEventListener('click', closePlayer);
         }
 
-        // Episode navigation
         if(els.prevBtn) els.prevBtn.onclick = () => playEpisode(_currentEpisode - 1);
         if(els.nextBtn) els.nextBtn.onclick = () => playEpisode(_currentEpisode + 1);
 
@@ -203,6 +197,15 @@ const AnimePlayer = (function() {
             return;
         }
 
+        if (videoData.malId) _malId = videoData.malId;
+        if (videoData.episode) _currentEpisode = parseInt(videoData.episode);
+
+        _skipIntervals = [];
+        if (els.progressContainer) {
+            els.progressContainer.querySelectorAll('.skip-range, .skip-cut').forEach(e => e.remove());
+        }
+        if (_skipBtn) _skipBtn.classList.remove('visible');
+
         _currentSubtitles = videoData.subtitles || [];
 
         if (els.loader) els.loader.style.display = 'none';

desktop/src/scripts/room-modal.js

@@ -118,7 +118,7 @@ class CreateRoomModal {
 
             this.close();
 
-            window.open(`/room?id=${data.room.id}`, '_blank', 'noopener,noreferrer');
+            window.location.href = `/room?id=${data.room.id}`
         } catch (err) {
             alert(err.message);
         } finally {