From 1a1ed4f57187c54031ce03b20e7c9dc86ef676b3 Mon Sep 17 00:00:00 2001
From: jojohoch <joachim.hoch@iqb.hu-berlin.de>
Date: Mon, 18 Oct 2021 17:04:17 +0200
Subject: [PATCH] [player] Allow moving the keyboard only at its header
---
.../components/french-keyboard/french-keyboard.component.ts | 1 +
projects/player/src/app/components/key/key.component.html | 5 +++--
projects/player/src/app/components/key/key.component.ts | 1 +
.../src/app/components/keyboard/keyboard.component.html | 6 ++++--
.../src/app/components/keyboard/keyboard.component.ts | 5 ++++-
5 files changed, 13 insertions(+), 5 deletions(-)
diff --git a/projects/player/src/app/components/french-keyboard/french-keyboard.component.ts b/projects/player/src/app/components/french-keyboard/french-keyboard.component.ts
index 972349f70..501800a51 100644
--- a/projects/player/src/app/components/french-keyboard/french-keyboard.component.ts
+++ b/projects/player/src/app/components/french-keyboard/french-keyboard.component.ts
@@ -31,5 +31,6 @@ export class FrenchKeyboardComponent implements OnInit {
this.rows = this.upperCharacterRows;
}
event.preventDefault();
+ event.stopPropagation();
}
}
diff --git a/projects/player/src/app/components/key/key.component.html b/projects/player/src/app/components/key/key.component.html
index ebeeb8465..954f061d9 100644
--- a/projects/player/src/app/components/key/key.component.html
+++ b/projects/player/src/app/components/key/key.component.html
@@ -1,3 +1,4 @@
-<button mat-mini-fab class="key"
- (mousedown)="onMouseDown($event)">{{key}}
+<button mat-mini-fab
+ class="key"
+ (mousedown)="onMouseDown($event)">{{key}}
</button>
diff --git a/projects/player/src/app/components/key/key.component.ts b/projects/player/src/app/components/key/key.component.ts
index c111e16b9..378017aeb 100644
--- a/projects/player/src/app/components/key/key.component.ts
+++ b/projects/player/src/app/components/key/key.component.ts
@@ -14,5 +14,6 @@ export class KeyComponent {
onMouseDown(event: MouseEvent): void {
this.keyboardService.enterKey(this.key);
event.preventDefault();
+ event.stopPropagation();
}
}
diff --git a/projects/player/src/app/components/keyboard/keyboard.component.html b/projects/player/src/app/components/keyboard/keyboard.component.html
index 429e04a0a..fe4c749ad 100644
--- a/projects/player/src/app/components/keyboard/keyboard.component.html
+++ b/projects/player/src/app/components/keyboard/keyboard.component.html
@@ -1,6 +1,8 @@
-<div class="keyboard-container" (mousedown)="onMouseDown($event)">
+<div class="keyboard-container"
+ (mousedown)="onMouseDown($event, false)">
<div class="keyboard-header"></div>
- <div class="keyboard-inner-container">
+ <div class="keyboard-inner-container"
+ (mousedown)="onMouseDown($event, true)">
<app-french-keyboard *ngIf="preset === 'french'">
</app-french-keyboard>
</div>
diff --git a/projects/player/src/app/components/keyboard/keyboard.component.ts b/projects/player/src/app/components/keyboard/keyboard.component.ts
index 32b77b94b..35fa138ea 100644
--- a/projects/player/src/app/components/keyboard/keyboard.component.ts
+++ b/projects/player/src/app/components/keyboard/keyboard.component.ts
@@ -8,7 +8,10 @@ import { Component, Input } from '@angular/core';
export class KeyboardComponent {
@Input() preset!: 'french' | 'numbers' | 'numbersAndOperators' | 'none';
- onMouseDown = (event: MouseEvent): void => {
+ onMouseDown = (event: MouseEvent, stopPropagation: boolean): void => {
event.preventDefault();
+ if (stopPropagation) {
+ event.stopPropagation();
+ }
};
}
--
GitLab