Full STT and TTS.

src/snek/static/chat-input.js

@@ -270,6 +270,13 @@ textToLeetAdvanced(text) {
     this.appendChild(this.textarea);
     this.ttsButton = document.createElement("stt-button");
    
+    this.snekSpeaker = document.createElement("snek-speaker");
+    this.appendChild(this.snekSpeaker);
+
+    this.ttsButton.addEventListener("click", (e) => {
+       this.snekSpeaker.enable() 
+    });
+
     this.appendChild(this.ttsButton);
     this.uploadButton = document.createElement("upload-button");
     this.uploadButton.setAttribute("channel", this.channelUid);

src/snek/templates/app.html

@@ -7,8 +7,8 @@
   <title>Snek</title>
   <style>{{highlight_styles}}</style>
   <link rel="stylesheet" href="/file-upload-grid.css">
-  
   <script src="/njet.js" type="module"></script>
+  <script src="/tts.js" type="module"></script>
   <script src="/stt.js" type="module"></script>
   <script src="/file-upload-grid.js" type="module"></script>
   <script src="/polyfills/Promise.withResolvers.js" type="module"></script>

src/snek/templates/web.html

@@ -215,6 +215,7 @@ app.addEventListener("channel-message", (data) => {
         } else if (!isMentionForSomeoneElse(data.message)) {
             if(data.is_final){
                 app.playSound("message");
+                document.querySelector("snek-speaker").speak(data.message);
             }
         }
     }