diff --git a/components/app/AudioPlayer.vue b/components/app/AudioPlayer.vue
index 9c4c8a85..69c1188b 100644
--- a/components/app/AudioPlayer.vue
+++ b/components/app/AudioPlayer.vue
@@ -70,14 +70,20 @@
first_page
-
{{ jumpBackwardsIcon }}
+
+ replay
+ {{ jumpBackwardsLabel }}
+
{{ seekLoading ? 'autorenew' : !isPlaying ? 'play_arrow' : 'pause' }}
-
{{ jumpForwardIcon }}
+
+ forward_media
+ {{ jumpForwardLabel }}
+
last_page
@@ -110,6 +116,7 @@ import { AbsAudioPlayer } from '@/plugins/capacitor'
import { Dialog } from '@capacitor/dialog'
import { FastAverageColor } from 'fast-average-color'
import WrappingMarquee from '@/assets/WrappingMarquee.js'
+import jumpLabelMixin from '@/mixins/jumpLabel'
export default {
props: {
@@ -121,6 +128,7 @@ export default {
sleepTimeRemaining: Number,
serverLibraryItemId: String
},
+ mixins: [jumpLabelMixin],
data() {
return {
windowHeight: 0,
@@ -221,11 +229,11 @@ export default {
return items
},
- jumpForwardIcon() {
- return this.$store.getters['globals/getJumpForwardIcon'](this.jumpForwardTime)
+ jumpForwardLabel() {
+ return this.getJumpLabel(this.jumpForwardTime)
},
- jumpBackwardsIcon() {
- return this.$store.getters['globals/getJumpBackwardsIcon'](this.jumpBackwardsTime)
+ jumpBackwardsLabel() {
+ return this.getJumpLabel(this.jumpBackwardsTime)
},
jumpForwardTime() {
return this.$store.getters['getJumpForwardTime']
@@ -1091,6 +1099,9 @@ export default {
margin: 0px 0px;
font-size: 1.6rem;
}
+#playerControls .jump-label {
+ margin-top: 2px;
+}
#playerControls .play-btn {
transition: all 0.15s cubic-bezier(0.39, 0.575, 0.565, 1);
transition-property: padding, margin, height, width, min-width, min-height;
diff --git a/mixins/jumpLabel.js b/mixins/jumpLabel.js
new file mode 100644
index 00000000..0a026fff
--- /dev/null
+++ b/mixins/jumpLabel.js
@@ -0,0 +1,12 @@
+export default {
+ methods: {
+ getJumpLabel(seconds) {
+ const val = Number(seconds)
+ if (isNaN(val)) return ''
+ const useMinutes = val >= 120 // keep 60s as seconds
+ const key = useMinutes ? 'UnitMinutesShort' : 'UnitSecondsShort'
+ const unitValue = useMinutes ? val / 60 : val
+ return this.$getString(key, [this.$formatNumber(unitValue)])
+ }
+ }
+}
diff --git a/pages/settings.vue b/pages/settings.vue
index 63357548..edc69f0a 100644
--- a/pages/settings.vue
+++ b/pages/settings.vue
@@ -36,24 +36,24 @@
{{ $strings.HeaderPlaybackSettings }}
+
+
{{ $strings.LabelJumpBackwardsTime }}
+
+
+
+
+
+
{{ $strings.LabelJumpForwardsTime }}
+
+
+
+
{{ $strings.LabelDisableAutoRewind }}
-
-
- {{ currentJumpBackwardsTimeIcon }}
-
-
{{ $strings.LabelJumpBackwardsTime }}
-
-
-
- {{ currentJumpForwardTimeIcon }}
-
-
{{ $strings.LabelJumpForwardsTime }}
-
@@ -187,8 +187,10 @@