Mercurial > hg > ugly-duckling
diff src/app/visualisations/regions/regions.component.ts @ 480:0fbba61603b3
Begin to add regions component
author | Chris Cannam <cannam@all-day-breakfast.com> |
---|---|
date | Thu, 20 Jul 2017 16:15:40 +0100 |
parents | |
children | 7253d73ac7c9 |
line wrap: on
line diff
--- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/src/app/visualisations/regions/regions.component.ts Thu Jul 20 16:15:40 2017 +0100 @@ -0,0 +1,68 @@ +/** + * Created by lucast on 31/05/2017. + */ +import { + InspectableVerticallyBoundedComponent, + VerticallyBounded, + VerticalScaleRenderer, + VerticalValueInspectorRenderer, + WavesComponent +} from '../waves-base.component'; +import { + ChangeDetectionStrategy, + Component, + Input, +} from '@angular/core'; +import {Region} from '../FeatureUtilities'; +import Waves from 'waves-ui-piper'; + +@Component({ + selector: 'ugly-regions', + templateUrl: '../waves-template.html', + styleUrls: ['../waves-template.css'], + changeDetection: ChangeDetectionStrategy.OnPush, + providers: [ + { provide: VerticallyBounded, useExisting: RegionsComponent }, + { provide: VerticalScaleRenderer, useExisting: RegionsComponent }, + {provide: VerticalValueInspectorRenderer, useExisting: RegionsComponent }, + {provide: WavesComponent, useExisting: RegionsComponent} + ] +}) +export class RegionsComponent extends InspectableVerticallyBoundedComponent<Region[]> { + private currentVerticalRange: [number, number]; + + get range(): [number, number] { + return this.currentVerticalRange; + } + + @Input() set regions(regions: Region[]) { + this.feature = regions; + } + + protected get featureLayers(): Layer[] { + this.currentVerticalRange = findVerticalRange(this.feature); + return [ + new Waves.helpers.PianoRollLayer( + this.feature, + { + height: this.height, + color: this.colour, + yDomain: this.currentVerticalRange + } + ) + ]; + } +} + +// TODO there might be scope to create a generic utility function like this +function findVerticalRange(regions: Region[]): [number, number] { + let [min, max] = regions.reduce((acc, region) => { + const [min, max] = acc; + return [Math.min (min, region.value), Math.max (max, region.value)]; + }, [Infinity, -Infinity]); + if (min === Infinity) { + min = 0; + max = 1; + } + return [ min, max ]; +}