changeset 191:ea735ebeed0e

Avoid using browser specific singleton directly - despite the fact this is likely always going to be run in a browser.

--- a/src/app/app.module.ts	Wed Mar 22 16:20:50 2017 +0000
+++ b/src/app/app.module.ts	Thu Mar 23 11:38:22 2017 +0000
@@ -8,7 +8,10 @@
 import { WaveformComponent } from './waveform/waveform.component';
 import { AudioFileOpenComponent } from './audio-file-open/audio-file-open.component';
 import { PlaybackControlComponent } from './playback-control/playback-control.component';
-import { AudioPlayerService } from "./services/audio-player/audio-player.service";
+import {
+  AudioPlayerService,
+  UrlResourceLifetimeManager
+} from "./services/audio-player/audio-player.service";
 import { FeatureExtractionService } from "./services/feature-extraction/feature-extraction.service";
 import { FeatureExtractionMenuComponent } from "./feature-extraction-menu/feature-extraction-menu.component";
 import { ProgressSpinnerComponent } from "./progress-spinner/progress-spinner.component";
@@ -61,6 +64,15 @@
   }
 }
 
+export const urlResourceManager: UrlResourceLifetimeManager = {
+  createUrlToResource: (resource: File | Blob): string => {
+    return URL.createObjectURL(resource);
+  },
+  revokeUrlToResource: (url: string) => {
+    URL.revokeObjectURL(url);
+  }
+};
+
 @NgModule({
   declarations: [
     AppComponent,
@@ -87,7 +99,8 @@
     AudioRecorderService,
     FeatureExtractionService,
     {provide: 'MediaRecorderFactory', useFactory: createMediaRecorderFactory},
-    {provide: 'PiperRepoUri', useValue: 'assets/remote-plugins.json'}
+    {provide: 'PiperRepoUri', useValue: 'assets/remote-plugins.json'},
+    {provide: 'UrlResourceLifetimeManager', useValue: urlResourceManager}
   ],
   bootstrap: [AppComponent]
 })

--- a/src/app/services/audio-player/audio-player.service.ts	Wed Mar 22 16:20:50 2017 +0000
+++ b/src/app/services/audio-player/audio-player.service.ts	Thu Mar 23 11:38:22 2017 +0000
@@ -2,6 +2,11 @@
 import {Subject} from "rxjs/Subject";
 import {Observable} from "rxjs";
 
+export interface UrlResourceLifetimeManager {
+  createUrlToResource(resource: File | Blob): string;
+  revokeUrlToResource(url: string): void;
+}
+
 @Injectable()
 export class AudioPlayerService {
 
@@ -12,7 +17,10 @@
   seeked$: Observable<number>;
 
   constructor(@Inject(HTMLAudioElement) private audioElement: HTMLAudioElement /* TODO probably shouldn't play audio this way */,
-              @Inject('AudioContext') private audioContext: AudioContext) {
+              @Inject('AudioContext') private audioContext: AudioContext,
+              @Inject(
+                'UrlResourceLifetimeManager'
+              ) private resourceManager: UrlResourceLifetimeManager) {
     this.currentObjectUrl = '';
     this.playingStateChange = new Subject<boolean>();
     this.playingStateChange$ = this.playingStateChange.asObservable();
@@ -40,7 +48,7 @@
 
   loadAudioFromUrl(url: string): void {
     if (this.currentObjectUrl)
-      URL.revokeObjectURL(this.currentObjectUrl);
+      this.resourceManager.revokeUrlToResource(this.currentObjectUrl);
     this.currentObjectUrl = url;
     this.audioElement.pause();
     this.audioElement.src = url;