From d35479f271470d7bb87c67fd1b13a49c6ae1bd4a Mon Sep 17 00:00:00 2001
From: Julien Calixte <juliencalixte@gmail.com>
Date: Tue, 14 Jul 2020 03:51:11 +0200
Subject: [PATCH] :green_apple: (music) remove music for iOS

---
 src/components/ChilledMusic.vue | 5 -----
 src/components/ZoneMusic.vue    | 6 +++---
 src/hooks/useMusic.ts           | 3 +++
 3 files changed, 6 insertions(+), 8 deletions(-)

diff --git a/src/components/ChilledMusic.vue b/src/components/ChilledMusic.vue
index 5701734..100c0c1 100644
--- a/src/components/ChilledMusic.vue
+++ b/src/components/ChilledMusic.vue
@@ -23,8 +23,6 @@ import {
   onUnmounted
 } from '@vue/composition-api'
 
-const iOS = navigator.platform && /iPad|iPhone|iPod/.test(navigator.platform)
-
 export default defineComponent({
   name: 'ChilledMusic',
   props: {
@@ -34,9 +32,6 @@ export default defineComponent({
     }
   },
   setup(props, { emit }) {
-    if (iOS) {
-      return
-    }
     const chilledcow = reactive<{ video: Plyr | null }>({
       video: null
     })
diff --git a/src/components/ZoneMusic.vue b/src/components/ZoneMusic.vue
index 452d4ec..cdcd688 100644
--- a/src/components/ZoneMusic.vue
+++ b/src/components/ZoneMusic.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="zone-music plume">
+  <div class="zone-music plume" v-if="isMusicAvailable">
     <div class="pm-field">
       <label for="use-music" data-pm-holder>
         <span :class="{ selected: !withMusic, disabled: withMusic }"
@@ -38,7 +38,7 @@ export default defineComponent({
     }
   },
   setup(_, { emit }) {
-    const { withMusic, setWithMusic } = useMusic()
+    const { isMusicAvailable, withMusic, setWithMusic } = useMusic()
 
     const play = () => {
       emit('play')
@@ -48,7 +48,7 @@ export default defineComponent({
       emit('pause')
     }
 
-    return { withMusic, setWithMusic, play, pause }
+    return { isMusicAvailable, withMusic, setWithMusic, play, pause }
   }
 })
 </script>
diff --git a/src/hooks/useMusic.ts b/src/hooks/useMusic.ts
index 1a1fcf8..685c986 100644
--- a/src/hooks/useMusic.ts
+++ b/src/hooks/useMusic.ts
@@ -3,10 +3,13 @@ import { GetterTree } from 'vuex'
 import { State, RootActions } from '@/store'
 
 export const useMusic = () => {
+  const isIOS =
+    navigator.platform && /iPad|iPhone|iPod/.test(navigator.platform)
   const { withMusic } = useGetters<GetterTree<State, State>>(['withMusic'])
   const { setWithMusic } = useActions<RootActions>(['setWithMusic'])
 
   return {
+    isMusicAvailable: !isIOS,
     withMusic,
     setWithMusic
   }