Spaces:

Starchik1
/

Chat

Sleeping

App Files Files Community

Starchik1 commited on Nov 6, 2025

Commit

7aeb84b

verified ·

1 Parent(s): a37d85e

Update main.py

Browse files

Files changed (1) hide show

main.py +127 -73

main.py CHANGED Viewed

@@ -113,6 +113,7 @@ HTML_TEMPLATE = '''
             margin-top: 10px;
             border-radius: 15px;
             font-size: 14px;
         }
         .messages-container {
@@ -299,12 +300,14 @@ HTML_TEMPLATE = '''
             z-index: 100;
             max-height: 200px;
             overflow-y: auto;
         }
         .user-item {
-            padding: 10px;
             border-bottom: 1px solid #eee;
             cursor: pointer;
         }
         .user-item:last-child {
@@ -314,6 +317,20 @@ HTML_TEMPLATE = '''
         .user-item:active {
             background: #f0f0f0;
         }
     </style>
 </head>
 <body>
@@ -336,6 +353,10 @@ HTML_TEMPLATE = '''
             <h2>💬 Мессенджер</h2>
             <div class="online-users" onclick="toggleUserList()">
                 Онлайн: <span id="onlineCount">0</span> пользователей
             </div>
             <div id="userList" class="user-list"></div>
         </div>
@@ -362,7 +383,7 @@ HTML_TEMPLATE = '''
     <div id="recordingOverlay" class="recording-overlay">
         <div class="recording-animation"></div>
         <h3>Запись голосового сообщения...</h3>
-        <p>Отпустите для отправки</p>
     </div>
     <script src="https://cdn.socket.io/4.5.0/socket.io.min.js"></script>
@@ -377,6 +398,7 @@ HTML_TEMPLATE = '''
         let peerConnection = null;
         let currentCall = null;
         let selectedUser = null;
         // WebRTC configuration
         const rtcConfig = {
@@ -395,11 +417,11 @@ HTML_TEMPLATE = '''
             currentUser = data;
             document.getElementById('loginScreen').style.display = 'none';
             document.getElementById('chatScreen').style.display = 'flex';
-            updateUserList();
         });
         socket.on('user_list_update', (data) => {
             document.getElementById('onlineCount').textContent = data.count;
             updateUserList();
         });
@@ -499,6 +521,12 @@ HTML_TEMPLATE = '''
             container.appendChild(messageDiv);
             container.scrollTop = container.scrollHeight;
         }
         function displayVoiceMessage(data) {
@@ -526,13 +554,25 @@ HTML_TEMPLATE = '''
             const userList = document.getElementById('userList');
             userList.innerHTML = '';
-            Object.values(users).forEach(user => {
-                if (user.username !== currentUser.username) {
                     const userItem = document.createElement('div');
                     userItem.className = 'user-item';
-                    userItem.textContent = user.username;
                     userItem.onclick = () => {
-                        selectedUser = user.username;
                         userList.style.display = 'none';
                     };
                     userList.appendChild(userItem);
@@ -542,6 +582,10 @@ HTML_TEMPLATE = '''
         function toggleUserList() {
             const userList = document.getElementById('userList');
             userList.style.display = userList.style.display === 'block' ? 'none' : 'block';
         }
@@ -617,42 +661,48 @@ HTML_TEMPLATE = '''
         function playVoiceMessage(filename) {
             const audio = new Audio(`/voice/${filename}`);
-            audio.play();
         }
         // WebRTC Functions
         async function createPeerConnection(isCaller) {
-            peerConnection = new RTCPeerConnection(rtcConfig);
-            // Add local stream if available
-            if (localStream) {
-                localStream.getTracks().forEach(track => {
-                    peerConnection.addTrack(track, localStream);
-                });
-            }
-            // Handle incoming tracks
-            peerConnection.ontrack = (event) => {
-                remoteStream = event.streams[0];
-                // Здесь можно добавить отображение удаленного видео
-            };
-            // Handle ICE candidates
-            peerConnection.onicecandidate = (event) => {
-                if (event.candidate) {
-                    socket.emit('webrtc_ice_candidate', {
-                        candidate: event.candidate,
-                        to_user: selectedUser || Object.values(users).find(u => u.username !== currentUser.username)?.username
                     });
                 }
-            };
-            return peerConnection;
         }
         async function startAudioCall() {
             if (!selectedUser) {
-                alert('Выберите пользователя из списка онлайн');
                 toggleUserList();
                 return;
             }
@@ -661,7 +711,7 @@ HTML_TEMPLATE = '''
         async function startVideoCall() {
             if (!selectedUser) {
-                alert('Выберите пользователя из списка онлайн');
                 toggleUserList();
                 return;
             }
@@ -677,8 +727,7 @@ HTML_TEMPLATE = '''
                     audio: true,
                     video: isVideo ? {
                         width: { ideal: 1280 },
-                        height: { ideal: 720 },
-                        frameRate: { ideal: 30 }
                     } : false
                 };
@@ -694,9 +743,11 @@ HTML_TEMPLATE = '''
                     socket.emit('webrtc_offer', {
                         offer: offer,
-                        to_user: targetUser
                     });
                     socket.emit('call_request', {
                         call_id: Date.now().toString(),
                         from_user: currentUser.username,
@@ -727,40 +778,26 @@ HTML_TEMPLATE = '''
             currentCall = null;
         }
-        function toggleMute() {
-            if (localStream) {
-                const audioTrack = localStream.getAudioTracks()[0];
-                if (audioTrack) {
-                    audioTrack.enabled = !audioTrack.enabled;
-                }
-            }
-        }
-        function toggleVideo() {
-            if (localStream) {
-                const videoTrack = localStream.getVideoTracks()[0];
-                if (videoTrack) {
-                    videoTrack.enabled = !videoTrack.enabled;
-                }
-            }
-        }
         // Touch events for voice recording
         let recordingTimer;
-        document.querySelector('.action-btn[title="Голосовое сообщение"]').addEventListener('touchstart', function(e) {
-            e.preventDefault();
-            recordingTimer = setTimeout(() => {
-                startRecording();
-            }, 500);
-        });
-        document.querySelector('.action-btn[title="Голосовое сообщение"]').addEventListener('touchend', function(e) {
-            e.preventDefault();
-            clearTimeout(recordingTimer);
-            if (isRecording) {
-                stopRecording();
-            }
-        });
         // Click on recording overlay to stop
         document.getElementById('recordingOverlay').addEventListener('click', stopRecording);
@@ -778,12 +815,17 @@ HTML_TEMPLATE = '''
             }
         });
-        // Prevent context menu on buttons
-        document.addEventListener('contextmenu', (e) => {
-            if (e.target.tagName === 'BUTTON') {
-                e.preventDefault();
             }
         });
     </script>
 </body>
 </html>
@@ -796,6 +838,11 @@ def index():
 @socketio.on('connect')
 def handle_connect():
     print(f'Client connected: {request.sid}')
 @socketio.on('disconnect')
 def handle_disconnect():
@@ -803,7 +850,11 @@ def handle_disconnect():
         if user_data.get('sid') == request.sid:
             del users[user_id]
             break
-    emit('user_list_update', {'count': len(users)}, broadcast=True)
 @socketio.on('register')
 def handle_register(username):
@@ -819,7 +870,10 @@ def handle_register(username):
         'username': username
     })
