mirror of
https://github.com/khoaliber/khoj.git
synced 2026-03-07 21:29:13 +00:00
Send audio message in 2-clicks on desktop to avoid holding down mic button
This commit is contained in:
@@ -749,14 +749,14 @@
|
|||||||
};
|
};
|
||||||
|
|
||||||
// Toggle recording
|
// Toggle recording
|
||||||
if (!mediaRecorder || mediaRecorder.state === 'inactive') {
|
if (!mediaRecorder || mediaRecorder.state === 'inactive' || event.type === 'touchstart') {
|
||||||
navigator.mediaDevices
|
navigator.mediaDevices
|
||||||
.getUserMedia({ audio: true })
|
?.getUserMedia({ audio: true })
|
||||||
.then(handleRecording)
|
.then(handleRecording)
|
||||||
.catch((e) => {
|
.catch((e) => {
|
||||||
flashStatusInChatInput("⛔️ Failed to access microphone");
|
flashStatusInChatInput("⛔️ Failed to access microphone");
|
||||||
});
|
});
|
||||||
} else if (mediaRecorder.state === 'recording') {
|
} else if (mediaRecorder.state === 'recording' || event.type === 'touchend' || event.type === 'touchcancel') {
|
||||||
mediaRecorder.stop();
|
mediaRecorder.stop();
|
||||||
mediaRecorder.stream.getTracks().forEach(track => track.stop());
|
mediaRecorder.stream.getTracks().forEach(track => track.stop());
|
||||||
mediaRecorder = null;
|
mediaRecorder = null;
|
||||||
@@ -815,7 +815,7 @@
|
|||||||
</button>
|
</button>
|
||||||
<textarea id="chat-input" class="option" oninput="onChatInput()" onkeydown=incrementalChat(event) autofocus="autofocus" placeholder="Message"></textarea>
|
<textarea id="chat-input" class="option" oninput="onChatInput()" onkeydown=incrementalChat(event) autofocus="autofocus" placeholder="Message"></textarea>
|
||||||
<button id="speak-button" class="input-row-button"
|
<button id="speak-button" class="input-row-button"
|
||||||
ontouchstart="speechToText(event)" ontouchend="speechToText(event)" onmousedown="speechToText(event)" onmouseup="speechToText(event)">
|
ontouchstart="speechToText(event)" ontouchend="speechToText(event)" ontouchcancel="speechToText(event)" onmousedown="speechToText(event)">
|
||||||
<svg id="speak-button-img" class="input-row-button-img" alt="Transcribe" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
|
<svg id="speak-button-img" class="input-row-button-img" alt="Transcribe" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
|
||||||
<path d="M3.5 6.5A.5.5 0 0 1 4 7v1a4 4 0 0 0 8 0V7a.5.5 0 0 1 1 0v1a5 5 0 0 1-4.5 4.975V15h3a.5.5 0 0 1 0 1h-7a.5.5 0 0 1 0-1h3v-2.025A5 5 0 0 1 3 8V7a.5.5 0 0 1 .5-.5z"/>
|
<path d="M3.5 6.5A.5.5 0 0 1 4 7v1a4 4 0 0 0 8 0V7a.5.5 0 0 1 1 0v1a5 5 0 0 1-4.5 4.975V15h3a.5.5 0 0 1 0 1h-7a.5.5 0 0 1 0-1h3v-2.025A5 5 0 0 1 3 8V7a.5.5 0 0 1 .5-.5z"/>
|
||||||
<path d="M10 8a2 2 0 1 1-4 0V3a2 2 0 1 1 4 0v5zM8 0a3 3 0 0 0-3 3v5a3 3 0 0 0 6 0V3a3 3 0 0 0-3-3z"/>
|
<path d="M10 8a2 2 0 1 1-4 0V3a2 2 0 1 1 4 0v5zM8 0a3 3 0 0 0-3 3v5a3 3 0 0 0 6 0V3a3 3 0 0 0-3-3z"/>
|
||||||
|
|||||||
@@ -78,9 +78,9 @@ export class KhojChatModal extends Modal {
|
|||||||
},
|
},
|
||||||
})
|
})
|
||||||
transcribe.addEventListener('mousedown', async (event) => { await this.speechToText(event) });
|
transcribe.addEventListener('mousedown', async (event) => { await this.speechToText(event) });
|
||||||
transcribe.addEventListener('mouseup', async (event) => { await this.speechToText(event) });
|
|
||||||
transcribe.addEventListener('touchstart', async (event) => { await this.speechToText(event) });
|
transcribe.addEventListener('touchstart', async (event) => { await this.speechToText(event) });
|
||||||
transcribe.addEventListener('touchend', async (event) => { await this.speechToText(event) });
|
transcribe.addEventListener('touchend', async (event) => { await this.speechToText(event) });
|
||||||
|
transcribe.addEventListener('touchcancel', async (event) => { await this.speechToText(event) });
|
||||||
setIcon(transcribe, "mic");
|
setIcon(transcribe, "mic");
|
||||||
|
|
||||||
let send = inputRow.createEl("button", {
|
let send = inputRow.createEl("button", {
|
||||||
@@ -512,14 +512,14 @@ export class KhojChatModal extends Modal {
|
|||||||
};
|
};
|
||||||
|
|
||||||
// Toggle recording
|
// Toggle recording
|
||||||
if (!this.mediaRecorder || this.mediaRecorder.state === 'inactive') {
|
if (!this.mediaRecorder || this.mediaRecorder.state === 'inactive' || event.type === 'touchstart') {
|
||||||
navigator.mediaDevices
|
navigator.mediaDevices
|
||||||
.getUserMedia({ audio: true })
|
.getUserMedia({ audio: true })
|
||||||
.then(handleRecording)
|
?.then(handleRecording)
|
||||||
.catch((e) => {
|
.catch((e) => {
|
||||||
this.flashStatusInChatInput("⛔️ Failed to access microphone");
|
this.flashStatusInChatInput("⛔️ Failed to access microphone");
|
||||||
});
|
});
|
||||||
} else if (this.mediaRecorder.state === 'recording') {
|
} else if (this.mediaRecorder.state === 'recording' || event.type === 'touchend' || event.type === 'touchcancel') {
|
||||||
this.mediaRecorder.stop();
|
this.mediaRecorder.stop();
|
||||||
this.mediaRecorder.stream.getTracks().forEach(track => track.stop());
|
this.mediaRecorder.stream.getTracks().forEach(track => track.stop());
|
||||||
this.mediaRecorder = undefined;
|
this.mediaRecorder = undefined;
|
||||||
|
|||||||
@@ -712,14 +712,14 @@ To get started, just start typing below. You can also type / to see a list of co
|
|||||||
};
|
};
|
||||||
|
|
||||||
// Toggle recording
|
// Toggle recording
|
||||||
if (!mediaRecorder || mediaRecorder.state === 'inactive') {
|
if (!mediaRecorder || mediaRecorder.state === 'inactive' || event.type === 'touchstart') {
|
||||||
navigator.mediaDevices
|
navigator.mediaDevices
|
||||||
.getUserMedia({ audio: true })
|
?.getUserMedia({ audio: true })
|
||||||
.then(handleRecording)
|
.then(handleRecording)
|
||||||
.catch((e) => {
|
.catch((e) => {
|
||||||
flashStatusInChatInput("⛔️ Failed to access microphone");
|
flashStatusInChatInput("⛔️ Failed to access microphone");
|
||||||
});
|
});
|
||||||
} else if (mediaRecorder.state === 'recording') {
|
} else if (mediaRecorder.state === 'recording' || event.type === 'touchend' || event.type === 'touchcancel') {
|
||||||
mediaRecorder.stop();
|
mediaRecorder.stop();
|
||||||
mediaRecorder.stream.getTracks().forEach(track => track.stop());
|
mediaRecorder.stream.getTracks().forEach(track => track.stop());
|
||||||
mediaRecorder = null;
|
mediaRecorder = null;
|
||||||
@@ -770,7 +770,7 @@ To get started, just start typing below. You can also type / to see a list of co
|
|||||||
</button>
|
</button>
|
||||||
<textarea id="chat-input" class="option" oninput="onChatInput()" onkeydown=incrementalChat(event) autofocus="autofocus" placeholder="Message"></textarea>
|
<textarea id="chat-input" class="option" oninput="onChatInput()" onkeydown=incrementalChat(event) autofocus="autofocus" placeholder="Message"></textarea>
|
||||||
<button id="speak-button" class="input-row-button"
|
<button id="speak-button" class="input-row-button"
|
||||||
ontouchstart="speechToText(event)" ontouchend="speechToText(event)" onmousedown="speechToText(event)" onmouseup="speechToText(event)">
|
ontouchstart="speechToText(event)" ontouchend="speechToText(event)" ontouchcancel="speechToText(event)" onmousedown="speechToText(event)">
|
||||||
<svg id="speak-button-img" class="input-row-button-img" alt="Transcribe" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
|
<svg id="speak-button-img" class="input-row-button-img" alt="Transcribe" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
|
||||||
<path d="M3.5 6.5A.5.5 0 0 1 4 7v1a4 4 0 0 0 8 0V7a.5.5 0 0 1 1 0v1a5 5 0 0 1-4.5 4.975V15h3a.5.5 0 0 1 0 1h-7a.5.5 0 0 1 0-1h3v-2.025A5 5 0 0 1 3 8V7a.5.5 0 0 1 .5-.5z"/>
|
<path d="M3.5 6.5A.5.5 0 0 1 4 7v1a4 4 0 0 0 8 0V7a.5.5 0 0 1 1 0v1a5 5 0 0 1-4.5 4.975V15h3a.5.5 0 0 1 0 1h-7a.5.5 0 0 1 0-1h3v-2.025A5 5 0 0 1 3 8V7a.5.5 0 0 1 .5-.5z"/>
|
||||||
<path d="M10 8a2 2 0 1 1-4 0V3a2 2 0 1 1 4 0v5zM8 0a3 3 0 0 0-3 3v5a3 3 0 0 0 6 0V3a3 3 0 0 0-3-3z"/>
|
<path d="M10 8a2 2 0 1 1-4 0V3a2 2 0 1 1 4 0v5zM8 0a3 3 0 0 0-3 3v5a3 3 0 0 0 6 0V3a3 3 0 0 0-3-3z"/>
|
||||||
|
|||||||
Reference in New Issue
Block a user