feat: Ignore Automation implemented. A "MANUAL" button added in GUI s…

…o a fader can ignore commands from Automation

server/MainThreadHandler.ts

@@ -24,7 +24,8 @@ import {
     SOCKET_SET_MID,
     SOCKET_SET_HIGH,
     SOCKET_RESTART_SERVER,
-    SOCKET_SET_FADER_MONITOR
+    SOCKET_SET_FADER_MONITOR,
+    SOCKET_TOGGLE_IGNORE
  } from './constants/SOCKET_IO_DISPATCHERS'
 import { 
     TOGGLE_PGM, 
@@ -39,7 +40,8 @@ import {
     SET_FADER_LOW, 
     SET_FADER_MID, 
     SET_FADER_HIGH, 
-    SET_FADER_MONITOR
+    SET_FADER_MONITOR,
+    IGNORE_AUTOMATION
 } from './reducers/faderActions';
 import { SET_FADER_LEVEL } from './reducers/faderActions';
 import { SET_ASSIGNED_FADER, SET_AUX_LEVEL } from './reducers/channelActions';
@@ -299,6 +301,15 @@ export class MainThreadHandlers {
                 global.socketServer.emit('set-store', global.storeRedux.getState())
             })
         )
+        .on(SOCKET_TOGGLE_IGNORE, (
+            (faderIndex: any) => {
+                global.storeRedux.dispatch({
+                    type: IGNORE_AUTOMATION,
+                    channel: faderIndex
+                });
+                global.socketServer.emit('set-store', global.storeRedux.getState())
+            })
+        )
         .on(SOCKET_SET_FADERLEVEL, (
             (payload: any) => {
                 global.storeRedux.dispatch({

server/constants/SOCKET_IO_DISPATCHERS.ts

@@ -15,6 +15,7 @@ export const SOCKET_TOGGLE_VO = 'toggleVo'
 export const SOCKET_TOGGLE_PST = 'togglePst'
 export const SOCKET_TOGGLE_PFL = 'togglePfl'
 export const SOCKET_TOGGLE_MUTE = 'toggleMute'
+export const SOCKET_TOGGLE_IGNORE = 'toggleIgnore'
 export const SOCKET_NEXT_MIX = 'nextMix'
 export const SOCKET_CLEAR_PST = 'clearPst'
 

server/reducers/faderActions.ts

@@ -21,6 +21,7 @@ export const SET_PFL = 'SET_PFL'
 export const TOGGLE_MUTE = 'TOGGLE_MUTE'
 export const SET_MUTE = 'SET_MUTE'
 export const SHOW_CHANNEL = 'SHOW_CHANNEL'
+export const IGNORE_AUTOMATION = 'IGNORE_AUTOMATION'
 export const TOGGLE_SNAP = 'TOGGLE_SNAP'
 export const X_MIX = 'X_MIX'
 export const NEXT_MIX = 'NEXT_MIX'

server/reducers/fadersReducer.ts

@@ -16,6 +16,7 @@ import {
     SET_VO,
     SET_VU_LEVEL,
     SHOW_CHANNEL,
+    IGNORE_AUTOMATION,
     SNAP_RECALL,
     TOGGLE_MUTE,
     TOGGLE_PFL,
@@ -52,6 +53,7 @@ export interface IFader {
     ratio: number,
     monitor: number,
     showChannel: boolean,
+    ignoreAutomation: boolean,
     snapOn: Array<boolean>,
 }
 
@@ -83,6 +85,7 @@ const defaultFadersReducerState = (numberOfFaders: number) => {
                 ratio: 0.75,
                 monitor: (index + 1), // route fader - aux 1:1 as default
                 showChannel: true,
+                ignoreAutomation: false,
                 snapOn: [],
             });
             defaultObj[0].vuMeters.push({
@@ -195,6 +198,9 @@ export const faders = ((state = defaultFadersReducerState(0), action: any): Arra
         case SHOW_CHANNEL: //channel // showChannel
             nextState[0].fader[action.channel].showChannel = !!action.showChannel;
             return nextState;
+        case IGNORE_AUTOMATION: //channel // ignoreAutomation
+            nextState[0].fader[action.channel].ignoreAutomation = !nextState[0].fader[action.channel].ignoreAutomation
+            return nextState;
         case TOGGLE_SNAP: //channel //snapIndex
             nextState[0].fader[action.channel].snapOn[action.snapIndex] = !nextState[0].fader[action.channel].snapOn[action.snapIndex];
             return nextState;

server/utils/AutomationConnection.ts

@@ -57,36 +57,41 @@ export class AutomationConnection {
             if ( this.checkOscCommand(message.address, this.automationProtocol.fromAutomation
                 .CHANNEL_PGM_ON_OFF)){
                 let ch = message.address.split("/")[2];
-                if (message.args[0] === 1) {
-                    global.mixerGenericConnection.checkForAutoResetThreshold(ch - 1)
-                    global.storeRedux.dispatch({
-                        type: SET_PGM,
-                        channel: ch - 1,
-                        pgmOn: true
-                    });
-                } else if (message.args[0] === 2) {
-                    global.mixerGenericConnection.checkForAutoResetThreshold(ch - 1)
-                    global.storeRedux.dispatch({
-                        type: SET_VO,
-                        channel: ch - 1,
-                        voOn: true
-                    });
-                } else {
-                    global.storeRedux.dispatch({
-                        type: SET_PGM,
-                        channel: ch - 1,
-                        pgmOn: false
-                    });
-                }
+                if (!this.store.faders[0].fader[ch - 1].ignoreAutomation) {
+                    if (message.args[0] === 1) {
+                        global.mixerGenericConnection.checkForAutoResetThreshold(ch - 1)
+                        global.storeRedux.dispatch({
+                            type: SET_PGM,
+                            channel: ch - 1,
+                            pgmOn: true
+                        });
+                    } else if (message.args[0] === 2) {
+                        global.mixerGenericConnection.checkForAutoResetThreshold(ch - 1)
+                        global.storeRedux.dispatch({
+                            type: SET_VO,
+                            channel: ch - 1,
+                            voOn: true
+                        });
+                    } else {
+                        global.storeRedux.dispatch({
+                            type: SET_PGM,
+                            channel: ch - 1,
+                            pgmOn: false
+                        });
+                    }
 
-                if (message.args.length > 1) {
-                    global.mixerGenericConnection.updateOutLevel(ch-1, parseFloat(message.args[1]));
-                } else {
-                    global.mixerGenericConnection.updateOutLevel(ch-1);
+                    if (message.args.length > 1) {
+                        global.mixerGenericConnection.updateOutLevel(ch-1, parseFloat(message.args[1]));
+                    } else {
+                        global.mixerGenericConnection.updateOutLevel(ch-1);
+                    }
                 }
+
             } else if ( this.checkOscCommand(message.address, this.automationProtocol.fromAutomation
                 .CHANNEL_PST_ON_OFF)){
                 let ch = message.address.split("/")[2];
+                if (!this.store.faders[0].fader[ch - 1].ignoreAutomation) {
+
                 if (message.args[0] === 1) {
                     global.storeRedux.dispatch({
                         type: SET_PST,
@@ -107,9 +112,12 @@ export class AutomationConnection {
                     });
                 }
                 global.mixerGenericConnection.updateNextAux(ch-1);
+            }
             } else if ( this.checkOscCommand(message.address, this.automationProtocol.fromAutomation
                 .CHANNEL_MUTE)){
                 let ch = message.address.split("/")[2];
+                if (!this.store.faders[0].fader[ch - 1].ignoreAutomation) {
+
                 if (message.args[0] === 1) {
                     global.storeRedux.dispatch({
                         type: SET_MUTE,
@@ -124,15 +132,19 @@ export class AutomationConnection {
                     });
                 }
                 global.mixerGenericConnection.updateMuteState(ch-1);
+            }
             } else if ( this.checkOscCommand(message.address, this.automationProtocol.fromAutomation
                 .CHANNEL_FADER_LEVEL)){
                 let ch = message.address.split("/")[2];
+                if (!this.store.faders[0].fader[ch - 1].ignoreAutomation) {
+
                 global.storeRedux.dispatch({
                     type: SET_FADER_LEVEL,
                     channel: ch - 1,
                     level: message.args[0]
                 });
                 global.mixerGenericConnection.updateOutLevel(ch-1);
+            }
             } else if (this.checkOscCommand(message.address, this.automationProtocol.fromAutomation
                 .SNAP_RECALL)) {
                 let snapNumber = message.address.split("/")[2];

src/assets/css/Channel.css

@@ -1,14 +1,18 @@
 .channel-body {
     color: white;
-    background: linear-gradient(#2f2f2f 0px,#2f2f2f 730px, rgb(0, 0, 0) 1px, #2f2f2f 740px, #2f2f2f 100%);
+    background: linear-gradient(#2f2f2f 0px,#2f2f2f 790px, rgb(0, 0, 0) 1px, #2f2f2f 800px, #2f2f2f 100%);
     margin: 4px;
     border-radius: 7px;
-    max-width: 100px;
+    width: 86px;
     position: relative;
 }
 
+.channel-body.ignore-on {
+    background: linear-gradient(#2e375e 0px,#2c3270 790px, rgb(0, 0, 0) 1px, #2c3270 800px, #2e375e 100%);
+}  
+
 .channel-body.mute-on {
-    background: linear-gradient(#202020 0px,#202020 730px, rgb(0, 0, 0) 1px, #2f2f2f 740px, #2f2f2f 100%);
+    background: linear-gradient(#202020 0px,#202020 790px, rgb(0, 0, 0) 1px, #2f2f2f 800px, #2f2f2f 100%);
 }  
 
 .channel-gain-label {
@@ -134,6 +138,27 @@
     color: rgb(48, 48, 48);
 }
 
+.channel-ignore-button {
+    outline : none;
+    -moz-outline : none;
+    margin-left: 3px;
+    margin-right: 3px;
+    margin-top: 5px;
+    color: rgb(109, 108, 108);
+    height: 50px;
+    width: 80px;
+    font-size: 90%;
+    background-color: rgb(44, 44, 44);
+    border-radius: 7px;
+    border-color: rgb(109, 108, 108);
+}
+
+
+.channel-ignore-button.on {
+    background-color: rgb(168, 168, 168);
+    color: rgb(1, 12, 114);
+}
+
 .channel-body.with-snaps .channel-pgm-button, .channel-body.with-snaps .channel-pst-button, .channel-body.with-snaps .channel-pfl-button {
     height: 40px;
 }

src/assets/css/Channels.css

@@ -14,7 +14,7 @@
     width: 100px;
     min-height: 899px;
     color: white;
-    background: linear-gradient(#2f2f2f 0px,#2f2f2f 730px, rgb(0, 0, 0) 1px, #2f2f2f 740px, #2f2f2f 100%);
+    background: linear-gradient(#2f2f2f 0px,#2f2f2f 790px, rgb(0, 0, 0) 1px, #2f2f2f 800px, #2f2f2f 100%);
     margin: 4px;
     border-radius: 9px;
     border-color: rgb(80, 80, 80);

src/assets/css/VuMeter.css

@@ -1,6 +1,6 @@
 .vumeter-body {
     position: absolute;
-    top: 50px;
+    top: 110px;
     width: 24px;
     margin-top: 15px;
     margin-left: 5px;

src/components/Channel.tsx

@@ -9,7 +9,7 @@ import ReactSlider from 'react-slider'
 
 //assets:
 import '../assets/css/Channel.css';
-import { SOCKET_TOGGLE_PGM, SOCKET_TOGGLE_VO, SOCKET_TOGGLE_PST, SOCKET_TOGGLE_PFL, SOCKET_TOGGLE_MUTE, SOCKET_SET_FADERLEVEL } from '../../server/constants/SOCKET_IO_DISPATCHERS'
+import { SOCKET_TOGGLE_PGM, SOCKET_TOGGLE_VO, SOCKET_TOGGLE_PST, SOCKET_TOGGLE_PFL, SOCKET_TOGGLE_MUTE, SOCKET_SET_FADERLEVEL, SOCKET_TOGGLE_IGNORE } from '../../server/constants/SOCKET_IO_DISPATCHERS'
 import { IFader } from '../../server/reducers/fadersReducer';
 import { IChannels } from '../../server/reducers/channelsReducer';
 import { ISettings } from '../../server/reducers/settingsReducer';
@@ -43,6 +43,7 @@ class Channel extends React.Component<IChannelProps & IChannelInjectProps & Stor
             nextProps.fader.pstOn != this.props.fader.pstOn ||
             nextProps.fader.pflOn != this.props.fader.pflOn ||
             nextProps.fader.muteOn != this.props.fader.muteOn ||
+            nextProps.fader.ignoreAutomation != this.props.fader.ignoreAutomation ||
             nextProps.fader.showChannel != this.props.fader.showChannel ||
             nextProps.fader.faderLevel != this.props.fader.faderLevel ||
             nextProps.fader.label != this.props.fader.label ||
@@ -73,6 +74,10 @@ class Channel extends React.Component<IChannelProps & IChannelInjectProps & Stor
         window.socketIoClient.emit( SOCKET_TOGGLE_MUTE, this.faderIndex)
     }
 
+    handleIgnore() {
+        window.socketIoClient.emit( SOCKET_TOGGLE_IGNORE, this.faderIndex)
+    }
+
     handleLevel(event: any) {
         window.socketIoClient.emit( SOCKET_SET_FADERLEVEL, 
             {
@@ -198,6 +203,22 @@ class Channel extends React.Component<IChannelProps & IChannelInjectProps & Stor
         )
     }
 
+
+    ignoreButton = () => {
+        return (
+            <button
+                className={ClassNames("channel-ignore-button", {
+                    'on': this.props.fader.ignoreAutomation
+                })}
+                onClick={event => {
+                    this.handleIgnore();
+                }}
+            >
+            MANUEL
+            </button>
+        )
+    }
+
     muteButton = () => {
         return (
             <button
@@ -222,8 +243,10 @@ class Channel extends React.Component<IChannelProps & IChannelInjectProps & Stor
                 className={
                     ClassNames("channel-body", {
                     "with-pfl": this.props.settings.showPfl,
-                    "mute-on": this.props.fader.muteOn
+                    "mute-on": this.props.fader.muteOn,
+                    "ignore-on": this.props.fader.ignoreAutomation,
                 })}>
+                {this.ignoreButton()}
                 {this.muteButton()}
                 <br/>
                 <h4 className="channel-zero-indicator">_____</h4>