annotate src/app/visualisations/vertical-scale.component.ts @ 488:64ed45a0bad3
Introduce PlayheadRenderer, implement in the waves base. Make VerticallyBounded and VerticalScaleRenderer generic and remove bin equivalents. Forward calls for a PlayheadRenderer from VerticalScaleComponent on to its children. Also update other components accordingly.
author |
Lucas Thompson <dev@lucas.im> |
date |
Wed, 05 Jul 2017 18:42:12 +0100 |
parents |
40ea40ebc2b3 |
children |
ab43880f1cd5 |
rev |
line source |
dev@388
|
1 /**
|
dev@388
|
2 * Created by lucas on 01/06/2017.
|
dev@388
|
3 */
|
dev@488
|
4 import {
|
dev@488
|
5 PlayheadManager,
|
dev@488
|
6 PlayheadRenderer,
|
dev@488
|
7 VerticalScaleRenderer
|
dev@488
|
8 } from './waves-base.component';
|
dev@388
|
9 import {
|
dev@388
|
10 ChangeDetectionStrategy,
|
dev@388
|
11 Component,
|
dev@388
|
12 ContentChildren,
|
dev@388
|
13 QueryList,
|
dev@388
|
14 AfterViewInit
|
dev@393
|
15 } from '@angular/core';
|
dev@388
|
16
|
dev@388
|
17 @Component({
|
dev@388
|
18 selector: 'ugly-vertical-scale',
|
dev@388
|
19 template: '<ng-content></ng-content>',
|
dev@488
|
20 changeDetection: ChangeDetectionStrategy.OnPush,
|
dev@488
|
21 providers: [
|
dev@488
|
22 {provide: PlayheadRenderer, useExisting: VerticalScaleComponent }
|
dev@488
|
23 ]
|
dev@388
|
24 })
|
dev@488
|
25 export class VerticalScaleComponent implements AfterViewInit, PlayheadRenderer {
|
dev@388
|
26
|
dev@393
|
27 @ContentChildren(
|
dev@393
|
28 VerticalScaleRenderer
|
dev@488
|
29 ) bounded: QueryList<VerticalScaleRenderer<any>>;
|
dev@488
|
30 @ContentChildren(
|
dev@488
|
31 PlayheadRenderer
|
dev@488
|
32 ) seekable: QueryList<PlayheadRenderer>;
|
dev@488
|
33 protected cachedRange: any;
|
dev@388
|
34
|
dev@388
|
35 ngAfterViewInit(): void {
|
dev@388
|
36 this.bounded.forEach(component => {
|
dev@403
|
37 this.cachedRange = component.range;
|
dev@403
|
38 if (this.cachedRange) {
|
dev@403
|
39 component.renderScale(this.cachedRange);
|
dev@388
|
40 }
|
dev@388
|
41 });
|
dev@388
|
42 }
|
dev@488
|
43
|
dev@488
|
44 renderPlayhead(initialTime: number, colour: string): PlayheadManager {
|
dev@488
|
45 const rendered = this.seekable
|
dev@488
|
46 .filter(x => x !== this) // why does QueryList consider itself as a child?
|
dev@488
|
47 .map(component => component.renderPlayhead(initialTime, colour));
|
dev@488
|
48 return {
|
dev@488
|
49 update: (time: number) => {
|
dev@488
|
50 rendered.forEach(component => component.update(time));
|
dev@488
|
51 },
|
dev@488
|
52 remove: () => rendered.map(component => component.remove)
|
dev@488
|
53 };
|
dev@488
|
54 }
|
dev@388
|
55 }
|