- Timestamp:
- 2021-09-22T14:03:14+12:00 (3 years ago)
- Location:
- main/trunk/model-interfaces-dev/atea/korero-maori-asr/src
- Files:
-
- 4 edited
Legend:
- Unmodified
- Added
- Removed
-
main/trunk/model-interfaces-dev/atea/korero-maori-asr/src/components/AudioTimeBar.vue
r35430 r35450 1 1 <template> 2 2 <div class="root"> 3 <input type="range" class="slider-continuous" v-model.number="sliderValue" :max="audioLength" step="0.01" :disabled="isDisabled" />3 <input type="range" class="slider-continuous" v-model.number="sliderValue" min="0" :max="audioLength" step="0.01" :disabled="isDisabled" /> 4 4 <span>{{ stringSliderValue }}</span> 5 5 </div> … … 28 28 sliderValue: { 29 29 get() { 30 if (this.modelValue < 0 || this.isDisabled) {31 return 0;32 }33 34 30 if (this.modelValue > this.audioLength) { 35 31 return this.audioLength; 36 32 } 37 38 return this.modelValue; 33 else if (this.modelValue < 0) { 34 return 0; 35 } 36 else { 37 return this.modelValue; 38 } 39 39 }, 40 40 set(newValue) { -
main/trunk/model-interfaces-dev/atea/korero-maori-asr/src/components/TranscriptionItemEditor.vue
r35449 r35450 21 21 22 22 <div class="editor-controls"> 23 <audio-time-bar v-model.number="currentPlaybackTime" :audio-length=" playbackState.length" :isDisabled="playbackState.id != transcription.id" />23 <audio-time-bar v-model.number="currentPlaybackTime" :audio-length="audioLength" :isDisabled="playbackState.id != transcription.id" /> 24 24 25 25 <toggle-button v-model="enableEditing" title="Toggle Edit Mode"> … … 129 129 currentPlaybackTime: { 130 130 get() { 131 return this.$store. state.playbackState.currentTime;131 return this.$store.getters.transcriptionPlaybackTime(this.transcription.id); 132 132 }, 133 133 set(value) { 134 this.$store.commit("playbackStateSetCurrentTime", value); 135 } 134 this.$store.commit("playbackStateSetTime", { id: this.transcription.id, time: value }); 135 } 136 }, 137 audioLength() { 138 return this.$store.getters.transcriptionPlaybackLength(this.transcription.id); 136 139 }, 137 140 ...mapState({ … … 169 172 onEditorFocus(index) { 170 173 const wordStartTime = this.words[index].startTime + 0.01; 171 this.$store.commit("playbackStateSet CurrentTime", wordStartTime);174 this.$store.commit("playbackStateSetTime", { id: this.transcription.id, time: wordStartTime }); 172 175 }, 173 176 onEditorFocusOut(index) { -
main/trunk/model-interfaces-dev/atea/korero-maori-asr/src/js/AudioPlaybackModule.js
r35446 r35450 32 32 if (audioElement.currentTime !== lastTime) { 33 33 lastTime = audioElement.currentTime; 34 store.commit("playbackStateSet CurrentTime", lastTime);34 store.commit("playbackStateSetTime", { id: store.state.playbackState.id, time: lastTime }); 35 35 } 36 36 … … 84 84 */ 85 85 static async play(id, startTime = -1) { 86 const playback State = this.store.state.playbackState;86 const playbackTimes = this.store.state.playbackState.playbackTimes; 87 87 88 88 let playbackTime = startTime; 89 if (playback State.id === id&& startTime < 0) {90 playbackTime = playback State.currentTime;89 if (playbackTimes.has(id) && startTime < 0) { 90 playbackTime = playbackTimes.get(id); 91 91 } 92 92 … … 100 100 await this.player.play(); 101 101 102 this.store.commit("playbackStateSetLength", this.player.duration);102 this.store.commit("playbackStateSetLength", { id: id, time: this.player.duration }); 103 103 this.store.commit("playbackStateSetIsPlaying", true); 104 104 } 105 105 106 /** 107 * Pauses playback. 108 */ 106 109 static pause() { 107 110 this.player.pause(); -
main/trunk/model-interfaces-dev/atea/korero-maori-asr/src/main.js
r35446 r35450 42 42 * @param {Number} length The length of the audio track. 43 43 */ 44 constructor(id = "", isPlaying = false, currentTime = 0,length = 0) {44 constructor(id = "", isPlaying = false, length = 0) { 45 45 /** @type {String} The ID of the transcription for which audio is currently being played. */ 46 46 this.id = id; … … 49 49 this.isPlaying = isPlaying; 50 50 51 /** @type { Number} Gets the current time in the playback. */52 this. currentTime = currentTime;51 /** @type {Map<String, Number} The current playback time of each transcription's audio. */ 52 this.playbackTimes = new Map(); 53 53 54 /** @type { Number} Gets the length of the current audio track. */55 this. length = length;54 /** @type {Map<String, Number} The length of each transcription's audio. */ 55 this.playbackLengths = new Map(); 56 56 } 57 57 } … … 101 101 state.playbackState.isPlaying = isPlaying; 102 102 }, 103 playbackStateSet CurrentTime(state, time) {104 state.playbackState. currentTime = time;103 playbackStateSetTime(state, object) { 104 state.playbackState.playbackTimes.set(object.id, object.time); 105 105 }, 106 playbackStateSetLength(state, length) {107 state.playbackState. length = length;106 playbackStateSetLength(state, object) { 107 state.playbackState.playbackLengths.set(object.id, object.time); 108 108 }, 109 109 … … 116 116 const id = TranscriptionViewModel.getId(file); 117 117 return state.rawTranscriptions.has(id); 118 }, 119 transcriptionPlaybackTime: (state) => (id) => { 120 return state.playbackState.playbackTimes.has(id) ? state.playbackState.playbackTimes.get(id) : 0; 121 }, 122 transcriptionPlaybackLength: (state) => (id) => { 123 return state.playbackState.playbackLengths.has(id) ? state.playbackState.playbackLengths.get(id) : 0; 118 124 } 119 125 }
Note:
See TracChangeset
for help on using the changeset viewer.