butter/keanu-weblite
3
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

Audio imported: support pause/play and stop playing after send

Browse source
This commit is contained in:
10G Meow 2023-08-20 11:45:57 +03:00
parent d3000e4672
commit d9b4b2dd99
1 changed files with 18 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

21
src/components/VoiceRecorder.vue
View file

@ -25,6 +25,9 @@
<v-btn v-show="state == states.IMPORTED" icon @click.stop="previewAudio">
<v-icon color="white">$vuetify.icons.audio_import_play</v-icon>
</v-btn>
<v-btn v-show="state == states.PLAYING" icon @click.stop="pauseAudio">
<v-icon color="white">pause</v-icon>
</v-btn>
</v-col>
<v-col cols="4" align="center">
<v-btn
@ -37,7 +40,7 @@
<v-icon color="white">stop</v-icon>
</v-btn>
<v-btn
v-else-if="state == states.RECORDED || state == states.IMPORTED"
v-else-if="state == states.RECORDED || state == states.IMPORTED || state == states.PLAYING"
id="btn-send"
class="voice-recorder-btn recorded"
icon
@ -159,7 +162,8 @@ const State = {
RECORDING: "recording",
RECORDED: "recorded",
ERROR: "error",
IMPORTED: "imported"
IMPORTED: "imported",
PLAYING: "playing"
};
import util from "../plugins/utils";
import VoiceRecorderLock from "./VoiceRecorderLock";
@ -253,6 +257,7 @@ export default {
this.state = State.INITIAL;
this.errorMessage = null;
this.recordedFile = null;
this.previewPlayer = null;
this.recordingTime = String.fromCharCode(160);
if (this.usePTT) {
document.addEventListener("mouseup", this.mouseUp, false);
@ -321,6 +326,9 @@ export default {
this.stopRecordTimer();
this.recordingTime = String.fromCharCode(160); // nbsp;
this.$emit("close");
this.previewPlayer = null;
this.recordedFile = null;
this.$refs.audio_import.value = null;
},
mouseUp(ignoredEvent) {
document.removeEventListener("mouseup", this.mouseUp, false);
@ -385,7 +393,7 @@ export default {
});
},
screenLocked() {
if (document.visibilityState === "hidden" && this.state == State.RECORDING) {
if (document.visibilityState === "hidden" && this.state == State.RECORDING) {
this.pauseRecording();
}
},
@ -451,6 +459,8 @@ export default {
},
send() {
this.$emit("file", { file: this.recordedFile });
this.previewPlayer.pause();
this.$refs.audio_import.value = null;
},
getFile(send) {
const duration = Date.now() - this.recordStartedAt;
@ -532,6 +542,7 @@ export default {
},
previewAudio() {
this.state = State.PLAYING;
if (this.recordedFile) {
if (!this.previewPlayer) {
this.previewPlayer = new Audio();
@ -543,6 +554,10 @@ export default {
};
reader.readAsDataURL(this.recordedFile);
}
},
pauseAudio() {
this.state = State.IMPORTED;
this.previewPlayer.pause();
}
},
};