comparison src/app/notebook-feed/notebook-feed.component.ts @ 464:50f61d1945db

Hook up some buttons for navigating history (undo / redo). Some refactoring to allow for the audio player to get updated as a consequence of a state change (the audio related to the current top of the stack is used).
author Lucas Thompson <dev@lucas.im>
date Fri, 30 Jun 2017 14:01:22 +0100
parents ccce2c09502e
children 3a76205e06b6
comparison
equal deleted inserted replaced
463:c9c6b01e9b4f 464:50f61d1945db
17 } from '../analysis-item/AnalysisItem'; 17 } from '../analysis-item/AnalysisItem';
18 import {Observable} from 'rxjs/Observable'; 18 import {Observable} from 'rxjs/Observable';
19 import {Dimension} from '../app.module'; 19 import {Dimension} from '../app.module';
20 import {Subscription} from 'rxjs/Subscription'; 20 import {Subscription} from 'rxjs/Subscription';
21 import {OnSeekHandler} from '../playhead/PlayHeadHelpers'; 21 import {OnSeekHandler} from '../playhead/PlayHeadHelpers';
22 import {AudioPlayerService} from '../services/audio-player/audio-player.service';
22 23
23 @Component({ 24 @Component({
24 selector: 'ugly-notebook-feed', 25 selector: 'ugly-notebook-feed',
25 templateUrl: './notebook-feed.component.html', 26 templateUrl: './notebook-feed.component.html',
26 styleUrls: ['./notebook-feed.component.css'], 27 styleUrls: ['./notebook-feed.component.css'],
27 changeDetection: ChangeDetectionStrategy.OnPush 28 changeDetection: ChangeDetectionStrategy.OnPush
28 }) 29 })
29 export class NotebookFeedComponent implements OnDestroy { 30 export class NotebookFeedComponent implements OnDestroy {
30 @Input() analyses: Item[]; 31 @Input() set analyses(analyses: Item[]) {
31 @Input() set rootAudioUri(uri: string) { 32 const front = analyses[0];
32 this._rootAudioUri = uri; 33 if (analyses !== this.mAnalyses) {
34 if (front && getRootUri(front) !== this.currentAudioUri) {
35 this.audioService.unload();
36 this.audioService.loadAudioFromUri(getRootUri(front));
37 }
38 }
39 this.mAnalyses = analyses;
40 if (front) {
41 this.currentAudioUri = this.getCurrentAudioUri();
42 }
33 } 43 }
44
45 get analyses(): Item[] {
46 return this.mAnalyses;
47 }
48
34 @Input() onSeek: OnSeekHandler; 49 @Input() onSeek: OnSeekHandler;
35 @Output() removeItem: EventEmitter<Item>; 50 @Output() removeItem: EventEmitter<Item>;
36 51
37 get rootAudioUri(): string {
38 return this._rootAudioUri;
39 }
40 private _rootAudioUri: string;
41 private resizeSubscription: Subscription; 52 private resizeSubscription: Subscription;
42 private width: number; 53 private width: number;
43 private lastWidth: number; 54 private lastWidth: number;
44 private timelines: Map<string, Timeline>; 55 private timelines: Map<string, Timeline>;
56 private mAnalyses: Item[];
57 private currentAudioUri: string;
45 58
46 constructor( 59 constructor(
47 private ref: ChangeDetectorRef, 60 private ref: ChangeDetectorRef,
48 @Inject('DimensionObservable') private onResize: Observable<Dimension> 61 @Inject('DimensionObservable') private onResize: Observable<Dimension>,
62 private audioService: AudioPlayerService
49 ) { 63 ) {
50 this.removeItem = new EventEmitter<Item>(); 64 this.removeItem = new EventEmitter<Item>();
51 this.timelines = new Map(); 65 this.timelines = new Map();
52 this.onResize.subscribe(dim => { 66 this.onResize.subscribe(dim => {
53 this.lastWidth = this.width; 67 this.lastWidth = this.width;
84 isAudioItem(item: Item): boolean { 98 isAudioItem(item: Item): boolean {
85 return isLoadedRootAudioItem(item); 99 return isLoadedRootAudioItem(item);
86 } 100 }
87 101
88 isActiveItem(item: Item): boolean { 102 isActiveItem(item: Item): boolean {
89 return this.rootAudioUri === getRootUri(item); 103 return this.getCurrentAudioUri() === getRootUri(item);
90 } 104 }
91 105
92 getOnSeekForItem(item: Item): (timeSeconds: number) => any { 106 getOnSeekForItem(item: Item): (timeSeconds: number) => any {
93 return this.isActiveItem(item) ? this.onSeek : () => {}; 107 return this.isActiveItem(item) ? this.onSeek : () => {};
94 } 108 }
96 ngOnDestroy(): void { 110 ngOnDestroy(): void {
97 if (this.resizeSubscription) { 111 if (this.resizeSubscription) {
98 this.resizeSubscription.unsubscribe(); 112 this.resizeSubscription.unsubscribe();
99 } 113 }
100 } 114 }
115
116 private getCurrentAudioUri(): string {
117 if (this.analyses.length === 0) {
118 return '';
119 }
120 try {
121 return getRootUri(this.analyses[0]);
122 } catch (e) {
123 return '';
124 }
125 }
101 } 126 }