speechrecorderng 2.18.9 → 2.18.13

package/fesm2015/speechrecorderng.js

@@ -552,24 +552,10 @@ class AudioCapture {
             // AudioWorker is now AudioWorkletProcessor ... (May 2017)
             // Update 12-2020:
             // The ScriptProcessorNode Interface - DEPRECATED
-            // TODO
-            if (this.context.createAudioWorker) {
-                //console.debug("Audio worker implemented!!")
-            }
-            else {
-                //console.debug("Audio worker NOT implemented.")
-            }
-            if (this.context.registerProcessor) {
-                //console.debug("Audio worklet processor implemented!!");
-            }
-            else {
-                //console.debug("Audio worklet processor NOT implemented.")
-            }
             if (!this.context.createScriptProcessor) {
                 //console.debug("Audio script processor NOT implemented.")
             }
             else {
-                //TODO
                 // The ScriptProcessorNode Interface - DEPRECATED
                 //console.debug("Audio script processor implemented!!");
                 // TODO should we use streamChannelCount or channelCount here ?
@@ -1324,9 +1310,9 @@ class SpeechRecorderConfig {
         this.withCredentials = false;
     }
 }
-SpeechRecorderConfig.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: SpeechRecorderConfig, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-SpeechRecorderConfig.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: SpeechRecorderConfig });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: SpeechRecorderConfig, decorators: [{
+SpeechRecorderConfig.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: SpeechRecorderConfig, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+SpeechRecorderConfig.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: SpeechRecorderConfig });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: SpeechRecorderConfig, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return []; } });
 
@@ -1378,9 +1364,9 @@ class ProjectService {
     }
 }
 ProjectService.PROJECT_API_CTX = 'project';
-ProjectService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: ProjectService, deps: [{ token: i1.HttpClient }, { token: i4.PlatformLocation }, { token: SPEECHRECORDER_CONFIG }], target: i0.ɵɵFactoryTarget.Injectable });
-ProjectService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: ProjectService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: ProjectService, decorators: [{
+ProjectService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: ProjectService, deps: [{ token: i1.HttpClient }, { token: i4.PlatformLocation }, { token: SPEECHRECORDER_CONFIG }], target: i0.ɵɵFactoryTarget.Injectable });
+ProjectService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: ProjectService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: ProjectService, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: i1.HttpClient }, { type: i4.PlatformLocation }, { type: SpeechRecorderConfig, decorators: [{
                     type: Inject,
@@ -1436,9 +1422,9 @@ class SessionService {
     }
 }
 SessionService.SESSION_API_CTX = 'session';
-SessionService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: SessionService, deps: [{ token: i1.HttpClient }, { token: SPEECHRECORDER_CONFIG }], target: i0.ɵɵFactoryTarget.Injectable });
-SessionService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: SessionService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: SessionService, decorators: [{
+SessionService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: SessionService, deps: [{ token: i1.HttpClient }, { token: SPEECHRECORDER_CONFIG }], target: i0.ɵɵFactoryTarget.Injectable });
+SessionService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: SessionService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: SessionService, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: i1.HttpClient }, { type: SpeechRecorderConfig, decorators: [{
                     type: Inject,
@@ -1726,14 +1712,14 @@ class LevelBar {
         }
     }
 }
-LevelBar.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: LevelBar, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-LevelBar.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: LevelBar, selector: "audio-levelbar", inputs: { streamingMode: "streamingMode", displayLevelInfos: "displayLevelInfos" }, host: { listeners: { "scroll": "onScroll($event)", "window:resize": "onResize($event)" } }, viewQueries: [{ propertyName: "virtualCanvasRef", first: true, predicate: ["virtualCanvas"], descendants: true, static: true }, { propertyName: "liveLevelCanvasRef", first: true, predicate: ["levelbar"], descendants: true, static: true }, { propertyName: "markerCanvasRef", first: true, predicate: ["markerCanvas"], descendants: true, static: true }], ngImport: i0, template: `
+LevelBar.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: LevelBar, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+LevelBar.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.10", type: LevelBar, selector: "audio-levelbar", inputs: { streamingMode: "streamingMode", displayLevelInfos: "displayLevelInfos" }, host: { listeners: { "scroll": "onScroll($event)", "window:resize": "onResize($event)" } }, viewQueries: [{ propertyName: "virtualCanvasRef", first: true, predicate: ["virtualCanvas"], descendants: true, static: true }, { propertyName: "liveLevelCanvasRef", first: true, predicate: ["levelbar"], descendants: true, static: true }, { propertyName: "markerCanvasRef", first: true, predicate: ["markerCanvas"], descendants: true, static: true }], ngImport: i0, template: `
     <div #virtualCanvas>
       <canvas #levelbar></canvas>
       <canvas #markerCanvas></canvas>
     </div>
   `, isInline: true, styles: [":host {\n\n    width: 100%;\n    background: darkgray;\n    box-sizing: border-box;\n    height: 100%;\n    position: relative;\n    overflow-x: scroll;\n    overflow-y: auto;\n  }", "div {\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n\n    /*position: absolute;*/\n    box-sizing: border-box;\n  }", "canvas {\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    position: absolute;\n  }"] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: LevelBar, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: LevelBar, decorators: [{
             type: Component,
             args: [{
                     selector: 'audio-levelbar',
@@ -1858,8 +1844,8 @@ class LevelBarDisplay {
         this.peakDbLvl = MIN_DB_LEVEL;
     }
 }
-LevelBarDisplay.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: LevelBarDisplay, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-LevelBarDisplay.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: LevelBarDisplay, selector: "spr-recordingitemdisplay", inputs: { streamingMode: "streamingMode", audioSignalCollapsed: "audioSignalCollapsed", enableDownload: "enableDownload", playStartAction: "playStartAction", playStopAction: "playStopAction", displayAudioBuffer: "displayAudioBuffer", displayLevelInfos: "displayLevelInfos" }, outputs: { onShowRecordingDetails: "onShowRecordingDetails", onDownloadRecording: "onDownloadRecording" }, viewQueries: [{ propertyName: "liveLevel", first: true, predicate: LevelBar, descendants: true, static: true }], ngImport: i0, template: `
+LevelBarDisplay.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: LevelBarDisplay, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+LevelBarDisplay.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.10", type: LevelBarDisplay, selector: "spr-recordingitemdisplay", inputs: { streamingMode: "streamingMode", audioSignalCollapsed: "audioSignalCollapsed", enableDownload: "enableDownload", playStartAction: "playStartAction", playStopAction: "playStopAction", displayAudioBuffer: "displayAudioBuffer", displayLevelInfos: "displayLevelInfos" }, outputs: { onShowRecordingDetails: "onShowRecordingDetails", onDownloadRecording: "onDownloadRecording" }, viewQueries: [{ propertyName: "liveLevel", first: true, predicate: LevelBar, descendants: true, static: true }], ngImport: i0, template: `
         <audio-levelbar [streamingMode]="streamingMode" [displayLevelInfos]="_displayLevelInfos"></audio-levelbar>
         <button matTooltip="Start playback" (click)="playStartAction?.perform()"
                 [disabled]="playStartAction?.disabled"
@@ -1882,7 +1868,7 @@ LevelBarDisplay.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", versio
         <div style="min-width: 14ch;padding:2px"><table border="0"><tr><td>Peak:</td><td><span matTooltip="Peak level"
                                                                         [style.color]="(peakDbLvl > warnDbLevel)?'red':'black'">{{peakDbLvl | number:'1.1-1'}} dB </span></td></tr></table></div>
     `, isInline: true, styles: [":host {\n        flex: 0; /* only required vertical space */\n        width: 100%;\n        background: darkgray;\n        padding: 4px;\n        box-sizing: border-box;\n        height: 100px;\n        min-height: 100px;\n        display: flex; /* flex container: left level bar, right decimal peak level value */\n        flex-direction: row;\n        flex-wrap: nowrap; /* wrap could completely destroy the layout */\n    }", "audio-levelbar {\n        flex: 1;\n        box-sizing: border-box;\n    }", "span {\n        flex: 0;\n        font-weight: bold;\n        display: inline-block;\n        white-space: nowrap;\n        box-sizing: border-box;\n    }"], components: [{ type: LevelBar, selector: "audio-levelbar", inputs: ["streamingMode", "displayLevelInfos"] }, { type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "number": i4.DecimalPipe } });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: LevelBarDisplay, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: LevelBarDisplay, decorators: [{
             type: Component,
             args: [{
                     selector: 'spr-recordingitemdisplay',
@@ -2337,8 +2323,8 @@ class SimpleTrafficLight {
         }
     }
 }
-SimpleTrafficLight.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: SimpleTrafficLight, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SimpleTrafficLight.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: SimpleTrafficLight, selector: "app-simpletrafficlight", inputs: { status: "status" }, ngImport: i0, template: `
+SimpleTrafficLight.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: SimpleTrafficLight, deps: [], target: i0.ɵɵFactoryTarget.Component });
+SimpleTrafficLight.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.10", type: SimpleTrafficLight, selector: "app-simpletrafficlight", inputs: { status: "status" }, ngImport: i0, template: `
 
     <div>
       <div class="circle {{lighttop}}"></div>
@@ -2346,7 +2332,7 @@ SimpleTrafficLight.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ver
       <div class="circle {{lightbottom}}"></div>
     </div>
   `, isInline: true, styles: [".circle {\n    width: 50px;\n    height: 50px;\n    border-radius: 50%;\n    margin: 5px;\n    background: grey;\n  }", ".red {\n    background: red;\n  }\n  ", "\n    .yellow {\n      background: yellow;\n    }\n  ", "\n    .green {\n      background: green;\n    }\n  ", "\n    .black {\n      background: black;\n    }", ":host {\n      display: flex;\n      flex-direction: column;\n      background: black;\n          \n      padding: 2px;\n      height: 170px;\n      max-height: 170px;\n      flex: 0 0 content;\n    }\n    "] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: SimpleTrafficLight, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: SimpleTrafficLight, decorators: [{
             type: Component,
             args: [{
                     selector: 'app-simpletrafficlight',
@@ -2452,9 +2438,9 @@ class CanvasLayerComponent {
         }
     }
 }
-CanvasLayerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: CanvasLayerComponent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-CanvasLayerComponent.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.5", type: CanvasLayerComponent, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: CanvasLayerComponent, decorators: [{
+CanvasLayerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: CanvasLayerComponent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+CanvasLayerComponent.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.10", type: CanvasLayerComponent, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: CanvasLayerComponent, decorators: [{
             type: Directive
         }], ctorParameters: function () { return []; } });
 
@@ -2675,9 +2661,9 @@ class BasicAudioCanvasLayerComponent extends CanvasLayerComponent {
         //});
     }
 }
-BasicAudioCanvasLayerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: BasicAudioCanvasLayerComponent, deps: null, target: i0.ɵɵFactoryTarget.Directive });
-BasicAudioCanvasLayerComponent.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.5", type: BasicAudioCanvasLayerComponent, usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: BasicAudioCanvasLayerComponent, decorators: [{
+BasicAudioCanvasLayerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: BasicAudioCanvasLayerComponent, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+BasicAudioCanvasLayerComponent.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.10", type: BasicAudioCanvasLayerComponent, usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: BasicAudioCanvasLayerComponent, decorators: [{
             type: Directive
         }] });
 class AudioCanvasLayerComponent extends BasicAudioCanvasLayerComponent {
@@ -2878,9 +2864,9 @@ class AudioCanvasLayerComponent extends BasicAudioCanvasLayerComponent {
         }
     }
 }
-AudioCanvasLayerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: AudioCanvasLayerComponent, deps: null, target: i0.ɵɵFactoryTarget.Directive });
-AudioCanvasLayerComponent.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.5", type: AudioCanvasLayerComponent, inputs: { pointerPosition: "pointerPosition", selecting: "selecting", selection: "selection" }, outputs: { pointerPositionEventEmitter: "pointerPositionEventEmitter", selectingEventEmitter: "selectingEventEmitter", selectedEventEmitter: "selectedEventEmitter" }, host: { listeners: { "document:mouseup": "onMouseup($event)" } }, viewQueries: [{ propertyName: "bgCanvasRef", first: true, predicate: ["bg"], descendants: true, static: true }, { propertyName: "cursorCanvasRef", first: true, predicate: ["cursor"], descendants: true, static: true }], usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: AudioCanvasLayerComponent, decorators: [{
+AudioCanvasLayerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: AudioCanvasLayerComponent, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+AudioCanvasLayerComponent.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.10", type: AudioCanvasLayerComponent, inputs: { pointerPosition: "pointerPosition", selecting: "selecting", selection: "selection" }, outputs: { pointerPositionEventEmitter: "pointerPositionEventEmitter", selectingEventEmitter: "selectingEventEmitter", selectedEventEmitter: "selectedEventEmitter" }, host: { listeners: { "document:mouseup": "onMouseup($event)" } }, viewQueries: [{ propertyName: "bgCanvasRef", first: true, predicate: ["bg"], descendants: true, static: true }, { propertyName: "cursorCanvasRef", first: true, predicate: ["cursor"], descendants: true, static: true }], usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: AudioCanvasLayerComponent, decorators: [{
             type: Directive
         }], propDecorators: { bgCanvasRef: [{
                 type: ViewChild,
@@ -3203,14 +3189,14 @@ class AudioSignal extends AudioCanvasLayerComponent {
         this.playFramePosition = 0;
     }
 }
-AudioSignal.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: AudioSignal, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-AudioSignal.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: AudioSignal, selector: "audio-signal", viewQueries: [{ propertyName: "audioSignalCanvasRef", first: true, predicate: ["audioSignal"], descendants: true, static: true }, { propertyName: "playPosCanvasRef", first: true, predicate: ["marker"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: `
+AudioSignal.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: AudioSignal, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+AudioSignal.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.10", type: AudioSignal, selector: "audio-signal", viewQueries: [{ propertyName: "audioSignalCanvasRef", first: true, predicate: ["audioSignal"], descendants: true, static: true }, { propertyName: "playPosCanvasRef", first: true, predicate: ["marker"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: `
     <canvas #bg height="10"></canvas>
     <canvas #audioSignal height="10"></canvas>
     <canvas #cursor height="10" (mousedown)="selectionStart($event)" (mouseover)="updateCursorCanvas($event)" (mousemove)="updateCursorCanvas($event)"
             (mouseleave)="updateCursorCanvas($event, false)"></canvas>
     <canvas #marker height="10"></canvas>`, isInline: true, styles: [":host{\n      min-height: 0px;\n    }", "canvas {\n    top: 0;\n    left: 0;\n    width: 0;\n    height: 0;\n    min-height: 0px;\n    position: absolute;\n  }"] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: AudioSignal, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: AudioSignal, decorators: [{
             type: Component,
             args: [{
                     selector: 'audio-signal',
@@ -4138,14 +4124,14 @@ class Sonagram extends AudioCanvasLayerComponent {
         //this.startRender();
     }
 }
-Sonagram.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: Sonagram, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-Sonagram.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: Sonagram, selector: "audio-sonagram", viewQueries: [{ propertyName: "sonagramCanvasRef", first: true, predicate: ["sonagram"], descendants: true, static: true }, { propertyName: "markerCanvasRef", first: true, predicate: ["marker"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: `
+Sonagram.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: Sonagram, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+Sonagram.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.10", type: Sonagram, selector: "audio-sonagram", viewQueries: [{ propertyName: "sonagramCanvasRef", first: true, predicate: ["sonagram"], descendants: true, static: true }, { propertyName: "markerCanvasRef", first: true, predicate: ["marker"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: `
         <canvas #sonagram height="10"></canvas>
         <canvas #bg height="10"></canvas>
         <canvas #cursor height="10" (mousedown)="selectionStart($event)" (mouseover)="updateCursorCanvas($event)" (mousemove)="updateCursorCanvas($event)"
                 (mouseleave)="updateCursorCanvas($event, false)"></canvas>
         <canvas #marker height="10"></canvas>`, isInline: true, styles: [":host{\n      min-height: 0px;\n    }", "canvas {\n        top: 0;\n        left: 0;\n        width: 0;\n        height: 0;\n      min-height: 0px;\n        position: absolute;\n    }"] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: Sonagram, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: Sonagram, decorators: [{
             type: Component,
             args: [{
                     selector: 'audio-sonagram',
@@ -4492,8 +4478,8 @@ class AudioClipUIContainer extends BasicAudioCanvasLayerComponent {
     }
 }
 AudioClipUIContainer.DIVIDER_PIXEL_SIZE = 10;
-AudioClipUIContainer.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: AudioClipUIContainer, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-AudioClipUIContainer.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: AudioClipUIContainer, selector: "app-audio", inputs: { audioData: "audioData", audioClip: "audioClip" }, outputs: { selectionEventEmitter: "selectionEventEmitter" }, host: { listeners: { "window:resize": "onResize($event)", "document:mouseup": "onMouseup($event)", "document:mousemove": "onMousemove($event)" } }, viewQueries: [{ propertyName: "canvasRef", first: true, predicate: ["divider"], descendants: true, static: true }, { propertyName: "ceRef", first: true, predicate: ["virtualCanvas"], descendants: true, static: true }, { propertyName: "as", first: true, predicate: AudioSignal, descendants: true, static: true }, { propertyName: "so", first: true, predicate: Sonagram, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: `
+AudioClipUIContainer.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: AudioClipUIContainer, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+AudioClipUIContainer.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.10", type: AudioClipUIContainer, selector: "app-audio", inputs: { audioData: "audioData", audioClip: "audioClip" }, outputs: { selectionEventEmitter: "selectionEventEmitter" }, host: { listeners: { "window:resize": "onResize($event)", "document:mouseup": "onMouseup($event)", "document:mousemove": "onMousemove($event)" } }, viewQueries: [{ propertyName: "canvasRef", first: true, predicate: ["divider"], descendants: true, static: true }, { propertyName: "ceRef", first: true, predicate: ["virtualCanvas"], descendants: true, static: true }, { propertyName: "as", first: true, predicate: AudioSignal, descendants: true, static: true }, { propertyName: "so", first: true, predicate: Sonagram, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: `
     <div #virtualCanvas>
     <canvas #divider (mousedown)="mousedown($event)" (mouseover)="mouseover($event)"
             (mouseleave)="mouseleave($event)" height="10"></canvas>
@@ -4501,7 +4487,7 @@ AudioClipUIContainer.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", v
     <audio-sonagram [pointerPosition]="pointer" [selecting]="selecting" [selection]="selection" (pointerPositionEventEmitter)="pointerPositionChanged($event)" (selectingEventEmitter)="selectingChanged($event)" (selectedEventEmitter)="selectionChanged($event)"></audio-sonagram>
     </div>
   `, isInline: true, styles: ["div {\n\n    margin: 0;\n    padding: 0;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    position: relative; /* TODO container div position must not be 'static' (default) to act as reference for the canvases */\n    box-sizing: border-box;\n    transform: none;\n  }", "canvas{\n    top: 0;\n    left: 0;\n    width: 0;\n    height: 0;\n    cursor: ns-resize;\n    position: absolute;\n    zIndex: 1;\n    transform: none;\n  }", "audio-signal {\n    top: 0;\n    left: 0;\n    position: absolute;\n    zIndex: 1;\n    transform: none;\n  }", "audio-sonagram {\n    top: 0;\n    left: 0;\n    position: absolute;\n    zIndex: 1;\n    transform: none;\n  }"], components: [{ type: AudioSignal, selector: "audio-signal" }, { type: Sonagram, selector: "audio-sonagram" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: AudioClipUIContainer, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: AudioClipUIContainer, decorators: [{
             type: Component,
             args: [{
                     selector: 'app-audio',
@@ -4686,13 +4672,13 @@ class AudioDisplayScrollPane {
         this.ac.playFramePosition = framePos;
     }
 }
-AudioDisplayScrollPane.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: AudioDisplayScrollPane, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-AudioDisplayScrollPane.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: AudioDisplayScrollPane, selector: "audio-display-scroll-pane", inputs: { audioClip: "audioClip" }, outputs: { zoomInAction: "zoomInAction", zoomOutAction: "zoomOutAction", zoomSelectedAction: "zoomSelectedAction", zoomFitToPanelAction: "zoomFitToPanelAction" }, host: { listeners: { "scroll": "onScroll($event)", "window:resize": "onResize($event)" } }, viewQueries: [{ propertyName: "ac", first: true, predicate: AudioClipUIContainer, descendants: true, static: true }], ngImport: i0, template: `
+AudioDisplayScrollPane.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: AudioDisplayScrollPane, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+AudioDisplayScrollPane.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.10", type: AudioDisplayScrollPane, selector: "audio-display-scroll-pane", inputs: { audioClip: "audioClip" }, outputs: { zoomInAction: "zoomInAction", zoomOutAction: "zoomOutAction", zoomSelectedAction: "zoomSelectedAction", zoomFitToPanelAction: "zoomFitToPanelAction" }, host: { listeners: { "scroll": "onScroll($event)", "window:resize": "onResize($event)" } }, viewQueries: [{ propertyName: "ac", first: true, predicate: AudioClipUIContainer, descendants: true, static: true }], ngImport: i0, template: `
 
     <app-audio #audioSignalContainer (selectionEventEmitter)="selectionChanged($event)"></app-audio>
 
   `, isInline: true, styles: [":host {\n      flex: 2;\n      width: 100%;\n      background: darkgray;\n      box-sizing: border-box;\n      height: 100%;\n      position: relative;\n      overflow-x: scroll;\n      overflow-y: auto;\n    }", "app-audio {\n\n    margin: 0;\n    padding: 0;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n\n    /*position: absolute;*/\n    box-sizing: border-box;\n  }"], components: [{ type: AudioClipUIContainer, selector: "app-audio", inputs: ["audioData", "audioClip"], outputs: ["selectionEventEmitter"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: AudioDisplayScrollPane, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: AudioDisplayScrollPane, decorators: [{
             type: Component,
             args: [{
                     selector: 'audio-display-scroll-pane',
@@ -4779,8 +4765,8 @@ class AudioDisplayControl {
         this.status = 'ERROR';
     }
 }
-AudioDisplayControl.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: AudioDisplayControl, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-AudioDisplayControl.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: AudioDisplayControl, selector: "audio-display-control", inputs: { audioClip: "audioClip", playStartAction: "playStartAction", playSelectionAction: "playSelectionAction", playStopAction: "playStopAction", zoomInAction: "zoomInAction", zoomOutAction: "zoomOutAction", zoomFitToPanelAction: "zoomFitToPanelAction", zoomSelectedAction: "zoomSelectedAction", autoPlayOnSelectToggleAction: "autoPlayOnSelectToggleAction" }, viewQueries: [{ propertyName: "autoplaySelectedCheckbox", first: true, predicate: MatCheckbox, descendants: true, static: true }], ngImport: i0, template: `
+AudioDisplayControl.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: AudioDisplayControl, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+AudioDisplayControl.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.10", type: AudioDisplayControl, selector: "audio-display-control", inputs: { audioClip: "audioClip", playStartAction: "playStartAction", playSelectionAction: "playSelectionAction", playStopAction: "playStopAction", zoomInAction: "zoomInAction", zoomOutAction: "zoomOutAction", zoomFitToPanelAction: "zoomFitToPanelAction", zoomSelectedAction: "zoomSelectedAction", autoPlayOnSelectToggleAction: "autoPlayOnSelectToggleAction" }, viewQueries: [{ propertyName: "autoplaySelectedCheckbox", first: true, predicate: MatCheckbox, descendants: true, static: true }], ngImport: i0, template: `
         <div #controlPanel style="display:flex;flex-direction: row;">
             <fieldset>
 
@@ -4824,7 +4810,7 @@ AudioDisplayControl.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ve
 
             </fieldset>
         </div>`, isInline: true, styles: [":host {\n        flex: 0;\n\n      }"], components: [{ type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i2$1.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "id", "labelPosition", "name", "required", "checked", "disabled", "indeterminate", "aria-describedby", "value"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }], directives: [{ type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: AudioDisplayControl, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: AudioDisplayControl, decorators: [{
             type: Component,
             args: [{
                     selector: 'audio-display-control',
@@ -4966,8 +4952,8 @@ class AudioDisplay {
         this.status = 'ERROR';
     }
 }
-AudioDisplay.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: AudioDisplay, deps: [{ token: i1$1.ActivatedRoute }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-AudioDisplay.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: AudioDisplay, selector: "app-audiodisplay", inputs: { playStartAction: "playStartAction", playStopAction: "playStopAction", playSelectionAction: "playSelectionAction", autoPlayOnSelectToggleAction: "autoPlayOnSelectToggleAction", audioData: "audioData", audioClip: "audioClip" }, viewQueries: [{ propertyName: "audioDisplayScrollPane", first: true, predicate: AudioDisplayScrollPane, descendants: true, static: true }], ngImport: i0, template: `
+AudioDisplay.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: AudioDisplay, deps: [{ token: i1$1.ActivatedRoute }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+AudioDisplay.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.10", type: AudioDisplay, selector: "app-audiodisplay", inputs: { playStartAction: "playStartAction", playStopAction: "playStopAction", playSelectionAction: "playSelectionAction", autoPlayOnSelectToggleAction: "autoPlayOnSelectToggleAction", audioData: "audioData", audioClip: "audioClip" }, viewQueries: [{ propertyName: "audioDisplayScrollPane", first: true, predicate: AudioDisplayScrollPane, descendants: true, static: true }], ngImport: i0, template: `
 
     <audio-display-scroll-pane #audioDisplayScrollPane></audio-display-scroll-pane>
 
@@ -4981,7 +4967,7 @@ AudioDisplay.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version:
     [zoomSelectedAction]="zoomSelectedAction"
     [zoomFitToPanelAction]="zoomFitToPanelAction"></audio-display-control>
   `, isInline: true, styles: [":host {\n      display: flex;\n      flex-direction: column;\n      position: absolute;\n      bottom: 0px;\n      height: 100%;\n      width: 100%;\n      overflow: hidden;\n      padding: 20px;\n      z-index: 5;\n      box-sizing: border-box;\n      background-color: rgba(230, 230, 230, 1.0)\n    }", "\n          legend{\n              margin-left: 1em; padding: 0.2em 0.8em;font-size: 0.8em;\n      }", "\n        fieldset{\n            border: 1px darkgray solid\n      }\n      "], components: [{ type: AudioDisplayScrollPane, selector: "audio-display-scroll-pane", inputs: ["audioClip"], outputs: ["zoomInAction", "zoomOutAction", "zoomSelectedAction", "zoomFitToPanelAction"] }, { type: AudioDisplayControl, selector: "audio-display-control", inputs: ["audioClip", "playStartAction", "playSelectionAction", "playStopAction", "zoomInAction", "zoomOutAction", "zoomFitToPanelAction", "zoomSelectedAction", "autoPlayOnSelectToggleAction"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: AudioDisplay, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: AudioDisplay, decorators: [{
             type: Component,
             args: [{
                     selector: 'app-audiodisplay',
@@ -5049,9 +5035,9 @@ class ScrollIntoViewDirective {
         }
     }
 }
-ScrollIntoViewDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: ScrollIntoViewDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-ScrollIntoViewDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.5", type: ScrollIntoViewDirective, selector: "[scrollIntoViewToBottom]", inputs: { scrollIntoViewToBottom: "scrollIntoViewToBottom" }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: ScrollIntoViewDirective, decorators: [{
+ScrollIntoViewDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: ScrollIntoViewDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+ScrollIntoViewDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.10", type: ScrollIntoViewDirective, selector: "[scrollIntoViewToBottom]", inputs: { scrollIntoViewToBottom: "scrollIntoViewToBottom" }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: ScrollIntoViewDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: "[scrollIntoViewToBottom]"
@@ -5085,8 +5071,8 @@ class Progress {
         }
     }
 }
-Progress.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: Progress, deps: [], target: i0.ɵɵFactoryTarget.Component });
-Progress.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: Progress, selector: "app-sprprogress", inputs: { items: "items", selectedItemIdx: "selectedItemIdx", enableDownload: "enableDownload" }, outputs: { onRowSelect: "onRowSelect", rowSelect: "rowSelect", onShowDoneAction: "onShowDoneAction", clickDone: "clickDone", onDownloadDoneAction: "onDownloadDoneAction", clickDownloadDone: "clickDownloadDone" }, ngImport: i0, template: `
+Progress.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: Progress, deps: [], target: i0.ɵɵFactoryTarget.Component });
+Progress.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.10", type: Progress, selector: "app-sprprogress", inputs: { items: "items", selectedItemIdx: "selectedItemIdx", enableDownload: "enableDownload" }, outputs: { onRowSelect: "onRowSelect", rowSelect: "rowSelect", onShowDoneAction: "onShowDoneAction", clickDone: "clickDone", onDownloadDoneAction: "onDownloadDoneAction", clickDownloadDone: "clickDownloadDone" }, ngImport: i0, template: `
 
     <table class="mat-typography">
       <thead>
@@ -5114,7 +5100,7 @@ Progress.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.
       </tbody>
     </table>
   `, isInline: true, styles: [":host {\n    overflow-x: hidden;\n    overflow-y: scroll;\n    padding: 10pt;\n    /*flex: 0.1 0 300px;  \n      min-width: 300px; */\n    flex: 0.1 0 content;\n    background: white;\n    /* Workaround for Firefox\n    If the progress table gets long (script with many items) FF increases the height of the overflow progressContainer and\n    the whole app does not fit into the page anymore. The app overflows and shows a vertical scrollbar for the whole app.\n    See http://stackoverflow.com/questions/28636832/firefox-overflow-y-not-working-with-nested-flexbox\n    */\n    /* min-height:0px; */\n    min-height: 1px;\n  }", "table {\n      min-height: 1px;\n      border-collapse: collapse;\n          /* Tables do not have a natural min size */\n          /*min-width: 300px; */\n      \n    }\n\n    table, th, td {\n      border: 1px solid lightgrey;\n      padding: 0.5em;\n     \n    }\n\n    ", "\n      .selRow {\n        background: lightblue;\n      }\n    ", ".promptDescriptor{\n      \n      max-width: 200px;\n      text-overflow: ellipsis;\n      overflow: hidden;\n      white-space: nowrap;\n    }"], components: [{ type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: ScrollIntoViewDirective, selector: "[scrollIntoViewToBottom]", inputs: ["scrollIntoViewToBottom"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: Progress, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: Progress, decorators: [{
             type: Component,
             args: [{
                     selector: 'app-sprprogress',
@@ -5220,12 +5206,12 @@ class Recinstructions {
         return riTxt;
     }
 }
-Recinstructions.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: Recinstructions, deps: [], target: i0.ɵɵFactoryTarget.Component });
-Recinstructions.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: Recinstructions, selector: "spr-recinstructions", inputs: { recinstructions: "recinstructions", selectedItemIdx: "selectedItemIdx", itemCount: "itemCount" }, ngImport: i0, template: `
+Recinstructions.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: Recinstructions, deps: [], target: i0.ɵɵFactoryTarget.Component });
+Recinstructions.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.10", type: Recinstructions, selector: "spr-recinstructions", inputs: { recinstructions: "recinstructions", selectedItemIdx: "selectedItemIdx", itemCount: "itemCount" }, ngImport: i0, template: `
 
     {{displayText()}}
   `, isInline: true, styles: [":host {\n\n    justify-content: left; /* align horizontal center */\n    align-items: flex-start; /* align vertical  center */\n    background: white;\n    text-align: left;\n    font-size: 1em;\n    flex: 0;\n    width: 100%;\n  }\n  "] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: Recinstructions, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: Recinstructions, decorators: [{
             type: Component,
             args: [{
                     selector: 'spr-recinstructions',
@@ -5413,13 +5399,13 @@ class Prompter {
         }
     }
 }
-Prompter.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: Prompter, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: ProjectService }], target: i0.ɵɵFactoryTarget.Component });
-Prompter.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: Prompter, selector: "app-sprprompter", inputs: { projectName: "projectName", prompterHeight: "prompterHeight", promptMediaItems: "promptMediaItems" }, host: { properties: { "class.fill": "this.prompterStyleFill" } }, ngImport: i0, template: `
+Prompter.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: Prompter, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: ProjectService }], target: i0.ɵɵFactoryTarget.Component });
+Prompter.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.10", type: Prompter, selector: "app-sprprompter", inputs: { projectName: "projectName", prompterHeight: "prompterHeight", promptMediaItems: "promptMediaItems" }, host: { properties: { "class.fill": "this.prompterStyleFill" } }, ngImport: i0, template: `
 
     <!--<ng-template [ngIf]="text">{{text}}</ng-template>-->
     <!-- <img *ngIf="src" #promptImage [src]="srcUrl()" [height]="prompterHeight-20" /> -->
   `, isInline: true, styles: [":host {\n\n    justify-content: center; /* align horizontal center */\n    align-items: center; /* align vertical  center */\n    background: white;\n    text-align: center;\n    /* font-size: 2em; */\n    line-height: 1.2em;\n    font-weight: bold;\n    /* Use only natural size of the prompt */\n    /* The prompter compnent then ets aligned vertically centered */\n    flex: 0 1;\n\n  }", ":host(.fill) {\n    /* Use all space to scale images */\n    flex: 3;\n    width: 100%;\n    height: 100%;\n    max-height: 100%;\n    max-width: 100%;\n    /* A separate flex container might be necessayr to alighn centered */\n    vertical-align: middle; /* TODO does not work, image is not vertically centered */\n  }"] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: Prompter, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: Prompter, decorators: [{
             type: Component,
             args: [{
                     selector: 'app-sprprompter',
@@ -5593,11 +5579,11 @@ class PromptContainer {
         }
     }
 }
-PromptContainer.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: PromptContainer, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-PromptContainer.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: PromptContainer, selector: "app-sprpromptcontainer", inputs: { projectName: "projectName", mediaitems: "mediaitems" }, host: { listeners: { "window:resize": "onResize($event)" } }, viewQueries: [{ propertyName: "prompter", first: true, predicate: Prompter, descendants: true, static: true }], ngImport: i0, template: `
+PromptContainer.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: PromptContainer, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+PromptContainer.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.10", type: PromptContainer, selector: "app-sprpromptcontainer", inputs: { projectName: "projectName", mediaitems: "mediaitems" }, host: { listeners: { "window:resize": "onResize($event)" } }, viewQueries: [{ propertyName: "prompter", first: true, predicate: Prompter, descendants: true, static: true }], ngImport: i0, template: `
     <app-sprprompter #prompter [projectName]="projectName" [promptMediaItems]="mediaitems" [style.font-size]="fontSize+'px'" [style.visibility]="prDisplay" [prompterHeight]="prompterHeight"></app-sprprompter>
   `, isInline: true, styles: [":host {\n\n    flex: 3; /* the container consumes all available space */\n    padding: 10pt;\n    height: 100%;\n    max-height: 100%;\n\n    justify-content: center; /* align horizontal center*/\n    align-items: center; /* align vertical center */\n    background: white;\n    text-align: center;\n    display: flex;\n    flex-direction: column;\n    min-height: 0px;\n    width: 100%;\n  }\n  "], components: [{ type: Prompter, selector: "app-sprprompter", inputs: ["projectName", "prompterHeight", "promptMediaItems"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: PromptContainer, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: PromptContainer, decorators: [{
             type: Component,
             args: [{
                     selector: 'app-sprpromptcontainer',
@@ -5740,15 +5726,15 @@ class PromptingContainer {
         ev.preventDefault();
     }
 }
-PromptingContainer.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: PromptingContainer, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-PromptingContainer.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: PromptingContainer, selector: "app-sprpromptingcontainer", inputs: { projectName: "projectName", promptItem: "promptItem", showPrompt: "showPrompt", selectedItemIdx: "selectedItemIdx", itemCount: "itemCount", transportActions: "transportActions" }, host: { listeners: { "touchstart": "onTouchstart($event)", "touchend": "onTouchEnd($event)", "touchmove": "onTouchMove($event)", "touchcancel": "onTouchCancel($event)" } }, ngImport: i0, template: `
+PromptingContainer.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: PromptingContainer, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+PromptingContainer.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.10", type: PromptingContainer, selector: "app-sprpromptingcontainer", inputs: { projectName: "projectName", promptItem: "promptItem", showPrompt: "showPrompt", selectedItemIdx: "selectedItemIdx", itemCount: "itemCount", transportActions: "transportActions" }, host: { listeners: { "touchstart": "onTouchstart($event)", "touchend": "onTouchEnd($event)", "touchmove": "onTouchMove($event)", "touchcancel": "onTouchCancel($event)" } }, ngImport: i0, template: `
     <spr-recinstructions [selectedItemIdx]="selectedItemIdx" [itemCount]="itemCount"
                          [recinstructions]="promptItem?.recinstructions?.recinstructions"></spr-recinstructions>
     <app-sprpromptcontainer [projectName]="projectName"
                             [mediaitems]="showPrompt?(promptItem?promptItem.mediaitems:null):null"></app-sprpromptcontainer>
 
   `, isInline: true, styles: [":host {\n    position: relative;\n    flex: 3; /* the container consumes all available space */\n    padding: 10pt;\n    justify-content: center; /* align horizontal center*/\n    align-items: center; /* align vertical center */\n    background: white;\n    text-align: center;\n    display: flex;\n    flex-direction: column;\n    min-height: 0px;\n  }\n  "], components: [{ type: Recinstructions, selector: "spr-recinstructions", inputs: ["recinstructions", "selectedItemIdx", "itemCount"] }, { type: PromptContainer, selector: "app-sprpromptcontainer", inputs: ["projectName", "mediaitems"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: PromptingContainer, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: PromptingContainer, decorators: [{
             type: Component,
             args: [{
                     selector: 'app-sprpromptingcontainer',
@@ -5820,8 +5806,8 @@ class Prompting {
         this.onPrevItem.emit();
     }
 }
-Prompting.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: Prompting, deps: [], target: i0.ɵɵFactoryTarget.Component });
-Prompting.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: Prompting, selector: "app-sprprompting", inputs: { projectName: "projectName", startStopSignalState: "startStopSignalState", promptItem: "promptItem", showPrompt: "showPrompt", items: "items", selectedItemIdx: "selectedItemIdx", transportActions: "transportActions", enableDownload: "enableDownload", audioSignalCollapsed: "audioSignalCollapsed", displayAudioClip: "displayAudioClip", playStartAction: "playStartAction", playSelectionAction: "playSelectionAction", autoPlayOnSelectToggleAction: "autoPlayOnSelectToggleAction", playStopAction: "playStopAction" }, outputs: { onItemSelect: "onItemSelect", onNextItem: "onNextItem", onPrevItem: "onPrevItem" }, viewQueries: [{ propertyName: "simpleTrafficLight", first: true, predicate: SimpleTrafficLight, descendants: true, static: true }, { propertyName: "audioDisplay", first: true, predicate: AudioDisplay, descendants: true, static: true }], ngImport: i0, template: `
+Prompting.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: Prompting, deps: [], target: i0.ɵɵFactoryTarget.Component });
+Prompting.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.10", type: Prompting, selector: "app-sprprompting", inputs: { projectName: "projectName", startStopSignalState: "startStopSignalState", promptItem: "promptItem", showPrompt: "showPrompt", items: "items", selectedItemIdx: "selectedItemIdx", transportActions: "transportActions", enableDownload: "enableDownload", audioSignalCollapsed: "audioSignalCollapsed", displayAudioClip: "displayAudioClip", playStartAction: "playStartAction", playSelectionAction: "playSelectionAction", autoPlayOnSelectToggleAction: "autoPlayOnSelectToggleAction", playStopAction: "playStopAction" }, outputs: { onItemSelect: "onItemSelect", onNextItem: "onNextItem", onPrevItem: "onPrevItem" }, viewQueries: [{ propertyName: "simpleTrafficLight", first: true, predicate: SimpleTrafficLight, descendants: true, static: true }, { propertyName: "audioDisplay", first: true, predicate: AudioDisplay, descendants: true, static: true }], ngImport: i0, template: `
 
     <app-simpletrafficlight [status]="startStopSignalState"></app-simpletrafficlight>
     <app-sprpromptingcontainer [projectName]="projectName" [promptItem]="promptItem" [showPrompt]="showPrompt"
@@ -5844,7 +5830,7 @@ Prompting.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12
 
 
   `, isInline: true, styles: [":host {\n    position: relative;\n    margin: 0;\n    padding: 0;\n    background: lightgrey;\n    width: 100%; /* use all horizontal available space */\n    flex: 1; /* ... and fill rest of vertical available space (other components have flex 0) */\n\n    /* Workaround for Firefox\n    If the progress table gets long (script with many items) FF increases the height of the overflow progressContainer and\n    the whole app does not fit into the page anymore. The app overflows and shows a vertical scrollbar for the whole app.\n    See http://stackoverflow.com/questions/28636832/firefox-overflow-y-not-working-with-nested-flexbox\n    */\n    min-height: 0px;\n\n    display: flex; /* flex container: left traffic light, right prompter (container) */\n    flex-direction: row;\n    flex-wrap: nowrap; /* wrap could completely destroy the layout */\n  }", "\n    app-simpletrafficlight {\n      margin: 10px;\n      min-height: 0px;\n      z-index: 3;\n    }\n  ", "\n    app-sprprogress {\n      z-index: 3;\n    }\n  ", "\n    div {\n      display: none;\n      position: absolute;\n\n\n      /* height: 50%; */\n      /* width: 100%; */\n\n      /* overflow: hidden; */\n\n      /* margin: 20px; */\n      /* border: 20px; */\n      z-index: 5;\n      /*background-color: red; */\n    }", "\n    div.active {\n      display: flex;\n      position: absolute;\n      bottom: 0px;\n      /*left: 0px; */\n\n      height: 90%;\n      width: 100%;\n\n      overflow: hidden;\n\n      padding: 0px;\n      /* margin: 20px; */\n      /* border: 20px; */\n      z-index: 5;\n      box-sizing: border-box;\n      background-color: rgba(0, 0, 0, 0)\n\n    }"], components: [{ type: SimpleTrafficLight, selector: "app-simpletrafficlight", inputs: ["status"] }, { type: PromptingContainer, selector: "app-sprpromptingcontainer", inputs: ["projectName", "promptItem", "showPrompt", "selectedItemIdx", "itemCount", "transportActions"] }, { type: Progress, selector: "app-sprprogress", inputs: ["items", "selectedItemIdx", "enableDownload"], outputs: ["onRowSelect", "rowSelect", "onShowDoneAction", "clickDone", "onDownloadDoneAction", "clickDownloadDone"] }, { type: AudioDisplay, selector: "app-audiodisplay", inputs: ["playStartAction", "playStopAction", "playSelectionAction", "autoPlayOnSelectToggleAction", "audioData", "audioClip"] }], directives: [{ type: i6.DefaultShowHideDirective, selector: "  [fxShow], [fxShow.print],  [fxShow.xs], [fxShow.sm], [fxShow.md], [fxShow.lg], [fxShow.xl],  [fxShow.lt-sm], [fxShow.lt-md], [fxShow.lt-lg], [fxShow.lt-xl],  [fxShow.gt-xs], [fxShow.gt-sm], [fxShow.gt-md], [fxShow.gt-lg],  [fxHide], [fxHide.print],  [fxHide.xs], [fxHide.sm], [fxHide.md], [fxHide.lg], [fxHide.xl],  [fxHide.lt-sm], [fxHide.lt-md], [fxHide.lt-lg], [fxHide.lt-xl],  [fxHide.gt-xs], [fxHide.gt-sm], [fxHide.gt-md], [fxHide.gt-lg]", inputs: ["fxShow", "fxShow.print", "fxShow.xs", "fxShow.sm", "fxShow.md", "fxShow.lg", "fxShow.xl", "fxShow.lt-sm", "fxShow.lt-md", "fxShow.lt-lg", "fxShow.lt-xl", "fxShow.gt-xs", "fxShow.gt-sm", "fxShow.gt-md", "fxShow.gt-lg", "fxHide", "fxHide.print", "fxHide.xs", "fxHide.sm", "fxHide.md", "fxHide.lg", "fxHide.xl", "fxHide.lt-sm", "fxHide.lt-md", "fxHide.lt-lg", "fxHide.lt-xl", "fxHide.gt-xs", "fxHide.gt-sm", "fxHide.gt-md", "fxHide.gt-lg"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: Prompting, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: Prompting, decorators: [{
             type: Component,
             args: [{
                     selector: 'app-sprprompting',
@@ -6076,14 +6062,14 @@ class StatusDisplay {
         this.statusWaiting = false;
     }
 }
-StatusDisplay.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: StatusDisplay, deps: [], target: i0.ɵɵFactoryTarget.Component });
-StatusDisplay.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: StatusDisplay, selector: "app-sprstatusdisplay", inputs: { statusAlertType: "statusAlertType", statusMsg: "statusMsg", statusWaiting: "statusWaiting" }, ngImport: i0, template: `
+StatusDisplay.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: StatusDisplay, deps: [], target: i0.ɵɵFactoryTarget.Component });
+StatusDisplay.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.10", type: StatusDisplay, selector: "app-sprstatusdisplay", inputs: { statusAlertType: "statusAlertType", statusMsg: "statusMsg", statusWaiting: "statusWaiting" }, ngImport: i0, template: `
     <p matTooltip="Status">
       <mat-progress-spinner *ngIf="statusWaiting" color="black"  mode="indeterminate" [diameter]="30" [strokeWidth]="5"></mat-progress-spinner><mat-icon *ngIf="statusAlertType==='error'" style="color:red">report_problem</mat-icon>
       {{statusMsg}}
     </p>
   `, isInline: true, styles: [":host {\n    flex: 1;\n    /* align-self: flex-start; */\n    display: inline;\n    text-align: left;\n    font-size: smaller;\n  }", "\n    p {\n      white-space:nowrap;\n      display: inline-block;\n    }\n  ", "\n    mat-progress-spinner {\n      color: black;\n      display: inline-block;\n    }\n  ", "\n    span {\n      color: red;\n    }\n  "], components: [{ type: i1$2.MatProgressSpinner, selector: "mat-progress-spinner", inputs: ["color", "mode", "diameter", "strokeWidth", "value"], exportAs: ["matProgressSpinner"] }, { type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: StatusDisplay, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: StatusDisplay, decorators: [{
             type: Component,
             args: [{
                     selector: 'app-sprstatusdisplay',
@@ -6169,11 +6155,11 @@ class UploadStatus {
         return this._status;
     }
 }
-UploadStatus.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: UploadStatus, deps: [], target: i0.ɵɵFactoryTarget.Component });
-UploadStatus.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: UploadStatus, selector: "app-uploadstatus", inputs: { value: "value", awaitNewUpload: "awaitNewUpload", status: "status" }, ngImport: i0, template: `
+UploadStatus.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: UploadStatus, deps: [], target: i0.ɵɵFactoryTarget.Component });
+UploadStatus.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.10", type: UploadStatus, selector: "app-uploadstatus", inputs: { value: "value", awaitNewUpload: "awaitNewUpload", status: "status" }, ngImport: i0, template: `
     <mat-progress-spinner [mode]="spinnerMode" [color]="status" [diameter]="30" [strokeWidth]="5" [value]="_value" [matTooltip]="toolTipText"></mat-progress-spinner>
   `, isInline: true, styles: [":host {\n    flex: 1;\n  /* align-self: flex-start; */\n    /*display: inline; */\n    text-align: left;\n  }", "mat-progress-spinner{\n      display: inline-block;\n  }"], components: [{ type: i1$2.MatProgressSpinner, selector: "mat-progress-spinner", inputs: ["color", "mode", "diameter", "strokeWidth", "value"], exportAs: ["matProgressSpinner"] }], directives: [{ type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: UploadStatus, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: UploadStatus, decorators: [{
             type: Component,
             args: [{
                     selector: 'app-uploadstatus',
@@ -6201,11 +6187,11 @@ class ProgressDisplay {
         this.progressMsg = '[itemcode]';
     }
 }
-ProgressDisplay.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: ProgressDisplay, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ProgressDisplay.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: ProgressDisplay, selector: "app-sprprogressdisplay", ngImport: i0, template: `
+ProgressDisplay.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: ProgressDisplay, deps: [], target: i0.ɵɵFactoryTarget.Component });
+ProgressDisplay.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.10", type: ProgressDisplay, selector: "app-sprprogressdisplay", ngImport: i0, template: `
     <p>{{progressMsg}}</p>
   `, isInline: true, styles: [":host {\n    flex: 1;\n  /* align-self: flex-start; */\n    /*display: inline; */\n      width: 100%;\n    text-align: left;\n  }"] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: ProgressDisplay, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: ProgressDisplay, decorators: [{
             type: Component,
             args: [{
                     selector: 'app-sprprogressdisplay',
@@ -6233,6 +6219,9 @@ class TransportActions {
     }
 }
 class TransportPanel {
+    constructor() {
+        this.navigationEnabled = true;
+    }
     startDisabled() {
         return !this.actions || this.readonly || this.actions.startAction.disabled;
     }
@@ -6240,19 +6229,19 @@ class TransportPanel {
         return !this.actions || this.actions.stopAction.disabled;
     }
     nextDisabled() {
-        return !this.actions || this.actions.nextAction.disabled;
+        return !this.actions || this.actions.nextAction.disabled || !this.navigationEnabled;
     }
     pauseDisabled() {
         return !this.actions || this.actions.pauseAction.disabled;
     }
     fwdDisabled() {
-        return !this.actions || this.actions.fwdAction.disabled;
+        return !this.actions || this.actions.fwdAction.disabled || !this.navigationEnabled;
     }
     fwdNextDisabled() {
-        return !this.actions || this.actions.fwdNextAction.disabled;
+        return !this.actions || this.actions.fwdNextAction.disabled || !this.navigationEnabled;
     }
     bwdDisabled() {
-        return !this.actions || this.actions.bwdAction.disabled;
+        return !this.actions || this.actions.bwdAction.disabled || !this.navigationEnabled;
     }
     startStopNextName() {
         if (!this.nextDisabled()) {
@@ -6301,9 +6290,9 @@ class TransportPanel {
         }
     }
 }
-TransportPanel.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: TransportPanel, deps: [], target: i0.ɵɵFactoryTarget.Component });
-TransportPanel.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: TransportPanel, selector: "app-sprtransport", inputs: { readonly: "readonly", actions: "actions" }, ngImport: i0, template: `
-    <button id="bwdBtn" (click)="actions.bwdAction.perform()" [disabled]="bwdDisabled()"
+TransportPanel.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: TransportPanel, deps: [], target: i0.ɵɵFactoryTarget.Component });
+TransportPanel.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.10", type: TransportPanel, selector: "app-sprtransport", inputs: { readonly: "readonly", actions: "actions", navigationEnabled: "navigationEnabled" }, ngImport: i0, template: `
+    <button id="bwdBtn" *ngIf="navigationEnabled"  (click)="actions.bwdAction.perform()" [disabled]="bwdDisabled()"
             mat-raised-button>
       <mat-icon>chevron_left</mat-icon>
     </button>
@@ -6315,20 +6304,20 @@ TransportPanel.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version
       <mat-icon>pause</mat-icon>
       <span fxShow.xs="false">Pause</span>
     </button>
-    <button id="fwdNextBtn" fxHide.xs (click)="actions.fwdNextAction.perform()" [disabled]="fwdNextDisabled()" mat-raised-button>
+    <button id="fwdNextBtn" *ngIf="navigationEnabled" fxHide.xs (click)="actions.fwdNextAction.perform()" [disabled]="fwdNextDisabled()" mat-raised-button>
       <mat-icon>redo</mat-icon>
     </button>
-    <button id="fwdBtn"  (click)="actions.fwdAction.perform()" [disabled]="fwdDisabled()" mat-raised-button>
+    <button id="fwdBtn" *ngIf="navigationEnabled"  (click)="actions.fwdAction.perform()" [disabled]="fwdDisabled()" mat-raised-button>
       <mat-icon>chevron_right</mat-icon>
     </button>
 
   `, isInline: true, styles: [":host {\n    flex: 20;\n    align-self: center;\n    width: 100%;\n    text-align: center;\n    align-content: center;\n    margin: 0;\n  }", "\n    div {\n      display: inline;\n      flex: 0;\n    }"], components: [{ type: i3$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.DefaultShowHideDirective, selector: "  [fxShow], [fxShow.print],  [fxShow.xs], [fxShow.sm], [fxShow.md], [fxShow.lg], [fxShow.xl],  [fxShow.lt-sm], [fxShow.lt-md], [fxShow.lt-lg], [fxShow.lt-xl],  [fxShow.gt-xs], [fxShow.gt-sm], [fxShow.gt-md], [fxShow.gt-lg],  [fxHide], [fxHide.print],  [fxHide.xs], [fxHide.sm], [fxHide.md], [fxHide.lg], [fxHide.xl],  [fxHide.lt-sm], [fxHide.lt-md], [fxHide.lt-lg], [fxHide.lt-xl],  [fxHide.gt-xs], [fxHide.gt-sm], [fxHide.gt-md], [fxHide.gt-lg]", inputs: ["fxShow", "fxShow.print", "fxShow.xs", "fxShow.sm", "fxShow.md", "fxShow.lg", "fxShow.xl", "fxShow.lt-sm", "fxShow.lt-md", "fxShow.lt-lg", "fxShow.lt-xl", "fxShow.gt-xs", "fxShow.gt-sm", "fxShow.gt-md", "fxShow.gt-lg", "fxHide", "fxHide.print", "fxHide.xs", "fxHide.sm", "fxHide.md", "fxHide.lg", "fxHide.xl", "fxHide.lt-sm", "fxHide.lt-md", "fxHide.lt-lg", "fxHide.lt-xl", "fxHide.gt-xs", "fxHide.gt-sm", "fxHide.gt-md", "fxHide.gt-lg"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: TransportPanel, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: TransportPanel, decorators: [{
             type: Component,
             args: [{
                     selector: 'app-sprtransport',
                     template: `
-    <button id="bwdBtn" (click)="actions.bwdAction.perform()" [disabled]="bwdDisabled()"
+    <button id="bwdBtn" *ngIf="navigationEnabled"  (click)="actions.bwdAction.perform()" [disabled]="bwdDisabled()"
             mat-raised-button>
       <mat-icon>chevron_left</mat-icon>
     </button>
@@ -6340,10 +6329,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImpor
       <mat-icon>pause</mat-icon>
       <span fxShow.xs="false">Pause</span>
     </button>
-    <button id="fwdNextBtn" fxHide.xs (click)="actions.fwdNextAction.perform()" [disabled]="fwdNextDisabled()" mat-raised-button>
+    <button id="fwdNextBtn" *ngIf="navigationEnabled" fxHide.xs (click)="actions.fwdNextAction.perform()" [disabled]="fwdNextDisabled()" mat-raised-button>
       <mat-icon>redo</mat-icon>
     </button>
-    <button id="fwdBtn"  (click)="actions.fwdAction.perform()" [disabled]="fwdDisabled()" mat-raised-button>
+    <button id="fwdBtn" *ngIf="navigationEnabled"  (click)="actions.fwdAction.perform()" [disabled]="fwdDisabled()" mat-raised-button>
       <mat-icon>chevron_right</mat-icon>
     </button>
 
@@ -6366,11 +6355,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImpor
                 type: Input
             }], actions: [{
                 type: Input
+            }], navigationEnabled: [{
+                type: Input
             }] } });
 class ControlPanel {
     constructor(dialog) {
         this.dialog = dialog;
         this.processing = false;
+        this.navigationEnabled = true;
         this._ready = true;
         this.hourGlassIconName = 'hourglass_empty';
         this.readyStateToolTip = '';
@@ -6384,18 +6376,18 @@ class ControlPanel {
         return this._ready;
     }
 }
-ControlPanel.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: ControlPanel, deps: [{ token: i1$3.MatDialog }], target: i0.ɵɵFactoryTarget.Component });
-ControlPanel.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: ControlPanel, selector: "app-sprcontrolpanel", inputs: { readonly: "readonly", transportActions: "transportActions", processing: "processing", statusMsg: "statusMsg", statusAlertType: "statusAlertType", statusWaiting: "statusWaiting", uploadStatus: "uploadStatus", uploadProgress: "uploadProgress", currentRecording: "currentRecording", enableUploadRecordings: "enableUploadRecordings", ready: "ready" }, viewQueries: [{ propertyName: "statusDisplay", first: true, predicate: StatusDisplay, descendants: true, static: true }, { propertyName: "transportPanel", first: true, predicate: TransportPanel, descendants: true, static: true }], ngImport: i0, template: `
+ControlPanel.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: ControlPanel, deps: [{ token: i1$3.MatDialog }], target: i0.ɵɵFactoryTarget.Component });
+ControlPanel.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.10", type: ControlPanel, selector: "app-sprcontrolpanel", inputs: { readonly: "readonly", transportActions: "transportActions", processing: "processing", statusMsg: "statusMsg", statusAlertType: "statusAlertType", statusWaiting: "statusWaiting", uploadStatus: "uploadStatus", uploadProgress: "uploadProgress", currentRecording: "currentRecording", enableUploadRecordings: "enableUploadRecordings", navigationEnabled: "navigationEnabled", ready: "ready" }, viewQueries: [{ propertyName: "statusDisplay", first: true, predicate: StatusDisplay, descendants: true, static: true }, { propertyName: "transportPanel", first: true, predicate: TransportPanel, descendants: true, static: true }], ngImport: i0, template: `
     <app-sprstatusdisplay fxHide.xs [statusMsg]="statusMsg" [statusAlertType]="statusAlertType" [statusWaiting]="statusWaiting"
                           class="hidden-xs"></app-sprstatusdisplay>
 
-    <app-sprtransport [readonly]="readonly" [actions]="transportActions"></app-sprtransport>
+    <app-sprtransport [readonly]="readonly" [actions]="transportActions" [navigationEnabled]="navigationEnabled"></app-sprtransport>
 
     <app-uploadstatus fxHide.xs *ngIf="enableUploadRecordings" [value]="uploadProgress"
                       [status]="uploadStatus" [awaitNewUpload]="processing"></app-uploadstatus>
     <mat-icon fxHide.xs [matTooltip]="readyStateToolTip">{{hourGlassIconName}}</mat-icon>
-  `, isInline: true, styles: [":host {\n    flex: 0; /* only required vertical space */\n    /*  width: 100%; */ /* available horizontal sace */\n    /* display: inline; */\n    display: flex; /* Horizontal flex container: Bottom transport panel, above prompting panel */\n    flex-direction: row;\n    align-content: center;\n    align-items: center;\n    margin: 0;\n    padding: 20px;\n    min-height: min-content; /* important */\n  }", "\n    div {\n      flex: 0;\n    }\n  "], components: [{ type: StatusDisplay, selector: "app-sprstatusdisplay", inputs: ["statusAlertType", "statusMsg", "statusWaiting"] }, { type: TransportPanel, selector: "app-sprtransport", inputs: ["readonly", "actions"] }, { type: UploadStatus, selector: "app-uploadstatus", inputs: ["value", "awaitNewUpload", "status"] }, { type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i6.DefaultShowHideDirective, selector: "  [fxShow], [fxShow.print],  [fxShow.xs], [fxShow.sm], [fxShow.md], [fxShow.lg], [fxShow.xl],  [fxShow.lt-sm], [fxShow.lt-md], [fxShow.lt-lg], [fxShow.lt-xl],  [fxShow.gt-xs], [fxShow.gt-sm], [fxShow.gt-md], [fxShow.gt-lg],  [fxHide], [fxHide.print],  [fxHide.xs], [fxHide.sm], [fxHide.md], [fxHide.lg], [fxHide.xl],  [fxHide.lt-sm], [fxHide.lt-md], [fxHide.lt-lg], [fxHide.lt-xl],  [fxHide.gt-xs], [fxHide.gt-sm], [fxHide.gt-md], [fxHide.gt-lg]", inputs: ["fxShow", "fxShow.print", "fxShow.xs", "fxShow.sm", "fxShow.md", "fxShow.lg", "fxShow.xl", "fxShow.lt-sm", "fxShow.lt-md", "fxShow.lt-lg", "fxShow.lt-xl", "fxShow.gt-xs", "fxShow.gt-sm", "fxShow.gt-md", "fxShow.gt-lg", "fxHide", "fxHide.print", "fxHide.xs", "fxHide.sm", "fxHide.md", "fxHide.lg", "fxHide.xl", "fxHide.lt-sm", "fxHide.lt-md", "fxHide.lt-lg", "fxHide.lt-xl", "fxHide.gt-xs", "fxHide.gt-sm", "fxHide.gt-md", "fxHide.gt-lg"] }, { type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: ControlPanel, decorators: [{
+  `, isInline: true, styles: [":host {\n    flex: 0; /* only required vertical space */\n    /*  width: 100%; */ /* available horizontal sace */\n    /* display: inline; */\n    display: flex; /* Horizontal flex container: Bottom transport panel, above prompting panel */\n    flex-direction: row;\n    align-content: center;\n    align-items: center;\n    margin: 0;\n    padding: 20px;\n    min-height: min-content; /* important */\n  }", "\n    div {\n      flex: 0;\n    }\n  "], components: [{ type: StatusDisplay, selector: "app-sprstatusdisplay", inputs: ["statusAlertType", "statusMsg", "statusWaiting"] }, { type: TransportPanel, selector: "app-sprtransport", inputs: ["readonly", "actions", "navigationEnabled"] }, { type: UploadStatus, selector: "app-uploadstatus", inputs: ["value", "awaitNewUpload", "status"] }, { type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i6.DefaultShowHideDirective, selector: "  [fxShow], [fxShow.print],  [fxShow.xs], [fxShow.sm], [fxShow.md], [fxShow.lg], [fxShow.xl],  [fxShow.lt-sm], [fxShow.lt-md], [fxShow.lt-lg], [fxShow.lt-xl],  [fxShow.gt-xs], [fxShow.gt-sm], [fxShow.gt-md], [fxShow.gt-lg],  [fxHide], [fxHide.print],  [fxHide.xs], [fxHide.sm], [fxHide.md], [fxHide.lg], [fxHide.xl],  [fxHide.lt-sm], [fxHide.lt-md], [fxHide.lt-lg], [fxHide.lt-xl],  [fxHide.gt-xs], [fxHide.gt-sm], [fxHide.gt-md], [fxHide.gt-lg]", inputs: ["fxShow", "fxShow.print", "fxShow.xs", "fxShow.sm", "fxShow.md", "fxShow.lg", "fxShow.xl", "fxShow.lt-sm", "fxShow.lt-md", "fxShow.lt-lg", "fxShow.lt-xl", "fxShow.gt-xs", "fxShow.gt-sm", "fxShow.gt-md", "fxShow.gt-lg", "fxHide", "fxHide.print", "fxHide.xs", "fxHide.sm", "fxHide.md", "fxHide.lg", "fxHide.xl", "fxHide.lt-sm", "fxHide.lt-md", "fxHide.lt-lg", "fxHide.lt-xl", "fxHide.gt-xs", "fxHide.gt-sm", "fxHide.gt-md", "fxHide.gt-lg"] }, { type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: ControlPanel, decorators: [{
             type: Component,
             args: [{
                     selector: 'app-sprcontrolpanel',
@@ -6403,7 +6395,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImpor
     <app-sprstatusdisplay fxHide.xs [statusMsg]="statusMsg" [statusAlertType]="statusAlertType" [statusWaiting]="statusWaiting"
                           class="hidden-xs"></app-sprstatusdisplay>
 
-    <app-sprtransport [readonly]="readonly" [actions]="transportActions"></app-sprtransport>
+    <app-sprtransport [readonly]="readonly" [actions]="transportActions" [navigationEnabled]="navigationEnabled"></app-sprtransport>
 
     <app-uploadstatus fxHide.xs *ngIf="enableUploadRecordings" [value]="uploadProgress"
                       [status]="uploadStatus" [awaitNewUpload]="processing"></app-uploadstatus>
@@ -6452,6 +6444,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImpor
                 type: Input
             }], enableUploadRecordings: [{
                 type: Input
+            }], navigationEnabled: [{
+                type: Input
             }], ready: [{
                 type: Input
             }] } });
@@ -6465,8 +6459,8 @@ class SessionFinishedDialog {
         this.dialogRef.close();
     }
 }
-SessionFinishedDialog.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: SessionFinishedDialog, deps: [{ token: i1$3.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
-SessionFinishedDialog.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: SessionFinishedDialog, selector: "spr-session-finished-dialog", ngImport: i0, template: `<h1 mat-dialog-title><mat-icon [style.color]="'green'">done_all</mat-icon> Session finished</h1>
+SessionFinishedDialog.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: SessionFinishedDialog, deps: [{ token: i1$3.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
+SessionFinishedDialog.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.10", type: SessionFinishedDialog, selector: "spr-session-finished-dialog", ngImport: i0, template: `<h1 mat-dialog-title><mat-icon [style.color]="'green'">done_all</mat-icon> Session finished</h1>
   <div mat-dialog-content>
 
     <p>Thank you! The recording session is complete.</p>
@@ -6476,7 +6470,7 @@ SessionFinishedDialog.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0",
     <button mat-button (click)="closeDialog()">OK</button>
   </div>
   `, isInline: true, components: [{ type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i3$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i1$3.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1$3.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i1$3.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: SessionFinishedDialog, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: SessionFinishedDialog, decorators: [{
             type: Component,
             args: [{
                     selector: 'spr-session-finished-dialog',
@@ -6505,8 +6499,8 @@ class MessageDialog {
         this.dialogRef.close();
     }
 }
-MessageDialog.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: MessageDialog, deps: [{ token: i1$3.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
-MessageDialog.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: MessageDialog, selector: "msg-dialog", ngImport: i0, template: `<h1 mat-dialog-title><mat-icon *ngIf="data.type==='error'" [style.color]="'red'">error</mat-icon>
+MessageDialog.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: MessageDialog, deps: [{ token: i1$3.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
+MessageDialog.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.10", type: MessageDialog, selector: "msg-dialog", ngImport: i0, template: `<h1 mat-dialog-title><mat-icon *ngIf="data.type==='error'" [style.color]="'red'">error</mat-icon>
     <mat-icon *ngIf="data.type==='warning'" [style.color]="'yellow'">warning</mat-icon>{{data.title}}</h1>
   <div mat-dialog-content>
 
@@ -6518,7 +6512,7 @@ MessageDialog.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version:
     <button mat-button (click)="closeDialog()">OK</button>
   </div>
   `, isInline: true, components: [{ type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i3$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i1$3.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$3.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i1$3.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: MessageDialog, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: MessageDialog, decorators: [{
             type: Component,
             args: [{
                     selector: 'msg-dialog',
@@ -6718,9 +6712,9 @@ class RecordingService {
     }
 }
 RecordingService.REC_API_CTX = 'recfile';
-RecordingService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: RecordingService, deps: [{ token: i1.HttpClient }, { token: SPEECHRECORDER_CONFIG }], target: i0.ɵɵFactoryTarget.Injectable });
-RecordingService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: RecordingService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: RecordingService, decorators: [{
+RecordingService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: RecordingService, deps: [{ token: i1.HttpClient }, { token: SPEECHRECORDER_CONFIG }], target: i0.ɵɵFactoryTarget.Injectable });
+RecordingService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: RecordingService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: RecordingService, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: i1.HttpClient }, { type: SpeechRecorderConfig, decorators: [{
                     type: Inject,
@@ -6734,9 +6728,9 @@ class SpeechRecorderUploader extends Uploader {
         this.config = config;
     }
 }
-SpeechRecorderUploader.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: SpeechRecorderUploader, deps: [{ token: i1.HttpClient }, { token: SPEECHRECORDER_CONFIG }], target: i0.ɵɵFactoryTarget.Injectable });
-SpeechRecorderUploader.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: SpeechRecorderUploader });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: SpeechRecorderUploader, decorators: [{
+SpeechRecorderUploader.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: SpeechRecorderUploader, deps: [{ token: i1.HttpClient }, { token: SPEECHRECORDER_CONFIG }], target: i0.ɵɵFactoryTarget.Injectable });
+SpeechRecorderUploader.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: SpeechRecorderUploader });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: SpeechRecorderUploader, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: i1.HttpClient }, { type: SpeechRecorderConfig, decorators: [{
                     type: Inject,
@@ -6756,12 +6750,12 @@ class WarningBar {
         }
     }
 }
-WarningBar.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: WarningBar, deps: [], target: i0.ɵɵFactoryTarget.Component });
-WarningBar.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: WarningBar, selector: "app-warningbar", inputs: { warningText: "warningText", show: "show" }, providers: [SessionService], ngImport: i0, template: `
+WarningBar.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: WarningBar, deps: [], target: i0.ɵɵFactoryTarget.Component });
+WarningBar.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.10", type: WarningBar, selector: "app-warningbar", inputs: { warningText: "warningText", show: "show" }, providers: [SessionService], ngImport: i0, template: `
     <div [class]="displayClass">{{warningText}}</div>
 
   `, isInline: true, styles: [":host {\n\n    flex: 0 0 content;\n    background: orange;\n\n  }", "\n    .off {\n      display: none;\n    }\n  ", "\n    .on {\n      padding: 2px;\n      display: inline-block;\n      width: 100%;\n      font-weight: bold;\n      font-size: larger;\n      text-align: center;\n    }\n  "] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: WarningBar, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: WarningBar, decorators: [{
             type: Component,
             args: [{
                     selector: 'app-warningbar',
@@ -6897,7 +6891,7 @@ class SessionManager {
         else {
             console.info("No audio context available!");
         }
-        if (!navigator.mediaDevices) {
+        if (!context || !navigator.mediaDevices) {
             this.status = 8 /* ERROR */;
             let errMsg = 'Browser does not support Media streams!';
             this.statusMsg = 'ERROR: ' + errMsg;
@@ -7859,8 +7853,8 @@ class SessionManager {
         });
     }
 }
-SessionManager.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: SessionManager, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: i1$3.MatDialog }, { token: SessionService }, { token: RecordingService }, { token: SpeechRecorderUploader }, { token: SPEECHRECORDER_CONFIG }], target: i0.ɵɵFactoryTarget.Component });
-SessionManager.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: SessionManager, selector: "app-sprrecordingsession", inputs: { projectName: "projectName", dataSaved: "dataSaved" }, host: { listeners: { "window:keypress": "onKeyPress($event)", "window:keydown": "onKeyDown($event)" } }, providers: [SessionService], viewQueries: [{ propertyName: "prompting", first: true, predicate: Prompting, descendants: true, static: true }, { propertyName: "liveLevelDisplay", first: true, predicate: LevelBarDisplay, descendants: true, static: true }], ngImport: i0, template: `
+SessionManager.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: SessionManager, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: i1$3.MatDialog }, { token: SessionService }, { token: RecordingService }, { token: SpeechRecorderUploader }, { token: SPEECHRECORDER_CONFIG }], target: i0.ɵɵFactoryTarget.Component });
+SessionManager.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.10", type: SessionManager, selector: "app-sprrecordingsession", inputs: { projectName: "projectName", dataSaved: "dataSaved" }, host: { listeners: { "window:keypress": "onKeyPress($event)", "window:keydown": "onKeyDown($event)" } }, providers: [SessionService], viewQueries: [{ propertyName: "prompting", first: true, predicate: Prompting, descendants: true, static: true }, { propertyName: "liveLevelDisplay", first: true, predicate: LevelBarDisplay, descendants: true, static: true }], ngImport: i0, template: `
     <app-warningbar [show]="isTestSession()" warningText="Test recording only!"></app-warningbar>
     <app-warningbar [show]="isDefaultAudioTestSession()" warningText="This test uses default audio device! Regular sessions may require a particular audio device (microphone)!"></app-warningbar>
       <app-sprprompting [projectName]="projectName"
@@ -7889,10 +7883,10 @@ SessionManager.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version
     <app-sprcontrolpanel [enableUploadRecordings]="enableUploadRecordings" [readonly]="readonly" [currentRecording]="displayAudioClip?.buffer"
                          [transportActions]="transportActions" [statusMsg]="statusMsg" [statusWaiting]="statusWaiting"
                          [statusAlertType]="statusAlertType" [uploadProgress]="uploadProgress"
-                         [uploadStatus]="uploadStatus" [ready]="dataSaved && !isActive()" [processing]="processingRecording"></app-sprcontrolpanel>
+                         [uploadStatus]="uploadStatus" [ready]="dataSaved && !isActive()" [processing]="processingRecording" [navigationEnabled]="items==null || items.length>1"></app-sprcontrolpanel>
 
-  `, isInline: true, styles: [":host {\n    flex: 2;\n    background: lightgrey;\n    display: flex; /* Vertical flex container: Bottom transport panel, above prompting panel */\n    flex-direction: column;\n    margin: 0;\n    padding: 0;\n    min-height: 0px;\n\n      /* Prevents horizontal scroll bar on swipe right */\n      overflow: hidden;\n  }"], components: [{ type: WarningBar, selector: "app-warningbar", inputs: ["warningText", "show"] }, { type: Prompting, selector: "app-sprprompting", inputs: ["projectName", "startStopSignalState", "promptItem", "showPrompt", "items", "selectedItemIdx", "transportActions", "enableDownload", "audioSignalCollapsed", "displayAudioClip", "playStartAction", "playSelectionAction", "autoPlayOnSelectToggleAction", "playStopAction"], outputs: ["onItemSelect", "onNextItem", "onPrevItem"] }, { type: i7.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "mode", "value", "bufferValue"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { type: LevelBarDisplay, selector: "spr-recordingitemdisplay", inputs: ["streamingMode", "audioSignalCollapsed", "enableDownload", "playStartAction", "playStopAction", "displayAudioBuffer", "displayLevelInfos"], outputs: ["onShowRecordingDetails", "onDownloadRecording"] }, { type: ControlPanel, selector: "app-sprcontrolpanel", inputs: ["readonly", "transportActions", "processing", "statusMsg", "statusAlertType", "statusWaiting", "uploadStatus", "uploadProgress", "currentRecording", "enableUploadRecordings", "ready"] }], directives: [{ type: i6.DefaultShowHideDirective, selector: "  [fxShow], [fxShow.print],  [fxShow.xs], [fxShow.sm], [fxShow.md], [fxShow.lg], [fxShow.xl],  [fxShow.lt-sm], [fxShow.lt-md], [fxShow.lt-lg], [fxShow.lt-xl],  [fxShow.gt-xs], [fxShow.gt-sm], [fxShow.gt-md], [fxShow.gt-lg],  [fxHide], [fxHide.print],  [fxHide.xs], [fxHide.sm], [fxHide.md], [fxHide.lg], [fxHide.xl],  [fxHide.lt-sm], [fxHide.lt-md], [fxHide.lt-lg], [fxHide.lt-xl],  [fxHide.gt-xs], [fxHide.gt-sm], [fxHide.gt-md], [fxHide.gt-lg]", inputs: ["fxShow", "fxShow.print", "fxShow.xs", "fxShow.sm", "fxShow.md", "fxShow.lg", "fxShow.xl", "fxShow.lt-sm", "fxShow.lt-md", "fxShow.lt-lg", "fxShow.lt-xl", "fxShow.gt-xs", "fxShow.gt-sm", "fxShow.gt-md", "fxShow.gt-lg", "fxHide", "fxHide.print", "fxHide.xs", "fxHide.sm", "fxHide.md", "fxHide.lg", "fxHide.xl", "fxHide.lt-sm", "fxHide.lt-md", "fxHide.lt-lg", "fxHide.lt-xl", "fxHide.gt-xs", "fxHide.gt-sm", "fxHide.gt-md", "fxHide.gt-lg"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: SessionManager, decorators: [{
+  `, isInline: true, styles: [":host {\n    flex: 2;\n    background: lightgrey;\n    display: flex; /* Vertical flex container: Bottom transport panel, above prompting panel */\n    flex-direction: column;\n    margin: 0;\n    padding: 0;\n    min-height: 0px;\n\n      /* Prevents horizontal scroll bar on swipe right */\n      overflow: hidden;\n  }"], components: [{ type: WarningBar, selector: "app-warningbar", inputs: ["warningText", "show"] }, { type: Prompting, selector: "app-sprprompting", inputs: ["projectName", "startStopSignalState", "promptItem", "showPrompt", "items", "selectedItemIdx", "transportActions", "enableDownload", "audioSignalCollapsed", "displayAudioClip", "playStartAction", "playSelectionAction", "autoPlayOnSelectToggleAction", "playStopAction"], outputs: ["onItemSelect", "onNextItem", "onPrevItem"] }, { type: i7.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "mode", "value", "bufferValue"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { type: LevelBarDisplay, selector: "spr-recordingitemdisplay", inputs: ["streamingMode", "audioSignalCollapsed", "enableDownload", "playStartAction", "playStopAction", "displayAudioBuffer", "displayLevelInfos"], outputs: ["onShowRecordingDetails", "onDownloadRecording"] }, { type: ControlPanel, selector: "app-sprcontrolpanel", inputs: ["readonly", "transportActions", "processing", "statusMsg", "statusAlertType", "statusWaiting", "uploadStatus", "uploadProgress", "currentRecording", "enableUploadRecordings", "navigationEnabled", "ready"] }], directives: [{ type: i6.DefaultShowHideDirective, selector: "  [fxShow], [fxShow.print],  [fxShow.xs], [fxShow.sm], [fxShow.md], [fxShow.lg], [fxShow.xl],  [fxShow.lt-sm], [fxShow.lt-md], [fxShow.lt-lg], [fxShow.lt-xl],  [fxShow.gt-xs], [fxShow.gt-sm], [fxShow.gt-md], [fxShow.gt-lg],  [fxHide], [fxHide.print],  [fxHide.xs], [fxHide.sm], [fxHide.md], [fxHide.lg], [fxHide.xl],  [fxHide.lt-sm], [fxHide.lt-md], [fxHide.lt-lg], [fxHide.lt-xl],  [fxHide.gt-xs], [fxHide.gt-sm], [fxHide.gt-md], [fxHide.gt-lg]", inputs: ["fxShow", "fxShow.print", "fxShow.xs", "fxShow.sm", "fxShow.md", "fxShow.lg", "fxShow.xl", "fxShow.lt-sm", "fxShow.lt-md", "fxShow.lt-lg", "fxShow.lt-xl", "fxShow.gt-xs", "fxShow.gt-sm", "fxShow.gt-md", "fxShow.gt-lg", "fxHide", "fxHide.print", "fxHide.xs", "fxHide.sm", "fxHide.md", "fxHide.lg", "fxHide.xl", "fxHide.lt-sm", "fxHide.lt-md", "fxHide.lt-lg", "fxHide.lt-xl", "fxHide.gt-xs", "fxHide.gt-sm", "fxHide.gt-md", "fxHide.gt-lg"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: SessionManager, decorators: [{
             type: Component,
             args: [{
                     selector: 'app-sprrecordingsession',
@@ -7926,7 +7920,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImpor
     <app-sprcontrolpanel [enableUploadRecordings]="enableUploadRecordings" [readonly]="readonly" [currentRecording]="displayAudioClip?.buffer"
                          [transportActions]="transportActions" [statusMsg]="statusMsg" [statusWaiting]="statusWaiting"
                          [statusAlertType]="statusAlertType" [uploadProgress]="uploadProgress"
-                         [uploadStatus]="uploadStatus" [ready]="dataSaved && !isActive()" [processing]="processingRecording"></app-sprcontrolpanel>
+                         [uploadStatus]="uploadStatus" [ready]="dataSaved && !isActive()" [processing]="processingRecording" [navigationEnabled]="items==null || items.length>1"></app-sprcontrolpanel>
 
   `,
                     styles: [`:host {
@@ -8009,9 +8003,9 @@ class ScriptService {
         return this.http.get(scriptUrl, { withCredentials: this.withCredentials });
     }
 }
-ScriptService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: ScriptService, deps: [{ token: i1.HttpClient }, { token: SPEECHRECORDER_CONFIG }], target: i0.ɵɵFactoryTarget.Injectable });
-ScriptService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: ScriptService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: ScriptService, decorators: [{
+ScriptService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: ScriptService, deps: [{ token: i1.HttpClient }, { token: SPEECHRECORDER_CONFIG }], target: i0.ɵɵFactoryTarget.Injectable });
+ScriptService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: ScriptService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: ScriptService, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: i1.HttpClient }, { type: SpeechRecorderConfig, decorators: [{
                     type: Inject,
@@ -8399,11 +8393,11 @@ class SpeechrecorderngComponent {
         this.sm.statusMsg = 'ERROR: Recording.';
     }
 }
-SpeechrecorderngComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: SpeechrecorderngComponent, deps: [{ token: i1$1.ActivatedRoute }, { token: i1$1.Router }, { token: i0.ChangeDetectorRef }, { token: SessionService }, { token: ProjectService }, { token: ScriptService }, { token: RecordingService }, { token: SpeechRecorderUploader }], target: i0.ɵɵFactoryTarget.Component });
-SpeechrecorderngComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: SpeechrecorderngComponent, selector: "app-speechrecorder", providers: [SessionService], viewQueries: [{ propertyName: "sm", first: true, predicate: SessionManager, descendants: true, static: true }], ngImport: i0, template: `
+SpeechrecorderngComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: SpeechrecorderngComponent, deps: [{ token: i1$1.ActivatedRoute }, { token: i1$1.Router }, { token: i0.ChangeDetectorRef }, { token: SessionService }, { token: ProjectService }, { token: ScriptService }, { token: RecordingService }, { token: SpeechRecorderUploader }], target: i0.ɵɵFactoryTarget.Component });
+SpeechrecorderngComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.10", type: SpeechrecorderngComponent, selector: "app-speechrecorder", providers: [SessionService], viewQueries: [{ propertyName: "sm", first: true, predicate: SessionManager, descendants: true, static: true }], ngImport: i0, template: `
     <app-sprrecordingsession [projectName]="project?.name" [dataSaved]="dataSaved"></app-sprrecordingsession>
   `, isInline: true, styles: [":host{\n    flex: 2;\n    display: flex;\n    flex-direction: column;\n    min-height:0;\n\n  }"], components: [{ type: SessionManager, selector: "app-sprrecordingsession", inputs: ["projectName", "dataSaved"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: SpeechrecorderngComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: SpeechrecorderngComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'app-speechrecorder',
@@ -8426,22 +8420,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImpor
 
 class ScrollPaneHorizontal {
 }
-ScrollPaneHorizontal.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: ScrollPaneHorizontal, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ScrollPaneHorizontal.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: ScrollPaneHorizontal, selector: "scroll-pane-horizontal", ngImport: i0, template: '', isInline: true, styles: [":host {\n      width: 100%;\n      background: darkgray;\n      box-sizing: border-box;\n      height: 100%;\n      position: relative;\n      overflow-x: scroll;\n      overflow-y: auto;\n    }"] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: ScrollPaneHorizontal, decorators: [{
+ScrollPaneHorizontal.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: ScrollPaneHorizontal, deps: [], target: i0.ɵɵFactoryTarget.Component });
+ScrollPaneHorizontal.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.10", type: ScrollPaneHorizontal, selector: "scroll-pane-horizontal", ngImport: i0, template: '', isInline: true, styles: [":host {\n      width: 100%;\n      background: darkgray;\n      box-sizing: border-box;\n      height: 100%;\n      position: relative;\n      overflow-x: scroll;\n      overflow-y: auto;\n    }"] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: ScrollPaneHorizontal, decorators: [{
             type: Component,
             args: [{
                     selector: 'scroll-pane-horizontal',
                     template: '',
                     styles: [
-                        `:host {
-      width: 100%;
-      background: darkgray;
-      box-sizing: border-box;
-      height: 100%;
-      position: relative;
-      overflow-x: scroll;
-      overflow-y: auto;
+                        `:host {
+      width: 100%;
+      background: darkgray;
+      box-sizing: border-box;
+      height: 100%;
+      position: relative;
+      overflow-x: scroll;
+      overflow-y: auto;
     }`
                     ]
                 }]
@@ -8645,8 +8639,8 @@ class AudioDisplayPlayer {
         this.status = 'ERROR';
     }
 }
-AudioDisplayPlayer.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: AudioDisplayPlayer, deps: [{ token: i1$1.ActivatedRoute }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-AudioDisplayPlayer.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: AudioDisplayPlayer, selector: "app-audiodisplayplayer", inputs: { playStartAction: "playStartAction", playStopAction: "playStopAction", playSelectionAction: "playSelectionAction", autoPlayOnSelectToggleAction: "autoPlayOnSelectToggleAction", audioData: "audioData", audioClip: "audioClip" }, viewQueries: [{ propertyName: "audioDisplayScrollPane", first: true, predicate: AudioDisplayScrollPane, descendants: true, static: true }], ngImport: i0, template: `
+AudioDisplayPlayer.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: AudioDisplayPlayer, deps: [{ token: i1$1.ActivatedRoute }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+AudioDisplayPlayer.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.10", type: AudioDisplayPlayer, selector: "app-audiodisplayplayer", inputs: { playStartAction: "playStartAction", playStopAction: "playStopAction", playSelectionAction: "playSelectionAction", autoPlayOnSelectToggleAction: "autoPlayOnSelectToggleAction", audioData: "audioData", audioClip: "audioClip" }, viewQueries: [{ propertyName: "audioDisplayScrollPane", first: true, predicate: AudioDisplayScrollPane, descendants: true, static: true }], ngImport: i0, template: `
 
     <audio-display-scroll-pane #audioDisplayScrollPane></audio-display-scroll-pane>
 
@@ -8660,7 +8654,7 @@ AudioDisplayPlayer.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ver
                              [zoomSelectedAction]="zoomSelectedAction"
                              [zoomFitToPanelAction]="zoomFitToPanelAction"></audio-display-control><p>{{status}}
   `, isInline: true, styles: [":host {\n      display: flex;\n      flex-direction: column;\n      position: absolute;\n      bottom: 0px;\n      height: 100%;\n      width: 100%;\n      overflow: hidden;\n      padding: 20px;\n      z-index: 5;\n      box-sizing: border-box;\n      background-color: rgba(0, 0, 0, 0.75)\n    }"], components: [{ type: AudioDisplayScrollPane, selector: "audio-display-scroll-pane", inputs: ["audioClip"], outputs: ["zoomInAction", "zoomOutAction", "zoomSelectedAction", "zoomFitToPanelAction"] }, { type: AudioDisplayControl, selector: "audio-display-control", inputs: ["audioClip", "playStartAction", "playSelectionAction", "playStopAction", "zoomInAction", "zoomOutAction", "zoomFitToPanelAction", "zoomSelectedAction", "autoPlayOnSelectToggleAction"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: AudioDisplayPlayer, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: AudioDisplayPlayer, decorators: [{
             type: Component,
             args: [{
                     selector: 'app-audiodisplayplayer',
@@ -8952,9 +8946,9 @@ class RecordingFileService {
     }
 }
 RecordingFileService.RECOFILE_API_CTX = 'recordingfile';
-RecordingFileService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: RecordingFileService, deps: [{ token: i1.HttpClient }, { token: SPEECHRECORDER_CONFIG }], target: i0.ɵɵFactoryTarget.Injectable });
-RecordingFileService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: RecordingFileService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: RecordingFileService, decorators: [{
+RecordingFileService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: RecordingFileService, deps: [{ token: i1.HttpClient }, { token: SPEECHRECORDER_CONFIG }], target: i0.ɵɵFactoryTarget.Injectable });
+RecordingFileService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: RecordingFileService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: RecordingFileService, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: i1.HttpClient }, { type: SpeechRecorderConfig, decorators: [{
                     type: Inject,
@@ -8974,8 +8968,8 @@ class RecordingFileMetaComponent {
         return t;
     }
 }
-RecordingFileMetaComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: RecordingFileMetaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-RecordingFileMetaComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: RecordingFileMetaComponent, selector: "app-recording-file-meta", inputs: { sessionId: "sessionId", recordingFile: "recordingFile" }, ngImport: i0, template: `
+RecordingFileMetaComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: RecordingFileMetaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+RecordingFileMetaComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.10", type: RecordingFileMetaComponent, selector: "app-recording-file-meta", inputs: { sessionId: "sessionId", recordingFile: "recordingFile" }, ngImport: i0, template: `
     <mat-card>
       <mat-card-title>Recording file ID: {{recordingFile?.recordingFileId}}</mat-card-title>
       <mat-card-content>
@@ -9001,7 +8995,7 @@ RecordingFileMetaComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0
       </mat-card-content>
     </mat-card>
   `, isInline: true, components: [{ type: i1$4.MatCard, selector: "mat-card", exportAs: ["matCard"] }], directives: [{ type: i1$4.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { type: i1$4.MatCardContent, selector: "mat-card-content, [mat-card-content], [matCardContent]" }, { type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: RecordingFileMetaComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: RecordingFileMetaComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'app-recording-file-meta',
@@ -9056,8 +9050,8 @@ class RecordingFileNaviComponent {
         }
     }
 }
-RecordingFileNaviComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: RecordingFileNaviComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-RecordingFileNaviComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: RecordingFileNaviComponent, selector: "app-recording-file-navi", inputs: { firstAction: "firstAction", prevAction: "prevAction", nextAction: "nextAction", lastAction: "lastAction", items: "items", itemPos: "itemPos", selectVersion: "selectVersion", versions: "versions", version: "version", naviInfoLoading: "naviInfoLoading" }, ngImport: i0, template: `
+RecordingFileNaviComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: RecordingFileNaviComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+RecordingFileNaviComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.10", type: RecordingFileNaviComponent, selector: "app-recording-file-navi", inputs: { firstAction: "firstAction", prevAction: "prevAction", nextAction: "nextAction", lastAction: "lastAction", items: "items", itemPos: "itemPos", selectVersion: "selectVersion", versions: "versions", version: "version", naviInfoLoading: "naviInfoLoading" }, ngImport: i0, template: `
         <div #controlPanel style="display:flex;flex-direction: row;">
           <div #navi style="flex: 0;display:flex;flex-direction: row;flex-wrap: nowrap">
             <fieldset>
@@ -9090,7 +9084,7 @@ RecordingFileNaviComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0
           </div>
         </div>
           `, isInline: true, styles: [":host {\n        flex: 0;\n\n      }"], components: [{ type: i1$2.MatProgressSpinner, selector: "mat-progress-spinner", inputs: ["color", "mode", "diameter", "strokeWidth", "value"], exportAs: ["matProgressSpinner"] }, { type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: RecordingFileNaviComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: RecordingFileNaviComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'app-recording-file-navi',
@@ -9453,8 +9447,8 @@ class RecordingFileViewComponent extends AudioDisplayPlayer {
         }
     }
 }
-RecordingFileViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: RecordingFileViewComponent, deps: [{ token: RecordingFileService }, { token: RecordingService }, { token: SessionService }, { token: i1$1.Router }, { token: i1$1.ActivatedRoute }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$3.MatDialog }], target: i0.ɵɵFactoryTarget.Component });
-RecordingFileViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: RecordingFileViewComponent, selector: "app-audiodisplayplayer", viewQueries: [{ propertyName: "ac", first: true, predicate: AudioDisplayScrollPane, descendants: true }], usesInheritance: true, ngImport: i0, template: `
+RecordingFileViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: RecordingFileViewComponent, deps: [{ token: RecordingFileService }, { token: RecordingService }, { token: SessionService }, { token: i1$1.Router }, { token: i1$1.ActivatedRoute }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$3.MatDialog }], target: i0.ɵɵFactoryTarget.Component });
+RecordingFileViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.10", type: RecordingFileViewComponent, selector: "app-audiodisplayplayer", viewQueries: [{ propertyName: "ac", first: true, predicate: AudioDisplayScrollPane, descendants: true }], usesInheritance: true, ngImport: i0, template: `
 
     <audio-display-scroll-pane #audioDisplayScrollPane></audio-display-scroll-pane>
     <div class="ctrlview">
@@ -9472,7 +9466,7 @@ RecordingFileViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0
       <app-recording-file-navi [items]="availRecFiles?.length" [itemPos]="posInList" [version]="recordingFile?recordingFile.version:null" [versions]="versions" [firstAction]="firstAction" [prevAction]="prevAction" [nextAction]="nextAction" [lastAction]="lastAction" [selectVersion]="toVersionAction" [naviInfoLoading]="naviInfoLoading"></app-recording-file-navi>
       </div>
   `, isInline: true, styles: [":host {\n          flex: 2;\n          display: flex;\n          flex-direction: column;\n          min-height:0;\n          overflow: hidden;\n      padding: 20px;\n      z-index: 5;\n      box-sizing: border-box;\n      background-color: white;\n    }", "\n        .ctrlview{\n          display: flex;\n          flex-direction: row;\n\n        }\n    ", "\n      audio-display-control{\n\n        flex: 3;\n      }\n    "], components: [{ type: AudioDisplayScrollPane, selector: "audio-display-scroll-pane", inputs: ["audioClip"], outputs: ["zoomInAction", "zoomOutAction", "zoomSelectedAction", "zoomFitToPanelAction"] }, { type: RecordingFileMetaComponent, selector: "app-recording-file-meta", inputs: ["sessionId", "recordingFile"] }, { type: AudioDisplayControl, selector: "audio-display-control", inputs: ["audioClip", "playStartAction", "playSelectionAction", "playStopAction", "zoomInAction", "zoomOutAction", "zoomFitToPanelAction", "zoomSelectedAction", "autoPlayOnSelectToggleAction"] }, { type: RecordingFileNaviComponent, selector: "app-recording-file-navi", inputs: ["firstAction", "prevAction", "nextAction", "lastAction", "items", "itemPos", "selectVersion", "versions", "version", "naviInfoLoading"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: RecordingFileViewComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: RecordingFileViewComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'app-audiodisplayplayer',
@@ -9599,8 +9593,8 @@ class RecordingFileUI extends RecordingFileViewComponent {
         }
     }
 }
-RecordingFileUI.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: RecordingFileUI, deps: [{ token: RecordingFileService }, { token: RecordingService }, { token: SessionService }, { token: i1$1.Router }, { token: i1$1.ActivatedRoute }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$3.MatDialog }, { token: i6$1.MatSnackBar }], target: i0.ɵɵFactoryTarget.Component });
-RecordingFileUI.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: RecordingFileUI, selector: "app-audiodisplayplayer", usesInheritance: true, ngImport: i0, template: `
+RecordingFileUI.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: RecordingFileUI, deps: [{ token: RecordingFileService }, { token: RecordingService }, { token: SessionService }, { token: i1$1.Router }, { token: i1$1.ActivatedRoute }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$3.MatDialog }, { token: i6$1.MatSnackBar }], target: i0.ɵɵFactoryTarget.Component });
+RecordingFileUI.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.10", type: RecordingFileUI, selector: "app-audiodisplayplayer", usesInheritance: true, ngImport: i0, template: `
       <h1>Recording file editing</h1>
       <p>On export or delivery the editing selection of the recording file is cut out. If no editing selection is applied the original file is exported.</p>
 
@@ -9621,7 +9615,7 @@ RecordingFileUI.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", versio
 
       <button mat-raised-button color="accent" (click)="applySelection()" [disabled]="editSaved">{{this.applyButtonText()}}</button>
   `, isInline: true, styles: [":host {\n          flex: 2;\n          display: flex;\n          flex-direction: column;\n          min-height:0;\n          overflow: hidden;\n      padding: 20px;\n      z-index: 5;\n      box-sizing: border-box;\n      background-color: white;\n    }", "\n        .ctrlview{\n          display: flex;\n          flex-direction: row;\n        }\n    ", "\n      audio-display-control{\n\n        flex: 3;\n      }\n    "], components: [{ type: AudioDisplayScrollPane, selector: "audio-display-scroll-pane", inputs: ["audioClip"], outputs: ["zoomInAction", "zoomOutAction", "zoomSelectedAction", "zoomFitToPanelAction"] }, { type: RecordingFileMetaComponent, selector: "app-recording-file-meta", inputs: ["sessionId", "recordingFile"] }, { type: AudioDisplayControl, selector: "audio-display-control", inputs: ["audioClip", "playStartAction", "playSelectionAction", "playStopAction", "zoomInAction", "zoomOutAction", "zoomFitToPanelAction", "zoomSelectedAction", "autoPlayOnSelectToggleAction"] }, { type: RecordingFileNaviComponent, selector: "app-recording-file-navi", inputs: ["firstAction", "prevAction", "nextAction", "lastAction", "items", "itemPos", "selectVersion", "versions", "version", "naviInfoLoading"] }, { type: i3$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: RecordingFileUI, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: RecordingFileUI, decorators: [{
             type: Component,
             args: [{
                     selector: 'app-audiodisplayplayer',
@@ -9699,11 +9693,11 @@ class SpeechrecorderngModule {
         };
     }
 }
-SpeechrecorderngModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: SpeechrecorderngModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-SpeechrecorderngModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: SpeechrecorderngModule, declarations: [AudioSignal, Sonagram, ScrollPaneHorizontal, AudioClipUIContainer, AudioDisplayScrollPane, AudioDisplay, AudioDisplayPlayer, AudioDisplayControl, LevelBar, Progress, SimpleTrafficLight, Recinstructions, Prompter, PromptContainer, PromptingContainer, Prompting, StatusDisplay,
+SpeechrecorderngModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: SpeechrecorderngModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+SpeechrecorderngModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: SpeechrecorderngModule, declarations: [AudioSignal, Sonagram, ScrollPaneHorizontal, AudioClipUIContainer, AudioDisplayScrollPane, AudioDisplay, AudioDisplayPlayer, AudioDisplayControl, LevelBar, Progress, SimpleTrafficLight, Recinstructions, Prompter, PromptContainer, PromptingContainer, Prompting, StatusDisplay,
         ProgressDisplay, LevelBarDisplay, UploadStatus, TransportPanel, ControlPanel, WarningBar, SessionManager, MessageDialog, SessionFinishedDialog, SpeechrecorderngComponent, RecordingFileViewComponent, RecordingFileUI, ScrollIntoViewDirective, RecordingFileNaviComponent, RecordingFileMetaComponent], imports: [i1$1.RouterModule, FlexLayoutModule, CommonModule, MatIconModule, MatButtonModule, MatDialogModule, MatProgressBarModule, MatProgressSpinnerModule, MatTooltipModule, HttpClientModule, MatCheckboxModule, MatCardModule, MatDividerModule, MatGridListModule, MatTableModule, MatInputModule, MatSelectModule, MatSnackBarModule], exports: [MessageDialog, SpeechrecorderngComponent, ScrollPaneHorizontal, AudioClipUIContainer, AudioDisplayScrollPane, AudioDisplay, AudioDisplayPlayer, AudioDisplayControl, LevelBar] });
-SpeechrecorderngModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: SpeechrecorderngModule, providers: [SessionService, ProjectService, ScriptService, RecordingService, RecordingFileService, SpeechRecorderUploader], imports: [[RouterModule.forChild(SPR_ROUTES), FlexLayoutModule, CommonModule, MatIconModule, MatButtonModule, MatDialogModule, MatProgressBarModule, MatProgressSpinnerModule, MatTooltipModule, HttpClientModule, MatCheckboxModule, MatCardModule, MatDividerModule, MatGridListModule, MatTableModule, MatInputModule, MatSelectModule, MatSnackBarModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: SpeechrecorderngModule, decorators: [{
+SpeechrecorderngModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: SpeechrecorderngModule, providers: [SessionService, ProjectService, ScriptService, RecordingService, RecordingFileService, SpeechRecorderUploader], imports: [[RouterModule.forChild(SPR_ROUTES), FlexLayoutModule, CommonModule, MatIconModule, MatButtonModule, MatDialogModule, MatProgressBarModule, MatProgressSpinnerModule, MatTooltipModule, HttpClientModule, MatCheckboxModule, MatCardModule, MatDividerModule, MatGridListModule, MatTableModule, MatInputModule, MatSelectModule, MatSnackBarModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: SpeechrecorderngModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [AudioSignal, Sonagram, ScrollPaneHorizontal, AudioClipUIContainer, AudioDisplayScrollPane, AudioDisplay, AudioDisplayPlayer, AudioDisplayControl, LevelBar, Progress, SimpleTrafficLight, Recinstructions, Prompter, PromptContainer, PromptingContainer, Prompting, StatusDisplay,
@@ -9717,7 +9711,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImpor
                 }]
         }] });
 
-const VERSION = '2.18.9';
+const VERSION = '2.18.13';
 
 /*
  * Public API Surface of speechrecorderng