Add download button

Doesn't do anything yet

main/ipc.js

@@ -31,6 +31,10 @@ function init () {
   ipcMain.on('toggleFullScreen', function (e) {
     windows.main.setFullScreen(!windows.main.isFullScreen())
   })
+
+  ipcMain.on('log', function (e, message) {
+    console.log(message)
+  })
 }
 
 function addTorrentFromPaste () {

renderer/index.css

@@ -223,7 +223,6 @@ body.drag::before {
 
 .torrent {
   height: 120px;
-  padding: 20px;
   background: rgba(0, 0, 0, 0.5);
   background-repeat: no-repeat;
   background-size: cover;
@@ -241,47 +240,45 @@ body.drag::before {
 }
 
 .torrent .metadata {
-  float: left;
+  position: absolute;
-  width: 100%;
+  top: 20px;
+  left: 20px;
   text-shadow: rgba(0, 0, 0, 0.5) 0 0 4px;
 }
 
-.torrent:hover .metadata {
-  width: calc(100% - 90px);
-}
-
 .torrent .buttons {
-  float: right;
+  position: absolute;
-  margin-top: 20px;
+  top: 0;
+  right: 0;
+  height: 100%;
+  align-items: center; /* flexbox: center buttons vertically */
   display: none;
 }
 
-.torrent .buttons * {
-  padding-top: 10px;
-}
-
-.torrent .buttons :not(:first-child) {
-  margin-left: 10px;
-}
-
-.torrent .delete {
-  opacity: 0.5;
-}
-
 .torrent:hover .buttons {
-  display: block;
+  display: flex;
 }
 
-.torrent .play {
+.torrent .buttons > :not(:first-child) {
+  margin-left: 10px; /* space buttons by 10px */
+}
+
+.torrent .buttons .download {
+  background-color: #2233BB;
+  width: 28px;
+  height: 28px;
+  border-radius: 14px;
+  font-size: 18px;
+  padding-top: 6px;
+}
+
+.torrent .buttons .play {
+  padding-top: 10px;
   background-color: #F44336;
 }
 
-.torrent .chromecast {
+.torrent .buttons .delete {
-  background-color: #2196F3;
+  opacity: 0.5;
-}
-
-.torrent .airplay {
-  background-color: #212121;
 }
 
 .torrent .name {

renderer/index.js

@@ -205,7 +205,7 @@ electron.ipcRenderer.on('addFakeDevice', function (e, device) {
 function loadState () {
   cfg.read(function (err, data) {
     if (err) console.error(err)
-    console.log('loaded state: ' + JSON.stringify(data, null, 4)) /* pretty print */
+    electron.ipcRenderer.send('log', 'loaded state from ' + cfg.filePath)
     state.saved = data
     if (!state.saved.torrents) state.saved.torrents = []
     state.saved.torrents.forEach(function (torrent) {
@@ -216,6 +216,7 @@ function loadState () {
 
 // Write state.saved to the JSON state file
 function saveState () {
+  electron.ipcRenderer.send('log', 'saving state to ' + cfg.filePath)
   cfg.write(state.saved, function (err) {
     if (err) console.error(err)
     update()
@@ -261,6 +262,9 @@ function isNotTorrentFile (file) {
 function addTorrent (torrentId) {
   if (!torrentId) torrentId = 'magnet:?xt=urn:btih:6a9759bffd5c0af65319979fb7832189f4f3c35d&dn=sintel.mp4'
   var torrent = startTorrenting(torrentId)
+  if (state.saved.torrents.find((x) => x.infoHash === torrent.infoHash)) {
+    return // torrent is already in state.saved
+  }
   state.saved.torrents.push({
     name: torrent.name,
     magnetURI: torrent.magnetURI,

renderer/views/torrent-list.js

@@ -68,6 +68,11 @@ function renderTorrent (torrent, dispatch) {
   function renderTorrentButtons () {
     return hx`
       <div class="buttons">
+        <i.btn.icon.download
+          class='${torrent.state}'
+          onclick=${() => dispatch('toggleTorrent', torrent)}>
+          file_download
+        </i>
         <i.btn.icon.play
           class='${!torrent.ready ? 'disabled' : ''}'
           onclick=${() => dispatch('openPlayer', torrent)}>