From 90a109407336f0e50623decbf1d60b162627f855 Mon Sep 17 00:00:00 2001
From: Nate Goldman <nate@ngoldman.me>
Date: Sat, 5 Mar 2016 10:50:53 -0800
Subject: [PATCH 1/4] improve torrent metadata display

---
 renderer/index.css             | 2 +-
 renderer/views/torrent-list.js | 8 +++++---
 2 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/renderer/index.css b/renderer/index.css
index 4568754c..9975a0e4 100644
--- a/renderer/index.css
+++ b/renderer/index.css
@@ -266,7 +266,7 @@ body.drag::before {
   bottom: 20px;
 }
 
-.torrent .status :not(:last-child)::after {
+.torrent span:not(:last-child)::after {
   content: ' — ';
 }
 
diff --git a/renderer/views/torrent-list.js b/renderer/views/torrent-list.js
index ede1b111..7ab87cc4 100644
--- a/renderer/views/torrent-list.js
+++ b/renderer/views/torrent-list.js
@@ -49,16 +49,18 @@ function renderTorrent (state, dispatch, torrent) {
 
 // Renders the torrent name and download progress
 function renderTorrentMetadata (torrent) {
+  var progress = Math.floor(100 * torrent.progress)
   return hx`
     <div class="metadata">
       <div class="name ellipsis">${torrent.name || 'Loading torrent...'}</div>
       <div class="status">
-        <span class="progress">${Math.floor(100 * torrent.progress)}%</span>
+        <span class="progress">${progress}%</span>
+        <span>${prettyBytes((torrent.length / 100) * progress)} / ${prettyBytes(torrent.length)}</span>
       </div>
       ${getFilesLength()}
       <span>${getPeers()}</span>
-      <span>${prettyBytes(torrent.downloadSpeed)}/s</span>
-      <span>${prettyBytes(torrent.uploadSpeed)}/s</span>
+      <span>↓ ${prettyBytes(torrent.downloadSpeed)}/s</span>
+      <span>↑ ${prettyBytes(torrent.uploadSpeed)}/s</span>
     </div>
   `
 

From 4a4d5cc4ed40fd56b95fb86fb0c0fea2e85e20bf Mon Sep 17 00:00:00 2001
From: Nate Goldman <nate@ngoldman.me>
Date: Sat, 5 Mar 2016 11:13:08 -0800
Subject: [PATCH 2/4] better approximation of byte progress

---
 renderer/views/torrent-list.js | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/renderer/views/torrent-list.js b/renderer/views/torrent-list.js
index 7ab87cc4..718438d4 100644
--- a/renderer/views/torrent-list.js
+++ b/renderer/views/torrent-list.js
@@ -49,13 +49,12 @@ function renderTorrent (state, dispatch, torrent) {
 
 // Renders the torrent name and download progress
 function renderTorrentMetadata (torrent) {
-  var progress = Math.floor(100 * torrent.progress)
   return hx`
     <div class="metadata">
       <div class="name ellipsis">${torrent.name || 'Loading torrent...'}</div>
       <div class="status">
-        <span class="progress">${progress}%</span>
-        <span>${prettyBytes((torrent.length / 100) * progress)} / ${prettyBytes(torrent.length)}</span>
+        <span class="progress">${Math.floor(100 * torrent.progress)}%</span>
+        <span>${prettyBytes(torrent.length * torrent.progress)} / ${prettyBytes(torrent.length)}</span>
       </div>
       ${getFilesLength()}
       <span>${getPeers()}</span>

From 6e5a481903cc3696735c5ad806c770da74ea7934 Mon Sep 17 00:00:00 2001
From: Nate Goldman <nate@ngoldman.me>
Date: Sat, 5 Mar 2016 11:39:32 -0800
Subject: [PATCH 3/4] fix chromecast play

---
 renderer/index.js | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/renderer/index.js b/renderer/index.js
index 7a86a1ac..bfc0867a 100644
--- a/renderer/index.js
+++ b/renderer/index.js
@@ -72,7 +72,7 @@ function init () {
   dragDrop('body', onFiles)
 
   chromecasts.on('update', function (player) {
-    state.view.chromecast = player
+    state.view.devices.chromecast = player
     update()
   })
 
@@ -285,8 +285,8 @@ function deleteTorrent (torrent) {
 
 function openChromecast (torrent) {
   startServer(torrent, function () {
-    state.view.chromecast.play(state.server.networkURL, { title: 'WebTorrent — ' + torrent.name })
-    state.view.chromecast.on('error', function (err) {
+    state.view.devices.chromecast.play(state.server.networkURL, { title: 'WebTorrent — ' + torrent.name })
+    state.view.devices.chromecast.on('error', function (err) {
       err.message = 'Chromecast: ' + err.message
       onError(err)
     })

From 86f4ad29a65aa664ac632349cd21a4f8f1a5a10a Mon Sep 17 00:00:00 2001
From: Nate Goldman <nate@ngoldman.me>
Date: Sat, 5 Mar 2016 11:40:15 -0800
Subject: [PATCH 4/4] fix renderering errors

giving prettyBytes anything but a number causes the torrent-list render to fail
---
 renderer/views/torrent-list.js | 19 +++++++++++++++----
 1 file changed, 15 insertions(+), 4 deletions(-)

diff --git a/renderer/views/torrent-list.js b/renderer/views/torrent-list.js
index 718438d4..35cc5943 100644
--- a/renderer/views/torrent-list.js
+++ b/renderer/views/torrent-list.js
@@ -49,17 +49,28 @@ function renderTorrent (state, dispatch, torrent) {
 
 // Renders the torrent name and download progress
 function renderTorrentMetadata (torrent) {
+  var progressPercent = 0
+  var progressBytes = 0
+
+  if (torrent.progress) {
+    progressPercent = Math.floor(100 * torrent.progress)
+  }
+
+  if (torrent.length && torrent.progress) {
+    progressBytes = torrent.length * torrent.progress
+  }
+
   return hx`
     <div class="metadata">
       <div class="name ellipsis">${torrent.name || 'Loading torrent...'}</div>
       <div class="status">
-        <span class="progress">${Math.floor(100 * torrent.progress)}%</span>
-        <span>${prettyBytes(torrent.length * torrent.progress)} / ${prettyBytes(torrent.length)}</span>
+        <span class="progress">${progressPercent}%</span>
+        <span>${prettyBytes(progressBytes)} / ${prettyBytes(torrent.length || 0)}</span>
       </div>
       ${getFilesLength()}
       <span>${getPeers()}</span>
-      <span>↓ ${prettyBytes(torrent.downloadSpeed)}/s</span>
-      <span>↑ ${prettyBytes(torrent.uploadSpeed)}/s</span>
+      <span>↓ ${prettyBytes(torrent.downloadSpeed || 0)}/s</span>
+      <span>↑ ${prettyBytes(torrent.uploadSpeed || 0)}/s</span>
     </div>
   `