feat: refactor - all snaps code from old implementation removed

olzzon · Mar 16, 2021 · 62d2ea2 · 62d2ea2
1 parent c8272dc
commit 62d2ea2
Show file tree

Hide file tree

Showing 11 changed files with 162 additions and 466 deletions.
diff --git a/client/assets/css/Channels.css b/client/assets/css/Channels.css
@@ -1,138 +1,135 @@
-.channels-body {
-    display: flex;
-    flex-direction: row;
-    background-color: black;
-    min-height: 760px;
-}
-
-.channels-body > .channels-body-inner {
-    display: flex;
-    flex-direction: row;
-    flex-grow: 2;
-    overflow-x: auto;
-    height: calc(100vh);
-}
-
-.channels-body > .closedChanStrip {
-    /* margin-left: -630px; */
-    transition: transform 300ms;
-    position: absolute;
-    z-index: 2;
-    transform: translateX(-100%);
-}
-
-.channels-body > .openChanStrip {
-    /* margin-left: 0px;
-    transition: margin 800ms; */
-    transition: transform 300ms;
-    transform: unset;
-}
-
-.button {
-    outline: none;
-    -moz-outline: none;
-    color: white;
-    height: 90px;
-    width: 90px;
-    border-color: rgb(71, 71, 71);
-    background-color: rgb(53, 53, 53);
-    margin-left: 5px;
-    margin-right: 4px;
-    margin-top: 10px;
-    border-radius: 7px;
-}
-.button.half {
-    height: 60px;
-}
-.button.active {
-    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;
-
-    width: 100px;
-    min-height: 950px;
-    max-height: calc(100vh - 10px);
-    color: white;
-    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);
-    border-style: solid;
-    border-width: 1px;
-}
-.channels-mix-body > .mid {
-    flex-grow: 2;
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-}
-.channels-mix-body > .bot {
-    overflow-y: auto;
-}
-
-.channels-show-mixer-online {
-    background-color: rgb(219, 1, 1);
-}
-
-.channels-show-mixer-online.connected {
-    background-color: rgb(9, 107, 0);
-}
-
-.channels-show-snaps-button {
-}
-
-.channels-show-settings-button {
-}
-.channels-show-settings-button.active {
-    background-color: #2f475b;
-}
-
-.channels-show-storage-button {
-}
-
-.channels-mix-button {
-    background-color: rgb(65, 65, 65);
-}
-
-.channels-clear-button {
-    background-color: rgb(19, 19, 19);
-}
-
-.channels-snap-mix-body {
-    /* margin-top: 58px; */
-}
-
-.channels-snap-mix-line {
-    margin-top: 4px;
-    background-color: #2b2b2b;
-}
-
-.channels-snap-mix-button {
-    background-color: rgb(199, 202, 0);
-    color: rgb(44, 44, 44);
-    margin-left: 20px;
-    height: 25px;
-    width: 60px;
-    border-color: rgb(99, 99, 99);
-    white-space: nowrap;
-}
-
-.channels-snap-mix-line:last-of-type {
-    margin-bottom: 51px;
-}
+.channels-body {
+    display: flex;
+    flex-direction: row;
+    background-color: black;
+    min-height: 760px;
+}
+
+.channels-body > .channels-body-inner {
+    display: flex;
+    flex-direction: row;
+    flex-grow: 2;
+    overflow-x: auto;
+    height: calc(100vh);
+}
+
+.channels-body > .closedChanStrip {
+    /* margin-left: -630px; */
+    transition: transform 300ms;
+    position: absolute;
+    z-index: 2;
+    transform: translateX(-100%);
+}
+
+.channels-body > .openChanStrip {
+    /* margin-left: 0px;
+    transition: margin 800ms; */
+    transition: transform 300ms;
+    transform: unset;
+}
+
+.button {
+    outline: none;
+    -moz-outline: none;
+    color: white;
+    height: 90px;
+    width: 90px;
+    border-color: rgb(71, 71, 71);
+    background-color: rgb(53, 53, 53);
+    margin-left: 5px;
+    margin-right: 4px;
+    margin-top: 10px;
+    border-radius: 7px;
+}
+.button.half {
+    height: 60px;
+}
+.button.active {
+    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;
+
+    width: 100px;
+    min-height: 950px;
+    max-height: calc(100vh - 10px);
+    color: white;
+    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);
+    border-style: solid;
+    border-width: 1px;
+}
+.channels-mix-body > .mid {
+    flex-grow: 2;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+}
+.channels-mix-body > .bot {
+    overflow-y: auto;
+}
+
+.channels-show-mixer-online {
+    background-color: rgb(219, 1, 1);
+}
+
+.channels-show-mixer-online.connected {
+    background-color: rgb(9, 107, 0);
+}
+
+.channels-show-settings-button {
+}
+.channels-show-settings-button.active {
+    background-color: #2f475b;
+}
+
+.channels-show-storage-button {
+}
+
+.channels-mix-button {
+    background-color: rgb(65, 65, 65);
+}
+
+.channels-clear-button {
+    background-color: rgb(19, 19, 19);
+}
+
+.channels-snap-mix-body {
+    /* margin-top: 58px; */
+}
+
+.channels-snap-mix-line {
+    margin-top: 4px;
+    background-color: #2b2b2b;
+}
+
+.channels-snap-mix-button {
+    background-color: rgb(199, 202, 0);
+    color: rgb(44, 44, 44);
+    margin-left: 20px;
+    height: 25px;
+    width: 60px;
+    border-color: rgb(99, 99, 99);
+    white-space: nowrap;
+}
+
+.channels-snap-mix-line:last-of-type {
+    margin-bottom: 51px;
+}
diff --git a/client/components/Channel.tsx b/client/components/Channel.tsx
@@ -69,7 +69,6 @@ class Channel extends React.Component<
             nextProps.fader.label != this.props.fader.label ||
             nextProps.settings.mixers[0].mixerProtocol !=
                 this.props.settings.mixers[0].mixerProtocol ||
