changeset 389:29b817e49a22

Introduce interface VerticallyBounded, which describes a component with a vertical range and the ability to render a scale on itself. VerticallyBoundedWavesComponent partially implements this interface, in that it adds a ScaleLayer to itself - derived instances provide the means of obtaining the scale.
author Lucas Thompson <dev@lucas.im>
date Thu, 01 Jun 2017 10:04:41 +0100
parents 5f775358c3cf
children 26ca17e67364
files src/app/visualisations/waves-base.component.ts
diffstat 1 files changed, 27 insertions(+), 7 deletions(-) [+]
line wrap: on
line diff
--- a/src/app/visualisations/waves-base.component.ts	Thu Jun 01 10:02:37 2017 +0100
+++ b/src/app/visualisations/waves-base.component.ts	Thu Jun 01 10:04:41 2017 +0100
@@ -10,6 +10,12 @@
 
 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];
+  abstract renderScale(range: [number, number]): void;
+}
+
 export abstract class WavesComponent<T extends ShapedFeatureData | AudioBuffer>
   implements AfterViewInit {
   @ViewChild('track') trackContainer: ElementRef;
@@ -63,7 +69,7 @@
     this.clearTimeline();
     const layers = this.featureLayers;
     for (const layer of layers) {
-      this.addLayer(layer, this.waveTrack, this.timeline.timeContext);
+      this.addLayer(layer);
     }
     if (this.postAddMap) {
       layers.forEach(this.postAddMap);
@@ -123,22 +129,21 @@
       height: this.height,
       color: '#b0b0b0'
     });
-    this.addLayer(timeAxis, this.waveTrack, this.timeline.timeContext, true);
+    this.addLayer(timeAxis, true);
     this.timeline.state = new Waves.states.CenteredZoomState(this.timeline);
     this.timeline.tracks.update(); // TODO this is problematic, shared state across components
   }
 
 
   // TODO can likely use methods in waves-ui directly
-  private addLayer(layer: Layer,
-                   track: Track,
-                   timeContext: any,
-                   isAxis: boolean = false): void {
+  protected addLayer(layer: Layer,
+                     isAxis: boolean = false): void {
+    const timeContext = this.timeline.timeContext;
     if (!layer.timeContext) {
       layer.setTimeContext(isAxis ?
         timeContext : new Waves.core.LayerTimeContext(timeContext));
     }
-    track.add(layer);
+    this.waveTrack.add(layer);
     this.layers.push(layer);
     layer.render();
     layer.update();
@@ -168,3 +173,18 @@
     }
   }
 }
+
+export abstract class VerticallyBoundedWavesComponent
+<T extends ShapedFeatureData> extends WavesComponent<T>
+  implements VerticallyBounded {
+  abstract range: [number, number];
+
+  renderScale(range: [number, number]): void {
+    this.addLayer(new Waves.helpers.ScaleLayer({
+      tickColor: this.colour,
+      textColor: this.colour,
+      height: this.height,
+      yDomain: range
+    }));
+  }
+}