diff --git a/client/assets/app.css b/client/assets/app.css
index e6ab6a4d..86004e26 100644
--- a/client/assets/app.css
+++ b/client/assets/app.css
@@ -28,6 +28,10 @@
background: #704922;
}
+.no-scroll::-webkit-scrollbar {
+ display: none;
+ opacity: 0;
+}
.tracksTable {
border-collapse: collapse;
@@ -49,4 +53,12 @@
.tracksTable th {
padding: 4px;
font-size: 0.75rem;
+}
+
+.arrow-down {
+ width: 0;
+ height: 0;
+ border-left: 6px solid transparent;
+ border-right: 6px solid transparent;
+ border-top: 6px solid white;
}
\ No newline at end of file
diff --git a/client/assets/transitions.css b/client/assets/transitions.css
index e8075c02..55e1f73e 100644
--- a/client/assets/transitions.css
+++ b/client/assets/transitions.css
@@ -44,4 +44,18 @@
.menu-enter,
.menu-leave-active {
opacity: 0;
+}
+
+.menux-enter, .menux-leave-active {
+ transform: translateX(15px);
+}
+.menux-enter-active {
+ transition: all 0.2s;
+}
+.menux-leave-active {
+ transition: all 0.1s;
+}
+.menux-enter,
+.menux-leave-active {
+ opacity: 0;
}
\ No newline at end of file
diff --git a/client/components/AudioPlayer.vue b/client/components/AudioPlayer.vue
index 6a2b3e10..94ad32d6 100644
--- a/client/components/AudioPlayer.vue
+++ b/client/components/AudioPlayer.vue
@@ -27,9 +27,7 @@
forward_10
-
- 1x
-
+
@@ -75,6 +73,7 @@ export default {
hlsInstance: null,
staleHlsInstance: null,
volume: 0.5,
+ playbackRate: 1,
trackWidth: 0,
isPaused: true,
url: null,
@@ -126,7 +125,15 @@ export default {
},
updateVolume(volume) {
if (this.audioEl) {
- this.audioEl.volume = 1 - volume
+ this.audioEl.volume = volume
+ }
+ },
+ updatePlaybackRate(playbackRate) {
+ if (this.audioEl) {
+ console.log('UpdatePlaybackRate', playbackRate)
+ this.audioEl.playbackRate = playbackRate
+ } else {
+ console.error('No Audio El updatePlaybackRate')
}
},
mousemoveTrack(e) {
@@ -173,7 +180,6 @@ export default {
setStreamReady() {
this.readyTrackWidth = this.trackWidth
this.$refs.readyTrack.style.width = this.trackWidth + 'px'
- console.warn('SET STREAM READY', this.readyTrackWidth)
},
setChunksReady(chunks, numSegments) {
var largestSeg = 0
@@ -349,6 +355,7 @@ export default {
this.hlsInstance = new Hls(hlsOptions)
var audio = this.$refs.audio
audio.volume = this.volume
+ audio.playbackRate = this.playbackRate
this.hlsInstance.attachMedia(audio)
this.hlsInstance.on(Hls.Events.MEDIA_ATTACHED, () => {
// console.log('[HLS] MEDIA ATTACHED')
@@ -367,13 +374,6 @@ export default {
console.error('[HLS] BUFFER STALLED ERROR')
}
})
- this.hlsInstance.on(Hls.Events.FRAG_LOADED, (e, data) => {
- var frag = data.frag
- // console.log('[HLS] Frag Loaded', frag.sn, this.$secondsToTimestamp(frag.start), frag)
- })
- this.hlsInstance.on(Hls.Events.BUFFER_APPENDED, (e, data) => {
- // console.log('[HLS] BUFFER', data)
- })
this.hlsInstance.on(Hls.Events.DESTROYING, () => {
console.warn('[HLS] Destroying HLS Instance')
})
@@ -425,14 +425,7 @@ export default {
}
-