-            nextProps.settings.showSnaps != this.props.settings.showSnaps ||
             nextProps.settings.showPfl != this.props.settings.showPfl ||
             nextProps.settings.showChanStrip !=
                 this.props.settings.showChanStrip ||

diff --git a/client/components/VuMeter.tsx b/client/components/VuMeter.tsx
@@ -7,7 +7,6 @@ import '../assets/css/VuMeter.css'
 //Utils:
 
 export interface IVuMeterInjectedProps {
-    showSnaps: boolean
     faderIndex: number
     channel: number
 }
@@ -46,7 +45,7 @@ export class VuMeter extends React.PureComponent<IVuMeterInjectedProps> {
 
     totalHeight = () => {
         return (
-            ((this.props.showSnaps ? 1 : 2) * 200) /
+            (400) /
             (this.meterMax - this.meterMin)
         )
     }
@@ -221,8 +220,7 @@ export class VuMeter extends React.PureComponent<IVuMeterInjectedProps> {
 const mapStateToProps = (state: any, props: any): IVuMeterInjectedProps => {
     return {
         faderIndex: props.faderIndex,
-        channel: props.channel,
-        showSnaps: state.settings[0].showSnaps,
+        channel: props.channel
     }
 }
 

diff --git a/server/__tests__/__mocks__/parsedEmptyStore.json b/server/__tests__/__mocks__/parsedEmptyStore.json
@@ -25,7 +25,6 @@
     ],
     "settings": [
         {
-            "showSnaps": false,
             "showSettings": false,
             "showChanStrip": -1,
             "showOptions": false,
@@ -52,7 +51,6 @@
             "remoteFaderMidiInputPort": "",
             "remoteFaderMidiOutputPort": "",
             "numberOfFaders": 8,
-            "numberOfSnaps": 8,
             "voLevel": 30,
             "autoResetLevel": 5,
             "automationMode": true,