Play unsupported files in VLC

renderer/views/player.js

@@ -89,7 +89,8 @@ function renderMedia (state) {
       onstalling=${dispatcher('mediaStalled')}
       onerror=${dispatcher('mediaError')}
       ontimeupdate=${dispatcher('mediaTimeUpdate')}
-      autoplay>
+      onencrypted=${dispatcher('mediaEncrypted')}
+      oncanplay=${onCanPlay}>
       ${trackTags}
     </div>
   `
@@ -120,6 +121,16 @@ function renderMedia (state) {
   function onEnded (e) {
     state.playing.isPaused = true
   }
+
+  function onCanPlay (e) {
+    var video = e.target
+    if (video.webkitVideoDecodedByteCount > 0 &&
+      video.webkitAudioDecodedByteCount === 0) {
+      dispatch('mediaError', 'Audio codec unsupported')
+    } else {
+      video.play()
+    }
+  }
 }
 
 function renderOverlay (state) {
@@ -207,20 +218,33 @@ function renderLoadingSpinner (state) {
 }
 
 function renderCastScreen (state) {
-  var castIcon, castType
+  var castIcon, castType, isCast
   if (state.playing.location.startsWith('chromecast')) {
     castIcon = 'cast_connected'
     castType = 'Chromecast'
+    isCast = true
   } else if (state.playing.location.startsWith('airplay')) {
     castIcon = 'airplay'
     castType = 'AirPlay'
+    isCast = true
   } else if (state.playing.location.startsWith('dlna')) {
     castIcon = 'tv'
     castType = 'DLNA'
+    isCast = true
+  } else if (state.playing.location === 'vlc') {
+    castIcon = 'tv'
+    castType = 'VLC'
+    isCast = false
+  } else if (state.playing.location === 'error') {
+    castIcon = 'error_outline'
+    castType = 'Error'
+    isCast = false
   }
 
   var isStarting = state.playing.location.endsWith('-pending')
-  var castStatus = isStarting ? 'Connecting...' : 'Connected'
+  var castStatus
+  if (isCast) castStatus = isStarting ? 'Connecting...' : 'Connected'
+  else castStatus = ''
 
   // Show a nice title image, if possible
   var style = {
@@ -240,15 +264,26 @@ function renderCastScreen (state) {
 
 function renderSubtitlesOptions (state) {
   var subtitles = state.playing.subtitles
-  if (subtitles.tracks.length && subtitles.show) {
-    return hx`<ul.subtitles-list>
-      ${subtitles.tracks.map(function (w, i) {
-        return hx`<li onclick=${dispatcher('selectSubtitle', w.label)}><i.icon>${w.selected ? 'radio_button_checked' : 'radio_button_unchecked'}</i>${w.label}</li>`
-      })}
-        <li onclick=${dispatcher('selectSubtitle', '')}><i.icon>${!subtitles.enabled ? 'radio_button_checked' : 'radio_button_unchecked'}</i>None</li>
-      </ul>
+  if (!subtitles.tracks.length || !subtitles.show) return
+
+  var items = subtitles.tracks.map(function (track) {
+    return hx`
+      <li onclick=${dispatcher('selectSubtitle', track.label)}>
+        <i.icon>${track.selected ? 'radio_button_checked' : 'radio_button_unchecked'}</i>
+        ${track.label}
+      </li>
     `
-  }
+  })
+
+  return hx`
+    <ul.subtitles-list>
+      ${items}
+      <li onclick=${dispatcher('selectSubtitle', '')}>
+        <i.icon>${!subtitles.enabled ? 'radio_button_checked' : 'radio_button_unchecked'}</i>
+        None
+      </li>
+    </ul>
+  `
 }
 
 function renderPlayerControls (state) {