Mercurial > hg > ugly-duckling
comparison src/app/analysis-item/analysis-item.component.ts @ 456:7bb0bac6f8dc
Add export button for recordings and option to remove audio item (also removes all related analyses atm). Revokes associated object url for audio on removal. Will be problematic if the history is used for undo / redo.
author | Lucas Thompson <dev@lucas.im> |
---|---|
date | Thu, 29 Jun 2017 20:11:14 +0100 |
parents | 8113b6f5a75e |
children | ccce2c09502e |
comparison
equal
deleted
inserted
replaced
455:d27f1ca7ba6a | 456:7bb0bac6f8dc |
---|---|
4 import { | 4 import { |
5 ChangeDetectionStrategy, | 5 ChangeDetectionStrategy, |
6 Component, | 6 Component, |
7 Input, | 7 Input, |
8 OnDestroy, | 8 OnDestroy, |
9 OnInit | 9 OnInit, |
10 Output, | |
11 EventEmitter | |
10 } from '@angular/core'; | 12 } from '@angular/core'; |
11 import {naivePagingMapper} from '../visualisations/WavesJunk'; | 13 import {naivePagingMapper} from '../visualisations/WavesJunk'; |
12 import {OnSeekHandler} from '../playhead/PlayHeadHelpers'; | 14 import {OnSeekHandler} from '../playhead/PlayHeadHelpers'; |
13 import { | 15 import { |
14 defaultColourGenerator, | 16 defaultColourGenerator, |
17 } from '../visualisations/FeatureUtilities'; | 19 } from '../visualisations/FeatureUtilities'; |
18 import { | 20 import { |
19 RenderLoopService, | 21 RenderLoopService, |
20 TaskRemover | 22 TaskRemover |
21 } from '../services/render-loop/render-loop.service'; | 23 } from '../services/render-loop/render-loop.service'; |
24 import {DomSanitizer} from '@angular/platform-browser'; | |
22 | 25 |
23 export interface Item { | 26 export interface Item { |
24 id: string; | 27 id: string; |
25 hasSharedTimeline: boolean; | 28 hasSharedTimeline: boolean; |
26 title?: string; | 29 title?: string; |
29 } | 32 } |
30 | 33 |
31 export interface PendingRootAudioItem extends Item { | 34 export interface PendingRootAudioItem extends Item { |
32 uri: string; | 35 uri: string; |
33 mimeType?: string; | 36 mimeType?: string; |
37 isExportable?: boolean; | |
34 } | 38 } |
35 export interface RootAudioItem extends PendingRootAudioItem { | 39 export interface RootAudioItem extends PendingRootAudioItem { |
36 audioData: AudioBuffer; | 40 audioData: AudioBuffer; |
37 } | 41 } |
38 | 42 |
113 } | 117 } |
114 | 118 |
115 @Input() item: Item; | 119 @Input() item: Item; |
116 @Input() contentWidth: number; | 120 @Input() contentWidth: number; |
117 @Input() onSeek: OnSeekHandler; | 121 @Input() onSeek: OnSeekHandler; |
122 @Output() remove: EventEmitter<Item>; | |
118 // TODO move / re-think - naivePagingMapper feels like a big ol' bodge | 123 // TODO move / re-think - naivePagingMapper feels like a big ol' bodge |
119 private removeAnimation: TaskRemover; | 124 private removeAnimation: TaskRemover; |
120 private hasProgressOnInit = false; | 125 private hasProgressOnInit = false; |
121 private mIsActive: boolean; | 126 private mIsActive: boolean; |
122 private mTimeline: Timeline; | 127 private mTimeline: Timeline; |
123 | 128 |
124 constructor(private renderLoop: RenderLoopService) {} | 129 constructor(private renderLoop: RenderLoopService, |
130 private sanitizer: DomSanitizer) { | |
131 this.remove = new EventEmitter<Item>(); | |
132 } | |
125 | 133 |
126 ngOnInit(): void { | 134 ngOnInit(): void { |
127 this.resetRemoveAnimation(); | 135 this.resetRemoveAnimation(); |
128 this.hasProgressOnInit = this.item.progress != null; | 136 this.hasProgressOnInit = this.item.progress != null; |
129 } | 137 } |
160 return defaultColourGenerator.next().value; | 168 return defaultColourGenerator.next().value; |
161 } | 169 } |
162 | 170 |
163 ngOnDestroy(): void { | 171 ngOnDestroy(): void { |
164 this.removeAnimation(); | 172 this.removeAnimation(); |
173 } | |
174 | |
175 private sanitize(url: string) { | |
176 return this.sanitizer.bypassSecurityTrustUrl(url); | |
177 } | |
178 | |
179 private generateFilename(item: PendingRootAudioItem): string { | |
180 // TODO this is too brittle, and will often produce the wrong result | |
181 // i.e. audio/mpeg results in .mpeg, when .mp3 is likely desired | |
182 const mimeParts = item.mimeType ? item.mimeType.split('/') : []; | |
183 const extension = mimeParts.length === 2 ? mimeParts[1] : ''; | |
184 return `${item.title}.${extension}`; | |
165 } | 185 } |
166 | 186 |
167 private resetRemoveAnimation(): void { | 187 private resetRemoveAnimation(): void { |
168 if (this.removeAnimation) { | 188 if (this.removeAnimation) { |
169 this.removeAnimation(); | 189 this.removeAnimation(); |