Minimize to tray

Fixes #150

renderer/index.css

@@ -142,6 +142,7 @@ i:not(.disabled):hover {
  */
 
 .header {
+  background: rgb(40, 40, 40);
   border-bottom: 1px solid rgb(20, 20, 20);
   height: 37px; /* vertically center OS menu buttons (OS X) */
   padding-top: 6px;
@@ -158,6 +159,10 @@ i:not(.disabled):hover {
   z-index: 1;
 }
 
+.app:not(.is-focused) .header {
+  background: rgb(50, 50, 50);
+}
+
 .app.view-player .header {
   opacity: 0.8;
 }

renderer/index.js

@@ -270,6 +270,13 @@ function dispatch (action, ...args) {
   }
   if (action === 'pause') {
     playPause(true)
+
+    // Work around virtual-dom issue: it doesn't expose its redraw function,
+    // and only redraws on requestAnimationFrame(). That means when the user
+    // closes the window (hide window / minimize to tray) and we want to pause
+    // the video, we update the vdom but it keeps playing until you reopen!
+    var videoTag = document.querySelector('video')
+    if (videoTag) videoTag.pause()
   }
   if (action === 'playbackJump') {
     jumpToTime(args[0] /* seconds */)