From 4508992519a7203369c60406625e50b4e93d0f57 Mon Sep 17 00:00:00 2001
From: Lorenzo Tilve <ltilve@igalia.com>
Date: Tue, 6 Apr 2021 11:48:16 +0200
Subject: Disable dragging and zoom events on app images

We identified that part of the problems that were triggering the
race condition were related with starting the drag of webapp
images. Disabling those events, and also removing href
link to avoid displaying draggable link.

Bug-AGL: SPEC-3786

Signed-off-by: Lorenzo Tilve <ltilve@igalia.com>
Change-Id: I075d6bcd35700dcdd2e66cbc4b00f71527f2069e
---
 src/index.html       | 22 +++++++++++-----------
 src/styles/main.scss | 10 +++++++++-
 2 files changed, 20 insertions(+), 12 deletions(-)

diff --git a/src/index.html b/src/index.html
index 4a1fdfd..88ea3fa 100644
--- a/src/index.html
+++ b/src/index.html
@@ -36,21 +36,21 @@
             </div>
         </div>
         <div class="center">
-            <a id="LeftChair" value="0" href="#" class="seat left item button" onclick="CHAIR.left(this)">
+            <a id="LeftChair" value="0" class="seat left item button" onclick="CHAIR.left(this)">
                 <img class="off" src="../images/HMI_HVAC_Left_Chair_OFF.svg"/>
                 <img class="one two" src="../images/HMI_HVAC_Left_Chair_ON.svg"/>
                 <img class="off" src="../images/HMI_HVAC_ChairIndicator_OFF.svg"/>
                 <img class="one" src="../images/HMI_HVAC_ChairIndicator_One.svg"/>
                 <img class="two" src="../images/HMI_HVAC_ChairIndicator_Two.svg"/>
             </a>
-            <a key="ac" value="false" href="#" class="ac item button" onclick="BUTTON.toggle(this)">
+            <a key="ac" value="false" class="ac item button" onclick="BUTTON.toggle(this)">
                 <img class="disabled" src="../images/HMI_HVAC_Inactive.svg"/>
                 <img class="enabled" src="../images/HMI_HVAC_Active.svg"/>
                 <div class="label">
                     A/C
                 </div>
             </a>
-            <a id="RightChair" value="0" href="#" class="seat right item button" onclick="CHAIR.right(this)">
+            <a id="RightChair" value="0" class="seat right item button" onclick="CHAIR.right(this)">
                 <img class="off" src="../images/HMI_HVAC_Right_Chair_OFF.svg"/>
                 <img class="one two" src="../images/HMI_HVAC_Right_Chair_ON.svg"/>
                 <img class="off" src="../images/HMI_HVAC_ChairIndicator_OFF.svg"/>
@@ -61,14 +61,14 @@
                 <div id="lefttemperature" class="temperatures-container" onscroll="TEMPERATURE.left(this)"></div>
             </div>
             <div class="block item">
-                <a key="auto" value="false" href="#" class="auto item button" onclick="BUTTON.toggle(this)">
+                <a key="auto" value="false" class="auto item button" onclick="BUTTON.toggle(this)">
                     <img class="disabled" src="../images/HMI_HVAC_Inactive.svg"/>
                     <img class="enabled" src="../images/HMI_HVAC_Active.svg"/>
                     <div class="label">
                         AUTO
                     </div>
                 </a>
-                <a key="circulation" value="false" href="#" class="circulation item button" onclick="BUTTON.toggle(this)">
+                <a key="circulation" value="false" class="circulation item button" onclick="BUTTON.toggle(this)">
                     <img class="disabled" src="../images/HMI_HVAC_Circulation_Inactive.svg"/>
                     <img class="enabled" src="../images/HMI_HVAC_Circulation_Active.svg"/>
                 </a>
@@ -78,23 +78,23 @@
             </div>
         </div>
         <div class="bottom">
-            <a key="down" value="false" href="#" class="down item button" onclick="BUTTON.toggle(this)">
+            <a key="down" value="false" class="down item button" onclick="BUTTON.toggle(this)">
                 <img class="disabled" src="../images/HMI_HVAC_AirDown_Inactive.svg">
                 <img class="enabled" src="../images/HMI_HVAC_AirDown_Active.svg">
             </a>
-            <a key="up" value="false" href="#" class="up item button" onclick="BUTTON.toggle(this)">
+            <a key="up" value="false" class="up item button" onclick="BUTTON.toggle(this)">
                 <img class="disabled" src="../images/HMI_HVAC_AirUp_Inactive.svg">
                 <img class="enabled" src="../images/HMI_HVAC_AirUp_Active.svg">
             </a>
-            <a key="right" value="false" href="#" class="right item button" onclick="BUTTON.toggle(this)">
+            <a key="right" value="false" class="right item button" onclick="BUTTON.toggle(this)">
                 <img class="disabled" src="../images/HMI_HVAC_AirRight_Inactive.svg">
                 <img class="enabled" src="../images/HMI_HVAC_AirRight_Active.svg">
             </a>
-            <a key="rear" value="false" href="#" class="rear item button" onclick="BUTTON.toggle(this)">
+            <a key="rear" value="false" class="rear item button" onclick="BUTTON.toggle(this)">
                 <img class="disabled" src="../images/HMI_HVAC_Rear_Inactive.svg">
                 <img class="enabled" src="../images/HMI_HVAC_Rear_Active.svg">
             </a>
-            <a key="front" value="false" href="#" class="front item button" onclick="BUTTON.toggle(this)">
+            <a key="front" value="false" class="front item button" onclick="BUTTON.toggle(this)">
                 <img class="disabled" src="../images/HMI_HVAC_Front_Inactive.svg">
                 <img class="enabled" src="../images/HMI_HVAC_Front_Active.svg">
             </a>
@@ -103,4 +103,4 @@
 
         </div>
     </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/src/styles/main.scss b/src/styles/main.scss
index fca72d9..5d2d950 100644
--- a/src/styles/main.scss
+++ b/src/styles/main.scss
@@ -55,8 +55,16 @@ html {
     height: 100%;
     background-size: cover;
     -webkit-overflow-scrolling: touch;
+    user-select: none;
 }
 
+img {
+    user-select: none !important;
+    touch-action: none;
+    pointer-events: none;
+}
+
+
 body {
     font-size: 1.2rem;
     font-family: Arial;
@@ -230,4 +238,4 @@ body {
         background: white;
         font-size: 1.5rem;
     }
-}
\ No newline at end of file
+}
-- 
cgit 1.2.3-korg