diff --git a/apps/client/src/common/hooks/useSocket.ts b/apps/client/src/common/hooks/useSocket.ts index 9fc196d30..72b0c62ba 100644 --- a/apps/client/src/common/hooks/useSocket.ts +++ b/apps/client/src/common/hooks/useSocket.ts @@ -24,10 +24,10 @@ export const useOperator = () => { export const useMessageControl = () => { const featureSelector = (state: RuntimeStore) => ({ - timerMessage: state.timerMessage, - publicMessage: state.publicMessage, - lowerMessage: state.lowerMessage, - externalMessage: state.externalMessage, + timer: state.message.timer, + public: state.message.public, + lower: state.message.lower, + external: state.message.external, onAir: state.onAir, }); @@ -35,17 +35,17 @@ export const useMessageControl = () => { }; export const setMessage = { - presenterText: (payload: string) => socketSendJson('set-timer-message-text', payload), - presenterVisible: (payload: boolean) => socketSendJson('set-timer-message-visible', payload), - publicText: (payload: string) => socketSendJson('set-public-message-text', payload), - publicVisible: (payload: boolean) => socketSendJson('set-public-message-visible', payload), - lowerText: (payload: string) => socketSendJson('set-lower-message-text', payload), - lowerVisible: (payload: boolean) => socketSendJson('set-lower-message-visible', payload), - externalText: (payload: string) => socketSendJson('set-external-message-text', payload), - externalVisible: (payload: boolean) => socketSendJson('set-external-message-visible', payload), - onAir: (payload: boolean) => socketSendJson('set-onAir', payload), - timerBlink: (payload: boolean) => socketSendJson('set-timer-blink', payload), - timerBlackout: (payload: boolean) => socketSendJson('set-timer-blackout', payload), + timerText: (payload: string) => socketSendJson('message', { timer: { text: payload } }), + timerVisible: (payload: boolean) => socketSendJson('message', { timer: { visible: payload } }), + publicText: (payload: string) => socketSendJson('message', { public: { text: payload } }), + publicVisible: (payload: boolean) => socketSendJson('message', { public: { visible: payload } }), + lowerText: (payload: string) => socketSendJson('message', { lower: { text: payload } }), + lowerVisible: (payload: boolean) => socketSendJson('message', { lower: { visible: payload } }), + externalText: (payload: string) => socketSendJson('message', { external: { visible: payload } }), + externalVisible: (payload: boolean) => socketSendJson('message', { external: { visible: payload } }), + onAir: (payload: boolean) => socketSendJson('onAir', payload), + timerBlink: (payload: boolean) => socketSendJson('message', { timer: { blink: payload } }), + timerBlackout: (payload: boolean) => socketSendJson('message', { timer: { blackout: payload } }), }; export const usePlaybackControl = () => { @@ -62,12 +62,12 @@ export const setPlayback = { start: () => socketSendJson('start'), pause: () => socketSendJson('pause'), roll: () => socketSendJson('roll'), - startNext: () => socketSendJson('start-next'), + startNext: () => socketSendJson('start', { next: true }), previous: () => { - socketSendJson('previous'); + socketSendJson('load', { previous: true }); }, next: () => { - socketSendJson('next'); + socketSendJson('load', { next: true }); }, stop: () => { socketSendJson('stop'); @@ -93,8 +93,8 @@ export const useCuesheet = () => { }; export const setEventPlayback = { - loadEvent: (eventId: string) => socketSendJson('loadid', eventId), - startEvent: (eventId: string) => socketSendJson('startid', eventId), + loadEvent: (id: string) => socketSendJson('load', { id }), + startEvent: (id: string) => socketSendJson('start', { id }), start: () => socketSendJson('start'), pause: () => socketSendJson('pause'), }; diff --git a/apps/client/src/common/stores/runtime.ts b/apps/client/src/common/stores/runtime.ts index 53042aca3..024ed0463 100644 --- a/apps/client/src/common/stores/runtime.ts +++ b/apps/client/src/common/stores/runtime.ts @@ -19,23 +19,25 @@ export const runtimeStorePlaceholder: RuntimeStore = { timeDanger: null, }, playback: Playback.Stop, - timerMessage: { - text: '', - visible: false, - timerBlink: false, - timerBlackout: false, - }, - publicMessage: { - text: '', - visible: false, - }, - lowerMessage: { - text: '', - visible: false, - }, - externalMessage: { - text: '', - visible: false, + message: { + timer: { + text: '', + visible: false, + blink: false, + blackout: false, + }, + public: { + text: '', + visible: false, + }, + lower: { + text: '', + visible: false, + }, + external: { + text: '', + visible: false, + }, }, onAir: false, loaded: { diff --git a/apps/client/src/common/utils/socket.ts b/apps/client/src/common/utils/socket.ts index e5aab2315..b500f60ef 100644 --- a/apps/client/src/common/utils/socket.ts +++ b/apps/client/src/common/utils/socket.ts @@ -87,21 +87,9 @@ export const connectSocket = (preferredClientName?: string) => { runtime.setState(state); break; } - case 'ontime-timerMessage': { + case 'ontime-message': { const state = runtime.getState(); - state.timerMessage = payload; - runtime.setState(state); - break; - } - case 'ontime-publicMessage': { - const state = runtime.getState(); - state.publicMessage = payload; - runtime.setState(state); - break; - } - case 'ontime-lowerMessage': { - const state = runtime.getState(); - state.lowerMessage = payload; + state.message = payload; runtime.setState(state); break; } diff --git a/apps/client/src/features/control/message/MessageControl.tsx b/apps/client/src/features/control/message/MessageControl.tsx index 459ff867c..4d36b0101 100644 --- a/apps/client/src/features/control/message/MessageControl.tsx +++ b/apps/client/src/features/control/message/MessageControl.tsx @@ -11,41 +11,42 @@ import InputRow from './InputRow'; import style from './MessageControl.module.scss'; export default function MessageControl() { - const data = useMessageControl(); - + const message = useMessageControl(); + const blink = message.timer.blink; + const blackout = message.timer.blackout; return (
setMessage.publicText(newValue)} - actionHandler={() => setMessage.publicVisible(!data.publicMessage.visible)} + actionHandler={() => setMessage.publicVisible(!message.public.visible)} /> setMessage.lowerText(newValue)} - actionHandler={() => setMessage.lowerVisible(!data.lowerMessage.visible)} + actionHandler={() => setMessage.lowerVisible(!message.lower.visible)} /> setMessage.presenterText(newValue)} - actionHandler={() => setMessage.presenterVisible(!data.timerMessage.visible)} + text={message.timer.text || ''} + visible={message.timer.visible || false} + changeHandler={(newValue) => setMessage.timerText(newValue)} + actionHandler={() => setMessage.timerVisible(!message.timer.visible)} />