You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

39 lines
1.0 KiB

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>Live Typing Speaker View</title>
  7. <style>
  8. body {
  9. font-family: Futura, sans-serif;
  10. font-size: 32px;
  11. padding: 20px;
  12. }
  13. #typingArea {
  14. width: 100%;
  15. height: 200px;
  16. font-size: 32px;
  17. padding: 10px;
  18. }
  19. </style>
  20. </head>
  21. <body>
  22. <h1>Live Typing Speaker View</h1>
  23. <textarea id="typingArea" placeholder="Type subtitles here..."></textarea>
  24. <script src="/socket.io/socket.io.js"></script>
  25. <script>
  26. const socket = io();
  27. const typingArea = document.getElementById('typingArea');
  28. // Emit typed text to audience view on keyup event
  29. typingArea.addEventListener('keyup', () => {
  30. const typedText = typingArea.value;
  31. socket.emit('live_typing', typedText); // Send current text to audience
  32. });
  33. </script>
  34. </body>
  35. </html>