dev@347: import {
dev@347:   Component,
dev@354:   Input,
dev@357:   ChangeDetectionStrategy
dev@347: } from '@angular/core';
dev@347: import wavesUI from 'waves-ui-piper';
dev@488: import {PlayheadRenderer, WavesComponent} from '../waves-base.component';
dev@347: 
dev@347: 
dev@347: @Component({
dev@347:   selector: 'ugly-waveform',
dev@355:   templateUrl: '../waves-template.html',
dev@357:   styleUrls: ['../waves-template.css'],
dev@405:   changeDetection: ChangeDetectionStrategy.OnPush,
dev@405:   providers: [
dev@488:     {provide: PlayheadRenderer, useExisting: WaveformComponent },
dev@405:     {provide: WavesComponent, useExisting: WaveformComponent}
dev@405:   ]
dev@347: })
dev@383: export class WaveformComponent extends WavesComponent<AudioBuffer> {
dev@347:   @Input() set audioBuffer(buffer: AudioBuffer) {
dev@414:     this.duration = buffer.duration;
dev@383:     this.timeline.pixelsPerSecond = this.timeline.visibleWidth / buffer.duration;
dev@383:     this.feature = buffer;
dev@347:   }
dev@347: 
dev@383:   protected get featureLayers(): Layer[] {
dev@383:     const nChannels = this.feature.numberOfChannels;
dev@383:     const totalWaveHeight = this.height * 0.9;
dev@383:     const waveHeight = totalWaveHeight / nChannels;
dev@383: 
dev@383:     const channelLayers: Layer[] = [];
dev@383:     for (let ch = 0; ch < nChannels; ++ch) {
dev@383:       channelLayers.push(new wavesUI.helpers.WaveformLayer(this.feature, {
dev@383:           top: (this.height - totalWaveHeight) / 2 + waveHeight * ch,
dev@383:           height: waveHeight,
dev@383:           color: this.colour,
dev@383:           channel: ch
dev@383:         })
dev@383:       );
dev@347:     }
dev@383:     return channelLayers;
dev@347:   }
dev@347: }