darken ads to have visual difference
This commit is contained in:
jb-alvarado
parent
e7afc85243
commit
f9d5c31eb3
@ -56,20 +56,21 @@
|
||||
<div
|
||||
v-else
|
||||
class="h-1/3 font-bold text truncate"
|
||||
:title="playlistStore.currentClipTitle || filename(playlistStore.currentClip)"
|
||||
:class="{'text-base-content/60': playlistStore.current.category === 'advertisement'}"
|
||||
:title="playlistStore.current.title || filename(playlistStore.current.source)"
|
||||
>
|
||||
{{
|
||||
playlistStore.currentClipTitle ||
|
||||
filename(playlistStore.currentClip) ||
|
||||
playlistStore.current.title ||
|
||||
filename(playlistStore.current.source) ||
|
||||
t('control.noClip')
|
||||
}}
|
||||
</div>
|
||||
<div class="grow">
|
||||
<strong>{{ t('player.duration') }}:</strong>
|
||||
{{ secToHMS(playlistStore.currentClipDuration) }} |
|
||||
<strong>{{ t('player.in') }}:</strong> {{ secToHMS(playlistStore.currentClipIn) }} |
|
||||
{{ secToHMS(playlistStore.current.duration) }} |
|
||||
<strong>{{ t('player.in') }}:</strong> {{ secToHMS(playlistStore.current.in) }} |
|
||||
<strong>{{ t('player.out') }}:</strong>
|
||||
{{ secToHMS(playlistStore.currentClipOut) }}
|
||||
{{ secToHMS(playlistStore.current.out) }}
|
||||
|
||||
<template v-if="playlistStore.shift !== 0">
|
||||
| <strong>{{ t('player.shift') }}:</strong>
|
||||
@ -176,7 +177,17 @@ const playlistStore = usePlaylist()
|
||||
const { filename, secToHMS } = stringFormatter()
|
||||
const { id } = storeToRefs(useConfig())
|
||||
|
||||
playlistStore.currentClip = t('control.noClip')
|
||||
const currentDefault = {
|
||||
uid: '',
|
||||
title: t('control.noClip'),
|
||||
source: t('control.noClip'),
|
||||
duration: 0,
|
||||
in: 0,
|
||||
out: 0,
|
||||
} as PlaylistItem
|
||||
|
||||
playlistStore.current = currentDefault
|
||||
|
||||
const timeStr = ref('00:00:00')
|
||||
const timer = ref()
|
||||
const errorCounter = ref(0)
|
||||
@ -278,7 +289,7 @@ watch([id], () => {
|
||||
})
|
||||
|
||||
function timeRemaining() {
|
||||
let remaining = playlistStore.currentClipOut - playlistStore.elapsedSec
|
||||
let remaining = playlistStore.current.out - playlistStore.elapsedSec
|
||||
|
||||
if (remaining < 0) {
|
||||
remaining = 0
|
||||
@ -298,13 +309,7 @@ async function clock() {
|
||||
function resetStatus() {
|
||||
playlistStore.elapsedSec = 0
|
||||
playlistStore.shift = 0
|
||||
playlistStore.currentClip = ''
|
||||
playlistStore.ingestRuns = false
|
||||
playlistStore.currentClipDuration = 0
|
||||
playlistStore.currentClipIn = 0
|
||||
playlistStore.currentClipOut = 0
|
||||
playlistStore.playoutIsRunning = false
|
||||
playlistStore.progressValue = 0
|
||||
playlistStore.current = currentDefault
|
||||
}
|
||||
|
||||
async function controlProcess(state: string) {
|
||||
|
||||
@ -76,8 +76,9 @@
|
||||
class="draggable border-t border-b border-base-content/20 duration-1000 transition-all"
|
||||
:class="{
|
||||
'!bg-lime-500/30':
|
||||
playlistStore.playoutIsRunning && listDate === todayDate && index === currentClipIndex,
|
||||
playlistStore.playoutIsRunning && listDate === todayDate && index === currentIndex,
|
||||
'!bg-amber-600/40': element.overtime,
|
||||
'text-base-content/60': element.category === 'advertisement'
|
||||
}"
|
||||
>
|
||||
<td v-if="!configStore.playout.playlist.infinit" class="ps-4 py-2 text-left">
|
||||
@ -139,7 +140,7 @@ const playlistContainer = ref()
|
||||
const sortContainer = ref()
|
||||
const todayDate = ref($dayjs().utcOffset(configStore.utcOffset).format('YYYY-MM-DD'))
|
||||
const { id } = storeToRefs(useConfig())
|
||||
const { currentClipIndex, listDate } = storeToRefs(usePlaylist())
|
||||
const { currentIndex, listDate } = storeToRefs(usePlaylist())
|
||||
|
||||
const playlistSortOptions = {
|
||||
group: 'playlist',
|
||||
@ -214,8 +215,8 @@ async function getPlaylist() {
|
||||
playlistStore.isLoading = false
|
||||
|
||||
if (listDate.value === todayDate.value) {
|
||||
await until(currentClipIndex).toMatch((v) => v > 0, { timeout: 1500 })
|
||||
scrollTo(currentClipIndex.value)
|
||||
await until(currentIndex).toMatch((v) => v > 0, { timeout: 1500 })
|
||||
scrollTo(currentIndex.value)
|
||||
} else {
|
||||
scrollTo(0)
|
||||
}
|
||||
|
||||
@ -15,13 +15,8 @@ export const usePlaylist = defineStore('playlist', {
|
||||
isLoading: true,
|
||||
listDate: dayjs().format('YYYY-MM-DD'),
|
||||
progressValue: 0,
|
||||
currentClip: '',
|
||||
currentClipIndex: 0,
|
||||
currentClipTitle: null as null | string,
|
||||
currentClipStart: 0,
|
||||
currentClipDuration: 0,
|
||||
currentClipIn: 0,
|
||||
currentClipOut: 0,
|
||||
current: {} as PlaylistItem,
|
||||
currentIndex: 0,
|
||||
ingestRuns: false,
|
||||
elapsedSec: 0,
|
||||
shift: 0,
|
||||
@ -81,17 +76,13 @@ export const usePlaylist = defineStore('playlist', {
|
||||
|
||||
setStatus(item: PlayoutStatus) {
|
||||
this.playoutIsRunning = true
|
||||
this.currentClip = item.media.source
|
||||
this.currentClipIn = item.media.in
|
||||
this.currentClipOut = item.media.out
|
||||
this.currentClipDuration = item.media.duration
|
||||
this.currentClipTitle = item.media.title ?? null
|
||||
this.currentClipIndex = item.index
|
||||
this.current = item.media
|
||||
this.currentIndex = item.index
|
||||
this.elapsedSec = item.elapsed
|
||||
this.ingestRuns = item.ingest
|
||||
this.shift = item.shift
|
||||
|
||||
this.progressValue = (this.elapsedSec * 100) / this.currentClipOut
|
||||
this.progressValue = (this.elapsedSec * 100) / this.current.out
|
||||
},
|
||||
},
|
||||
})
|
||||
|
||||
Loading…
Reference in New Issue
Block a user