dev@31
|
1 import {Component} from '@angular/core';
|
dev@37
|
2 import {AudioPlayerService} from "./services/audio-player/audio-player.service";
|
dev@47
|
3 import {FeatureExtractionService} from "./services/feature-extraction/feature-extraction.service";
|
dev@47
|
4 import {ExtractorOutputInfo} from "./feature-extraction-menu/feature-extraction-menu.component";
|
dev@89
|
5 import {DomSanitizer} from '@angular/platform-browser';
|
dev@89
|
6 import {MdIconRegistry} from '@angular/material';
|
angular-cli@0
|
7
|
angular-cli@0
|
8 @Component({
|
angular-cli@0
|
9 selector: 'app-root',
|
angular-cli@0
|
10 templateUrl: './app.component.html',
|
angular-cli@0
|
11 styleUrls: ['./app.component.css']
|
angular-cli@0
|
12 })
|
angular-cli@0
|
13 export class AppComponent {
|
dev@31
|
14 audioBuffer: AudioBuffer; // TODO consider revising
|
dev@49
|
15 canExtract: boolean;
|
dev@1
|
16
|
dev@47
|
17 constructor(private audioService: AudioPlayerService,
|
dev@89
|
18 private piperService: FeatureExtractionService,
|
dev@89
|
19 private iconRegistry: MdIconRegistry,
|
dev@89
|
20 private sanitizer: DomSanitizer) {
|
dev@49
|
21 this.canExtract = false;
|
dev@89
|
22 iconRegistry.addSvgIcon(
|
dev@89
|
23 'duck',
|
dev@89
|
24 sanitizer.bypassSecurityTrustResourceUrl('assets/duck.svg')
|
dev@89
|
25 );
|
dev@48
|
26 }
|
dev@16
|
27
|
dev@31
|
28 onFileOpened(file: File) {
|
dev@49
|
29 this.canExtract = false;
|
dev@31
|
30 const reader: FileReader = new FileReader();
|
dev@31
|
31 const mimeType = file.type;
|
dev@31
|
32 reader.onload = (event: any) => {
|
dev@31
|
33 this.audioService.loadAudioFromUrl(
|
dev@31
|
34 URL.createObjectURL(new Blob([event.target.result], {type: mimeType}))
|
dev@31
|
35 );
|
dev@31
|
36 // TODO use a rxjs/Subject instead?
|
dev@31
|
37 this.audioService.decodeAudioData(event.target.result).then(audioBuffer => {
|
dev@31
|
38 this.audioBuffer = audioBuffer;
|
dev@48
|
39 if (this.audioBuffer)
|
dev@49
|
40 this.canExtract = true;
|
dev@31
|
41 });
|
dev@31
|
42 };
|
dev@31
|
43 reader.readAsArrayBuffer(file);
|
dev@16
|
44 }
|
dev@47
|
45
|
dev@48
|
46 extractFeatures(outputInfo: ExtractorOutputInfo): void {
|
dev@50
|
47 if (!this.canExtract || !outputInfo) return;
|
dev@49
|
48 this.canExtract = false;
|
dev@63
|
49 this.piperService.collect({
|
dev@47
|
50 audioData: [...Array(this.audioBuffer.numberOfChannels).keys()]
|
dev@47
|
51 .map(i => this.audioBuffer.getChannelData(i)),
|
dev@47
|
52 audioFormat: {
|
dev@47
|
53 sampleRate: this.audioBuffer.sampleRate,
|
dev@47
|
54 channelCount: this.audioBuffer.numberOfChannels
|
dev@47
|
55 },
|
dev@47
|
56 key: outputInfo.extractorKey,
|
dev@47
|
57 outputId: outputInfo.outputId
|
dev@50
|
58 }).then(() => {
|
dev@49
|
59 this.canExtract = true;
|
dev@49
|
60 }).catch(err => console.error(err));
|
dev@47
|
61 }
|
angular-cli@0
|
62 }
|