Skip to content

Commit 0420570

Browse files
anteeekJulusian
authored andcommitted
SOFIE-283 | enable properties editor for invalid parts
1 parent d0a1f40 commit 0420570

2 files changed

Lines changed: 113 additions & 119 deletions

File tree

packages/webui/src/client/styles/rundownView.scss

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1576,7 +1576,7 @@ svg.icon {
15761576
bottom: 0;
15771577
right: 1px;
15781578
z-index: 10;
1579-
pointer-events: all;
1579+
pointer-events: none;
15801580
background-image: repeating-linear-gradient(
15811581
45deg,
15821582
var(--invalid-reason-color-transparent) 0%,

packages/webui/src/client/ui/SegmentTimeline/SegmentContextMenu.tsx

Lines changed: 112 additions & 118 deletions
Original file line numberDiff line numberDiff line change
@@ -179,144 +179,138 @@ export function SegmentContextMenu({
179179
<hr />
180180
</>
181181
)}
182-
{part &&
183-
isPartNext !== undefined &&
184-
isPartOrphaned !== undefined &&
185-
!part.instance.part.invalid &&
186-
timecode !== null && (
187-
<>
188-
<MenuItem
189-
onClick={(e) => onSetNext(part.instance.part, e)}
190-
disabled={!!part.instance.orphaned || !canSetAsNext}
191-
>
192-
<span
193-
dangerouslySetInnerHTML={{
194-
__html: t(`Set part as <strong>Next</strong>`),
195-
}}
196-
></span>
197-
</MenuItem>
198-
{startsAt !== undefined && part && enablePlayFromAnywhere ? (
199-
<>
182+
{part && isPartNext !== undefined && isPartOrphaned !== undefined && timecode !== null && (
183+
<>
184+
<MenuItem
185+
onClick={(e) => onSetNext(part.instance.part, e)}
186+
disabled={!!part.instance.orphaned || !canSetAsNext}
187+
>
188+
<span
189+
dangerouslySetInnerHTML={{
190+
__html: t(`Set part as <strong>Next</strong>`),
191+
}}
192+
></span>
193+
</MenuItem>
194+
{startsAt !== undefined && part && enablePlayFromAnywhere ? (
195+
<>
196+
<MenuItem
197+
onClick={(e) =>
198+
onSetAsNextFromHere(
199+
part.instance,
200+
playlist?.nextPartInfo?.partInstanceId ?? null,
201+
playlist?.currentPartInfo?.partInstanceId ?? null,
202+
e
203+
)
204+
}
205+
disabled={getIsPlayFromHereDisabled()}
206+
>
207+
<span
208+
dangerouslySetInnerHTML={{
209+
__html: t(
210+
`Set part from ${RundownUtils.formatTimeToShortTime(Math.floor(timecode / 1000) * 1000)} as <strong>Next</strong>`
211+
),
212+
}}
213+
></span>
214+
</MenuItem>
215+
<MenuItem
216+
onClick={(e) =>
217+
onSetAsNextFromHere(
218+
part.instance,
219+
playlist?.nextPartInfo?.partInstanceId ?? null,
220+
playlist?.currentPartInfo?.partInstanceId ?? null,
221+
e,
222+
true
223+
)
224+
}
225+
disabled={getIsPlayFromHereDisabled(true)}
226+
>
227+
<span>
228+
{t(`Play part from ${RundownUtils.formatTimeToShortTime(Math.floor(timecode / 1000) * 1000)}`)}
229+
</span>
230+
</MenuItem>
231+
</>
232+
) : null}
233+
{enableQuickLoop && !isLoopLocked(playlist) && (
234+
<>
235+
{isQuickLoopStart(part.partId, playlist) ? (
236+
<MenuItem onClick={(e) => onSetQuickLoopStart(null, e)}>
237+
<span>{t('Clear QuickLoop Start')}</span>
238+
</MenuItem>
239+
) : (
200240
<MenuItem
201241
onClick={(e) =>
202-
onSetAsNextFromHere(
203-
part.instance,
204-
playlist?.nextPartInfo?.partInstanceId ?? null,
205-
playlist?.currentPartInfo?.partInstanceId ?? null,
206-
e
207-
)
242+
onSetQuickLoopStart({ type: QuickLoopMarkerType.PART, id: part.instance.part._id }, e)
208243
}
209-
disabled={getIsPlayFromHereDisabled()}
244+
disabled={!!part.instance.orphaned || !canSetAsNext}
210245
>
211-
<span
212-
dangerouslySetInnerHTML={{
213-
__html: t(
214-
`Set part from ${RundownUtils.formatTimeToShortTime(Math.floor(timecode / 1000) * 1000)} as <strong>Next</strong>`
215-
),
216-
}}
217-
></span>
246+
<span>{t('Set as QuickLoop Start')}</span>
218247
</MenuItem>
248+
)}
249+
{isQuickLoopEnd(part.partId, playlist) ? (
250+
<MenuItem onClick={(e) => onSetQuickLoopEnd(null, e)}>
251+
<span>{t('Clear QuickLoop End')}</span>
252+
</MenuItem>
253+
) : (
219254
<MenuItem
220255
onClick={(e) =>
221-
onSetAsNextFromHere(
222-
part.instance,
223-
playlist?.nextPartInfo?.partInstanceId ?? null,
224-
playlist?.currentPartInfo?.partInstanceId ?? null,
225-
e,
226-
true
227-
)
256+
onSetQuickLoopEnd({ type: QuickLoopMarkerType.PART, id: part.instance.part._id }, e)
228257
}
229-
disabled={getIsPlayFromHereDisabled(true)}
258+
disabled={!!part.instance.orphaned || !canSetAsNext}
230259
>
231-
<span>
232-
{t(`Play part from ${RundownUtils.formatTimeToShortTime(Math.floor(timecode / 1000) * 1000)}`)}
233-
</span>
260+
<span>{t('Set as QuickLoop End')}</span>
234261
</MenuItem>
235-
</>
236-
) : null}
237-
{enableQuickLoop && !isLoopLocked(playlist) && (
238-
<>
239-
{isQuickLoopStart(part.partId, playlist) ? (
240-
<MenuItem onClick={(e) => onSetQuickLoopStart(null, e)}>
241-
<span>{t('Clear QuickLoop Start')}</span>
242-
</MenuItem>
243-
) : (
244-
<MenuItem
245-
onClick={(e) =>
246-
onSetQuickLoopStart({ type: QuickLoopMarkerType.PART, id: part.instance.part._id }, e)
247-
}
248-
disabled={!!part.instance.orphaned || !canSetAsNext}
249-
>
250-
<span>{t('Set as QuickLoop Start')}</span>
251-
</MenuItem>
252-
)}
253-
{isQuickLoopEnd(part.partId, playlist) ? (
254-
<MenuItem onClick={(e) => onSetQuickLoopEnd(null, e)}>
255-
<span>{t('Clear QuickLoop End')}</span>
256-
</MenuItem>
257-
) : (
258-
<MenuItem
259-
onClick={(e) =>
260-
onSetQuickLoopEnd({ type: QuickLoopMarkerType.PART, id: part.instance.part._id }, e)
261-
}
262-
disabled={!!part.instance.orphaned || !canSetAsNext}
263-
>
264-
<span>{t('Set as QuickLoop End')}</span>
265-
</MenuItem>
266-
)}
267-
</>
268-
)}
262+
)}
263+
</>
264+
)}
265+
266+
<UserEditOperationMenuItems
267+
rundownId={part.instance.rundownId}
268+
targetName={part.instance.part.title}
269+
operationTarget={{
270+
segmentExternalId: segment?.externalId,
271+
partExternalId: part.instance.part.externalId,
272+
pieceExternalId: undefined,
273+
}}
274+
userEditOperations={part.instance.part.userEditOperations}
275+
isFormEditable={isPartEditAble}
276+
/>
269277

278+
{piece && piece.instance.piece.userEditOperations && (
270279
<UserEditOperationMenuItems
271280
rundownId={part.instance.rundownId}
272-
targetName={part.instance.part.title}
281+
targetName={piece.instance.piece.name}
273282
operationTarget={{
274283
segmentExternalId: segment?.externalId,
275284
partExternalId: part.instance.part.externalId,
276-
pieceExternalId: undefined,
285+
pieceExternalId: piece.instance.piece.externalId,
277286
}}
278-
userEditOperations={part.instance.part.userEditOperations}
287+
userEditOperations={piece.instance.piece.userEditOperations as CoreUserEditingDefinition[] | undefined}
279288
isFormEditable={isPartEditAble}
280289
/>
290+
)}
281291

282-
{piece && piece.instance.piece.userEditOperations && (
283-
<UserEditOperationMenuItems
284-
rundownId={part.instance.rundownId}
285-
targetName={piece.instance.piece.name}
286-
operationTarget={{
287-
segmentExternalId: segment?.externalId,
288-
partExternalId: part.instance.part.externalId,
289-
pieceExternalId: piece.instance.piece.externalId,
290-
}}
291-
userEditOperations={
292-
piece.instance.piece.userEditOperations as CoreUserEditingDefinition[] | undefined
293-
}
294-
isFormEditable={isPartEditAble}
295-
/>
296-
)}
297-
298-
{enableUserEdits && (segmentHasEditableContent || partHasEditableContent || pieceHasEditableContent) && (
299-
<>
300-
<hr />
301-
{segmentHasEditableContent && (
302-
<MenuItem onClick={() => onEditProps({ type: 'segment', elementId: part.instance.segmentId })}>
303-
<span>{t('Edit Segment Properties')}</span>
304-
</MenuItem>
305-
)}
306-
{partHasEditableContent && (
307-
<MenuItem onClick={() => onEditProps({ type: 'part', elementId: part.instance.part._id })}>
308-
<span>{t('Edit Part Properties')}</span>
309-
</MenuItem>
310-
)}
311-
{pieceHasEditableContent && piece && (
312-
<MenuItem onClick={() => onEditProps({ type: 'piece', elementId: piece.instance.piece._id })}>
313-
<span>{t('Edit Piece Properties')}</span>
314-
</MenuItem>
315-
)}
316-
</>
317-
)}
318-
</>
319-
)}
292+
{enableUserEdits && (segmentHasEditableContent || partHasEditableContent || pieceHasEditableContent) && (
293+
<>
294+
<hr />
295+
{segmentHasEditableContent && (
296+
<MenuItem onClick={() => onEditProps({ type: 'segment', elementId: part.instance.segmentId })}>
297+
<span>{t('Edit Segment Properties')}</span>
298+
</MenuItem>
299+
)}
300+
{partHasEditableContent && (
301+
<MenuItem onClick={() => onEditProps({ type: 'part', elementId: part.instance.part._id })}>
302+
<span>{t('Edit Part Properties')}</span>
303+
</MenuItem>
304+
)}
305+
{pieceHasEditableContent && piece && (
306+
<MenuItem onClick={() => onEditProps({ type: 'piece', elementId: piece.instance.piece._id })}>
307+
<span>{t('Edit Piece Properties')}</span>
308+
</MenuItem>
309+
)}
310+
</>
311+
)}
312+
</>
313+
)}
320314
</ContextMenu>
321315
</Escape>
322316
) : null

0 commit comments

Comments
 (0)