diff --git a/docs/release-notes-player.txt b/docs/release-notes-player.txt index f6d5499398ea031587025532e587124498b96252..c55c0d15f96de3db718bcab3417ddd5fad7ac970 100644 --- a/docs/release-notes-player.txt +++ b/docs/release-notes-player.txt @@ -7,6 +7,9 @@ Player - Fix problem with truncated text in text components when using large font sizes - Hide audio and video control bar when no control is marked for display - Add the floating variant of the virtual keyboard for numbers and numbers + operators + - Hide mute control if wanted + - Use minimum volume value (value between 0 and 1) + - Use default volume value (value between 0 and 1) 1.5.0 - Show the magnifier only when the mouse is over the image diff --git a/projects/common/element-components/control-bar/control-bar.component.html b/projects/common/element-components/control-bar/control-bar.component.html index d4e076af06351a513bda9efceb93e3eca5dca24c..b6c4a786cce530dcb247be670b480b230b354290 100644 --- a/projects/common/element-components/control-bar/control-bar.component.html +++ b/projects/common/element-components/control-bar/control-bar.component.html @@ -57,7 +57,7 @@ -{{currentRestTime | playerTimeFormat}} </div> </ng-container> - <ng-container *ngIf="elementModel.volumeControl"> + <ng-container *ngIf="elementModel.muteControl"> <button mat-button type="button" class="control-button enabled-control" @@ -65,10 +65,12 @@ <mat-icon *ngIf="!player.muted">volume_up</mat-icon> <mat-icon *ngIf="player.muted">volume_off</mat-icon> </button> + </ng-container> + <ng-container *ngIf="elementModel.volumeControl"> <mat-slider class="volume" min="0" step="0.01" - [max]="1" + max="1" [value]="player.volume" (input)="onVolumeChange($event)"> </mat-slider> diff --git a/projects/common/element-components/control-bar/control-bar.component.ts b/projects/common/element-components/control-bar/control-bar.component.ts index 8971a1ffa4e7177ac01d8ff8107223f0ccab5615..510f87f98c688fd0861682282865071446a4fd66 100644 --- a/projects/common/element-components/control-bar/control-bar.component.ts +++ b/projects/common/element-components/control-bar/control-bar.component.ts @@ -69,7 +69,7 @@ export class ControlBarComponent implements OnInit, OnChanges, OnDestroy { this.player.onvolumechange = () => { this.player.muted = !this.player.volume; }; - this.player.volume = 0.8; + this.player.volume = this.elementModel.defaultVolume; this.lastVolume = this.player.volume; } @@ -93,7 +93,8 @@ export class ControlBarComponent implements OnInit, OnChanges, OnDestroy { } onVolumeChange(event: MatSliderChange): void { - this.player.volume = event.value ? event.value : 0; + event.source.value = event.value && event.value > this.elementModel.minVolume ? + event.value : this.elementModel.minVolume; } toggleTime(): void { @@ -101,9 +102,9 @@ export class ControlBarComponent implements OnInit, OnChanges, OnDestroy { } toggleVolume(): void { - if (this.player.volume) { + if (this.player.volume > this.elementModel.minVolume) { this.lastVolume = this.player.volume; - this.player.volume = 0; + this.player.volume = this.elementModel.minVolume; } else { this.player.volume = this.lastVolume; } @@ -143,9 +144,10 @@ export class ControlBarComponent implements OnInit, OnChanges, OnDestroy { } private _play(): void { - this.player.play().then(() => {}, - // eslint-disable-next-line no-console - () => console.error('player: cannot play this media file')); + this.player.play().then(() => { + }, + // eslint-disable-next-line no-console + () => console.error('player: cannot play this media file')); } private sendPlaybackTimeChanged() { diff --git a/projects/common/interfaces/UIElementInterfaces.ts b/projects/common/interfaces/UIElementInterfaces.ts index aee4e675d04432d3215772c9897c3eb7f4e86f11..5f7c42a7f00c1f9d53834f745c874bdfd569438c 100644 --- a/projects/common/interfaces/UIElementInterfaces.ts +++ b/projects/common/interfaces/UIElementInterfaces.ts @@ -23,6 +23,9 @@ export interface PlayerElement { progressBar: boolean; interactiveProgressbar: boolean; volumeControl: boolean; + defaultVolume: number; + minVolume: number; + muteControl: boolean; hintLabel: string; hintLabelDelay: number; uninterruptible: boolean; diff --git a/projects/common/models/audio-element.ts b/projects/common/models/audio-element.ts index 70bc57d968a96535a10e0cd040fd1df4b50bb90b..9bfab2aa2f5f7d842c82829725e8d844a0e03869 100644 --- a/projects/common/models/audio-element.ts +++ b/projects/common/models/audio-element.ts @@ -13,6 +13,9 @@ export class AudioElement extends UIElement implements PlayerElement { progressBar: boolean = true; interactiveProgressbar: boolean = false; volumeControl: boolean = true; + defaultVolume: number = 0.8; + minVolume: number = 0; + muteControl: boolean = true; hintLabel: string = ''; hintLabelDelay: number = 0; uninterruptible: boolean = false; diff --git a/projects/common/models/video-element.ts b/projects/common/models/video-element.ts index f960473781f126d2aa30a4569ae5bc17e29367be..987fea472090c17901131fe478dd479364676a47 100644 --- a/projects/common/models/video-element.ts +++ b/projects/common/models/video-element.ts @@ -13,6 +13,9 @@ export class VideoElement extends UIElement implements PlayerElement { progressBar: boolean = true; interactiveProgressbar: boolean = false; volumeControl: boolean = true; + defaultVolume: number = 0.8; + minVolume: number = 0; + muteControl: boolean = true; hintLabel: string = ''; hintLabelDelay: number = 0; uninterruptible: boolean = false; diff --git a/projects/common/util/unit-interface-initializer.ts b/projects/common/util/unit-interface-initializer.ts index c2850463c005c4d2ae2d3d4805d6619c3f682d20..4b5d5ca7e7e5e4859ee7dbda9c9f9282b5cbb451 100644 --- a/projects/common/util/unit-interface-initializer.ts +++ b/projects/common/util/unit-interface-initializer.ts @@ -28,6 +28,9 @@ export function initPlayerElement(serializedElement: UIElement): PlayerElement { interactiveProgressbar: serializedElement.interactiveProgressbar !== undefined ? serializedElement.interactiveProgressbar as boolean : false, volumeControl: serializedElement.volumeControl !== undefined ? serializedElement.volumeControl as boolean : true, + defaultVolume: serializedElement.defaultVolume !== undefined ? serializedElement.defaultVolume as number : 0.8, + minVolume: serializedElement.minVolume !== undefined ? serializedElement.minVolume as number : 0, + muteControl: serializedElement.muteControl !== undefined ? serializedElement.muteControl as boolean : true, hintLabel: serializedElement.hintLabel as string || '', hintLabelDelay: serializedElement.hintLabelDelay !== undefined ? serializedElement.hintLabelDelay as number : 0, uninterruptible: diff --git a/projects/editor/src/app/components/dialogs/player-edit-dialog.component.ts b/projects/editor/src/app/components/dialogs/player-edit-dialog.component.ts index a79fc68593d226cd0acf75f69c0cc4946d48780e..c74ea895afd80191ad78afc299d0cb209cfcdc45 100644 --- a/projects/editor/src/app/components/dialogs/player-edit-dialog.component.ts +++ b/projects/editor/src/app/components/dialogs/player-edit-dialog.component.ts @@ -29,6 +29,22 @@ import { PlayerElement } from '../../../../../common/interfaces/UIElementInterfa (change)="newPlayerConfig.volumeControl = $event.checked"> {{ 'player.volumeControl' | translate }} </mat-checkbox> + <mat-form-field appearance="fill"> + <mat-label>{{ 'player.defaultVolume' | translate }}</mat-label> + <input matInput type="number" min="0" max="1" step="0.1" + [ngModel]="newPlayerConfig.defaultVolume || data.player.defaultVolume" + (ngModelChange)="newPlayerConfig.defaultVolume = $event"> + </mat-form-field> + <mat-form-field appearance="fill"> + <mat-label>{{ 'player.minVolume' | translate }}</mat-label> + <input matInput type="number" min="0" max="1" step="0.1" + [ngModel]="newPlayerConfig.minVolume || data.player.minVolume" + (ngModelChange)="newPlayerConfig.minVolume = $event"> + </mat-form-field> + <mat-checkbox [checked]="newPlayerConfig.muteControl || data.player.muteControl" + (change)="newPlayerConfig.muteControl = $event.checked"> + {{ 'player.muteControl' | translate }} + </mat-checkbox> <mat-checkbox [checked]="newPlayerConfig.showRestTime || data.player.showRestTime" (change)="newPlayerConfig.showRestTime = $event.checked"> {{ 'player.showRestTime' | translate }} diff --git a/projects/editor/src/assets/i18n/de.json b/projects/editor/src/assets/i18n/de.json index 237c76f482b530333f715c8e323f33129c69d886..408f8486dd3fc57eb973358416c9b508bc2d2818 100644 --- a/projects/editor/src/assets/i18n/de.json +++ b/projects/editor/src/assets/i18n/de.json @@ -129,6 +129,9 @@ "progressBar": "Fortschrittsbalken", "interactiveProgressbar": "Fortschrittsbalken (steuerbar)", "volumeControl": "Lautstärkeregelung", + "muteControl": "Stummschaltung", + "minVolume": "Minimale Lautstärke", + "defaultVolume": "Voreingestellte Lautstärke", "uninterruptible": "Unterbrechen verbieten", "hideOtherPages": "Weitere Seiten verbergen", "showRestTime": "Verbleibende Zeit anzeigen",