-    emit('user_list_update', {'count': len(users)}, broadcast=True)
 @socketio.on('message')
 def handle_message(data):
@@ -883,7 +937,7 @@ def handle_call_answer(data):
     if target_sid:
         emit('call_answered', {
             'answer': data['answer'],
-            'from_user': data.get('from_user'),
             'isVideo': data.get('isVideo', False)
         }, room=target_sid)

             margin-top: 10px;
             border-radius: 15px;
             font-size: 14px;
+            cursor: pointer;
         }
         .messages-container {
             z-index: 100;
             max-height: 200px;
             overflow-y: auto;
+            box-shadow: 0 4px 12px rgba(0,0,0,0.1);
         }
         .user-item {
+            padding: 12px 15px;
             border-bottom: 1px solid #eee;
             cursor: pointer;
+            color: #333;
         }
         .user-item:last-child {
         .user-item:active {
             background: #f0f0f0;
         }
+        .selected-user {
+            margin-top: 10px;
+            font-size: 14px;
+            background: rgba(255,255,255,0.3);
+            padding: 8px 12px;
+            border-radius: 15px;
+        }
+        .call-info {
+            margin-top: 5px;
+            font-size: 12px;
+            opacity: 0.9;
+        }
     </style>
 </head>
 <body>
             <h2>💬 Мессенджер</h2>
             <div class="online-users" onclick="toggleUserList()">
                 Онлайн: <span id="onlineCount">0</span> пользователей
+                <div class="call-info">Нажмите для выбора</div>
+            </div>
+            <div id="selectedUserInfo" class="selected-user" style="display: none;">
+                Выбрано: <span id="selectedUserName">-</span>
             </div>
             <div id="userList" class="user-list"></div>
         </div>
     <div id="recordingOverlay" class="recording-overlay">
         <div class="recording-animation"></div>
         <h3>Запись голосового сообщения...</h3>
+        <p>Нажмите для остановки</p>
     </div>
     <script src="https://cdn.socket.io/4.5.0/socket.io.min.js"></script>
         let peerConnection = null;
         let currentCall = null;
         let selectedUser = null;
+        let onlineUsers = [];
         // WebRTC configuration
         const rtcConfig = {
             currentUser = data;
             document.getElementById('loginScreen').style.display = 'none';
             document.getElementById('chatScreen').style.display = 'flex';
         });
         socket.on('user_list_update', (data) => {
             document.getElementById('onlineCount').textContent = data.count;
+            onlineUsers = data.users || [];
             updateUserList();
         });
             container.appendChild(messageDiv);
             container.scrollTop = container.scrollHeight;
