feat: custom pages menu - realtime update of fader config in GUI

olzzon · Oct 22, 2020 · 4f4c542 · 4f4c542
1 parent 5d7bf9a
commit 4f4c542
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 58 deletions.
diff --git a/client/components/Channel.tsx b/client/components/Channel.tsx
@@ -372,55 +372,6 @@ class Channel extends React.Component<
             </div>
         )
     }
-
-    DONOTUSE_render() {
-        return this.props.fader.showChannel === false ? null : (
-            <div
-                className={ClassNames('channel-body', {
-                    'with-pfl': this.props.settings.showPfl,
-                    'pgm-on': this.props.fader.pgmOn,
-                    'vo-on': this.props.fader.voOn,
-                    'mute-on': this.props.fader.muteOn,
-                    'ignore-on': this.props.fader.ignoreAutomation,
-                    'not-found': this.props.fader.disabled,
-                })}
-                ref={this._domRef}
-            >
-                {this.ignoreButton()}
-                {this.muteButton()}
-                {/* {this.props.fader.faderLevel} */}
-                <br />
-                <h4 className="channel-zero-indicator">_____</h4>
-                {this.fader()}
-                <VuMeter faderIndex={this.faderIndex} />
-                <br />
-                {this.pgmButton()}
-                <br />
-                {this.props.settings.automationMode ? (
-                    <React.Fragment>
-                        {this.voButton()}
-                        <br />
-                    </React.Fragment>
-                ) : null}
-                {!this.props.settings.showPfl ? (
-                    <React.Fragment>
-                        {this.pstButton()}
-                        <br />
-                    </React.Fragment>
-                ) : null}
-                {this.props.settings.showPfl ? (
-                    <React.Fragment>
-                        {this.pflButton()}
-                        <br />
-                    </React.Fragment>
-                ) : null}
-                <React.Fragment>
-                    {this.chanStripButton()}
-                    <br />
-                </React.Fragment>
-            </div>
-        )
-    }
 }
 
 const mapStateToProps = (state: any, props: any): IChannelInjectProps => {

diff --git a/client/components/Channels.tsx b/client/components/Channels.tsx
@@ -184,12 +184,8 @@ class Channels extends React.Component<IChannelsInjectProps & Store> {
                     <Channel faderIndex={index} key={index} />
                 ))
             case PageType.CustomPage:
-                const page = this.props.customPages.find(
-                    (item) => item.id === curPage.id
-                )
-                if (!page) return
-
-                return page.faders
+                let pageIndex: number = this.props.customPages.map((item: ICustomPages) => item.id).indexOf(curPage.id || '');
+                return this.props.customPages[pageIndex].faders
                     .filter((value) => {
                         return (
                             value >= 0 &&
@@ -199,8 +195,8 @@ class Channels extends React.Component<IChannelsInjectProps & Store> {
                     .map((faderIndex, index) => {
                         return (
                             <Channel
+                                key={faderIndex}
                                 faderIndex={faderIndex}
-                                key={page.id + index}
                             />
                         )
                     })

diff --git a/storage/pages.json b/storage/pages.json
@@ -1,4 +1,4 @@
 [
-    { "id": "example", "label": "OK", "faders": [0, 1] },
-    { "id": "studio", "label": "Studier", "faders": [0, 1, 3, 4, 9, 11] }
+    { "id": "example", "label": "LIVE", "faders": [2, 3] },
+    { "id": "studio", "label": "STUDIO", "faders": [0, 1, 4, 5, 9, 11] }
 ]