feat: add button to toggle manual mode for all faders

olzzon · Sep 16, 2020 · ee94d84 · ee94d84
1 parent 2552797
commit ee94d84
Show file tree

Hide file tree

Showing 7 changed files with 82 additions and 2 deletions.
diff --git a/client/assets/css/Channels.css b/client/assets/css/Channels.css
@@ -48,6 +48,13 @@
     background-color: #2f475b;
 }
 
+.button-all-manual.all {
+    background-color: #af39b9;
+}
+.button-all-manual.any {
+    border-color: #af39b9;
+}
+
 .channels-mix-body {
     display: flex;
     flex-direction: column;

diff --git a/client/components/Channel.tsx b/client/components/Channel.tsx
@@ -38,6 +38,10 @@ interface IChannelProps {
     faderIndex: number
 }
 
+function XOR(a: any, b: any): boolean {
+    return (a && !b) || (b && !a)
+}
+
 class Channel extends React.Component<
     IChannelProps & IChannelInjectProps & Store
 > {
@@ -69,7 +73,12 @@ class Channel extends React.Component<
             nextProps.settings.showPfl != this.props.settings.showPfl ||
             nextProps.settings.showChanStrip !=
                 this.props.settings.showChanStrip ||
-            nextProps.fader.amixOn != this.props.fader.amixOn
+            nextProps.fader.amixOn != this.props.fader.amixOn ||
+            XOR(nextProps.fader.capabilities, this.props.fader.capabilities) ||
+            XOR(
+                nextProps.fader.capabilities?.hasAMix,
+                this.props.fader.capabilities?.hasAMix
+            )
         )
     }
 

diff --git a/client/components/Channels.tsx b/client/components/Channels.tsx
@@ -21,6 +21,7 @@ import {
     SOCKET_NEXT_MIX,
     SOCKET_CLEAR_PST,
     SOCKET_RESTART_SERVER,
+    SOCKET_TOGGLE_ALL_MANUAL,
 } from '../../server/constants/SOCKET_IO_DISPATCHERS'
 
 interface IChannelsInjectProps {
@@ -48,7 +49,11 @@ class Channels extends React.Component<IChannelsInjectProps & Store> {
             this.props.faders.length !== nextProps.faders.length ||
             this.props.settings.currentPage !==
                 nextProps.settings.currentPage ||
-            this.props.settings.pageLength !== nextProps.settings.pageLength
+            this.props.settings.pageLength !== nextProps.settings.pageLength ||
+            !!nextProps.faders.find(
+                (f, i) =>
+                    this.props.faders[i].ignoreAutomation !== f.ignoreAutomation
+            )
         )
     }
 
@@ -60,6 +65,10 @@ class Channels extends React.Component<IChannelsInjectProps & Store> {
         window.socketIoClient.emit(SOCKET_CLEAR_PST)
     }
 
+    handleAllManual() {
+        window.socketIoClient.emit(SOCKET_TOGGLE_ALL_MANUAL)
+    }
+
     handleReconnect() {
         if (window.confirm('Are you sure you will restart server?')) {
             window.socketIoClient.emit(SOCKET_RESTART_SERVER)
@@ -163,6 +172,34 @@ class Channels extends React.Component<IChannelsInjectProps & Store> {
         )
     }
 
+    renderAllManualButton() {
+        // TODO - ignore disabled / hidden faders?
+        const isAllManual =
+            this.props.faders.find((f) => f.ignoreAutomation !== true) ===
+            undefined
+        const isAnyManual = !!this.props.faders.find(
+            (f) => f.ignoreAutomation === true
+        )
+
+        console.log('all manual', isAllManual, 'any manual', isAnyManual)
+
+        return (
+            <React.Fragment>
+                <button
+                    className={ClassNames('button button-all-manual', {
+                        all: isAllManual,
+                        any: isAnyManual && !isAllManual,
+                    })}
+                    onClick={() => {
+                        this.handleAllManual()
+                    }}
+                >
+                    MANUAL CONTROL
+                </button>
+            </React.Fragment>
+        )
+    }
+
     renderFaders() {
         const curPage = this.props.settings.currentPage
         const pageLength = this.props.settings.pageLength
@@ -295,6 +332,7 @@ class Channels extends React.Component<IChannelsInjectProps & Store> {
                         )}
                     </div>
                     <div className="mid">
+                        {this.renderAllManualButton()}
                         {!this.props.settings.showPfl && (
                             <React.Fragment>
                                 <button

diff --git a/server/MainThreadHandler.ts b/server/MainThreadHandler.ts
@@ -60,6 +60,7 @@ import {
     SOCKET_GET_PAGES_LIST,
     SOCKET_RETURN_PAGES_LIST,
     SOCKET_TOGGLE_AMIX,
+    SOCKET_TOGGLE_ALL_MANUAL,
 } from './constants/SOCKET_IO_DISPATCHERS'
 import {
     TOGGLE_PGM,
@@ -82,6 +83,7 @@ import {
     SET_INPUT_GAIN,
     SET_INPUT_SELECTOR,
     TOGGLE_AMIX,
+    TOGGLE_ALL_MANUAL,
 } from './reducers/faderActions'
 import { SET_FADER_LEVEL } from './reducers/faderActions'
 import { SET_ASSIGNED_FADER, SET_AUX_LEVEL } from './reducers/channelActions'
@@ -453,5 +455,12 @@ export class MainThreadHandlers {
                 mixerGenericConnection.updateInputSelector(payload.faderIndex)
                 this.updatePartialStore(payload.faderIndex)
             })
+            .on(SOCKET_TOGGLE_ALL_MANUAL, () => {
+                logger.verbose('Toggle manual mode for all')
+                store.dispatch({
+                    type: TOGGLE_ALL_MANUAL,
+                })
+                this.updateFullClientStore()
+            })
     }
 }
diff --git a/server/constants/SOCKET_IO_DISPATCHERS.ts b/server/constants/SOCKET_IO_DISPATCHERS.ts
@@ -44,6 +44,7 @@ export const SOCKET_SAVE_SNAPSHOT = 'saveSnapshot'
 export const SOCKET_SAVE_CCG_FILE = 'saveCcgFile'
 export const SOCKET_GET_PAGES_LIST = 'getPagesList'
 export const SOCKET_RETURN_PAGES_LIST = 'getPagesList'
+export const SOCKET_TOGGLE_ALL_MANUAL = 'toggleAllManual'
 
 // Store updates:
 export const SOCKET_SET_FULL_STORE = 'setFullStore'

diff --git a/server/reducers/faderActions.ts b/server/reducers/faderActions.ts
@@ -39,3 +39,4 @@ export const SET_CHANNEL_DISABLED = 'SET_CHANNEL_DISABLED'
 export const TOGGLE_AMIX = 'TOGGLE_AMIX'
 export const SET_AMIX = 'SET_AMIX'
 export const SET_CAPABILITY = 'SET_CAPABILITY'
+export const TOGGLE_ALL_MANUAL = 'TOGGLE_ALL_MANUAL'
diff --git a/server/reducers/fadersReducer.ts b/server/reducers/fadersReducer.ts
@@ -41,6 +41,7 @@ import {
     TOGGLE_AMIX,
     SET_AMIX,
     SET_CAPABILITY,
+    TOGGLE_ALL_MANUAL,
 } from '../reducers/faderActions'
 
 export interface IFaders {
@@ -370,6 +371,20 @@ export const faders = (
                 delete nextState[0].fader[action.channel].capabilities
             }
             return nextState
+        case TOGGLE_ALL_MANUAL:
+            const isAllManual =
+                nextState[0].fader.find((f) => f.ignoreAutomation !== true) ===
+                undefined
+
+            if (isAllManual) {
+                nextState[0].fader.forEach((f) => {
+                    f.ignoreAutomation = false
+                })
+            } else {
+                nextState[0].fader.forEach((f) => {
+                    f.ignoreAutomation = true
+                })
+            }
         default:
             return nextState
     }