comparison src/app/visualisations/waves-base.component.ts @ 488:64ed45a0bad3

Introduce PlayheadRenderer, implement in the waves base. Make VerticallyBounded and VerticalScaleRenderer generic and remove bin equivalents. Forward calls for a PlayheadRenderer from VerticalScaleComponent on to its children. Also update other components accordingly.

 import {ShapedFeatureData} from './FeatureUtilities';
 
 const trackIdGenerator = countingIdProvider(0);
 
 // has to be an abstract class vs as interface for Angular's DI
-export abstract class VerticallyBounded {
-  abstract get range(): [number, number];
-}
-
-export abstract class VerticalScaleRenderer extends VerticallyBounded {
-  abstract renderScale(range: [number, number]): void;
-}
-
-export abstract class VerticallyBinned {
-  abstract get binNames(): string[];
-}
-
-export abstract class VerticalBinNameRenderer extends VerticallyBinned {
-  abstract renderNames(binNames: string[]): void;
+export abstract class VerticallyBounded<T> {
+  abstract get range(): T;
+}
+
+export abstract class VerticalScaleRenderer<T> extends VerticallyBounded<T> {
+  abstract renderScale(range: T): void;
 }
 
 export abstract class VerticalValueInspectorRenderer
-  extends VerticalScaleRenderer {
+  extends VerticalScaleRenderer<[number, number]> {
   // TODO how do I know these layers are actually 'describable'?
   abstract renderInspector(range: [number, number], unit?: string): void;
   abstract get updatePosition(): OnSeekHandler;
 }
 
+export abstract class PlayheadManager {
+  abstract update(time: number): void;
+  abstract remove(): void;
+}
+
+export abstract class PlayheadRenderer {
+  abstract renderPlayhead(initialTime: number, colour: string): PlayheadManager;
+}
+
 export type LayerRemover = () => void;
 
 export abstract class WavesComponent<T extends ShapedFeatureData | AudioBuffer>
-  implements AfterViewInit {
+  implements AfterViewInit, PlayheadRenderer {
+
   @ViewChild('track') trackContainer: ElementRef;
   @Input() set width(width: number) {
     if (this.timeline) {
       requestAnimationFrame(() => {
         this.timeline.timeContext.visibleWidth = width;

   ngAfterViewInit(): void {
     this.height =
       this.trackContainer.nativeElement.getBoundingClientRect().height;
     this.renderTimeline();
     this.update();
+  }
+
+  renderPlayhead(initialTime: number, colour: string): PlayheadManager {
+    console.warn('waves base render playhead');
+    const cursor = new Waves.helpers.CursorLayer({
+      height: this.height,
+      color: colour,
+    });
+    cursor.currentPosition = initialTime;
+    return {
+      update: currentTime => {
+        cursor.currentPosition = currentTime;
+        cursor.update();
+      },
+      remove: this.addLayer(cursor)
+    };
   }
 
   private update(): void {
     if (!this.waveTrack || !this.mFeature) {
       return;

   }
 }
 
 export abstract class VerticallyBoundedWavesComponent
 <T extends ShapedFeatureData> extends WavesComponent<T>
-  implements VerticalScaleRenderer {
+  implements VerticalScaleRenderer<[number, number]> {
   abstract range: [number, number];
 
   renderScale(range: [number, number]): void {
     this.addLayer(new Waves.helpers.ScaleLayer({
       tickColor: this.colour,

   }
 }
 
 export abstract class VerticallyBinnedWavesComponent
 <T extends ShapedFeatureData> extends WavesComponent<T>
-  implements VerticalBinNameRenderer {
-  abstract binNames: string[];
-
-  renderNames(binNames: string[]): void {
+  implements VerticalScaleRenderer<string[]> {
+  abstract range: string[];
+
+  renderScale(binNames: string[]): void {
     this.addLayer(new Waves.helpers.DiscreteScaleLayer({
       tickColor: this.colour,
       textColor: this.colour,
       height: this.height,
       binNames