hook up ui! (eliminate handlebars - it didn't help enough)

3 files changed, 138 insertions, 76 deletions

diff --git a/lib/app.js b/lib/app.js
index 6dfa508..7166262 100644
--- a/lib/app.js
+++ b/lib/app.js
@@ -1,13 +1,14 @@
 module.exports = App
 
 var $ = require('jquery')
+var bncode = require('bncode')
+var fs = require('fs')
 var key = require('keymaster')
-var handlebars = require('handlebars')
 var humanize = require('humanize')
 
-handlebars.registerHelper('humanizeFilesize', function (bytes) {
-  return humanize.filesize(bytes)
-})
+var TEMPLATE = {
+  TORRENT: fs.readFileSync(__dirname + '/../views/torrent.html')
+}
 
 /**
  * WebTorrent App UI
@@ -25,6 +26,13 @@ function App (torrentManager) {
 
   self.setupWindow()
   self.setupTorrentManager()
+
+  self.initUI()
+
+  self.updateUI()
+  window.setInterval(function () {
+    self.updateUI()
+  }, 1000)
 }
 
 App.prototype.setupWindow = function () {
@@ -65,31 +73,102 @@ App.prototype.setupWindow = function () {
   // })
 }
 
+App.prototype.initUI = function () {
+  var self = this
+  self.torrentManager.torrents.forEach(function (torrent) {
+    self.addTorrent(torrent)
+  })
+}
+
 App.prototype.setupTorrentManager = function () {
+  var self = this
   window.torrentManager.on('addTorrent', function (torrent) {
-    var $torrent = $(handlebars.templates.torrent(torrent))
-    $('#torrents').append($torrent)
+    self.addTorrent(torrent)
+  })
+  window.torrentManager.on('removeTorrent', function (torrent) {
+    self.removeTorrent(torrent)
+  })
+}
+
+App.prototype.addTorrent = function (torrent) {
+  var self = this
+  var $torrent = $(TEMPLATE.TORRENT)
+  self.updateTorrentUI($torrent, torrent)
 
-    // $('.downloadMetadata').click(function () {
-    //   t.downloadMetadata()
-    // })
+  $torrent.on('click', function () {
+    self.downloadTorrentMetadata(torrent)
   })
 
-  // window.torrentManager.on('torrent:metadata', function (torrent, metadata) {
-  //   var $torrent = $(handlebars.templates.torrent(torrent))
-  //   $('#torrents').append($torrent)
-  // })
+  $('#torrents').append($torrent)
+  self.updateUI()
+}
+
+App.prototype.removeTorrent = function (torrent) {
+  var self = this
+  $('#torrent_' + torrent.infoHash).remove()
+  self.updateUI()
 }
 
+App.prototype.updateUI = function () {
+  var self = this
+
+  self.torrentManager.torrents.forEach(function (torrent) {
+    var $torrent = $('#torrent_' + torrent.infoHash)
+    self.updateTorrentUI($torrent, torrent)
+  })
 
+  $('.overall-stats .ratio span').text(self.torrentManager.ratio)
 
-  // $('.dhtPeers span').text(Object.keys(this.dht.peers).length)
+  // Number of transfers
+  if (self.torrentManager.torrents.length === 1)
+    $('.numTransfers').text('1 transfer')
+  else
+    $('.numTransfers').text(self.torrentManager.torrents.length + ' transfers')
+}
 
-  // var connectedPeers = 0
-  // for (var infoHash in this.torrents) {
-  //   var torrent = this.torrents[infoHash]
-  //   connectedPeers += torrent.numPeers
-  // }
-  // $('.connectedPeers span').text(connectedPeers)
-  // $('.downloadMetadata').toggleClass('highlight', !!t.metadata)
+App.prototype.updateTorrentUI = function ($torrent, torrent) {
+  if (!$torrent.attr('id'))
+    $torrent.attr('id', 'torrent_' + torrent.infoHash)
+
+  if (torrent.metadata)
+    $torrent.addClass('has-metadata')
+  else
+    $torrent.removeClass('has-metadata')
+
+  $torrent.find('.title').text(torrent.title)
+  $torrent.find('.downloaded').text(humanize.filesize(torrent.swarm.downloaded))
+  $torrent.find('.uploaded').text(humanize.filesize(torrent.swarm.uploaded))
+  $torrent.find('.ratio').text(torrent.swarm.ratio)
+  $torrent.find('progress').attr('value', torrent.progress)
+  $torrent.find('.numPeers').text(torrent.swarm.numConns + torrent.swarm.numQueued)
+  $torrent.find('.numActivePeers').text(torrent.swarm.numPeers)
+}
 
+App.prototype.downloadTorrentMetadata = function (torrent) {
+  var self = this
+  if (!torrent.metadata)
+    return
+
+  var errorHandler = function (err) {
+    console.error('error' + err.toString())
+  }
+
+  chrome.fileSystem.chooseEntry({
+    type: 'saveFile',
+    suggestedName: torrent.title + '.torrent'
+  }, function (fileEntry) {
+    if (!fileEntry)
+      return
+
+    fileEntry.createWriter(function (writer) {
+      writer.onerror = errorHandler
+      writer.onwriteend = function (e) {
+        console.log('write complete')
+      }
+
+      var metadata = new Buffer(bncode.encode(torrent.metadata))
+
+      writer.write(new Blob([metadata]), { type: 'application/x-bittorrent' })
+    }, errorHandler)
+  })
+}
\ No newline at end of file
diff --git a/lib/torrent-manager.js b/lib/torrent-manager.js
index 0a15967..be8fb69 100644
--- a/lib/torrent-manager.js
+++ b/lib/torrent-manager.js
@@ -56,6 +56,22 @@ function TorrentManager () {
   })
 }
 
+Object.defineProperty(TorrentManager.prototype, 'ratio', {
+  get: function () {
+    var self = this
+
+    var uploaded = self.torrents.reduce(function (acc, torrent) {
+      return acc + torrent.swarm.uploaded
+    }, 0)
+    var downloaded = self.torrents.reduce(function (acc, torrent) {
+      return acc + torrent.swarm.downloaded
+    }, 0)
+
+    if (downloaded === 0) return 0
+    else return uploaded / downloaded
+  }
+})
+
 TorrentManager.prototype.getTorrent = function (infoHash) {
   var self = this
   var index
diff --git a/lib/torrent.js b/lib/torrent.js
index cea4ac2..ab6cb5a 100644
--- a/lib/torrent.js
+++ b/lib/torrent.js
@@ -12,29 +12,30 @@ var WIRE_TIMEOUT = 10000
 inherits(Torrent, EventEmitter)
 
 function Torrent (uri, opts) {
-  if (!(this instanceof Torrent)) return new Torrent(uri, opts)
-  EventEmitter.call(this)
+  var self = this
+  if (!(self instanceof Torrent)) return new Torrent(uri, opts)
+  EventEmitter.call(self)
 
-  var info = this._parseMagnetUri(uri)
+  var info = parseMagnetUri(uri)
   if (!info.infoHash)
     throw new Error('invalid torrent uri')
-  this.infoHash = info.infoHash
-  this.title = info.title
-  this.metadata = null
+  self.infoHash = info.infoHash
+  self.title = info.title
+  self.metadata = null
 
-  this.swarm = new Swarm(this.infoHash, opts.peerId, { dht: true })
+  self.swarm = new Swarm(self.infoHash, opts.peerId, { dht: true })
 
   if (opts.port) {
-    this.swarm.listen(opts.port, function (port) {
-      this.emit('listening', port)
-    }.bind(this))
+    self.swarm.listen(opts.port, function (port) {
+      self.emit('listening', port)
+    })
   }
 
-  this.swarm.on('error', function (err) {
+  self.swarm.on('error', function (err) {
     console.error(err.message)
   })
 
-  this.swarm.on('wire', function (wire) {
+  self.swarm.on('wire', function (wire) {
     // Send KEEP-ALIVE (every 60s) so peers will not disconnect the wire
     wire.setKeepAlive(true)
 
@@ -130,57 +131,22 @@ function Torrent (uri, opts) {
 
           console.log('METADATA')
           console.log(wire.metadata.toString())
-          this.metadata = {
+          self.metadata = {
             'announce-list': [],
             info: bncode.decode(wire.metadata),
             // info_hash:
           }
-          console.log(this.metadata)
-          this.emit('metadata', this.metadata)
+          console.log(self.metadata)
+          self.emit('metadata', this.metadata)
         }
       }
-    }.bind(this))
-
-  }.bind(this))
-}
-
-Torrent.prototype.downloadMetadata = function () {
-  if (!this.metadata)
-    return
-
-  var errorHandler = function (err) {
-    console.error('error' + err.toString())
-  }
-
-  chrome.fileSystem.chooseEntry({
-    type: 'saveFile',
-    suggestedName: this.title + '.torrent'
-  }, function (fileEntry) {
-    if (!fileEntry)
-      return
-
-    fileEntry.createWriter(function (writer) {
-      writer.onerror = errorHandler
-      writer.onwriteend = function (e) {
-        console.log('write complete')
-      }
-
-      var metadata = new Buffer(bncode.encode(this.metadata))
-
-      writer.write(new Blob([metadata]), { type: 'application/x-bittorrent' })
-    }.bind(this), errorHandler)
-  }.bind(this))
+    })
+  })
 }
 
-Object.defineProperty(Torrent.prototype, 'numPeers', {
-  get: function () {
-    return this.swarm.wires.length
-  }
-})
-
 Object.defineProperty(Torrent.prototype, 'progress', {
   get: function () {
-    return 0.7 // TODO
+    return 0 // TODO
   }
 })
 
@@ -189,7 +155,8 @@ Object.defineProperty(Torrent.prototype, 'progress', {
  * @param {string} addr
  */
 Torrent.prototype.addPeer = function (addr) {
-  this.swarm.add(addr)
+  var self = this
+  self.swarm.add(addr)
 }
 
 //
@@ -201,7 +168,7 @@ Torrent.prototype.addPeer = function (addr) {
  * @param  {string} uri
  * @return {Object}
  */
-Torrent.prototype._parseMagnetUri = function (uri) {
+function parseMagnetUri (uri) {
   var parsed = magnet(uri)
   return {
     title: parsed.dn, // displayName