0.11.0

plist@2

.gitignore

@@ -1,2 +1,3 @@
 node_modules
+build
 dist

AUTHORS.md

@@ -2,21 +2,30 @@
 
 #### Ordered by first contribution.
 
-- Feross Aboukhadijeh <feross@feross.org>
-- DC <dcposch@dcpos.ch>
-- Nate Goldman <nate@ngoldman.me>
-- Chris Morris <chris@chrismorris.org>
-- Giuseppe Crinò <giuscri@gmail.com>
-- Romain Beaumont <romain.rom1@gmail.com>
-- Dan Flettre <fletd01@yahoo.com>
-- Liam Gray <liam.r.gray@gmail.com>
-- grunjol <grunjol@argenteam.net>
-- Rémi Jouannet <remijouannet@users.noreply.github.com>
-- Evan Miller <miller.evan815@gmail.com>
-- Alex <alxmorais8@msn.com>
-- Diego Rodríguez Baquero <diegorbaquero@gmail.com>
-- Karlo Luis Martinez Martos <karlo.luis.m@gmail.com>
-- gabriel <furstenheim@gmail.com>
-- Rolando Guedes <rolando.guedes@3gnt.net>
+- Feross Aboukhadijeh (feross@feross.org)
+- DC (dcposch@dcpos.ch)
+- Nate Goldman (nate@ngoldman.me)
+- Chris Morris (chris@chrismorris.org)
+- Giuseppe Crinò (giuscri@gmail.com)
+- Romain Beaumont (romain.rom1@gmail.com)
+- Dan Flettre (fletd01@yahoo.com)
+- Liam Gray (liam.r.gray@gmail.com)
+- grunjol (grunjol@users.noreply.github.com)
+- Rémi Jouannet (remijouannet@users.noreply.github.com)
+- Evan Miller (miller.evan815@gmail.com)
+- Alex (alxmorais8@msn.com)
+- Diego Rodríguez Baquero (diegorbaquero@gmail.com)
+- Karlo Luis Martinez Martos (karlo.luis.m@gmail.com)
+- gabriel (furstenheim@gmail.com)
+- Rolando Guedes (rolando.guedes@3gnt.net)
+- Benjamin Tan (demoneaux@gmail.com)
+- Mathias Rasmussen (mathiasvr@gmail.com)
+- Sergey Bargamon (sergey@bargamon.ru)
+- Thomas Watson Steen (w@tson.dk)
+- anonymlol (anonymlol7@gmail.com)
+- Gediminas Petrikas (gedas18@gmail.com)
+- Adam Gotlib (gotlib.adam+dev@gmail.com)
+- Rémi Jouannet (remijouannet@gmail.com)
+- Andrea Tupini (tupini07@gmail.com)
 
 #### Generated by bin/update-authors.sh.

CHANGELOG.md

@@ -1,5 +1,203 @@
 # WebTorrent Desktop Version History
 
+## v0.11.0 - 2016-08-19
+
+### Added
+
+- New Preference to "Set WebTorrent as default handler for torrents and magnet links" (#771)
+- New Preference to "Always play in VLC" (#674)
+- Check for missing default download path and torrent folders on start up (#776)
+
+### Changed
+
+- Do not automatically set WebTorrent as the default handler for torrents (#771)
+- Torrents can only be created from the home screen (#770)
+- Update Electron to 1.3.3 (#772)
+
+### Fixed
+
+- Allow modifying the default tracker list on the Create Torrent page (#775)
+- Prevent opening multiple stacked Preference windows or Create Torrent windows (#770)
+- Windows: Player window auto-resize does not match video aspect ratio (#565)
+- Missing page title on Create Torrent page
+
+## v0.10.0 - 2016-08-05
+
+### Added
+
+- Drag-and-drop magnet links (selected text) is now supported (#284)
+- Windows: Add "User Tasks" shortcuts to app icon in Start Menu (#114)
+- Linux: Show badge count for completed torrent downloads
+
+### Changed
+
+- Change WebTorrent Desktop peer ID prefix to 'WD' to distinguish from WebTorrent in the browser, 'WW' (#688)
+- Switch UI to React to improve UI rendering speed (#729)
+  - The primary bottleneck was actually `hyperx`, not `virtual-dom`.
+- Update Electron to 1.3.2 (#738) (#739) (#740) (#747) (#756)
+  - Mac 10.9: Fix the fullscreen button showing
+  - Mac 10.9: Fix window having border
+  - Mac 10.9: Fix occasional crash
+  - Mac: Update Squirrel.Mac to 0.2.1 (fixes situations in which updates would not get applied)
+  - Mac: Fix window not showing in Window menu
+  - Mac: Fix context menu always choosing first item by default
+  - Linux: Fix startup crashes (some Linux distros)
+  - Linux: Fix menubar not hiding after entering fullscreen (some Linux distros)
+- Improved location history (back/forward buttons) to fix rare exceptions (#687) (#748)
+  - Location history abstraction released independently as [`location-history`](https://www.npmjs.com/package/location-history)
+
+### Fixed
+
+- When streaming to VLC, set VLC window title to torrent file name (#746)
+- Fix "Cannot read property 'numPiecesPresent' of undefined" exception (#695)
+- Fix rare case where config file could not be completely written (#733)
+
+## v0.9.0 - 2016-07-20
+
+### Added
+
+- Save selected subtitles
+- Ask for confirmation before deleting torrents
+- Support Debian Jessie
+
+### Changed
+
+- Only send telemetry in production
+- Clean up the code. Split main.js, refactor lots of things
+
+### Fixed
+
+- Fix state.playing.jumpToTime behavior
+- Remove torrent file and poster image when deleting a torrent
+
+## v0.8.1 - 2016-06-24
+
+### Added
+
+- New URI handler: stream-magnet
+
+### Fixed
+
+- DLNA crashing bug
+
+## v0.8.0 - 2016-06-23
+
+### Added
+
+- Cast menu: choose which Chromecast, Airplay, or DLNA device you want to use
+- Telemetry: send basic data, plus stats on how often the play button works
+- Make posters from jpeg files, not just jpg
+- Support .wmv video via Play in VLC
+- Windows thumbnail bar with a play/pause button
+
+### Changed
+
+- Nicer modal styles
+
+### Fixed
+
+- Windows tray icon now stays in the right state
+
+## v0.7.2 - 2016-06-02
+
+### Fixed
+
+- Fix exception that affects users upgrading from v0.5.1 or older
+  - Ensure `state.saved.prefs` configuration exists
+- Fix window title on "About WebTorrent" window
+
+## v0.7.1 - 2016-06-02
+
+### Changed
+
+- Change "Step Forward" keyboard shortcut to `Alt+Left` (Windows)
+- Change "Step Backward" keyboard shortcut to to `Alt+Right` (Windows)
+
+### Fixed
+
+- First time startup bug -- invalid torrent/poster paths
+
+## v0.7.0 - 2016-06-02
+
+### Added
+
+- Improved AirPlay support -- using the new [`airplayer`](https://www.npmjs.com/package/airplayer) package
+- Remember volume setting in player, for as long as the app is open
+
+### Changed
+
+- Add (+) button now also accepts non .torrent files and creates a torrent from
+  those files
+- Show prompt text in title bar for open dialogs (OS X)
+- Upgrade Electron to 1.2.1
+  - Improve window resizing when aspect ratio is enforced (OS X)
+  - Use .ico format for better icon rendering quality (Windows)
+  - Fix crash reporter not working (Windows)
+
+### Fixed
+
+- Re-enable WebRTC (web peers)! (OS X, Windows)
+  - Windows support was disabled in v0.6.1 to work around a bug in Electron
+  - OS X support was disabled in v0.4.0 to work around a 100% CPU bug
+- Fix subtitle selector radio button UI size glitch
+- Fix race condition causing exeption on app startup
+- Fix duplicate torrent detection in some cases
+- Fix "gray screen" exception caused by incorrect file list order
+- Fix torrent loading message UI misalignment
+
+### Known issues
+
+- When upgrading to WebTorrent Desktop v0.7.0, some torrent metadata (file list,
+  selected files, whether torrent is streamable) will be cleared. Just start the
+  torrent to re-populate the metadata.
+
+## v0.6.1 - 2016-05-26
+
+### Fixed
+
+- Disable WebRTC to work around Electron crash (Windows)
+  - Will be re-enabled in the next version of WebTorrent, which will be based on
+    the next version of Electron, where the bug is fixed.
+- Fix crash when updating from WebTorrent 0.5.x in some situtations (#583)
+- Fix crash when dropping files onto the dock icon (OS X)
+- Fix keyboard shortcuts Space and ESC being captured globally (#585)
+- Fix crash, show error when drag-dropping hidden files (#586)
+
+## v0.6.0 - 2016-05-24
+
+### Added
+
+- Added Preferences page to set Download folder
+- Save video position, resume playback from saved position
+- Add additional video player keyboard shortcuts (#275)
+- Use `poster.jpg` file as the poster image if available (#558)
+- Associate .torrent files to WebTorrent Desktop (OS X) (#553)
+- Add support for pasting `instant.io` links (#559)
+- Add announcement feature
+
+### Changed
+
+- Nicer player UI
+- Reduce startup jank, improve startup time (#568)
+- Cleanup unsupported codec detection (#569, #570)
+- Cleaner look for the torrent file list
+- Improve subtitle positioning (#551)
+
+### Fixed
+
+- Fix Uncaught TypeError: Cannot read property 'update' of undefined (#567)
+- Fix bugs in LocationHistory
+  - When player is active, and magnet link is pasted, go back to list
+  - After deleting torrent, remove just the player from forward stack
+  - After creating torrent, remove create torrent page from forward stack
+  - Cancel button on create torrent page should only go back one page
+
+## v0.5.1 - 2016-05-18
+
+### Fixed
+
+- Fix auto-updater (OS X, Windows).
+
 ## v0.5.0 - 2016-05-17
 
 ### Added

CONTRIBUTING.md

@@ -73,3 +73,23 @@ By making a contribution to this project, I certify that:
   record of the contribution (including all personal information I submit with it,
   including my sign-off) is maintained indefinitely and may be redistributed consistent
   with this project or the open source license(s) involved.
+
+## Smoke Tests
+
+Before a release, check that the following basic use cases work correctly:
+
+1. Click "Play" to stream a built-in torrent (e.g. Sintel)
+  - Ensure that seeking to undownloaded region works and plays immediately.
+  - Ensure that sintel.mp4 gets downloaded to `~/Downloads`.
+
+2. Check that the auto-updater works
+  - Open the console and check for the line "No update available" to indicate
+
+3. Add a new .torrent file via drag-and-drop.
+  - Ensure that it gets added to the list and starts downloading
+
+4. Remove a torrent from the client
+  - Ensure that the file is removed from `~/Downloads`
+
+5. Create and seed a new a torrent via drag-and-drop.
+  - Ensure that the torrent gets created and seeding begins.

LICENSE

@@ -1,6 +1,6 @@
 The MIT License (MIT)
 
-Copyright (c) Feross Aboukhadijeh
+Copyright (c) WebTorrent, LLC
 
 Permission is hereby granted, free of charge, to any person obtaining a copy of
 this software and associated documentation files (the "Software"), to deal in

README.md

@@ -7,7 +7,7 @@
   <br>
 </h1>
 
-<h4 align="center">The streaming torrent client. For OS X, Windows, and Linux.</h4>
+<h4 align="center">The streaming torrent client. For Mac, Windows, and Linux.</h4>
 
 <p align="center">
   <a href="https://gitter.im/feross/webtorrent"><img src="https://img.shields.io/badge/gitter-join%20chat%20%E2%86%92-brightgreen.svg" alt="Gitter"></a>
@@ -22,7 +22,7 @@
 ## Screenshot
 
 <p align="center">
-  <img src="https://webtorrent.io/img/screenshot-main.png" width="562" height="630" alt="screenshot" align="center">
+  <img src="https://webtorrent.io/img/screenshot-main.png" width="612" height="749" alt="screenshot" align="center">
 </p>
 
 ## How to Contribute
@@ -41,7 +41,7 @@ $ npm start
 
 ### Package app
 
-Builds app binaries for OS X, Linux, and Windows.
+Builds app binaries for Mac, Linux, and Windows.
 
 ```
 $ npm run package
@@ -57,23 +57,23 @@ Where `[platform]` is `darwin`, `linux`, `win32`, or `all` (default).
 
 The following optional arguments are available:
 
-- `--sign` - Sign the application (OS X, Windows)
+- `--sign` - Sign the application (Mac, Windows)
 - `--package=[type]` - Package single output type.
    - `deb` - Debian package
    - `zip` - Linux zip file
-   - `dmg` - OS X disk image
+   - `dmg` - Mac disk image
    - `exe` - Windows installer
    - `portable` - Windows portable app
    - `all` - All platforms (default)
 
-Note: Even with the `--package` option, the auto-update files (.nupkg for Windows, *-darwin.zip for OS X) will always be produced.
+Note: Even with the `--package` option, the auto-update files (.nupkg for Windows, *-darwin.zip for Mac) will always be produced.
 
 #### Windows build notes
 
 To package the Windows app from non-Windows platforms, [Wine](https://www.winehq.org/) needs
 to be installed.
 
-On OS X, first install [XQuartz](http://www.xquartz.org/), then run:
+On Mac, first install [XQuartz](http://www.xquartz.org/), then run:
 
 ```
 brew install wine
@@ -81,10 +81,16 @@ brew install wine
 
 (Requires the [Homebrew](http://brew.sh/) package manager.)
 
+### Privacy
+
+WebTorrent Desktop collects some basic usage stats to help us make the app better. For example, we track how well the play button works. How often does it succeed? Time out? Show a missing codec error?
+
+The app never sends personally identifying information, nor does it track which swarms you join.
+
 ### Code Style
 
 [![js-standard-style](https://cdn.rawgit.com/feross/standard/master/badge.svg)](https://github.com/feross/standard)
 
 ## License
 
-MIT. Copyright (c) [Feross Aboukhadijeh](http://feross.org).
+MIT. Copyright (c) [WebTorrent, LLC](https://webtorrent.io).

bin/check-deps.js

@@ -3,49 +3,103 @@
 var fs = require('fs')
 var cp = require('child_process')
 
-var BUILT_IN_DEPS = ['child_process', 'electron', 'fs', 'os', 'path', 'screen']
-var EXECUTABLE_DEPS = ['gh-release', 'standard']
+// We can't use `builtin-modules` here since our TravisCI
+// setup expects this file to run with no dependencies
+var BUILT_IN_NODE_MODULES = [
+  'assert',
+  'buffer',
+  'child_process',
+  'cluster',
+  'console',
+  'constants',
+  'crypto',
+  'dgram',
+  'dns',
+  'domain',
+  'events',
+  'fs',
+  'http',
+  'https',
+  'module',
+  'net',
+  'os',
+  'path',
+  'process',
+  'punycode',
+  'querystring',
+  'readline',
+  'repl',
+  'stream',
+  'string_decoder',
+  'timers',
+  'tls',
+  'tty',
+  'url',
+  'util',
+  'v8',
+  'vm',
+  'zlib'
+]
+
+var BUILT_IN_ELECTRON_MODULES = [ 'electron' ]
+
+var BUILT_IN_DEPS = [].concat(BUILT_IN_NODE_MODULES, BUILT_IN_ELECTRON_MODULES)
+
+var EXECUTABLE_DEPS = [
+  'gh-release',
+  'standard',
+  'babel-cli',
+  'babel-plugin-syntax-jsx',
+  'babel-plugin-transform-react-jsx'
+]
 
 main()
 
-// Scans our codebase and package.json for missing or unused dependencies
-// Process returns 0 on success, prints a message and returns 1 on failure
+// Scans codebase for missing or unused dependencies. Exits with code 0 on success.
 function main () {
   if (process.platform === 'win32') {
-    console.log('Sorry, check-deps only works on Mac and Linux')
+    console.error('Sorry, check-deps only works on Mac and Linux')
     return
   }
 
-  var jsDeps = findJSDeps()
+  var usedDeps = findUsedDeps()
   var packageDeps = findPackageDeps()
 
-  var missingDeps = jsDeps.filter((dep) =>
-    packageDeps.indexOf(dep) < 0 &&
-    BUILT_IN_DEPS.indexOf(dep) < 0)
-  var unusedDeps = packageDeps.filter((dep) =>
-    jsDeps.indexOf(dep) < 0 &&
-    EXECUTABLE_DEPS.indexOf(dep) < 0)
+  var missingDeps = usedDeps.filter(
+    (dep) => !includes(packageDeps, dep) && !includes(BUILT_IN_DEPS, dep)
+  )
+  var unusedDeps = packageDeps.filter(
+    (dep) => !includes(usedDeps, dep) && !includes(EXECUTABLE_DEPS, dep)
+  )
 
-  if (missingDeps.length > 0) console.log('Missing package dependencies: ' + missingDeps)
-  if (unusedDeps.length > 0) console.log('Unused package dependencies: ' + unusedDeps)
-
-  if (missingDeps.length + unusedDeps.length > 0) process.exit(1)
-
-  console.log('Lookin good!')
+  if (missingDeps.length > 0) {
+    console.error('Missing package dependencies: ' + missingDeps)
+  }
+  if (unusedDeps.length > 0) {
+    console.error('Unused package dependencies: ' + unusedDeps)
+  }
+  if (missingDeps.length + unusedDeps.length > 0) {
+    process.exitCode = 1
+  }
 }
 
-// Finds all dependencies, required, optional, or dev, in package.json
+// Finds all dependencies specified in `package.json`
 function findPackageDeps () {
   var pkg = JSON.parse(fs.readFileSync('package.json', 'utf8'))
-  var requiredDeps = Object.keys(pkg.dependencies)
+
+  var deps = Object.keys(pkg.dependencies)
   var devDeps = Object.keys(pkg.devDependencies)
   var optionalDeps = Object.keys(pkg.optionalDependencies)
 
-  return [].concat(requiredDeps, devDeps, optionalDeps)
+  return [].concat(deps, devDeps, optionalDeps)
 }
 
-// Finds all dependencies required() in the code
-function findJSDeps () {
+// Finds all dependencies that used with `require()`
+function findUsedDeps () {
   var stdout = cp.execSync('./bin/list-deps.sh')
   return stdout.toString().trim().split('\n')
 }
+
+function includes (arr, elem) {
+  return arr.indexOf(elem) >= 0
+}

bin/clean.js

@@ -10,11 +10,17 @@ var os = require('os')
 var path = require('path')
 var rimraf = require('rimraf')
 
-var config = require('../config')
-var handlers = require('../main/handlers')
+var config = require('../src/config')
+var handlers = require('../src/main/handlers')
 
+// First, remove generated files
+rimraf.sync('build/')
+rimraf.sync('dist/')
+
+// Remove any saved configuration
 rimraf.sync(config.CONFIG_PATH)
 
+// Remove any temporary files
 var tmpPath
 try {
   tmpPath = path.join(fs.statSync('/tmp') && '/tmp', 'webtorrent')

bin/cmd.js

@@ -6,5 +6,5 @@ var path = require('path')
 
 var child = cp.spawn(electron, [path.join(__dirname, '..')], {stdio: 'inherit'})
 child.on('close', function (code) {
-  process.exit(code)
+  process.exitCode = code
 })

bin/list-deps.sh

@@ -2,7 +2,7 @@
 # This is a truly heinous hack, but it works pretty nicely.
 # Find all modules we're requiring---even conditional requires.
 
-grep "require('" *.js bin/ main/ renderer/ -R |
+grep "require('" src/ bin/ -R |
     grep '.js:' |
     sed "s/.*require('\([^'\/]*\).*/\1/" |
     grep -v '^\.' |

bin/open-config.js

@@ -1,8 +1,6 @@
 #!/usr/bin/env node
 
-var config = require('../config')
+var config = require('../src/config')
 var open = require('open')
-var path = require('path')
 
-var configPath = path.join(config.CONFIG_PATH, 'config.json')
-open(configPath)
+open(config.CONFIG_PATH)

bin/package.js

@@ -1,7 +1,7 @@
 #!/usr/bin/env node
 
 /**
- * Builds app binaries for OS X, Linux, and Windows.
+ * Builds app binaries for Mac, Linux, and Windows.
  */
 
 var cp = require('child_process')
@@ -15,10 +15,11 @@ var rimraf = require('rimraf')
 var series = require('run-series')
 var zip = require('cross-zip')
 
-var config = require('../config')
+var config = require('../src/config')
 var pkg = require('../package.json')
 
 var BUILD_NAME = config.APP_NAME + '-v' + config.APP_VERSION
+var BUILD_PATH = path.join(config.ROOT_PATH, 'build')
 var DIST_PATH = path.join(config.ROOT_PATH, 'dist')
 
 var argv = minimist(process.argv.slice(2), {
@@ -36,6 +37,12 @@ var argv = minimist(process.argv.slice(2), {
 
 function build () {
   rimraf.sync(DIST_PATH)
+  rimraf.sync(BUILD_PATH)
+
+  console.log('Babel: Building JSX...')
+  cp.execSync('npm run build', { NODE_ENV: 'production', stdio: 'inherit' })
+  console.log('Babel: Built JSX.')
+
   var platform = argv._[0]
   if (platform === 'darwin') {
     buildDarwin(printDone)
@@ -56,11 +63,11 @@ function build () {
 
 var all = {
   // The human-readable copyright line for the app. Maps to the `LegalCopyright` metadata
-  // property on Windows, and `NSHumanReadableCopyright` on OS X.
+  // property on Windows, and `NSHumanReadableCopyright` on Mac.
   'app-copyright': config.APP_COPYRIGHT,
 
   // The release version of the application. Maps to the `ProductVersion` metadata
-  // property on Windows, and `CFBundleShortVersionString` on OS X.
+  // property on Windows, and `CFBundleShortVersionString` on Mac.
   'app-version': pkg.version,
 
   // Package the application's source code into an archive, using Electron's archive
@@ -73,7 +80,7 @@ var all = {
   'asar-unpack': 'WebTorrent*',
 
   // The build version of the application. Maps to the FileVersion metadata property on
-  // Windows, and CFBundleVersion on OS X. Note: Windows requires the build version to
+  // Windows, and CFBundleVersion on Mac. Note: Windows requires the build version to
   // start with a number. We're using the version of the underlying WebTorrent library.
   'build-version': require('webtorrent/package.json').version,
 
@@ -82,7 +89,7 @@ var all = {
 
   // Pattern which specifies which files to ignore when copying files to create the
   // package(s).
-  ignore: /^\/dist|\/(appveyor.yml|\.appveyor.yml|\.github|appdmg|AUTHORS|CONTRIBUTORS|bench|benchmark|benchmark\.js|bin|bower\.json|component\.json|coverage|doc|docs|docs\.mli|dragdrop\.min\.js|example|examples|example\.html|example\.js|externs|ipaddr\.min\.js|Makefile|min|minimist|perf|rusha|simplepeer\.min\.js|simplewebsocket\.min\.js|static\/screenshot\.png|test|tests|test\.js|tests\.js|webtorrent\.min\.js|\.[^\/]*|.*\.md|.*\.markdown)$/,
+  ignore: /^\/src|^\/dist|\/(appveyor.yml|\.appveyor.yml|\.github|appdmg|AUTHORS|CONTRIBUTORS|bench|benchmark|benchmark\.js|bin|bower\.json|component\.json|coverage|doc|docs|docs\.mli|dragdrop\.min\.js|example|examples|example\.html|example\.js|externs|ipaddr\.min\.js|Makefile|min|minimist|perf|rusha|simplepeer\.min\.js|simplewebsocket\.min\.js|static\/screenshot\.png|test|tests|test\.js|tests\.js|webtorrent\.min\.js|\.[^\/]*|.*\.md|.*\.markdown)$/,
 
   // The application name.
   name: config.APP_NAME,
@@ -102,20 +109,20 @@ var all = {
 }
 
 var darwin = {
-  // Build for OS X
+  // Build for Mac
   platform: 'darwin',
 
   // Build 64 bit binaries only.
   arch: 'x64',
 
-  // The bundle identifier to use in the application's plist (OS X only).
+  // The bundle identifier to use in the application's plist (Mac only).
   'app-bundle-id': 'io.webtorrent.webtorrent',
 
   // The application category type, as shown in the Finder via "View" -> "Arrange by
-  // Application Category" when viewing the Applications directory (OS X only).
+  // Application Category" when viewing the Applications directory (Mac only).
   'app-category-type': 'public.app-category.utilities',
 
-  // The bundle identifier to use in the application helper's plist (OS X only).
+  // The bundle identifier to use in the application helper's plist (Mac only).
   'helper-bundle-id': 'io.webtorrent.webtorrent-helper',
 
   // Application icon.
@@ -171,10 +178,10 @@ build()
 function buildDarwin (cb) {
   var plist = require('plist')
 
-  console.log('OS X: Packaging electron...')
+  console.log('Mac: Packaging electron...')
   electronPackager(Object.assign({}, all, darwin), function (err, buildPath) {
     if (err) return cb(err)
-    console.log('OS X: Packaged electron. ' + buildPath)
+    console.log('Mac: Packaged electron. ' + buildPath)
 
     var appPath = path.join(buildPath[0], config.APP_NAME + '.app')
     var contentsPath = path.join(appPath, 'Contents')
@@ -182,8 +189,6 @@ function buildDarwin (cb) {
     var infoPlistPath = path.join(contentsPath, 'Info.plist')
     var infoPlist = plist.parse(fs.readFileSync(infoPlistPath, 'utf8'))
 
-    // TODO: Use new `extend-info` and `extra-resource` opts to electron-packager,
-    // available as of v6.
     infoPlist.CFBundleDocumentTypes = [
       {
         CFBundleTypeExtensions: [ 'torrent' ],
@@ -208,6 +213,31 @@ function buildDarwin (cb) {
         CFBundleURLIconFile: path.basename(config.APP_FILE_ICON) + '.icns',
         CFBundleURLName: 'BitTorrent Magnet URL',
         CFBundleURLSchemes: [ 'magnet' ]
+      },
+      {
+        CFBundleTypeRole: 'Editor',
+        CFBundleURLIconFile: path.basename(config.APP_FILE_ICON) + '.icns',
+        CFBundleURLName: 'BitTorrent Stream-Magnet URL',
+        CFBundleURLSchemes: [ 'stream-magnet' ]
+      }
+    ]
+
+    infoPlist.UTExportedTypeDeclarations = [
+      {
+        UTTypeConformsTo: [
+          'public.data',
+          'public.item',
+          'com.bittorrent.torrent'
+        ],
+        UTTypeDescription: 'BitTorrent Document',
+        UTTypeIconFile: path.basename(config.APP_FILE_ICON) + '.icns',
+        UTTypeIdentifier: 'org.bittorrent.torrent',
+        UTTypeReferenceURL: 'http://www.bittorrent.org/beps/bep_0000.html',
+        UTTypeTagSpecification: {
+          'com.apple.ostype': 'TORR',
+          'public.filename-extension': [ 'torrent' ],
+          'public.mime-type': 'application/x-bittorrent'
+        }
       }
     ]
 
@@ -238,9 +268,9 @@ function buildDarwin (cb) {
        *   - So the auto-updater (Squirrrel.Mac) can check that app updates are signed by
        *     the same author as the current version.
        *   - So users will not a see a warning about the app coming from an "Unidentified
-       *     Developer" when they open it for the first time (OS X Gatekeeper).
+       *     Developer" when they open it for the first time (Mac Gatekeeper).
        *
-       * To sign an OS X app for distribution outside the App Store, the following are
+       * To sign an Mac app for distribution outside the App Store, the following are
        * required:
        *   - Xcode
        *   - Xcode Command Line Tools (xcode-select --install)
@@ -252,10 +282,10 @@ function buildDarwin (cb) {
         verbose: true
       }
 
-      console.log('OS X: Signing app...')
+      console.log('Mac: Signing app...')
       sign(signOpts, function (err) {
         if (err) return cb(err)
-        console.log('OS X: Signed app.')
+        console.log('Mac: Signed app.')
         cb(null)
       })
     }
@@ -270,24 +300,24 @@ function buildDarwin (cb) {
 
     function packageZip () {
       // Create .zip file (used by the auto-updater)
-      console.log('OS X: Creating zip...')
+      console.log('Mac: Creating zip...')
 
       var inPath = path.join(buildPath[0], config.APP_NAME + '.app')
       var outPath = path.join(DIST_PATH, BUILD_NAME + '-darwin.zip')
       zip.zipSync(inPath, outPath)
 
-      console.log('OS X: Created zip.')
+      console.log('Mac: Created zip.')
     }
 
     function packageDmg (cb) {
-      console.log('OS X: Creating dmg...')
+      console.log('Mac: Creating dmg...')
 
       var appDmg = require('appdmg')
 
       var targetPath = path.join(DIST_PATH, BUILD_NAME + '.dmg')
       rimraf.sync(targetPath)
 
-      // Create a .dmg (OS X disk image) file, for easy user installation.
+      // Create a .dmg (Mac disk image) file, for easy user installation.
       var dmgOpts = {
         basepath: config.ROOT_PATH,
         target: targetPath,
@@ -310,12 +340,12 @@ function buildDarwin (cb) {
       }
 
       var dmg = appDmg(dmgOpts)
-      dmg.on('error', cb)
+      dmg.once('error', cb)
       dmg.on('progress', function (info) {
         if (info.type === 'step-begin') console.log(info.title + '...')
       })
-      dmg.on('finish', function (info) {
-        console.log('OS X: Created dmg.')
+      dmg.once('finish', function (info) {
+        console.log('Mac: Created dmg.')
         cb(null)
       })
     }
@@ -443,7 +473,7 @@ function buildLinux (cb) {
       info: {
         arch: destArch === 'x64' ? 'amd64' : 'i386',
         targetDir: DIST_PATH,
-        depends: 'libc6 (>= 2.4)',
+        depends: 'gconf2, libgtk2.0-0, libnss3, libxss1',
         scripts: {
           postinst: path.join(config.STATIC_PATH, 'linux', 'postinst'),
           prerm: path.join(config.STATIC_PATH, 'linux', 'prerm')

bin/release-_post.sh

@@ -1,6 +1,7 @@
 #!/bin/sh
 set -e
 
+npm run update-authors
 git diff --exit-code
 npm run package -- --sign
 git push

bin/release-_pre.sh

@@ -2,10 +2,7 @@
 set -e
 
 git pull
-npm run update-authors
-git diff --exit-code
 rm -rf node_modules/
 npm install
-npm prune
 npm dedupe
 npm test

bin/update-authors.sh

@@ -2,17 +2,16 @@
 
 # Update AUTHORS.md based on git history.
 
-git log --reverse --format='%aN <%aE>' | perl -we '
+git log --reverse --format='%aN (%aE)' | perl -we '
 BEGIN {
   %seen = (), @authors = ();
 }
 while (<>) {
   next if $seen{$_};
-  next if /<support\@greenkeeper.io>/;
-  next if /<ungoldman\@gmail.com>/;
-  next if /<grunjol\@users.noreply.github.com>/;
-  next if /<dc\@DCs-MacBook.local>/;
-  next if /<rolandoguedes\@gmail.com>/;
+  next if /(support\@greenkeeper.io)/;
+  next if /(ungoldman\@gmail.com)/;
+  next if /(dc\@DCs-MacBook.local)/;
+  next if /(rolandoguedes\@gmail.com)/;
   $seen{$_} = push @authors, "- ", $_;
 }
 END {

config.js

@@ -1,80 +0,0 @@
-var appConfig = require('application-config')('WebTorrent')
-var fs = require('fs')
-var path = require('path')
-
-var APP_NAME = 'WebTorrent'
-var APP_TEAM = 'The WebTorrent Project'
-var APP_VERSION = require('./package.json').version
-
-var PORTABLE_PATH = path.join(path.dirname(process.execPath), 'Portable Settings')
-
-module.exports = {
-  APP_COPYRIGHT: 'Copyright © 2014-2016 ' + APP_TEAM,
-  APP_FILE_ICON: path.join(__dirname, 'static', 'WebTorrentFile'),
-  APP_ICON: path.join(__dirname, 'static', 'WebTorrent'),
-  APP_NAME: APP_NAME,
-  APP_TEAM: APP_TEAM,
-  APP_VERSION: APP_VERSION,
-  APP_WINDOW_TITLE: APP_NAME + ' (BETA)',
-
-  AUTO_UPDATE_URL: 'https://webtorrent.io/desktop/update' +
-    '?version=' + APP_VERSION + '&platform=' + process.platform,
-
-  CRASH_REPORT_URL: 'https://webtorrent.io/desktop/crash-report',
-
-  CONFIG_PATH: getConfigPath(),
-  CONFIG_POSTER_PATH: path.join(getConfigPath(), 'Posters'),
-  CONFIG_TORRENT_PATH: path.join(getConfigPath(), 'Torrents'),
-
-  DELAYED_INIT: 3000 /* 3 seconds */,
-
-  GITHUB_URL: 'https://github.com/feross/webtorrent-desktop',
-  GITHUB_URL_ISSUES: 'https://github.com/feross/webtorrent-desktop/issues',
-  GITHUB_URL_RAW: 'https://raw.githubusercontent.com/feross/webtorrent-desktop/master',
-
-  HOME_PAGE_URL: 'https://webtorrent.io',
-
-  IS_PORTABLE: isPortable(),
-  IS_PRODUCTION: isProduction(),
-
-  ROOT_PATH: __dirname,
-  STATIC_PATH: path.join(__dirname, 'static'),
-
-  WINDOW_ABOUT: 'file://' + path.join(__dirname, 'renderer', 'about.html'),
-  WINDOW_MAIN: 'file://' + path.join(__dirname, 'renderer', 'main.html'),
-  WINDOW_WEBTORRENT: 'file://' + path.join(__dirname, 'renderer', 'webtorrent.html'),
-
-  WINDOW_MIN_HEIGHT: 38 + (120 * 2), // header height + 2 torrents
-  WINDOW_MIN_WIDTH: 425
-}
-
-function getConfigPath () {
-  if (isPortable()) {
-    return PORTABLE_PATH
-  } else {
-    return path.dirname(appConfig.filePath)
-  }
-}
-
-function isPortable () {
-  try {
-    return process.platform === 'win32' && isProduction() && !!fs.statSync(PORTABLE_PATH)
-  } catch (err) {
-    return false
-  }
-}
-
-function isProduction () {
-  if (!process.versions.electron) {
-    return false
-  }
-  if (process.platform === 'darwin') {
-    return !/\/Electron\.app\//.test(process.execPath)
-  }
-  if (process.platform === 'win32') {
-    return !/\\electron\.exe$/.test(process.execPath)
-  }
-  if (process.platform === 'linux') {
-    return !/\/electron$/.test(process.execPath)
-  }
-}

index.js

@@ -1 +1 @@
-require('./main')
+require('./build/main')

main/ipc.js

@@ -1,249 +0,0 @@
-module.exports = {
-  init
-}
-
-var electron = require('electron')
-
-var app = electron.app
-var ipcMain = electron.ipcMain
-
-var log = require('./log')
-var menu = require('./menu')
-var windows = require('./windows')
-var shortcuts = require('./shortcuts')
-var vlc = require('./vlc')
-
-// has to be a number, not a boolean, and undefined throws an error
-var powerSaveBlockerId = 0
-
-// messages from the main process, to be sent once the WebTorrent process starts
-var messageQueueMainToWebTorrent = []
-
-// holds a ChildProcess while we're playing a video in VLC, null otherwise
-var vlcProcess
-
-function init () {
-  ipcMain.on('ipcReady', function (e) {
-    windows.main.show()
-    app.ipcReady = true
-    app.emit('ipcReady')
-  })
-
-  ipcMain.on('ipcReadyWebTorrent', function (e) {
-    app.ipcReadyWebTorrent = true
-    log('sending %d queued messages from the main win to the webtorrent window',
-      messageQueueMainToWebTorrent.length)
-    messageQueueMainToWebTorrent.forEach(function (message) {
-      windows.webtorrent.send(message.name, ...message.args)
-      log('webtorrent: sent queued %s', message.name)
-    })
-  })
-
-  ipcMain.on('showOpenTorrentFile', menu.showOpenTorrentFile)
-
-  ipcMain.on('setBounds', function (e, bounds, maximize) {
-    setBounds(bounds, maximize)
-  })
-
-  ipcMain.on('setAspectRatio', function (e, aspectRatio) {
-    setAspectRatio(aspectRatio)
-  })
-
-  ipcMain.on('setBadge', function (e, text) {
-    setBadge(text)
-  })
-
-  ipcMain.on('setProgress', function (e, progress) {
-    setProgress(progress)
-  })
-
-  ipcMain.on('toggleFullScreen', function (e, flag) {
-    menu.toggleFullScreen(flag)
-  })
-
-  ipcMain.on('setTitle', function (e, title) {
-    windows.main.setTitle(title)
-  })
-
-  ipcMain.on('openItem', function (e, path) {
-    log('open item: ' + path)
-    electron.shell.openItem(path)
-  })
-
-  ipcMain.on('showItemInFolder', function (e, path) {
-    log('show item in folder: ' + path)
-    electron.shell.showItemInFolder(path)
-  })
-
-  ipcMain.on('blockPowerSave', blockPowerSave)
-
-  ipcMain.on('unblockPowerSave', unblockPowerSave)
-
-  ipcMain.on('onPlayerOpen', function () {
-    menu.onPlayerOpen()
-    shortcuts.onPlayerOpen()
-  })
-
-  ipcMain.on('onPlayerClose', function () {
-    menu.onPlayerClose()
-    shortcuts.onPlayerOpen()
-  })
-
-  ipcMain.on('focusWindow', function (e, windowName) {
-    windows.focusWindow(windows[windowName])
-  })
-
-  ipcMain.on('downloadFinished', function (e, filePath) {
-    if (app.dock) {
-      // Bounces the Downloads stack if the filePath is inside the Downloads folder.
-      app.dock.downloadFinished(filePath)
-    }
-  })
-
-  ipcMain.on('checkForVLC', function (e) {
-    vlc.checkForVLC(function (isInstalled) {
-      windows.main.send('checkForVLC', isInstalled)
-    })
-  })
-
-  ipcMain.on('vlcPlay', function (e, url) {
-    var args = ['--play-and-exit', '--quiet', url]
-    console.log('Running vlc ' + args.join(' '))
-
-    vlc.spawn(args, function (err, proc) {
-      if (err) windows.main.send('dispatch', 'vlcNotFound')
-      vlcProcess = proc
-
-      // If it works, close the modal after a second
-      var closeModalTimeout = setTimeout(() =>
-        windows.main.send('dispatch', 'exitModal'), 1000)
-
-      vlcProcess.on('close', function (code) {
-        clearTimeout(closeModalTimeout)
-        if (!vlcProcess) return // Killed
-        console.log('VLC exited with code ', code)
-        if (code === 0) {
-          windows.main.send('dispatch', 'backToList')
-        } else {
-          windows.main.send('dispatch', 'vlcNotFound')
-        }
-        vlcProcess = null
-      })
-
-      vlcProcess.on('error', function (e) {
-        console.log('VLC error', e)
-      })
-    })
-  })
-
-  ipcMain.on('vlcQuit', function () {
-    if (!vlcProcess) return
-    console.log('Killing VLC, pid ' + vlcProcess.pid)
-    vlcProcess.kill('SIGKILL') // kill -9
-    vlcProcess = null
-  })
-
-  // Capture all events
-  var oldEmit = ipcMain.emit
-  ipcMain.emit = function (name, e, ...args) {
-    // Relay messages between the main window and the WebTorrent hidden window
-    if (name.startsWith('wt-') && !app.isQuitting) {
-      if (e.sender.browserWindowOptions.title === 'webtorrent-hidden-window') {
-        // Send message to main window
-        windows.main.send(name, ...args)
-        log('webtorrent: got %s', name)
-      } else if (app.ipcReadyWebTorrent) {
-        // Send message to webtorrent window
-        windows.webtorrent.send(name, ...args)
-        log('webtorrent: sent %s', name)
-      } else {
-        // Queue message for webtorrent window, it hasn't finished loading yet
-        messageQueueMainToWebTorrent.push({
-          name: name,
-          args: args
-        })
-        log('webtorrent: queueing %s', name)
-      }
-      return
-    }
-
-    // Emit all other events normally
-    oldEmit.call(ipcMain, name, e, ...args)
-  }
-}
-
-function setBounds (bounds, maximize) {
-  // Do nothing in fullscreen
-  if (!windows.main || windows.main.isFullScreen()) {
-    log('setBounds: not setting bounds because we\'re in full screen')
-    return
-  }
-
-  // Maximize or minimize, if the second argument is present
-  var willBeMaximized
-  if (maximize === true) {
-    if (!windows.main.isMaximized()) {
-      log('setBounds: maximizing')
-      windows.main.maximize()
-    }
-    willBeMaximized = true
-  } else if (maximize === false) {
-    if (windows.main.isMaximized()) {
-      log('setBounds: unmaximizing')
-      windows.main.unmaximize()
-    }
-    willBeMaximized = false
-  } else {
-    willBeMaximized = windows.main.isMaximized()
-  }
-
-  // Assuming we're not maximized or maximizing, set the window size
-  if (!willBeMaximized) {
-    log('setBounds: setting bounds to ' + JSON.stringify(bounds))
-    if (bounds.x === null && bounds.y === null) {
-      // X and Y not specified? By default, center on current screen
-      var scr = electron.screen.getDisplayMatching(windows.main.getBounds())
-      bounds.x = Math.round(scr.bounds.x + scr.bounds.width / 2 - bounds.width / 2)
-      bounds.y = Math.round(scr.bounds.y + scr.bounds.height / 2 - bounds.height / 2)
-      log('setBounds: centered to ' + JSON.stringify(bounds))
-    }
-    windows.main.setBounds(bounds, true)
-  } else {
-    log('setBounds: not setting bounds because of window maximization')
-  }
-}
-
-function setAspectRatio (aspectRatio) {
-  log('setAspectRatio %o', aspectRatio)
-  if (windows.main) {
-    windows.main.setAspectRatio(aspectRatio)
-  }
-}
-
-// Display string in dock badging area (OS X)
-function setBadge (text) {
-  log('setBadge %s', text)
-  if (app.dock) {
-    app.dock.setBadge(String(text))
-  }
-}
-
-// Show progress bar. Valid range is [0, 1]. Remove when < 0; indeterminate when > 1.
-function setProgress (progress) {
-  log('setProgress %s', progress)
-  if (windows.main) {
-    windows.main.setProgressBar(progress)
-  }
-}
-
-function blockPowerSave () {
-  powerSaveBlockerId = electron.powerSaveBlocker.start('prevent-display-sleep')
-  log('blockPowerSave %d', powerSaveBlockerId)
-}
-
-function unblockPowerSave () {
-  if (electron.powerSaveBlocker.isStarted(powerSaveBlockerId)) {
-    electron.powerSaveBlocker.stop(powerSaveBlockerId)
-    log('unblockPowerSave %d', powerSaveBlockerId)
-  }
-}

main/menu.js

@@ -1,456 +0,0 @@
-module.exports = {
-  init,
-  onPlayerClose,
-  onPlayerOpen,
-  onToggleFullScreen,
-  onWindowHide,
-  onWindowShow,
-
-  // TODO: move these out of menu.js -- they don't belong here
-  showOpenSeedFiles,
-  showOpenTorrentAddress,
-  showOpenTorrentFile,
-  toggleFullScreen
-}
-
-var electron = require('electron')
-
-var app = electron.app
-
-var config = require('../config')
-var log = require('./log')
-var windows = require('./windows')
-
-var appMenu
-
-function init () {
-  appMenu = electron.Menu.buildFromTemplate(getAppMenuTemplate())
-  electron.Menu.setApplicationMenu(appMenu)
-
-  if (app.dock) {
-    var dockMenu = electron.Menu.buildFromTemplate(getDockMenuTemplate())
-    app.dock.setMenu(dockMenu)
-  }
-}
-
-function toggleFullScreen (flag) {
-  log('toggleFullScreen %s', flag)
-  if (windows.main && windows.main.isVisible()) {
-    flag = flag != null ? flag : !windows.main.isFullScreen()
-    if (flag) {
-      // Allows the window to use the full screen in fullscreen mode (OS X).
-      windows.main.setAspectRatio(0)
-    }
-    windows.main.setFullScreen(flag)
-  }
-}
-
-// Sets whether the window should always show on top of other windows
-function toggleFloatOnTop (flag) {
-  log('toggleFloatOnTop %s', flag)
-  if (windows.main) {
-    flag = flag != null ? flag : !windows.main.isAlwaysOnTop()
-    windows.main.setAlwaysOnTop(flag)
-    getMenuItem('Float on Top').checked = flag
-  }
-}
-
-function toggleDevTools () {
-  log('toggleDevTools')
-  if (windows.main) {
-    windows.main.toggleDevTools()
-  }
-}
-
-function showWebTorrentWindow () {
-  log('showWebTorrentWindow')
-  windows.webtorrent.show()
-  windows.webtorrent.webContents.openDevTools({ detach: true })
-}
-
-function playPause () {
-  if (windows.main) {
-    windows.main.send('dispatch', 'playPause')
-  }
-}
-
-function increaseVolume () {
-  if (windows.main) {
-    windows.main.send('dispatch', 'changeVolume', 0.1)
-  }
-}
-
-function decreaseVolume () {
-  if (windows.main) {
-    windows.main.send('dispatch', 'changeVolume', -0.1)
-  }
-}
-
-function openSubtitles () {
-  if (windows.main) {
-    windows.main.send('dispatch', 'openSubtitles')
-  }
-}
-
-function onWindowShow () {
-  log('onWindowShow')
-  getMenuItem('Full Screen').enabled = true
-  getMenuItem('Float on Top').enabled = true
-}
-
-function onWindowHide () {
-  log('onWindowHide')
-  getMenuItem('Full Screen').enabled = false
-  getMenuItem('Float on Top').enabled = false
-}
-
-function onPlayerOpen () {
-  log('onPlayerOpen')
-  getMenuItem('Play/Pause').enabled = true
-  getMenuItem('Increase Volume').enabled = true
-  getMenuItem('Decrease Volume').enabled = true
-  getMenuItem('Add Subtitles File...').enabled = true
-}
-
-function onPlayerClose () {
-  log('onPlayerClose')
-  getMenuItem('Play/Pause').enabled = false
-  getMenuItem('Increase Volume').enabled = false
-  getMenuItem('Decrease Volume').enabled = false
-  getMenuItem('Add Subtitles File...').enabled = false
-}
-
-function onToggleFullScreen (isFullScreen) {
-  isFullScreen = isFullScreen != null ? isFullScreen : windows.main.isFullScreen()
-  windows.main.setMenuBarVisibility(!isFullScreen)
-  getMenuItem('Full Screen').checked = isFullScreen
-  windows.main.send('fullscreenChanged', isFullScreen)
-}
-
-function getMenuItem (label) {
-  for (var i = 0; i < appMenu.items.length; i++) {
-    var menuItem = appMenu.items[i].submenu.items.find(function (item) {
-      return item.label === label
-    })
-    if (menuItem) return menuItem
-  }
-}
-
-// Prompts the user for a file, then creates a torrent. Only allows a single file
-// selection.
-function showOpenSeedFile () {
-  electron.dialog.showOpenDialog({
-    title: 'Select a file for the torrent file.',
-    properties: [ 'openFile' ]
-  }, function (selectedPaths) {
-    if (!Array.isArray(selectedPaths)) return
-    var selectedPath = selectedPaths[0]
-    windows.main.send('dispatch', 'showCreateTorrent', selectedPath)
-  })
-}
-
-// Prompts the user for a file or directory, then creates a torrent. Only allows a single
-// selection. To create a multi-file torrent, the user must select a directory.
-function showOpenSeedFiles () {
-  electron.dialog.showOpenDialog({
-    title: 'Select a file or folder for the torrent file.',
-    properties: [ 'openFile', 'openDirectory' ]
-  }, function (selectedPaths) {
-    if (!Array.isArray(selectedPaths)) return
-    var selectedPath = selectedPaths[0]
-    windows.main.send('dispatch', 'showCreateTorrent', selectedPath)
-  })
-}
-
-// Prompts the user to choose a torrent file, then adds it to the app
-function showOpenTorrentFile () {
-  electron.dialog.showOpenDialog(windows.main, {
-    title: 'Select a .torrent file to open.',
-    filters: [{ name: 'Torrent Files', extensions: ['torrent'] }],
-    properties: [ 'openFile', 'multiSelections' ]
-  }, function (selectedPaths) {
-    if (!Array.isArray(selectedPaths)) return
-    selectedPaths.forEach(function (selectedPath) {
-      windows.main.send('dispatch', 'addTorrent', selectedPath)
-    })
-  })
-}
-
-// Prompts the user for the URL of a torrent file, then downloads and adds it
-function showOpenTorrentAddress () {
-  windows.main.send('showOpenTorrentAddress')
-}
-
-function getAppMenuTemplate () {
-  var template = [
-    {
-      label: 'File',
-      submenu: [
-        {
-          label: process.platform === 'darwin'
-            ? 'Create New Torrent...'
-            : 'Create New Torrent from Folder...',
-          accelerator: 'CmdOrCtrl+N',
-          click: showOpenSeedFiles
-        },
-        {
-          label: 'Open Torrent File...',
-          accelerator: 'CmdOrCtrl+O',
-          click: showOpenTorrentFile
-        },
-        {
-          label: 'Open Torrent Address...',
-          accelerator: 'CmdOrCtrl+U',
-          click: showOpenTorrentAddress
-        },
-        {
-          type: 'separator'
-        },
-        {
-          label: process.platform === 'win32'
-            ? 'Close'
-            : 'Close Window',
-          accelerator: 'CmdOrCtrl+W',
-          role: 'close'
-        }
-      ]
-    },
-    {
-      label: 'Edit',
-      submenu: [
-        {
-          label: 'Cut',
-          accelerator: 'CmdOrCtrl+X',
-          role: 'cut'
-        },
-        {
-          label: 'Copy',
-          accelerator: 'CmdOrCtrl+C',
-          role: 'copy'
-        },
-        {
-          label: 'Paste Torrent Address',
-          accelerator: 'CmdOrCtrl+V',
-          role: 'paste'
-        },
-        {
-          label: 'Select All',
-          accelerator: 'CmdOrCtrl+A',
-          role: 'selectall'
-        }
-      ]
-    },
-    {
-      label: 'View',
-      submenu: [
-        {
-          label: 'Full Screen',
-          type: 'checkbox',
-          accelerator: process.platform === 'darwin'
-            ? 'Ctrl+Command+F'
-            : 'F11',
-          click: () => toggleFullScreen()
-        },
-        {
-          label: 'Float on Top',
-          type: 'checkbox',
-          click: () => toggleFloatOnTop()
-        },
-        {
-          type: 'separator'
-        },
-        {
-          label: 'Developer',
-          submenu: [
-            {
-              label: 'Developer Tools',
-              accelerator: process.platform === 'darwin'
-                ? 'Alt+Command+I'
-                : 'Ctrl+Shift+I',
-              click: toggleDevTools
-            },
-            {
-              label: 'Show WebTorrent Process',
-              accelerator: process.platform === 'darwin'
-                ? 'Alt+Command+P'
-                : 'Ctrl+Shift+P',
-              click: showWebTorrentWindow
-            }
-          ]
-        }
-      ]
-    },
-    {
-      label: 'Playback',
-      submenu: [
-        {
-          label: 'Play/Pause',
-          accelerator: 'CmdOrCtrl+P',
-          click: playPause,
-          enabled: false
-        },
-        {
-          type: 'separator'
-        },
-        {
-          label: 'Increase Volume',
-          accelerator: 'CmdOrCtrl+Up',
-          click: increaseVolume,
-          enabled: false
-        },
-        {
-          label: 'Decrease Volume',
-          accelerator: 'CmdOrCtrl+Down',
-          click: decreaseVolume,
-          enabled: false
-        },
-        {
-          type: 'separator'
-        },
-        {
-          label: 'Add Subtitles File...',
-          click: openSubtitles,
-          enabled: false
-        }
-      ]
-    },
-    {
-      label: 'Help',
-      role: 'help',
-      submenu: [
-        {
-          label: 'Learn more about ' + config.APP_NAME,
-          click: () => electron.shell.openExternal(config.HOME_PAGE_URL)
-        },
-        {
-          label: 'Contribute on GitHub',
-          click: () => electron.shell.openExternal(config.GITHUB_URL)
-        },
-        {
-          type: 'separator'
-        },
-        {
-          label: 'Report an Issue...',
-          click: () => electron.shell.openExternal(config.GITHUB_URL_ISSUES)
-        }
-      ]
-    }
-  ]
-
-  if (process.platform === 'darwin') {
-    // Add WebTorrent app menu (OS X)
-    template.unshift({
-      label: config.APP_NAME,
-      submenu: [
-        {
-          label: 'About ' + config.APP_NAME,
-          role: 'about'
-        },
-        {
-          type: 'separator'
-        },
-        {
-          label: 'Services',
-          role: 'services',
-          submenu: []
-        },
-        {
-          type: 'separator'
-        },
-        {
-          label: 'Hide ' + config.APP_NAME,
-          accelerator: 'Command+H',
-          role: 'hide'
-        },
-        {
-          label: 'Hide Others',
-          accelerator: 'Command+Alt+H',
-          role: 'hideothers'
-        },
-        {
-          label: 'Show All',
-          role: 'unhide'
-        },
-        {
-          type: 'separator'
-        },
-        {
-          label: 'Quit',
-          accelerator: 'Command+Q',
-          click: () => app.quit()
-        }
-      ]
-    })
-
-    // Add Window menu (OS X)
-    template.splice(5, 0, {
-      label: 'Window',
-      role: 'window',
-      submenu: [
-        {
-          label: 'Minimize',
-          accelerator: 'CmdOrCtrl+M',
-          role: 'minimize'
-        },
-        {
-          type: 'separator'
-        },
-        {
-          label: 'Bring All to Front',
-          role: 'front'
-        }
-      ]
-    })
-  }
-
-  // In Linux and Windows it is not possible to open both folders and files
-  if (process.platform === 'linux' || process.platform === 'win32') {
-    // File menu (Windows, Linux)
-    template[0].submenu.unshift({
-      label: 'Create New Torrent from File...',
-      click: showOpenSeedFile
-    })
-
-    // Help menu (Windows, Linux)
-    template[4].submenu.push(
-      {
-        type: 'separator'
-      },
-      {
-        label: 'About ' + config.APP_NAME,
-        click: windows.createAboutWindow
-      }
-    )
-  }
-  // Add "File > Quit" menu item so Linux distros where the system tray icon is missing
-  // will have a way to quit the app.
-  if (process.platform === 'linux') {
-    // File menu (Linux)
-    template[0].submenu.push({
-      label: 'Quit',
-      click: () => app.quit()
-    })
-  }
-
-  return template
-}
-
-function getDockMenuTemplate () {
-  return [
-    {
-      label: 'Create New Torrent...',
-      accelerator: 'CmdOrCtrl+N',
-      click: showOpenSeedFiles
-    },
-    {
-      label: 'Open Torrent File...',
-      accelerator: 'CmdOrCtrl+O',
-      click: showOpenTorrentFile
-    },
-    {
-      label: 'Open Torrent Address...',
-      accelerator: 'CmdOrCtrl+U',
-      click: showOpenTorrentAddress
-    }
-  ]
-}

main/shortcuts.js

@@ -1,34 +0,0 @@
-module.exports = {
-  init,
-  onPlayerClose,
-  onPlayerOpen
-}
-
-var electron = require('electron')
-
-var menu = require('./menu')
-var windows = require('./windows')
-
-function init () {
-  var localShortcut = require('electron-localshortcut')
-
-  // Alternate shortcuts. Most shortcuts are registered in menu,js, but Electron
-  // does not support multiple shortcuts for a single menu item.
-  localShortcut.register('CmdOrCtrl+Shift+F', menu.toggleFullScreen)
-  localShortcut.register('Space', () => windows.main.send('dispatch', 'playPause'))
-
-  // Hidden shortcuts, i.e. not shown in the menu
-  localShortcut.register('Esc', () => windows.main.send('dispatch', 'escapeBack'))
-}
-
-function onPlayerOpen () {
-  // Register special "media key" for play/pause, available on some keyboards
-  electron.globalShortcut.register(
-    'MediaPlayPause',
-    () => windows.main.send('dispatch', 'playPause')
-  )
-}
-
-function onPlayerClose () {
-  electron.globalShortcut.unregister('MediaPlayPause')
-}

main/tray.js

@@ -1,81 +0,0 @@
-module.exports = {
-  init,
-  hasTray
-}
-
-var cp = require('child_process')
-var path = require('path')
-var electron = require('electron')
-
-var app = electron.app
-
-var windows = require('./windows')
-
-var trayIcon
-
-function init () {
-  // OS X has no tray icon
-  if (process.platform === 'darwin') return
-
-  // On Linux, asynchronously check for libappindicator1
-  if (process.platform === 'linux') {
-    checkLinuxTraySupport(function (supportsTray) {
-      if (supportsTray) createTrayIcon()
-    })
-  }
-
-  // Windows always supports minimize-to-tray
-  if (process.platform === 'win32') createTrayIcon()
-}
-
-function hasTray () {
-  return !!trayIcon
-}
-
-function createTrayIcon () {
-  trayIcon = new electron.Tray(path.join(__dirname, '..', 'static', 'WebTorrentSmall.png'))
-
-  // On Windows, left click to open the app, right click for context menu
-  // On Linux, any click (right or left) opens the context menu
-  trayIcon.on('click', showApp)
-
-  // Show the tray context menu, and keep the available commands up to date
-  updateTrayMenu()
-  windows.main.on('show', updateTrayMenu)
-  windows.main.on('hide', updateTrayMenu)
-}
-
-function checkLinuxTraySupport (cb) {
-  // Check that we're on Ubuntu (or another debian system) and that we have
-  // libappindicator1. If WebTorrent was installed from the deb file, we should
-  // always have it. If it was installed from the zip file, we might not.
-  cp.exec('dpkg --get-selections libappindicator1', function (err, stdout) {
-    if (err) return cb(false)
-    // Unfortunately there's no cleaner way, as far as I can tell, to check
-    // whether a debian package is installed:
-    cb(stdout.endsWith('\tinstall\n'))
-  })
-}
-
-function updateTrayMenu () {
-  var showHideMenuItem
-  if (windows.main.isVisible()) {
-    showHideMenuItem = { label: 'Hide to tray', click: hideApp }
-  } else {
-    showHideMenuItem = { label: 'Show', click: showApp }
-  }
-  var contextMenu = electron.Menu.buildFromTemplate([
-    showHideMenuItem,
-    { label: 'Quit', click: () => app.quit() }
-  ])
-  trayIcon.setContextMenu(contextMenu)
-}
-
-function showApp () {
-  windows.main.show()
-}
-
-function hideApp () {
-  windows.main.hide()
-  windows.main.send('dispatch', 'backToList')
-}

main/windows.js

@@ -1,139 +0,0 @@
-var windows = module.exports = {
-  about: null,
-  main: null,
-  createAboutWindow,
-  createWebTorrentHiddenWindow,
-  createMainWindow,
-  focusWindow
-}
-
-var electron = require('electron')
-
-var app = electron.app
-
-var config = require('../config')
-var menu = require('./menu')
-var tray = require('./tray')
-
-function createAboutWindow () {
-  if (windows.about) {
-    return focusWindow(windows.about)
-  }
-  var win = windows.about = new electron.BrowserWindow({
-    backgroundColor: '#ECECEC',
-    show: false,
-    center: true,
-    resizable: false,
-    icon: config.APP_ICON + '.png',
-    title: process.platform !== 'darwin'
-      ? 'About ' + config.APP_WINDOW_TITLE
-      : '',
-    useContentSize: true, // Specify web page size without OS chrome
-    width: 300,
-    height: 170,
-    minimizable: false,
-    maximizable: false,
-    fullscreen: false,
-    skipTaskbar: true
-  })
-  win.loadURL(config.WINDOW_ABOUT)
-
-  // No window menu
-  win.setMenu(null)
-
-  win.webContents.on('did-finish-load', function () {
-    win.show()
-  })
-
-  win.once('closed', function () {
-    windows.about = null
-  })
-}
-
-function createWebTorrentHiddenWindow () {
-  var win = windows.webtorrent = new electron.BrowserWindow({
-    backgroundColor: '#1E1E1E',
-    show: false,
-    center: true,
-    title: 'webtorrent-hidden-window',
-    useContentSize: true,
-    width: 150,
-    height: 150,
-    minimizable: false,
-    maximizable: false,
-    resizable: false,
-    fullscreenable: false,
-    fullscreen: false,
-    skipTaskbar: true
-  })
-  win.loadURL(config.WINDOW_WEBTORRENT)
-
-  // Prevent killing the WebTorrent process
-  win.on('close', function (e) {
-    if (!app.isQuitting) {
-      e.preventDefault()
-      win.hide()
-    }
-  })
-
-  win.once('closed', function () {
-    windows.webtorrent = null
-  })
-}
-
-var HEADER_HEIGHT = 37
-var TORRENT_HEIGHT = 100
-
-function createMainWindow () {
-  if (windows.main) {
-    return focusWindow(windows.main)
-  }
-  var win = windows.main = new electron.BrowserWindow({
-    backgroundColor: '#1E1E1E',
-    darkTheme: true, // Forces dark theme (GTK+3)
-    icon: config.APP_ICON + 'Smaller.png', // Window and Volume Mixer icon.
-    minWidth: config.WINDOW_MIN_WIDTH,
-    minHeight: config.WINDOW_MIN_HEIGHT,
-    show: false, // Hide window until renderer sends 'ipcReady' event
-    title: config.APP_WINDOW_TITLE,
-    titleBarStyle: 'hidden-inset', // Hide OS chrome, except traffic light buttons (OS X)
-    useContentSize: true, // Specify web page size without OS chrome
-    width: 500,
-    height: HEADER_HEIGHT + (TORRENT_HEIGHT * 6) // header height + 5 torrents
-  })
-  win.loadURL(config.WINDOW_MAIN)
-  if (process.platform === 'darwin') {
-    win.setSheetOffset(HEADER_HEIGHT)
-  }
-
-  win.webContents.on('dom-ready', function () {
-    menu.onToggleFullScreen()
-  })
-
-  win.on('blur', menu.onWindowHide)
-  win.on('focus', menu.onWindowShow)
-
-  win.on('enter-full-screen', () => menu.onToggleFullScreen(true))
-  win.on('leave-full-screen', () => menu.onToggleFullScreen(false))
-
-  win.on('close', function (e) {
-    if (process.platform !== 'darwin' && !tray.hasTray()) {
-      app.quit()
-    } else if (!app.isQuitting) {
-      e.preventDefault()
-      win.hide()
-      win.send('dispatch', 'backToList')
-    }
-  })
-
-  win.once('closed', function () {
-    windows.main = null
-  })
-}
-
-function focusWindow (win) {
-  if (win.isMinimized()) {
-    win.restore()
-  }
-  win.show() // shows and gives focus
-}

package.json

@@ -1,11 +1,11 @@
 {
   "name": "webtorrent-desktop",
-  "description": "WebTorrent, the streaming torrent client. For OS X, Windows, and Linux.",
-  "version": "0.5.0",
+  "description": "WebTorrent, the streaming torrent client. For Mac, Windows, and Linux.",
+  "version": "0.11.0",
   "author": {
-    "name": "Feross Aboukhadijeh",
-    "email": "feross@feross.org",
-    "url": "http://feross.org"
+    "name": "WebTorrent, LLC",
+    "email": "feross@webtorrent.io",
+    "url": "https://webtorrent.io"
   },
   "bin": {
     "webtorrent-desktop": "./bin/cmd.js"
@@ -14,34 +14,40 @@
     "url": "https://github.com/feross/webtorrent-desktop/issues"
   },
   "dependencies": {
-    "airplay-js": "guerrerocarlos/node-airplay-js",
-    "application-config": "^0.2.1",
-    "async": "^2.0.0-rc.5",
+    "airplayer": "^2.0.0",
+    "application-config": "^1.0.0",
     "bitfield": "^1.0.2",
     "chromecasts": "^1.8.0",
-    "concat-stream": "^1.5.1",
     "create-torrent": "^3.24.5",
     "deep-equal": "^1.0.1",
     "dlnacasts": "^0.1.0",
-    "drag-drop": "^2.11.0",
-    "electron-localshortcut": "^0.6.0",
-    "electron-prebuilt": "1.0.2",
-    "fs-extra": "^0.27.0",
-    "hyperx": "^2.0.2",
+    "drag-drop": "^2.12.1",
+    "electron-prebuilt": "1.3.3",
+    "fs-extra": "^0.30.0",
+    "hat": "0.0.3",
     "iso-639-1": "^1.2.1",
     "languagedetect": "^1.1.1",
-    "main-loop": "^3.2.0",
+    "location-history": "^1.0.0",
     "musicmetadata": "^2.0.2",
     "network-address": "^1.1.0",
+    "parse-torrent": "^5.7.3",
     "prettier-bytes": "^1.0.1",
+    "react": "^15.2.1",
+    "react-dom": "^15.2.1",
+    "run-parallel": "^1.1.6",
+    "semver": "^5.1.0",
+    "simple-concat": "^1.0.0",
     "simple-get": "^2.0.0",
     "srt-to-vtt": "^1.1.1",
-    "virtual-dom": "^2.1.1",
     "vlc-command": "^1.0.1",
     "webtorrent": "0.x",
-    "winreg": "^1.2.0"
+    "winreg": "^1.2.0",
+    "zero-fill": "^2.2.3"
   },
   "devDependencies": {
+    "babel-cli": "^6.11.4",
+    "babel-plugin-syntax-jsx": "^6.13.0",
+    "babel-plugin-transform-react-jsx": "^6.8.0",
     "cross-zip": "^2.0.1",
     "electron-osx-sign": "^0.3.0",
     "electron-packager": "^7.0.0",
@@ -49,12 +55,15 @@
     "gh-release": "^2.0.3",
     "minimist": "^1.2.0",
     "mkdirp": "^0.5.1",
-    "nobin-debian-installer": "^0.0.9",
+    "nobin-debian-installer": "^0.0.10",
     "open": "0.0.5",
-    "plist": "^1.2.0",
+    "plist": "^2.0.1",
     "rimraf": "^2.5.2",
     "run-series": "^1.1.4",
-    "standard": "^7.0.0"
+    "standard": "^8.0.0-beta.5"
+  },
+  "engines": {
+    "node": ">=4.0.0"
   },
   "homepage": "https://webtorrent.io",
   "keywords": [
@@ -63,14 +72,14 @@
     "electron-app",
     "hybrid webtorrent client",
     "mad science",
-    "torrent client",
     "torrent",
+    "torrent client",
     "webtorrent"
   ],
   "license": "MIT",
   "main": "index.js",
   "optionalDependencies": {
-    "appdmg": "^0.3.6"
+    "appdmg": "^0.4.3"
   },
   "productName": "WebTorrent",
   "repository": {
@@ -78,10 +87,12 @@
     "url": "git://github.com/feross/webtorrent-desktop.git"
   },
   "scripts": {
+    "build": "babel --quiet src --out-dir build",
     "clean": "node ./bin/clean.js",
     "open-config": "node ./bin/open-config.js",
     "package": "node ./bin/package.js",
-    "start": "electron .",
+    "prepublish": "npm run build",
+    "start": "npm run build && electron .",
     "test": "standard && node ./bin/check-deps.js",
     "update-authors": "./bin/update-authors.sh"
   }

renderer/lib/cast.js

@@ -1,363 +0,0 @@
-// The Cast module talks to Airplay and Chromecast
-// * Modifies state when things change
-// * Starts and stops casting, provides remote video controls
-module.exports = {
-  init,
-  open,
-  close,
-  play,
-  pause,
-  seek,
-  setVolume
-}
-
-var airplay = require('airplay-js')
-var chromecasts = require('chromecasts')()
-var dlnacasts = require('dlnacasts')()
-
-var config = require('../../config')
-
-// App state. Cast modifies state.playing and state.errors in response to events
-var state
-
-// Callback to notify module users when state has changed
-var update
-
-// setInterval() for updating cast status
-var statusInterval = null
-
-// Start looking for cast devices on the local network
-function init (appState, callback) {
-  state = appState
-  update = callback
-
-  // Listen for devices: Chromecast, DLNA and Airplay
-  chromecasts.on('update', function (player) {
-    state.devices.chromecast = chromecastPlayer(player)
-  })
-
-  dlnacasts.on('update', function (player) {
-    state.devices.dlna = dlnaPlayer(player)
-  })
-
-  var browser = airplay.createBrowser()
-  browser.on('deviceOn', function (player) {
-    state.devices.airplay = airplayPlayer(player)
-  }).start()
-}
-
-// chromecast player implementation
-function chromecastPlayer (player) {
-  function addEvents () {
-    player.on('error', function (err) {
-      state.playing.location = 'local'
-      state.errors.push({
-        time: new Date().getTime(),
-        message: 'Could not connect to Chromecast. ' + err.message
-      })
-      update()
-    })
-    player.on('disconnect', function () {
-      state.playing.location = 'local'
-      update()
-    })
-  }
-
-  function open () {
-    var torrentSummary = state.saved.torrents.find((x) => x.infoHash === state.playing.infoHash)
-    player.play(state.server.networkURL, {
-      type: 'video/mp4',
-      title: config.APP_NAME + ' - ' + torrentSummary.name
-    }, function (err) {
-      if (err) {
-        state.playing.location = 'local'
-        state.errors.push({
-          time: new Date().getTime(),
-          message: 'Could not connect to Chromecast. ' + err.message
-        })
-      } else {
-        state.playing.location = 'chromecast'
-      }
-      update()
-    })
-  }
-
-  function play (callback) {
-    player.play(null, null, callback)
-  }
-
-  function pause (callback) {
-    player.pause(callback)
-  }
-
-  function stop (callback) {
-    player.stop(callback)
-  }
-
-  function status () {
-    player.status(function (err, status) {
-      if (err) return console.log('error getting %s status: %o', state.playing.location, err)
-      state.playing.isPaused = status.playerState === 'PAUSED'
-      state.playing.currentTime = status.currentTime
-      state.playing.volume = status.volume.muted ? 0 : status.volume.level
-      update()
-    })
-  }
-
-  function seek (time, callback) {
-    player.seek(time, callback)
-  }
-
-  function volume (volume, callback) {
-    player.volume(volume, callback)
-  }
-
-  addEvents()
-
-  return {
-    player: player,
-    open: open,
-    play: play,
-    pause: pause,
-    stop: stop,
-    status: status,
-    seek: seek,
-    volume: volume
-  }
-}
-
-// airplay player implementation
-function airplayPlayer (player) {
-  function open () {
-    player.play(state.server.networkURL, 0, function (res) {
-      if (res.statusCode !== 200) {
-        state.playing.location = 'local'
-        state.errors.push({
-          time: new Date().getTime(),
-          message: 'Could not connect to AirPlay.'
-        })
-      } else {
-        state.playing.location = 'airplay'
-      }
-      update()
-    })
-  }
-
-  function play (callback) {
-    player.rate(1, callback)
-  }
-
-  function pause (callback) {
-    player.rate(0, callback)
-  }
-
-  function stop (callback) {
-    player.stop(callback)
-  }
-
-  function status () {
-    player.status(function (status) {
-      state.playing.isPaused = status.rate === 0
-      state.playing.currentTime = status.position
-      // TODO: get airplay volume, implementation needed. meanwhile set value in setVolume
-      // According to docs is in [-30 - 0] (db) range
-      // should be converted to [0 - 1] using (val / 30 + 1)
-      update()
-    })
-  }
-
-  function seek (time, callback) {
-    player.scrub(time, callback)
-  }
-
-  function volume (volume, callback) {
-    // TODO remove line below once we can fetch the information in status update
-    state.playing.volume = volume
-    volume = (volume - 1) * 30
-    player.volume(volume, callback)
-  }
-
-  return {
-    player: player,
-    open: open,
-    play: play,
-    pause: pause,
-    stop: stop,
-    status: status,
-    seek: seek,
-    volume: volume
-  }
-}
-
-// DLNA player implementation
-function dlnaPlayer (player) {
-  function addEvents () {
-    player.on('error', function (err) {
-      state.playing.location = 'local'
-      state.errors.push({
-        time: new Date().getTime(),
-        message: 'Could not connect to DLNA. ' + err.message
-      })
-      update()
-    })
-    player.on('disconnect', function () {
-      state.playing.location = 'local'
-      update()
-    })
-  }
-
-  function open () {
-    var torrentSummary = state.saved.torrents.find((x) => x.infoHash === state.playing.infoHash)
-    player.play(state.server.networkURL, {
-      type: 'video/mp4',
-      title: config.APP_NAME + ' - ' + torrentSummary.name,
-      seek: state.playing.currentTime > 10 ? state.playing.currentTime : 0
-    }, function (err) {
-      if (err) {
-        state.playing.location = 'local'
-        state.errors.push({
-          time: new Date().getTime(),
-          message: 'Could not connect to DLNA. ' + err.message
-        })
-      } else {
-        state.playing.location = 'dlna'
-      }
-      update()
-    })
-  }
-
-  function play (callback) {
-    player.play(null, null, callback)
-  }
-
-  function pause (callback) {
-    player.pause(callback)
-  }
-
-  function stop (callback) {
-    player.stop(callback)
-  }
-
-  function status () {
-    player.status(function (err, status) {
-      if (err) return console.log('error getting %s status: %o', state.playing.location, err)
-      state.playing.isPaused = status.playerState === 'PAUSED'
-      state.playing.currentTime = status.currentTime
-      state.playing.volume = status.volume.level
-      update()
-    })
-  }
-
-  function seek (time, callback) {
-    player.seek(time, callback)
-  }
-
-  function volume (volume, callback) {
-    player.volume(volume, function (err) {
-      // quick volume update
-      state.playing.volume = volume
-      callback(err)
-    })
-  }
-
-  addEvents()
-
-  return {
-    player: player,
-    open: open,
-    play: play,
-    pause: pause,
-    stop: stop,
-    status: status,
-    seek: seek,
-    volume: volume
-  }
-}
-
-// Start polling cast device state, whenever we're connected
-function startStatusInterval () {
-  statusInterval = setInterval(function () {
-    var device = getDevice()
-    if (device) {
-      device.status()
-    }
-  }, 1000)
-}
-
-function open (location) {
-  if (state.playing.location !== 'local') {
-    throw new Error('You can\'t connect to ' + location + ' when already connected to another device')
-  }
-
-  state.playing.location = location + '-pending'
-  var device = getDevice(location)
-  if (device) {
-    getDevice(location).open()
-    startStatusInterval()
-  }
-
-  update()
-}
-
-// Stops casting, move video back to local screen
-function close () {
-  var device = getDevice()
-  if (device) {
-    device.stop(stoppedCasting)
-    clearInterval(statusInterval)
-  } else {
-    stoppedCasting()
-  }
-}
-
-function stoppedCasting () {
-  state.playing.location = 'local'
-  state.playing.jumpToTime = state.playing.currentTime
-  update()
-}
-
-function getDevice (location) {
-  if (location && state.devices[location]) {
-    return state.devices[location]
-  } else if (state.playing.location === 'chromecast') {
-    return state.devices.chromecast
-  } else if (state.playing.location === 'airplay') {
-    return state.devices.airplay
-  } else if (state.playing.location === 'dlna') {
-    return state.devices.dlna
-  } else {
-    return null
-  }
-}
-
-function play () {
-  var device = getDevice()
-  if (device) {
-    device.play(castCallback)
-  }
-}
-
-function pause () {
-  var device = getDevice()
-  if (device) {
-    device.pause(castCallback)
-  }
-}
-
-function seek (time) {
-  var device = getDevice()
-  if (device) {
-    device.seek(time, castCallback)
-  }
-}
-
-function setVolume (volume) {
-  var device = getDevice()
-  if (device) {
-    device.volume(volume, castCallback)
-  }
-}
-
-function castCallback () {
-  console.log('%s callback: %o', state.playing.location, arguments)
-}

renderer/lib/dispatcher.js

@@ -1,36 +0,0 @@
-module.exports = {
-  setDispatch,
-  dispatch,
-  dispatcher
-}
-
-// Memoize most of our event handlers, which are functions in the form
-// () => dispatch(<args>)
-// ... this prevents virtual-dom from updating every listener on every update()
-var _dispatchers = {}
-var _dispatch = () => {}
-
-function setDispatch (dispatch) {
-  _dispatch = dispatch
-}
-
-// Get a _memoized event handler that calls dispatch()
-// All args must be JSON-able
-function dispatcher (...args) {
-  var json = JSON.stringify(args)
-  var handler = _dispatchers[json]
-  if (!handler) {
-    handler = _dispatchers[json] = (e) => {
-      // Don't click on whatever is below the button
-      e.stopPropagation()
-      // Don't regisiter clicks on disabled buttons
-      if (e.currentTarget.classList.contains('disabled')) return
-      _dispatch.apply(null, args)
-    }
-  }
-  return handler
-}
-
-function dispatch (...args) {
-  _dispatch.apply(null, args)
-}

renderer/lib/location-history.js

@@ -1,84 +0,0 @@
-module.exports = LocationHistory
-
-function LocationHistory () {
-  if (!new.target) return new LocationHistory()
-  this._history = []
-  this._forward = []
-  this._pending = null
-}
-
-LocationHistory.prototype.go = function (page, cb) {
-  console.log('go', page)
-  this.clearForward()
-  this._go(page, cb)
-}
-
-LocationHistory.prototype._go = function (page, cb) {
-  if (this._pending) return
-  if (page.onbeforeload) {
-    this._pending = page
-    page.onbeforeload((err) => {
-      if (this._pending !== page) return /* navigation was cancelled */
-      this._pending = null
-      if (err) {
-        if (cb) cb(err)
-        return
-      }
-      this._history.push(page)
-      if (cb) cb()
-    })
-  } else {
-    this._history.push(page)
-    if (cb) cb()
-  }
-}
-
-LocationHistory.prototype.back = function (cb) {
-  if (this._history.length <= 1) return
-
-  var page = this._history.pop()
-
-  if (page.onbeforeunload) {
-    // TODO: this is buggy. If the user clicks back twice, then those pages
-    // may end up in _forward in the wrong order depending on which onbeforeunload
-    // call finishes first.
-    page.onbeforeunload(() => {
-      this._forward.push(page)
-      if (cb) cb()
-    })
-  } else {
-    this._forward.push(page)
-    if (cb) cb()
-  }
-}
-
-LocationHistory.prototype.forward = function (cb) {
-  if (this._forward.length === 0) return
-
-  var page = this._forward.pop()
-  this._go(page, cb)
-}
-
-LocationHistory.prototype.clearForward = function () {
-  this._forward = []
-}
-
-LocationHistory.prototype.current = function () {
-  return this._history[this._history.length - 1]
-}
-
-LocationHistory.prototype.hasBack = function () {
-  return this._history.length > 1
-}
-
-LocationHistory.prototype.hasForward = function () {
-  return this._forward.length > 0
-}
-
-LocationHistory.prototype.pending = function () {
-  return this._pending
-}
-
-LocationHistory.prototype.clearPending = function () {
-  this._pending = null
-}

renderer/lib/torrent-player.js

@@ -1,44 +0,0 @@
-module.exports = {
-  isPlayable,
-  isVideo,
-  isAudio,
-  isPlayableTorrent
-}
-
-var path = require('path')
-
-/**
- * Determines whether a file in a torrent is audio/video we can play
- */
-function isPlayable (file) {
-  return isVideo(file) || isAudio(file)
-}
-
-function isVideo (file) {
-  var ext = path.extname(file.name).toLowerCase()
-  return [
-    '.avi',
-    '.m4v',
-    '.mkv',
-    '.mov',
-    '.mp4',
-    '.mpg',
-    '.ogv',
-    '.webm'
-  ].includes(ext)
-}
-
-function isAudio (file) {
-  var ext = path.extname(file.name).toLowerCase()
-  return [
-    '.aac',
-    '.ac3',
-    '.mp3',
-    '.ogg',
-    '.wav'
-  ].includes(ext)
-}
-
-function isPlayableTorrent (torrentSummary) {
-  return torrentSummary.files && torrentSummary.files.some(isPlayable)
-}

renderer/lib/torrent-summary.js

@@ -1,24 +0,0 @@
-module.exports = {
-  getPosterPath,
-  getTorrentPath
-}
-
-var path = require('path')
-var config = require('../../config')
-
-// Expects a torrentSummary
-// Returns an absolute path to the torrent file, or null if unavailable
-function getTorrentPath (torrentSummary) {
-  if (!torrentSummary || !torrentSummary.torrentFileName) return null
-  return path.join(config.CONFIG_TORRENT_PATH, torrentSummary.torrentFileName)
-}
-
-// Expects a torrentSummary
-// Returns an absolute path to the poster image, or null if unavailable
-function getPosterPath (torrentSummary) {
-  if (!torrentSummary || !torrentSummary.posterFileName) return null
-  var posterPath = path.join(config.CONFIG_POSTER_PATH, torrentSummary.posterFileName)
-  // Work around a Chrome bug (reproduced in vanilla Chrome, not just Electron):
-  // Backslashes in URLS in CSS cause bizarre string encoding issues
-  return posterPath.replace(/\\/g, '/')
-}

renderer/main.html

@@ -1,11 +0,0 @@
-<!doctype html>
-<html lang="en">
-  <head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <link rel="stylesheet" href="index.css" charset="utf-8">
-  </head>
-  <body>
-    <script async src="index.js"></script>
-  </body>
-</html>

renderer/state.js

@@ -1,277 +0,0 @@
-var electron = require('electron')
-var path = require('path')
-
-var remote = electron.remote
-
-var config = require('../config')
-var LocationHistory = require('./lib/location-history')
-
-module.exports = {
-  getInitialState,
-  getDefaultPlayState,
-  getDefaultSavedState,
-  getPlayingTorrentSummary
-}
-
-function getInitialState () {
-  return {
-    /*
-     * Temporary state disappears once the program exits.
-     * It can contain complex objects like open connections, etc.
-     */
-    client: null, /* the WebTorrent client */
-    server: null, /* local WebTorrent-to-HTTP server */
-    prev: {}, /* used for state diffing in updateElectron() */
-    location: new LocationHistory(),
-    window: {
-      bounds: null, /* {x, y, width, height } */
-      isFocused: true,
-      isFullScreen: false,
-      title: config.APP_WINDOW_TITLE
-    },
-    selectedInfoHash: null, /* the torrent we've selected to view details. see state.torrents */
-    playing: getDefaultPlayState(), /* the media (audio or video) that we're currently playing */
-    devices: { /* playback devices like Chromecast and AppleTV */
-      airplay: null, /* airplay client. finds and manages AppleTVs */
-      chromecast: null /* chromecast client. finds and manages Chromecasts */
-    },
-    dock: {
-      badge: 0,
-      progress: 0
-    },
-    modal: null, /* modal popover */
-    errors: [], /* user-facing errors */
-    nextTorrentKey: 1, /* identify torrents for IPC between the main and webtorrent windows */
-
-    /*
-     * Saved state is read from and written to a file every time the app runs.
-     * It should be simple and minimal and must be JSON.
-     * It must never contain absolute paths since we have a portable app.
-     *
-     * Config path:
-     *
-     * OS X                 ~/Library/Application Support/WebTorrent/config.json
-     * Linux (XDG)          $XDG_CONFIG_HOME/WebTorrent/config.json
-     * Linux (Legacy)       ~/.config/WebTorrent/config.json
-     * Windows (> Vista)    %LOCALAPPDATA%/WebTorrent/config.json
-     * Windows (XP, 2000)   %USERPROFILE%/Local Settings/Application Data/WebTorrent/config.json
-     *
-     * Also accessible via `require('application-config')('WebTorrent').filePath`
-     */
-    saved: {},
-
-    /*
-     * Getters, for convenience
-     */
-    getPlayingTorrentSummary
-  }
-}
-
-/* Whenever we stop playing video or audio, here's what we reset state.playing to */
-function getDefaultPlayState () {
-  return {
-    infoHash: null, /* the info hash of the torrent we're playing */
-    fileIndex: null, /* the zero-based index within the torrent */
-    location: 'local', /* 'local', 'chromecast', 'airplay' */
-    type: null, /* 'audio' or 'video', could be 'other' if ever support eg streaming to VLC */
-    currentTime: 0, /* seconds */
-    duration: 1, /* seconds */
-    isPaused: true,
-    isStalled: false,
-    lastTimeUpdate: 0, /* Unix time in ms */
-    mouseStationarySince: 0, /* Unix time in ms */
-    subtitles: {
-      tracks: [], /* subtitle tracks, each {label, language, ...} */
-      selectedIndex: -1, /* current subtitle track */
-      showMenu: false /* popover menu, above the video */
-    },
-    aspectRatio: 0 /* aspect ratio of the video */
-  }
-}
-
-/* If the saved state file doesn't exist yet, here's what we use instead */
-function getDefaultSavedState () {
-  return {
-    version: 1, /* make sure we can upgrade gracefully later */
-    torrents: [
-      {
-        status: 'paused',
-        infoHash: '88594aaacbde40ef3e2510c47374ec0aa396c08e',
-        magnetURI: 'magnet:?xt=urn:btih:88594aaacbde40ef3e2510c47374ec0aa396c08e&dn=bbb_sunflower_1080p_30fps_normal.mp4&tr=udp%3A%2F%2Ftracker.openbittorrent.com%3A80%2Fannounce&tr=udp%3A%2F%2Ftracker.publicbt.com%3A80%2Fannounce&tr=wss%3A%2F%2Ftracker.btorrent.xyz&tr=wss%3A%2F%2Ftracker.fastcast.nz&tr=wss%3A%2F%2Ftracker.openwebtorrent.com&tr=wss%3A%2F%2Ftracker.webtorrent.io&ws=http%3A%2F%2Fdistribution.bbb3d.renderfarming.net%2Fvideo%2Fmp4%2Fbbb_sunflower_1080p_30fps_normal.mp4',
-        displayName: 'Big Buck Bunny',
-        posterURL: 'bigBuckBunny.jpg',
-        torrentPath: 'bigBuckBunny.torrent',
-        files: [
-          {
-            length: 276134947,
-            name: 'bbb_sunflower_1080p_30fps_normal.mp4'
-          }
-        ]
-      },
-      {
-        status: 'paused',
-        infoHash: '6a9759bffd5c0af65319979fb7832189f4f3c35d',
-        magnetURI: 'magnet:?xt=urn:btih:6a9759bffd5c0af65319979fb7832189f4f3c35d&dn=sintel.mp4&tr=udp%3A%2F%2Fexodus.desync.com%3A6969&tr=udp%3A%2F%2Ftracker.coppersurfer.tk%3A6969&tr=udp%3A%2F%2Ftracker.internetwarriors.net%3A1337&tr=udp%3A%2F%2Ftracker.leechers-paradise.org%3A6969&tr=udp%3A%2F%2Ftracker.openbittorrent.com%3A80&tr=wss%3A%2F%2Ftracker.btorrent.xyz&tr=wss%3A%2F%2Ftracker.fastcast.nz&tr=wss%3A%2F%2Ftracker.openwebtorrent.com&tr=wss%3A%2F%2Ftracker.webtorrent.io&ws=https%3A%2F%2Fwebtorrent.io%2Ftorrents%2Fsintel-1024-surround.mp4',
-        displayName: 'Sintel',
-        posterURL: 'sintel.jpg',
-        torrentPath: 'sintel.torrent',
-        files: [
-          {
-            length: 129241752,
-            name: 'sintel.mp4'
-          }
-        ]
-      },
-      {
-        status: 'paused',
-        infoHash: '02767050e0be2fd4db9a2ad6c12416ac806ed6ed',
-        magnetURI: 'magnet:?xt=urn:btih:02767050e0be2fd4db9a2ad6c12416ac806ed6ed&dn=tears_of_steel_1080p.webm&tr=wss%3A%2F%2Ftracker.btorrent.xyz&tr=wss%3A%2F%2Ftracker.fastcast.nz&tr=wss%3A%2F%2Ftracker.openwebtorrent.com&tr=wss%3A%2F%2Ftracker.webtorrent.io',
-        displayName: 'Tears of Steel',
-        posterURL: 'tearsOfSteel.jpg',
-        torrentPath: 'tearsOfSteel.torrent',
-        files: [
-          {
-            length: 571346576,
-            name: 'tears_of_steel_1080p.webm'
-          }
-        ]
-      },
-      {
-        status: 'paused',
-        infoHash: '6a02592d2bbc069628cd5ed8a54f88ee06ac0ba5',
-        magnetURI: 'magnet:?xt=urn:btih:6a02592d2bbc069628cd5ed8a54f88ee06ac0ba5&dn=CosmosLaundromatFirstCycle&tr=http%3A%2F%2Fbt1.archive.org%3A6969%2Fannounce&tr=http%3A%2F%2Fbt2.archive.org%3A6969%2Fannounce&tr=wss%3A%2F%2Ftracker.btorrent.xyz&tr=wss%3A%2F%2Ftracker.fastcast.nz&tr=wss%3A%2F%2Ftracker.openwebtorrent.com&tr=wss%3A%2F%2Ftracker.webtorrent.io&ws=http%3A%2F%2Fia601508.us.archive.org%2F14%2Fitems%2F&ws=http%3A%2F%2Fia801508.us.archive.org%2F14%2Fitems%2F&ws=https%3A%2F%2Farchive.org%2Fdownload%2F',
-        displayName: 'Cosmos Laundromat (Preview)',
-        posterURL: 'cosmosLaundromat.jpg',
-        torrentPath: 'cosmosLaundromat.torrent',
-        files: [
-          {
-            length: 223580,
-            name: 'Cosmos Laundromat - First Cycle (1080p).gif'
-          },
-          {
-            length: 220087570,
-            name: 'Cosmos Laundromat - First Cycle (1080p).mp4'
-          },
-          {
-            length: 56832560,
-            name: 'Cosmos Laundromat - First Cycle (1080p).ogv'
-          },
-          {
-            length: 3949,
-            name: 'CosmosLaundromat-FirstCycle1080p.en.srt'
-          },
-          {
-            length: 3907,
-            name: 'CosmosLaundromat-FirstCycle1080p.es.srt'
-          },
-          {
-            length: 4119,
-            name: 'CosmosLaundromat-FirstCycle1080p.fr.srt'
-          },
-          {
-            length: 3941,
-            name: 'CosmosLaundromat-FirstCycle1080p.it.srt'
-          },
-          {
-            length: 11264,
-            name: 'CosmosLaundromatFirstCycle_meta.sqlite'
-          },
-          {
-            length: 1204,
-            name: 'CosmosLaundromatFirstCycle_meta.xml'
-          }
-        ]
-      },
-      {
-        status: 'paused',
-        infoHash: '3ba219a8634bf7bae3d848192b2da75ae995589d',
-        magnetURI: 'magnet:?xt=urn:btih:3ba219a8634bf7bae3d848192b2da75ae995589d&dn=The+WIRED+CD+-+Rip.+Sample.+Mash.+Share.&tr=udp%3A%2F%2Fexodus.desync.com%3A6969&tr=udp%3A%2F%2Ftracker.coppersurfer.tk%3A6969&tr=udp%3A%2F%2Ftracker.internetwarriors.net%3A1337&tr=udp%3A%2F%2Ftracker.leechers-paradise.org%3A6969&tr=udp%3A%2F%2Ftracker.openbittorrent.com%3A80&tr=wss%3A%2F%2Ftracker.btorrent.xyz&tr=wss%3A%2F%2Ftracker.fastcast.nz&tr=wss%3A%2F%2Ftracker.openwebtorrent.com&tr=wss%3A%2F%2Ftracker.webtorrent.io&ws=https%3A%2F%2Fwebtorrent.io%2Ftorrents%2F',
-        displayName: 'The WIRED CD - Rip. Sample. Mash. Share.',
-        posterURL: 'wired-cd.jpg',
-        torrentPath: 'wired-cd.torrent',
-        files: [
-          {
-            length: 1964275,
-            name: '01 - Beastie Boys - Now Get Busy.mp3'
-          },
-          {
-            length: 3610523,
-            name: '02 - David Byrne - My Fair Lady.mp3'
-          },
-          {
-            length: 2759377,
-            name: '03 - Zap Mama - Wadidyusay.mp3'
-          },
-          {
-            length: 5816537,
-            name: '04 - My Morning Jacket - One Big Holiday.mp3'
-          },
-          {
-            length: 2106421,
-            name: '05 - Spoon - Revenge!.mp3'
-          },
-          {
-            length: 3347550,
-            name: '06 - Gilberto Gil - Oslodum.mp3'
-          },
-          {
-            length: 2107577,
-            name: '07 - Dan The Automator - Relaxation Spa Treatment.mp3'
-          },
-          {
-            length: 3108130,
-            name: '08 - Thievery Corporation - Dc 3000.mp3'
-          },
-          {
-            length: 3051528,
-            name: '09 - Le Tigre - Fake French.mp3'
-          },
-          {
-            length: 3270259,
-            name: '10 - Paul Westerberg - Looking Up In Heaven.mp3'
-          },
-          {
-            length: 3263528,
-            name: '11 - Chuck D - No Meaning No (feat. Fine Arts Militia).mp3'
-          },
-          {
-            length: 6380952,
-            name: '12 - The Rapture - Sister Saviour (Blackstrobe Remix).mp3'
-          },
-          {
-            length: 6550396,
-            name: '13 - Cornelius - Wataridori 2.mp3'
-          },
-          {
-            length: 3034692,
-            name: '14 - DJ Danger Mouse - What U Sittin\' On (feat. Jemini, Cee Lo And Tha Alkaholiks).mp3'
-          },
-          {
-            length: 3854611,
-            name: '15 - DJ Dolores - Oslodum 2004.mp3'
-          },
-          {
-            length: 1762120,
-            name: '16 - Matmos - Action At A Distance.mp3'
-          },
-          {
-            length: 4071,
-            name: 'README.md'
-          },
-          {
-            length: 78163,
-            name: 'poster.jpg'
-          }
-        ]
-      }
-    ],
-    downloadPath: config.IS_PORTABLE
-      ? path.join(config.CONFIG_PATH, 'Downloads')
-      : remote.app.getPath('downloads')
-  }
-}
-
-function getPlayingTorrentSummary () {
-  var infoHash = this.playing.infoHash
-  return this.saved.torrents.find((x) => x.infoHash === infoHash)
-}

renderer/views/app.js

@@ -1,85 +0,0 @@
-module.exports = App
-
-var h = require('virtual-dom/h')
-var hyperx = require('hyperx')
-var hx = hyperx(h)
-
-var Header = require('./header')
-var Views = {
-  'home': require('./torrent-list'),
-  'player': require('./player'),
-  'create-torrent': require('./create-torrent-page')
-}
-var Modals = {
-  'open-torrent-address-modal': require('./open-torrent-address-modal'),
-  'update-available-modal': require('./update-available-modal'),
-  'unsupported-media-modal': require('./unsupported-media-modal')
-}
-
-function App (state) {
-  // Hide player controls while playing video, if the mouse stays still for a while
-  // Never hide the controls when:
-  // * The mouse is over the controls or we're scrubbing (see CSS)
-  // * The video is paused
-  // * The video is playing remotely on Chromecast or Airplay
-  var hideControls = state.location.current().url === 'player' &&
-    state.playing.mouseStationarySince !== 0 &&
-    new Date().getTime() - state.playing.mouseStationarySince > 2000 &&
-    !state.playing.isPaused &&
-    state.playing.location === 'local'
-
-  // Hide the header on Windows/Linux when in the player
-  // On OSX, the header appears as part of the title bar
-  var hideHeader = process.platform !== 'darwin' && state.location.current().url === 'player'
-
-  var cls = [
-    'view-' + state.location.current().url, /* e.g. view-home, view-player */
-    'is-' + process.platform /* e.g. is-darwin, is-win32, is-linux */
-  ]
-  if (state.window.isFullScreen) cls.push('is-fullscreen')
-  if (state.window.isFocused) cls.push('is-focused')
-  if (hideControls) cls.push('hide-video-controls')
-  if (hideHeader) cls.push('hide-header')
-
-  return hx`
-    <div class='app ${cls.join(' ')}'>
-      ${Header(state)}
-      ${getErrorPopover(state)}
-      <div class='content'>${getView(state)}</div>
-      ${getModal(state)}
-    </div>
-  `
-}
-
-function getErrorPopover (state) {
-  var now = new Date().getTime()
-  var recentErrors = state.errors.filter((x) => now - x.time < 5000)
-
-  var errorElems = recentErrors.map(function (error) {
-    return hx`<div class='error'>${error.message}</div>`
-  })
-  return hx`
-  <div class='error-popover ${recentErrors.length > 0 ? 'visible' : 'hidden'}'>
-      <div class='title'>Error</div>
-      ${errorElems}
-    </div>
-  `
-}
-
-function getModal (state) {
-  if (!state.modal) return
-  var contents = Modals[state.modal.id](state)
-  return hx`
-    <div class='modal'>
-      <div class='modal-background'></div>
-      <div class='modal-content'>
-        ${contents}
-      </div>
-    </div>
-  `
-}
-
-function getView (state) {
-  var url = state.location.current().url
-  return Views[url](state)
-}

renderer/views/create-torrent-page.js

@@ -1,145 +0,0 @@
-module.exports = CreateTorrentPage
-
-var h = require('virtual-dom/h')
-var hyperx = require('hyperx')
-var hx = hyperx(h)
-
-var createTorrent = require('create-torrent')
-var path = require('path')
-var prettyBytes = require('prettier-bytes')
-
-var {dispatch} = require('../lib/dispatcher')
-
-function CreateTorrentPage (state) {
-  var info = state.location.current()
-
-  // Preprocess: exclude .DS_Store and other dotfiles
-  var files = info.files
-    .filter((f) => !f.name.startsWith('.'))
-    .map((f) => ({name: f.name, path: f.path, size: f.size}))
-
-  // First, extract the base folder that the files are all in
-  var pathPrefix = info.folderPath
-  if (!pathPrefix) {
-    if (files.length > 0) {
-      pathPrefix = files.map((x) => x.path).reduce(findCommonPrefix)
-      if (!pathPrefix.endsWith('/') && !pathPrefix.endsWith('\\')) {
-        pathPrefix = path.dirname(pathPrefix)
-      }
-    } else {
-      pathPrefix = files[0]
-    }
-  }
-
-  // Sanity check: show the number of files and total size
-  var numFiles = files.length
-  var totalBytes = files
-    .map((f) => f.size)
-    .reduce((a, b) => a + b, 0)
-  var torrentInfo = `${numFiles} files, ${prettyBytes(totalBytes)}`
-
-  // Then, use the name of the base folder (or sole file, for a single file torrent)
-  // as the default name. Show all files relative to the base folder.
-  var defaultName, basePath
-  if (files.length === 1) {
-    // Single file torrent: /a/b/foo.jpg -> torrent name "foo.jpg", path "/a/b"
-    defaultName = files[0].name
-    basePath = pathPrefix
-  } else {
-    // Multi file torrent: /a/b/{foo, bar}.jpg -> torrent name "b", path "/a"
-    defaultName = path.basename(pathPrefix)
-    basePath = path.dirname(pathPrefix)
-  }
-  var maxFileElems = 100
-  var fileElems = files.slice(0, maxFileElems).map(function (file) {
-    var relativePath = files.length === 0 ? file.name : path.relative(pathPrefix, file.path)
-    return hx`<div>${relativePath}</div>`
-  })
-  if (files.length > maxFileElems) {
-    fileElems.push(hx`<div>+ ${maxFileElems - files.length} more</div>`)
-  }
-  var trackers = createTorrent.announceList.join('\n')
-  var collapsedClass = info.showAdvanced ? 'expanded' : 'collapsed'
-
-  return hx`
-    <div class='create-torrent-page'>
-      <h2>Create torrent ${defaultName}</h2>
-      <p class="torrent-info">
-        ${torrentInfo}
-      </p>
-      <p class='torrent-attribute'>
-        <label>Path:</label>
-        <div class='torrent-attribute'>${pathPrefix}</div>
-      </p>
-      <div class='expand-collapse ${collapsedClass}' onclick=${handleToggleShowAdvanced}>
-        ${info.showAdvanced ? 'Basic' : 'Advanced'}
-      </div>
-      <div class="create-torrent-advanced ${collapsedClass}">
-        <p class='torrent-attribute'>
-          <label>Comment:</label>
-          <textarea class='torrent-attribute torrent-comment'></textarea>
-        </p>
-        <p class='torrent-attribute'>
-          <label>Trackers:</label>
-          <textarea class='torrent-attribute torrent-trackers'>${trackers}</textarea>
-        </p>
-        <p class='torrent-attribute'>
-          <label>Private:</label>
-          <input type='checkbox' class='torrent-is-private' value='torrent-is-private'>
-        </p>
-        <p class='torrent-attribute'>
-          <label>Files:</label>
-          <div>${fileElems}</div>
-        </p>
-      </div>
-      <p class="float-right">
-        <button class='button-flat light' onclick=${handleCancel}>Cancel</button>
-        <button class='button-raised' onclick=${handleOK}>Create Torrent</button>
-      </p>
-    </div>
-  `
-
-  function handleOK () {
-    var announceList = document.querySelector('.torrent-trackers').value
-      .split('\n')
-      .map((s) => s.trim())
-      .filter((s) => s !== '')
-    var isPrivate = document.querySelector('.torrent-is-private').checked
-    var comment = document.querySelector('.torrent-comment').value.trim()
-    var options = {
-      // We can't let the user choose their own name if we want WebTorrent
-      // to use the files in place rather than creating a new folder.
-      // If we ever want to add support for that:
-      // name: document.querySelector('.torrent-name').value
-      name: defaultName,
-      path: basePath,
-      files: files,
-      announce: announceList,
-      private: isPrivate,
-      comment: comment
-    }
-    dispatch('createTorrent', options)
-    dispatch('backToList')
-  }
-
-  function handleCancel () {
-    dispatch('backToList')
-  }
-
-  function handleToggleShowAdvanced () {
-    // TODO: what's the clean way to handle this?
-    // Should every button on every screen have its own dispatch()?
-    info.showAdvanced = !info.showAdvanced
-    dispatch('update')
-  }
-}
-
-// Finds the longest common prefix
-function findCommonPrefix (a, b) {
-  for (var i = 0; i < a.length && i < b.length; i++) {
-    if (a.charCodeAt(i) !== b.charCodeAt(i)) break
-  }
-  if (i === a.length) return a
-  if (i === b.length) return b
-  return a.substring(0, i)
-}

renderer/views/header.js

@@ -1,51 +0,0 @@
-module.exports = Header
-
-var h = require('virtual-dom/h')
-var hyperx = require('hyperx')
-var hx = hyperx(h)
-
-var {dispatcher} = require('../lib/dispatcher')
-
-function Header (state) {
-  return hx`
-    <div class='header'>
-      ${getTitle()}
-      <div class='nav left'>
-        <i.icon.back
-          class=${state.location.hasBack() ? '' : 'disabled'}
-          title='Back'
-          onclick=${dispatcher('back')}>
-          chevron_left
-        </i>
-        <i.icon.forward
-          class=${state.location.hasForward() ? '' : 'disabled'}
-          title='Forward'
-          onclick=${dispatcher('forward')}>
-          chevron_right
-        </i>
-      </div>
-      <div class='nav right'>
-        ${getAddButton()}
-      </div>
-    </div>
-  `
-
-  function getTitle () {
-    if (process.platform === 'darwin') {
-      return hx`<div class='title ellipsis'>${state.window.title}</div>`
-    }
-  }
-
-  function getAddButton () {
-    if (state.location.current().url !== 'player') {
-      return hx`
-        <i
-          class='icon add'
-          title='Add torrent'
-          onclick=${dispatcher('showOpenTorrentFile')}>
-          add
-        </i>
-      `
-    }
-  }
-}

renderer/views/open-torrent-address-modal.js

@@ -1,36 +0,0 @@
-module.exports = OpenTorrentAddressModal
-
-var h = require('virtual-dom/h')
-var hyperx = require('hyperx')
-var hx = hyperx(h)
-
-var {dispatch} = require('../lib/dispatcher')
-
-function OpenTorrentAddressModal (state) {
-  return hx`
-    <div class='open-torrent-address-modal'>
-      <p><label>Enter torrent address or magnet link</label></p>
-      <p>
-        <input id='add-torrent-url' type='text' onkeypress=${handleKeyPress} />
-      </p>
-      <p class='float-right'>
-        <button class='button button-flat' onclick=${handleCancel}>CANCEL</button>
-          <button class='button button-raised' onclick=${handleOK}>OK</button>
-      </p>
-      <script>document.querySelector('#add-torrent-url').focus()</script>
-    </div>
-  `
-}
-
-function handleKeyPress (e) {
-  if (e.which === 13) handleOK() /* hit Enter to submit */
-}
-
-function handleOK () {
-  dispatch('exitModal')
-  dispatch('addTorrent', document.querySelector('#add-torrent-url').value)
-}
-
-function handleCancel () {
-  dispatch('exitModal')
-}

renderer/views/player.js

@@ -1,542 +0,0 @@
-module.exports = Player
-
-var h = require('virtual-dom/h')
-var hyperx = require('hyperx')
-var hx = hyperx(h)
-
-var prettyBytes = require('prettier-bytes')
-var Bitfield = require('bitfield')
-
-var TorrentSummary = require('../lib/torrent-summary')
-var {dispatch, dispatcher} = require('../lib/dispatcher')
-
-// Shows a streaming video player. Standard features + Chromecast + Airplay
-function Player (state) {
-  // Show the video as large as will fit in the window, play immediately
-  // If the video is on Chromecast or Airplay, show a title screen instead
-  var showVideo = state.playing.location === 'local'
-  return hx`
-    <div
-      class='player'
-      onwheel=${handleVolumeWheel}
-      onmousemove=${dispatcher('mediaMouseMoved')}>
-      ${showVideo ? renderMedia(state) : renderCastScreen(state)}
-      ${renderPlayerControls(state)}
-      </div>
-  `
-}
-
-// Handles volume change by wheel
-function handleVolumeWheel (e) {
-  dispatch('changeVolume', (-e.deltaY | e.deltaX) / 500)
-}
-
-function renderMedia (state) {
-  if (!state.server) return
-
-  // Unfortunately, play/pause can't be done just by modifying HTML.
-  // Instead, grab the DOM node and play/pause it if necessary
-  var mediaElement = document.querySelector(state.playing.type) /* get the <video> or <audio> tag */
-  if (mediaElement !== null) {
-    if (state.playing.isPaused && !mediaElement.paused) {
-      mediaElement.pause()
-    } else if (!state.playing.isPaused && mediaElement.paused) {
-      mediaElement.play()
-    }
-    // When the user clicks or drags on the progress bar, jump to that position
-    if (state.playing.jumpToTime) {
-      mediaElement.currentTime = state.playing.jumpToTime
-      state.playing.jumpToTime = null
-    }
-    // Set volume
-    if (state.playing.setVolume !== null && isFinite(state.playing.setVolume)) {
-      mediaElement.volume = state.playing.setVolume
-      state.playing.setVolume = null
-    }
-
-    // Switch to the newly added subtitle track, if available
-    var tracks = mediaElement.textTracks
-    for (var j = 0; j < tracks.length; j++) {
-      tracks[j].mode = (j === state.playing.subtitles.selectedIndex) ? 'showing' : 'hidden'
-    }
-
-    state.playing.currentTime = mediaElement.currentTime
-    state.playing.duration = mediaElement.duration
-    state.playing.volume = mediaElement.volume
-  }
-
-  // Add subtitles to the <video> tag
-  var trackTags = []
-  if (state.playing.subtitles.selectedIndex >= 0) {
-    for (var i = 0; i < state.playing.subtitles.tracks.length; i++) {
-      var track = state.playing.subtitles.tracks[i]
-      var isSelected = state.playing.subtitles.selectedIndex === i
-      trackTags.push(hx`
-        <track
-          ${isSelected ? 'default' : ''}
-          label=${track.label}
-          type='subtitles'
-          src=${track.buffer}>
-      `)
-    }
-  }
-
-  // Create the <audio> or <video> tag
-  var mediaTag = hx`
-    <div
-      src='${state.server.localURL}'
-      ondblclick=${dispatcher('toggleFullScreen')}
-      onloadedmetadata=${onLoadedMetadata}
-      onended=${onEnded}
-      onstalling=${dispatcher('mediaStalled')}
-      onerror=${dispatcher('mediaError')}
-      ontimeupdate=${dispatcher('mediaTimeUpdate')}
-      onencrypted=${dispatcher('mediaEncrypted')}
-      oncanplay=${onCanPlay}>
-      ${trackTags}
-    </div>
-  `
-  mediaTag.tagName = state.playing.type // conditional tag name
-
-  // Show the media.
-  return hx`
-    <div
-      class='letterbox'
-      onmousemove=${dispatcher('mediaMouseMoved')}>
-      ${mediaTag}
-      ${renderOverlay(state)}
-    </div>
-  `
-
-  // As soon as the video loads enough to know the video dimensions, resize the window
-  function onLoadedMetadata (e) {
-    if (state.playing.type !== 'video') return
-    var video = e.target
-    var dimensions = {
-      width: video.videoWidth,
-      height: video.videoHeight
-    }
-    dispatch('setDimensions', dimensions)
-  }
-
-  // When the video completes, pause the video instead of looping
-  function onEnded (e) {
-    state.playing.isPaused = true
-  }
-
-  function onCanPlay (e) {
-    var video = e.target
-    if (video.webkitVideoDecodedByteCount > 0 &&
-      video.webkitAudioDecodedByteCount === 0) {
-      dispatch('mediaError', 'Audio codec unsupported')
-    } else {
-      video.play()
-    }
-  }
-}
-
-function renderOverlay (state) {
-  var elems = []
-  var audioMetadataElem = renderAudioMetadata(state)
-  var spinnerElem = renderLoadingSpinner(state)
-  if (audioMetadataElem) elems.push(audioMetadataElem)
-  if (spinnerElem) elems.push(spinnerElem)
-
-  // Video fills the window, centered with black bars if necessary
-  // Audio gets a static poster image and a summary of the file metadata.
-  var style
-  if (state.playing.type === 'audio') {
-    style = { backgroundImage: cssBackgroundImagePoster(state) }
-  } else if (elems.length !== 0) {
-    style = { backgroundImage: cssBackgroundImageDarkGradient() }
-  } else {
-    return /* Video, not audio, and it isn't stalled, so no spinner. No overlay needed. */
-  }
-
-  return hx`
-    <div class='media-overlay-background' style=${style}>
-      <div class='media-overlay'>${elems}</div>
-    </div>
-  `
-}
-
-function renderAudioMetadata (state) {
-  var torrentSummary = state.getPlayingTorrentSummary()
-  var fileSummary = torrentSummary.files[state.playing.fileIndex]
-  if (!fileSummary.audioInfo) return
-  var info = fileSummary.audioInfo
-
-  // Get audio track info
-  var title = info.title
-  if (!title) {
-    title = fileSummary.name
-  }
-  var artist = info.artist && info.artist[0]
-  var album = info.album
-  if (album && info.year && !album.includes(info.year)) {
-    album += ' (' + info.year + ')'
-  }
-  var track
-  if (info.track && info.track.no && info.track.of) {
-    track = info.track.no + ' of ' + info.track.of
-  }
-
-  // Show a small info box in the middle of the screen with title/album/artist/etc
-  var elems = []
-  if (artist) elems.push(hx`<div class='audio-artist'><label>Artist</label>${artist}</div>`)
-  if (album) elems.push(hx`<div class='audio-album'><label>Album</label>${album}</div>`)
-  if (track) elems.push(hx`<div class='audio-track'><label>Track</label>${track}</div>`)
-
-  // Align the title with the artist/etc info, if available. Otherwise, center the title
-  var emptyLabel = hx`<label></label>`
-  elems.unshift(hx`<div class='audio-title'>${elems.length ? emptyLabel : undefined}${title}</div>`)
-
-  return hx`<div class='audio-metadata'>${elems}</div>`
-}
-
-function renderLoadingSpinner (state) {
-  if (state.playing.isPaused) return
-  var isProbablyStalled = state.playing.isStalled ||
-    (new Date().getTime() - state.playing.lastTimeUpdate > 2000)
-  if (!isProbablyStalled) return
-
-  var prog = state.getPlayingTorrentSummary().progress || {}
-  var fileProgress = 0
-  if (prog.files) {
-    var file = prog.files[state.playing.fileIndex]
-    fileProgress = Math.floor(100 * file.numPiecesPresent / file.numPieces)
-  }
-
-  return hx`
-    <div class='media-stalled'>
-      <div class='loading-spinner'>&nbsp;</div>
-      <div class='loading-status ellipsis'>
-        <span class='progress'>${fileProgress}%</span> downloaded,
-        <span>↓ ${prettyBytes(prog.downloadSpeed || 0)}/s</span>
-        <span>↑ ${prettyBytes(prog.uploadSpeed || 0)}/s</span>
-      </div>
-    </div>
-  `
-}
-
-function renderCastScreen (state) {
-  var castIcon, castType, isCast
-  if (state.playing.location.startsWith('chromecast')) {
-    castIcon = 'cast_connected'
-    castType = 'Chromecast'
-    isCast = true
-  } else if (state.playing.location.startsWith('airplay')) {
-    castIcon = 'airplay'
-    castType = 'AirPlay'
-    isCast = true
-  } else if (state.playing.location.startsWith('dlna')) {
-    castIcon = 'tv'
-    castType = 'DLNA'
-    isCast = true
-  } else if (state.playing.location === 'vlc') {
-    castIcon = 'tv'
-    castType = 'VLC'
-    isCast = false
-  } else if (state.playing.location === 'error') {
-    castIcon = 'error_outline'
-    castType = 'Error'
-    isCast = false
-  }
-
-  var isStarting = state.playing.location.endsWith('-pending')
-  var castStatus
-  if (isCast) castStatus = isStarting ? 'Connecting...' : 'Connected'
-  else castStatus = ''
-
-  // Show a nice title image, if possible
-  var style = {
-    backgroundImage: cssBackgroundImagePoster(state)
-  }
-
-  return hx`
-    <div class='letterbox' style=${style}>
-      <div class='cast-screen'>
-        <i class='icon'>${castIcon}</i>
-        <div class='cast-type'>${castType}</div>
-        <div class='cast-status'>${castStatus}</div>
-      </div>
-    </div>
-  `
-}
-
-function renderSubtitlesOptions (state) {
-  var subtitles = state.playing.subtitles
-  if (!subtitles.tracks.length || !subtitles.showMenu) return
-
-  var items = subtitles.tracks.map(function (track, ix) {
-    var isSelected = state.playing.subtitles.selectedIndex === ix
-    return hx`
-      <li onclick=${dispatcher('selectSubtitle', ix)}>
-        <i.icon>${isSelected ? 'radio_button_checked' : 'radio_button_unchecked'}</i>
-        ${track.label}
-      </li>
-    `
-  })
-
-  var noneSelected = state.playing.subtitles.selectedIndex === -1
-  return hx`
-    <ul.subtitles-list>
-      ${items}
-      <li onclick=${dispatcher('selectSubtitle', -1)}>
-        <i.icon>${noneSelected ? 'radio_button_checked' : 'radio_button_unchecked'}</i>
-        None
-      </li>
-    </ul>
-  `
-}
-
-function renderPlayerControls (state) {
-  var positionPercent = 100 * state.playing.currentTime / state.playing.duration
-  var playbackCursorStyle = { left: 'calc(' + positionPercent + '% - 8px)' }
-  var captionsClass = state.playing.subtitles.tracks.length === 0
-    ? 'disabled'
-    : state.playing.subtitles.selectedIndex >= 0
-      ? 'active'
-      : ''
-
-  var elements = [
-    hx`
-      <div class='playback-bar'>
-        ${renderLoadingBar(state)}
-        <div class='playback-cursor' style=${playbackCursorStyle}></div>
-        <div class='scrub-bar'
-          draggable='true'
-          onclick=${handleScrub},
-          ondrag=${handleScrub}></div>
-      </div>
-    `,
-    hx`
-      <i class='icon fullscreen'
-        onclick=${dispatcher('toggleFullScreen')}>
-        ${state.window.isFullScreen ? 'fullscreen_exit' : 'fullscreen'}
-      </i>
-    `
-  ]
-
-  if (state.playing.type === 'video') {
-    // show closed captions icon
-    elements.push(hx`
-      <i.icon.closed-captions
-        class=${captionsClass}
-        onclick=${handleSubtitles}>
-        closed_captions
-      </i>
-    `)
-  }
-
-  // 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 isOnDlna = state.playing.location.startsWith('dlna')
-  var chromecastClass, chromecastHandler, airplayClass, airplayHandler, dlnaClass, dlnaHandler
-  if (isOnChromecast) {
-    chromecastClass = 'active'
-    dlnaClass = 'disabled'
-    airplayClass = 'disabled'
-    chromecastHandler = dispatcher('closeDevice')
-    airplayHandler = undefined
-    dlnaHandler = undefined
-  } else if (isOnAirplay) {
-    chromecastClass = 'disabled'
-    dlnaClass = 'disabled'
-    airplayClass = 'active'
-    chromecastHandler = undefined
-    airplayHandler = dispatcher('closeDevice')
-    dlnaHandler = undefined
-  } else if (isOnDlna) {
-    chromecastClass = 'disabled'
-    dlnaClass = 'active'
-    airplayClass = 'disabled'
-    chromecastHandler = undefined
-    airplayHandler = undefined
-    dlnaHandler = dispatcher('closeDevice')
-  } else {
-    chromecastClass = ''
-    airplayClass = ''
-    dlnaClass = ''
-    chromecastHandler = dispatcher('openDevice', 'chromecast')
-    airplayHandler = dispatcher('openDevice', 'airplay')
-    dlnaHandler = dispatcher('openDevice', 'dlna')
-  }
-  if (state.devices.chromecast || isOnChromecast) {
-    var castIcon = isOnChromecast ? 'cast_connected' : 'cast'
-    elements.push(hx`
-      <i.icon.device
-        class=${chromecastClass}
-        onclick=${chromecastHandler}>
-        ${castIcon}
-      </i>
-    `)
-  }
-  if (state.devices.airplay || isOnAirplay) {
-    elements.push(hx`
-      <i.icon.device
-        class=${airplayClass}
-        onclick=${airplayHandler}>
-        airplay
-      </i>
-    `)
-  }
-  if (state.devices.dlna || isOnDlna) {
-    elements.push(hx`
-      <i.icon.device
-        class=${dlnaClass}
-        onclick=${dlnaHandler}>
-        tv
-      </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
-  if (process.platform !== 'darwin') {
-    elements.push(hx`
-      <i.icon.back
-        onclick=${dispatcher('back')}>
-        chevron_left
-      </i>
-    `)
-  }
-
-  // render volume
-  var volume = state.playing.volume
-  var volumeIcon = 'volume_' + (volume === 0 ? 'off' : volume < 0.3 ? 'mute' : volume < 0.6 ? 'down' : 'up')
-  var volumeStyle = { background: '-webkit-gradient(linear, left top, right top, ' +
-    'color-stop(' + (volume * 100) + '%, #eee), ' +
-    'color-stop(' + (volume * 100) + '%, #727272))'
-  }
-
-  elements.push(hx`
-    <div.volume>
-        <i.icon.volume-icon onmousedown=${handleVolumeMute}>
-          ${volumeIcon}
-        </i>
-        <input.volume-slider
-          type='range' min='0' max='1' step='0.05' value=${volumeChanging !== false ? volumeChanging : volume}
-          onmousedown=${handleVolumeScrub}
-          onmouseup=${handleVolumeScrub}
-          onmousemove=${handleVolumeScrub}
-          style=${volumeStyle}
-        />
-    </div>
-  `)
-
-  // Finally, the big button in the center plays or pauses the video
-  elements.push(hx`
-    <i class='icon play-pause' onclick=${dispatcher('playPause')}>
-      ${state.playing.isPaused ? 'play_arrow' : 'pause'}
-    </i>
-  `)
-
-  return hx`
-    <div class='player-controls'>
-      ${elements}
-      ${renderSubtitlesOptions(state)}
-    </div>
-  `
-
-  // Handles a click or drag to scrub (jump to another position in the video)
-  function handleScrub (e) {
-    dispatch('mediaMouseMoved')
-    var windowWidth = document.querySelector('body').clientWidth
-    var fraction = e.clientX / windowWidth
-    var position = fraction * state.playing.duration /* seconds */
-    dispatch('playbackJump', position)
-  }
-
-  // Handles volume muting and Unmuting
-  function handleVolumeMute (e) {
-    if (state.playing.volume === 0.0) {
-      dispatch('setVolume', 1.0)
-    } else {
-      dispatch('setVolume', 0.0)
-    }
-  }
-
-  // Handles volume slider scrub
-  function handleVolumeScrub (e) {
-    switch (e.type) {
-      case 'mouseup':
-        volumeChanging = false
-        dispatch('setVolume', e.offsetX / 50)
-        break
-      case 'mousedown':
-        volumeChanging = this.value
-        break
-      case 'mousemove':
-        // only change if move was started by click
-        if (volumeChanging !== false) {
-          volumeChanging = this.value
-        }
-        break
-    }
-  }
-
-  function handleSubtitles (e) {
-    if (!state.playing.subtitles.tracks.length || e.ctrlKey || e.metaKey) {
-      // if no subtitles available select it
-      dispatch('openSubtitles')
-    } else {
-      dispatch('toggleSubtitlesMenu')
-    }
-  }
-}
-
-// lets scrub without sending to volume backend
-var volumeChanging = false
-
-// Renders the loading bar. Shows which parts of the torrent are loaded, which
-// can be "spongey" / non-contiguous
-function renderLoadingBar (state) {
-  var torrentSummary = state.getPlayingTorrentSummary()
-  if (!torrentSummary.progress) {
-    return []
-  }
-
-  // Find all contiguous parts of the torrent which are loaded
-  var prog = torrentSummary.progress
-  var fileProg = prog.files[state.playing.fileIndex]
-  var parts = []
-  var lastPiecePresent = false
-  for (var i = fileProg.startPiece; i <= fileProg.endPiece; i++) {
-    var partPresent = Bitfield.prototype.get.call(prog.bitfield, i)
-    if (partPresent && !lastPiecePresent) {
-      parts.push({start: i - fileProg.startPiece, count: 1})
-    } else if (partPresent) {
-      parts[parts.length - 1].count++
-    }
-    lastPiecePresent = partPresent
-  }
-
-  // Output some bars to show which parts of the file are loaded
-  return hx`
-    <div class='loading-bar'>
-      ${parts.map(function (part) {
-        var style = {
-          left: (100 * part.start / fileProg.numPieces) + '%',
-          width: (100 * part.count / fileProg.numPieces) + '%'
-        }
-
-        return hx`<div class='loading-bar-part' style=${style}></div>`
-      })}
-    </div>
-  `
-}
-
-// Returns the CSS background-image string for a poster image + dark vignette
-function cssBackgroundImagePoster (state) {
-  var torrentSummary = state.getPlayingTorrentSummary()
-  var posterPath = TorrentSummary.getPosterPath(torrentSummary)
-  if (!posterPath) return ''
-  return cssBackgroundImageDarkGradient() + `, url(${posterPath})`
-}
-
-function cssBackgroundImageDarkGradient () {
-  return 'radial-gradient(circle at center, ' +
-    'rgba(0,0,0,0.4) 0%, rgba(0,0,0,1) 100%)'
-}

renderer/views/torrent-list.js

@@ -1,256 +0,0 @@
-module.exports = TorrentList
-
-var h = require('virtual-dom/h')
-var hyperx = require('hyperx')
-var hx = hyperx(h)
-var prettyBytes = require('prettier-bytes')
-
-var TorrentSummary = require('../lib/torrent-summary')
-var TorrentPlayer = require('../lib/torrent-player')
-var {dispatcher} = require('../lib/dispatcher')
-
-function TorrentList (state) {
-  var torrentRows = state.saved.torrents.map(
-    (torrentSummary) => renderTorrent(torrentSummary))
-  return hx`
-    <div class='torrent-list'>
-      ${torrentRows}
-      <div class='torrent-placeholder'>
-        <span class='ellipsis'>Drop a torrent file here or paste a magnet link</span>
-      </div>
-    </div>`
-
-  // Renders a torrent in the torrent list
-  // Includes name, download status, play button, background image
-  // May be expanded for additional info, including the list of files inside
-  function renderTorrent (torrentSummary) {
-    // Get ephemeral data (like progress %) directly from the WebTorrent handle
-    var infoHash = torrentSummary.infoHash
-    var isSelected = infoHash && state.selectedInfoHash === infoHash
-
-    // Background image: show some nice visuals, like a frame from the movie, if possible
-    var style = {}
-    if (torrentSummary.posterFileName) {
-      var gradient = isSelected
-        ? 'linear-gradient(to bottom, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.4) 100%)'
-        : 'linear-gradient(to bottom, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 100%)'
-      var posterPath = TorrentSummary.getPosterPath(torrentSummary)
-      style.backgroundImage = gradient + `, url('${posterPath}')`
-    }
-
-    // Foreground: name of the torrent, basic info like size, play button,
-    // cast buttons if available, and delete
-    var classes = ['torrent']
-    //  playStatus turns the play button into a loading spinner or error icon
-    if (torrentSummary.playStatus) classes.push(torrentSummary.playStatus)
-    if (isSelected) classes.push('selected')
-    if (!infoHash) classes.push('disabled')
-    classes = classes.join(' ')
-    return hx`
-      <div style=${style} class=${classes}
-        oncontextmenu=${infoHash && dispatcher('openTorrentContextMenu', infoHash)}
-        onclick=${infoHash && dispatcher('toggleSelectTorrent', infoHash)}>
-        ${renderTorrentMetadata(torrentSummary)}
-        ${infoHash ? renderTorrentButtons(torrentSummary) : ''}
-        ${isSelected ? renderTorrentDetails(torrentSummary) : ''}
-      </div>
-    `
-  }
-
-  // Show name, download status, % complete
-  function renderTorrentMetadata (torrentSummary) {
-    var name = torrentSummary.name || 'Loading torrent...'
-    var elements = [hx`
-      <div class='name ellipsis'>${name}</div>
-    `]
-
-    // If it's downloading/seeding then show progress info
-    var prog = torrentSummary.progress
-    if (torrentSummary.status !== 'paused' && prog) {
-      elements.push(hx`
-        <div class='ellipsis'>
-          ${renderPercentProgress()}
-          ${renderTotalProgress()}
-          ${renderPeers()}
-          ${renderDownloadSpeed()}
-          ${renderUploadSpeed()}
-        </div>
-      `)
-    }
-
-    return hx`<div class='metadata'>${elements}</div>`
-
-    function renderPercentProgress () {
-      var progress = Math.floor(100 * prog.progress)
-      return hx`<span>${progress}%</span>`
-    }
-
-    function renderTotalProgress () {
-      var downloaded = prettyBytes(prog.downloaded)
-      var total = prettyBytes(prog.length || 0)
-      if (downloaded === total) {
-        return hx`<span>${downloaded}</span>`
-      } else {
-        return hx`<span>${downloaded} / ${total}</span>`
-      }
-    }
-
-    function renderPeers () {
-      if (prog.numPeers === 0) return
-      var count = prog.numPeers === 1 ? 'peer' : 'peers'
-      return hx`<span>${prog.numPeers} ${count}</span>`
-    }
-
-    function renderDownloadSpeed () {
-      if (prog.downloadSpeed === 0) return
-      return hx`<span>↓ ${prettyBytes(prog.downloadSpeed)}/s</span>`
-    }
-
-    function renderUploadSpeed () {
-      if (prog.uploadSpeed === 0) return
-      return hx`<span>↑ ${prettyBytes(prog.uploadSpeed)}/s</span>`
-    }
-  }
-
-  // Download button toggles between torrenting (DL/seed) and paused
-  // Play button starts streaming the torrent immediately, unpausing if needed
-  function renderTorrentButtons (torrentSummary) {
-    var infoHash = torrentSummary.infoHash
-
-    var playIcon, playTooltip, playClass
-    if (torrentSummary.playStatus === 'unplayable') {
-      playIcon = 'play_arrow'
-      playClass = 'disabled'
-      playTooltip = 'Sorry, WebTorrent can\'t play any of the files in this torrent. ' +
-        'View details and click on individual files to open them in another program.'
-    } else if (torrentSummary.playStatus === 'timeout') {
-      playIcon = 'warning'
-      playTooltip = 'Playback timed out. No seeds? No internet? Click to try again.'
-    } else {
-      playIcon = 'play_arrow'
-      playTooltip = 'Start streaming'
-    }
-
-    var downloadIcon, downloadTooltip
-    if (torrentSummary.status === 'seeding') {
-      downloadIcon = 'file_upload'
-      downloadTooltip = 'Seeding. Click to stop.'
-    } else if (torrentSummary.status === 'downloading') {
-      downloadIcon = 'file_download'
-      downloadTooltip = 'Torrenting. Click to stop.'
-    } else {
-      downloadIcon = 'file_download'
-      downloadTooltip = 'Click to start torrenting.'
-    }
-
-    // Only show the play button for torrents that contain playable media
-    var playButton
-    if (TorrentPlayer.isPlayableTorrent(torrentSummary)) {
-      playButton = hx`
-        <i.button-round.icon.play
-          title=${playTooltip}
-          class=${playClass}
-          onclick=${dispatcher('play', infoHash)}>
-          ${playIcon}
-        </i>
-      `
-    }
-
-    return hx`
-      <div class='buttons'>
-        ${playButton}
-        <i.button-round.icon.download
-          class=${torrentSummary.status}
-          title=${downloadTooltip}
-          onclick=${dispatcher('toggleTorrent', infoHash)}>
-          ${downloadIcon}
-        </i>
-        <i
-          class='icon delete'
-          title='Remove torrent'
-          onclick=${dispatcher('deleteTorrent', infoHash)}>
-          close
-        </i>
-      </div>
-    `
-  }
-
-  // Show files, per-file download status and play buttons, and so on
-  function renderTorrentDetails (torrentSummary) {
-    var filesElement
-    if (!torrentSummary.files) {
-      // We don't know what files this torrent contains
-      var message = torrentSummary.status === 'paused'
-        ? 'Failed to load torrent info. Click the download button to try again...'
-        : 'Downloading torrent info...'
-      filesElement = hx`<div class='files warning'>${message}</div>`
-    } else {
-      // We do know the files. List them and show download stats for each one
-      var fileRows = torrentSummary.files.map(
-        (file, index) => renderFileRow(torrentSummary, file, index))
-      filesElement = hx`
-        <div class='files'>
-          <strong>Files</strong>
-          <table>
-            ${fileRows}
-          </table>
-        </div>
-      `
-    }
-
-    return hx`
-      <div class='torrent-details'>
-        ${filesElement}
-      </div>
-    `
-  }
-
-  // Show a single torrentSummary file in the details view for a single torrent
-  function renderFileRow (torrentSummary, file, index) {
-    // First, find out how much of the file we've downloaded
-    var isSelected = torrentSummary.selections[index] // Are we even torrenting it?
-    var isDone = false // Are we finished torrenting it?
-    var progress = ''
-    if (torrentSummary.progress && torrentSummary.progress.files) {
-      var fileProg = torrentSummary.progress.files[index]
-      isDone = fileProg.numPiecesPresent === fileProg.numPieces
-      progress = Math.round(100 * fileProg.numPiecesPresent / fileProg.numPieces) + '%'
-    }
-
-    // Second, render the file as a table row
-    var isPlayable = TorrentPlayer.isPlayable(file)
-    var infoHash = torrentSummary.infoHash
-    var icon
-    var handleClick
-    if (isPlayable) {
-      icon = 'play_arrow' /* playable? add option to play */
-      handleClick = dispatcher('play', infoHash, index)
-    } else {
-      icon = 'description' /* file icon, opens in OS default app */
-      handleClick = dispatcher('openFile', infoHash, index)
-    }
-    var rowClass = ''
-    if (!isSelected) rowClass = 'disabled' // File deselected, not being torrented
-    if (!isDone && !isPlayable) rowClass = 'disabled' // Can't open yet, can't stream
-    return hx`
-      <tr>
-        <td class='col-icon ${rowClass}' onclick=${handleClick}>
-          <i class='icon'>${icon}</i>
-        </td>
-        <td class='col-name ${rowClass}' onclick=${handleClick}>
-          ${file.name}
-        </td>
-        <td class='col-progress ${rowClass}' onclick=${handleClick}>
-          ${isSelected ? progress : ''}
-        </td>
-        <td class='col-size ${rowClass}' onclick=${handleClick}>
-          ${prettyBytes(file.length)}
-        </td>
-        <td class='col-select'
-            onclick=${dispatcher('toggleTorrentFile', infoHash, index)}>
-          <i class='icon'>${isSelected ? 'close' : 'add'}</i>
-        </td>
-      </tr>
-    `
-  }
-}

renderer/views/unsupported-media-modal.js

@@ -1,42 +0,0 @@
-module.exports = UnsupportedMediaModal
-
-var h = require('virtual-dom/h')
-var hyperx = require('hyperx')
-var hx = hyperx(h)
-
-var electron = require('electron')
-
-var {dispatch, dispatcher} = require('../lib/dispatcher')
-
-function UnsupportedMediaModal (state) {
-  var err = state.modal.error
-  var message = (err && err.getMessage)
-    ? err.getMessage()
-    : err
-  var actionButton = state.modal.vlcInstalled
-    ? hx`<button class="button-raised" onclick=${onPlay}>Play in VLC</button>`
-    : hx`<button class="button-raised" onclick=${onInstall}>Install VLC</button>`
-  var vlcMessage = state.modal.vlcNotFound
-    ? 'Couldn\'t run VLC. Please make sure it\'s installed.'
-    : ''
-  return hx`
-    <div>
-      <p><strong>Sorry, we can't play that file.</strong></p>
-      <p>${message}</p>
-      <p class='float-right'>
-        <button class="button-flat" onclick=${dispatcher('backToList')}>Cancel</button>
-        ${actionButton}
-      </p>
-      <p class='error-text'>${vlcMessage}</p>
-    </div>
-  `
-
-  function onInstall () {
-    electron.shell.openExternal('http://www.videolan.org/vlc/')
-    state.modal.vlcInstalled = true // Assume they'll install it successfully
-  }
-
-  function onPlay () {
-    dispatch('vlcPlay')
-  }
-}

renderer/views/update-available-modal.js

@@ -1,32 +0,0 @@
-module.exports = UpdateAvailableModal
-
-var h = require('virtual-dom/h')
-var hyperx = require('hyperx')
-var hx = hyperx(h)
-
-var electron = require('electron')
-
-var {dispatch} = require('../lib/dispatcher')
-
-function UpdateAvailableModal (state) {
-  return hx`
-    <div class='update-available-modal'>
-      <p><strong>A new version of WebTorrent is available: v${state.modal.version}</strong></p>
-      <p>We have an auto-updater for Windows and Mac. We don't have one for Linux yet, so you'll have to download the new version manually.</p>
-      <p>
-        <button class='primary' onclick=${handleOK}>Show Download Page</button>
-        <button class='cancel' onclick=${handleCancel}>Skip This Release</button>
-      </p>
-    </div>
-  `
-
-  function handleOK () {
-    electron.shell.openExternal('https://github.com/feross/webtorrent-desktop/releases')
-    dispatch('exitModal')
-  }
-
-  function handleCancel () {
-    dispatch('skipVersion', state.modal.version)
-    dispatch('exitModal')
-  }
-}

src/.babelrc

@@ -0,0 +1,6 @@
+{
+  "plugins": [
+    "syntax-jsx",
+    "transform-react-jsx"
+  ]
+}

src/config.js

@@ -0,0 +1,126 @@
+var appConfig = require('application-config')('WebTorrent')
+var fs = require('fs')
+var path = require('path')
+
+var APP_NAME = 'WebTorrent'
+var APP_TEAM = 'WebTorrent, LLC'
+var APP_VERSION = require('../package.json').version
+
+var PORTABLE_PATH = path.join(path.dirname(process.execPath), 'Portable Settings')
+
+module.exports = {
+  ANNOUNCEMENT_URL: 'https://webtorrent.io/desktop/announcement',
+  AUTO_UPDATE_URL: 'https://webtorrent.io/desktop/update',
+  CRASH_REPORT_URL: 'https://webtorrent.io/desktop/crash-report',
+  TELEMETRY_URL: 'https://webtorrent.io/desktop/telemetry',
+
+  APP_COPYRIGHT: 'Copyright © 2014-2016 ' + APP_TEAM,
+  APP_FILE_ICON: path.join(__dirname, '..', 'static', 'WebTorrentFile'),
+  APP_ICON: path.join(__dirname, '..', 'static', 'WebTorrent'),
+  APP_NAME: APP_NAME,
+  APP_TEAM: APP_TEAM,
+  APP_VERSION: APP_VERSION,
+  APP_WINDOW_TITLE: APP_NAME + ' (BETA)',
+
+  CONFIG_PATH: getConfigPath(),
+
+  DEFAULT_TORRENTS: [
+    {
+      name: 'Big Buck Bunny',
+      posterFileName: 'bigBuckBunny.jpg',
+      torrentFileName: 'bigBuckBunny.torrent'
+    },
+    {
+      name: 'Cosmos Laundromat (Preview)',
+      posterFileName: 'cosmosLaundromat.jpg',
+      torrentFileName: 'cosmosLaundromat.torrent'
+    },
+    {
+      name: 'Sintel',
+      posterFileName: 'sintel.jpg',
+      torrentFileName: 'sintel.torrent'
+    },
+    {
+      name: 'Tears of Steel',
+      posterFileName: 'tearsOfSteel.jpg',
+      torrentFileName: 'tearsOfSteel.torrent'
+    },
+    {
+      name: 'The WIRED CD - Rip. Sample. Mash. Share.',
+      posterFileName: 'wiredCd.jpg',
+      torrentFileName: 'wiredCd.torrent'
+    }
+  ],
+
+  DELAYED_INIT: 3000 /* 3 seconds */,
+
+  DEFAULT_DOWNLOAD_PATH: getDefaultDownloadPath(),
+
+  GITHUB_URL: 'https://github.com/feross/webtorrent-desktop',
+  GITHUB_URL_ISSUES: 'https://github.com/feross/webtorrent-desktop/issues',
+  GITHUB_URL_RAW: 'https://raw.githubusercontent.com/feross/webtorrent-desktop/master',
+
+  HOME_PAGE_URL: 'https://webtorrent.io',
+
+  IS_PORTABLE: isPortable(),
+  IS_PRODUCTION: isProduction(),
+
+  POSTER_PATH: path.join(getConfigPath(), 'Posters'),
+  ROOT_PATH: path.join(__dirname, '..'),
+  STATIC_PATH: path.join(__dirname, '..', 'static'),
+  TORRENT_PATH: path.join(getConfigPath(), 'Torrents'),
+
+  WINDOW_ABOUT: 'file://' + path.join(__dirname, '..', 'static', 'about.html'),
+  WINDOW_MAIN: 'file://' + path.join(__dirname, '..', 'static', 'main.html'),
+  WINDOW_WEBTORRENT: 'file://' + path.join(__dirname, '..', 'static', 'webtorrent.html'),
+
+  WINDOW_MIN_HEIGHT: 38 + (120 * 2), // header height + 2 torrents
+  WINDOW_MIN_WIDTH: 425
+}
+
+function getConfigPath () {
+  if (isPortable()) {
+    return PORTABLE_PATH
+  } else {
+    return path.dirname(appConfig.filePath)
+  }
+}
+
+function getDefaultDownloadPath () {
+  if (!process || !process.type) {
+    return ''
+  }
+
+  if (isPortable()) {
+    return path.join(getConfigPath(), 'Downloads')
+  }
+
+  var electron = require('electron')
+
+  return process.type === 'renderer'
+    ? electron.remote.app.getPath('downloads')
+    : electron.app.getPath('downloads')
+}
+
+function isPortable () {
+  try {
+    return process.platform === 'win32' && isProduction() && !!fs.statSync(PORTABLE_PATH)
+  } catch (err) {
+    return false
+  }
+}
+
+function isProduction () {
+  if (!process.versions.electron) {
+    return false
+  }
+  if (process.platform === 'darwin') {
+    return !/\/Electron\.app\//.test(process.execPath)
+  }
+  if (process.platform === 'win32') {
+    return !/\\electron\.exe$/.test(process.execPath)
+  }
+  if (process.platform === 'linux') {
+    return !/\/electron$/.test(process.execPath)
+  }
+}

src/main/announcement.js

@@ -0,0 +1,57 @@
+module.exports = {
+  init
+}
+
+var electron = require('electron')
+
+var config = require('../config')
+var log = require('./log')
+
+var ANNOUNCEMENT_URL = config.ANNOUNCEMENT_URL +
+  '?version=' + config.APP_VERSION +
+  '&platform=' + process.platform
+
+/**
+ * In certain situations, the WebTorrent team may need to show an announcement to
+ * all WebTorrent Desktop users. For example: a security notice, or an update
+ * notification (if the auto-updater stops working).
+ *
+ * When there is an announcement, the `ANNOUNCEMENT_URL` endpoint should return an
+ * HTTP 200 status code with a JSON object like this:
+ *
+ *   {
+ *     "title": "WebTorrent Desktop Announcement",
+ *     "message": "Security Issue in v0.xx",
+ *     "detail": "Please update to v0.xx as soon as possible..."
+ *   }
+ */
+function init () {
+  var get = require('simple-get')
+  get.concat(ANNOUNCEMENT_URL, onResponse)
+}
+
+function onResponse (err, res, data) {
+  if (err) return log(`Failed to retrieve announcement: ${err.message}`)
+  if (res.statusCode !== 200) return log('No announcement available')
+
+  try {
+    data = JSON.parse(data.toString())
+  } catch (err) {
+    // Support plaintext announcement messages, using a default title.
+    data = {
+      title: 'WebTorrent Desktop Announcement',
+      message: data.toString(),
+      detail: data.toString()
+    }
+  }
+
+  electron.dialog.showMessageBox({
+    type: 'info',
+    buttons: ['OK'],
+    title: data.title,
+    message: data.message,
+    detail: data.detail
+  }, noop)
+}
+
+function noop () {}

src/main/dialog.js

@@ -0,0 +1,121 @@
+module.exports = {
+  openSeedFile,
+  openSeedDirectory,
+  openTorrentFile,
+  openTorrentAddress,
+  openFiles
+}
+
+var electron = require('electron')
+
+var log = require('./log')
+var windows = require('./windows')
+
+/**
+ * Show open dialog to create a single-file torrent.
+ */
+function openSeedFile () {
+  if (!windows.main.win) return
+  log('openSeedFile')
+  var opts = {
+    title: 'Select a file for the torrent.',
+    properties: [ 'openFile' ]
+  }
+  setTitle(opts.title)
+  electron.dialog.showOpenDialog(windows.main.win, opts, function (selectedPaths) {
+    resetTitle()
+    if (!Array.isArray(selectedPaths)) return
+    windows.main.dispatch('showCreateTorrent', selectedPaths)
+  })
+}
+
+/*
+ * Show open dialog to create a single-file or single-directory torrent. On
+ * Windows and Linux, open dialogs are for files *or* directories only, not both,
+ * so this function shows a directory dialog on those platforms.
+ */
+function openSeedDirectory () {
+  if (!windows.main.win) return
+  log('openSeedDirectory')
+  var opts = process.platform === 'darwin'
+    ? {
+      title: 'Select a file or folder for the torrent.',
+      properties: [ 'openFile', 'openDirectory' ]
+    }
+    : {
+      title: 'Select a folder for the torrent.',
+      properties: [ 'openDirectory' ]
+    }
+  setTitle(opts.title)
+  electron.dialog.showOpenDialog(windows.main.win, opts, function (selectedPaths) {
+    resetTitle()
+    if (!Array.isArray(selectedPaths)) return
+    windows.main.dispatch('showCreateTorrent', selectedPaths)
+  })
+}
+
+/*
+ * Show flexible open dialog that supports selecting .torrent files to add, or
+ * a file or folder to create a single-file or single-directory torrent.
+ */
+function openFiles () {
+  if (!windows.main.win) return
+  log('openFiles')
+  var opts = process.platform === 'darwin'
+    ? {
+      title: 'Select a file or folder to add.',
+      properties: [ 'openFile', 'openDirectory' ]
+    }
+    : {
+      title: 'Select a file to add.',
+      properties: [ 'openFile' ]
+    }
+  setTitle(opts.title)
+  electron.dialog.showOpenDialog(windows.main.win, opts, function (selectedPaths) {
+    resetTitle()
+    if (!Array.isArray(selectedPaths)) return
+    windows.main.dispatch('onOpen', selectedPaths)
+  })
+}
+
+/*
+ * Show open dialog to open a .torrent file.
+ */
+function openTorrentFile () {
+  if (!windows.main.win) return
+  log('openTorrentFile')
+  var opts = {
+    title: 'Select a .torrent file.',
+    filters: [{ name: 'Torrent Files', extensions: ['torrent'] }],
+    properties: [ 'openFile', 'multiSelections' ]
+  }
+  setTitle(opts.title)
+  electron.dialog.showOpenDialog(windows.main.win, opts, function (selectedPaths) {
+    resetTitle()
+    if (!Array.isArray(selectedPaths)) return
+    selectedPaths.forEach(function (selectedPath) {
+      windows.main.dispatch('addTorrent', selectedPath)
+    })
+  })
+}
+
+/*
+ * Show modal dialog to open a torrent URL (magnet uri, http torrent link, etc.)
+ */
+function openTorrentAddress () {
+  log('openTorrentAddress')
+  windows.main.dispatch('openTorrentAddress')
+}
+
+/**
+ * Dialogs on do not show a title on Mac, so the window title is used instead.
+ */
+function setTitle (title) {
+  if (process.platform === 'darwin') {
+    windows.main.dispatch('setTitle', title)
+  }
+}
+
+function resetTitle () {
+  windows.main.dispatch('resetTitle')
+}

src/main/dock.js

@@ -0,0 +1,58 @@
+module.exports = {
+  downloadFinished,
+  init,
+  setBadge
+}
+
+var electron = require('electron')
+
+var app = electron.app
+
+var dialog = require('./dialog')
+var log = require('./log')
+
+/**
+ * Add a right-click menu to the dock icon. (Mac)
+ */
+function init () {
+  if (!app.dock) return
+  var menu = electron.Menu.buildFromTemplate(getMenuTemplate())
+  app.dock.setMenu(menu)
+}
+
+/**
+ * Bounce the Downloads stack if `path` is inside the Downloads folder. (Mac)
+ */
+function downloadFinished (path) {
+  if (!app.dock) return
+  log(`downloadFinished: ${path}`)
+  app.dock.downloadFinished(path)
+}
+
+/**
+ * Display a counter badge for the app. (Mac, Linux)
+ */
+function setBadge (count) {
+  log(`setBadge: ${count}`)
+  app.setBadgeCount(Number(count))
+}
+
+function getMenuTemplate () {
+  return [
+    {
+      label: 'Create New Torrent...',
+      accelerator: 'CmdOrCtrl+N',
+      click: () => dialog.openSeedDirectory()
+    },
+    {
+      label: 'Open Torrent File...',
+      accelerator: 'CmdOrCtrl+O',
+      click: () => dialog.openTorrentFile()
+    },
+    {
+      label: 'Open Torrent Address...',
+      accelerator: 'CmdOrCtrl+U',
+      click: () => dialog.openTorrentAddress()
+    }
+  ]
+}

src/main/handlers.js

@@ -3,9 +3,8 @@ module.exports = {
   uninstall
 }
 
-var path = require('path')
-
 var config = require('../config')
+var path = require('path')
 
 function install () {
   if (process.platform === 'darwin') {
@@ -35,11 +34,12 @@ function installDarwin () {
   var electron = require('electron')
   var app = electron.app
 
-  // On OS X, only protocols that are listed in Info.plist can be set as the default
-  // handler at runtime.
+  // On Mac, only protocols that are listed in `Info.plist` can be set as the
+  // default handler at runtime.
   app.setAsDefaultProtocolClient('magnet')
+  app.setAsDefaultProtocolClient('stream-magnet')
 
-  // File handlers are registered in the Info.plist.
+  // File handlers are defined in `Info.plist`.
 }
 
 function uninstallDarwin () {}
@@ -55,10 +55,28 @@ function installWin32 () {
 
   var log = require('./log')
 
-  var iconPath = path.join(process.resourcesPath, 'app.asar.unpacked', 'static', 'WebTorrentFile.ico')
-
-  registerProtocolHandlerWin32('magnet', 'URL:BitTorrent Magnet URL', iconPath, EXEC_COMMAND)
-  registerFileHandlerWin32('.torrent', 'io.webtorrent.torrent', 'BitTorrent Document', iconPath, EXEC_COMMAND)
+  var iconPath = path.join(
+    process.resourcesPath, 'app.asar.unpacked', 'static', 'WebTorrentFile.ico'
+  )
+  registerProtocolHandlerWin32(
+    'magnet',
+    'URL:BitTorrent Magnet URL',
+    iconPath,
+    EXEC_COMMAND
+  )
+  registerProtocolHandlerWin32(
+    'stream-magnet',
+    'URL:BitTorrent Stream-Magnet URL',
+    iconPath,
+    EXEC_COMMAND
+  )
+  registerFileHandlerWin32(
+    '.torrent',
+    'io.webtorrent.torrent',
+    'BitTorrent Document',
+    iconPath,
+    EXEC_COMMAND
+  )
 
   /**
    * To add a protocol handler, the following keys must be added to the Windows registry:
@@ -190,6 +208,7 @@ function uninstallWin32 () {
   var Registry = require('winreg')
 
   unregisterProtocolHandlerWin32('magnet', EXEC_COMMAND)
+  unregisterProtocolHandlerWin32('stream-magnet', EXEC_COMMAND)
   unregisterFileHandlerWin32('.torrent', 'io.webtorrent.torrent', EXEC_COMMAND)
 
   function unregisterProtocolHandlerWin32 (protocol, command) {
@@ -265,7 +284,9 @@ function installLinux () {
   installIconFile()
 
   function installDesktopFile () {
-    var templatePath = path.join(config.STATIC_PATH, 'linux', 'webtorrent-desktop.desktop')
+    var templatePath = path.join(
+      config.STATIC_PATH, 'linux', 'webtorrent-desktop.desktop'
+    )
     fs.readFile(templatePath, 'utf8', writeDesktopFile)
   }
 

src/main/index.js

@@ -5,24 +5,32 @@ var electron = require('electron')
 var app = electron.app
 var ipcMain = electron.ipcMain
 
+var announcement = require('./announcement')
 var config = require('../config')
 var crashReporter = require('../crash-reporter')
-var handlers = require('./handlers')
+var dialog = require('./dialog')
+var dock = require('./dock')
 var ipc = require('./ipc')
 var log = require('./log')
 var menu = require('./menu')
-var shortcuts = require('./shortcuts')
 var squirrelWin32 = require('./squirrel-win32')
 var tray = require('./tray')
 var updater = require('./updater')
+var userTasks = require('./user-tasks')
 var windows = require('./windows')
 
 var shouldQuit = false
 var argv = sliceArgv(process.argv)
 
+if (config.IS_PRODUCTION) {
+  // When Electron is running in production mode (packaged app), then run React
+  // in production mode too.
+  process.env.NODE_ENV = 'production'
+}
+
 if (process.platform === 'win32') {
   shouldQuit = squirrelWin32.handleEvent(argv[0])
-  argv = argv.filter((arg) => arg.indexOf('--squirrel') === -1)
+  argv = argv.filter((arg) => !arg.includes('--squirrel'))
 }
 
 if (!shouldQuit) {
@@ -53,23 +61,29 @@ function init () {
 
   ipc.init()
 
-  app.on('will-finish-launching', function () {
+  app.once('will-finish-launching', function () {
     crashReporter.init()
   })
 
   app.on('ready', function () {
     isReady = true
 
-    windows.createMainWindow()
-    windows.createWebTorrentHiddenWindow()
+    windows.main.init()
+    windows.webtorrent.init()
     menu.init()
-    shortcuts.init()
 
     // To keep app startup fast, some code is delayed.
     setTimeout(delayedInit, config.DELAYED_INIT)
+
+    // Report uncaught exceptions
+    process.on('uncaughtException', (err) => {
+      console.error(err)
+      var errJSON = {message: err.message, stack: err.stack}
+      windows.main.dispatch('uncaughtError', 'main', errJSON)
+    })
   })
 
-  app.on('ipcReady', function () {
+  app.once('ipcReady', function () {
     log('Command line args:', argv)
     processArgv(argv)
     console.timeEnd('init')
@@ -80,33 +94,37 @@ function init () {
 
     app.isQuitting = true
     e.preventDefault()
-    windows.main.send('dispatch', 'saveState') /* try to save state on exit */
+    windows.main.dispatch('saveState') // try to save state on exit
     ipcMain.once('savedState', () => app.quit())
-    setTimeout(() => app.quit(), 2000) /* quit after 2 secs, at most */
+    setTimeout(() => {
+      console.error('Saving state took too long. Quitting.')
+      app.quit()
+    }, 2000) // quit after 2 secs, at most
   })
 
   app.on('activate', function () {
-    if (isReady) windows.createMainWindow()
+    if (isReady) windows.main.show()
   })
 }
 
 function delayedInit () {
+  announcement.init()
+  dock.init()
   tray.init()
-  handlers.install()
   updater.init()
+  userTasks.init()
 }
 
 function onOpen (e, torrentId) {
   e.preventDefault()
 
   if (app.ipcReady) {
-    windows.main.send('dispatch', 'onOpen', torrentId)
-    // Magnet links opened from Chrome won't focus the app without a setTimeout. The
-    // confirmation dialog Chrome shows causes Chrome to steal back the focus.
+    // Magnet links opened from Chrome won't focus the app without a setTimeout.
+    // The confirmation dialog Chrome shows causes Chrome to steal back the focus.
     // Electron issue: https://github.com/atom/electron/issues/4338
-    setTimeout(function () {
-      windows.focusWindow(windows.main)
-    }, 100)
+    setTimeout(() => windows.main.show(), 100)
+
+    processArgv([ torrentId ])
   } else {
     argv.push(torrentId)
   }
@@ -117,7 +135,7 @@ function onAppOpen (newArgv) {
 
   if (app.ipcReady) {
     log('Second app instance opened, but was prevented:', newArgv)
-    windows.focusWindow(windows.main)
+    windows.main.show()
 
     processArgv(newArgv)
   } else {
@@ -130,18 +148,22 @@ function sliceArgv (argv) {
 }
 
 function processArgv (argv) {
+  var torrentIds = []
   argv.forEach(function (arg) {
     if (arg === '-n') {
-      menu.showOpenSeedFiles()
+      dialog.openSeedDirectory()
     } else if (arg === '-o') {
-      menu.showOpenTorrentFile()
+      dialog.openTorrentFile()
     } else if (arg === '-u') {
-      menu.showOpenTorrentAddress()
+      dialog.openTorrentAddress()
     } else if (arg.startsWith('-psn')) {
-      // Ignore OS X launchd "process serial number" argument
-      // More: https://github.com/feross/webtorrent-desktop/issues/214
+      // Ignore Mac launchd "process serial number" argument
+      // Issue: https://github.com/feross/webtorrent-desktop/issues/214
     } else {
-      windows.main.send('dispatch', 'onOpen', arg)
+      torrentIds.push(arg)
     }
   })
+  if (torrentIds.length > 0) {
+    windows.main.dispatch('onOpen', torrentIds)
+  }
 }

src/main/ipc.js

@@ -0,0 +1,192 @@
+module.exports = {
+  init
+}
+
+var electron = require('electron')
+
+var app = electron.app
+
+var dialog = require('./dialog')
+var dock = require('./dock')
+var handlers = require('./handlers')
+var log = require('./log')
+var menu = require('./menu')
+var powerSaveBlocker = require('./power-save-blocker')
+var shell = require('./shell')
+var shortcuts = require('./shortcuts')
+var vlc = require('./vlc')
+var windows = require('./windows')
+var thumbar = require('./thumbar')
+
+// Messages from the main process, to be sent once the WebTorrent process starts
+var messageQueueMainToWebTorrent = []
+
+// holds a ChildProcess while we're playing a video in VLC, null otherwise
+var vlcProcess
+
+function init () {
+  var ipc = electron.ipcMain
+
+  ipc.once('ipcReady', function (e) {
+    app.ipcReady = true
+    app.emit('ipcReady')
+  })
+
+  ipc.once('ipcReadyWebTorrent', function (e) {
+    app.ipcReadyWebTorrent = true
+    log('sending %d queued messages from the main win to the webtorrent window',
+      messageQueueMainToWebTorrent.length)
+    messageQueueMainToWebTorrent.forEach(function (message) {
+      windows.webtorrent.send(message.name, ...message.args)
+      log('webtorrent: sent queued %s', message.name)
+    })
+  })
+
+  /**
+   * Dialog
+   */
+
+  ipc.on('openTorrentFile', () => dialog.openTorrentFile())
+  ipc.on('openFiles', () => dialog.openFiles())
+
+  /**
+   * Dock
+   */
+
+  ipc.on('setBadge', (e, ...args) => dock.setBadge(...args))
+  ipc.on('downloadFinished', (e, ...args) => dock.downloadFinished(...args))
+
+  /**
+   * Events
+   */
+
+  ipc.on('onPlayerOpen', function () {
+    menu.setPlayerOpen(true)
+    powerSaveBlocker.enable()
+    shortcuts.enable()
+    thumbar.enable()
+  })
+
+  ipc.on('onPlayerClose', function () {
+    menu.setPlayerOpen(false)
+    powerSaveBlocker.disable()
+    shortcuts.disable()
+    thumbar.disable()
+  })
+
+  ipc.on('onPlayerPlay', function () {
+    powerSaveBlocker.enable()
+    thumbar.onPlayerPlay()
+  })
+
+  ipc.on('onPlayerPause', function () {
+    powerSaveBlocker.disable()
+    thumbar.onPlayerPause()
+  })
+
+  /**
+   * Shell
+   */
+
+  ipc.on('openItem', (e, ...args) => shell.openItem(...args))
+  ipc.on('showItemInFolder', (e, ...args) => shell.showItemInFolder(...args))
+  ipc.on('moveItemToTrash', (e, ...args) => shell.moveItemToTrash(...args))
+
+  /**
+   * File handlers
+   */
+  ipc.on('setDefaultFileHandler', (e, flag) => {
+    if (flag) handlers.install()
+    else handlers.uninstall()
+  })
+
+  /**
+   * Windows: Main
+   */
+
+  var main = windows.main
+
+  ipc.on('setAspectRatio', (e, ...args) => main.setAspectRatio(...args))
+  ipc.on('setBounds', (e, ...args) => main.setBounds(...args))
+  ipc.on('setProgress', (e, ...args) => main.setProgress(...args))
+  ipc.on('setTitle', (e, ...args) => main.setTitle(...args))
+  ipc.on('show', () => main.show())
+  ipc.on('toggleFullScreen', (e, ...args) => main.toggleFullScreen(...args))
+  ipc.on('setAllowNav', (e, ...args) => menu.setAllowNav(...args))
+
+  /**
+   * VLC
+   * TODO: Move most of this code to vlc.js
+   */
+
+  ipc.on('checkForVLC', function (e) {
+    vlc.checkForVLC(function (isInstalled) {
+      windows.main.send('checkForVLC', isInstalled)
+    })
+  })
+
+  ipc.on('vlcPlay', function (e, url, title) {
+    var args = ['--play-and-exit', '--video-on-top', '--no-video-title-show', '--quiet', `--meta-title=${title}`, url]
+    log('Running vlc ' + args.join(' '))
+
+    vlc.spawn(args, function (err, proc) {
+      if (err) return windows.main.dispatch('vlcNotFound')
+      vlcProcess = proc
+
+      // If it works, close the modal after a second
+      var closeModalTimeout = setTimeout(() =>
+        windows.main.dispatch('exitModal'), 1000)
+
+      vlcProcess.on('close', function (code) {
+        clearTimeout(closeModalTimeout)
+        if (!vlcProcess) return // Killed
+        log('VLC exited with code ', code)
+        if (code === 0) {
+          windows.main.dispatch('backToList')
+        } else {
+          windows.main.dispatch('vlcNotFound')
+        }
+        vlcProcess = null
+      })
+
+      vlcProcess.on('error', function (e) {
+        log('VLC error', e)
+      })
+    })
+  })
+
+  ipc.on('vlcQuit', function () {
+    if (!vlcProcess) return
+    log('Killing VLC, pid ' + vlcProcess.pid)
+    vlcProcess.kill('SIGKILL') // kill -9
+    vlcProcess = null
+  })
+
+  // Capture all events
+  var oldEmit = ipc.emit
+  ipc.emit = function (name, e, ...args) {
+    // Relay messages between the main window and the WebTorrent hidden window
+    if (name.startsWith('wt-') && !app.isQuitting) {
+      if (e.sender.browserWindowOptions.title === 'webtorrent-hidden-window') {
+        // Send message to main window
+        windows.main.send(name, ...args)
+        log('webtorrent: got %s', name)
+      } else if (app.ipcReadyWebTorrent) {
+        // Send message to webtorrent window
+        windows.webtorrent.send(name, ...args)
+        log('webtorrent: sent %s', name)
+      } else {
+        // Queue message for webtorrent window, it hasn't finished loading yet
+        messageQueueMainToWebTorrent.push({
+          name: name,
+          args: args
+        })
+        log('webtorrent: queueing %s', name)
+      }
+      return
+    }
+
+    // Emit all other events normally
+    oldEmit.call(ipc, name, e, ...args)
+  }
+}

src/main/log.js

@@ -9,7 +9,6 @@ module.exports.error = error
  */
 
 var electron = require('electron')
-
 var windows = require('./windows')
 
 var app = electron.app
@@ -18,7 +17,7 @@ function log (...args) {
   if (app.ipcReady) {
     windows.main.send('log', ...args)
   } else {
-    app.on('ipcReady', () => windows.main.send('log', ...args))
+    app.once('ipcReady', () => windows.main.send('log', ...args))
   }
 }
 
@@ -26,6 +25,6 @@ function error (...args) {
   if (app.ipcReady) {
     windows.main.send('error', ...args)
   } else {
-    app.on('ipcReady', () => windows.main.send('error', ...args))
+    app.once('ipcReady', () => windows.main.send('error', ...args))
   }
 }

src/main/menu.js

@@ -0,0 +1,369 @@
+module.exports = {
+  init,
+  setPlayerOpen,
+  setWindowFocus,
+  setAllowNav,
+  onToggleAlwaysOnTop,
+  onToggleFullScreen
+}
+
+var electron = require('electron')
+
+var app = electron.app
+
+var config = require('../config')
+var dialog = require('./dialog')
+var shell = require('./shell')
+var windows = require('./windows')
+
+var menu
+
+function init () {
+  menu = electron.Menu.buildFromTemplate(getMenuTemplate())
+  electron.Menu.setApplicationMenu(menu)
+}
+
+function setPlayerOpen (flag) {
+  getMenuItem('Play/Pause').enabled = flag
+  getMenuItem('Increase Volume').enabled = flag
+  getMenuItem('Decrease Volume').enabled = flag
+  getMenuItem('Step Forward').enabled = flag
+  getMenuItem('Step Backward').enabled = flag
+  getMenuItem('Increase Speed').enabled = flag
+  getMenuItem('Decrease Speed').enabled = flag
+  getMenuItem('Add Subtitles File...').enabled = flag
+}
+
+function setWindowFocus (flag) {
+  getMenuItem('Full Screen').enabled = flag
+  getMenuItem('Float on Top').enabled = flag
+}
+
+// Disallow opening more screens on top of the current one.
+function setAllowNav (flag) {
+  getMenuItem('Preferences').enabled = flag
+  getMenuItem('Create New Torrent...').enabled = flag
+  var item = getMenuItem('Create New Torrent from File...')
+  if (item) item.enabled = flag
+}
+
+function onToggleAlwaysOnTop (flag) {
+  getMenuItem('Float on Top').checked = flag
+}
+
+function onToggleFullScreen (flag) {
+  getMenuItem('Full Screen').checked = flag
+}
+
+function getMenuItem (label) {
+  for (var i = 0; i < menu.items.length; i++) {
+    var menuItem = menu.items[i].submenu.items.find(function (item) {
+      return item.label === label
+    })
+    if (menuItem) return menuItem
+  }
+}
+
+function getMenuTemplate () {
+  var template = [
+    {
+      label: 'File',
+      submenu: [
+        {
+          label: process.platform === 'darwin'
+            ? 'Create New Torrent...'
+            : 'Create New Torrent from Folder...',
+          accelerator: 'CmdOrCtrl+N',
+          click: () => dialog.openSeedDirectory()
+        },
+        {
+          label: 'Open Torrent File...',
+          accelerator: 'CmdOrCtrl+O',
+          click: () => dialog.openTorrentFile()
+        },
+        {
+          label: 'Open Torrent Address...',
+          accelerator: 'CmdOrCtrl+U',
+          click: () => dialog.openTorrentAddress()
+        },
+        {
+          type: 'separator'
+        },
+        {
+          role: 'close'
+        }
+      ]
+    },
+    {
+      label: 'Edit',
+      submenu: [
+        {
+          role: 'undo'
+        },
+        {
+          role: 'redo'
+        },
+        {
+          type: 'separator'
+        },
+        {
+          role: 'cut'
+        },
+        {
+          role: 'copy'
+        },
+        {
+          label: 'Paste Torrent Address',
+          role: 'paste'
+        },
+        {
+          role: 'delete'
+        },
+        {
+          role: 'selectall'
+        }
+      ]
+    },
+    {
+      label: 'View',
+      submenu: [
+        {
+          label: 'Full Screen',
+          type: 'checkbox',
+          accelerator: process.platform === 'darwin'
+            ? 'Ctrl+Command+F'
+            : 'F11',
+          click: () => windows.main.toggleFullScreen()
+        },
+        {
+          label: 'Float on Top',
+          type: 'checkbox',
+          click: () => windows.main.toggleAlwaysOnTop()
+        },
+        {
+          type: 'separator'
+        },
+        {
+          label: 'Go Back',
+          accelerator: 'Esc',
+          click: () => windows.main.dispatch('escapeBack')
+        },
+        {
+          type: 'separator'
+        },
+        {
+          label: 'Developer',
+          submenu: [
+            {
+              label: 'Developer Tools',
+              accelerator: process.platform === 'darwin'
+                ? 'Alt+Command+I'
+                : 'Ctrl+Shift+I',
+              click: () => windows.main.toggleDevTools()
+            },
+            {
+              label: 'Show WebTorrent Process',
+              accelerator: process.platform === 'darwin'
+                ? 'Alt+Command+P'
+                : 'Ctrl+Shift+P',
+              click: () => windows.webtorrent.toggleDevTools()
+            }
+          ]
+        }
+      ]
+    },
+    {
+      label: 'Playback',
+      submenu: [
+        {
+          label: 'Play/Pause',
+          accelerator: 'Space',
+          click: () => windows.main.dispatch('playPause'),
+          enabled: false
+        },
+        {
+          type: 'separator'
+        },
+        {
+          label: 'Increase Volume',
+          accelerator: 'CmdOrCtrl+Up',
+          click: () => windows.main.dispatch('changeVolume', 0.1),
+          enabled: false
+        },
+        {
+          label: 'Decrease Volume',
+          accelerator: 'CmdOrCtrl+Down',
+          click: () => windows.main.dispatch('changeVolume', -0.1),
+          enabled: false
+        },
+        {
+          type: 'separator'
+        },
+        {
+          label: 'Step Forward',
+          accelerator: process.platform === 'darwin'
+            ? 'CmdOrCtrl+Alt+Right'
+            : 'Alt+Right',
+          click: () => windows.main.dispatch('skip', 10),
+          enabled: false
+        },
+        {
+          label: 'Step Backward',
+          accelerator: process.platform === 'darwin'
+            ? 'CmdOrCtrl+Alt+Left'
+            : 'Alt+Left',
+          click: () => windows.main.dispatch('skip', -10),
+          enabled: false
+        },
+        {
+          type: 'separator'
+        },
+        {
+          label: 'Increase Speed',
+          accelerator: 'CmdOrCtrl+=',
+          click: () => windows.main.dispatch('changePlaybackRate', 1),
+          enabled: false
+        },
+        {
+          label: 'Decrease Speed',
+          accelerator: 'CmdOrCtrl+-',
+          click: () => windows.main.dispatch('changePlaybackRate', -1),
+          enabled: false
+        },
+        {
+          type: 'separator'
+        },
+        {
+          label: 'Add Subtitles File...',
+          click: () => windows.main.dispatch('openSubtitles'),
+          enabled: false
+        }
+      ]
+    },
+    {
+      label: 'Help',
+      role: 'help',
+      submenu: [
+        {
+          label: 'Learn more about ' + config.APP_NAME,
+          click: () => shell.openExternal(config.HOME_PAGE_URL)
+        },
+        {
+          label: 'Contribute on GitHub',
+          click: () => shell.openExternal(config.GITHUB_URL)
+        },
+        {
+          type: 'separator'
+        },
+        {
+          label: 'Report an Issue...',
+          click: () => shell.openExternal(config.GITHUB_URL_ISSUES)
+        }
+      ]
+    }
+  ]
+
+  if (process.platform === 'darwin') {
+    // Add WebTorrent app menu (Mac)
+    template.unshift({
+      label: config.APP_NAME,
+      submenu: [
+        {
+          role: 'about'
+        },
+        {
+          type: 'separator'
+        },
+        {
+          label: 'Preferences',
+          accelerator: 'Cmd+,',
+          click: () => windows.main.dispatch('preferences')
+        },
+        {
+          type: 'separator'
+        },
+        {
+          role: 'services',
+          submenu: []
+        },
+        {
+          type: 'separator'
+        },
+        {
+          role: 'hide'
+        },
+        {
+          role: 'hideothers'
+        },
+        {
+          role: 'unhide'
+        },
+        {
+          type: 'separator'
+        },
+        {
+          role: 'quit'
+        }
+      ]
+    })
+
+    // Add Window menu (Mac)
+    template.splice(5, 0, {
+      role: 'window',
+      submenu: [
+        {
+          role: 'minimize'
+        },
+        {
+          type: 'separator'
+        },
+        {
+          role: 'front'
+        }
+      ]
+    })
+  }
+
+  // On Windows and Linux, open dialogs do not support selecting both files and
+  // folders and files, so add an extra menu item so there is one for each type.
+  if (process.platform === 'linux' || process.platform === 'win32') {
+    // File menu (Windows, Linux)
+    template[0].submenu.unshift({
+      label: 'Create New Torrent from File...',
+      click: () => dialog.openSeedFile()
+    })
+
+    // Edit menu (Windows, Linux)
+    template[1].submenu.push(
+      {
+        type: 'separator'
+      },
+      {
+        label: 'Preferences',
+        accelerator: 'CmdOrCtrl+,',
+        click: () => windows.main.dispatch('preferences')
+      })
+
+    // Help menu (Windows, Linux)
+    template[4].submenu.push(
+      {
+        type: 'separator'
+      },
+      {
+        label: 'About ' + config.APP_NAME,
+        click: () => windows.about.init()
+      }
+    )
+  }
+  // Add "File > Quit" menu item so Linux distros where the system tray icon is
+  // missing will have a way to quit the app.
+  if (process.platform === 'linux') {
+    // File menu (Linux)
+    template[0].submenu.push({
+      label: 'Quit',
+      click: () => app.quit()
+    })
+  }
+
+  return template
+}

src/main/power-save-blocker.js

@@ -0,0 +1,30 @@
+module.exports = {
+  enable,
+  disable
+}
+
+var electron = require('electron')
+var log = require('./log')
+
+var blockId = 0
+
+/**
+ * Block the system from entering low-power (sleep) mode or turning off the
+ * display.
+ */
+function enable () {
+  disable() // Stop the previous power saver block, if one exists.
+  blockId = electron.powerSaveBlocker.start('prevent-display-sleep')
+  log(`powerSaveBlocker.enable: ${blockId}`)
+}
+
+/**
+ * Stop blocking the system from entering low-power mode.
+ */
+function disable () {
+  if (!electron.powerSaveBlocker.isStarted(blockId)) {
+    return
+  }
+  electron.powerSaveBlocker.stop(blockId)
+  log(`powerSaveBlocker.disable: ${blockId}`)
+}

src/main/shell.js

@@ -0,0 +1,41 @@
+module.exports = {
+  openExternal,
+  openItem,
+  showItemInFolder,
+  moveItemToTrash
+}
+
+var electron = require('electron')
+var log = require('./log')
+
+/**
+ * Open the given external protocol URL in the desktop’s default manner.
+ */
+function openExternal (url) {
+  log(`openExternal: ${url}`)
+  electron.shell.openExternal(url)
+}
+
+/**
+ * Open the given file in the desktop’s default manner.
+ */
+function openItem (path) {
+  log(`openItem: ${path}`)
+  electron.shell.openItem(path)
+}
+
+/**
+ * Show the given file in a file manager. If possible, select the file.
+ */
+function showItemInFolder (path) {
+  log(`showItemInFolder: ${path}`)
+  electron.shell.showItemInFolder(path)
+}
+
+/**
+ * Move the given file to trash and returns a boolean status for the operation.
+ */
+function moveItemToTrash (path) {
+  log(`moveItemToTrash: ${path}`)
+  electron.shell.moveItemToTrash(path)
+}

src/main/shortcuts.js

@@ -0,0 +1,20 @@
+module.exports = {
+  disable,
+  enable
+}
+
+var electron = require('electron')
+var windows = require('./windows')
+
+function enable () {
+  // Register play/pause media key, available on some keyboards.
+  electron.globalShortcut.register(
+    'MediaPlayPause',
+    () => windows.main.dispatch('playPause')
+  )
+}
+
+function disable () {
+  // Return the media key to the OS, so other apps can use it.
+  electron.globalShortcut.unregister('MediaPlayPause')
+}

src/main/squirrel-win32.js

@@ -12,8 +12,8 @@ var app = electron.app
 
 var handlers = require('./handlers')
 
-var exeName = path.basename(process.execPath)
-var updateDotExe = path.join(process.execPath, '..', '..', 'Update.exe')
+var EXE_NAME = path.basename(process.execPath)
+var UPDATE_EXE = path.join(process.execPath, '..', '..', 'Update.exe')
 
 function handleEvent (cmd) {
   if (cmd === '--squirrel-install') {
@@ -61,15 +61,17 @@ function handleEvent (cmd) {
   }
 
   if (cmd === '--squirrel-firstrun') {
-    // This is called on the app's first run. Do not quit, allow startup to continue.
+    // App is running for the first time. Do not quit, allow startup to continue.
     return false
   }
 
   return false
 }
 
-// Spawn a command and invoke the callback when it completes with an error and the output
-// from standard out.
+/**
+ * Spawn a command and invoke the callback when it completes with an error and
+ * the output from standard out.
+ */
 function spawn (command, args, cb) {
   var stdout = ''
 
@@ -99,24 +101,31 @@ function spawn (command, args, cb) {
   })
 }
 
-// Spawn Squirrel's Update.exe with the given arguments and invoke the callback when the
-// command completes.
+/**
+ * Spawn the Squirrel `Update.exe` command with the given arguments and invoke
+ * the callback when the command completes.
+ */
 function spawnUpdate (args, cb) {
-  spawn(updateDotExe, args, cb)
+  spawn(UPDATE_EXE, args, cb)
 }
 
-// Create desktop/start menu shortcuts using the Squirrel Update.exe command line API
+/**
+ * Create desktop and start menu shortcuts using the Squirrel `Update.exe`
+ * command.
+ */
 function createShortcuts (cb) {
-  spawnUpdate(['--createShortcut', exeName], cb)
+  spawnUpdate(['--createShortcut', EXE_NAME], cb)
 }
 
-// Update desktop/start menu shortcuts using the Squirrel Update.exe command line API
+/**
+ * Update desktop and start menu shortcuts using the Squirrel `Update.exe`
+ * command.
+ */
 function updateShortcuts (cb) {
   var homeDir = os.homedir()
   if (homeDir) {
     var desktopShortcutPath = path.join(homeDir, 'Desktop', 'WebTorrent.lnk')
-    // Check if the desktop shortcut has been previously deleted and and keep it deleted
-    // if it was
+    // If the desktop shortcut was deleted by the user, then keep it deleted.
     fs.access(desktopShortcutPath, function (err) {
       var desktopShortcutExists = !err
       createShortcuts(function () {
@@ -133,7 +142,10 @@ function updateShortcuts (cb) {
   }
 }
 
-// Remove desktop/start menu shortcuts using the Squirrel Update.exe command line API
+/**
+ * Remove desktop and start menu shortcuts using the Squirrel `Update.exe`
+ * command.
+ */
 function removeShortcuts (cb) {
-  spawnUpdate(['--removeShortcut', exeName], cb)
+  spawnUpdate(['--removeShortcut', EXE_NAME], cb)
 }

src/main/thumbar.js

@@ -0,0 +1,54 @@
+module.exports = {
+  disable,
+  enable,
+  onPlayerPause,
+  onPlayerPlay
+}
+
+/**
+ * On Windows, add a "thumbnail toolbar" with a play/pause button in the taskbar.
+ * This provides users a way to access play/pause functionality without restoring
+ * or activating the window.
+ */
+
+var path = require('path')
+var config = require('../config')
+
+var windows = require('./windows')
+
+/**
+ * Show the Windows thumbnail toolbar buttons.
+ */
+function enable () {
+  update(false)
+}
+
+/**
+ * Hide the Windows thumbnail toolbar buttons.
+ */
+function disable () {
+  windows.main.win.setThumbarButtons([])
+}
+
+function onPlayerPause () {
+  update(true)
+}
+
+function onPlayerPlay () {
+  update(false)
+}
+
+function update (isPaused) {
+  var icon = isPaused
+    ? 'PlayThumbnailBarButton.png'
+    : 'PauseThumbnailBarButton.png'
+
+  var buttons = [
+    {
+      tooltip: isPaused ? 'Play' : 'Pause',
+      icon: path.join(config.STATIC_PATH, icon),
+      click: () => windows.main.dispatch('playPause')
+    }
+  ]
+  windows.main.win.setThumbarButtons(buttons)
+}

src/main/tray.js

@@ -0,0 +1,109 @@
+module.exports = {
+  hasTray,
+  init,
+  setWindowFocus
+}
+
+var electron = require('electron')
+
+var app = electron.app
+
+var config = require('../config')
+var windows = require('./windows')
+
+var tray
+
+function init () {
+  if (process.platform === 'linux') {
+    initLinux()
+  }
+  if (process.platform === 'win32') {
+    initWin32()
+  }
+  // Mac apps generally do not have menu bar icons
+}
+
+/**
+ * Returns true if there a tray icon is active.
+ */
+function hasTray () {
+  return !!tray
+}
+
+function setWindowFocus (flag) {
+  if (!tray) return
+  updateTrayMenu()
+}
+
+function initLinux () {
+  checkLinuxTraySupport(function (supportsTray) {
+    if (supportsTray) createTray()
+  })
+}
+
+function initWin32 () {
+  createTray()
+}
+
+/**
+ * Check for libappindicator1 support before creating tray icon
+ */
+function checkLinuxTraySupport (cb) {
+  var cp = require('child_process')
+
+  // Check that we're on Ubuntu (or another debian system) and that we have
+  // libappindicator1. If WebTorrent was installed from the deb file, we should
+  // always have it. If it was installed from the zip file, we might not.
+  cp.exec('dpkg --get-selections libappindicator1', function (err, stdout) {
+    if (err) return cb(false)
+    // Unfortunately there's no cleaner way, as far as I can tell, to check
+    // whether a debian package is installed:
+    cb(stdout.endsWith('\tinstall\n'))
+  })
+}
+
+function createTray () {
+  tray = new electron.Tray(getIconPath())
+
+  // On Windows, left click opens the app, right click opens the context menu.
+  // On Linux, any click (left or right) opens the context menu.
+  tray.on('click', () => windows.main.show())
+
+  // Show the tray context menu, and keep the available commands up to date
+  updateTrayMenu()
+}
+
+function updateTrayMenu () {
+  var contextMenu = electron.Menu.buildFromTemplate(getMenuTemplate())
+  tray.setContextMenu(contextMenu)
+}
+
+function getMenuTemplate () {
+  return [
+    getToggleItem(),
+    {
+      label: 'Quit',
+      click: () => app.quit()
+    }
+  ]
+
+  function getToggleItem () {
+    if (windows.main.win.isVisible()) {
+      return {
+        label: 'Hide to tray',
+        click: () => windows.main.hide()
+      }
+    } else {
+      return {
+        label: 'Show WebTorrent',
+        click: () => windows.main.show()
+      }
+    }
+  }
+}
+
+function getIconPath () {
+  return process.platform === 'win32'
+    ? config.APP_ICON + '.ico'
+    : config.APP_ICON + '.png'
+}

src/main/updater.js

@@ -9,6 +9,10 @@ var config = require('../config')
 var log = require('./log')
 var windows = require('./windows')
 
+var AUTO_UPDATE_URL = config.AUTO_UPDATE_URL +
+  '?version=' + config.APP_VERSION +
+  '&platform=' + process.platform
+
 function init () {
   if (process.platform === 'linux') {
     initLinux()
@@ -17,27 +21,27 @@ function init () {
   }
 }
 
-// The Electron auto-updater does not support Linux yet, so manually check for updates and
-// `show the user a modal notification.
+// The Electron auto-updater does not support Linux yet, so manually check for
+// updates and show the user a modal notification.
 function initLinux () {
-  get.concat(config.AUTO_UPDATE_URL, onResponse)
+  get.concat(AUTO_UPDATE_URL, onResponse)
+}
 
-  function onResponse (err, res, data) {
-    if (err) return log(`Update error: ${err.message}`)
-    if (res.statusCode === 200) {
-      // Update available
-      try {
-        data = JSON.parse(data)
-      } catch (err) {
-        return log(`Update error: Invalid JSON response: ${err.message}`)
-      }
-      windows.main.send('dispatch', 'updateAvailable', data.version)
-    } else if (res.statusCode === 204) {
-      // No update available
-    } else {
-      // Unexpected status code
-      log(`Update error: Unexpected status code: ${res.statusCode}`)
+function onResponse (err, res, data) {
+  if (err) return log(`Update error: ${err.message}`)
+  if (res.statusCode === 200) {
+    // Update available
+    try {
+      data = JSON.parse(data)
+    } catch (err) {
+      return log(`Update error: Invalid JSON response: ${err.message}`)
     }
+    windows.main.dispatch('updateAvailable', data.version)
+  } else if (res.statusCode === 204) {
+    // No update available
+  } else {
+    // Unexpected status code
+    log(`Update error: Unexpected status code: ${res.statusCode}`)
   }
 }
 
@@ -59,7 +63,7 @@ function initDarwinWin32 () {
 
   electron.autoUpdater.on(
     'update-not-available',
-    () => log('Update not available')
+    () => log('No update available')
   )
 
   electron.autoUpdater.on(
@@ -67,5 +71,6 @@ function initDarwinWin32 () {
     (e, notes, name, date, url) => log(`Update downloaded: ${name}: ${url}`)
   )
 
-  electron.autoUpdater.setFeedURL(config.AUTO_UPDATE_URL)
+  electron.autoUpdater.setFeedURL(AUTO_UPDATE_URL)
+  electron.autoUpdater.checkForUpdates()
 }

src/main/user-tasks.js

@@ -0,0 +1,43 @@
+module.exports = {
+  init
+}
+
+var electron = require('electron')
+
+var app = electron.app
+
+/**
+ * Add a user task menu to the app icon on right-click. (Windows)
+ */
+function init () {
+  if (process.platform !== 'win32') return
+  app.setUserTasks(getUserTasks())
+}
+
+function getUserTasks () {
+  return [
+    {
+      arguments: '-n',
+      title: 'Create New Torrent...',
+      description: 'Create a new torrent'
+    },
+    {
+      arguments: '-o',
+      title: 'Open Torrent File...',
+      description: 'Open a .torrent file'
+    },
+    {
+      arguments: '-u',
+      title: 'Open Torrent Address...',
+      description: 'Open a torrent from a URL'
+    }
+  ].map(getUserTasksItem)
+}
+
+function getUserTasksItem (item) {
+  return Object.assign(item, {
+    program: process.execPath,
+    iconPath: process.execPath,
+    iconIndex: 0
+  })
+}

src/main/windows/about.js

@@ -0,0 +1,48 @@
+var about = module.exports = {
+  init,
+  win: null
+}
+
+var config = require('../../config')
+var electron = require('electron')
+
+function init () {
+  if (about.win) {
+    return about.win.show()
+  }
+
+  var win = about.win = new electron.BrowserWindow({
+    backgroundColor: '#ECECEC',
+    center: true,
+    fullscreen: false,
+    height: 170,
+    icon: getIconPath(),
+    maximizable: false,
+    minimizable: false,
+    resizable: false,
+    show: false,
+    skipTaskbar: true,
+    title: 'About ' + config.APP_WINDOW_TITLE,
+    useContentSize: true,
+    width: 300
+  })
+
+  win.loadURL(config.WINDOW_ABOUT)
+
+  // No menu on the About window
+  win.setMenu(null)
+
+  win.webContents.once('did-finish-load', function () {
+    win.show()
+  })
+
+  win.once('closed', function () {
+    about.win = null
+  })
+}
+
+function getIconPath () {
+  return process.platform === 'win32'
+    ? config.APP_ICON + '.ico'
+    : config.APP_ICON + '.png'
+}

src/main/windows/index.js

@@ -0,0 +1,3 @@
+exports.about = require('./about')
+exports.main = require('./main')
+exports.webtorrent = require('./webtorrent')

src/main/windows/main.js

@@ -0,0 +1,222 @@
+var main = module.exports = {
+  dispatch,
+  hide,
+  init,
+  send,
+  setAspectRatio,
+  setBounds,
+  setProgress,
+  setTitle,
+  show,
+  toggleAlwaysOnTop,
+  toggleDevTools,
+  toggleFullScreen,
+  win: null
+}
+
+var electron = require('electron')
+
+var app = electron.app
+
+var config = require('../../config')
+var log = require('../log')
+var menu = require('../menu')
+var tray = require('../tray')
+
+var HEADER_HEIGHT = 37
+var TORRENT_HEIGHT = 100
+
+function init () {
+  if (main.win) {
+    return main.win.show()
+  }
+  var win = main.win = new electron.BrowserWindow({
+    backgroundColor: '#1E1E1E',
+    darkTheme: true, // Forces dark theme (GTK+3)
+    icon: getIconPath(), // Window icon (Windows, Linux)
+    minWidth: config.WINDOW_MIN_WIDTH,
+    minHeight: config.WINDOW_MIN_HEIGHT,
+    title: config.APP_WINDOW_TITLE,
+    titleBarStyle: 'hidden-inset', // Hide title bar (Mac)
+    useContentSize: true, // Specify web page size without OS chrome
+    width: 500,
+    height: HEADER_HEIGHT + (TORRENT_HEIGHT * 6) // header height + 5 torrents
+  })
+
+  win.loadURL(config.WINDOW_MAIN)
+
+  if (win.setSheetOffset) win.setSheetOffset(HEADER_HEIGHT)
+
+  win.webContents.on('dom-ready', function () {
+    menu.onToggleFullScreen(main.win.isFullScreen())
+  })
+
+  win.on('blur', onWindowBlur)
+  win.on('focus', onWindowFocus)
+
+  win.on('hide', onWindowBlur)
+  win.on('show', onWindowFocus)
+
+  win.on('enter-full-screen', function () {
+    menu.onToggleFullScreen(true)
+    send('fullscreenChanged', true)
+    win.setMenuBarVisibility(false)
+  })
+
+  win.on('leave-full-screen', function () {
+    menu.onToggleFullScreen(false)
+    send('fullscreenChanged', false)
+    win.setMenuBarVisibility(true)
+  })
+
+  win.on('close', function (e) {
+    if (process.platform !== 'darwin' && !tray.hasTray()) {
+      app.quit()
+    } else if (!app.isQuitting) {
+      e.preventDefault()
+      hide()
+    }
+  })
+}
+
+function dispatch (...args) {
+  send('dispatch', ...args)
+}
+
+function hide () {
+  if (!main.win) return
+  main.win.send('dispatch', 'backToList')
+  main.win.hide()
+}
+
+function send (...args) {
+  if (!main.win) return
+  main.win.send(...args)
+}
+
+/**
+ * Enforce window aspect ratio. Remove with 0. (Mac)
+ */
+function setAspectRatio (aspectRatio) {
+  if (!main.win) return
+  main.win.setAspectRatio(aspectRatio)
+}
+
+/**
+ * Change the size of the window.
+ * TODO: Clean this up? Seems overly complicated.
+ */
+function setBounds (bounds, maximize) {
+  // Do nothing in fullscreen
+  if (!main.win || main.win.isFullScreen()) {
+    log('setBounds: not setting bounds because we\'re in full screen')
+    return
+  }
+
+  // Maximize or minimize, if the second argument is present
+  var willBeMaximized
+  if (maximize === true) {
+    if (!main.win.isMaximized()) {
+      log('setBounds: maximizing')
+      main.win.maximize()
+    }
+    willBeMaximized = true
+  } else if (maximize === false) {
+    if (main.win.isMaximized()) {
+      log('setBounds: unmaximizing')
+      main.win.unmaximize()
+    }
+    willBeMaximized = false
+  } else {
+    willBeMaximized = main.win.isMaximized()
+  }
+
+  // Assuming we're not maximized or maximizing, set the window size
+  if (!willBeMaximized) {
+    log('setBounds: setting bounds to ' + JSON.stringify(bounds))
+    if (bounds.x === null && bounds.y === null) {
+      // X and Y not specified? By default, center on current screen
+      var scr = electron.screen.getDisplayMatching(main.win.getBounds())
+      bounds.x = Math.round(scr.bounds.x + scr.bounds.width / 2 - bounds.width / 2)
+      bounds.y = Math.round(scr.bounds.y + scr.bounds.height / 2 - bounds.height / 2)
+      log('setBounds: centered to ' + JSON.stringify(bounds))
+    }
+    // Resize the window's content area (so window border doesn't need to be taken
+    // into account)
+    main.win.setContentBounds(bounds, true)
+  } else {
+    log('setBounds: not setting bounds because of window maximization')
+  }
+}
+
+/**
+ * Set progress bar to [0, 1]. Indeterminate when > 1. Remove with < 0.
+ */
+function setProgress (progress) {
+  if (!main.win) return
+  main.win.setProgressBar(progress)
+}
+
+function setTitle (title) {
+  if (!main.win) return
+  main.win.setTitle(title)
+}
+
+function show () {
+  if (!main.win) return
+  main.win.show()
+}
+
+// Sets whether the window should always show on top of other windows
+function toggleAlwaysOnTop (flag) {
+  if (!main.win) return
+  if (flag == null) {
+    flag = !main.win.isAlwaysOnTop()
+  }
+  log(`toggleAlwaysOnTop ${flag}`)
+  main.win.setAlwaysOnTop(flag)
+  menu.onToggleAlwaysOnTop(flag)
+}
+
+function toggleDevTools () {
+  if (!main.win) return
+  log('toggleDevTools')
+  if (main.win.webContents.isDevToolsOpened()) {
+    main.win.webContents.closeDevTools()
+  } else {
+    main.win.webContents.openDevTools({ detach: true })
+  }
+}
+
+function toggleFullScreen (flag) {
+  if (!main.win || !main.win.isVisible()) {
+    return
+  }
+
+  if (flag == null) flag = !main.win.isFullScreen()
+
+  log(`toggleFullScreen ${flag}`)
+
+  if (flag) {
+    // Fullscreen and aspect ratio do not play well together. (Mac)
+    main.win.setAspectRatio(0)
+  }
+
+  main.win.setFullScreen(flag)
+}
+
+function onWindowBlur () {
+  menu.setWindowFocus(false)
+  tray.setWindowFocus(false)
+}
+
+function onWindowFocus () {
+  menu.setWindowFocus(true)
+  tray.setWindowFocus(true)
+}
+
+function getIconPath () {
+  return process.platform === 'win32'
+    ? config.APP_ICON + '.ico'
+    : config.APP_ICON + '.png'
+}

src/main/windows/webtorrent.js

@@ -0,0 +1,62 @@
+var webtorrent = module.exports = {
+  init,
+  send,
+  show,
+  toggleDevTools,
+  win: null
+}
+
+var electron = require('electron')
+
+var config = require('../../config')
+var log = require('../log')
+
+function init () {
+  var win = webtorrent.win = new electron.BrowserWindow({
+    backgroundColor: '#1E1E1E',
+    center: true,
+    fullscreen: false,
+    fullscreenable: false,
+    height: 150,
+    maximizable: false,
+    minimizable: false,
+    resizable: false,
+    show: false,
+    skipTaskbar: true,
+    title: 'webtorrent-hidden-window',
+    useContentSize: true,
+    width: 150
+  })
+
+  win.loadURL(config.WINDOW_WEBTORRENT)
+
+  // Prevent killing the WebTorrent process
+  win.on('close', function (e) {
+    if (electron.app.isQuitting) {
+      return
+    }
+    e.preventDefault()
+    win.hide()
+  })
+}
+
+function show () {
+  if (!webtorrent.win) return
+  webtorrent.win.show()
+}
+
+function send (...args) {
+  if (!webtorrent.win) return
+  webtorrent.win.send(...args)
+}
+
+function toggleDevTools () {
+  if (!webtorrent.win) return
+  log('toggleDevTools')
+  if (webtorrent.win.webContents.isDevToolsOpened()) {
+    webtorrent.win.webContents.closeDevTools()
+    webtorrent.win.hide()
+  } else {
+    webtorrent.win.webContents.openDevTools({ detach: true })
+  }
+}

src/renderer/controllers/media-controller.js

@@ -0,0 +1,56 @@
+const electron = require('electron')
+
+const ipcRenderer = electron.ipcRenderer
+
+// Controls local play back: the <video>/<audio> tag and VLC
+// Does not control remote casting (Chromecast etc)
+module.exports = class MediaController {
+  constructor (state) {
+    this.state = state
+  }
+
+  mediaSuccess () {
+    this.state.playing.result = 'success'
+  }
+
+  mediaStalled () {
+    this.state.playing.isStalled = true
+  }
+
+  mediaError (error) {
+    var state = this.state
+    if (state.location.url() === 'player') {
+      state.playing.result = 'error'
+      state.playing.location = 'error'
+      ipcRenderer.send('checkForVLC')
+      ipcRenderer.once('checkForVLC', function (e, isInstalled) {
+        state.modal = {
+          id: 'unsupported-media-modal',
+          error: error,
+          vlcInstalled: isInstalled
+        }
+      })
+    }
+  }
+
+  mediaTimeUpdate () {
+    this.state.playing.lastTimeUpdate = new Date().getTime()
+    this.state.playing.isStalled = false
+  }
+
+  mediaMouseMoved () {
+    this.state.playing.mouseStationarySince = new Date().getTime()
+  }
+
+  vlcPlay () {
+    ipcRenderer.send('vlcPlay', this.state.server.localURL, this.state.window.title)
+    this.state.playing.location = 'vlc'
+  }
+
+  vlcNotFound () {
+    var modal = this.state.modal
+    if (modal && modal.id === 'unsupported-media-modal') {
+      modal.vlcNotFound = true
+    }
+  }
+}

src/renderer/controllers/playback-controller.js

@@ -0,0 +1,316 @@
+const electron = require('electron')
+const path = require('path')
+
+const Cast = require('../lib/cast')
+const {dispatch} = require('../lib/dispatcher')
+const telemetry = require('../lib/telemetry')
+const errors = require('../lib/errors')
+const sound = require('../lib/sound')
+const TorrentPlayer = require('../lib/torrent-player')
+const TorrentSummary = require('../lib/torrent-summary')
+const State = require('../lib/state')
+
+const ipcRenderer = electron.ipcRenderer
+
+// Controls playback of torrents and files within torrents
+// both local (<video>,<audio>,VLC) and remote (cast)
+module.exports = class PlaybackController {
+  constructor (state, config, update) {
+    this.state = state
+    this.config = config
+    this.update = update
+  }
+
+  // Play a file in a torrent.
+  // * Start torrenting, if necessary
+  // * Stream, if not already fully downloaded
+  // * If no file index is provided, pick the default file to play
+  playFile (infoHash, index /* optional */) {
+    this.state.location.go({
+      url: 'player',
+      setup: (cb) => {
+        this.play()
+        this.openPlayer(infoHash, index, cb)
+      },
+      destroy: () => this.closePlayer()
+    }, (err) => {
+      if (err) dispatch('error', err)
+    })
+  }
+
+  // Show a file in the OS, eg in Finder on a Mac
+  openItem (infoHash, index) {
+    var torrentSummary = TorrentSummary.getByKey(this.state, infoHash)
+    var filePath = path.join(
+      torrentSummary.path,
+      torrentSummary.files[index].path)
+    ipcRenderer.send('openItem', filePath)
+  }
+
+  // Toggle (play or pause) the currently playing media
+  playPause () {
+    var state = this.state
+    if (state.location.url() !== 'player') return
+
+    // force rerendering if window is hidden,
+    // in order to bypass `raf` and play/pause media immediately
+    var mediaTag = document.querySelector('video,audio')
+    if (!state.window.isVisible && mediaTag) {
+      if (state.playing.isPaused) mediaTag.play()
+      else mediaTag.pause()
+    }
+
+    if (state.playing.isPaused) this.play()
+    else this.pause()
+  }
+
+  // Play (unpause) the current media
+  play () {
+    var state = this.state
+    if (!state.playing.isPaused) return
+    state.playing.isPaused = false
+    if (isCasting(state)) {
+      Cast.play()
+    }
+    ipcRenderer.send('onPlayerPlay')
+  }
+
+  // Pause the currently playing media
+  pause () {
+    var state = this.state
+    if (state.playing.isPaused) return
+    state.playing.isPaused = true
+    if (isCasting(state)) {
+      Cast.pause()
+    }
+    ipcRenderer.send('onPlayerPause')
+  }
+
+  // Skip specified number of seconds (backwards if negative)
+  skip (time) {
+    this.skipTo(this.state.playing.currentTime + time)
+  }
+
+  // Skip (aka seek) to a specific point, in seconds
+  skipTo (time) {
+    if (isCasting(this.state)) Cast.seek(time)
+    else this.state.playing.jumpToTime = time
+  }
+
+  // Change playback speed. 1 = faster, -1 = slower
+  // Playback speed ranges from 16 (fast forward) to 1 (normal playback)
+  // to 0.25 (quarter-speed playback), then goes to -0.25, -0.5, -1, -2, etc
+  // until -16 (fast rewind)
+  changePlaybackRate (direction) {
+    var state = this.state
+    var rate = state.playing.playbackRate
+    if (direction > 0 && rate >= 0.25 && rate < 2) {
+      rate += 0.25
+    } else if (direction < 0 && rate > 0.25 && rate <= 2) {
+      rate -= 0.25
+    } else if (direction < 0 && rate === 0.25) { /* when we set playback rate at 0 in html 5, playback hangs ;( */
+      rate = -1
+    } else if (direction > 0 && rate === -1) {
+      rate = 0.25
+    } else if ((direction > 0 && rate >= 1 && rate < 16) || (direction < 0 && rate > -16 && rate <= -1)) {
+      rate *= 2
+    } else if ((direction < 0 && rate > 1 && rate <= 16) || (direction > 0 && rate >= -16 && rate < -1)) {
+      rate /= 2
+    }
+    state.playing.playbackRate = rate
+    if (isCasting(state) && !Cast.setRate(rate)) {
+      state.playing.playbackRate = 1
+    }
+  }
+
+  // Change the volume, in range [0, 1], by some amount
+  // For example, volume muted (0), changeVolume (0.3) increases to 30% volume
+  changeVolume (delta) {
+    // change volume with delta value
+    this.setVolume(this.state.playing.volume + delta)
+  }
+
+  // Set the volume to some value in [0, 1]
+  setVolume (volume) {
+    // check if its in [0.0 - 1.0] range
+    volume = Math.max(0, Math.min(1, volume))
+
+    var state = this.state
+    if (isCasting(state)) {
+      Cast.setVolume(volume)
+    } else {
+      state.playing.setVolume = volume
+    }
+  }
+
+  // Hide player controls while playing video, if the mouse stays still for a while
+  // Never hide the controls when:
+  // * The mouse is over the controls or we're scrubbing (see CSS)
+  // * The video is paused
+  // * The video is playing remotely on Chromecast or Airplay
+  showOrHidePlayerControls () {
+    var state = this.state
+    var hideControls = state.location.url() === 'player' &&
+      state.playing.mouseStationarySince !== 0 &&
+      new Date().getTime() - state.playing.mouseStationarySince > 2000 &&
+      !state.playing.isPaused &&
+      state.playing.location === 'local'
+
+    if (hideControls !== state.playing.hideControls) {
+      state.playing.hideControls = hideControls
+      return true
+    }
+    return false
+  }
+
+  // Opens the video player to a specific torrent
+  openPlayer (infoHash, index, cb) {
+    var torrentSummary = TorrentSummary.getByKey(this.state, infoHash)
+
+    // automatically choose which file in the torrent to play, if necessary
+    if (index === undefined) index = torrentSummary.defaultPlayFileIndex
+    if (index === undefined) index = TorrentPlayer.pickFileToPlay(torrentSummary.files)
+    if (index === undefined) return cb(new errors.UnplayableError())
+
+    // update UI to show pending playback
+    if (torrentSummary.progress !== 1) sound.play('PLAY')
+    // TODO: remove torrentSummary.playStatus
+    torrentSummary.playStatus = 'requested'
+    this.update()
+
+    var timeout = setTimeout(() => {
+      telemetry.logPlayAttempt('timeout')
+      // TODO: remove torrentSummary.playStatus
+      torrentSummary.playStatus = 'timeout' /* no seeders available? */
+      sound.play('ERROR')
+      cb(new Error('Playback timed out. Try again.'))
+      this.update()
+    }, 10000) /* give it a few seconds */
+
+    if (torrentSummary.status === 'paused') {
+      dispatch('startTorrentingSummary', torrentSummary.torrentKey)
+      ipcRenderer.once('wt-ready-' + torrentSummary.infoHash,
+        () => this.openPlayerFromActiveTorrent(torrentSummary, index, timeout, cb))
+    } else {
+      this.openPlayerFromActiveTorrent(torrentSummary, index, timeout, cb)
+    }
+  }
+
+  openPlayerFromActiveTorrent (torrentSummary, index, timeout, cb) {
+    var fileSummary = torrentSummary.files[index]
+
+    // update state
+    var state = this.state
+    state.playing.infoHash = torrentSummary.infoHash
+    state.playing.fileIndex = index
+    state.playing.type = TorrentPlayer.isVideo(fileSummary) ? 'video'
+      : TorrentPlayer.isAudio(fileSummary) ? 'audio'
+      : 'other'
+
+    // pick up where we left off
+    if (fileSummary.currentTime) {
+      var fraction = fileSummary.currentTime / fileSummary.duration
+      var secondsLeft = fileSummary.duration - fileSummary.currentTime
+      if (fraction < 0.9 && secondsLeft > 10) {
+        state.playing.jumpToTime = fileSummary.currentTime
+      }
+    }
+
+    // if it's audio, parse out the metadata (artist, title, etc)
+    if (state.playing.type === 'audio' && !fileSummary.audioInfo) {
+      ipcRenderer.send('wt-get-audio-metadata', torrentSummary.infoHash, index)
+    }
+
+    // if it's video, check for subtitles files that are done downloading
+    dispatch('checkForSubtitles')
+
+    // enable previously selected subtitle track
+    if (fileSummary.selectedSubtitle) {
+      dispatch('addSubtitles', [fileSummary.selectedSubtitle], true)
+    }
+
+    ipcRenderer.send('wt-start-server', torrentSummary.infoHash, index)
+    ipcRenderer.once('wt-server-' + torrentSummary.infoHash, (e, info) => {
+      clearTimeout(timeout)
+
+      // if we timed out (user clicked play a long time ago), don't autoplay
+      var timedOut = torrentSummary.playStatus === 'timeout'
+      delete torrentSummary.playStatus
+      if (timedOut) {
+        ipcRenderer.send('wt-stop-server')
+        return this.update()
+      }
+
+      // play in VLC if set as default player (Preferences / Playback / Play in VLC)
+      if (this.state.saved.prefs.playInVlc) {
+        dispatch('vlcPlay')
+        this.update()
+        cb()
+        return
+      }
+
+      // otherwise, play the video
+      state.window.title = torrentSummary.files[state.playing.fileIndex].name
+      this.update()
+
+      ipcRenderer.send('onPlayerOpen')
+      cb()
+    })
+  }
+
+  closePlayer () {
+    console.log('closePlayer')
+
+    // Quit any external players, like Chromecast/Airplay/etc or VLC
+    var state = this.state
+    if (isCasting(state)) {
+      Cast.stop()
+    }
+    if (state.playing.location === 'vlc') {
+      ipcRenderer.send('vlcQuit')
+    }
+
+    // Save volume (this session only, not in state.saved)
+    state.previousVolume = state.playing.volume
+
+    // Telemetry: track what happens after the user clicks play
+    var result = state.playing.result // 'success' or 'error'
+    if (result === 'success') telemetry.logPlayAttempt('success') // first frame displayed
+    else if (result === 'error') telemetry.logPlayAttempt('error') // codec missing, etc
+    else if (result === undefined) telemetry.logPlayAttempt('abandoned') // user exited before first frame
+    else console.error('Unknown state.playing.result', state.playing.result)
+
+    // Reset the window contents back to the home screen
+    state.playing = State.getDefaultPlayState()
+    state.server = null
+
+    // Reset the window size and location back to where it was
+    if (state.window.isFullScreen) {
+      dispatch('toggleFullScreen', false)
+    }
+    restoreBounds(state)
+
+    // Tell the WebTorrent process to kill the torrent-to-HTTP server
+    ipcRenderer.send('wt-stop-server')
+
+    ipcRenderer.send('onPlayerClose')
+
+    this.update()
+  }
+}
+
+// Checks whether we are connected and already casting
+// Returns false if we not casting (state.playing.location === 'local')
+// or if we're trying to connect but haven't yet ('chromecast-pending', etc)
+function isCasting (state) {
+  return state.playing.location === 'chromecast' ||
+    state.playing.location === 'airplay' ||
+    state.playing.location === 'dlna'
+}
+
+function restoreBounds (state) {
+  ipcRenderer.send('setAspectRatio', 0)
+  if (state.window.bounds) {
+    ipcRenderer.send('setBounds', state.window.bounds, false)
+  }
+}

src/renderer/controllers/prefs-controller.js

@@ -0,0 +1,56 @@
+const State = require('../lib/state')
+const {dispatch} = require('../lib/dispatcher')
+const ipcRenderer = require('electron').ipcRenderer
+
+// Controls the Preferences screen
+module.exports = class PrefsController {
+  constructor (state, config) {
+    this.state = state
+    this.config = config
+  }
+
+  // Goes to the Preferences screen
+  show () {
+    var state = this.state
+    state.location.go({
+      url: 'preferences',
+      setup: function (cb) {
+        // initialize preferences
+        state.window.title = 'Preferences'
+        state.unsaved = Object.assign(state.unsaved || {}, {prefs: state.saved.prefs || {}})
+        ipcRenderer.send('setAllowNav', false)
+        cb()
+      },
+      destroy: () => {
+        ipcRenderer.send('setAllowNav', true)
+        this.save()
+      }
+    })
+  }
+
+  // Updates a single property in the UNSAVED prefs
+  // For example: updatePreferences('foo.bar', 'baz')
+  // Call save() to save to config.json
+  update (property, value) {
+    var path = property.split('.')
+    var key = this.state.unsaved.prefs
+    for (var i = 0; i < path.length - 1; i++) {
+      if (typeof key[path[i]] === 'undefined') {
+        key[path[i]] = {}
+      }
+      key = key[path[i]]
+    }
+    key[path[i]] = value
+  }
+
+  // All unsaved prefs take effect atomically, and are saved to config.json
+  save () {
+    var state = this.state
+    if (state.unsaved.prefs.isFileHandler !== state.saved.prefs.isFileHandler) {
+      ipcRenderer.send('setDefaultFileHandler', state.unsaved.prefs.isFileHandler)
+    }
+    state.saved.prefs = Object.assign(state.saved.prefs || {}, state.unsaved.prefs)
+    State.save(state)
+    dispatch('checkDownloadPath')
+  }
+}

src/renderer/controllers/subtitles-controller.js

@@ -0,0 +1,137 @@
+const electron = require('electron')
+const fs = require('fs-extra')
+const path = require('path')
+const parallel = require('run-parallel')
+
+const {dispatch} = require('../lib/dispatcher')
+
+module.exports = class SubtitlesController {
+  constructor (state) {
+    this.state = state
+  }
+
+  openSubtitles () {
+    electron.remote.dialog.showOpenDialog({
+      title: 'Select a subtitles file.',
+      filters: [ { name: 'Subtitles', extensions: ['vtt', 'srt'] } ],
+      properties: [ 'openFile' ]
+    }, (filenames) => {
+      if (!Array.isArray(filenames)) return
+      this.addSubtitles(filenames, true)
+    })
+  }
+
+  selectSubtitle (ix) {
+    this.state.playing.subtitles.selectedIndex = ix
+  }
+
+  toggleSubtitlesMenu () {
+    var subtitles = this.state.playing.subtitles
+    subtitles.showMenu = !subtitles.showMenu
+  }
+
+  addSubtitles (files, autoSelect) {
+    var state = this.state
+    // Subtitles are only supported when playing video files
+    if (state.playing.type !== 'video') return
+    if (files.length === 0) return
+    var subtitles = state.playing.subtitles
+
+    // Read the files concurrently, then add all resulting subtitle tracks
+    var tasks = files.map((file) => (cb) => loadSubtitle(file, cb))
+    parallel(tasks, function (err, tracks) {
+      if (err) return dispatch('error', err)
+
+      for (var i = 0; i < tracks.length; i++) {
+        // No dupes allowed
+        var track = tracks[i]
+        var trackIndex = state.playing.subtitles.tracks
+          .findIndex((t) => track.filePath === t.filePath)
+
+        // Add the track
+        if (trackIndex === -1) {
+          trackIndex = state.playing.subtitles.tracks.push(track) - 1
+        }
+
+        // If we're auto-selecting a track, try to find one in the user's language
+        if (autoSelect && (i === 0 || isSystemLanguage(track.language))) {
+          state.playing.subtitles.selectedIndex = trackIndex
+        }
+      }
+
+      // Finally, make sure no two tracks have the same label
+      relabelSubtitles(subtitles)
+    })
+  }
+
+  checkForSubtitles () {
+    if (this.state.playing.type !== 'video') return
+    var torrentSummary = this.state.getPlayingTorrentSummary()
+    if (!torrentSummary || !torrentSummary.progress) return
+
+    torrentSummary.progress.files.forEach((fp, ix) => {
+      if (fp.numPieces !== fp.numPiecesPresent) return // ignore incomplete files
+      var file = torrentSummary.files[ix]
+      if (!this.isSubtitle(file.name)) return
+      var filePath = path.join(torrentSummary.path, file.path)
+      this.addSubtitles([filePath], false)
+    })
+  }
+
+  isSubtitle (file) {
+    var name = typeof file === 'string' ? file : file.name
+    var ext = path.extname(name).toLowerCase()
+    return ext === '.srt' || ext === '.vtt'
+  }
+}
+
+function loadSubtitle (file, cb) {
+  // Lazy load to keep startup fast
+  var concat = require('simple-concat')
+  var LanguageDetect = require('languagedetect')
+  var srtToVtt = require('srt-to-vtt')
+
+  // Read the .SRT or .VTT file, parse it, add subtitle track
+  var filePath = file.path || file
+
+  var vttStream = fs.createReadStream(filePath).pipe(srtToVtt())
+
+  concat(vttStream, function (err, buf) {
+    if (err) return dispatch('error', 'Can\'t parse subtitles file.')
+
+    // Detect what language the subtitles are in
+    var vttContents = buf.toString().replace(/(.*-->.*)/g, '')
+    var langDetected = (new LanguageDetect()).detect(vttContents, 2)
+    langDetected = langDetected.length ? langDetected[0][0] : 'subtitle'
+    langDetected = langDetected.slice(0, 1).toUpperCase() + langDetected.slice(1)
+
+    var track = {
+      buffer: 'data:text/vtt;base64,' + buf.toString('base64'),
+      language: langDetected,
+      label: langDetected,
+      filePath: filePath
+    }
+
+    cb(null, track)
+  })
+}
+
+// Checks whether a language name like 'English' or 'German' matches the system
+// language, aka the current locale
+function isSystemLanguage (language) {
+  var iso639 = require('iso-639-1')
+  var osLangISO = window.navigator.language.split('-')[0] // eg 'en'
+  var langIso = iso639.getCode(language) // eg 'de' if language is 'German'
+  return langIso === osLangISO
+}
+
+// Make sure we don't have two subtitle tracks with the same label
+// Labels each track by language, eg 'German', 'English', 'English 2', ...
+function relabelSubtitles (subtitles) {
+  var counts = {}
+  subtitles.tracks.forEach(function (track) {
+    var lang = track.language
+    counts[lang] = (counts[lang] || 0) + 1
+    track.label = counts[lang] > 1 ? (lang + ' ' + counts[lang]) : lang
+  })
+}

src/renderer/controllers/torrent-controller.js

@@ -0,0 +1,190 @@
+const path = require('path')
+const ipcRenderer = require('electron').ipcRenderer
+
+const TorrentSummary = require('../lib/torrent-summary')
+const TorrentPlayer = require('../lib/torrent-player')
+const sound = require('../lib/sound')
+const {dispatch} = require('../lib/dispatcher')
+
+module.exports = class TorrentController {
+  constructor (state) {
+    this.state = state
+  }
+
+  torrentInfoHash (torrentKey, infoHash) {
+    var torrentSummary = this.getTorrentSummary(torrentKey)
+    console.log('got infohash for %s torrent %s',
+      torrentSummary ? 'existing' : 'new', torrentKey)
+
+    if (!torrentSummary) {
+      var torrents = this.state.saved.torrents
+
+      // Check if an existing (non-active) torrent has the same info hash
+      if (torrents.find((t) => t.infoHash === infoHash)) {
+        ipcRenderer.send('wt-stop-torrenting', infoHash)
+        return dispatch('error', 'Cannot add duplicate torrent')
+      }
+
+      torrentSummary = {
+        torrentKey: torrentKey,
+        status: 'new'
+      }
+      torrents.unshift(torrentSummary)
+      sound.play('ADD')
+    }
+
+    torrentSummary.infoHash = infoHash
+    dispatch('update')
+  }
+
+  torrentWarning (torrentKey, message) {
+    console.log('warning for torrent %s: %s', torrentKey, message)
+  }
+
+  torrentError (torrentKey, message) {
+    // TODO: WebTorrent needs semantic errors
+    if (message.startsWith('Cannot add duplicate torrent')) {
+      // Remove infohash from the message
+      message = 'Cannot add duplicate torrent'
+    }
+    dispatch('error', message)
+
+    var torrentSummary = this.getTorrentSummary(torrentKey)
+    if (torrentSummary) {
+      console.log('Pausing torrent %s due to error: %s', torrentSummary.infoHash, message)
+      torrentSummary.status = 'paused'
+      dispatch('update')
+    }
+  }
+
+  torrentMetadata (torrentKey, torrentInfo) {
+    // Summarize torrent
+    var torrentSummary = this.getTorrentSummary(torrentKey)
+    torrentSummary.status = 'downloading'
+    torrentSummary.name = torrentSummary.displayName || torrentInfo.name
+    torrentSummary.path = torrentInfo.path
+    torrentSummary.magnetURI = torrentInfo.magnetURI
+    // TODO: make torrentInfo immutable, save separately as torrentSummary.info
+    // For now, check whether torrentSummary.files has already been set:
+    var hasDetailedFileInfo = torrentSummary.files && torrentSummary.files[0].path
+    if (!hasDetailedFileInfo) {
+      torrentSummary.files = torrentInfo.files
+    }
+    if (!torrentSummary.selections) {
+      torrentSummary.selections = torrentSummary.files.map((x) => true)
+    }
+    torrentSummary.defaultPlayFileIndex = TorrentPlayer.pickFileToPlay(torrentInfo.files)
+    dispatch('update')
+
+    // Save the .torrent file, if it hasn't been saved already
+    if (!torrentSummary.torrentFileName) ipcRenderer.send('wt-save-torrent-file', torrentKey)
+
+    // Auto-generate a poster image, if it hasn't been generated already
+    if (!torrentSummary.posterFileName) ipcRenderer.send('wt-generate-torrent-poster', torrentKey)
+  }
+
+  torrentDone (torrentKey, torrentInfo) {
+    // Update the torrent summary
+    var torrentSummary = this.getTorrentSummary(torrentKey)
+    torrentSummary.status = 'seeding'
+
+    // Notify the user that a torrent finished, but only if we actually DL'd at least part of it.
+    // Don't notify if we merely finished verifying data files that were already on disk.
+    if (torrentInfo.bytesReceived > 0) {
+      if (!this.state.window.isFocused) {
+        this.state.dock.badge += 1
+      }
+      showDoneNotification(torrentSummary)
+      ipcRenderer.send('downloadFinished', getTorrentPath(torrentSummary))
+    }
+
+    dispatch('update')
+  }
+
+  torrentProgress (progressInfo) {
+    // Overall progress across all active torrents, 0 to 1
+    var progress = progressInfo.progress
+    var hasActiveTorrents = progressInfo.hasActiveTorrents
+
+    // Hide progress bar when client has no torrents, or progress is 100%
+    // TODO: isn't this equivalent to: if (progress === 1) ?
+    if (!hasActiveTorrents || progress === 1) {
+      progress = -1
+    }
+
+    // Show progress bar under the WebTorrent taskbar icon, on OSX
+    this.state.dock.progress = progress
+
+    // Update progress for each individual torrent
+    progressInfo.torrents.forEach((p) => {
+      var torrentSummary = this.getTorrentSummary(p.torrentKey)
+      if (!torrentSummary) {
+        console.log('warning: got progress for missing torrent %s', p.torrentKey)
+        return
+      }
+      torrentSummary.progress = p
+    })
+
+    // TODO: Find an efficient way to re-enable this line, which allows subtitle
+    //       files which are completed after a video starts to play to be added
+    //       dynamically to the list of subtitles.
+    // checkForSubtitles()
+  }
+
+  torrentFileModtimes (torrentKey, fileModtimes) {
+    var torrentSummary = this.getTorrentSummary(torrentKey)
+    torrentSummary.fileModtimes = fileModtimes
+    dispatch('saveStateThrottled')
+  }
+
+  torrentFileSaved (torrentKey, torrentFileName) {
+    console.log('torrent file saved %s: %s', torrentKey, torrentFileName)
+    var torrentSummary = this.getTorrentSummary(torrentKey)
+    torrentSummary.torrentFileName = torrentFileName
+    dispatch('saveStateThrottled')
+  }
+
+  torrentPosterSaved (torrentKey, posterFileName) {
+    var torrentSummary = this.getTorrentSummary(torrentKey)
+    torrentSummary.posterFileName = posterFileName
+    dispatch('saveStateThrottled')
+  }
+
+  torrentAudioMetadata (infoHash, index, info) {
+    var torrentSummary = this.getTorrentSummary(infoHash)
+    var fileSummary = torrentSummary.files[index]
+    fileSummary.audioInfo = info
+    dispatch('update')
+  }
+
+  torrentServerRunning (serverInfo) {
+    this.state.server = serverInfo
+  }
+
+  // Gets a torrent summary {name, infoHash, status} from state.saved.torrents
+  // Returns undefined if we don't know that infoHash
+  getTorrentSummary (torrentKey) {
+    return TorrentSummary.getByKey(this.state, torrentKey)
+  }
+}
+
+function getTorrentPath (torrentSummary) {
+  var itemPath = TorrentSummary.getFileOrFolder(torrentSummary)
+  if (torrentSummary.files.length > 1) {
+    itemPath = path.dirname(itemPath)
+  }
+  return itemPath
+}
+
+function showDoneNotification (torrent) {
+  var notif = new window.Notification('Download Complete', {
+    body: torrent.name,
+    silent: true
+  })
+
+  notif.onClick = function () {
+    ipcRenderer.send('show')
+  }
+
+  sound.play('DONE')
+}

src/renderer/controllers/torrent-list-controller.js

@@ -0,0 +1,294 @@
+const fs = require('fs')
+const path = require('path')
+const electron = require('electron')
+
+const {dispatch} = require('../lib/dispatcher')
+const State = require('../lib/state')
+const sound = require('../lib/sound')
+const TorrentSummary = require('../lib/torrent-summary')
+
+const ipcRenderer = electron.ipcRenderer
+
+const instantIoRegex = /^(https:\/\/)?instant\.io\/#/
+
+// Controls the torrent list: creating, adding, deleting, & manipulating torrents
+module.exports = class TorrentListController {
+  constructor (state) {
+    this.state = state
+  }
+
+  // Adds a torrent to the list, starts downloading/seeding. TorrentID can be a
+  // magnet URI, infohash, or torrent file: https://github.com/feross/webtorrent#clientaddtorrentid-opts-function-ontorrent-torrent-
+  addTorrent (torrentId) {
+    if (torrentId.path) {
+      // Use path string instead of W3C File object
+      torrentId = torrentId.path
+    }
+
+    // Allow a instant.io link to be pasted
+    if (typeof torrentId === 'string' && instantIoRegex.test(torrentId)) {
+      torrentId = torrentId.slice(torrentId.indexOf('#') + 1)
+    }
+
+    var torrentKey = this.state.nextTorrentKey++
+    var path = this.state.saved.prefs.downloadPath
+
+    ipcRenderer.send('wt-start-torrenting', torrentKey, torrentId, path)
+
+    dispatch('backToList')
+  }
+
+  // Shows the Create Torrent page with options to seed a given file or folder
+  showCreateTorrent (files) {
+    // You can only create torrents from the home screen.
+    if (this.state.location.url() !== 'home') {
+      return dispatch('error', 'Please go back to the torrent list before creating a new torrent.')
+    }
+
+    // Files will either be an array of file objects, which we can send directly
+    // to the create-torrent screen
+    if (files.length === 0 || typeof files[0] !== 'string') {
+      this.state.location.go({
+        url: 'create-torrent',
+        files: files,
+        setup: (cb) => {
+          this.state.window.title = 'Create New Torrent'
+          cb(null)
+        }
+      })
+      return
+    }
+
+    // ... or it will be an array of mixed file and folder paths. We have to walk
+    // through all the folders and find the files
+    findFilesRecursive(files, (allFiles) => this.showCreateTorrent(allFiles))
+  }
+
+  // Switches between the advanced and simple Create Torrent UI
+  toggleCreateTorrentAdvanced () {
+    var info = this.state.location.current()
+    if (info.url !== 'create-torrent') return
+    info.showAdvanced = !info.showAdvanced
+  }
+
+  // Creates a new torrent and start seeeding
+  createTorrent (options) {
+    var state = this.state
+    var torrentKey = state.nextTorrentKey++
+    ipcRenderer.send('wt-create-torrent', torrentKey, options)
+    state.location.cancel()
+  }
+
+  // Starts downloading and/or seeding a given torrentSummary.
+  startTorrentingSummary (torrentKey) {
+    var s = TorrentSummary.getByKey(this.state, torrentKey)
+    if (!s) throw new Error('Missing key: ' + torrentKey)
+
+    // Use Downloads folder by default
+    if (!s.path) s.path = this.state.saved.prefs.downloadPath
+
+    fs.stat(TorrentSummary.getFileOrFolder(s), function (err) {
+      if (err) {
+        s.error = 'path-missing'
+        return
+      }
+      ipcRenderer.send('wt-start-torrenting',
+        s.torrentKey,
+        TorrentSummary.getTorrentID(s),
+        s.path,
+        s.fileModtimes,
+        s.selections)
+    })
+  }
+
+  // TODO: use torrentKey, not infoHash
+  toggleTorrent (infoHash) {
+    var torrentSummary = TorrentSummary.getByKey(this.state, infoHash)
+    if (torrentSummary.status === 'paused') {
+      torrentSummary.status = 'new'
+      this.startTorrentingSummary(torrentSummary.torrentKey)
+      sound.play('ENABLE')
+    } else {
+      torrentSummary.status = 'paused'
+      ipcRenderer.send('wt-stop-torrenting', torrentSummary.infoHash)
+      sound.play('DISABLE')
+    }
+  }
+
+  toggleTorrentFile (infoHash, index) {
+    var torrentSummary = TorrentSummary.getByKey(this.state, infoHash)
+    torrentSummary.selections[index] = !torrentSummary.selections[index]
+
+    // Let the WebTorrent process know to start or stop fetching that file
+    ipcRenderer.send('wt-select-files', infoHash, torrentSummary.selections)
+  }
+
+  confirmDeleteTorrent (infoHash, deleteData) {
+    this.state.modal = {
+      id: 'remove-torrent-modal',
+      infoHash,
+      deleteData
+    }
+  }
+
+  // TODO: use torrentKey, not infoHash
+  deleteTorrent (infoHash, deleteData) {
+    ipcRenderer.send('wt-stop-torrenting', infoHash)
+
+    var index = this.state.saved.torrents.findIndex((x) => x.infoHash === infoHash)
+
+    if (index > -1) {
+      var summary = this.state.saved.torrents[index]
+
+      // remove torrent and poster file
+      deleteFile(TorrentSummary.getTorrentPath(summary))
+      deleteFile(TorrentSummary.getPosterPath(summary)) // TODO: will the css path hack affect windows?
+
+      // optionally delete the torrent data
+      if (deleteData) moveItemToTrash(summary)
+
+      // remove torrent from saved list
+      this.state.saved.torrents.splice(index, 1)
+      State.saveThrottled(this.state)
+    }
+
+    this.state.location.clearForward('player') // prevent user from going forward to a deleted torrent
+    sound.play('DELETE')
+  }
+
+  toggleSelectTorrent (infoHash) {
+    if (this.state.selectedInfoHash === infoHash) {
+      this.state.selectedInfoHash = null
+    } else {
+      this.state.selectedInfoHash = infoHash
+    }
+  }
+
+  openTorrentContextMenu (infoHash) {
+    var torrentSummary = TorrentSummary.getByKey(this.state, infoHash)
+    var menu = new electron.remote.Menu()
+
+    menu.append(new electron.remote.MenuItem({
+      label: 'Remove From List',
+      click: () => dispatch('confirmDeleteTorrent', torrentSummary.infoHash, false)
+    }))
+
+    menu.append(new electron.remote.MenuItem({
+      label: 'Remove Data File',
+      click: () => dispatch('confirmDeleteTorrent', torrentSummary.infoHash, true)
+    }))
+
+    menu.append(new electron.remote.MenuItem({
+      type: 'separator'
+    }))
+
+    if (torrentSummary.files) {
+      menu.append(new electron.remote.MenuItem({
+        label: process.platform === 'darwin' ? 'Show in Finder' : 'Show in Folder',
+        click: () => showItemInFolder(torrentSummary)
+      }))
+      menu.append(new electron.remote.MenuItem({
+        type: 'separator'
+      }))
+    }
+
+    menu.append(new electron.remote.MenuItem({
+      label: 'Copy Magnet Link to Clipboard',
+      click: () => electron.clipboard.writeText(torrentSummary.magnetURI)
+    }))
+
+    menu.append(new electron.remote.MenuItem({
+      label: 'Copy Instant.io Link to Clipboard',
+      click: () => electron.clipboard.writeText(`https://instant.io/#${torrentSummary.infoHash}`)
+    }))
+
+    menu.append(new electron.remote.MenuItem({
+      label: 'Save Torrent File As...',
+      click: () => saveTorrentFileAs(torrentSummary)
+    }))
+
+    menu.popup(electron.remote.getCurrentWindow())
+  }
+}
+
+// Recursively finds {name, path, size} for all files in a folder
+// Calls `cb` on success, calls `onError` on failure
+function findFilesRecursive (paths, cb) {
+  if (paths.length > 1) {
+    var numComplete = 0
+    var ret = []
+    paths.forEach(function (path) {
+      findFilesRecursive([path], function (fileObjs) {
+        ret = ret.concat(fileObjs)
+        if (++numComplete === paths.length) {
+          ret.sort((a, b) => a.path < b.path ? -1 : a.path > b.path)
+          cb(ret)
+        }
+      })
+    })
+    return
+  }
+
+  var fileOrFolder = paths[0]
+  fs.stat(fileOrFolder, function (err, stat) {
+    if (err) return dispatch('error', err)
+
+    // Files: return name, path, and size
+    if (!stat.isDirectory()) {
+      var filePath = fileOrFolder
+      return cb([{
+        name: path.basename(filePath),
+        path: filePath,
+        size: stat.size
+      }])
+    }
+
+    // Folders: recurse, make a list of all the files
+    var folderPath = fileOrFolder
+    fs.readdir(folderPath, function (err, fileNames) {
+      if (err) return dispatch('error', err)
+      var paths = fileNames.map((fileName) => path.join(folderPath, fileName))
+      findFilesRecursive(paths, cb)
+    })
+  })
+}
+
+function deleteFile (path) {
+  if (!path) return
+  fs.unlink(path, function (err) {
+    if (err) dispatch('error', err)
+  })
+}
+
+// Delete all files in a torrent
+function moveItemToTrash (torrentSummary) {
+  var filePath = TorrentSummary.getFileOrFolder(torrentSummary)
+  ipcRenderer.send('moveItemToTrash', filePath)
+}
+
+function showItemInFolder (torrentSummary) {
+  ipcRenderer.send('showItemInFolder', TorrentSummary.getFileOrFolder(torrentSummary))
+}
+
+function saveTorrentFileAs (torrentSummary) {
+  var downloadPath = this.state.saved.prefs.downloadPath
+  var newFileName = path.parse(torrentSummary.name).name + '.torrent'
+  var opts = {
+    title: 'Save Torrent File',
+    defaultPath: path.join(downloadPath, newFileName),
+    filters: [
+      { name: 'Torrent Files', extensions: ['torrent'] },
+      { name: 'All Files', extensions: ['*'] }
+    ]
+  }
+  electron.remote.dialog.showSaveDialog(electron.remote.getCurrentWindow(), opts, function (savePath) {
+    if (!savePath) return // They clicked Cancel
+    var torrentPath = TorrentSummary.getTorrentPath(torrentSummary)
+    fs.readFile(torrentPath, function (err, torrentFile) {
+      if (err) return dispatch('error', err)
+      fs.writeFile(savePath, torrentFile, function (err) {
+        if (err) return dispatch('error', err)
+      })
+    })
+  })
+}

src/renderer/controllers/update-controller.js

@@ -0,0 +1,26 @@
+const State = require('../lib/state')
+
+// Controls the UI checking for new versions of the app, prompting install
+module.exports = class UpdateController {
+  constructor (state) {
+    this.state = state
+  }
+
+  // Shows a modal saying that we have an update
+  updateAvailable (version) {
+    var skipped = this.state.saved.skippedVersions
+    if (skipped && skipped.includes(version)) {
+      console.log('new version skipped by user: v' + version)
+      return
+    }
+    this.state.modal = { id: 'update-available-modal', version: version }
+  }
+
+  // Don't show the modal again until the next version
+  skipVersion (version) {
+    var skipped = this.state.saved.skippedVersions
+    if (!skipped) skipped = this.state.saved.skippedVersions = []
+    skipped.push(version)
+    State.saveThrottled(this.state)
+  }
+}

src/renderer/lib/cast.js

@@ -0,0 +1,455 @@
+// The Cast module talks to Airplay and Chromecast
+// * Modifies state when things change
+// * Starts and stops casting, provides remote video controls
+module.exports = {
+  init,
+  toggleMenu,
+  selectDevice,
+  stop,
+  play,
+  pause,
+  seek,
+  setVolume,
+  setRate
+}
+
+// Lazy load these for a ~300ms improvement in startup time
+var airplayer, chromecasts, dlnacasts
+
+var config = require('../../config')
+
+// App state. Cast modifies state.playing and state.errors in response to events
+var state
+
+// Callback to notify module users when state has changed
+var update
+
+// setInterval() for updating cast status
+var statusInterval = null
+
+// Start looking for cast devices on the local network
+function init (appState, callback) {
+  state = appState
+  update = callback
+
+  // Load modules, scan the network for devices
+  airplayer = require('airplayer')()
+  chromecasts = require('chromecasts')()
+  dlnacasts = require('dlnacasts')()
+
+  state.devices.chromecast = chromecastPlayer()
+  state.devices.dlna = dlnaPlayer()
+  state.devices.airplay = airplayPlayer()
+
+  // Listen for devices: Chromecast, DLNA and Airplay
+  chromecasts.on('update', function (device) {
+    // TODO: how do we tell if there are *no longer* any Chromecasts available?
+    // From looking at the code, chromecasts.players only grows, never shrinks
+    state.devices.chromecast.addDevice(device)
+  })
+
+  dlnacasts.on('update', function (device) {
+    state.devices.dlna.addDevice(device)
+  })
+
+  airplayer.on('update', function (device) {
+    state.devices.airplay.addDevice(device)
+  })
+}
+
+// chromecast player implementation
+function chromecastPlayer () {
+  var ret = {
+    device: null,
+    addDevice,
+    getDevices,
+    open,
+    play,
+    pause,
+    stop,
+    status,
+    seek,
+    volume
+  }
+  return ret
+
+  function getDevices () {
+    return chromecasts.players
+  }
+
+  function addDevice (device) {
+    device.on('error', function (err) {
+      if (device !== ret.device) return
+      state.playing.location = 'local'
+      state.errors.push({
+        time: new Date().getTime(),
+        message: 'Could not connect to Chromecast. ' + err.message
+      })
+      update()
+    })
+    device.on('disconnect', function () {
+      if (device !== ret.device) return
+      state.playing.location = 'local'
+      update()
+    })
+  }
+
+  function open () {
+    var torrentSummary = state.saved.torrents.find((x) => x.infoHash === state.playing.infoHash)
+    ret.device.play(state.server.networkURL, {
+      type: 'video/mp4',
+      title: config.APP_NAME + ' - ' + torrentSummary.name
+    }, function (err) {
+      if (err) {
+        state.playing.location = 'local'
+        state.errors.push({
+          time: new Date().getTime(),
+          message: 'Could not connect to Chromecast. ' + err.message
+        })
+      } else {
+        state.playing.location = 'chromecast'
+      }
+      update()
+    })
+  }
+
+  function play (callback) {
+    ret.device.play(null, null, callback)
+  }
+
+  function pause (callback) {
+    ret.device.pause(callback)
+  }
+
+  function stop (callback) {
+    ret.device.stop(callback)
+  }
+
+  function status () {
+    ret.device.status(function (err, status) {
+      if (err) return console.log('error getting %s status: %o', state.playing.location, err)
+      state.playing.isPaused = status.playerState === 'PAUSED'
+      state.playing.currentTime = status.currentTime
+      state.playing.volume = status.volume.muted ? 0 : status.volume.level
+      update()
+    })
+  }
+
+  function seek (time, callback) {
+    ret.device.seek(time, callback)
+  }
+
+  function volume (volume, callback) {
+    ret.device.volume(volume, callback)
+  }
+}
+
+// airplay player implementation
+function airplayPlayer () {
+  var ret = {
+    device: null,
+    addDevice,
+    getDevices,
+    open,
+    play,
+    pause,
+    stop,
+    status,
+    seek,
+    volume
+  }
+  return ret
+
+  function addDevice (player) {
+    player.on('event', function (event) {
+      switch (event.state) {
+        case 'loading':
+          break
+        case 'playing':
+          state.playing.isPaused = false
+          break
+        case 'paused':
+          state.playing.isPaused = true
+          break
+        case 'stopped':
+          break
+      }
+      update()
+    })
+  }
+
+  function getDevices () {
+    return airplayer.players
+  }
+
+  function open () {
+    ret.device.play(state.server.networkURL, function (err, res) {
+      if (err) {
+        state.playing.location = 'local'
+        state.errors.push({
+          time: new Date().getTime(),
+          message: 'Could not connect to AirPlay. ' + err.message
+        })
+      } else {
+        state.playing.location = 'airplay'
+      }
+      update()
+    })
+  }
+
+  function play (callback) {
+    ret.device.resume(callback)
+  }
+
+  function pause (callback) {
+    ret.device.pause(callback)
+  }
+
+  function stop (callback) {
+    ret.device.stop(callback)
+  }
+
+  function status () {
+    ret.device.playbackInfo(function (err, res, status) {
+      if (err) {
+        state.playing.location = 'local'
+        state.errors.push({
+          time: new Date().getTime(),
+          message: 'Could not connect to AirPlay. ' + err.message
+        })
+      } else {
+        state.playing.isPaused = status.rate === 0
+        state.playing.currentTime = status.position
+        update()
+      }
+    })
+  }
+
+  function seek (time, callback) {
+    ret.device.scrub(time, callback)
+  }
+
+  function volume (volume, callback) {
+    // AirPlay doesn't support volume
+    // TODO: We should just disable the volume slider
+    state.playing.volume = volume
+  }
+}
+
+// DLNA player implementation
+function dlnaPlayer (player) {
+  var ret = {
+    device: null,
+    addDevice,
+    getDevices,
+    open,
+    play,
+    pause,
+    stop,
+    status,
+    seek,
+    volume
+  }
+  return ret
+
+  function getDevices () {
+    return dlnacasts.players
+  }
+
+  function addDevice (device) {
+    device.on('error', function (err) {
+      if (device !== ret.device) return
+      state.playing.location = 'local'
+      state.errors.push({
+        time: new Date().getTime(),
+        message: 'Could not connect to DLNA. ' + err.message
+      })
+      update()
+    })
+    device.on('disconnect', function () {
+      if (device !== ret.device) return
+      state.playing.location = 'local'
+      update()
+    })
+  }
+
+  function open () {
+    var torrentSummary = state.saved.torrents.find((x) => x.infoHash === state.playing.infoHash)
+    ret.device.play(state.server.networkURL, {
+      type: 'video/mp4',
+      title: config.APP_NAME + ' - ' + torrentSummary.name,
+      seek: state.playing.currentTime > 10 ? state.playing.currentTime : 0
+    }, function (err) {
+      if (err) {
+        state.playing.location = 'local'
+        state.errors.push({
+          time: new Date().getTime(),
+          message: 'Could not connect to DLNA. ' + err.message
+        })
+      } else {
+        state.playing.location = 'dlna'
+      }
+      update()
+    })
+  }
+
+  function play (callback) {
+    ret.device.play(null, null, callback)
+  }
+
+  function pause (callback) {
+    ret.device.pause(callback)
+  }
+
+  function stop (callback) {
+    ret.device.stop(callback)
+  }
+
+  function status () {
+    ret.device.status(function (err, status) {
+      if (err) return console.log('error getting %s status: %o', state.playing.location, err)
+      state.playing.isPaused = status.playerState === 'PAUSED'
+      state.playing.currentTime = status.currentTime
+      state.playing.volume = status.volume.level
+      update()
+    })
+  }
+
+  function seek (time, callback) {
+    ret.device.seek(time, callback)
+  }
+
+  function volume (volume, callback) {
+    ret.device.volume(volume, function (err) {
+      // quick volume update
+      state.playing.volume = volume
+      callback(err)
+    })
+  }
+}
+
+// Start polling cast device state, whenever we're connected
+function startStatusInterval () {
+  statusInterval = setInterval(function () {
+    var player = getPlayer()
+    if (player) player.status()
+  }, 1000)
+}
+
+/*
+ * Shows the device menu for a given cast type ('chromecast', 'airplay', etc)
+ * The menu lists eg. all Chromecasts detected; the user can click one to cast.
+ * If the menu was already showing for that type, hides the menu.
+ */
+function toggleMenu (location) {
+  // If the menu is already showing, hide it
+  if (state.devices.castMenu && state.devices.castMenu.location === location) {
+    state.devices.castMenu = null
+    return
+  }
+
+  // Never cast to two devices at the same time
+  if (state.playing.location !== 'local') {
+    throw new Error('You can\'t connect to ' + location + ' when already connected to another device')
+  }
+
+  // Find all cast devices of the given type
+  var player = getPlayer(location)
+  var devices = player ? player.getDevices() : []
+  if (devices.length === 0) throw new Error('No ' + location + ' devices available')
+
+  // Show a menu
+  state.devices.castMenu = {location, devices}
+}
+
+function selectDevice (index) {
+  var {location, devices} = state.devices.castMenu
+
+  // Start casting
+  var player = getPlayer(location)
+  player.device = devices[index]
+  player.open()
+
+  // Poll the casting device's status every few seconds
+  startStatusInterval()
+
+  // Show the Connecting... screen
+  state.devices.castMenu = null
+  state.playing.castName = devices[index].name
+  state.playing.location = location + '-pending'
+  update()
+}
+
+// Stops casting, move video back to local screen
+function stop () {
+  var player = getPlayer()
+  if (player) {
+    player.stop(function () {
+      player.device = null
+      stoppedCasting()
+    })
+    clearInterval(statusInterval)
+  } else {
+    stoppedCasting()
+  }
+}
+
+function stoppedCasting () {
+  state.playing.location = 'local'
+  state.playing.jumpToTime = state.playing.currentTime
+  update()
+}
+
+function getPlayer (location) {
+  if (location) {
+    return state.devices[location]
+  } else if (state.playing.location === 'chromecast') {
+    return state.devices.chromecast
+  } else if (state.playing.location === 'airplay') {
+    return state.devices.airplay
+  } else if (state.playing.location === 'dlna') {
+    return state.devices.dlna
+  } else {
+    return null
+  }
+}
+
+function play () {
+  var player = getPlayer()
+  if (player) player.play(castCallback)
+}
+
+function pause () {
+  var player = getPlayer()
+  if (player) player.pause(castCallback)
+}
+
+function setRate (rate) {
+  var player
+  var result = true
+  if (state.playing.location === 'chromecast') {
+    // TODO find how to control playback rate on chromecast
+    castCallback()
+    result = false
+  } else if (state.playing.location === 'airplay') {
+    player = state.devices.airplay
+    player.rate(rate, castCallback)
+  } else {
+    result = false
+  }
+  return result
+}
+
+function seek (time) {
+  var player = getPlayer()
+  if (player) player.seek(time, castCallback)
+}
+
+function setVolume (volume) {
+  var player = getPlayer()
+  if (player) player.volume(volume, castCallback)
+}
+
+function castCallback () {
+  console.log('%s callback: %o', state.playing.location, arguments)
+}

src/renderer/lib/dispatcher.js

@@ -0,0 +1,39 @@
+module.exports = {
+  dispatch,
+  dispatcher,
+  setDispatch
+}
+
+var dispatchers = {}
+var _dispatch = function () {}
+
+function setDispatch (dispatch) {
+  _dispatch = dispatch
+}
+
+function dispatch (...args) {
+  _dispatch(...args)
+}
+
+// Most DOM event handlers are trivial functions like `() => dispatch(<args>)`.
+// For these, `dispatcher(<args>)` is preferred because it memoizes the handler
+// function. This prevents React from updating the listener functions on
+// each update().
+function dispatcher (...args) {
+  var str = JSON.stringify(args)
+  var handler = dispatchers[str]
+  if (!handler) {
+    handler = dispatchers[str] = function (e) {
+      // Do not propagate click to elements below the button
+      e.stopPropagation()
+
+      if (e.currentTarget.classList.contains('disabled')) {
+        // Ignore clicks on disabled elements
+        return
+      }
+
+      dispatch(...args)
+    }
+  }
+  return handler
+}

src/renderer/lib/migrations.js

@@ -0,0 +1,106 @@
+/* eslint-disable camelcase */
+
+module.exports = {
+  run
+}
+
+var semver = require('semver')
+var config = require('../../config')
+
+// Change `state.saved` (which will be saved back to config.json on exit) as
+// needed, for example to deal with config.json format changes across versions
+function run (state) {
+  // Replace '{ version: 1 }' with app version (semver)
+  if (!semver.valid(state.saved.version)) {
+    state.saved.version = '0.0.0' // Pre-0.7.0 version, so run all migrations
+  }
+
+  var version = state.saved.version
+
+  if (semver.lt(version, '0.7.0')) {
+    migrate_0_7_0(state.saved)
+  }
+
+  if (semver.lt(version, '0.7.2')) {
+    migrate_0_7_2(state.saved)
+  }
+
+  if (semver.lt(version, '0.11.0')) {
+    migrate_0_11_0(state.saved)
+  }
+
+  // Config is now on the new version
+  state.saved.version = config.APP_VERSION
+}
+
+function migrate_0_7_0 (saved) {
+  console.log('migrate to 0.7.0')
+
+  var fs = require('fs-extra')
+  var path = require('path')
+
+  saved.torrents.forEach(function (ts) {
+    var infoHash = ts.infoHash
+
+    // Replace torrentPath with torrentFileName
+    // There are a number of cases to handle here:
+    // * Originally we used absolute paths
+    // * Then, relative paths for the default torrents, eg '../static/sintel.torrent'
+    // * Then, paths computed at runtime for default torrents, eg 'sintel.torrent'
+    // * Finally, now we're getting rid of torrentPath altogether
+    var src, dst
+    if (ts.torrentPath) {
+      console.log('replacing torrentPath %s', ts.torrentPath)
+      if (path.isAbsolute(ts.torrentPath) || ts.torrentPath.startsWith('..')) {
+        src = ts.torrentPath
+      } else {
+        src = path.join(config.STATIC_PATH, ts.torrentPath)
+      }
+      dst = path.join(config.TORRENT_PATH, infoHash + '.torrent')
+      // Synchronous FS calls aren't ideal, but probably OK in a migration
+      // that only runs once
+      if (src !== dst) fs.copySync(src, dst)
+
+      delete ts.torrentPath
+      ts.torrentFileName = infoHash + '.torrent'
+    }
+
+    // Replace posterURL with posterFileName
+    if (ts.posterURL) {
+      console.log('replacing posterURL %s', ts.posterURL)
+      var extension = path.extname(ts.posterURL)
+      src = path.isAbsolute(ts.posterURL)
+        ? ts.posterURL
+        : path.join(config.STATIC_PATH, ts.posterURL)
+      dst = path.join(config.POSTER_PATH, infoHash + extension)
+      // Synchronous FS calls aren't ideal, but probably OK in a migration
+      // that only runs once
+      if (src !== dst) fs.copySync(src, dst)
+
+      delete ts.posterURL
+      ts.posterFileName = infoHash + extension
+    }
+
+    // Fix exception caused by incorrect file ordering.
+    // https://github.com/feross/webtorrent-desktop/pull/604#issuecomment-222805214
+    delete ts.defaultPlayFileIndex
+    delete ts.files
+    delete ts.selections
+    delete ts.fileModtimes
+  })
+}
+
+function migrate_0_7_2 (saved) {
+  if (!saved.prefs) {
+    saved.prefs = {
+      downloadPath: config.DEFAULT_DOWNLOAD_PATH
+    }
+  }
+}
+
+function migrate_0_11_0 (saved) {
+  if (saved.prefs.isFileHandler === undefined) {
+    // The app used to make itself the default torrent file handler automatically
+    saved.prefs.isFileHandler = true
+  }
+}

src/renderer/lib/state.js

@@ -0,0 +1,224 @@
+var appConfig = require('application-config')('WebTorrent')
+var path = require('path')
+var {EventEmitter} = require('events')
+
+var config = require('../../config')
+var migrations = require('./migrations')
+
+var State = module.exports = Object.assign(new EventEmitter(), {
+  getDefaultPlayState,
+  load,
+  save,
+  saveThrottled
+})
+
+appConfig.filePath = path.join(config.CONFIG_PATH, 'config.json')
+
+function getDefaultState () {
+  var LocationHistory = require('location-history')
+
+  return {
+    /*
+     * Temporary state disappears once the program exits.
+     * It can contain complex objects like open connections, etc.
+     */
+    client: null, /* the WebTorrent client */
+    server: null, /* local WebTorrent-to-HTTP server */
+    prev: {}, /* used for state diffing in updateElectron() */
+    location: new LocationHistory(),
+    window: {
+      bounds: null, /* {x, y, width, height } */
+      isFocused: true,
+      isFullScreen: false,
+      title: config.APP_WINDOW_TITLE
+    },
+    selectedInfoHash: null, /* the torrent we've selected to view details. see state.torrents */
+    playing: getDefaultPlayState(), /* the media (audio or video) that we're currently playing */
+    devices: {}, /* playback devices like Chromecast and AppleTV */
+    dock: {
+      badge: 0,
+      progress: 0
+    },
+    modal: null, /* modal popover */
+    errors: [], /* user-facing errors */
+    nextTorrentKey: 1, /* identify torrents for IPC between the main and webtorrent windows */
+
+    /*
+     * Saved state is read from and written to a file every time the app runs.
+     * It should be simple and minimal and must be JSON.
+     * It must never contain absolute paths since we have a portable app.
+     *
+     * Config path:
+     *
+     * Mac                  ~/Library/Application Support/WebTorrent/config.json
+     * Linux (XDG)          $XDG_CONFIG_HOME/WebTorrent/config.json
+     * Linux (Legacy)       ~/.config/WebTorrent/config.json
+     * Windows (> Vista)    %LOCALAPPDATA%/WebTorrent/config.json
+     * Windows (XP, 2000)   %USERPROFILE%/Local Settings/Application Data/WebTorrent/config.json
+     *
+     * Also accessible via `require('application-config')('WebTorrent').filePath`
+     */
+    saved: {},
+
+    /*
+     * Getters, for convenience
+     */
+    getPlayingTorrentSummary,
+    getPlayingFileSummary
+  }
+}
+
+/* Whenever we stop playing video or audio, here's what we reset state.playing to */
+function getDefaultPlayState () {
+  return {
+    infoHash: null, /* the info hash of the torrent we're playing */
+    fileIndex: null, /* the zero-based index within the torrent */
+    location: 'local', /* 'local', 'chromecast', 'airplay' */
+    type: null, /* 'audio' or 'video', could be 'other' if ever support eg streaming to VLC */
+    currentTime: 0, /* seconds */
+    duration: 1, /* seconds */
+    isPaused: true,
+    isStalled: false,
+    lastTimeUpdate: 0, /* Unix time in ms */
+    mouseStationarySince: 0, /* Unix time in ms */
+    playbackRate: 1,
+    volume: 1,
+    subtitles: {
+      tracks: [], /* subtitle tracks, each {label, language, ...} */
+      selectedIndex: -1, /* current subtitle track */
+      showMenu: false /* popover menu, above the video */
+    },
+    aspectRatio: 0 /* aspect ratio of the video */
+  }
+}
+
+/* If the saved state file doesn't exist yet, here's what we use instead */
+function setupSavedState (cb) {
+  var fs = require('fs-extra')
+  var parseTorrent = require('parse-torrent')
+  var parallel = require('run-parallel')
+
+  var saved = {
+    prefs: {
+      downloadPath: config.DEFAULT_DOWNLOAD_PATH
+    },
+    torrents: config.DEFAULT_TORRENTS.map(createTorrentObject),
+    version: config.APP_VERSION /* make sure we can upgrade gracefully later */
+  }
+
+  var tasks = []
+
+  config.DEFAULT_TORRENTS.map(function (t, i) {
+    var infoHash = saved.torrents[i].infoHash
+    tasks.push(function (cb) {
+      fs.copy(
+        path.join(config.STATIC_PATH, t.posterFileName),
+        path.join(config.POSTER_PATH, infoHash + path.extname(t.posterFileName)),
+        cb
+      )
+    })
+    tasks.push(function (cb) {
+      fs.copy(
+        path.join(config.STATIC_PATH, t.torrentFileName),
+        path.join(config.TORRENT_PATH, infoHash + '.torrent'),
+        cb
+      )
+    })
+  })
+
+  parallel(tasks, function (err) {
+    if (err) return cb(err)
+    cb(null, saved)
+  })
+
+  function createTorrentObject (t) {
+    var torrent = fs.readFileSync(path.join(config.STATIC_PATH, t.torrentFileName))
+    var parsedTorrent = parseTorrent(torrent)
+
+    return {
+      status: 'paused',
+      infoHash: parsedTorrent.infoHash,
+      name: t.name,
+      displayName: t.name,
+      posterFileName: parsedTorrent.infoHash + path.extname(t.posterFileName),
+      torrentFileName: parsedTorrent.infoHash + '.torrent',
+      magnetURI: parseTorrent.toMagnetURI(parsedTorrent),
+      files: parsedTorrent.files,
+      selections: parsedTorrent.files.map((x) => true)
+    }
+  }
+}
+
+function getPlayingTorrentSummary () {
+  var infoHash = this.playing.infoHash
+  return this.saved.torrents.find((x) => x.infoHash === infoHash)
+}
+
+function getPlayingFileSummary () {
+  var torrentSummary = this.getPlayingTorrentSummary()
+  if (!torrentSummary) return null
+  return torrentSummary.files[this.playing.fileIndex]
+}
+
+function load (cb) {
+  var state = getDefaultState()
+
+  appConfig.read(function (err, saved) {
+    if (err || !saved.version) {
+      console.log('Missing config file: Creating new one')
+      setupSavedState(onSaved)
+    } else {
+      onSaved(null, saved)
+    }
+  })
+
+  function onSaved (err, saved) {
+    if (err) return cb(err)
+    state.saved = saved
+    migrations.run(state)
+    cb(null, state)
+  }
+}
+
+// Write state.saved to the JSON state file
+function save (state, cb) {
+  console.log('Saving state to ' + appConfig.filePath)
+  delete state.saveStateTimeout
+
+  // Clean up, so that we're not saving any pending state
+  var copy = Object.assign({}, state.saved)
+  // Remove torrents pending addition to the list, where we haven't finished
+  // reading the torrent file or file(s) to seed & don't have an infohash
+  copy.torrents = copy.torrents
+    .filter((x) => x.infoHash)
+    .map(function (x) {
+      var torrent = {}
+      for (var key in x) {
+        if (key === 'progress' || key === 'torrentKey') {
+          continue // Don't save progress info or key for the webtorrent process
+        }
+        if (key === 'playStatus') {
+          continue // Don't save whether a torrent is playing / pending
+        }
+        if (key === 'error') {
+          continue // Don't save error states
+        }
+        torrent[key] = x[key]
+      }
+      return torrent
+    })
+
+  appConfig.write(copy, (err) => {
+    if (err) console.error(err)
+    else State.emit('savedState')
+  })
+}
+
+// Write, but no more than once a second
+function saveThrottled (state) {
+  if (state.saveStateTimeout) return
+  state.saveStateTimeout = setTimeout(function () {
+    if (!state.saveStateTimeout) return
+    save(state)
+  }, 1000)
+}

src/renderer/lib/telemetry.js

@@ -0,0 +1,152 @@
+// Collects anonymous usage stats and uncaught errors
+// Reports back so that we can improve WebTorrent Desktop
+module.exports = {
+  init,
+  logUncaughtError,
+  logPlayAttempt
+}
+
+const crypto = require('crypto')
+const electron = require('electron')
+const https = require('https')
+const os = require('os')
+const url = require('url')
+
+const config = require('../../config')
+
+var telemetry
+
+function init (state) {
+  telemetry = state.saved.telemetry
+  if (!telemetry) {
+    telemetry = state.saved.telemetry = createSummary()
+    reset()
+  }
+
+  var now = new Date()
+  telemetry.timestamp = now.toISOString()
+  telemetry.localTime = now.toTimeString()
+  telemetry.screens = getScreenInfo()
+  telemetry.system = getSystemInfo()
+  telemetry.approxNumTorrents = getApproxNumTorrents(state)
+
+  if (config.IS_PRODUCTION) {
+    postToServer()
+  } else {
+    // Development: telemetry used only for local debugging
+    // Empty uncaught errors, etc at the start of every run
+    reset()
+  }
+}
+
+function reset () {
+  telemetry.uncaughtErrors = []
+  telemetry.playAttempts = {
+    total: 0,
+    success: 0,
+    timeout: 0,
+    error: 0,
+    abandoned: 0
+  }
+}
+
+function postToServer () {
+  // Serialize the telemetry summary
+  var payload = new Buffer(JSON.stringify(telemetry), 'utf8')
+
+  // POST to our server
+  var options = url.parse(config.TELEMETRY_URL)
+  options.method = 'POST'
+  options.headers = {
+    'Content-Type': 'application/json',
+    'Content-Length': payload.length
+  }
+
+  var req = https.request(options, function (res) {
+    if (res.statusCode === 200) {
+      console.log('Successfully posted telemetry summary')
+      reset()
+    } else {
+      console.error('Couldn\'t post telemetry summary, got HTTP ' + res.statusCode)
+    }
+  })
+  req.on('error', function (e) {
+    console.error('Couldn\'t post telemetry summary', e)
+  })
+  req.write(payload)
+  req.end()
+}
+
+// Creates a new telemetry summary. Gives the user a unique ID,
+// collects screen resolution, etc
+function createSummary () {
+  // Make a 256-bit random unique ID
+  var userID = crypto.randomBytes(32).toString('hex')
+  return { userID }
+}
+
+// Track screen resolution
+function getScreenInfo () {
+  return electron.screen.getAllDisplays().map((screen) => ({
+    width: screen.size.width,
+    height: screen.size.height,
+    scaleFactor: screen.scaleFactor
+  }))
+}
+
+// Track basic system info like OS version and amount of RAM
+function getSystemInfo () {
+  return {
+    osPlatform: process.platform,
+    osRelease: os.type() + ' ' + os.release(),
+    architecture: os.arch(),
+    totalMemoryMB: os.totalmem() / (1 << 20),
+    numCores: os.cpus().length
+  }
+}
+
+// Get the number of torrents, rounded to the nearest power of two
+function getApproxNumTorrents (state) {
+  var exactNum = state.saved.torrents.length
+  if (exactNum === 0) return 0
+  // Otherwise, return 1, 2, 4, 8, etc by rounding in log space
+  var log2 = Math.log(exactNum) / Math.log(2)
+  return 1 << Math.round(log2)
+}
+
+// An uncaught error happened in the main process or in one of the windows
+function logUncaughtError (procName, err) {
+  console.error('uncaught error', procName, err)
+
+  // Not initialized yet? Ignore.
+  // Hopefully uncaught errors immediately on startup are fixed in dev
+  if (!telemetry) return
+
+  var message, stack
+  if (err instanceof Error) {
+    message = err.message
+    stack = err.stack
+  } else {
+    message = String(err)
+    stack = ''
+  }
+
+  // We need to POST the telemetry object, make sure it stays < 100kb
+  if (telemetry.uncaughtErrors.length > 20) return
+  if (message.length > 1000) message = message.substring(0, 1000)
+  if (stack.length > 1000) stack = stack.substring(0, 1000)
+
+  telemetry.uncaughtErrors.push({process: procName, message, stack})
+}
+
+// The user pressed play. It either worked, timed out, or showed the
+// 'Play in VLC' codec error
+function logPlayAttempt (result) {
+  if (!['success', 'timeout', 'error', 'abandoned'].includes(result)) {
+    return console.error('Unknown play attempt result', result)
+  }
+
+  var attempts = telemetry.playAttempts
+  attempts.total = (attempts.total || 0) + 1
+  attempts[result] = (attempts[result] || 0) + 1
+}

src/renderer/lib/torrent-player.js

@@ -0,0 +1,83 @@
+module.exports = {
+  isPlayable,
+  isVideo,
+  isAudio,
+  isTorrent,
+  isPlayableTorrentSummary,
+  pickFileToPlay
+}
+
+var path = require('path')
+
+// Checks whether a fileSummary or file path is audio/video that we can play,
+// based on the file extension
+function isPlayable (file) {
+  return isVideo(file) || isAudio(file)
+}
+
+// Checks whether a fileSummary or file path is playable video
+function isVideo (file) {
+  return [
+    '.avi',
+    '.m4v',
+    '.mkv',
+    '.mov',
+    '.mp4',
+    '.mpg',
+    '.ogv',
+    '.webm',
+    '.wmv'
+  ].includes(getFileExtension(file))
+}
+
+// Checks whether a fileSummary or file path is playable audio
+function isAudio (file) {
+  return [
+    '.aac',
+    '.ac3',
+    '.mp3',
+    '.ogg',
+    '.wav'
+  ].includes(getFileExtension(file))
+}
+
+// Checks if the argument is either:
+// - a string that's a valid filename ending in .torrent
+// - a file object where obj.name is ends in .torrent
+// - a string that's a magnet link (magnet://...)
+function isTorrent (file) {
+  var isTorrentFile = getFileExtension(file) === '.torrent'
+  var isMagnet = typeof file === 'string' && /^(stream-)?magnet:/.test(file)
+  return isTorrentFile || isMagnet
+}
+
+function getFileExtension (file) {
+  var name = typeof file === 'string' ? file : file.name
+  return path.extname(name).toLowerCase()
+}
+
+function isPlayableTorrentSummary (torrentSummary) {
+  return torrentSummary.files && torrentSummary.files.some(isPlayable)
+}
+
+// Picks the default file to play from a list of torrent or torrentSummary files
+// Returns an index or undefined, if no files are playable
+function pickFileToPlay (files) {
+  // first, try to find the biggest video file
+  var videoFiles = files.filter(isVideo)
+  if (videoFiles.length > 0) {
+    var largestVideoFile = videoFiles.reduce(function (a, b) {
+      return a.length > b.length ? a : b
+    })
+    return files.indexOf(largestVideoFile)
+  }
+
+  // if there are no videos, play the first audio file
+  var audioFiles = files.filter(isAudio)
+  if (audioFiles.length > 0) {
+    return files.indexOf(audioFiles[0])
+  }
+
+  // no video or audio means nothing is playable
+  return undefined
+}

src/renderer/lib/torrent-poster.js

@@ -4,13 +4,19 @@ var captureVideoFrame = require('./capture-video-frame')
 var path = require('path')
 
 function torrentPoster (torrent, cb) {
-  // First, try to use the largest video file
+  // First, try to use a poster image if available
+  var posterFile = torrent.files.filter(function (file) {
+    return /^poster\.(jpg|png|gif)$/.test(file.name)
+  })[0]
+  if (posterFile) return torrentPosterFromImage(posterFile, torrent, cb)
+
+  // Second, try to use the largest video file
   // Filter out file formats that the <video> tag definitely can't play
   var videoFile = getLargestFileByExtension(torrent, ['.mp4', '.m4v', '.webm', '.mov', '.mkv'])
   if (videoFile) return torrentPosterFromVideo(videoFile, torrent, cb)
 
-  // Second, try to use the largest image file
-  var imgFile = getLargestFileByExtension(torrent, ['.gif', '.jpg', '.png'])
+  // Third, try to use the largest image file
+  var imgFile = getLargestFileByExtension(torrent, ['.gif', '.jpg', '.jpeg', '.png'])
   if (imgFile) return torrentPosterFromImage(imgFile, torrent, cb)
 
   // TODO: generate a waveform from the largest sound file

src/renderer/lib/torrent-summary.js

@@ -0,0 +1,56 @@
+module.exports = {
+  getPosterPath,
+  getTorrentPath,
+  getByKey,
+  getTorrentID,
+  getFileOrFolder
+}
+
+var path = require('path')
+var config = require('../../config')
+
+// Expects a torrentSummary
+// Returns an absolute path to the torrent file, or null if unavailable
+function getTorrentPath (torrentSummary) {
+  if (!torrentSummary || !torrentSummary.torrentFileName) return null
+  return path.join(config.TORRENT_PATH, torrentSummary.torrentFileName)
+}
+
+// Expects a torrentSummary
+// Returns an absolute path to the poster image, or null if unavailable
+function getPosterPath (torrentSummary) {
+  if (!torrentSummary || !torrentSummary.posterFileName) return null
+  var posterPath = path.join(config.POSTER_PATH, torrentSummary.posterFileName)
+  // Work around a Chrome bug (reproduced in vanilla Chrome, not just Electron):
+  // Backslashes in URLS in CSS cause bizarre string encoding issues
+  return posterPath.replace(/\\/g, '/')
+}
+
+// Expects a torrentSummary
+// Returns a torrentID: filename, magnet URI, or infohash
+function getTorrentID (torrentSummary) {
+  var s = torrentSummary
+  if (s.torrentFileName) { // Load torrent file from disk
+    return getTorrentPath(s)
+  } else { // Load torrent from DHT
+    return s.magnetURI || s.infoHash
+  }
+}
+
+// Expects a torrentKey or infoHash
+// Returns the corresponding torrentSummary, or undefined
+function getByKey (state, torrentKey) {
+  if (!torrentKey) return undefined
+  return state.saved.torrents.find((x) =>
+    x.torrentKey === torrentKey || x.infoHash === torrentKey)
+}
+
+// Returns the path to either the file (in a single-file torrent) or the root
+// folder (in  multi-file torrent)
+// WARNING: assumes that multi-file torrents consist of a SINGLE folder.
+// TODO: make this assumption explicit, enforce it in the `create-torrent`
+// module. Store root folder explicitly to avoid hacky path processing below.
+function getFileOrFolder (torrentSummary) {
+  var ts = torrentSummary
+  return path.join(ts.path, ts.files[0].path.split('/')[0])
+}

src/renderer/main.js

@@ -0,0 +1,456 @@
+console.time('init')
+
+const crashReporter = require('../crash-reporter')
+crashReporter.init()
+
+const dragDrop = require('drag-drop')
+const electron = require('electron')
+const React = require('react')
+const ReactDOM = require('react-dom')
+const fs = require('fs')
+
+const config = require('../config')
+const App = require('./views/app')
+const telemetry = require('./lib/telemetry')
+const sound = require('./lib/sound')
+const State = require('./lib/state')
+const TorrentPlayer = require('./lib/torrent-player')
+
+const MediaController = require('./controllers/media-controller')
+const UpdateController = require('./controllers/update-controller')
+const PrefsController = require('./controllers/prefs-controller')
+const PlaybackController = require('./controllers/playback-controller')
+const SubtitlesController = require('./controllers/subtitles-controller')
+const TorrentListController = require('./controllers/torrent-list-controller')
+const TorrentController = require('./controllers/torrent-controller')
+
+// Yo-yo pattern: state object lives here and percolates down thru all the views.
+// Events come back up from the views via dispatch(...)
+require('./lib/dispatcher').setDispatch(dispatch)
+
+// From dispatch(...), events are sent to one of the controllers
+var controllers = null
+
+// This dependency is the slowest-loading, so we lazy load it
+var Cast = null
+
+// Electron apps have two processes: a main process (node) runs first and starts
+// a renderer process (essentially a Chrome window). We're in the renderer process,
+// and this IPC channel receives from and sends messages to the main process
+var ipcRenderer = electron.ipcRenderer
+
+// All state lives in state.js. `state.saved` is read from and written to a file.
+// All other state is ephemeral. First we load state.saved then initialize the app.
+var state
+
+// Root React component
+var app
+
+State.load(onState)
+
+// Called once when the application loads. (Not once per window.)
+// Connects to the torrent networks, sets up the UI and OS integrations like
+// the dock icon and drag+drop.
+function onState (err, _state) {
+  if (err) return onError(err)
+  state = window.state = _state // Make available for easier debugging
+
+  // Create controllers
+  controllers = {
+    media: new MediaController(state),
+    update: new UpdateController(state),
+    prefs: new PrefsController(state, config),
+    playback: new PlaybackController(state, config, update),
+    subtitles: new SubtitlesController(state),
+    torrentList: new TorrentListController(state),
+    torrent: new TorrentController(state)
+  }
+
+  // Add first page to location history
+  state.location.go({
+    url: 'home',
+    setup: (cb) => {
+      state.window.title = config.APP_WINDOW_TITLE
+      cb(null)
+    }
+  })
+
+  // Restart everything we were torrenting last time the app ran
+  resumeTorrents()
+
+  // Calling update() updates the UI given the current state
+  // Do this at least once a second to give every file in every torrentSummary
+  // a progress bar and to keep the cursor in sync when playing a video
+  setInterval(update, 1000)
+  app = ReactDOM.render(<App state={state} />, document.querySelector('#body'))
+
+  // Lazy-load other stuff, like the AppleTV module, later to keep startup fast
+  window.setTimeout(delayedInit, config.DELAYED_INIT)
+
+  // Listen for messages from the main process
+  setupIpc()
+
+  // Warn if the download dir is gone, eg b/c an external drive is unplugged
+  checkDownloadPath()
+
+  // OS integrations:
+  // ...drag and drop files/text to start torrenting or seeding
+  dragDrop('body', {
+    onDrop: onOpen,
+    onDropText: onOpen
+  })
+
+  // ...same thing if you paste a torrent
+  document.addEventListener('paste', onPaste)
+
+  // ...focus and blur. Needed to show correct dock icon text ('badge') in OSX
+  window.addEventListener('focus', onFocus)
+  window.addEventListener('blur', onBlur)
+
+  // ...window visibility state.
+  document.addEventListener('webkitvisibilitychange', onVisibilityChange)
+
+  // Log uncaught JS errors
+  window.addEventListener('error',
+    (e) => telemetry.logUncaughtError('window', e.error || e.target), true)
+
+  // Done! Ideally we want to get here < 500ms after the user clicks the app
+  sound.play('STARTUP')
+  console.timeEnd('init')
+}
+
+// Runs a few seconds after the app loads, to avoid slowing down startup time
+function delayedInit () {
+  lazyLoadCast()
+  sound.preload()
+  telemetry.init(state)
+}
+
+// Lazily loads Chromecast and Airplay support
+function lazyLoadCast () {
+  if (!Cast) {
+    Cast = require('./lib/cast')
+    Cast.init(state, update) // Search the local network for Chromecast and Airplays
+  }
+  return Cast
+}
+
+// React loop:
+// 1. update() - recompute the virtual DOM, diff, apply to the real DOM
+// 2. event - might be a click or other DOM event, or something external
+// 3. dispatch - the event handler calls dispatch(), main.js sends it to a controller
+// 4. controller - the controller handles the event, changing the state object
+function update () {
+  controllers.playback.showOrHidePlayerControls()
+  app.setState(state)
+  updateElectron()
+}
+
+// Some state changes can't be reflected in the DOM, instead we have to
+// tell the main process to update the window or OS integrations
+function updateElectron () {
+  if (state.window.title !== state.prev.title) {
+    state.prev.title = state.window.title
+    ipcRenderer.send('setTitle', state.window.title)
+  }
+  if (state.dock.progress !== state.prev.progress) {
+    state.prev.progress = state.dock.progress
+    ipcRenderer.send('setProgress', state.dock.progress)
+  }
+  if (state.dock.badge !== state.prev.badge) {
+    state.prev.badge = state.dock.badge
+    ipcRenderer.send('setBadge', state.dock.badge || 0)
+  }
+}
+
+const dispatchHandlers = {
+  // Torrent list: creating, deleting, selecting torrents
+  'openTorrentFile': () => ipcRenderer.send('openTorrentFile'),
+  'openFiles': () => ipcRenderer.send('openFiles'), /* shows the open file dialog */
+  'openTorrentAddress': () => { state.modal = { id: 'open-torrent-address-modal' } },
+
+  'addTorrent': (torrentId) => controllers.torrentList.addTorrent(torrentId),
+  'showCreateTorrent': (paths) => controllers.torrentList.showCreateTorrent(paths),
+  'toggleCreateTorrentAdvanced': () => controllers.torrentList.toggleCreateTorrentAdvanced(),
+  'createTorrent': (options) => controllers.torrentList.createTorrent(options),
+  'toggleTorrent': (infoHash) => controllers.torrentList.toggleTorrent(infoHash),
+  'toggleTorrentFile': (infoHash, index) => controllers.torrentList.toggleTorrentFile(infoHash, index),
+  'confirmDeleteTorrent': (infoHash, deleteData) => controllers.torrentList.confirmDeleteTorrent(infoHash, deleteData),
+  'deleteTorrent': (infoHash, deleteData) => controllers.torrentList.deleteTorrent(infoHash, deleteData),
+  'toggleSelectTorrent': (infoHash) => controllers.torrentList.toggleSelectTorrent(infoHash),
+  'openTorrentContextMenu': (infoHash) => controllers.torrentList.openTorrentContextMenu(infoHash),
+  'startTorrentingSummary': (torrentKey) => controllers.torrentList.startTorrentingSummary(torrentKey),
+
+  // Playback
+  'playFile': (infoHash, index) => controllers.playback.playFile(infoHash, index),
+  'playPause': () => controllers.playback.playPause(),
+  'skip': (time) => controllers.playback.skip(time),
+  'skipTo': (time) => controllers.playback.skipTo(time),
+  'changePlaybackRate': (dir) => controllers.playback.changePlaybackRate(dir),
+  'changeVolume': (delta) => controllers.playback.changeVolume(delta),
+  'setVolume': (vol) => controllers.playback.setVolume(vol),
+  'openItem': (infoHash, index) => controllers.playback.openItem(infoHash, index),
+
+  // Subtitles
+  'openSubtitles': () => controllers.subtitles.openSubtitles(),
+  'selectSubtitle': (index) => controllers.subtitles.selectSubtitle(index),
+  'toggleSubtitlesMenu': () => controllers.subtitles.toggleSubtitlesMenu(),
+  'checkForSubtitles': () => controllers.subtitles.checkForSubtitles(),
+  'addSubtitles': (files, autoSelect) => controllers.subtitles.addSubtitles(files, autoSelect),
+
+  // Local media: <video>, <audio>, VLC
+  'mediaStalled': () => controllers.media.mediaStalled(),
+  'mediaError': (err) => controllers.media.mediaError(err),
+  'mediaSuccess': () => controllers.media.mediaSuccess(),
+  'mediaTimeUpdate': () => controllers.media.mediaTimeUpdate(),
+  'mediaMouseMoved': () => controllers.media.mediaMouseMoved(),
+  'vlcPlay': () => controllers.media.vlcPlay(),
+  'vlcNotFound': () => controllers.media.vlcNotFound(),
+
+  // Remote casting: Chromecast, Airplay, etc
+  'toggleCastMenu': (deviceType) => lazyLoadCast().toggleMenu(deviceType),
+  'selectCastDevice': (index) => lazyLoadCast().selectDevice(index),
+  'stopCasting': () => lazyLoadCast().stop(),
+
+  // Preferences screen
+  'preferences': () => controllers.prefs.show(),
+  'updatePreferences': (key, value) => controllers.prefs.update(key, value),
+  'checkDownloadPath': checkDownloadPath,
+
+  // Update (check for new versions on Linux, where there's no auto updater)
+  'updateAvailable': (version) => controllers.update.updateAvailable(version),
+  'skipVersion': (version) => controllers.update.skipVersion(version),
+
+  // Navigation between screens (back, forward, ESC, etc)
+  'exitModal': () => { state.modal = null },
+  'backToList': backToList,
+  'escapeBack': escapeBack,
+  'back': () => state.location.back(),
+  'forward': () => state.location.forward(),
+  'cancel': () => state.location.cancel(),
+
+  // Controlling the window
+  'setDimensions': setDimensions,
+  'toggleFullScreen': (setTo) => ipcRenderer.send('toggleFullScreen', setTo),
+  'setTitle': (title) => { state.window.title = title },
+  'resetTitle': () => { state.window.title = config.APP_WINDOW_TITLE },
+
+  // Everything else
+  'onOpen': onOpen,
+  'error': onError,
+  'uncaughtError': (proc, err) => telemetry.logUncaughtError(proc, err),
+  'saveState': () => State.save(state),
+  'saveStateThrottled': () => State.saveThrottled(state),
+  'update': () => {} // No-op, just trigger an update
+}
+
+// Events from the UI never modify state directly. Instead they call dispatch()
+function dispatch (action, ...args) {
+  // Log dispatch calls, for debugging, but don't spam
+  if (!['mediaMouseMoved', 'mediaTimeUpdate', 'update'].includes(action)) {
+    console.log('dispatch: %s %o', action, args)
+  }
+
+  var handler = dispatchHandlers[action]
+  if (handler) handler(...args)
+  else console.error('Missing dispatch handler: ' + action)
+
+  // Update the virtual DOM, unless it's just a mouse move event
+  if (action !== 'mediaMouseMoved' ||
+      controllers.playback.showOrHidePlayerControls()) {
+    update()
+  }
+}
+
+// Listen to events from the main and webtorrent processes
+function setupIpc () {
+  ipcRenderer.on('log', (e, ...args) => console.log(...args))
+  ipcRenderer.on('error', (e, ...args) => console.error(...args))
+
+  ipcRenderer.on('dispatch', (e, ...args) => dispatch(...args))
+
+  ipcRenderer.on('fullscreenChanged', onFullscreenChanged)
+
+  var tc = controllers.torrent
+  ipcRenderer.on('wt-infohash', (e, ...args) => tc.torrentInfoHash(...args))
+  ipcRenderer.on('wt-metadata', (e, ...args) => tc.torrentMetadata(...args))
+  ipcRenderer.on('wt-done', (e, ...args) => tc.torrentDone(...args))
+  ipcRenderer.on('wt-warning', (e, ...args) => tc.torrentWarning(...args))
+  ipcRenderer.on('wt-error', (e, ...args) => tc.torrentError(...args))
+
+  ipcRenderer.on('wt-progress', (e, ...args) => tc.torrentProgress(...args))
+  ipcRenderer.on('wt-file-modtimes', (e, ...args) => tc.torrentFileModtimes(...args))
+  ipcRenderer.on('wt-file-saved', (e, ...args) => tc.torrentFileSaved(...args))
+  ipcRenderer.on('wt-poster', (e, ...args) => tc.torrentPosterSaved(...args))
+  ipcRenderer.on('wt-audio-metadata', (e, ...args) => tc.torrentAudioMetadata(...args))
+  ipcRenderer.on('wt-server-running', (e, ...args) => tc.torrentServerRunning(...args))
+
+  ipcRenderer.on('wt-uncaught-error', (e, err) => telemetry.logUncaughtError('webtorrent', err))
+
+  ipcRenderer.send('ipcReady')
+
+  State.on('savedState', () => ipcRenderer.send('savedState'))
+}
+
+// Quits any modal popovers and returns to the torrent list screen
+function backToList () {
+  // Exit any modals and screens with a back button
+  state.modal = null
+  state.location.backToFirst(function () {
+    // If we were already on the torrent list, scroll to the top
+    var contentTag = document.querySelector('.content')
+    if (contentTag) contentTag.scrollTop = 0
+  })
+}
+
+// Quits modals, full screen, or goes back. Happens when the user hits ESC
+function escapeBack () {
+  if (state.modal) {
+    dispatch('exitModal')
+  } else if (state.window.isFullScreen) {
+    dispatch('toggleFullScreen')
+  } else {
+    dispatch('back')
+  }
+}
+
+// Starts all torrents that aren't paused on program startup
+function resumeTorrents () {
+  state.saved.torrents
+    .map((torrentSummary) => {
+      // Torrent keys are ephemeral, reassigned each time the app runs.
+      // On startup, give all torrents a key, even the ones that are paused.
+      torrentSummary.torrentKey = state.nextTorrentKey++
+      return torrentSummary
+    })
+    .filter((s) => s.status !== 'paused')
+    .forEach((s) => controllers.torrentList.startTorrentingSummary(s.torrentKey))
+}
+
+// Set window dimensions to match video dimensions or fill the screen
+function setDimensions (dimensions) {
+  // Don't modify the window size if it's already maximized
+  if (electron.remote.getCurrentWindow().isMaximized()) {
+    state.window.bounds = null
+    return
+  }
+
+  // Save the bounds of the window for later. See restoreBounds()
+  state.window.bounds = {
+    x: window.screenX,
+    y: window.screenY,
+    width: window.outerWidth,
+    height: window.outerHeight
+  }
+  state.window.wasMaximized = electron.remote.getCurrentWindow().isMaximized
+
+  // Limit window size to screen size
+  var screenWidth = window.screen.width
+  var screenHeight = window.screen.height
+  var aspectRatio = dimensions.width / dimensions.height
+  var scaleFactor = Math.min(
+    Math.min(screenWidth / dimensions.width, 1),
+    Math.min(screenHeight / dimensions.height, 1)
+  )
+  var width = Math.max(
+    Math.floor(dimensions.width * scaleFactor),
+    config.WINDOW_MIN_WIDTH
+  )
+  var height = Math.max(
+    Math.floor(dimensions.height * scaleFactor),
+    config.WINDOW_MIN_HEIGHT
+  )
+
+  ipcRenderer.send('setAspectRatio', aspectRatio)
+  ipcRenderer.send('setBounds', {x: null, y: null, width, height})
+  state.playing.aspectRatio = aspectRatio
+}
+
+// Called when the user adds files (.torrent, files to seed, subtitles) to the app
+// via any method (drag-drop, drag to app icon, command line)
+function onOpen (files) {
+  if (!Array.isArray(files)) files = [ files ]
+
+  var url = state.location.url()
+  var allTorrents = files.every(TorrentPlayer.isTorrent)
+  var allSubtitles = files.every(controllers.subtitles.isSubtitle)
+
+  if (allTorrents) {
+    // Drop torrents onto the app: go to home screen, add torrents, no matter what
+    dispatch('backToList')
+    // All .torrent files? Add them.
+    files.forEach((file) => controllers.torrentList.addTorrent(file))
+  } else if (url === 'player' && allSubtitles) {
+    // Drop subtitles onto a playing video: add subtitles
+    controllers.subtitles.addSubtitles(files, true)
+  } else if (url === 'home') {
+    // Drop files onto home screen: show Create Torrent
+    state.modal = null
+    controllers.torrentList.showCreateTorrent(files)
+  } else {
+    // Drop files onto any other screen: show error
+    return onError('Please go back to the torrent list before creating a new torrent.')
+  }
+
+  update()
+}
+
+function onError (err) {
+  console.error(err.stack || err)
+  sound.play('ERROR')
+  state.errors.push({
+    time: new Date().getTime(),
+    message: err.message || err
+  })
+
+  update()
+}
+
+function onPaste (e) {
+  if (e.target.tagName.toLowerCase() === 'input') return
+
+  var torrentIds = electron.clipboard.readText().split('\n')
+  torrentIds.forEach(function (torrentId) {
+    torrentId = torrentId.trim()
+    if (torrentId.length === 0) return
+    controllers.torrentList.addTorrent(torrentId)
+  })
+
+  update()
+}
+
+function onFocus (e) {
+  state.window.isFocused = true
+  state.dock.badge = 0
+  update()
+}
+
+function onBlur () {
+  state.window.isFocused = false
+  update()
+}
+
+function onVisibilityChange () {
+  state.window.isVisible = !document.webkitHidden
+}
+
+function onFullscreenChanged (e, isFullScreen) {
+  state.window.isFullScreen = isFullScreen
+  if (!isFullScreen) {
+    // Aspect ratio gets reset in fullscreen mode, so restore it (Mac)
+    ipcRenderer.send('setAspectRatio', state.playing.aspectRatio)
+  }
+
+  update()
+}
+
+function checkDownloadPath () {
+  fs.stat(state.saved.prefs.downloadPath, function (err, stat) {
+    if (err) {
+      state.downloadPathStatus = 'missing'
+      return console.error(err)
+    }
+    if (stat.isDirectory()) state.downloadPathStatus = 'ok'
+    else state.downloadPathStatus = 'missing'
+  })
+}

src/renderer/views/app.js

@@ -0,0 +1,97 @@
+const React = require('react')
+
+const Header = require('./header')
+
+const Views = {
+  'home': require('./torrent-list'),
+  'player': require('./player'),
+  'create-torrent': require('./create-torrent'),
+  'preferences': require('./preferences')
+}
+
+const Modals = {
+  'open-torrent-address-modal': require('./open-torrent-address-modal'),
+  'remove-torrent-modal': require('./remove-torrent-modal'),
+  'update-available-modal': require('./update-available-modal'),
+  'unsupported-media-modal': require('./unsupported-media-modal')
+}
+
+module.exports = class App extends React.Component {
+
+  constructor (props) {
+    super(props)
+    this.state = props.state
+  }
+
+  render () {
+    var state = this.state
+
+    // Hide player controls while playing video, if the mouse stays still for a while
+    // Never hide the controls when:
+    // * The mouse is over the controls or we're scrubbing (see CSS)
+    // * The video is paused
+    // * The video is playing remotely on Chromecast or Airplay
+    var hideControls = state.location.url() === 'player' &&
+      state.playing.mouseStationarySince !== 0 &&
+      new Date().getTime() - state.playing.mouseStationarySince > 2000 &&
+      !state.playing.isPaused &&
+      state.playing.location === 'local' &&
+      state.playing.playbackRate === 1
+
+    var cls = [
+      'view-' + state.location.url(), /* e.g. view-home, view-player */
+      'is-' + process.platform /* e.g. is-darwin, is-win32, is-linux */
+    ]
+    if (state.window.isFullScreen) cls.push('is-fullscreen')
+    if (state.window.isFocused) cls.push('is-focused')
+    if (hideControls) cls.push('hide-video-controls')
+
+    var vdom = (
+      <div className={'app ' + cls.join(' ')}>
+        <Header state={state} />
+        {this.getErrorPopover()}
+        <div key='content' className='content'>{this.getView()}</div>
+        {this.getModal()}
+      </div>
+    )
+
+    return vdom
+  }
+
+  getErrorPopover () {
+    var now = new Date().getTime()
+    var recentErrors = this.state.errors.filter((x) => now - x.time < 5000)
+    var hasErrors = recentErrors.length > 0
+
+    var errorElems = recentErrors.map(function (error, i) {
+      return (<div key={i} className='error'>{error.message}</div>)
+    })
+    return (
+      <div key='errors'
+        className={'error-popover ' + (hasErrors ? 'visible' : 'hidden')}>
+        <div key='title' className='title'>Error</div>
+        {errorElems}
+      </div>
+    )
+  }
+
+  getModal () {
+    var state = this.state
+    if (!state.modal) return
+    var ModalContents = Modals[state.modal.id]
+    return (
+      <div key='modal' className='modal'>
+        <div key='modal-background' className='modal-background' />
+        <div key='modal-content' className='modal-content'>
+          <ModalContents state={state} />
+        </div>
+      </div>
+    )
+  }
+
+  getView () {
+    var state = this.state
+    var View = Views[state.location.url()]
+    return (<View state={state} />)
+  }
+}

src/renderer/views/create-torrent-error-page.js

@@ -0,0 +1,26 @@
+const React = require('react')
+
+const {dispatcher} = require('../lib/dispatcher')
+
+module.exports = class CreateTorrentErrorPage extends React.Component {
+  render () {
+    return (
+      <div className='create-torrent'>
+        <h2>Create torrent</h2>
+        <p className='torrent-info'>
+          <p>
+            Sorry, you must select at least one file that is not a hidden file.
+          </p>
+          <p>
+            Hidden files, starting with a . character, are not included.
+          </p>
+        </p>
+        <p className='float-right'>
+          <button className='button-flat light' onClick={dispatcher('cancel')}>
+            Cancel
+          </button>
+        </p>
+      </div>
+    )
+  }
+}

src/renderer/views/create-torrent.js

@@ -0,0 +1,131 @@
+const React = require('react')
+const createTorrent = require('create-torrent')
+const path = require('path')
+const prettyBytes = require('prettier-bytes')
+
+const {dispatch, dispatcher} = require('../lib/dispatcher')
+const CreateTorrentErrorPage = require('./create-torrent-error-page')
+
+module.exports = class CreateTorrentPage extends React.Component {
+  render () {
+    var state = this.props.state
+    var info = state.location.current()
+
+    // Preprocess: exclude .DS_Store and other dotfiles
+    var files = info.files
+      .filter((f) => !f.name.startsWith('.'))
+      .map((f) => ({name: f.name, path: f.path, size: f.size}))
+    if (files.length === 0) return (<CreateTorrentErrorPage state={state} />)
+
+    // First, extract the base folder that the files are all in
+    var pathPrefix = info.folderPath
+    if (!pathPrefix) {
+      pathPrefix = files.map((x) => x.path).reduce(findCommonPrefix)
+      if (!pathPrefix.endsWith('/') && !pathPrefix.endsWith('\\')) {
+        pathPrefix = path.dirname(pathPrefix)
+      }
+    }
+
+    // Sanity check: show the number of files and total size
+    var numFiles = files.length
+    var totalBytes = files
+      .map((f) => f.size)
+      .reduce((a, b) => a + b, 0)
+    var torrentInfo = `${numFiles} files, ${prettyBytes(totalBytes)}`
+
+    // Then, use the name of the base folder (or sole file, for a single file torrent)
+    // as the default name. Show all files relative to the base folder.
+    var defaultName, basePath
+    if (files.length === 1) {
+      // Single file torrent: /a/b/foo.jpg -> torrent name 'foo.jpg', path '/a/b'
+      defaultName = files[0].name
+      basePath = pathPrefix
+    } else {
+      // Multi file torrent: /a/b/{foo, bar}.jpg -> torrent name 'b', path '/a'
+      defaultName = path.basename(pathPrefix)
+      basePath = path.dirname(pathPrefix)
+    }
+    var maxFileElems = 100
+    var fileElems = files.slice(0, maxFileElems).map(function (file, i) {
+      var relativePath = files.length === 0 ? file.name : path.relative(pathPrefix, file.path)
+      return (<div key={i}>{relativePath}</div>)
+    })
+    if (files.length > maxFileElems) {
+      fileElems.push(<div key='more'>+ {maxFileElems - files.length} more</div>)
+    }
+    var trackers = createTorrent.announceList.join('\n')
+    var collapsedClass = info.showAdvanced ? 'expanded' : 'collapsed'
+
+    return (
+      <div className='create-torrent'>
+        <h2>Create torrent {defaultName}</h2>
+        <div key='info' className='torrent-info'>
+          {torrentInfo}
+        </div>
+        <div key='path-prefix' className='torrent-attribute'>
+          <label>Path:</label>
+          <div className='torrent-attribute'>{pathPrefix}</div>
+        </div>
+        <div key='toggle' className={'expand-collapse ' + collapsedClass}
+          onClick={dispatcher('toggleCreateTorrentAdvanced')}>
+          {info.showAdvanced ? 'Basic' : 'Advanced'}
+        </div>
+        <div key='advanced' className={'create-torrent-advanced ' + collapsedClass}>
+          <div key='comment' className='torrent-attribute'>
+            <label>Comment:</label>
+            <textarea className='torrent-attribute torrent-comment' />
+          </div>
+          <div key='trackers' className='torrent-attribute'>
+            <label>Trackers:</label>
+            <textarea className='torrent-attribute torrent-trackers' defaultValue={trackers} />
+          </div>
+          <div key='private' className='torrent-attribute'>
+            <label>Private:</label>
+            <input type='checkbox' className='torrent-is-private' value='torrent-is-private' />
+          </div>
+          <div key='files' className='torrent-attribute'>
+            <label>Files:</label>
+            <div>{fileElems}</div>
+          </div>
+        </div>
+        <div key='buttons' className='float-right'>
+          <button key='cancel' className='button-flat light' onClick={dispatcher('cancel')}>Cancel</button>
+          <button key='create' className='button-raised' onClick={handleOK}>Create Torrent</button>
+        </div>
+      </div>
+    )
+
+    function handleOK () {
+      // TODO: dcposch use React refs instead
+      var announceList = document.querySelector('.torrent-trackers').value
+        .split('\n')
+        .map((s) => s.trim())
+        .filter((s) => s !== '')
+      var isPrivate = document.querySelector('.torrent-is-private').checked
+      var comment = document.querySelector('.torrent-comment').value.trim()
+      var options = {
+        // We can't let the user choose their own name if we want WebTorrent
+        // to use the files in place rather than creating a new folder.
+        // If we ever want to add support for that:
+        // name: document.querySelector('.torrent-name').value
+        name: defaultName,
+        path: basePath,
+        files: files,
+        announce: announceList,
+        private: isPrivate,
+        comment: comment
+      }
+      dispatch('createTorrent', options)
+    }
+  }
+}
+
+// Finds the longest common prefix
+function findCommonPrefix (a, b) {
+  for (var i = 0; i < a.length && i < b.length; i++) {
+    if (a.charCodeAt(i) !== b.charCodeAt(i)) break
+  }
+  if (i === a.length) return a
+  if (i === b.length) return b
+  return a.substring(0, i)
+}

src/renderer/views/header.js

@@ -0,0 +1,50 @@
+const React = require('react')
+
+const {dispatcher} = require('../lib/dispatcher')
+
+module.exports = class Header extends React.Component {
+  render () {
+    var loc = this.props.state.location
+    return (
+      <div key='header' className='header'>
+        {this.getTitle()}
+        <div className='nav left float-left'>
+          <i
+            className={'icon back ' + (loc.hasBack() ? '' : 'disabled')}
+            title='Back'
+            onClick={dispatcher('back')}>
+            chevron_left
+          </i>
+          <i
+            className={'icon forward ' + (loc.hasForward() ? '' : 'disabled')}
+            title='Forward'
+            onClick={dispatcher('forward')}>
+            chevron_right
+          </i>
+        </div>
+        <div className='nav right float-right'>
+          {this.getAddButton()}
+        </div>
+      </div>
+    )
+  }
+
+  getTitle () {
+    if (process.platform !== 'darwin') return null
+    var state = this.props.state
+    return (<div className='title ellipsis'>{state.window.title}</div>)
+  }
+
+  getAddButton () {
+    var state = this.props.state
+    if (state.location.url() !== 'home') return null
+    return (
+      <i
+        className='icon add'
+        title='Add torrent'
+        onClick={dispatcher('openFiles')}>
+        add
+      </i>
+    )
+  }
+}

src/renderer/views/open-torrent-address-modal.js

@@ -0,0 +1,32 @@
+const React = require('react')
+
+const {dispatch, dispatcher} = require('../lib/dispatcher')
+
+module.exports = class OpenTorrentAddressModal extends React.Component {
+  render () {
+    // TODO: dcposch remove janky inline <script>
+    return (
+      <div className='open-torrent-address-modal'>
+        <p><label>Enter torrent address or magnet link</label></p>
+        <p>
+          <input id='add-torrent-url' type='text' onKeyPress={handleKeyPress} />
+        </p>
+        <p className='float-right'>
+          <button className='button button-flat' onClick={dispatcher('exitModal')}>Cancel</button>
+          <button className='button button-raised' onClick={handleOK}>OK</button>
+        </p>
+        <script>document.querySelector('#add-torrent-url').focus()</script>
+      </div>
+    )
+  }
+}
+
+function handleKeyPress (e) {
+  if (e.which === 13) handleOK() /* hit Enter to submit */
+}
+
+function handleOK () {
+  dispatch('exitModal')
+  // TODO: dcposch use React refs instead
+  dispatch('addTorrent', document.querySelector('#add-torrent-url').value)
+}

src/renderer/views/player.js

@@ -0,0 +1,627 @@
+const React = require('react')
+const Bitfield = require('bitfield')
+const prettyBytes = require('prettier-bytes')
+const zeroFill = require('zero-fill')
+
+const TorrentSummary = require('../lib/torrent-summary')
+const {dispatch, dispatcher} = require('../lib/dispatcher')
+
+// Shows a streaming video player. Standard features + Chromecast + Airplay
+module.exports = class Player extends React.Component {
+  render () {
+    // Show the video as large as will fit in the window, play immediately
+    // If the video is on Chromecast or Airplay, show a title screen instead
+    var state = this.props.state
+    var showVideo = state.playing.location === 'local'
+    return (
+      <div
+        className='player'
+        onWheel={handleVolumeWheel}
+        onMouseMove={dispatcher('mediaMouseMoved')}>
+        {showVideo ? renderMedia(state) : renderCastScreen(state)}
+        {renderPlayerControls(state)}
+      </div>
+    )
+  }
+}
+
+// Handles volume change by wheel
+function handleVolumeWheel (e) {
+  dispatch('changeVolume', (-e.deltaY | e.deltaX) / 500)
+}
+
+function renderMedia (state) {
+  if (!state.server) return
+
+  // Unfortunately, play/pause can't be done just by modifying HTML.
+  // Instead, grab the DOM node and play/pause it if necessary
+  // Get the <video> or <audio> tag
+  var mediaElement = document.querySelector(state.playing.type)
+  if (mediaElement !== null) {
+    if (state.playing.isPaused && !mediaElement.paused) {
+      mediaElement.pause()
+    } else if (!state.playing.isPaused && mediaElement.paused) {
+      mediaElement.play()
+    }
+    // When the user clicks or drags on the progress bar, jump to that position
+    if (state.playing.jumpToTime != null) {
+      mediaElement.currentTime = state.playing.jumpToTime
+      state.playing.jumpToTime = null
+    }
+    if (state.playing.playbackRate !== mediaElement.playbackRate) {
+      mediaElement.playbackRate = state.playing.playbackRate
+    }
+    // Recover previous volume
+    if (state.previousVolume !== null && isFinite(state.previousVolume)) {
+      mediaElement.volume = state.previousVolume
+      state.previousVolume = null
+    }
+
+    // Set volume
+    if (state.playing.setVolume !== null && isFinite(state.playing.setVolume)) {
+      mediaElement.volume = state.playing.setVolume
+      state.playing.setVolume = null
+    }
+
+    // Switch to the newly added subtitle track, if available
+    var tracks = mediaElement.textTracks || []
+    for (var j = 0; j < tracks.length; j++) {
+      var isSelectedTrack = j === state.playing.subtitles.selectedIndex
+      tracks[j].mode = isSelectedTrack ? 'showing' : 'hidden'
+    }
+
+    // Save video position
+    var file = state.getPlayingFileSummary()
+    file.currentTime = state.playing.currentTime = mediaElement.currentTime
+    file.duration = state.playing.duration = mediaElement.duration
+
+    // Save selected subtitle
+    if (state.playing.subtitles.selectedIndex !== -1) {
+      var index = state.playing.subtitles.selectedIndex
+      file.selectedSubtitle = state.playing.subtitles.tracks[index].filePath
+    } else if (file.selectedSubtitle != null) {
+      delete file.selectedSubtitle
+    }
+
+    state.playing.volume = mediaElement.volume
+  }
+
+  // Add subtitles to the <video> tag
+  var trackTags = []
+  if (state.playing.subtitles.selectedIndex >= 0) {
+    for (var i = 0; i < state.playing.subtitles.tracks.length; i++) {
+      var track = state.playing.subtitles.tracks[i]
+      var isSelected = state.playing.subtitles.selectedIndex === i
+      trackTags.push(
+        <track
+          key={i}
+          default={isSelected ? 'default' : ''}
+          label={track.label}
+          type='subtitles'
+          src={track.buffer} />
+      )
+    }
+  }
+
+  // Create the <audio> or <video> tag
+  var MediaTagName = state.playing.type
+  var mediaTag = (
+    <MediaTagName
+      src={state.server.localURL}
+      onDoubleClick={dispatcher('toggleFullScreen')}
+      onLoadedMetadata={onLoadedMetadata}
+      onEnded={onEnded}
+      onStalled={dispatcher('mediaStalled')}
+      onError={dispatcher('mediaError')}
+      onTimeUpdate={dispatcher('mediaTimeUpdate')}
+      onEncrypted={dispatcher('mediaEncrypted')}
+      onCanPlay={onCanPlay}>
+      {trackTags}
+    </MediaTagName>
+  )
+
+  // Show the media.
+  return (
+    <div
+      key='letterbox'
+      className='letterbox'
+      onMouseMove={dispatcher('mediaMouseMoved')}>
+      {mediaTag}
+      {renderOverlay(state)}
+    </div>
+  )
+
+  // As soon as we know the video dimensions, resize the window
+  function onLoadedMetadata (e) {
+    if (state.playing.type !== 'video') return
+    var video = e.target
+    var dimensions = {
+      width: video.videoWidth,
+      height: video.videoHeight
+    }
+    dispatch('setDimensions', dimensions)
+  }
+
+  // When the video completes, pause the video instead of looping
+  function onEnded (e) {
+    state.playing.isPaused = true
+  }
+
+  function onCanPlay (e) {
+    var elem = e.target
+    if (state.playing.type === 'video' &&
+      elem.webkitVideoDecodedByteCount === 0) {
+      dispatch('mediaError', 'Video codec unsupported')
+    } else if (elem.webkitAudioDecodedByteCount === 0) {
+      dispatch('mediaError', 'Audio codec unsupported')
+    } else {
+      dispatch('mediaSuccess')
+      elem.play()
+    }
+  }
+}
+
+function renderOverlay (state) {
+  var elems = []
+  var audioMetadataElem = renderAudioMetadata(state)
+  var spinnerElem = renderLoadingSpinner(state)
+  if (audioMetadataElem) elems.push(audioMetadataElem)
+  if (spinnerElem) elems.push(spinnerElem)
+
+  // Video fills the window, centered with black bars if necessary
+  // Audio gets a static poster image and a summary of the file metadata.
+  var style
+  if (state.playing.type === 'audio') {
+    style = { backgroundImage: cssBackgroundImagePoster(state) }
+  } else if (elems.length !== 0) {
+    style = { backgroundImage: cssBackgroundImageDarkGradient() }
+  } else {
+    // Video playing, so no spinner. No overlay needed
+    return
+  }
+
+  return (
+    <div key='overlay' className='media-overlay-background' style={style}>
+      <div className='media-overlay'>{elems}</div>
+    </div>
+  )
+}
+
+function renderAudioMetadata (state) {
+  var fileSummary = state.getPlayingFileSummary()
+  if (!fileSummary.audioInfo) return
+  var info = fileSummary.audioInfo
+
+  // Get audio track info
+  var title = info.title
+  if (!title) {
+    title = fileSummary.name
+  }
+  var artist = info.artist && info.artist[0]
+  var album = info.album
+  if (album && info.year && !album.includes(info.year)) {
+    album += ' (' + info.year + ')'
+  }
+  var track
+  if (info.track && info.track.no && info.track.of) {
+    track = info.track.no + ' of ' + info.track.of
+  }
+
+  // Show a small info box in the middle of the screen with title/album/etc
+  var elems = []
+  if (artist) {
+    elems.push((
+      <div key='artist' className='audio-artist'>
+        <label>Artist</label>{artist}
+      </div>
+    ))
+  }
+  if (album) {
+    elems.push((
+      <div key='album' className='audio-album'>
+        <label>Album</label>{album}
+      </div>
+    ))
+  }
+  if (track) {
+    elems.push((
+      <div key='track' className='audio-track'>
+        <label>Track</label>{track}
+      </div>
+    ))
+  }
+
+  // Align the title with the other info, if available. Otherwise, center title
+  var emptyLabel = (<label />)
+  elems.unshift((
+    <div key='title' className='audio-title'>
+      {elems.length ? emptyLabel : undefined}{title}
+    </div>
+  ))
+
+  return (<div key='audio-metadata' className='audio-metadata'>{elems}</div>)
+}
+
+function renderLoadingSpinner (state) {
+  if (state.playing.isPaused) return
+  var isProbablyStalled = state.playing.isStalled ||
+    (new Date().getTime() - state.playing.lastTimeUpdate > 2000)
+  if (!isProbablyStalled) return
+
+  var prog = state.getPlayingTorrentSummary().progress || {}
+  var fileProgress = 0
+  if (prog.files) {
+    var file = prog.files[state.playing.fileIndex]
+    fileProgress = Math.floor(100 * file.numPiecesPresent / file.numPieces)
+  }
+
+  return (
+    <div key='loading' className='media-stalled'>
+      <div key='loading-spinner' className='loading-spinner'>&nbsp;</div>
+      <div key='loading-progress' className='loading-status ellipsis'>
+        <span className='progress'>{fileProgress}%</span> downloaded,
+        <span>↓ {prettyBytes(prog.downloadSpeed || 0)}/s</span>
+        <span>↑ {prettyBytes(prog.uploadSpeed || 0)}/s</span>
+      </div>
+    </div>
+  )
+}
+
+function renderCastScreen (state) {
+  var castIcon, castType, isCast
+  if (state.playing.location.startsWith('chromecast')) {
+    castIcon = 'cast_connected'
+    castType = 'Chromecast'
+    isCast = true
+  } else if (state.playing.location.startsWith('airplay')) {
+    castIcon = 'airplay'
+    castType = 'AirPlay'
+    isCast = true
+  } else if (state.playing.location.startsWith('dlna')) {
+    castIcon = 'tv'
+    castType = 'DLNA'
+    isCast = true
+  } else if (state.playing.location === 'vlc') {
+    castIcon = 'tv'
+    castType = 'VLC'
+    isCast = false
+  } else if (state.playing.location === 'error') {
+    castIcon = 'error_outline'
+    castType = 'Error'
+    isCast = false
+  }
+
+  var isStarting = state.playing.location.endsWith('-pending')
+  var castName = state.playing.castName
+  var castStatus
+  if (isCast && isStarting) castStatus = 'Connecting to ' + castName + '...'
+  else if (isCast && !isStarting) castStatus = 'Connected to ' + castName
+  else castStatus = ''
+
+  // Show a nice title image, if possible
+  var style = {
+    backgroundImage: cssBackgroundImagePoster(state)
+  }
+
+  return (
+    <div key='cast' className='letterbox' style={style}>
+      <div className='cast-screen'>
+        <i className='icon'>{castIcon}</i>
+        <div key='type' className='cast-type'>{castType}</div>
+        <div key='status' className='cast-status'>{castStatus}</div>
+      </div>
+    </div>
+  )
+}
+
+function renderCastOptions (state) {
+  if (!state.devices.castMenu) return
+
+  var {location, devices} = state.devices.castMenu
+  var player = state.devices[location]
+
+  var items = devices.map(function (device, ix) {
+    var isSelected = player.device === device
+    var name = device.name
+    return (
+      <li key={ix} onClick={dispatcher('selectCastDevice', ix)}>
+        <i className='icon'>{isSelected ? 'radio_button_checked' : 'radio_button_unchecked'}</i>
+        {name}
+      </li>
+    )
+  })
+
+  return (
+    <ul key='cast-options' className='options-list'>
+      {items}
+    </ul>
+  )
+}
+
+function renderSubtitleOptions (state) {
+  var subtitles = state.playing.subtitles
+  if (!subtitles.tracks.length || !subtitles.showMenu) return
+
+  var items = subtitles.tracks.map(function (track, ix) {
+    var isSelected = state.playing.subtitles.selectedIndex === ix
+    return (
+      <li key={ix} onClick={dispatcher('selectSubtitle', ix)}>
+        <i className='icon'>{'radio_button_' + (isSelected ? 'checked' : 'unchecked')}</i>
+        {track.label}
+      </li>
+    )
+  })
+
+  var noneSelected = state.playing.subtitles.selectedIndex === -1
+  var noneClass = 'radio_button_' + (noneSelected ? 'checked' : 'unchecked')
+  return (
+    <ul key='subtitle-options' className='options-list'>
+      {items}
+      <li onClick={dispatcher('selectSubtitle', -1)}>
+        <i className='icon'>{noneClass}</i>
+        None
+      </li>
+    </ul>
+  )
+}
+
+function renderPlayerControls (state) {
+  var positionPercent = 100 * state.playing.currentTime / state.playing.duration
+  var playbackCursorStyle = { left: 'calc(' + positionPercent + '% - 3px)' }
+  var captionsClass = state.playing.subtitles.tracks.length === 0
+    ? 'disabled'
+    : state.playing.subtitles.selectedIndex >= 0
+      ? 'active'
+      : ''
+
+  var elements = [
+    <div key='playback-bar' className='playback-bar'>
+      {renderLoadingBar(state)}
+      <div
+        key='cursor'
+        className='playback-cursor'
+        style={playbackCursorStyle}
+      />
+      <div
+        key='scrub-bar'
+        className='scrub-bar'
+        draggable='true'
+        onDragStart={handleDragStart}
+        onClick={handleScrub}
+        onDrag={handleScrub}
+      />
+    </div>,
+
+    <i
+      key='play'
+      className='icon play-pause float-left'
+      onClick={dispatcher('playPause')}>
+      {state.playing.isPaused ? 'play_arrow' : 'pause'}
+    </i>,
+
+    <i
+      key='fullscreen'
+      className='icon fullscreen float-right'
+      onClick={dispatcher('toggleFullScreen')}>
+      {state.window.isFullScreen ? 'fullscreen_exit' : 'fullscreen'}
+    </i>
+  ]
+
+  if (state.playing.type === 'video') {
+    // show closed captions icon
+    elements.push((
+      <i
+        key='subtitles'
+        className={'icon closed-caption float-right ' + captionsClass}
+        onClick={handleSubtitles}>
+        closed_caption
+      </i>
+    ))
+  }
+
+  // If we've detected a Chromecast or AppleTV, the user can play video there
+  var castTypes = ['chromecast', 'airplay', 'dlna']
+  var isCastingAnywhere = castTypes.some(
+    (castType) => state.playing.location.startsWith(castType))
+
+  // Add the cast buttons. Icons for each cast type, connected/disconnected:
+  var buttonIcons = {
+    'chromecast': {true: 'cast_connected', false: 'cast'},
+    'airplay': {true: 'airplay', false: 'airplay'},
+    'dlna': {true: 'tv', false: 'tv'}
+  }
+  castTypes.forEach(function (castType) {
+    // Do we show this button (eg. the Chromecast button) at all?
+    var isCasting = state.playing.location.startsWith(castType)
+    var player = state.devices[castType]
+    if ((!player || player.getDevices().length === 0) && !isCasting) return
+
+    // Show the button. Three options for eg the Chromecast button:
+    var buttonClass, buttonHandler
+    if (isCasting) {
+      // Option 1: we are currently connected to Chromecast. Button stops the cast.
+      buttonClass = 'active'
+      buttonHandler = dispatcher('stopCasting')
+    } else if (isCastingAnywhere) {
+      // Option 2: we are currently connected somewhere else. Button disabled.
+      buttonClass = 'disabled'
+      buttonHandler = undefined
+    } else {
+      // Option 3: we are not connected anywhere. Button opens Chromecast menu.
+      buttonClass = ''
+      buttonHandler = dispatcher('toggleCastMenu', castType)
+    }
+    var buttonIcon = buttonIcons[castType][isCasting]
+
+    elements.push((
+      <i
+        key={castType}
+        className={'icon device float-right ' + buttonClass}
+        onClick={buttonHandler}>
+        {buttonIcon}
+      </i>
+    ))
+  })
+
+  // Render volume slider
+  var volume = state.playing.volume
+  var volumeIcon = 'volume_' + (
+    volume === 0 ? 'off'
+    : volume < 0.3 ? 'mute'
+    : volume < 0.6 ? 'down'
+    : 'up')
+  var volumeStyle = {
+    background: '-webkit-gradient(linear, left top, right top, ' +
+      'color-stop(' + (volume * 100) + '%, #eee), ' +
+      'color-stop(' + (volume * 100) + '%, #727272))'
+  }
+
+  // TODO: dcposch change the range input to use value / onChanged instead of
+  // "readonly" / onMouse[Down,Move,Up]
+  elements.push((
+    <div key='volume' className='volume float-left'>
+      <i
+        className='icon volume-icon float-left'
+        onMouseDown={handleVolumeMute}>
+        {volumeIcon}
+      </i>
+      <input
+        className='volume-slider float-right'
+        type='range' min='0' max='1' step='0.05'
+        value={volume}
+        onChange={handleVolumeScrub}
+        style={volumeStyle}
+      />
+    </div>
+  ))
+
+  // Show video playback progress
+  var currentTimeStr = formatTime(state.playing.currentTime)
+  var durationStr = formatTime(state.playing.duration)
+  elements.push((
+    <span key='time' className='time float-left'>
+      {currentTimeStr} / {durationStr}
+    </span>
+  ))
+
+  // render playback rate
+  if (state.playing.playbackRate !== 1) {
+    elements.push((
+      <span key='rate' className='rate float-left'>
+        {state.playing.playbackRate}x
+      </span>
+    ))
+  }
+
+  return (
+    <div key='controls' className='controls'>
+      {elements}
+      {renderCastOptions(state)}
+      {renderSubtitleOptions(state)}
+    </div>
+  )
+
+  function handleDragStart (e) {
+    // Prevent the cursor from changing, eg to a green + icon on Mac
+    if (e.dataTransfer) {
+      var dt = e.dataTransfer
+      dt.effectAllowed = 'none'
+    }
+  }
+
+  // Handles a click or drag to scrub (jump to another position in the video)
+  function handleScrub (e) {
+    if (!e.clientX) return
+    dispatch('mediaMouseMoved')
+    var windowWidth = document.querySelector('body').clientWidth
+    var fraction = e.clientX / windowWidth
+    var position = fraction * state.playing.duration /* seconds */
+    dispatch('skipTo', position)
+  }
+
+  // Handles volume muting and Unmuting
+  function handleVolumeMute (e) {
+    if (state.playing.volume === 0.0) {
+      dispatch('setVolume', 1.0)
+    } else {
+      dispatch('setVolume', 0.0)
+    }
+  }
+
+  // Handles volume slider scrub
+  function handleVolumeScrub (e) {
+    dispatch('setVolume', e.target.value)
+  }
+
+  function handleSubtitles (e) {
+    if (!state.playing.subtitles.tracks.length || e.ctrlKey || e.metaKey) {
+      // if no subtitles available select it
+      dispatch('openSubtitles')
+    } else {
+      dispatch('toggleSubtitlesMenu')
+    }
+  }
+}
+
+// Renders the loading bar. Shows which parts of the torrent are loaded, which
+// can be 'spongey' / non-contiguous
+function renderLoadingBar (state) {
+  var torrentSummary = state.getPlayingTorrentSummary()
+  if (!torrentSummary.progress) {
+    return []
+  }
+
+  // Find all contiguous parts of the torrent which are loaded
+  var prog = torrentSummary.progress
+  var fileProg = prog.files[state.playing.fileIndex]
+  var parts = []
+  var lastPiecePresent = false
+  for (var i = fileProg.startPiece; i <= fileProg.endPiece; i++) {
+    var partPresent = Bitfield.prototype.get.call(prog.bitfield, i)
+    if (partPresent && !lastPiecePresent) {
+      parts.push({start: i - fileProg.startPiece, count: 1})
+    } else if (partPresent) {
+      parts[parts.length - 1].count++
+    }
+    lastPiecePresent = partPresent
+  }
+
+  // Output some bars to show which parts of the file are loaded
+  var loadingBarElems = parts.map(function (part, i) {
+    var style = {
+      left: (100 * part.start / fileProg.numPieces) + '%',
+      width: (100 * part.count / fileProg.numPieces) + '%'
+    }
+
+    return (<div key={i} className='loading-bar-part' style={style} />)
+  })
+  return (<div key='loading-bar' className='loading-bar'>{loadingBarElems}</div>)
+}
+
+// Returns the CSS background-image string for a poster image + dark vignette
+function cssBackgroundImagePoster (state) {
+  var torrentSummary = state.getPlayingTorrentSummary()
+  var posterPath = TorrentSummary.getPosterPath(torrentSummary)
+  if (!posterPath) return ''
+  return cssBackgroundImageDarkGradient() + `, url(${posterPath})`
+}
+
+function cssBackgroundImageDarkGradient () {
+  return 'radial-gradient(circle at center, ' +
+    'rgba(0,0,0,0.4) 0%, rgba(0,0,0,1) 100%)'
+}
+
+function formatTime (time) {
+  if (typeof time !== 'number' || Number.isNaN(time)) {
+    return '0:00'
+  }
+
+  var hours = Math.floor(time / 3600)
+  var minutes = Math.floor(time % 3600 / 60)
+  if (hours > 0) {
+    minutes = zeroFill(2, minutes)
+  }
+  var seconds = zeroFill(2, Math.floor(time % 60))
+
+  return (hours > 0 ? hours + ':' : '') + minutes + ':' + seconds
+}

src/renderer/views/preferences.js

@@ -0,0 +1,194 @@
+const React = require('react')
+const remote = require('electron').remote
+const dialog = remote.dialog
+
+const {dispatch} = require('../lib/dispatcher')
+
+module.exports = class Preferences extends React.Component {
+  render () {
+    var state = this.props.state
+    return (
+      <div className='preferences'>
+        {renderGeneralSection(state)}
+        {renderPlaybackSection(state)}
+      </div>
+    )
+  }
+}
+
+function renderGeneralSection (state) {
+  return renderSection({
+    key: 'general',
+    title: 'General',
+    description: '',
+    icon: 'settings'
+  }, [
+    renderDownloadPathSelector(state),
+    renderFileHandlers(state)
+  ])
+}
+
+function renderPlaybackSection (state) {
+  return renderSection({
+    title: 'Playback',
+    description: '',
+    icon: 'settings'
+  }, [
+    renderPlayInVlcSelector(state)
+  ])
+}
+
+function renderPlayInVlcSelector (state) {
+  return renderCheckbox({
+    key: 'play-in-vlc',
+    label: 'Play in VLC',
+    description: 'Media will play in VLC',
+    property: 'playInVlc',
+    value: state.saved.prefs.playInVlc
+  },
+  state.unsaved.prefs.playInVlc,
+  function (value) {
+    dispatch('updatePreferences', 'playInVlc', value)
+  })
+}
+
+function renderDownloadPathSelector (state) {
+  return renderFileSelector({
+    key: 'download-path',
+    label: 'Download Path',
+    description: 'Data from torrents will be saved here',
+    property: 'downloadPath',
+    options: {
+      title: 'Select download directory',
+      properties: [ 'openDirectory' ]
+    }
+  },
+  state.unsaved.prefs.downloadPath,
+  function (filePath) {
+    dispatch('updatePreferences', 'downloadPath', filePath)
+  })
+}
+
+function renderFileHandlers (state) {
+  var definition = {
+    key: 'file-handlers',
+    label: 'Handle Torrent Files'
+  }
+  var buttonText = state.unsaved.prefs.isFileHandler
+    ? 'Remove default app for torrent files'
+    : 'Make WebTorrent the default app for torrent files'
+  var controls = [(
+    <button key='toggle-handlers'
+      className='btn'
+      onClick={toggleFileHandlers}>
+      {buttonText}
+    </button>
+  )]
+  return renderControlGroup(definition, controls)
+
+  function toggleFileHandlers () {
+    var isFileHandler = state.unsaved.prefs.isFileHandler
+    dispatch('updatePreferences', 'isFileHandler', !isFileHandler)
+  }
+}
+
+// Renders a prefs section.
+// - definition should be {icon, title, description}
+// - controls should be an array of vdom elements
+function renderSection (definition, controls) {
+  var helpElem = !definition.description ? null : (
+    <div key='help' className='help text'>
+      <i className='icon'>help_outline</i>{definition.description}
+    </div>
+  )
+  return (
+    <section key={definition.key} className='section preferences-panel'>
+      <div className='section-container'>
+        <div key='heading' className='section-heading'>
+          <i className='icon'>{definition.icon}</i>{definition.title}
+        </div>
+        {helpElem}
+        <div key='body' className='section-body'>
+          {controls}
+        </div>
+      </div>
+    </section>
+  )
+}
+
+function renderCheckbox (definition, value, callback) {
+  var iconClass = 'icon clickable'
+  if (value) iconClass += ' enabled'
+
+  return (
+    <div key='{definition.key}' className='control-group'>
+      <div className='controls'>
+        <label className='control-label'>
+          <div className='preference-title'>{definition.label}</div>
+        </label>
+        <div className='controls'>
+          <label className='clickable' onClick={handleClick}>
+            <i
+              className={iconClass}
+              id='{definition.property}'
+            >
+              check_circle
+            </i>
+            <span className='checkbox-label'>{definition.description}</span>
+          </label>
+        </div>
+      </div>
+    </div>
+  )
+  function handleClick () {
+    callback(!value)
+  }
+}
+
+// Creates a file chooser
+// - defition should be {label, description, options}
+//   options are passed to dialog.showOpenDialog
+// - value should be the current pref, a file or folder path
+// - callback takes a new file or folder path
+function renderFileSelector (definition, value, callback) {
+  var controls = [(
+    <input
+      type='text'
+      className='file-picker-text'
+      key={definition.property}
+      id={definition.property}
+      disabled='disabled'
+      value={value} />
+  ), (
+    <button
+      key={definition.property + '-btn'}
+      className='btn'
+      onClick={handleClick}>
+      <i className='icon'>folder_open</i>
+    </button>
+  )]
+  return renderControlGroup(definition, controls)
+
+  function handleClick () {
+    dialog.showOpenDialog(remote.getCurrentWindow(), definition.options, function (filenames) {
+      if (!Array.isArray(filenames)) return
+      callback(filenames[0])
+    })
+  }
+}
+
+function renderControlGroup (definition, controls) {
+  return (
+    <div key={definition.key} className='control-group'>
+      <div className='controls'>
+        <label className='control-label'>
+          <div className='preference-title'>{definition.label}</div>
+          <div className='preference-description'>{definition.description}</div>
+        </label>
+        <div className='controls'>
+          {controls}
+        </div>
+      </div>
+    </div>
+  )
+}

src/renderer/views/remove-torrent-modal.js

@@ -0,0 +1,28 @@
+const React = require('react')
+
+const {dispatch, dispatcher} = require('../lib/dispatcher')
+
+module.exports = class RemoveTorrentModal extends React.Component {
+  render () {
+    var state = this.props.state
+    var message = state.modal.deleteData
+      ? 'Are you sure you want to remove this torrent from the list and delete the data file?'
+      : 'Are you sure you want to remove this torrent from the list?'
+    var buttonText = state.modal.deleteData ? 'Remove Data' : 'Remove'
+
+    return (
+      <div>
+        <p><strong>{message}</strong></p>
+        <p className='float-right'>
+          <button className='button button-flat' onClick={dispatcher('exitModal')}>Cancel</button>
+          <button className='button button-raised' onClick={handleRemove}>{buttonText}</button>
+        </p>
+      </div>
+    )
+
+    function handleRemove () {
+      dispatch('deleteTorrent', state.modal.infoHash, state.modal.deleteData)
+      dispatch('exitModal')
+    }
+  }
+}

src/renderer/views/torrent-list.js

@@ -0,0 +1,386 @@
+const React = require('react')
+const prettyBytes = require('prettier-bytes')
+
+const TorrentSummary = require('../lib/torrent-summary')
+const TorrentPlayer = require('../lib/torrent-player')
+const {dispatcher} = require('../lib/dispatcher')
+
+module.exports = class TorrentList extends React.Component {
+  render () {
+    var state = this.props.state
+
+    var contents = []
+    if (state.downloadPathStatus === 'missing') {
+      contents.push(
+        <div key='torrent-missing-path'>
+          <p>Download path missing: {state.saved.prefs.downloadPath}</p>
+          <p>Check that all drives are connected?</p>
+          <p>Alternatively, choose a new download path
+            in <a href='#' onClick={dispatcher('preferences')}>Preferences</a>
+          </p>
+        </div>
+      )
+    }
+    var torrentElems = state.saved.torrents.map(
+      (torrentSummary) => this.renderTorrent(torrentSummary)
+    )
+    contents.push(...torrentElems)
+    contents.push(
+      <div key='torrent-placeholder' className='torrent-placeholder'>
+        <span className='ellipsis'>Drop a torrent file here or paste a magnet link</span>
+      </div>
+    )
+
+    return (
+      <div key='torrent-list' className='torrent-list'>
+        {contents}
+      </div>
+    )
+  }
+
+  renderTorrent (torrentSummary) {
+    var state = this.props.state
+    var infoHash = torrentSummary.infoHash
+    var isSelected = infoHash && state.selectedInfoHash === infoHash
+
+    // Background image: show some nice visuals, like a frame from the movie, if possible
+    var style = {}
+    if (torrentSummary.posterFileName) {
+      var gradient = isSelected
+        ? 'linear-gradient(to bottom, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.4) 100%)'
+        : 'linear-gradient(to bottom, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 100%)'
+      var posterPath = TorrentSummary.getPosterPath(torrentSummary)
+      style.backgroundImage = gradient + `, url('${posterPath}')`
+    }
+
+    // Foreground: name of the torrent, basic info like size, play button,
+    // cast buttons if available, and delete
+    var classes = ['torrent']
+    //  playStatus turns the play button into a loading spinner or error icon
+    if (torrentSummary.playStatus) classes.push(torrentSummary.playStatus)
+    if (isSelected) classes.push('selected')
+    if (!infoHash) classes.push('disabled')
+    if (!torrentSummary.torrentKey) throw new Error('Missing torrentKey')
+    return (
+      <div
+        key={torrentSummary.torrentKey}
+        style={style}
+        className={classes.join(' ')}
+        onContextMenu={infoHash && dispatcher('openTorrentContextMenu', infoHash)}
+        onClick={infoHash && dispatcher('toggleSelectTorrent', infoHash)}>
+        {this.renderTorrentMetadata(torrentSummary)}
+        {infoHash ? this.renderTorrentButtons(torrentSummary) : null}
+        {isSelected ? this.renderTorrentDetails(torrentSummary) : null}
+      </div>
+    )
+  }
+
+  // Show name, download status, % complete
+  renderTorrentMetadata (torrentSummary) {
+    var name = torrentSummary.name || 'Loading torrent...'
+    var elements = [(
+      <div key='name' className='name ellipsis'>{name}</div>
+    )]
+
+    // If it's downloading/seeding then show progress info
+    var prog = torrentSummary.progress
+    if (torrentSummary.error) {
+      elements.push(
+        <div key='progress-info' className='ellipsis'>
+          {getErrorMessage(torrentSummary)}
+        </div>
+      )
+    } else if (torrentSummary.status !== 'paused' && prog) {
+      elements.push(
+        <div key='progress-info' className='ellipsis'>
+          {renderPercentProgress()}
+          {renderTotalProgress()}
+          {renderPeers()}
+          {renderDownloadSpeed()}
+          {renderUploadSpeed()}
+          {renderEta()}
+        </div>
+      )
+    }
+
+    return (<div key='metadata' className='metadata'>{elements}</div>)
+
+    function renderPercentProgress () {
+      var progress = Math.floor(100 * prog.progress)
+      return (<span key='percent-progress'>{progress}%</span>)
+    }
+
+    function renderTotalProgress () {
+      var downloaded = prettyBytes(prog.downloaded)
+      var total = prettyBytes(prog.length || 0)
+      if (downloaded === total) {
+        return (<span key='total-progress'>{downloaded}</span>)
+      } else {
+        return (<span key='total-progress'>{downloaded} / {total}</span>)
+      }
+    }
+
+    function renderPeers () {
+      if (prog.numPeers === 0) return
+      var count = prog.numPeers === 1 ? 'peer' : 'peers'
+      return (<span key='peers'>{prog.numPeers} {count}</span>)
+    }
+
+    function renderDownloadSpeed () {
+      if (prog.downloadSpeed === 0) return
+      return (<span key='download'>↓ {prettyBytes(prog.downloadSpeed)}/s</span>)
+    }
+
+    function renderUploadSpeed () {
+      if (prog.uploadSpeed === 0) return
+      return (<span key='upload'>↑ {prettyBytes(prog.uploadSpeed)}/s</span>)
+    }
+
+    function renderEta () {
+      var downloaded = prog.downloaded
+      var total = prog.length || 0
+      var missing = total - downloaded
+      var downloadSpeed = prog.downloadSpeed
+      if (downloadSpeed === 0 || missing === 0) return
+
+      var rawEta = missing / downloadSpeed
+      var hours = Math.floor(rawEta / 3600) % 24
+      var minutes = Math.floor(rawEta / 60) % 60
+      var seconds = Math.floor(rawEta % 60)
+
+      // Only display hours and minutes if they are greater than 0 but always
+      // display minutes if hours is being displayed
+      var hoursStr = hours ? hours + 'h' : ''
+      var minutesStr = (hours || minutes) ? minutes + 'm' : ''
+      var secondsStr = seconds + 's'
+
+      return (<span>ETA: {hoursStr} {minutesStr} {secondsStr}</span>)
+    }
+  }
+
+  // Download button toggles between torrenting (DL/seed) and paused
+  // Play button starts streaming the torrent immediately, unpausing if needed
+  renderTorrentButtons (torrentSummary) {
+    var infoHash = torrentSummary.infoHash
+
+    var playIcon, playTooltip, playClass
+    if (torrentSummary.playStatus === 'timeout') {
+      playIcon = 'warning'
+      playTooltip = 'Playback timed out. No seeds? No internet? Click to try again.'
+    } else {
+      playIcon = 'play_arrow'
+      playTooltip = 'Start streaming'
+    }
+
+    var downloadIcon, downloadTooltip
+    if (torrentSummary.status === 'seeding') {
+      downloadIcon = 'file_upload'
+      downloadTooltip = 'Seeding. Click to stop.'
+    } else if (torrentSummary.status === 'downloading') {
+      downloadIcon = 'file_download'
+      downloadTooltip = 'Torrenting. Click to stop.'
+    } else {
+      downloadIcon = 'file_download'
+      downloadTooltip = 'Click to start torrenting.'
+    }
+
+    // Do we have a saved position? Show it using a radial progress bar on top
+    // of the play button, unless already showing a spinner there:
+    var positionElem
+    var willShowSpinner = torrentSummary.playStatus === 'requested'
+    var defaultFile = torrentSummary.files &&
+      torrentSummary.files[torrentSummary.defaultPlayFileIndex]
+    if (defaultFile && defaultFile.currentTime && !willShowSpinner) {
+      var fraction = defaultFile.currentTime / defaultFile.duration
+      positionElem = this.renderRadialProgressBar(fraction, 'radial-progress-large')
+      playClass = 'resume-position'
+    }
+
+    // Only show the play button for torrents that contain playable media
+    var playButton, downloadButton
+    var noErrors = !torrentSummary.error
+    if (noErrors && TorrentPlayer.isPlayableTorrentSummary(torrentSummary)) {
+      playButton = (
+        <i
+          key='play-button'
+          title={playTooltip}
+          className={'button-round icon play ' + playClass}
+          onClick={dispatcher('playFile', infoHash)}>
+          {playIcon}
+        </i>
+      )
+    }
+    if (noErrors) {
+      downloadButton = (
+        <i
+          key='download-button'
+          className={'button-round icon download ' + torrentSummary.status}
+          title={downloadTooltip}
+          onClick={dispatcher('toggleTorrent', infoHash)}>
+          {downloadIcon}
+        </i>
+      )
+    }
+
+    return (
+      <div key='buttons' className='buttons'>
+        {positionElem}
+        {playButton}
+        {downloadButton}
+        <i
+          key='delete-button'
+          className='icon delete'
+          title='Remove torrent'
+          onClick={dispatcher('confirmDeleteTorrent', infoHash, false)}>
+          close
+        </i>
+      </div>
+    )
+  }
+
+  // Show files, per-file download status and play buttons, and so on
+  renderTorrentDetails (torrentSummary) {
+    var filesElement
+    if (torrentSummary.error || !torrentSummary.files) {
+      var message = ''
+      if (torrentSummary.error === 'path-missing') {
+        // Special case error: this torrent's download dir or file is missing
+        message = 'Missing path: ' + TorrentSummary.getFileOrFolder(torrentSummary)
+      } else if (torrentSummary.error) {
+        // General error for this torrent: just show the message
+        message = torrentSummary.error.message || torrentSummary.error
+      } else if (torrentSummary.status === 'paused') {
+        // No file info, no infohash, and we're not trying to download from the DHT
+        message = 'Failed to load torrent info. Click the download button to try again...'
+      } else {
+        // No file info, no infohash, trying to load from the DHT
+        message = 'Downloading torrent info...'
+      }
+      filesElement = (
+        <div key='files' className='files warning'>
+          {message}
+        </div>
+      )
+    } else {
+      // We do know the files. List them and show download stats for each one
+      var fileRows = torrentSummary.files
+        .filter((file) => !file.path.includes('/.____padding_file/'))
+        .map((file, index) => ({ file, index }))
+        .sort(function (a, b) {
+          if (a.file.name < b.file.name) return -1
+          if (b.file.name < a.file.name) return 1
+          return 0
+        })
+        .map((object) => this.renderFileRow(torrentSummary, object.file, object.index))
+
+      filesElement = (
+        <div key='files' className='files'>
+          <table>
+            <tbody>
+              {fileRows}
+            </tbody>
+          </table>
+        </div>
+      )
+    }
+
+    return (
+      <div key='details' className='torrent-details'>
+        {filesElement}
+      </div>
+    )
+  }
+
+  // Show a single torrentSummary file in the details view for a single torrent
+  renderFileRow (torrentSummary, file, index) {
+    // First, find out how much of the file we've downloaded
+    // Are we even torrenting it?
+    var isSelected = torrentSummary.selections && torrentSummary.selections[index]
+    var isDone = false // Are we finished torrenting it?
+    var progress = ''
+    if (torrentSummary.progress && torrentSummary.progress.files &&
+        torrentSummary.progress.files[index]) {
+      var fileProg = torrentSummary.progress.files[index]
+      isDone = fileProg.numPiecesPresent === fileProg.numPieces
+      progress = Math.round(100 * fileProg.numPiecesPresent / fileProg.numPieces) + '%'
+    }
+
+    // Second, for media files where we saved our position, show how far we got
+    var positionElem
+    if (file.currentTime) {
+      // Radial progress bar. 0% = start from 0:00, 270% = 3/4 of the way thru
+      positionElem = this.renderRadialProgressBar(file.currentTime / file.duration)
+    }
+
+    // Finally, render the file as a table row
+    var isPlayable = TorrentPlayer.isPlayable(file)
+    var infoHash = torrentSummary.infoHash
+    var icon
+    var handleClick
+    if (isPlayable) {
+      icon = 'play_arrow' /* playable? add option to play */
+      handleClick = dispatcher('playFile', infoHash, index)
+    } else {
+      icon = 'description' /* file icon, opens in OS default app */
+      handleClick = dispatcher('openItem', infoHash, index)
+    }
+    var rowClass = ''
+    if (!isSelected) rowClass = 'disabled' // File deselected, not being torrented
+    if (!isDone && !isPlayable) rowClass = 'disabled' // Can't open yet, can't stream
+    return (
+      <tr key={index} onClick={handleClick}>
+        <td className={'col-icon ' + rowClass}>
+          {positionElem}
+          <i className='icon'>{icon}</i>
+        </td>
+        <td className={'col-name ' + rowClass}>
+          {file.name}
+        </td>
+        <td className={'col-progress ' + rowClass}>
+          {isSelected ? progress : ''}
+        </td>
+        <td className={'col-size ' + rowClass}>
+          {prettyBytes(file.length)}
+        </td>
+        <td className='col-select'
+          onClick={dispatcher('toggleTorrentFile', infoHash, index)}>
+          <i className='icon'>{isSelected ? 'close' : 'add'}</i>
+        </td>
+      </tr>
+    )
+  }
+
+  renderRadialProgressBar (fraction, cssClass) {
+    var rotation = 360 * fraction
+    var transformFill = {transform: 'rotate(' + (rotation / 2) + 'deg)'}
+    var transformFix = {transform: 'rotate(' + rotation + 'deg)'}
+
+    return (
+      <div key='radial-progress' className={'radial-progress ' + cssClass}>
+        <div key='circle' className='circle'>
+          <div key='mask-full' className='mask full' style={transformFill}>
+            <div key='fill' className='fill' style={transformFill} />
+          </div>
+          <div key='mask-half' className='mask half'>
+            <div key='fill' className='fill' style={transformFill} />
+            <div key='fill-fix' className='fill fix' style={transformFix} />
+          </div>
+        </div>
+        <div key='inset' className='inset' />
+      </div>
+    )
+  }
+}
+
+function getErrorMessage (torrentSummary) {
+  var err = torrentSummary.error
+  if (err === 'path-missing') {
+    return (
+      <span>
+        Path missing.<br />
+        Fix and restart the app, or delete the torrent.
+      </span>
+    )
+  }
+  return 'Error'
+}

src/renderer/views/unsupported-media-modal.js

@@ -0,0 +1,39 @@
+const React = require('react')
+const electron = require('electron')
+
+const {dispatcher} = require('../lib/dispatcher')
+
+module.exports = class UnsupportedMediaModal extends React.Component {
+  render () {
+    var state = this.props.state
+    var err = state.modal.error
+    var message = (err && err.getMessage)
+      ? err.getMessage()
+      : err
+    var actionButton = state.modal.vlcInstalled
+      ? (<button className='button-raised' onClick={dispatcher('vlcPlay')}>Play in VLC</button>)
+      : (<button className='button-raised' onClick={() => this.onInstall}>Install VLC</button>)
+    var vlcMessage = state.modal.vlcNotFound
+      ? 'Couldn\'t run VLC. Please make sure it\'s installed.'
+      : ''
+    return (
+      <div>
+        <p><strong>Sorry, we can't play that file.</strong></p>
+        <p>{message}</p>
+        <p className='float-right'>
+          <button className='button-flat' onClick={dispatcher('backToList')}>Cancel</button>
+          {actionButton}
+        </p>
+        <p className='error-text'>{vlcMessage}</p>
+      </div>
+    )
+  }
+
+  onInstall () {
+    electron.shell.openExternal('http://www.videolan.org/vlc/')
+
+    // TODO: dcposch send a dispatch rather than modifying state directly
+    var state = this.props.state
+    state.modal.vlcInstalled = true // Assume they'll install it successfully
+  }
+}

src/renderer/views/update-available-modal.js

@@ -0,0 +1,30 @@
+const React = require('react')
+const electron = require('electron')
+
+const {dispatch} = require('../lib/dispatcher')
+
+module.exports = class UpdateAvailableModal extends React.Component {
+  render () {
+    var state = this.props.state
+    return (
+      <div className='update-available-modal'>
+        <p><strong>A new version of WebTorrent is available: v{state.modal.version}</strong></p>
+        <p>We have an auto-updater for Windows and Mac. We don't have one for Linux yet, so you'll have to download the new version manually.</p>
+        <p className='float-right'>
+          <button className='button button-flat' onClick={handleSkip}>Skip This Release</button>
+          <button className='button button-raised' onClick={handleShow}>Show Download Page</button>
+        </p>
+      </div>
+    )
+
+    function handleShow () {
+      electron.shell.openExternal('https://github.com/feross/webtorrent-desktop/releases')
+      dispatch('exitModal')
+    }
+
+    function handleSkip () {
+      dispatch('skipVersion', state.modal.version)
+      dispatch('exitModal')
+    }
+  }
+}

src/renderer/webtorrent.js

@@ -2,14 +2,16 @@
 // process from the main window.
 console.time('init')
 
-var WebTorrent = require('webtorrent')
-var defaultAnnounceList = require('create-torrent').announceList
 var deepEqual = require('deep-equal')
+var defaultAnnounceList = require('create-torrent').announceList
 var electron = require('electron')
 var fs = require('fs-extra')
+var hat = require('hat')
 var musicmetadata = require('musicmetadata')
 var networkAddress = require('network-address')
 var path = require('path')
+var WebTorrent = require('webtorrent')
+var zeroFill = require('zero-fill')
 
 var crashReporter = require('../crash-reporter')
 var config = require('../config')
@@ -26,22 +28,42 @@ global.WEBTORRENT_ANNOUNCE = defaultAnnounceList
   .map((arr) => arr[0])
   .filter((url) => url.indexOf('wss://') === 0 || url.indexOf('ws://') === 0)
 
+/**
+ * WebTorrent version.
+ */
+var VERSION = require('../../package.json').version
+
+/**
+ * Version number in Azureus-style. Generated from major and minor semver version.
+ * For example:
+ *   '0.16.1' -> '0016'
+ *   '1.2.5' -> '0102'
+ */
+var VERSION_STR = VERSION.match(/([0-9]+)/g)
+  .slice(0, 2)
+  .map((v) => zeroFill(2, v))
+  .join('')
+
+/**
+ * Version prefix string (used in peer ID). WebTorrent uses the Azureus-style
+ * encoding: '-', two characters for client id ('WW'), four ascii digits for version
+ * number, '-', followed by random numbers.
+ * For example:
+ *   '-WW0102-'...
+ */
+var VERSION_PREFIX = '-WD' + VERSION_STR + '-'
+
 // Connect to the WebTorrent and BitTorrent networks. WebTorrent Desktop is a hybrid
 // client, as explained here: https://webtorrent.io/faq
 var client = window.client = new WebTorrent({
-  tracker: {
-    // HACK: OS X: Disable WebRTC peers to fix 100% CPU issue caused by Chrome bug.
-    // Fixed in Chrome 51, so we can remove this hack once Electron updates Chrome.
-    // Issue: https://github.com/feross/webtorrent-desktop/issues/353
-    wrtc: process.platform !== 'darwin'
-  }
+  peerId: Buffer.from(VERSION_PREFIX + hat(48))
 })
 
 // WebTorrent-to-HTTP streaming sever
-var server = window.server = null
+var server = null
 
 // Used for diffing, so we only send progress updates when necessary
-var prevProgress = window.prevProgress = null
+var prevProgress = null
 
 init()
 
@@ -70,6 +92,10 @@ function init () {
 
   ipc.send('ipcReadyWebTorrent')
 
+  window.addEventListener('error', (e) =>
+    ipc.send('wt-uncaught-error', {message: e.error.message, stack: e.error.stack}),
+    true)
+
   setInterval(updateTorrentProgress, 1000)
 }
 
@@ -180,7 +206,7 @@ function saveTorrentFile (torrentKey) {
     }
 
     // Otherwise, save the .torrent file, under the app config folder
-    fs.mkdir(config.CONFIG_TORRENT_PATH, function (_) {
+    fs.mkdir(config.TORRENT_PATH, function (_) {
       fs.writeFile(torrentPath, torrent.torrentFile, function (err) {
         if (err) return console.log('error saving torrent file %s: %o', torrentPath, err)
         console.log('saved torrent file %s', torrentPath)
@@ -193,7 +219,7 @@ function saveTorrentFile (torrentKey) {
 // Checks whether we've already resolved a given infohash to a torrent file
 // Calls back with (torrentPath, exists). Logs, does not call back on error
 function checkIfTorrentFileExists (infoHash, cb) {
-  var torrentPath = path.join(config.CONFIG_TORRENT_PATH, infoHash + '.torrent')
+  var torrentPath = path.join(config.TORRENT_PATH, infoHash + '.torrent')
   fs.exists(torrentPath, function (exists) {
     cb(torrentPath, exists)
   })
@@ -206,10 +232,10 @@ function generateTorrentPoster (torrentKey) {
   torrentPoster(torrent, function (err, buf, extension) {
     if (err) return console.log('error generating poster: %o', err)
     // save it for next time
-    fs.mkdirp(config.CONFIG_POSTER_PATH, function (err) {
+    fs.mkdirp(config.POSTER_PATH, function (err) {
       if (err) return console.log('error creating poster dir: %o', err)
       var posterFileName = torrent.infoHash + extension
-      var posterFilePath = path.join(config.CONFIG_POSTER_PATH, posterFileName)
+      var posterFilePath = path.join(config.POSTER_PATH, posterFileName)
       fs.writeFile(posterFilePath, buf, function (err) {
         if (err) return console.log('error saving poster: %o', err)
         // show the poster
@@ -277,7 +303,7 @@ function getTorrentProgress () {
 function startServer (infoHash, index) {
   var torrent = client.get(infoHash)
   if (torrent.ready) startServerFromReadyTorrent(torrent, index)
-  else torrent.on('ready', () => startServerFromReadyTorrent(torrent, index))
+  else torrent.once('ready', () => startServerFromReadyTorrent(torrent, index))
 }
 
 function startServerFromReadyTorrent (torrent, index, cb) {
@@ -349,10 +375,6 @@ function selectFiles (torrentOrInfoHash, selections) {
     } else {
       console.log('deselecting file ' + i + ' of torrent ' + torrent.name)
       file.deselect()
-
-      // If we deselected a file, try to nuke it to save disk space
-      var filePath = path.join(torrent.path, file.path)
-      fs.unlink(filePath) // Ignore errors for now
     }
   }
 }

static/linux/webtorrent-desktop.desktop

@@ -13,7 +13,7 @@ Exec=$EXEC_PATH %U
 TryExec=$TRY_EXEC_PATH
 StartupNotify=false
 Categories=Network;FileTransfer;P2P;
-MimeType=application/x-bittorrent;x-scheme-handler/magnet;
+MimeType=application/x-bittorrent;x-scheme-handler/magnet;x-scheme-handler/stream-magnet;
 
 Actions=CreateNewTorrent;OpenTorrentFile;OpenTorrentAddress;