changeset 356:b852bace6b14

Shuffle some stuff around, putting generic stuff in the base class.

--- a/src/app/visualisations/waveform/waveform.component.ts	Fri May 26 18:20:02 2017 +0100
+++ b/src/app/visualisations/waveform/waveform.component.ts	Fri May 26 18:28:54 2017 +0100
@@ -38,22 +38,13 @@
     if (this.timeline && this.waveTrack) {
       // resize
       const width = this.trackDiv.nativeElement.getBoundingClientRect().width;
-
-      this.clearTimeline();
+      this.clearTimeline(this.trackDiv);
       this.timeline.visibleWidth = width;
       this.timeline.pixelsPerSecond = width / buffer.duration;
       this.waveTrack.height = height;
     } else {
       this.renderTimeline(this.trackDiv, buffer.duration);
     }
-    this.timeline.timeContext.offset = 0.5 * this.timeline.timeContext.visibleDuration;
-
-    // time axis
-    const timeAxis = new wavesUI.helpers.TimeAxisLayer({
-      height: height,
-      color: '#b0b0b0'
-    });
-    this.addLayer(timeAxis, this.waveTrack, this.timeline.timeContext, true);
 
     const nchannels = buffer.numberOfChannels;
     const totalWaveHeight = height * 0.9;
@@ -69,7 +60,6 @@
       this.addLayer(waveformLayer, this.waveTrack, this.timeline.timeContext);
     }
 
-    this.timeline.state = new wavesUI.states.CenteredZoomState(this.timeline);
     this.waveTrack.render();
     this.waveTrack.update();
     this.ref.markForCheck();

--- a/src/app/visualisations/waves-base.component.ts	Fri May 26 18:20:02 2017 +0100
+++ b/src/app/visualisations/waves-base.component.ts	Fri May 26 18:28:54 2017 +0100
@@ -47,10 +47,11 @@
         this.timeline
       );
     }
+    this.resetTimelineState($el);
   }
 
   // TODO can likely be removed, or use waves-ui methods
-  protected clearTimeline(): void {
+  protected clearTimeline($el: ElementRef): void {
     // loop through layers and remove them, waves-ui provides methods for this but it seems to not work properly
     const timeContextChildren = this.timeline.timeContext._children;
     for (const track of this.timeline.tracks) {
@@ -69,6 +70,21 @@
         }
       }
     }
+    this.resetTimelineState($el);
+  }
+
+  private resetTimelineState($el: ElementRef): void {
+    const height = $el.nativeElement.getBoundingClientRect().height;
+    this.timeline.timeContext.offset =
+      0.5 * this.timeline.timeContext.visibleDuration;
+
+    // time axis
+    const timeAxis = new Waves.helpers.TimeAxisLayer({
+      height: height,
+      color: '#b0b0b0'
+    });
+    this.addLayer(timeAxis, this.waveTrack, this.timeline.timeContext, true);
+    this.timeline.state = new Waves.states.CenteredZoomState(this.timeline);
   }