Added logic to disable the playback control buttons and pause the audio after a tag has been selected.

pull/42/head
Chris Veilleux 2021-01-13 16:09:06 -06:00
parent a28e204dd5
commit 32b831c96c
2 changed files with 14 additions and 8 deletions

View File

@ -20,10 +20,10 @@
>
</ng-waveform>
<div fxFlexFill fxLayoutGap="8px" fxLayoutAlign="center">
<button mat-flat-button (click)="onPlayButtonClick()">
<button mat-flat-button (click)="onPlayButtonClick()" [disabled]="playbackButtonsDisabled">
<fa-icon [icon]="playIcon"></fa-icon>
</button>
<button mat-flat-button (click)="onPauseButtonClick()">
<button mat-flat-button (click)="onPauseButtonClick()" [disabled]="playbackButtonsDisabled">
<fa-icon [icon]="pauseIcon"></fa-icon>
</button>
</div>
@ -33,7 +33,7 @@
mat-flat-button
color="primary"
*ngFor="let tagValue of tagEvent.tagValues"
[disabled]="buttonsDisabled"
[disabled]="tagButtonsDisabled"
(click)="saveTagResult(tagValue.id)"
>
{{tagValue.display}}

View File

@ -30,7 +30,8 @@ import { animate, state, style, transition, trigger } from '@angular/animations'
export class TagComponent implements OnInit {
@ViewChild('waveform', { static: false }) waveform: NgWaveformComponent;
public audioUrl: string;
public buttonsDisabled: boolean;
public tagButtonsDisabled: boolean;
public playbackButtonsDisabled: boolean;
public isTagged = false;
public playIcon = faPlay;
public pauseIcon = faPause;
@ -41,11 +42,13 @@ export class TagComponent implements OnInit {
constructor(private route: ActivatedRoute, private taggerService: TaggerService) { }
ngOnInit(): void {
this.buttonsDisabled = true;
this.tagButtonsDisabled = true;
this.playbackButtonsDisabled = true;
this.route.data.subscribe(
(data: {tagEvent: TagEvent}) => {
this.tagEvent = data.tagEvent;
this.audioUrl = this.preciseUrl + '/api/audio/' + this.tagEvent.audioFileName;
this.playbackButtonsDisabled = false;
}
);
this.route.paramMap.subscribe(
@ -54,7 +57,7 @@ export class TagComponent implements OnInit {
}
onPlayButtonClick(): void {
this.buttonsDisabled = false;
this.tagButtonsDisabled = false;
this.waveform.play();
}
@ -69,7 +72,9 @@ export class TagComponent implements OnInit {
tagId: this.tagEvent.tagId,
tagValueId: tagValueId
};
this.buttonsDisabled = true;
this.waveform.pause();
this.tagButtonsDisabled = true;
this.playbackButtonsDisabled = true;
this.taggerService.addTagEvent(fileTag).subscribe(
() => { this.isTagged = true; }
);
@ -87,13 +92,14 @@ export class TagComponent implements OnInit {
this.isTagged = false;
this.tagEvent = tagEvent;
this.audioUrl = this.preciseUrl + '/api/audio/' + this.tagEvent.audioFileName;
this.playbackButtonsDisabled = false;
}
);
}
skipToNextEvent(): void {
this.waveform.pause();
this.buttonsDisabled = true;
this.tagButtonsDisabled = true;
this.isTagged = true;
}
}