Added: Show/hide GrpChannels in settings

olzzon · May 8, 2019 · aa8e130 · aa8e130
1 parent 56868af
commit aa8e130
Show file tree

Hide file tree

Showing 3 changed files with 67 additions and 2 deletions.
diff --git a/src/components/GrpFader.js b/src/components/GrpFader.js
@@ -154,6 +154,7 @@ const mapStateToProps = (state, props) => {
     return {
         pgmOn: state.channels[0].grpFader[props.faderIndex].pgmOn,
         pstOn: state.channels[0].grpFader[props.faderIndex].pstOn,
+        showChannel: state.channels[0].grpFader[props.faderIndex].showChannel,
         faderLevel: state.channels[0].grpFader[props.faderIndex].faderLevel,
         label: state.channels[0].grpFader[props.faderIndex].label,
         mixerProtocol: state.settings[0].mixerProtocol,

diff --git a/src/components/Settings.js b/src/components/Settings.js
@@ -40,7 +40,6 @@ class Channels extends PureComponent {
         );
     }
 
-
     handleShowChannel(index, event) {
         this.props.dispatch({
             type:'SHOW_CHANNEL',
@@ -70,6 +69,36 @@ class Channels extends PureComponent {
         });
     }
 
+
+    handleShowGrpFader(index, event) {
+        this.props.dispatch({
+            type:'SHOW_GRP_FADER',
+            channel: index,
+            showChannel: event.target.checked
+        });
+    }
+
+    handleShowAllGrpFaders() {
+        this.props.store.channels[0].grpFader.map((channel, index) => {
+            this.props.dispatch({
+                type:'SHOW_GRP_FADER',
+                channel: index,
+                showChannel: true
+            });
+        });
+    }
+
+
+    handleHideAllGrpFaders() {
+        this.props.store.channels[0].grpFader.map((channel, index) => {
+            this.props.dispatch({
+                type:'SHOW_GRP_FADER',
+                channel: index,
+                showChannel: false
+            });
+        });
+    }
+
     handleSave() {
         let settingsCopy= Object.assign({}, this.state.settings);
         settingsCopy.showSettings = false;
@@ -110,6 +139,39 @@ class Channels extends PureComponent {
         )
     }
 
+
+    renderShowGrpFadersSelection() {
+        return (
+            <div className="settings-show-channel-selection">
+                <input className="settings-channels-button"
+                    onClick=
+                        {() => {
+                            this.handleShowAllGrpFaders();
+                        }}
+                    value="ALL GROUPS"
+                />
+                <input className="settings-channels-button"
+                    onClick=
+                        {() => {
+                            this.handleHideAllGrpFaders();
+                        }}
+                    value="NO GROUPS"
+                />
+                {this.props.store.channels[0].grpFader.map((channel, index) => {
+                        return <div key={index}>
+                            {channel.label != "" ? channel.label : ("GRP " + (index + 1)) }
+                            <input
+                                type="checkbox"
+                                checked={this.props.store.channels[0].grpFader[index].showChannel }
+                                onChange={(event) => this.handleShowGrpFader(index, event)}
+                            />
+                        </div>
+                    })
+                }
+            </div>
+        )
+    }
+
     render() {
         return (
             <div className="settings-body">
@@ -155,6 +217,8 @@ class Channels extends PureComponent {
                 <br/>
                 {this.renderShowChannelsSelection()}
                 <br/>
+                {this.renderShowGrpFadersSelection()}
+                <br/>
                 <input
                     className="settings-save-button"
                     onClick=

diff --git a/src/reducers/channelsReducer.js b/src/reducers/channelsReducer.js
@@ -161,7 +161,7 @@ export const channels = ((state = defaultChannelsReducerState(1), action) => {
         case 'SET_GRP_PST': //channel
             nextState[0].grpFader[action.channel].pstOn = action.pstOn;
             return nextState;
-        case 'SHOW_GRP_CHANNEL': //channel // showChannel
+        case 'SHOW_GRP_FADER': //channel // showChannel
             nextState[0].grpFader[action.channel].showChannel = action.showChannel;
             return nextState;
         default: