feat: disable hover on task inbox for mobile

macite · Oct 11, 2022 · a59fd01 · a59fd01
1 parent 3c62fe0
commit a59fd01
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 1 deletion.
diff --git a/src/app/units/states/tasks/inbox/directives/staff-task-list/staff-task-list.component.html b/src/app/units/states/tasks/inbox/directives/staff-task-list/staff-task-list.component.html
@@ -183,7 +183,7 @@
             fxLayout="row"
             fxLayoutAlign="start center"
             [ngClass]="{ hover: task.hover }"
-            (mouseover)="task.hover = true"
+            (mouseover)="task.hover = allowHover && true"
             (mouseout)="task.hover = false"
           >
             <user-icon fxFlexAlign="center" [user]="task.project.student" [size]="30"> </user-icon>

diff --git a/src/app/units/states/tasks/inbox/directives/staff-task-list/staff-task-list.component.ts b/src/app/units/states/tasks/inbox/directives/staff-task-list/staff-task-list.component.ts
@@ -91,6 +91,7 @@ export class StaffTaskListComponent implements OnInit, OnChanges {
   taskDefSort = 0;
   tutorialSort = 0;
   originalFilteredTasks: any[] = null;
+  allowHover = true;
 
   @HostListener('document:keydown', ['$event'])
   handleKeyDown(event: KeyboardEvent) {
@@ -128,6 +129,12 @@ export class StaffTaskListComponent implements OnInit, OnChanges {
   }
 
   ngOnInit(): void {
+    // if device is movile always set hover to false
+    // so you can instantly click on an item in the list
+    if (navigator.maxTouchPoints > 1) {
+      this.allowHover = false;
+    }
+
     // Does the current user have any tutorials?
     this.userHasTutorials = this.unit.tutorialsForUserName(this.userService.currentUser.name)?.length > 0;