Demo - Fix pauseOnTouch control rendering

smastrom · Dec 9, 2023 · a76c77c · a76c77c
1 parent 2de35e1
commit a76c77c
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 14 deletions.
diff --git a/demo/components/nav/NavNotivueConfig.vue b/demo/components/nav/NavNotivueConfig.vue
@@ -81,26 +81,24 @@ const isSwipeDisabled = computed(() => !config.pauseOnHover.value)
 
 <template>
    <div class="Controls">
-      <!-- Disabled must be toggled as a string (and not boolean), Nuxt bug? -->
-
       <button
-         v-if="isDesktop"
+         v-if="isMobile()"
          class="ButtonBase SwitchButton"
          role="switch"
-         :aria-checked="config.pauseOnHover.value"
-         @click="togglePauseOnHover"
+         :aria-checked="config.pauseOnTouch.value"
+         @click="togglePauseOnTouch"
       >
-         Pause on Hover
+         Pause on Touch
       </button>
 
       <button
          v-else
          class="ButtonBase SwitchButton"
          role="switch"
-         :aria-checked="config.pauseOnTouch.value"
-         @click="togglePauseOnTouch"
+         :aria-checked="config.pauseOnHover.value"
+         @click="togglePauseOnHover"
       >
-         Pause on Touch
+         Pause on Hover
       </button>
 
       <button

diff --git a/demo/utils/misc.ts b/demo/utils/misc.ts
@@ -6,8 +6,6 @@ export function getRandomInt(min: number, max: number) {
 
 export const isSSR = typeof window === 'undefined'
 
-export const isDesktop =
-   isSSR ||
-   /(Windows NT|Mac OS X|Linux|Ubuntu|Firefox|Chrome|Safari|Trident|MSIE)/i.test(
-      navigator.userAgent
-   )
+export function isMobile() {
+   return /android|webos|iphone|ipad|ipod|blackberry|iemobile|opera mini/i.test(navigator.userAgent)
+}