dev@372: /**
dev@372:  * Created by lucas on 30/05/2017.
dev@372:  */
dev@378: import {WavesComponent} from '../waves-base.component';
dev@372: import {
dev@372:   AfterViewInit,
dev@372:   ChangeDetectionStrategy,
dev@372:   Component,
dev@372:   ElementRef,
dev@372:   Input,
dev@372:   ViewChild
dev@378: } from '@angular/core';
dev@378: import {TracksFeature} from 'piper/HigherLevelUtilities';
dev@372: import Waves from 'waves-ui-piper';
dev@378: import {generatePlotData, PlotLayerData} from '../FeatureUtilities';
dev@372: 
dev@372: @Component({
dev@372:   selector: 'ugly-tracks',
dev@372:   templateUrl: '../waves-template.html',
dev@372:   styleUrls: ['../waves-template.css'],
dev@372:   changeDetection: ChangeDetectionStrategy.OnPush
dev@372: })
dev@372: export class TracksComponent extends WavesComponent implements AfterViewInit {
dev@372: 
dev@372:   @ViewChild('track') trackDiv: ElementRef;
dev@372: 
dev@372:   private mFeature: TracksFeature;
dev@372:   private currentState: PlotLayerData[];
dev@372:   private height: number; // As it stands, height is fixed. Store once onInit.
dev@372: 
dev@372:   @Input() set tracks(input: TracksFeature) {
dev@372:     this.mFeature = input;
dev@372:     this.currentState = generatePlotData(input);
dev@372:     this.update();
dev@372:   }
dev@372: 
dev@372:   get tracks(): TracksFeature {
dev@372:     return this.mFeature;
dev@372:   }
dev@372: 
dev@372:   ngAfterViewInit(): void {
dev@372:     this.height = this.trackDiv.nativeElement.getBoundingClientRect().height;
dev@372:     this.renderTimeline(this.trackDiv);
dev@372:     this.update();
dev@372:   }
dev@372: 
dev@372:   update(): void {
dev@372:     if (this.waveTrack) {
dev@372:       this.clearTimeline(this.trackDiv);
dev@372:       for (const feature of this.currentState) {
dev@372:         const lineLayer = new Waves.helpers.LineLayer(feature.data, {
dev@372:           color: this.colour,
dev@372:           height: this.height,
dev@372:           yDomain: feature.yDomain
dev@372:         });
dev@372:         this.addLayer(
dev@372:           lineLayer,
dev@372:           this.waveTrack,
dev@372:           this.timeline.timeContext
dev@372:         );
dev@372: 
dev@372:         // Set start and duration so that the highlight layer can use
dev@372:         // them to determine which line to draw values from
dev@372:         lineLayer.start = feature.startTime;
dev@372:         lineLayer.duration = feature.duration;
dev@372:         lineLayer.update(); // TODO probably better to update after all added
dev@372:       }
dev@372:     }
dev@372:   }
dev@372: }