+            // Убираем placeholder если есть сообщения
+            const placeholder = container.querySelector('div[style*="text-align: center"]');
+            if (placeholder) {
+                placeholder.remove();
+            }
         }
         function displayVoiceMessage(data) {
             const userList = document.getElementById('userList');
             userList.innerHTML = '';
+            if (onlineUsers.length === 0) {
+                const emptyItem = document.createElement('div');
+                emptyItem.className = 'user-item';
+                emptyItem.textContent = 'Нет других пользователей онлайн';
+                emptyItem.style.color = '#999';
+                emptyItem.style.cursor = 'default';
+                userList.appendChild(emptyItem);
+                return;
+            }
+            onlineUsers.forEach(user => {
+                if (user !== currentUser.username) {
                     const userItem = document.createElement('div');
                     userItem.className = 'user-item';
+                    userItem.textContent = user;
                     userItem.onclick = () => {
+                        selectedUser = user;
+                        document.getElementById('selectedUserName').textContent = user;
+                        document.getElementById('selectedUserInfo').style.display = 'block';
                         userList.style.display = 'none';
                     };
                     userList.appendChild(userItem);
         function toggleUserList() {
             const userList = document.getElementById('userList');
+            if (onlineUsers.length <= 1) {
+                alert('Нет других пользователей онлайн');
+                return;
+            }
             userList.style.display = userList.style.display === 'block' ? 'none' : 'block';
         }
         function playVoiceMessage(filename) {
             const audio = new Audio(`/voice/${filename}`);
+            audio.play().catch(e => console.error('Error playing audio:', e));
         }
         // WebRTC Functions
         async function createPeerConnection(isCaller) {
+            try {
+                peerConnection = new RTCPeerConnection(rtcConfig);
+                // Add local stream if available
+                if (localStream) {
+                    localStream.getTracks().forEach(track => {
+                        peerConnection.addTrack(track, localStream);
                     });
                 }
+                // Handle incoming tracks
+                peerConnection.ontrack = (event) => {
+                    remoteStream = event.streams[0];
+                    // Можно добавить отображение удаленного видео
+                    console.log('Remote track received');
+                };
+                // Handle ICE candidates
+                peerConnection.onicecandidate = (event) => {
+                    if (event.candidate && selectedUser) {
+                        socket.emit('webrtc_ice_candidate', {
+                            candidate: event.candidate,
+                            to_user: selectedUser
+                        });
+                    }
+                };
+                return peerConnection;
+            } catch (error) {
+                console.error('Error creating peer connection:', error);
+                throw error;
+            }
         }
         async function startAudioCall() {
             if (!selectedUser) {
+                alert('Сначала выберите пользователя из списка онлайн (нажмите на "Онлайн: X пользователей")');
                 toggleUserList();
                 return;
             }
         async function startVideoCall() {
             if (!selectedUser) {
+                alert('Сначала выберите пользователя из списка онлайн (нажмите на "Онлайн: X пользователей")');
                 toggleUserList();
                 return;
             }
                     audio: true,
                     video: isVideo ? {
                         width: { ideal: 1280 },
+                        height: { ideal: 720 }
                     } : false
                 };
                     socket.emit('webrtc_offer', {
                         offer: offer,
+                        to_user: targetUser,
+                        isVideo: isVideo
                     });
+                    // Send call request
                     socket.emit('call_request', {
                         call_id: Date.now().toString(),
                         from_user: currentUser.username,
             currentCall = null;
         }
         // Touch events for voice recording
         let recordingTimer;
+        const voiceBtn = document.querySelector('.action-btn[title="Голосовое сообщение"]');
+        if (voiceBtn) {
+            voiceBtn.addEventListener('touchstart', function(e) {
+                e.preventDefault();
+                recordingTimer = setTimeout(() => {
+                    startRecording();
+                }, 500);
+            });
+            voiceBtn.addEventListener('touchend', function(e) {
+                e.preventDefault();
+                clearTimeout(recordingTimer);
+                if (isRecording) {
+                    stopRecording();
+                }
+            });
+        }
         // Click on recording overlay to stop
         document.getElementById('recordingOverlay').addEventListener('click', stopRecording);
             }
         });
+        // Close user list when clicking outside
+        document.addEventListener('click', (e) => {
+            if (!e.target.closest('.online-users') && !e.target.closest('.user-list')) {
+                document.getElementById('userList').style.display = 'none';
             }
         });
+        // Initialize
+        window.onload = function() {
+            onlineUsers = [];
+        };
     </script>
 </body>
 </html>
 @socketio.on('connect')
 def handle_connect():
     print(f'Client connected: {request.sid}')
+    # Send current user list to the newly connected client
+    emit('user_list_update', {
+        'count': len(users),
+        'users': [user_data['username'] for user_data in users.values()]
+    })
 @socketio.on('disconnect')
 def handle_disconnect():
         if user_data.get('sid') == request.sid:
             del users[user_id]
             break
+    emit('user_list_update', {
+        'count': len(users),
+        'users': [user_data['username'] for user_data in users.values()]
+    }, broadcast=True)
 @socketio.on('register')
 def handle_register(username):
         'username': username
     })
+    emit('user_list_update', {
+        'count': len(users),
+        'users': [user_data['username'] for user_data in users.values()]
+    }, broadcast=True)
 @socketio.on('message')
 def handle_message(data):
     if target_sid:
         emit('call_answered', {
             'answer': data['answer'],
+            'from_user': data.get('from_user', current_user),
             'isVideo': data.get('isVideo', False)
         }, room=target_sid)