groove/audiobookshelf
1
0
Fork 0
mirror of https://github.com/advplyr/audiobookshelf.git synced 2026-07-12 04:11:43 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Show sleep time options in modal when timer is active

Browse source
This commit is contained in:
Greg Lorenzen 2024-07-12 00:31:08 +00:00
parent 549d0770e2
commit 63541ffb73
2 changed files with 6 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

2
client/components/app/MediaPlayerContainer.vue
View file

@ -57,7 +57,7 @@
<modals-bookmarks-modal v-model="showBookmarksModal" :bookmarks="bookmarks" :current-time="bookmarkCurrentTime" :library-item-id="libraryItemId" @select="selectBookmark" /> <modals-bookmarks-modal v-model="showBookmarksModal" :bookmarks="bookmarks" :current-time="bookmarkCurrentTime" :library-item-id="libraryItemId" @select="selectBookmark" />
<modals-sleep-timer-modal v-model="showSleepTimerModal" :timer-set="sleepTimerSet" :timer-time="sleepTimerTime" :remaining="sleepTimerRemaining" @set="setSleepTimer" @cancel="cancelSleepTimer" @increment="incrementSleepTimer" @decrement="decrementSleepTimer" /> <modals-sleep-timer-modal v-model="showSleepTimerModal" :timer-set="sleepTimerSet" :timer-time="sleepTimerTime" :timer-type="sleepTimerType" :remaining="sleepTimerRemaining" @set="setSleepTimer" @cancel="cancelSleepTimer" @increment="incrementSleepTimer" @decrement="decrementSleepTimer" />
<modals-player-queue-items-modal v-model="showPlayerQueueItemsModal" :library-item-id="libraryItemId" /> <modals-player-queue-items-modal v-model="showPlayerQueueItemsModal" :library-item-id="libraryItemId" />
</div> </div>

9
client/components/modals/SleepTimerModal.vue
View file

@ -7,7 +7,7 @@
</template> </template>
<div ref="container" class="w-full rounded-lg bg-primary box-shadow-md overflow-y-auto overflow-x-hidden" style="max-height: 80vh"> <div ref="container" class="w-full rounded-lg bg-primary box-shadow-md overflow-y-auto overflow-x-hidden" style="max-height: 80vh">
<div v-if="!timerSet" class="w-full"> <div class="w-full">
<template v-for="time in sleepTimes"> <template v-for="time in sleepTimes">
<div :key="time.text" class="flex items-center px-6 py-3 justify-center cursor-pointer hover:bg-bg relative" @click="setTime(time)"> <div :key="time.text" class="flex items-center px-6 py-3 justify-center cursor-pointer hover:bg-bg relative" @click="setTime(time)">
<p class="text-xl text-center">{{ time.text }}</p> <p class="text-xl text-center">{{ time.text }}</p>
@ -18,8 +18,8 @@
<ui-btn color="success" type="submit" :padding-x="0" class="h-9 w-12 flex items-center justify-center ml-1">Set</ui-btn> <ui-btn color="success" type="submit" :padding-x="0" class="h-9 w-12 flex items-center justify-center ml-1">Set</ui-btn>
</form> </form>
</div> </div>
<div v-else class="w-full p-4"> <div class="w-full p-4">
<div class="mb-4 flex items-center justify-center"> <div v-if="timerType === this.$constants.SleepTimerTypes.COUNTDOWN" class="mb-4 flex items-center justify-center">
<ui-btn :padding-x="2" small :disabled="remaining < 30 * 60" class="flex items-center mr-4" @click="decrement(30 * 60)"> <ui-btn :padding-x="2" small :disabled="remaining < 30 * 60" class="flex items-center mr-4" @click="decrement(30 * 60)">
<span class="material-symbols text-lg">remove</span> <span class="material-symbols text-lg">remove</span>
<span class="pl-1 text-base font-mono">30m</span> <span class="pl-1 text-base font-mono">30m</span>
@ -36,7 +36,7 @@
<span class="pl-1 text-base font-mono">30m</span> <span class="pl-1 text-base font-mono">30m</span>
</ui-btn> </ui-btn>
</div> </div>
<ui-btn class="w-full" @click="$emit('cancel')">{{ $strings.ButtonCancel }}</ui-btn> <ui-btn v-if="timerSet" class="w-full" @click="$emit('cancel')">{{ $strings.ButtonCancel }}</ui-btn>
</div> </div>
</div> </div>
</modals-modal> </modals-modal>
@ -48,6 +48,7 @@ export default {
value: Boolean, value: Boolean,
timerSet: Boolean, timerSet: Boolean,
timerTime: Number, timerTime: Number,
timerType: String,
remaining: Number, remaining: Number,
currentChapter: Object currentChapter: Object
}, },