diff --git a/src/components/molecules/AudioWave.vue b/src/components/molecules/AudioWave.vue index 93dba9c2..61213a4e 100644 --- a/src/components/molecules/AudioWave.vue +++ b/src/components/molecules/AudioWave.vue @@ -31,6 +31,8 @@ import { getStorage, ref, getDownloadURL } from 'firebase/storage' import WaveSurfer from 'wavesurfer.js' import RegionsPlugin from 'wavesurfer.js/dist/plugins/regions.esm.js' +import TimelinePlugin from 'wavesurfer.js/dist/plugins/timeline.esm.js' + // Components @@ -67,6 +69,20 @@ export default { // Regions this.regionsPlugin = RegionsPlugin.create() + + // Timeline + this.timelinePlugin = TimelinePlugin.create({ + height: 12, + timeInterval: 1, + primaryLabelInterval: 10, + secondaryLabelInterval:10, + style: { + fontSize: '10px', + // color: '#6A3274', + } + }) + + // Initialize WaveSurfer this.initWaveSurfer() @@ -83,7 +99,11 @@ export default { cursorColor: '#666', barWidth: 2, barRadius: 3, - plugins: [this.regionsPlugin], + + minPxPerSec: 10, + dragToSeek: true, + + plugins: [this.regionsPlugin,this.timelinePlugin], // cursorWidth: 1, // height: 500, }) diff --git a/src/components/organisms/SentimentTranscriptsList.vue b/src/components/organisms/SentimentTranscriptsList.vue index 0caf141d..e882de03 100644 --- a/src/components/organisms/SentimentTranscriptsList.vue +++ b/src/components/organisms/SentimentTranscriptsList.vue @@ -37,14 +37,14 @@ - + {{ region.start.toFixed(2) }} - {{ region.end.toFixed(2) }} - + - +