FEAT: sent live viewers to react to be displayed

This commit is contained in:
white
2025-02-05 12:45:18 +00:00
parent a6bbf696f4
commit 76852152ad
3 changed files with 20 additions and 3 deletions

View File

@@ -61,6 +61,11 @@ const ChatPanel: React.FC<ChatPanelProps> = ({ streamId }) => {
setMessages((prev) => [...prev, data]); setMessages((prev) => [...prev, data]);
}); });
// Handle live viewership
socket.on("status", (data: ChatMessage) => {
console.log("Live viewership: ", data) // returns dictionary {message: message, num_viewers: num_viewers}
})
// Cleanup function // Cleanup function
return () => { return () => {
window.removeEventListener("beforeunload", handleBeforeUnload); window.removeEventListener("beforeunload", handleBeforeUnload);

View File

@@ -25,7 +25,13 @@ def handle_join(data) -> None:
stream_id = data.get("stream_id") stream_id = data.get("stream_id")
if stream_id: if stream_id:
join_room(stream_id) join_room(stream_id)
emit("status", {"message": f"Welcome to the chat, stream_id: {stream_id}"}, room=stream_id) num_viewers = len(list(socketio.server.manager.get_participants("/", stream_id)))
emit("status",
{
"message": f"Welcome to the chat, stream_id: {stream_id}",
"num_viewers": num_viewers
},
room=stream_id)
@socketio.on("leave") @socketio.on("leave")
@@ -36,7 +42,13 @@ def handle_leave(data) -> None:
stream_id = data.get("stream_id") stream_id = data.get("stream_id")
if stream_id: if stream_id:
leave_room(stream_id) leave_room(stream_id)
emit("status", {"message": f"user left room {stream_id}"}, room=stream_id) num_viewers = len(list(socketio.server.manager.get_participants("/", stream_id)))
emit("status",
{
"message": f"Welcome to the chat, stream_id: {stream_id}",
"num_viewers": num_viewers
},
room=stream_id)
@chat_bp.route("/chat/<int:stream_id>") @chat_bp.route("/chat/<int:stream_id>")

View File

@@ -31,7 +31,7 @@ def send_email(username) -> None:
<html> <html>
<head></head> <head></head>
<body> <body>
<b>Thank you for choosing Gander</b> <h1>Thank you for choosing Gander</h1>
<p>Your Gander login code is: {login_code}</p> <p>Your Gander login code is: {login_code}</p>
</body> </body>
</html> </html>