diff --git a/packages/apps/client/src/components/CurrentRundown/CurrentRundown.tsx b/packages/apps/client/src/components/CurrentRundown/CurrentRundown.tsx
index bddf8a0..9710f54 100644
--- a/packages/apps/client/src/components/CurrentRundown/CurrentRundown.tsx
+++ b/packages/apps/client/src/components/CurrentRundown/CurrentRundown.tsx
@@ -3,7 +3,7 @@ import { action } from 'mobx'
import { observer } from 'mobx-react-lite'
import { RootAppStore } from 'src/stores/RootAppStore'
import { Segment } from './Segment'
-import { Button } from 'react-bootstrap'
+import { Button, ButtonGroup, ToggleButton } from 'react-bootstrap'
import classes from './CurrentRundown.module.scss'
import { useNavigate } from 'react-router-dom'
import { SystemStatusAlertBars } from 'src/components/SystemStatusAlertBars/SystemStatusAlertBars'
@@ -86,6 +86,18 @@ const CurrentRundown = observer((): React.JSX.Element => {
[segmentLineListEl]
)
+ const onShowOnlyLinesWithScriptToggle = () => {
+ if (!openRundown) return
+ const oldState = openRundown.filter ?? null
+
+ if (oldState === null) {
+ openRundown.setFilter('onlyScript')
+ return
+ }
+
+ openRundown.setFilter(null)
+ }
+
if (!openRundown) {
return
No open rundown
}
@@ -93,17 +105,29 @@ const CurrentRundown = observer((): React.JSX.Element => {
return (
<>
{openRundown.name}
-
+
-
+
+
+ Show only Lines with script
+
+
+
- {openRundown.segmentsInOrder.map((segment) => (
+ {openRundown.segmentsInOrderFiltered.map((segment) => (
))}
diff --git a/packages/apps/client/src/components/CurrentRundown/Segment.tsx b/packages/apps/client/src/components/CurrentRundown/Segment.tsx
index 5264644..db6daec 100644
--- a/packages/apps/client/src/components/CurrentRundown/Segment.tsx
+++ b/packages/apps/client/src/components/CurrentRundown/Segment.tsx
@@ -9,6 +9,8 @@ import { UILineId } from 'src/model/UILine'
const Segment = observer(({ segment }: { segment: UISegment }): React.JSX.Element | null => {
if (!segment) return null
+ const isRundownFilterEnabled = (RootAppStore.rundownStore.openRundown?.filter ?? null) !== null
+
function isSelected(lineId: UILineId) {
return lineId === RootAppStore.uiStore.selectedLineId
}
@@ -18,13 +20,17 @@ const Segment = observer(({ segment }: { segment: UISegment }): React.JSX.Elemen
RootAppStore.uiStore.setSelectedLineId(lineId)
}
+ const filteredLines = segment.linesInOrderFiltered
+
+ if (filteredLines.length === 0 && isRundownFilterEnabled) return null
+
return (
{segment.name}
- {segment.linesInOrder.map((line) => (
+ {filteredLines.map((line) => (
))}
diff --git a/packages/apps/client/src/hooks/useKeepRundownOutputInPosition.ts b/packages/apps/client/src/hooks/useKeepRundownOutputInPosition.ts
index 83f9237..9a12dfe 100644
--- a/packages/apps/client/src/hooks/useKeepRundownOutputInPosition.ts
+++ b/packages/apps/client/src/hooks/useKeepRundownOutputInPosition.ts
@@ -52,7 +52,7 @@ export function useKeepRundownOutputInPosition(
const els = getAllAnchorElements()
const [anchorOffset, anchorEl] = findClosestElement(els, focusPosition, positionRef.current)
- console.log('Chosen anchor is: ', anchorOffset, anchorEl, 'position is: ', positionRef.current)
+ // console.log('Chosen anchor is: ', anchorOffset, anchorEl, 'position is: ', positionRef.current)
const beforeTime = Number(document.timeline.currentTime)
@@ -74,7 +74,7 @@ export function useKeepRundownOutputInPosition(
behavior: 'instant',
})
- console.log('Position now is: ', positionRef.current, diff)
+ // console.log('Position now is: ', positionRef.current, diff)
onUpdate?.({
element: anchorEl,
@@ -94,8 +94,13 @@ function observeUIRundown(rundown: UIRundown | null, clb: Lambda): Lambda {
const destructors: Lambda[] = []
destructors.push(
- observe(rundown, () => {
- // console.log('rundown', change)
+ observe(rundown, 'name', (change) => {
+ // console.log('rundown:name', change)
+
+ clb()
+ }),
+ observe(rundown, 'ready', (change) => {
+ // console.log('rundown:ready', change)
clb()
})
@@ -134,7 +139,7 @@ function observeUISegment(segment: UISegment | null, clb: Lambda): Lambda {
const destructors: Lambda[] = []
destructors.push(
- observe(segment, () => {
+ observe(segment, (change) => {
// console.log('segment', change)
clb()
@@ -175,22 +180,22 @@ function observeUILine(line: UILine | null, clb: Lambda): Lambda {
destructors.push(
observe(line, 'identifier', () => {
- // console.log('line:identifier', change)
+ // console.log('line:identifier')
clb()
}),
observe(line, 'slug', () => {
- // console.log('line:slug', change)
+ // console.log('line:slug')
clb()
}),
observe(line, 'rank', () => {
- // console.log('line:rank', change)
+ // console.log('line:rank')
clb()
}),
observe(line, 'script', () => {
- // console.log('line:script', change)
+ // console.log('line:script')
clb()
})
diff --git a/packages/apps/client/src/model/UIRundown.ts b/packages/apps/client/src/model/UIRundown.ts
index 9d95ef1..f039922 100644
--- a/packages/apps/client/src/model/UIRundown.ts
+++ b/packages/apps/client/src/model/UIRundown.ts
@@ -14,6 +14,8 @@ import { RundownStore } from '../stores/RundownStore'
export type UIRundownId = RundownPlaylistId
+type UIRundownFilter = 'onlyScript' | null
+
export class UIRundown {
name: string = ''
@@ -23,11 +25,11 @@ export class UIRundown {
private rundowns = observable.map()
+ filter: UIRundownFilter = null
+
constructor(private store: RundownStore, public id: UIRundownId) {
makeAutoObservable(this, {
- updateFromJson: action,
segmentsInOrder: computed,
- close: action,
})
this.init().catch(console.error)
}
@@ -101,10 +103,10 @@ export class UIRundown {
this.store.connection.segment.on('created', this.onSegmentCreated)
}
- updateFromJson(json: RundownPlaylist) {
+ updateFromJson = action((json: RundownPlaylist) => {
this.name = json.label
this.ready = true
- }
+ })
get segmentsInOrder(): UISegment[] {
return Array.from(this.segments.values()).sort((a, b) => {
@@ -115,12 +117,20 @@ export class UIRundown {
})
}
- close(): void {
+ get segmentsInOrderFiltered(): UISegment[] {
+ return this.segmentsInOrder
+ }
+
+ setFilter = action((filter: UIRundownFilter) => {
+ this.filter = filter
+ })
+
+ close = action(() => {
this.store.openRundown = null
this.store.connection.rundown.unSubscribeFromRundownsInPlaylist(this.id).catch(console.error)
this.dispose()
- }
+ })
dispose(): void {
// unregister event handlers from services
diff --git a/packages/apps/client/src/model/UISegment.ts b/packages/apps/client/src/model/UISegment.ts
index e057aa9..790947f 100644
--- a/packages/apps/client/src/model/UISegment.ts
+++ b/packages/apps/client/src/model/UISegment.ts
@@ -63,6 +63,22 @@ export class UISegment {
.sort((a, b) => a.rank - b.rank)
}
+ get linesInOrderFiltered(): UILine[] {
+ return Array.from(this.lines.values())
+ .slice()
+ .filter(this.doesLineMatchFilter)
+ .sort((a, b) => a.rank - b.rank)
+ }
+
+ private doesLineMatchFilter = (line: UILine): boolean => {
+ if (this.owner.filter === null) return true
+ if (this.owner.filter === 'onlyScript') {
+ if (line.script === null || line.script.trim() === '') return false
+ return true
+ }
+ return true
+ }
+
private onPartCreated = action('onPartCreated', (json: Part) => {
if (json.segmentId !== this.id) return