add DLNA support

renderer/views/player.js

@@ -181,21 +181,22 @@ function renderLoadingSpinner (state) {
 function renderCastScreen (state) {
   var isChromecast = state.playing.location.startsWith('chromecast')
   var isAirplay = state.playing.location.startsWith('airplay')
+  var isDlna = state.playing.location.startsWith('dlna')
   var isStarting = state.playing.location.endsWith('-pending')
-  if (!isChromecast && !isAirplay) throw new Error('Unimplemented cast type')
+  if (!isChromecast && !isAirplay && !isDlna) throw new Error('Unimplemented cast type')
 
   // Show a nice title image, if possible
   var style = {
     backgroundImage: cssBackgroundImagePoster(state)
   }
 
-  // Show whether we're connected to Chromecast / Airplay
+  // Show whether we're connected to Chromecast / Airplay /DLNA
   var castStatus = isStarting ? 'Connecting...' : 'Connected'
   return hx`
     <div class='letterbox' style=${style}>
       <div class='cast-screen'>
         <i class='icon'>${isAirplay ? 'airplay' : 'cast'}</i>
-        <div class='cast-type'>${isAirplay ? 'AirPlay' : 'Chromecast'}</div>
+        <div class='cast-type'>${isAirplay ? 'AirPlay' : (isDlna ? 'DLNA' : 'Chromecast')}</div>
         <div class='cast-status'>${castStatus}</div>
       </div>
     </div>
@@ -247,26 +248,40 @@ function renderPlayerControls (state) {
   // If we've detected a Chromecast or AppleTV, the user can play video there
   var isOnChromecast = state.playing.location.startsWith('chromecast')
   var isOnAirplay = state.playing.location.startsWith('airplay')
-  var chromecastClass, chromecastHandler, airplayClass, airplayHandler
+  var isOnDlna = state.playing.location.startsWith('dlna')
+  var chromecastClass, chromecastHandler, airplayClass, airplayHandler, dlnaClass, dlnaHandler
   if (isOnChromecast) {
     chromecastClass = 'active'
+    dlnaClass = 'disabled'
     airplayClass = 'disabled'
     chromecastHandler = dispatcher('stopCasting')
     airplayHandler = undefined
+    dlnaHandler = undefined
   } else if (isOnAirplay) {
     chromecastClass = 'disabled'
+    dlnaClass = 'disabled'
     airplayClass = 'active'
     chromecastHandler = undefined
     airplayHandler = dispatcher('stopCasting')
+    dlnaHandler = undefined
+  } else if (isOnDlna) {
+    chromecastClass = 'disabled'
+    dlnaClass = 'active'
+    airplayClass = 'disabled'
+    chromecastHandler = undefined
+    airplayHandler = undefined
+    dlnaHandler = dispatcher('stopCasting')
   } else {
     chromecastClass = ''
     airplayClass = ''
-    chromecastHandler = dispatcher('openChromecast')
-    airplayHandler = dispatcher('openAirplay')
+    dlnaClass = ''
+    chromecastHandler = dispatcher('open', 'chromecast')
+    airplayHandler = dispatcher('open', 'airplay')
+    dlnaHandler = dispatcher('open', 'dlna')
   }
   if (state.devices.chromecast || isOnChromecast) {
     elements.push(hx`
-      <i.icon.chromecast
+      <i.icon.device
         class=${chromecastClass}
         onclick=${chromecastHandler}>
         cast
@@ -275,13 +290,22 @@ function renderPlayerControls (state) {
   }
   if (state.devices.airplay || isOnAirplay) {
     elements.push(hx`
-      <i.icon.airplay
+      <i.icon.device
         class=${airplayClass}
         onclick=${airplayHandler}>
         airplay
       </i>
     `)
   }
+  if (state.devices.dlna || isOnDlna) {
+    elements.push(hx`
+      <i.icon.device
+        class=${dlnaClass}
+        onclick=${dlnaHandler}>
+        cast
+      </i>
+    `)
+  }
 
   // On OSX, the back button is in the title bar of the window; see app.js
   // On other platforms, we render one over the video on mouseover