From 49af1c3ccdbf87a7919375f6a495b8d3192215b6 Mon Sep 17 00:00:00 2001
From: "mathias.chouet" <mathias.chouet@irstea.fr>
Date: Wed, 12 Jun 2019 14:56:58 +0200
Subject: [PATCH] =?UTF-8?q?PAB=20:=20input=20"number",=20avec=20d=C3=A9sac?=
 =?UTF-8?q?tivation=20du=20spinner?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/app.component.ts                      | 26 +++++++++++++++++--
 .../pab-table/pab-table.component.scss        |  5 ++--
 2 files changed, 27 insertions(+), 4 deletions(-)

diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index 59d238cf1..41ba53e46 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -577,8 +577,7 @@ export class AppComponent implements OnInit, OnDestroy, Observer {
   /**
    * détection de la fermeture de la page/navigateur et demande de confirmation
    */
-  @HostListener("window:beforeunload", ["$event"])
-  confirmExit($event) {
+  @HostListener("window:beforeunload", [ "$event" ]) confirmExit($event) {
     if (
       this.appSetupService.warnBeforeTabClose
       && environment.production // otherwise prevents dev server to reload app after recompiling
@@ -587,4 +586,27 @@ export class AppComponent implements OnInit, OnDestroy, Observer {
       $event.returnValue = "Your data will be lost !";
     }
   }
+
+  /**
+   * Disable value modification on mouse wheel or up/down arrows, in input type="number"
+   */
+  @HostListener("mousewheel", [ "$event" ]) onMouseWheelChrome(event: any) {
+    this.disableScroll(event);
+  }
+  @HostListener("DOMMouseScroll", [ "$event" ]) onMouseWheelFirefox(event: any) {
+    this.disableScroll(event);
+  }
+  @HostListener("onmousewheel", [ "$event" ]) onMouseWheelIE(event: any) {
+    this.disableScroll(event);
+  }
+  disableScroll(event: any) {
+    if (event.srcElement.type === "number") {
+        event.preventDefault();
+    }
+  }
+  @HostListener("keydown", [ "$event" ]) onKeydown(event: any) {
+    if (event.which === 38 || event.which === 40) { // up / down arrow
+      event.preventDefault();
+    }
+  }
 }
diff --git a/src/app/components/pab-table/pab-table.component.scss b/src/app/components/pab-table/pab-table.component.scss
index 487fca155..d09c4cad0 100644
--- a/src/app/components/pab-table/pab-table.component.scss
+++ b/src/app/components/pab-table/pab-table.component.scss
@@ -128,10 +128,11 @@ mat-card-content {
                         > input[type="number"] {
                             -moz-appearance: textfield;
                         }
-                        /* input[type="number"]::-webkit-outer-spin-button, input[type="number"]::-webkit-inner-spin-button
+                        input[type=number]::-webkit-outer-spin-button, 
+                        input[type=number]::-webkit-inner-spin-button {
                             -webkit-appearance: none;
                             margin: 0;
-                        } */
+                        }
                     }
                 }
             }
-- 
GitLab