Commit 3b234048 authored by Richard Blechinger's avatar Richard Blechinger
Browse files

Add warning when playlist length and timeslot length do not match

parent 9d07526d
...@@ -72,7 +72,7 @@ ...@@ -72,7 +72,7 @@
This column displays the duration of all playlist entries combined This column displays the duration of all playlist entries combined
--> -->
<template v-slot:cell(duration)="data"> <template v-slot:cell(duration)="data">
{{ durationSum(data) }} {{ playlistDuration(data) }}
</template> </template>
<!-- Column: Last edit <!-- Column: Last edit
...@@ -188,7 +188,7 @@ export default { ...@@ -188,7 +188,7 @@ export default {
this.$refs.editPlaylistsModal.editPlaylist(id) this.$refs.editPlaylistsModal.editPlaylist(id)
}, },
durationSum({ item }) { playlistDuration({ item }) {
const totalDuration = item.entries.reduce((acc, entry) => acc + entry.duration, 0) const totalDuration = item.entries.reduce((acc, entry) => acc + entry.duration, 0)
return this.prettyNanoseconds(totalDuration) return this.prettyNanoseconds(totalDuration)
......
...@@ -40,6 +40,25 @@ ...@@ -40,6 +40,25 @@
</b-button> </b-button>
</template> </template>
<!-- Column: Duration
This column displays the number of entries of the playlist.
-->
<template v-slot:cell(duration)="data">
<span
:class="{'is-mismatched': isMismatchedLength(data) }"
>
{{ playlistDuration(data) }}
<abbr
v-if="isMismatchedLength(data)"
:title="title(data)"
>
(?)
</abbr>
</span>
</template>
<!-- Column: Actions <!-- Column: Actions
This column displays the available buttons for actions the user can This column displays the available buttons for actions the user can
take on this playlist (e.g. editing and deleting). take on this playlist (e.g. editing and deleting).
...@@ -49,7 +68,7 @@ ...@@ -49,7 +68,7 @@
<b-button <b-button
v-if="data.item.id !== timeslot.playlist_id" v-if="data.item.id !== timeslot.playlist_id"
variant="info" variant="info"
@click="choose(data.item.id)" @click="choose(data)"
> >
Take it! Take it!
</b-button> </b-button>
...@@ -96,6 +115,7 @@ export default { ...@@ -96,6 +115,7 @@ export default {
{ key: 'id', label: 'Index' }, { key: 'id', label: 'Index' },
{ key: 'description', label: 'Description' }, { key: 'description', label: 'Description' },
{ key: 'entries', label: 'Entries' }, { key: 'entries', label: 'Entries' },
{ key: 'duration', label: 'Duration' },
{ key: 'actions', label: 'Actions', class: 'text-right' }, { key: 'actions', label: 'Actions', class: 'text-right' },
], ],
} }
...@@ -104,6 +124,15 @@ export default { ...@@ -104,6 +124,15 @@ export default {
computed: { computed: {
loaded () { return this.$store.state.playlists.loaded.playlists }, loaded () { return this.$store.state.playlists.loaded.playlists },
timeslotDuration() {
const { start, end } = this.timeslot
return parseInt(
this.prettyDuration(start, end),
10
)
},
currentPlaylistDescription () { currentPlaylistDescription () {
let description = false let description = false
if (this.timeslot && this.timeslot.playlist_id !== null) { if (this.timeslot && this.timeslot.playlist_id !== null) {
...@@ -131,15 +160,33 @@ export default { ...@@ -131,15 +160,33 @@ export default {
this.$refs.modalPlaylistSelector.show() this.$refs.modalPlaylistSelector.show()
}, },
choose (id) { choose (data) {
let ts = {...this.timeslot} const { item } = data || {}
ts.playlist_id = id const { id } = item || {}
this.$store.dispatch('shows/updateTimeslot', { let confirmed = true
show: this.selectedShow.id,
schedule: this.scheduleId, if (data && this.isMismatchedLength(data)) {
timeslot: ts, confirmed = confirm("The playlist you have selected has a different length than the timeslot. Proceed?")
callback: () => { this.timeslot = this.getTimeslotById(ts.id) } }
})
if (confirmed) {
let ts = {...this.timeslot}
ts.playlist_id = id
this.$store.dispatch('shows/updateTimeslot', {
show: this.selectedShow.id,
schedule: this.scheduleId,
timeslot: ts,
callback: () => { this.timeslot = this.getTimeslotById(ts.id) }
})
}
},
title(data) {
if (this.isMismatchedLength(data)) {
return "Playlist is not the same length as the timeslot"
}
return ""
}, },
playlistToolTip (entries) { playlistToolTip (entries) {
...@@ -150,9 +197,28 @@ export default { ...@@ -150,9 +197,28 @@ export default {
text += '</div>' text += '</div>'
return text return text
}, },
playlistDuration({ item }) {
const totalDuration = item.entries.reduce((acc, entry) => acc + entry.duration, 0);
return this.prettyNanoseconds(totalDuration)
},
isMismatchedLength({ item }) {
const totalDuration = this.calculatePlaylistDuration(item)
const durationInMinutes = this.nanosecondsToMinutes(totalDuration)
return this.timeslotDuration !== durationInMinutes
},
calculatePlaylistDuration(item) {
return item.entries.reduce((acc, entry) => acc + entry.duration, 0)
}
} }
} }
</script> </script>
<style scoped> <style scoped>
.is-mismatched {
color: var(--orange);
}
</style> </style>
...@@ -83,6 +83,9 @@ export default { ...@@ -83,6 +83,9 @@ export default {
var seconds = Math.floor((sec_total - (hours * 3600) - (minutes * 60)) * 10) / 10 var seconds = Math.floor((sec_total - (hours * 3600) - (minutes * 60)) * 10) / 10
return leadingZero(hours) + ':' + leadingZero(minutes) + ':' + leadingZero(seconds) return leadingZero(hours) + ':' + leadingZero(minutes) + ':' + leadingZero(seconds)
} },
nanosecondsToMinutes: function(ns) {
return ns / 1000 / 1000 / 1000 / 60;
},
} }
} }
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment