annotate src/chat.js @ 31:1e7d855afde3

voices
author Franklin Schmidt <fschmidt@gmail.com>
date Sun, 03 Aug 2025 17:05:38 -0600
parents 505185272dd7
children d34d709a7a8e
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
4
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
1 'use strict';
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
2
29
505185272dd7 edit chat
Franklin Schmidt <fschmidt@gmail.com>
parents: 28
diff changeset
3 let chat;
505185272dd7 edit chat
Franklin Schmidt <fschmidt@gmail.com>
parents: 28
diff changeset
4
505185272dd7 edit chat
Franklin Schmidt <fschmidt@gmail.com>
parents: 28
diff changeset
5 function setChat(newChat) {
31
Franklin Schmidt <fschmidt@gmail.com>
parents: 29
diff changeset
6 let audioChanged = chat && chat.voice != newChat.voice;
29
505185272dd7 edit chat
Franklin Schmidt <fschmidt@gmail.com>
parents: 28
diff changeset
7 chat = newChat;
505185272dd7 edit chat
Franklin Schmidt <fschmidt@gmail.com>
parents: 28
diff changeset
8 document.querySelector('[content] [name]').textContent = chat.name;
31
Franklin Schmidt <fschmidt@gmail.com>
parents: 29
diff changeset
9 if(audioChanged) {
Franklin Schmidt <fschmidt@gmail.com>
parents: 29
diff changeset
10 let s = `voice=${chat.voice}&`;
Franklin Schmidt <fschmidt@gmail.com>
parents: 29
diff changeset
11 let audios = document.querySelectorAll('audio[src]');
Franklin Schmidt <fschmidt@gmail.com>
parents: 29
diff changeset
12 for( let audio of audios ) {
Franklin Schmidt <fschmidt@gmail.com>
parents: 29
diff changeset
13 audio.src = audio.src.replace(/voice=[^&]+&/,s);
Franklin Schmidt <fschmidt@gmail.com>
parents: 29
diff changeset
14 }
Franklin Schmidt <fschmidt@gmail.com>
parents: 29
diff changeset
15 }
29
505185272dd7 edit chat
Franklin Schmidt <fschmidt@gmail.com>
parents: 28
diff changeset
16 }
505185272dd7 edit chat
Franklin Schmidt <fschmidt@gmail.com>
parents: 28
diff changeset
17
505185272dd7 edit chat
Franklin Schmidt <fschmidt@gmail.com>
parents: 28
diff changeset
18 function editChat(name) {
505185272dd7 edit chat
Franklin Schmidt <fschmidt@gmail.com>
parents: 28
diff changeset
19 let dialog = document.querySelector('dialog[edit]');
505185272dd7 edit chat
Franklin Schmidt <fschmidt@gmail.com>
parents: 28
diff changeset
20 dialog.querySelector('input[name=name]').value = chat.name;
31
Franklin Schmidt <fschmidt@gmail.com>
parents: 29
diff changeset
21 dialog.querySelector('select[name=voice]').value = chat.voice;
4
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
22 dialog.showModal();
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
23 }
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
24
29
505185272dd7 edit chat
Franklin Schmidt <fschmidt@gmail.com>
parents: 28
diff changeset
25 function saveChat(form) {
505185272dd7 edit chat
Franklin Schmidt <fschmidt@gmail.com>
parents: 28
diff changeset
26 closeModal(form);
505185272dd7 edit chat
Franklin Schmidt <fschmidt@gmail.com>
parents: 28
diff changeset
27 ajaxForm('save_chat.js',form);
4
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
28 }
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
29
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
30 function deleteChat() {
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
31 let dialog = document.querySelector('dialog[delete]');
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
32 dialog.showModal();
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
33 }
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
34
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
35 function doDeleteChat(el) {
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
36 closeModal(el);
29
505185272dd7 edit chat
Franklin Schmidt <fschmidt@gmail.com>
parents: 28
diff changeset
37 ajax(`delete_chat.js?chat=${chat.id}`);
4
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
38 }
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
39
9
Franklin Schmidt <fschmidt@gmail.com>
parents: 6
diff changeset
40 function systemPrompt() {
Franklin Schmidt <fschmidt@gmail.com>
parents: 6
diff changeset
41 let dialog = document.querySelector('dialog[system_prompt]');
Franklin Schmidt <fschmidt@gmail.com>
parents: 6
diff changeset
42 dialog.showModal();
Franklin Schmidt <fschmidt@gmail.com>
parents: 6
diff changeset
43 }
Franklin Schmidt <fschmidt@gmail.com>
parents: 6
diff changeset
44
4
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
45 function showWaitingAiIcon() {
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
46 document.querySelector('[waiting-ai-icon]').style.display = 'block';
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
47 }
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
48
5
a970b7a01a74 start ai
Franklin Schmidt <fschmidt@gmail.com>
parents: 4
diff changeset
49 function hideWaitingAiIcon() {
a970b7a01a74 start ai
Franklin Schmidt <fschmidt@gmail.com>
parents: 4
diff changeset
50 document.querySelector('[waiting-ai-icon]').style.display = 'none';
a970b7a01a74 start ai
Franklin Schmidt <fschmidt@gmail.com>
parents: 4
diff changeset
51 }
a970b7a01a74 start ai
Franklin Schmidt <fschmidt@gmail.com>
parents: 4
diff changeset
52
25
3a80ddafe5a4 courses work
Franklin Schmidt <fschmidt@gmail.com>
parents: 14
diff changeset
53 function playLastMessage() {
3a80ddafe5a4 courses work
Franklin Schmidt <fschmidt@gmail.com>
parents: 14
diff changeset
54 let audios = document.querySelectorAll('audio');
3a80ddafe5a4 courses work
Franklin Schmidt <fschmidt@gmail.com>
parents: 14
diff changeset
55 if( audios.length >= 1 ) {
3a80ddafe5a4 courses work
Franklin Schmidt <fschmidt@gmail.com>
parents: 14
diff changeset
56 let audio = audios[audios.length-1];
3a80ddafe5a4 courses work
Franklin Schmidt <fschmidt@gmail.com>
parents: 14
diff changeset
57 audio.play();
3a80ddafe5a4 courses work
Franklin Schmidt <fschmidt@gmail.com>
parents: 14
diff changeset
58 }
3a80ddafe5a4 courses work
Franklin Schmidt <fschmidt@gmail.com>
parents: 14
diff changeset
59 }
3a80ddafe5a4 courses work
Franklin Schmidt <fschmidt@gmail.com>
parents: 14
diff changeset
60
29
505185272dd7 edit chat
Franklin Schmidt <fschmidt@gmail.com>
parents: 28
diff changeset
61 function handleChatMarkdown() {
31
Franklin Schmidt <fschmidt@gmail.com>
parents: 29
diff changeset
62 handleMarkdown(chat.language_region,chat.voice);
29
505185272dd7 edit chat
Franklin Schmidt <fschmidt@gmail.com>
parents: 28
diff changeset
63 }
505185272dd7 edit chat
Franklin Schmidt <fschmidt@gmail.com>
parents: 28
diff changeset
64
27
176a182c02cf add view_course
Franklin Schmidt <fschmidt@gmail.com>
parents: 25
diff changeset
65 function scrollToEnd() {
176a182c02cf add view_course
Franklin Schmidt <fschmidt@gmail.com>
parents: 25
diff changeset
66 window.scrollTo(0, document.body.scrollHeight);
176a182c02cf add view_course
Franklin Schmidt <fschmidt@gmail.com>
parents: 25
diff changeset
67 }
176a182c02cf add view_course
Franklin Schmidt <fschmidt@gmail.com>
parents: 25
diff changeset
68
5
a970b7a01a74 start ai
Franklin Schmidt <fschmidt@gmail.com>
parents: 4
diff changeset
69 function updateAi(html) {
a970b7a01a74 start ai
Franklin Schmidt <fschmidt@gmail.com>
parents: 4
diff changeset
70 hideWaitingAiIcon();
13
65bd7e245c63 add html
Franklin Schmidt <fschmidt@gmail.com>
parents: 12
diff changeset
71 document.querySelector('div[messages]').insertAdjacentHTML('beforeend',html);
29
505185272dd7 edit chat
Franklin Schmidt <fschmidt@gmail.com>
parents: 28
diff changeset
72 handleChatMarkdown();
5
a970b7a01a74 start ai
Franklin Schmidt <fschmidt@gmail.com>
parents: 4
diff changeset
73 document.querySelector('textarea').focus();
27
176a182c02cf add view_course
Franklin Schmidt <fschmidt@gmail.com>
parents: 25
diff changeset
74 scrollToEnd();
25
3a80ddafe5a4 courses work
Franklin Schmidt <fschmidt@gmail.com>
parents: 14
diff changeset
75 playLastMessage();
5
a970b7a01a74 start ai
Franklin Schmidt <fschmidt@gmail.com>
parents: 4
diff changeset
76 }
a970b7a01a74 start ai
Franklin Schmidt <fschmidt@gmail.com>
parents: 4
diff changeset
77
4
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
78 const isMobile = 'ontouchstart' in window || navigator.maxTouchPoints > 0 || navigator.msMaxTouchPoints > 0;
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
79
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
80 function textareaKey(event) {
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
81 if( event.keyCode===13 && !event.shiftKey && !event.ctrlKey && !isMobile ) {
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
82 event.preventDefault();
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
83 askAi();
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
84 }
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
85 }
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
86
28
99b71a377f2c audio for textarea
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
87 let audio;
99b71a377f2c audio for textarea
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
88
11
003a90ce72d7 minor fix
Franklin Schmidt <fschmidt@gmail.com>
parents: 9
diff changeset
89 function fixTextarea(textarea) {
4
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
90 textarea.style.height = 'initial';
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
91 textarea.style.height = (textarea.scrollHeight+2) + 'px';
14
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
92 textarea.parentNode.scrollIntoViewIfNeeded(false);
28
99b71a377f2c audio for textarea
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
93 if( !audio )
99b71a377f2c audio for textarea
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
94 audio = document.querySelector('div[buttons] audio');
31
Franklin Schmidt <fschmidt@gmail.com>
parents: 29
diff changeset
95 audio.src = `/tts.mp3?lang=${chat.language_region}&voice=${chat.voice}&text=${encodeURIComponent(textarea.value)}`;
4
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
96 }
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
97
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
98 function askAi() {
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
99 let input = document.querySelector('textarea');
29
505185272dd7 edit chat
Franklin Schmidt <fschmidt@gmail.com>
parents: 28
diff changeset
100 let url = `ai_ask.js?chat=${chat.id}&input=${encodeURIComponent(input.value)}`;
4
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
101 ajax(url);
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
102 input.value = '';
11
003a90ce72d7 minor fix
Franklin Schmidt <fschmidt@gmail.com>
parents: 9
diff changeset
103 fixTextarea(input);
4
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
104 showWaitingAiIcon();
b1adec083e44 chat work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
105 }
14
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
106
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
107
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
108 function setText(text) {
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
109 let textarea = document.querySelector('textarea');
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
110 textarea.value = text;
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
111 fixTextarea(textarea);
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
112 }
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
113
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
114 let recorder = null;
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
115 let chunks;
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
116
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
117 function startRecording() {
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
118 chunks = [];
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
119 function record(stream) {
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
120 recorder = new MediaRecorder( stream, { mimeType: 'audio/webm;codecs=opus' } );
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
121 recorder.ondataavailable = function(event) {
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
122 chunks.push(event.data);
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
123 };
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
124 recorder.onstop = function(event) {
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
125 recorder = null;
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
126 let blob = new Blob(chunks, { type: 'audio/webm' });
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
127 let formData = new FormData();
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
128 formData.append('audio', blob, 'recording.webm');
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
129 ajax('stt.js',formData);
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
130 document.querySelector('button[record]').textContent = 'Record';
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
131 };
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
132 recorder.start();
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
133 }
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
134 navigator.mediaDevices.getUserMedia({ audio: { channelCount: 1 } }).then(record);
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
135 document.querySelector('button[record]').textContent = 'Stop Recording';
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
136 }
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
137
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
138 function toggleRecording() {
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
139 if( recorder === null ) {
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
140 startRecording();
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
141 } else {
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
142 recorder.stop();
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
143 }
Franklin Schmidt <fschmidt@gmail.com>
parents: 13
diff changeset
144 }