WIP integrate VU into masterchannel

packages/mixer-connection/src/lib/facade/delayable-master-channel.ts

@@ -6,6 +6,7 @@ import { select, selectDelayValue } from '../state/state-selectors';
 import { ChannelType } from '../types';
 import { sanitizeDelayValue } from '../utils/value-converters/value-converters';
 import { MasterChannel } from './master-channel';
+import { VuProcessor } from '../state/vu-processor';
 
 /**
  * Represents a channel on the master bus that can be delayed (input, line and aux)
@@ -17,8 +18,14 @@ export class DelayableMasterChannel extends MasterChannel {
   /** default delay value (ms) for input channels */
   private delayMaxValueMs = 250;
 
-  constructor(conn: MixerConnection, store: MixerStore, channelType: ChannelType, channel: number) {
-    super(conn, store, channelType, channel);
+  constructor(
+    conn: MixerConnection,
+    store: MixerStore,
+    vuProcessor: VuProcessor,
+    channelType: ChannelType,
+    channel: number
+  ) {
+    super(conn, store, vuProcessor, channelType, channel);
 
     // AUX master channels can be delayed by 500 ms, input channels just allow 250 ms
     if (channelType === 'a') {

packages/mixer-connection/src/lib/facade/master-bus.ts

@@ -18,6 +18,7 @@ import { sanitizeDelayValue } from '../utils/value-converters/value-converters';
 import { DelayableMasterChannel } from './delayable-master-channel';
 import { FadeableChannel, PannableChannel } from './interfaces';
 import { MasterChannel } from './master-channel';
+import { VuProcessor } from '../state/vu-processor';
 
 /**
  * Represents the master bus
@@ -42,7 +43,11 @@ export class MasterBus implements FadeableChannel, PannableChannel {
 
   private transitionSources$ = new Subject<TransitionSource>();
 
-  constructor(private conn: MixerConnection, private store: MixerStore) {
+  constructor(
+    private conn: MixerConnection,
+    private store: MixerStore,
+    private vuProcessor: VuProcessor
+  ) {
     // create transition steps and set master fader level accordingly
     sourcesToTransition(this.transitionSources$, this.faderLevel$, conn).subscribe(v =>
       this.setFaderLevelRaw(v)
@@ -56,55 +61,55 @@ export class MasterBus implements FadeableChannel, PannableChannel {
    * @param channel Channel number
    */
   input(channel: number) {
-    return new DelayableMasterChannel(this.conn, this.store, 'i', channel);
+    return new DelayableMasterChannel(this.conn, this.store, this.vuProcessor, 'i', channel);
   }
 
   /**
    * Get line channel on the master bus
    * @param channel Channel number
    */
   line(channel: number) {
-    return new DelayableMasterChannel(this.conn, this.store, 'l', channel);
+    return new DelayableMasterChannel(this.conn, this.store, this.vuProcessor, 'l', channel);
   }
 
   /**
    * Get player channel on the master bus
    * @param channel Channel number
    */
   player(channel: number) {
-    return new MasterChannel(this.conn, this.store, 'p', channel);
+    return new MasterChannel(this.conn, this.store, this.vuProcessor, 'p', channel);
   }
 
   /**
    * Get AUX output channel on the master bus
    * @param channel Channel number
    */
   aux(channel: number) {
-    return new DelayableMasterChannel(this.conn, this.store, 'a', channel);
+    return new DelayableMasterChannel(this.conn, this.store, this.vuProcessor, 'a', channel);
   }
 
   /**
    * Get FX channel on the master bus
    * @param channel Channel number
    */
   fx(channel: number) {
-    return new MasterChannel(this.conn, this.store, 'f', channel);
+    return new MasterChannel(this.conn, this.store, this.vuProcessor, 'f', channel);
   }
 
   /**
    * Get sub group channel on the master bus
    * @param channel Channel number
    */
   sub(channel: number) {
-    return new MasterChannel(this.conn, this.store, 's', channel);
+    return new MasterChannel(this.conn, this.store, this.vuProcessor, 's', channel);
   }
 
   /**
    * Get VCA channel on the master bus
    * @param channel Channel number
    */
   vca(channel: number) {
-    return new MasterChannel(this.conn, this.store, 'v', channel);
+    return new MasterChannel(this.conn, this.store, this.vuProcessor, 'v', channel);
   }
 
   /** Master actions */

packages/mixer-connection/src/lib/facade/master-channel.ts

@@ -1,4 +1,4 @@
-import { map, take } from 'rxjs';
+import { filter, map, share, take } from 'rxjs';
 
 import { MixerConnection } from '../mixer-connection';
 import { MixerStore } from '../state/mixer-store';
@@ -12,6 +12,7 @@ import {
   linearMappingRangeToValue,
   linearMappingValueToRange,
 } from '../utils/value-converters/value-converters';
+import { VuProcessor } from '../state/vu-processor';
 
 /**
  * Represents a channel on the master bus
@@ -58,7 +59,37 @@ export class MasterChannel extends Channel implements PannableChannel {
     selectRawValue<number>(`${this.fullChannelId}.mtkrec`)
   );
 
-  constructor(conn: MixerConnection, store: MixerStore, channelType: ChannelType, channel: number) {
+  private vuData$ = this.vuProcessor.vuData$.pipe(
+    map(data => {
+      switch (this.channelType) {
+        case 'i':
+          return data.inputs;
+        case 'l':
+          return data.line;
+        case 'p':
+          return data.media;
+        default:
+          return null;
+      }
+    }),
+    filter(e => !!e),
+    map(data => data[this.channel - 1]),
+    share()
+  );
+
+  vu = {
+    pre: this.vuData$.pipe(map(d => d.vuPre)),
+    post: this.vuData$.pipe(map(d => d.vuPost)),
+    postFader: this.vuData$.pipe(map(d => d.vuPostFader)),
+  };
+
+  constructor(
+    conn: MixerConnection,
+    store: MixerStore,
+    private vuProcessor: VuProcessor,
+    channelType: ChannelType,
+    channel: number
+  ) {
     super(conn, store, channelType, channel);
 
     // create list of channel IDs that are linked with this channel

packages/mixer-connection/src/lib/soundcraft-ui.ts

@@ -25,7 +25,7 @@ export class SoundcraftUI {
   status$ = this.conn.status$;
 
   /** Master bus */
-  master = new MasterBus(this.conn, this.store);
+  master = new MasterBus(this.conn, this.store, this.vuProcessor);
 
   /** Media player */
   player = new Player(this.conn, this.store);

packages/mixer-connection/src/lib/state/vu-processor.ts

@@ -1,4 +1,4 @@
-import { filter, map, share, throttleTime } from 'rxjs';
+import { filter, map, share } from 'rxjs';
 
 import { MixerConnection } from '../mixer-connection';
 

packages/testbed/src/app/pages/vu/vu.component.html

@@ -1,9 +1,9 @@
 @for (c of channels; track c) {
 <h2 class="mt-4">{{ c.label }}</h2>
 
-<sui-vu-meter [value]="(c.vuData | async)?.vuPre" mode="pre"></sui-vu-meter>
-<sui-vu-meter [value]="(c.vuData | async)?.vuPost" mode="post"></sui-vu-meter>
-<sui-vu-meter [value]="(c.vuData | async)?.vuPostFader" mode="postFader"></sui-vu-meter>
+<sui-vu-meter [value]="c.channel.vu.pre | async" mode="pre"></sui-vu-meter>
+<sui-vu-meter [value]="c.channel.vu.post | async" mode="post"></sui-vu-meter>
+<sui-vu-meter [value]="c.channel.vu.postFader | async" mode="postFader"></sui-vu-meter>
 }
 
 <h2 class="mt-5">Full VU state</h2>

packages/testbed/src/app/pages/vu/vu.component.ts

@@ -12,13 +12,13 @@ import { VuMeterComponent } from '../../ui/vu-meter/vu-meter.component';
   imports: [AsyncPipe, JsonPipe, VuMeterComponent],
 })
 export class VuComponent {
-  vuProcessor = inject(ConnectionService).conn.vuProcessor;
+  cs = inject(ConnectionService);
 
-  vuData$ = this.vuProcessor.vuData$;
+  vuData$ = this.cs.conn.vuProcessor.vuData$;
   fullStateVisible = signal(false);
 
   channels = [
-    { vuData: this.vuProcessor.input(1), label: 'Input 1' },
-    { vuData: this.vuProcessor.input(2), label: 'Input 2' },
+    { channel: this.cs.conn.master.input(1), label: 'Input 1' },
+    { channel: this.cs.conn.master.input(2), label: 'Input 2' },
   ];
 }

packages/testbed/src/app/ui/vu-meter/vu-meter.component.scss

@@ -34,6 +34,6 @@ div.meter {
     height: 100%;
     float: right;
     background: #aaa;
-    transition: width 10ms;
+    // transition: width 10ms;
   }
 }