fix(safari): uses fallback to native audio element

package.json

@@ -57,7 +57,7 @@
     "dist/"
   ],
   "dependencies": {
-    "@podlove/html5-audio-driver": "1.3.2",
+    "@podlove/html5-audio-driver": "1.3.3",
     "babel-polyfill": "6.26.0",
     "color": "3.1.0",
     "copy-to-clipboard": "3.0.8",

src/components/tabs/audio/Audio.vue

@@ -2,13 +2,14 @@
   <div class="audio-tab" id="tab-audio">
     <audio-volume-component class="seperator" v-if="components.audio.volumeControl"></audio-volume-component>
     <audio-rate-component class="seperator" v-if="components.audio.rateControl"></audio-rate-component>
-    <audio-channels-component class="seperator" v-if="components.audio.channelControl"></audio-channels-component>
+    <audio-channels-component class="seperator" v-if="components.audio.channelControl && channelsAvailable"></audio-channels-component>
     <footer-component></footer-component>
   </div>
 </template>
 
 <script>
   import { mapState } from 'redux-vuex'
+  import { selectBufferAvailable } from 'store/selectors'
 
   import AudioRateComponent from './AudioRate'
   import AudioVolumeComponent from './AudioVolume'
@@ -17,7 +18,10 @@
   import FooterComponent from 'shared/Footer'
 
   export default {
-    data: mapState('components'),
+    data: mapState({
+      components: 'components',
+      channelsAvailable: selectBufferAvailable
+    }),
     components: {
       AudioRateComponent,
       AudioVolumeComponent,

src/store/filter/reducer.js

@@ -4,11 +4,13 @@ import { handleActions } from 'redux-actions'
 import { LOADING, UPDATE_FILTER } from '../types'
 
 export const INITIAL_STATE = {
-  channels: 2
+  channels: 2,
+  buffer: false
 }
 
 const stateHandler = (state, { payload }) => ({
   ...state,
+  buffer: !!payload.buffer,
   channels: get(payload, 'channels', 2)
 })
 

src/store/filter/selectors.js

@@ -1,3 +1,4 @@
 import { get } from 'lodash/fp'
 
 export const selectActiveChannels = get('channels')
+export const selectBuffer = get('buffer')

src/store/selectors.js

@@ -25,3 +25,4 @@ export const selectAudioFiles = compose(files.selectAudio, filesSlice)
 // Filters
 const filterSlice = get('filter')
 export const selectActiveChannels = compose(filter.selectActiveChannels, filterSlice)
+export const selectBufferAvailable = compose(filter.selectBuffer, filterSlice)

yarn.lock

@@ -897,9 +897,9 @@
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/@nodelib/fs.stat/-/fs.stat-1.1.0.tgz#50c1e2260ac0ed9439a181de3725a0168d59c48a"
 
-"@podlove/html5-audio-driver@1.3.2":
-  version "1.3.2"
-  resolved "https://registry.yarnpkg.com/@podlove/html5-audio-driver/-/html5-audio-driver-1.3.2.tgz#4328107eb82800fdc83a7405f1010c8123555577"
+"@podlove/html5-audio-driver@1.3.3":
+  version "1.3.3"
+  resolved "https://registry.yarnpkg.com/@podlove/html5-audio-driver/-/html5-audio-driver-1.3.3.tgz#9cc6d68e784818350207e96a13abeca28ff04413"
   dependencies:
     hls.js "0.9.1"
     ramda "0.24.1"