From c4e55e6744d33a927b57f2c0e197f2dbe9c7f858 Mon Sep 17 00:00:00 2001 From: Olzzon Date: Tue, 28 Jan 2020 03:54:55 +0100 Subject: [PATCH] feat: load CasparCG settings from Storage menu --- client/components/CcgChannelSettings.tsx | 3 +- client/components/RoutingStorage.tsx | 42 ++++++++--- client/index.tsx | 6 +- client/utils/SocketClientHandlers.ts | 12 ++-- server/MainThreadHandler.ts | 20 +++++- server/constants/SOCKET_IO_DISPATCHERS.ts | 2 + server/utils/SettingsStorage.ts | 8 +++ storage/default-casparcg.ccg | 86 +++++++++++++++++++++++ 8 files changed, 160 insertions(+), 19 deletions(-) create mode 100644 storage/default-casparcg.ccg diff --git a/client/components/CcgChannelSettings.tsx b/client/components/CcgChannelSettings.tsx index 58a1d467..a027f359 100644 --- a/client/components/CcgChannelSettings.tsx +++ b/client/components/CcgChannelSettings.tsx @@ -58,7 +58,8 @@ class CcgChannelInputSettings extends React.PureComponent ) - })} + }) + } ) } diff --git a/client/components/RoutingStorage.tsx b/client/components/RoutingStorage.tsx index 030bf092..02d7b05d 100644 --- a/client/components/RoutingStorage.tsx +++ b/client/components/RoutingStorage.tsx @@ -3,9 +3,13 @@ import React from 'react'; import '../assets/css/RoutingStorage.css'; import { Store } from 'redux'; import { connect } from 'react-redux'; -import Popup from 'reactjs-popup' import { TOGGLE_SHOW_STORAGE } from '../../server/reducers/settingsActions' -import { SOCKET_GET_SNAPSHOT_LIST, SOCKET_LOAD_SNAPSHOT, SOCKET_SAVE_SNAPSHOT } from '../../server/constants/SOCKET_IO_DISPATCHERS'; +import { + SOCKET_GET_SNAPSHOT_LIST, + SOCKET_LOAD_SNAPSHOT, + SOCKET_SAVE_SNAPSHOT, + SOCKET_GET_CCG_LIST +} from '../../server/constants/SOCKET_IO_DISPATCHERS'; interface IStorageProps { load: any @@ -13,16 +17,17 @@ interface IStorageProps { } class Storage extends React.PureComponent { fileList: string[] = [] - load: any - save: any + loadSnapshot: any + saveSnapshot: any constructor(props: any) { super(props); - this.load = this.props.load - this.save = this.props.save + this.loadSnapshot = this.props.load + this.saveSnapshot = this.props.save //Bindings: - this.ListFiles = this.ListFiles.bind(this) + this.ListSnapshotFiles = this.ListSnapshotFiles.bind(this) + this.ListCcgFiles = this.ListCcgFiles.bind(this) this.loadFile = this.loadFile.bind(this) this.saveFile = this.saveFile.bind(this) } @@ -52,7 +57,7 @@ class Storage extends React.PureComponent { this.handleClose() } - ListFiles(props: any) { + ListSnapshotFiles() { window.socketIoClient.emit(SOCKET_GET_SNAPSHOT_LIST) const listItems = window.snapshotFileList.map((file: string, index: number) => { return ( @@ -68,6 +73,22 @@ class Storage extends React.PureComponent { ); } + ListCcgFiles() { + window.socketIoClient.emit(SOCKET_GET_CCG_LIST) + const listItems = window.ccgFileList.map((file: string, index: number) => { + return ( +
  • + {file} +
    • ) + } + ); + return ( +
      + {listItems} +
    + ); + } + render() { return (
    @@ -80,7 +101,10 @@ class Storage extends React.PureComponent {

    LOAD ROUTING :

    - + +
    +

    LOAD CASPARCG :

    +
    ) } diff --git a/client/index.tsx b/client/index.tsx index 895010ab..af5762c9 100644 --- a/client/index.tsx +++ b/client/index.tsx @@ -8,7 +8,7 @@ import io from 'socket.io-client' import { createStore } from 'redux'; import { Provider as ReduxProvider} from 'react-redux'; import indexReducer from '../server/reducers/indexReducer'; -import { SOCKET_GET_SNAPSHOT_LIST } from '../server/constants/SOCKET_IO_DISPATCHERS'; +import { SOCKET_GET_SNAPSHOT_LIST, SOCKET_GET_CCG_LIST } from '../server/constants/SOCKET_IO_DISPATCHERS'; declare global { interface Window { @@ -17,7 +17,8 @@ declare global { mixerProtocolPresets: any mixerProtocolList: any socketIoClient: any - snapshotFileList: any + snapshotFileList: string[] + ccgFileList: string[] } } @@ -30,6 +31,7 @@ const storeRedux = createStore( window.storeRedux = storeRedux window.socketIoClient = io() window.socketIoClient.emit(SOCKET_GET_SNAPSHOT_LIST) +window.socketIoClient.emit(SOCKET_GET_CCG_LIST) console.log('Setting up SocketIO connection') diff --git a/client/utils/SocketClientHandlers.ts b/client/utils/SocketClientHandlers.ts index a8735d36..1733996c 100644 --- a/client/utils/SocketClientHandlers.ts +++ b/client/utils/SocketClientHandlers.ts @@ -1,7 +1,7 @@ import { SET_COMPLETE_FADER_STATE, SET_VU_LEVEL, SET_SINGLE_FADER_STATE } from "../../server/reducers/faderActions"; import { SET_COMPLETE_CH_STATE, SET_SINGLE_CH_STATE } from "../../server/reducers/channelActions"; import { UPDATE_SETTINGS, SET_MIXER_ONLINE } from "../../server/reducers/settingsActions"; -import { SOCKET_SET_VU, SOCKET_RETURN_SNAPSHOT_LIST, SOCKET_SET_FULL_STORE, SOCKET_SET_STORE_FADER, SOCKET_SET_STORE_CHANNEL } from "../../server/constants/SOCKET_IO_DISPATCHERS"; +import { SOCKET_SET_VU, SOCKET_RETURN_SNAPSHOT_LIST, SOCKET_SET_FULL_STORE, SOCKET_SET_STORE_FADER, SOCKET_SET_STORE_CHANNEL, SOCKET_RETURN_CCG_LIST } from "../../server/constants/SOCKET_IO_DISPATCHERS"; export const socketClientHandlers = () => { window.socketIoClient @@ -52,7 +52,6 @@ export const socketClientHandlers = () => { ) .on(SOCKET_SET_STORE_FADER, ( (payload: any) => { - // console.log('MIXERPROTOCOL RECEIVED :', payload) window.storeRedux.dispatch({ type:SET_SINGLE_FADER_STATE, faderIndex: payload.faderIndex, @@ -62,7 +61,6 @@ export const socketClientHandlers = () => { ) .on(SOCKET_SET_STORE_CHANNEL, ( (payload: any) => { - // console.log('MIXERPROTOCOL RECEIVED :', payload) window.storeRedux.dispatch({ type:SET_SINGLE_CH_STATE, channelIndex: payload.channelIndex, @@ -72,7 +70,6 @@ export const socketClientHandlers = () => { ) .on(SOCKET_SET_VU, ( (payload: any) => { - // console.log('MIXERPROTOCOL RECEIVED :', payload) window.storeRedux.dispatch({ type:SET_VU_LEVEL, channel: payload.faderIndex, @@ -82,8 +79,13 @@ export const socketClientHandlers = () => { ) .on(SOCKET_RETURN_SNAPSHOT_LIST, ( (payload: any) => { - // console.log('MIXERPROTOCOL RECEIVED :', payload) window.snapshotFileList = payload }) ) + .on(SOCKET_RETURN_CCG_LIST, ( + (payload: any) => { + window.ccgFileList = payload + }) + ) + } \ No newline at end of file diff --git a/server/MainThreadHandler.ts b/server/MainThreadHandler.ts index b9e69058..adae73a2 100644 --- a/server/MainThreadHandler.ts +++ b/server/MainThreadHandler.ts @@ -4,7 +4,12 @@ import { SnapshotHandler } from './utils/SnapshotHandler' import { socketServer } from './expressHandler' import { UPDATE_SETTINGS } from './reducers/settingsActions' -import { loadSettings, saveSettings, getSnapShotList } from './utils/SettingsStorage' +import { + loadSettings, + saveSettings, + getSnapShotList, + getCcgSettingsList +} from './utils/SettingsStorage' import { SOCKET_TOGGLE_PGM, SOCKET_TOGGLE_VO, @@ -14,7 +19,9 @@ import { SOCKET_SET_FADERLEVEL, SOCKET_SAVE_SETTINGS, SOCKET_GET_SNAPSHOT_LIST, - SOCKET_RETURN_SNAPSHOT_LIST, + SOCKET_RETURN_SNAPSHOT_LIST, + SOCKET_GET_CCG_LIST, + SOCKET_RETURN_CCG_LIST, SOCKET_LOAD_SNAPSHOT, SOCKET_SAVE_SNAPSHOT, SOCKET_SET_ASSIGNED_FADER, @@ -152,6 +159,15 @@ export class MainThreadHandlers { ) }) ) + .on(SOCKET_GET_CCG_LIST, ( + () => { + logger.info('Get snapshot list', {}) + socketServer.emit( + SOCKET_RETURN_CCG_LIST, + getCcgSettingsList() + ) + }) + ) .on(SOCKET_SAVE_SETTINGS, ( (payload: any) => { logger.info('Save settings :' + String(payload), {}) diff --git a/server/constants/SOCKET_IO_DISPATCHERS.ts b/server/constants/SOCKET_IO_DISPATCHERS.ts index d0de5849..75f1d7b1 100644 --- a/server/constants/SOCKET_IO_DISPATCHERS.ts +++ b/server/constants/SOCKET_IO_DISPATCHERS.ts @@ -28,6 +28,8 @@ export const SOCKET_RESTART_SERVER = 'restartServer' export const SOCKET_SET_VU = 'setVu' export const SOCKET_GET_SNAPSHOT_LIST = 'getSnapshotList' export const SOCKET_RETURN_SNAPSHOT_LIST = 'returnSnapshotList' +export const SOCKET_GET_CCG_LIST = 'getCcgList' +export const SOCKET_RETURN_CCG_LIST = 'returnCcgList' export const SOCKET_LOAD_SNAPSHOT = 'loadSnapshot' export const SOCKET_SAVE_SNAPSHOT = 'saveSnapshot' diff --git a/server/utils/SettingsStorage.ts b/server/utils/SettingsStorage.ts index 2f9f7309..ed5a1469 100644 --- a/server/utils/SettingsStorage.ts +++ b/server/utils/SettingsStorage.ts @@ -102,3 +102,11 @@ export const getSnapShotList = () => { return files } +export const getCcgSettingsList = () => { + const files = fs.readdirSync(path.resolve('storage')).filter((file: string) => { + if (file.includes('.ccg')) { + return true + } + }) + return files +} diff --git a/storage/default-casparcg.ccg b/storage/default-casparcg.ccg new file mode 100644 index 00000000..726699fa --- /dev/null +++ b/storage/default-casparcg.ccg @@ -0,0 +1,86 @@ +{ + "label": "Sofie CasparCG Example", + "fromMixer": { + "CHANNEL_VU": [ + ["/channel/1/stage/layer/51/audio/1/pFS", "/channel/1/stage/layer/51/audio/2/pFS"], + ["/channel/1/stage/layer/52/audio/1/pFS", "/channel/1/stage/layer/52/audio/2/pFS"], + ["/channel/1/stage/layer/53/audio/1/pFS", "/channel/1/stage/layer/53/audio/2/pFS"], + ["/channel/1/stage/layer/54/audio/1/pFS", "/channel/1/stage/layer/54/audio/2/pFS"], + ["/channel/1/stage/layer/55/audio/1/pFS", "/channel/1/stage/layer/55/audio/2/pFS"], + ["/channel/1/stage/layer/56/audio/1/pFS", "/channel/1/stage/layer/56/audio/2/pFS"] + ] + }, + "toMixer": { + "MONITOR_CHANNEL_FADER_LEVEL": [ + [ + { "channel": 2, "layer": 51 } + ], + [ + { "channel": 2, "layer": 52 } + ], + [ + { "channel": 2, "layer": 53 } + ], + [ + { "channel": 2, "layer": 54 } + ], + [ + { "channel": 2, "layer": 55 } + ], + [ + { "channel": 2, "layer": 56 } + ] + ], + "PGM_CHANNEL_FADER_LEVEL": [ + [ + { "channel": 1, "layer": 51 }, + { "channel": 3, "layer": 51 } + ], + [ + { "channel": 1, "layer": 52 }, + { "channel": 3, "layer": 52 } + ], + [ + { "channel": 1, "layer": 53 }, + { "channel": 3, "layer": 53 } + ], + [ + { "channel": 1, "layer": 54 }, + { "channel": 3, "layer": 54 } + ], + [ + { "channel": 1, "layer": 55 }, + { "channel": 3, "layer": 55 } + ], + [ + { "channel": 1, "layer": 56 }, + { "channel": 3, "layer": 56 } + ] + ] + }, + "channelLabels": [ + "RM1", + "RM2", + "RM3", + "RM4", + "RM5", + "MP1" + ], + "sourceOptions": { + "sources": [ + { "channel": 2, "layer": 51 }, + { "channel": 2, "layer": 52 }, + { "channel": 2, "layer": 53 }, + { "channel": 2, "layer": 54 }, + { "channel": 2, "layer": 55 }, + { "channel": 2, "layer": 56 } + ], + "options": { + "CHANNEL_LAYOUT": { + "1L-2R": "8ch2", + "1L-1R": "4ch-dleft", + "2L-2R": "4ch-dright" + } + } + } +}