From b1d51726a42ef96d961a6a640f3c1349b2e7e439 Mon Sep 17 00:00:00 2001
From: s-egge <102624422+s-egge@users.noreply.github.com>
Date: Tue, 7 May 2024 09:33:00 -0700
Subject: [PATCH] Added button to test kiosk's touchscreen (#17)

---
 src/components/sec.vue | 30 +++++++++++++++++++++++++++++-
 1 file changed, 29 insertions(+), 1 deletion(-)

diff --git a/src/components/sec.vue b/src/components/sec.vue
index 64f7977..f31b6c4 100644
--- a/src/components/sec.vue
+++ b/src/components/sec.vue
@@ -25,11 +25,26 @@
         </el-col>
       </el-row>
     </el-col>
+    <el-button
+      id="touchscreen-test-button"
+      @click="testTouchscreen"
+    ></el-button>
   </el-row>
 </template>
 
 <script>
-export default {}
+export default {
+  methods: {
+    testTouchscreen () {
+      const btn = document.getElementById('touchscreen-test-button')
+      if (btn.style.background === 'orange') {
+        btn.style.background = 'none'
+      } else {
+        btn.style.background = 'orange'
+      }
+    }
+  }
+}
 </script>
 
 <style scoped lang="scss">
@@ -108,4 +123,17 @@ video {
   background: $--color-white;
   color: $--color-black;
 }
+
+#touchscreen-test-button {
+  position: absolute;
+  top: 0;
+  left: 0;
+  z-index: 10;
+  margin: 0;
+  padding: 0;
+  height: 100px;
+  width: 100px;
+  border: 1px solid rgba(193, 193, 193, 0.2);
+  background: none;
+}
 </style>