changeset 254:ff71da632fbb

Add highlight layer

--- a/src/app/waveform/waveform.component.ts	Thu Apr 27 13:14:02 2017 +0100
+++ b/src/app/waveform/waveform.component.ts	Thu Apr 27 16:41:04 2017 +0100
@@ -168,6 +168,7 @@
   private _isOneShotExtractor: boolean;
   private _isSeeking: boolean;
   private cursorLayer: any;
+  private highlightLayer: any;
   private layers: Layer[];
   private featureExtractionSubscription: Subscription;
   private playingStateSubscription: Subscription;
@@ -202,6 +203,7 @@
     this.audioBuffer = undefined;
     this.timeline = undefined;
     this.cursorLayer = undefined;
+    this.highlightLayer = undefined;
     this.isPlaying = false;
     this.isLoading = true;
   }
@@ -629,7 +631,8 @@
         const plotData = [...featureData].map((feature, i) => {
           return {
             cx: i * stepDuration,
-            cy: feature * normalisationFactor
+            cy: feature * normalisationFactor,
+            value: feature
           };
         });
 
@@ -642,6 +645,16 @@
           waveTrack,
           this.timeline.timeContext
         );
+        this.highlightLayer = new wavesUI.helpers.HighlightLayer(lineLayer, {
+          color: colour,
+          opacity: 0.7,
+          height: height
+        });
+        this.addLayer(
+          this.highlightLayer,
+          waveTrack,
+          this.timeline.timeContext
+        );
         break;
       }
       case 'list': {
@@ -801,6 +814,11 @@
         this.cursorLayer.currentPosition = currentTime;
         this.cursorLayer.update();
 
+        if (typeof(this.highlightLayer) !== 'undefined') {
+          this.highlightLayer.currentPosition = currentTime;
+          this.highlightLayer.update();
+        }
+
         const currentOffset = this.timeline.timeContext.offset;
         const offsetTimestamp = currentOffset
           + currentTime;