Mercurial > hg > ugly-duckling
changeset 389:29b817e49a22
Introduce interface VerticallyBounded, which describes a component with a vertical range and the ability to render a scale on itself. VerticallyBoundedWavesComponent partially implements this interface, in that it adds a ScaleLayer to itself - derived instances provide the means of obtaining the scale.
author | Lucas Thompson <dev@lucas.im> |
---|---|
date | Thu, 01 Jun 2017 10:04:41 +0100 |
parents | 5f775358c3cf |
children | 26ca17e67364 |
files | src/app/visualisations/waves-base.component.ts |
diffstat | 1 files changed, 27 insertions(+), 7 deletions(-) [+] |
line wrap: on
line diff
--- a/src/app/visualisations/waves-base.component.ts Thu Jun 01 10:02:37 2017 +0100 +++ b/src/app/visualisations/waves-base.component.ts Thu Jun 01 10:04:41 2017 +0100 @@ -10,6 +10,12 @@ const trackIdGenerator = countingIdProvider(0); +// has to be an abstract class vs as interface for Angular's DI +export abstract class VerticallyBounded { + abstract get range(): [number, number]; + abstract renderScale(range: [number, number]): void; +} + export abstract class WavesComponent<T extends ShapedFeatureData | AudioBuffer> implements AfterViewInit { @ViewChild('track') trackContainer: ElementRef; @@ -63,7 +69,7 @@ this.clearTimeline(); const layers = this.featureLayers; for (const layer of layers) { - this.addLayer(layer, this.waveTrack, this.timeline.timeContext); + this.addLayer(layer); } if (this.postAddMap) { layers.forEach(this.postAddMap); @@ -123,22 +129,21 @@ height: this.height, color: '#b0b0b0' }); - this.addLayer(timeAxis, this.waveTrack, this.timeline.timeContext, true); + this.addLayer(timeAxis, true); this.timeline.state = new Waves.states.CenteredZoomState(this.timeline); this.timeline.tracks.update(); // TODO this is problematic, shared state across components } // TODO can likely use methods in waves-ui directly - private addLayer(layer: Layer, - track: Track, - timeContext: any, - isAxis: boolean = false): void { + protected addLayer(layer: Layer, + isAxis: boolean = false): void { + const timeContext = this.timeline.timeContext; if (!layer.timeContext) { layer.setTimeContext(isAxis ? timeContext : new Waves.core.LayerTimeContext(timeContext)); } - track.add(layer); + this.waveTrack.add(layer); this.layers.push(layer); layer.render(); layer.update(); @@ -168,3 +173,18 @@ } } } + +export abstract class VerticallyBoundedWavesComponent +<T extends ShapedFeatureData> extends WavesComponent<T> + implements VerticallyBounded { + abstract range: [number, number]; + + renderScale(range: [number, number]): void { + this.addLayer(new Waves.helpers.ScaleLayer({ + tickColor: this.colour, + textColor: this.colour, + height: this.height, + yDomain: range + })); + } +}