VLC support

AUTHORS.md

@@ -10,17 +10,6 @@
 - Romain Beaumont <romain.rom1@gmail.com>
 - Dan Flettre <fletd01@yahoo.com>
 - Liam Gray <liam.r.gray@gmail.com>
-- grunjol <grunjol@users.noreply.github.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>
-- Benjamin Tan <demoneaux@gmail.com>
-- Mathias Rasmussen <mathiasvr@gmail.com>
-- Sergey Bargamon <sergey@bargamon.ru>
-- Thomas Watson Steen <w@tson.dk>
 
 #### Generated by bin/update-authors.sh.

CHANGELOG.md

@@ -1,164 +1,16 @@
 # WebTorrent Desktop Version History
 
-## v0.7.0 - 2016-06-02
+## UNRELEASED
 
 ### 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
+- Use Squirrel.Windows 1.3.0
-  those files
+  - Fix installing when the app is already installed
-- Show prompt text in title bar for open dialogs (OS X)
+  - Don't kill unrelated processes on uninstall
-- 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
-
-- Select/deselect individual files to torrent.
-- Automatically include subtitle files (.srt, .vtt) from torrent in the subtitles menu.
-- "Add Subtitle File..." menu item.
-
-### Changed
-
-- When manually adding subtitle track(s), always switch to the new track.
-
-### Fixed
-
-- Magnet links throw exception on app launch. (OS X)
-- Multi-file torrents would not seed in-place, were copied to Downloads folder.
-- Missing 'About WebTorrent' menu item. (Windows)
-- Rare exception. ("Cannot create BrowserWindow before app is ready")
-
-## v0.4.0 - 2016-05-13
-
-### Added
-
-- Better Windows support!
-  - Windows 32-bit build.
-  - Windows Portable App build.
-  - Windows app signing, for fewer install warnings.
-- Better Linux support!
-  - Linux 32-bit build.
-- Subtitles support!
-  - .srt and .vtt file support.
-  - Drag-and-drop files on video, or choose from file selector.
-  - Multiple subtitle files support.
-- Stream to VLC when the audio codec is unplayable (e.g. AC3, EAC3).
-- "Show in Folder" item in context menu.
-- Volume slider, with mute/unmute button.
-- New "Create torrent" page to modify:
-  - Torrent comment.
-  - Trackers.
-  - Private torrent flag.
-- Use mouse wheel to increase/decrease volume.
-- Bounce the Downloads stack when download completes. (OS X)
-- New default torrent on first launch: The WIRED CD.
-
-### Changed
-
-- Improve app startup time by 40%.
-- UI tweaks: Reduce font size, reduce torrent list item height.
-- Add Playback menu for playback-related functionality.
-- Fix installing when the app is already installed. (Windows)
-- Don't kill unrelated processes on uninstall. (Windows)
-- Set "sheet offset" correctly for create torrent dialog. (OS X)
-- Remove OS X-style Window menu. (Linux, Windows)
-- Remove "Add Fake Airplay/Chromecast" menu items.
-
-### Fixed
-
-- Disable WebRTC to fix 100% CPU usage/crashes caused by Chromium issue. This is
-  temporary. (OS X)
-- When fullscreen, make controls use the full window. (OS X)
-- Support creating torrents that contain .torrent files.
-- Block power save while casting to a remote device.
-- Do not block power save when the space key is pressed from the torrent list.
-- Support playing .mpg and .ogv extensions in the app.
-- Fix video centering for multi-screen setups.
-- Show an error when adding a duplicate torrent.
-- Show an error when adding an invalid magnet link.
-- Do not stop music when tabbing to another program (OS X)
-- Properly size the Windows volume mixer icon.
-- Default to the user's OS-defined, localized "Downloads" folder.
-- Enforce minimimum window size when resizing player to prevent window disappearing.
-- Fix rare race condition error on app quit.
-- Don't use zero-byte torrent "poster" images.
-
-Thanks to @grunjol, @rguedes, @furstenheim, @karloluis, @DiegoRBaquero, @alxhotel,
-@AgentEpsilon, @remijouannet, Rolando Guedes, @dcposch, and @feross for contributing
-to this release!
-
 ## v0.3.3 - 2016-04-07
 
 ### Fixed

LICENSE

@@ -1,6 +1,6 @@
 The MIT License (MIT)
 
-Copyright (c) WebTorrent, LLC
+Copyright (c) Feross Aboukhadijeh
 
 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

@@ -87,4 +87,4 @@ brew install wine
 
 ## License
 
-MIT. Copyright (c) [WebTorrent, LLC](https://webtorrent.io).
+MIT. Copyright (c) [Feross Aboukhadijeh](http://feross.org).

bin/check-deps.js

@@ -1,54 +0,0 @@
-#!/usr/bin/env node
-
-var fs = require('fs')
-var cp = require('child_process')
-
-var BUILT_IN_DEPS = ['child_process', 'electron', 'fs', 'os', 'path']
-var EXECUTABLE_DEPS = ['gh-release', 'standard']
-
-main()
-
-// Scans codebase for missing or unused dependencies. Exits with code 0 on success.
-function main () {
-  if (process.platform === 'win32') {
-    console.error('Sorry, check-deps only works on Mac and Linux')
-    return
-  }
-
-  var usedDeps = findUsedDeps()
-  var packageDeps = findPackageDeps()
-
-  var missingDeps = usedDeps.filter(
-    (dep) => !packageDeps.includes(dep) && !BUILT_IN_DEPS.includes(dep)
-  )
-  var unusedDeps = packageDeps.filter(
-    (dep) => !usedDeps.includes(dep) && !EXECUTABLE_DEPS.includes(dep)
-  )
-
-  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 specified in `package.json`
-function findPackageDeps () {
-  var pkg = JSON.parse(fs.readFileSync('package.json', 'utf8'))
-
-  var deps = Object.keys(pkg.dependencies)
-  var devDeps = Object.keys(pkg.devDependencies)
-  var optionalDeps = Object.keys(pkg.optionalDependencies)
-
-  return [].concat(deps, devDeps, optionalDeps)
-}
-
-// Finds all dependencies that used with `require()`
-function findUsedDeps () {
-  var stdout = cp.execSync('./bin/list-deps.sh')
-  return stdout.toString().trim().split('\n')
-}

bin/clean.js

@@ -5,9 +5,9 @@
  * Useful for developers.
  */
 
-var fs = require('fs')
 var os = require('os')
 var path = require('path')
+var pathExists = require('path-exists')
 var rimraf = require('rimraf')
 
 var config = require('../config')
@@ -15,12 +15,7 @@ var handlers = require('../main/handlers')
 
 rimraf.sync(config.CONFIG_PATH)
 
-var tmpPath
+var tmpPath = path.join(pathExists.sync('/tmp') ? '/tmp' : os.tmpDir(), 'webtorrent')
-try {
-  tmpPath = path.join(fs.statSync('/tmp') && '/tmp', 'webtorrent')
-} catch (err) {
-  tmpPath = path.join(os.tmpDir(), 'webtorrent')
-}
 rimraf.sync(tmpPath)
 
 // Uninstall .torrent file and magnet link handlers

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.exitCode = code
+  process.exit(code)
 })

bin/list-deps.sh

@@ -1,10 +0,0 @@
-#!/bin/sh
-# 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 '.js:' |
-    sed "s/.*require('\([^'\/]*\).*/\1/" |
-    grep -v '^\.' |
-    sort |
-    uniq

bin/open-config.js

@@ -1,6 +0,0 @@
-#!/usr/bin/env node
-
-var config = require('../config')
-var open = require('open')
-
-open(config.CONFIG_PATH)

bin/package.js

@@ -9,7 +9,6 @@ var electronPackager = require('electron-packager')
 var fs = require('fs')
 var minimist = require('minimist')
 var mkdirp = require('mkdirp')
-var os = require('os')
 var path = require('path')
 var rimraf = require('rimraf')
 var series = require('run-series')
@@ -19,6 +18,16 @@ var config = require('../config')
 var pkg = require('../package.json')
 
 var BUILD_NAME = config.APP_NAME + '-v' + config.APP_VERSION
+
+/*
+ * Path to folder with the following files:
+ *   - Windows Authenticode private key and cert (authenticode.p12)
+ *   - Windows Authenticode password file (authenticode.txt)
+ */
+var CERT_PATH = process.platform === 'win32'
+  ? 'D:'
+  : '/Volumes/Certs'
+
 var DIST_PATH = path.join(config.ROOT_PATH, 'dist')
 
 var argv = minimist(process.argv.slice(2), {
@@ -55,6 +64,9 @@ function build () {
 }
 
 var all = {
+  // Build 64 bit binaries only.
+  arch: 'x64',
+
   // The human-readable copyright line for the app. Maps to the `LegalCopyright` metadata
   // property on Windows, and `NSHumanReadableCopyright` on OS X.
   'app-copyright': config.APP_COPYRIGHT,
@@ -73,9 +85,9 @@ 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 OS X. We're using the short git hash (e.g. 'e7d837e')
-  // start with a number. We're using the version of the underlying WebTorrent library.
+  // Windows requires the build version to start with a number :/ so we stick on a prefix
-  'build-version': require('webtorrent/package.json').version,
+  'build-version': '0-' + cp.execSync('git rev-parse --short HEAD').toString().replace('\n', ''),
 
   // The application source directory.
   dir: config.ROOT_PATH,
@@ -98,16 +110,12 @@ var all = {
   prune: true,
 
   // The Electron version with which the app is built (without the leading 'v')
-  version: require('electron-prebuilt/package.json').version
+  version: pkg.dependencies['electron-prebuilt']
 }
 
 var darwin = {
-  // Build for OS X
   platform: 'darwin',
 
-  // Build 64 bit binaries only.
-  arch: 'x64',
-
   // The bundle identifier to use in the application's plist (OS X only).
   'app-bundle-id': 'io.webtorrent.webtorrent',
 
@@ -123,12 +131,8 @@ var darwin = {
 }
 
 var win32 = {
-  // Build for Windows.
   platform: 'win32',
 
-  // Build 32 bit binaries only.
-  arch: 'ia32',
-
   // Object hash of application metadata to embed into the executable (Windows only)
   'version-string': {
 
@@ -157,10 +161,9 @@ var win32 = {
 }
 
 var linux = {
-  // Build for Linux.
   platform: 'linux',
 
-  // Build 32 and 64 bit binaries.
+  // Build 32/64 bit binaries.
   arch: 'all'
 
   // Note: Application icon for Linux is specified via the BrowserWindow `icon` option.
@@ -174,7 +177,7 @@ function buildDarwin (cb) {
   console.log('OS X: Packaging electron...')
   electronPackager(Object.assign({}, all, darwin), function (err, buildPath) {
     if (err) return cb(err)
-    console.log('OS X: Packaged electron. ' + buildPath)
+    console.log('OS X: Packaged electron. ' + buildPath[0])
 
     var appPath = path.join(buildPath[0], config.APP_NAME + '.app')
     var contentsPath = path.join(appPath, 'Contents')
@@ -182,6 +185,8 @@ 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' ],
@@ -209,25 +214,6 @@ function buildDarwin (cb) {
       }
     ]
 
-    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'
-        }
-      }
-    ]
-
     fs.writeFileSync(infoPlistPath, plist.build(infoPlist))
 
     // Copy torrent file icon into app bundle
@@ -291,7 +277,7 @@ function buildDarwin (cb) {
 
       var inPath = path.join(buildPath[0], config.APP_NAME + '.app')
       var outPath = path.join(DIST_PATH, BUILD_NAME + '-darwin.zip')
-      zip.zipSync(inPath, outPath)
+      zip(inPath, outPath)
 
       console.log('OS X: Created zip.')
     }
@@ -327,11 +313,11 @@ function buildDarwin (cb) {
       }
 
       var dmg = appDmg(dmgOpts)
-      dmg.once('error', cb)
+      dmg.on('error', cb)
       dmg.on('progress', function (info) {
         if (info.type === 'step-begin') console.log(info.title + '...')
       })
-      dmg.once('finish', function (info) {
+      dmg.on('finish', function (info) {
         console.log('OS X: Created dmg.')
         cb(null)
       })
@@ -341,24 +327,11 @@ function buildDarwin (cb) {
 
 function buildWin32 (cb) {
   var installer = require('electron-winstaller')
+
   console.log('Windows: Packaging electron...')
-
-  /*
-   * Path to folder with the following files:
-   *   - Windows Authenticode private key and cert (authenticode.p12)
-   *   - Windows Authenticode password file (authenticode.txt)
-   */
-  var CERT_PATH
-  try {
-    fs.accessSync('D:')
-    CERT_PATH = 'D:'
-  } catch (err) {
-    CERT_PATH = path.join(os.homedir(), 'Desktop')
-  }
-
   electronPackager(Object.assign({}, all, win32), function (err, buildPath) {
     if (err) return cb(err)
-    console.log('Windows: Packaged electron. ' + buildPath)
+    console.log('Windows: Packaged electron. ' + buildPath[0])
 
     var signWithParams
     if (process.platform === 'win32') {
@@ -385,7 +358,6 @@ function buildWin32 (cb) {
 
     function packageInstaller (cb) {
       console.log('Windows: Creating installer...')
-
       installer.createWindowsInstaller({
         appDirectory: buildPath[0],
         authors: config.APP_TEAM,
@@ -404,15 +376,14 @@ function buildWin32 (cb) {
         title: config.APP_NAME,
         usePackageJson: false,
         version: pkg.version
-      })
+      }).then(function () {
-      .then(function () {
         console.log('Windows: Created installer.')
         cb(null)
-      })
+      }).catch(cb)
-      .catch(cb)
     }
 
     function packagePortable (cb) {
+      // Create Windows portable app
       console.log('Windows: Creating portable app...')
 
       var portablePath = path.join(buildPath[0], 'Portable Settings')
@@ -420,7 +391,7 @@ function buildWin32 (cb) {
 
       var inPath = path.join(DIST_PATH, path.basename(buildPath[0]))
       var outPath = path.join(DIST_PATH, BUILD_NAME + '-win.zip')
-      zip.zipSync(inPath, outPath)
+      zip(inPath, outPath)
 
       console.log('Windows: Created portable app.')
       cb(null)
@@ -432,7 +403,7 @@ function buildLinux (cb) {
   console.log('Linux: Packaging electron...')
   electronPackager(Object.assign({}, all, linux), function (err, buildPath) {
     if (err) return cb(err)
-    console.log('Linux: Packaged electron. ' + buildPath)
+    console.log('Linux: Packaged electron. ' + buildPath[0])
 
     var tasks = []
     buildPath.forEach(function (filesPath) {
@@ -484,7 +455,7 @@ function buildLinux (cb) {
 
     var inPath = path.join(DIST_PATH, path.basename(filesPath))
     var outPath = path.join(DIST_PATH, BUILD_NAME + '-linux-' + destArch + '.zip')
-    zip.zipSync(inPath, outPath)
+    zip(inPath, outPath)
 
     console.log(`Linux: Created ${destArch} zip.`)
     cb(null)

bin/release-_post.sh

@@ -1,10 +1,9 @@
 #!/bin/sh
 set -e
 
-npm run update-authors
 git diff --exit-code
 npm run package -- --sign
 git push
 git push --tags
 npm publish
-./node_modules/.bin/gh-release
+gh-release

bin/release-_pre.sh

@@ -2,7 +2,10 @@
 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

@@ -10,8 +10,7 @@ while (<>) {
   next if $seen{$_};
   next if /<support\@greenkeeper.io>/;
   next if /<ungoldman\@gmail.com>/;
-  next if /<dc\@DCs-MacBook.local>/;
+  next if /<grunjol\@users.noreply.github.com>/;
-  next if /<rolandoguedes\@gmail.com>/;
   $seen{$_} = push @authors, "- ", $_;
 }
 END {

config.js

@@ -1,16 +1,14 @@
 var appConfig = require('application-config')('WebTorrent')
-var fs = require('fs')
 var path = require('path')
+var pathExists = require('path-exists')
 
 var APP_NAME = 'WebTorrent'
-var APP_TEAM = 'WebTorrent, LLC'
+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 = {
-  ANNOUNCEMENT_URL: 'https://webtorrent.io/desktop/announcement',
-
   APP_COPYRIGHT: 'Copyright © 2014-2016 ' + APP_TEAM,
   APP_FILE_ICON: path.join(__dirname, 'static', 'WebTorrentFile'),
   APP_ICON: path.join(__dirname, 'static', 'WebTorrent'),
@@ -19,57 +17,24 @@ module.exports = {
   APP_VERSION: APP_VERSION,
   APP_WINDOW_TITLE: APP_NAME + ' (BETA)',
 
-  AUTO_UPDATE_URL: 'https://webtorrent.io/desktop/update',
+  AUTO_UPDATE_CHECK_STARTUP_DELAY: 5 * 1000 /* 5 seconds */,
+  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'),
-  DEFAULT_TORRENTS: [
+  CONFIG_TORRENT_PATH: path.join(getConfigPath(), '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: __dirname,
   STATIC_PATH: path.join(__dirname, 'static'),
-  TORRENT_PATH: path.join(getConfigPath(), 'Torrents'),
 
   WINDOW_ABOUT: 'file://' + path.join(__dirname, 'renderer', 'about.html'),
   WINDOW_MAIN: 'file://' + path.join(__dirname, 'renderer', 'main.html'),
@@ -87,24 +52,8 @@ function getConfigPath () {
   }
 }
 
-function getDefaultDownloadPath () {
-  if (!process || !process.type) {
-    return ''
-  }
-
-  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() && pathExists(PORTABLE_PATH)
-    return process.platform === 'win32' && isProduction() && !!fs.statSync(PORTABLE_PATH)
-  } catch (err) {
-    return false
-  }
 }
 
 function isProduction () {
@@ -112,7 +61,7 @@ function isProduction () {
     return false
   }
   if (process.platform === 'darwin') {
-    return !/\/Electron\.app\//.test(process.execPath)
+    return !/\/Electron\.app\/Contents\/MacOS\/Electron$/.test(process.execPath)
   }
   if (process.platform === 'win32') {
     return !/\\electron\.exe$/.test(process.execPath)

crash-reporter.js

@@ -11,4 +11,5 @@ function init () {
     productName: config.APP_NAME,
     submitURL: config.CRASH_REPORT_URL
   })
+  console.log('crash reporter started')
 }

index.js

@@ -1 +1,2 @@
+console.time('init')
 require('./main')

main/announcement.js

@@ -1,57 +0,0 @@
-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 exists')
-
-  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 () {}

main/auto-updater.js

@@ -0,0 +1,50 @@
+module.exports = {
+  init
+}
+
+var electron = require('electron')
+var get = require('simple-get')
+
+var config = require('../config')
+var log = require('./log')
+var windows = require('./windows')
+
+var autoUpdater = electron.autoUpdater
+
+function init () {
+  autoUpdater.on('error', function (err) {
+    log.error('App update error: ' + err.message || err)
+  })
+
+  autoUpdater.setFeedURL(config.AUTO_UPDATE_URL)
+
+  /*
+   * We always check for updates on app startup. To keep app startup fast, we delay this
+   * first check so it happens when there is less going on.
+   */
+  setTimeout(checkForUpdates, config.AUTO_UPDATE_CHECK_STARTUP_DELAY)
+
+  autoUpdater.on('checking-for-update', () => log('Checking for app update'))
+  autoUpdater.on('update-available', () => log('App update available'))
+  autoUpdater.on('update-not-available', () => log('App update not available'))
+  autoUpdater.on('update-downloaded', function (e, releaseNotes, releaseName, releaseDate, updateURL) {
+    log('App update downloaded: ', releaseName, updateURL)
+  })
+}
+
+function checkForUpdates () {
+  // Electron's built-in auto updater only supports Mac and Windows, for now
+  if (process.platform !== 'linux') {
+    return autoUpdater.checkForUpdates()
+  }
+
+  // If we're on Linux, we have to do it ourselves
+  get.concat(config.AUTO_UPDATE_URL, function (err, res, data) {
+    if (err) return log('Error checking for app update: ' + err.message)
+    if (![200, 204].includes(res.statusCode)) return log('Error checking for app update, got HTTP ' + res.statusCode)
+    if (res.statusCode !== 200) return
+
+    var obj = JSON.parse(data)
+    windows.main.send('dispatch', 'updateAvailable', obj.version)
+  })
+}

main/dialog.js

@@ -1,122 +0,0 @@
-module.exports = {
-  openSeedFile,
-  openSeedDirectory,
-  openTorrentFile,
-  openTorrentAddress,
-  openFiles
-}
-
-var electron = require('electron')
-
-var config = require('../config')
-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 OS X, so the window title is used instead.
- */
-function setTitle (title) {
-  if (process.platform === 'darwin') {
-    windows.main.dispatch('setTitle', title)
-  }
-}
-
-function resetTitle () {
-  setTitle(config.APP_WINDOW_TITLE)
-}

main/dock.js

@@ -1,59 +0,0 @@
-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. (OS X)
- */
-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. (OS X)
- */
-function downloadFinished (path) {
-  if (!app.dock) return
-  log(`downloadFinished: ${path}`)
-  app.dock.downloadFinished(path)
-}
-
-/**
- * Display string in dock badging area. (OS X)
- */
-function setBadge (text) {
-  if (!app.dock) return
-  log(`setBadge: ${text}`)
-  app.dock.setBadge(String(text))
-}
-
-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()
-    }
-  ]
-}

main/handlers.js

@@ -3,7 +3,6 @@ module.exports = {
   uninstall
 }
 
-var config = require('../config')
 var path = require('path')
 
 function install () {
@@ -34,42 +33,24 @@ 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
+  // On OS X, only protocols that are listed in Info.plist can be set as the default
-  // default handler at runtime.
+  // handler at runtime.
   app.setAsDefaultProtocolClient('magnet')
 
-  // File handlers are defined in `Info.plist`.
+  // File handlers are registered in the Info.plist.
 }
 
 function uninstallDarwin () {}
 
-var EXEC_COMMAND = [ process.execPath ]
-
-if (!config.IS_PRODUCTION) {
-  EXEC_COMMAND.push(config.ROOT_PATH)
-}
-
 function installWin32 () {
   var Registry = require('winreg')
 
   var log = require('./log')
 
-  var iconPath = path.join(
+  var iconPath = path.join(process.resourcesPath, 'app.asar.unpacked', 'static', 'WebTorrentFile.ico')
-    process.resourcesPath, 'app.asar.unpacked', 'static', 'WebTorrentFile.ico'
+
-  )
+  registerProtocolHandlerWin32('magnet', 'URL:BitTorrent Magnet URL', iconPath, process.execPath)
-  registerProtocolHandlerWin32(
+  registerFileHandlerWin32('.torrent', 'io.webtorrent.torrent', 'BitTorrent Document', iconPath, process.execPath)
-    'magnet',
-    'URL:BitTorrent 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:
@@ -127,7 +108,7 @@ function installWin32 () {
         hive: Registry.HKCU,
         key: '\\Software\\Classes\\' + protocol + '\\shell\\open\\command'
       })
-      commandKey.set('', Registry.REG_SZ, `${commandToArgs(command)} "%1"`, done)
+      commandKey.set('', Registry.REG_SZ, '"' + command + '" "%1"', done)
     }
 
     function done (err) {
@@ -188,7 +169,7 @@ function installWin32 () {
         hive: Registry.HKCU,
         key: '\\Software\\Classes\\' + id + '\\shell\\open\\command'
       })
-      commandKey.set('', Registry.REG_SZ, `${commandToArgs(command)} "%1"`, done)
+      commandKey.set('', Registry.REG_SZ, '"' + command + '" "%1"', done)
     }
 
     function done (err) {
@@ -200,8 +181,8 @@ function installWin32 () {
 function uninstallWin32 () {
   var Registry = require('winreg')
 
-  unregisterProtocolHandlerWin32('magnet', EXEC_COMMAND)
+  unregisterProtocolHandlerWin32('magnet', process.execPath)
-  unregisterFileHandlerWin32('.torrent', 'io.webtorrent.torrent', EXEC_COMMAND)
+  unregisterFileHandlerWin32('.torrent', 'io.webtorrent.torrent', process.execPath)
 
   function unregisterProtocolHandlerWin32 (protocol, command) {
     getCommand()
@@ -212,7 +193,7 @@ function uninstallWin32 () {
         key: '\\Software\\Classes\\' + protocol + '\\shell\\open\\command'
       })
       commandKey.get('', function (err, item) {
-        if (!err && item.value.indexOf(commandToArgs(command)) >= 0) {
+        if (!err && item.value.indexOf(command) >= 0) {
           destroyProtocol()
         }
       })
@@ -260,10 +241,6 @@ function uninstallWin32 () {
   }
 }
 
-function commandToArgs (command) {
-  return command.map((arg) => `"${arg}"`).join(' ')
-}
-
 function installLinux () {
   var fs = require('fs-extra')
   var os = require('os')
@@ -276,23 +253,21 @@ function installLinux () {
   installIconFile()
 
   function installDesktopFile () {
-    var templatePath = path.join(
+    var templatePath = path.join(config.STATIC_PATH, 'linux', 'webtorrent-desktop.desktop')
-      config.STATIC_PATH, 'linux', 'webtorrent-desktop.desktop'
-    )
     fs.readFile(templatePath, 'utf8', writeDesktopFile)
   }
 
   function writeDesktopFile (err, desktopFile) {
     if (err) return log.error(err.message)
 
-    var appPath = config.IS_PRODUCTION
+    var appPath = config.IS_PRODUCTION ? path.dirname(process.execPath) : config.ROOT_PATH
-      ? path.dirname(process.execPath)
+    var execPath = process.execPath + (config.IS_PRODUCTION ? '' : ' \.')
-      : config.ROOT_PATH
+    var tryExecPath = process.execPath
 
     desktopFile = desktopFile.replace(/\$APP_NAME/g, config.APP_NAME)
     desktopFile = desktopFile.replace(/\$APP_PATH/g, appPath)
-    desktopFile = desktopFile.replace(/\$EXEC_PATH/g, EXEC_COMMAND.join(' '))
+    desktopFile = desktopFile.replace(/\$EXEC_PATH/g, execPath)
-    desktopFile = desktopFile.replace(/\$TRY_EXEC_PATH/g, process.execPath)
+    desktopFile = desktopFile.replace(/\$TRY_EXEC_PATH/g, tryExecPath)
 
     var desktopFilePath = path.join(
       os.homedir(),

main/index.js

@@ -1,23 +1,19 @@
-console.time('init')
-
 var electron = require('electron')
 
 var app = electron.app
 var ipcMain = electron.ipcMain
 
-var announcement = require('./announcement')
+var autoUpdater = require('./auto-updater')
 var config = require('../config')
 var crashReporter = require('../crash-reporter')
-var dialog = require('./dialog')
-var dock = require('./dock')
 var handlers = require('./handlers')
 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 windows = require('./windows')
+var tray = require('./tray')
 
 var shouldQuit = false
 var argv = sliceArgv(process.argv)
@@ -45,7 +41,6 @@ function init () {
     app.setPath('userData', config.CONFIG_PATH)
   }
 
-  var isReady = false // app ready, windows can be created
   app.ipcReady = false // main window has finished loading and IPC is ready
   app.isQuitting = false
 
@@ -55,25 +50,23 @@ function init () {
 
   ipc.init()
 
-  app.once('will-finish-launching', function () {
+  app.on('will-finish-launching', function () {
     crashReporter.init()
+    autoUpdater.init()
   })
 
   app.on('ready', function () {
-    isReady = true
-
-    windows.main.init()
-    windows.webtorrent.init()
     menu.init()
-
+    windows.createMainWindow()
-    // To keep app startup fast, some code is delayed.
+    windows.createWebTorrentHiddenWindow()
-    setTimeout(delayedInit, config.DELAYED_INIT)
+    shortcuts.init()
+    tray.init()
+    handlers.install()
   })
 
-  app.once('ipcReady', function () {
+  app.on('ipcReady', function () {
     log('Command line args:', argv)
     processArgv(argv)
-    console.timeEnd('init')
   })
 
   app.on('before-quit', function (e) {
@@ -81,34 +74,27 @@ function init () {
 
     app.isQuitting = true
     e.preventDefault()
-    windows.main.dispatch('saveState') // try to save state on exit
+    windows.main.send('dispatch', 'saveState') /* try to save state on exit */
     ipcMain.once('savedState', () => app.quit())
-    setTimeout(() => app.quit(), 2000) // quit after 2 secs, at most
+    setTimeout(() => app.quit(), 2000) /* quit after 2 secs, at most */
   })
 
   app.on('activate', function () {
-    if (isReady) windows.main.show()
+    windows.createMainWindow()
   })
 }
 
-function delayedInit () {
-  announcement.init()
-  dock.init()
-  handlers.install()
-  tray.init()
-  updater.init()
-}
-
 function onOpen (e, torrentId) {
   e.preventDefault()
 
   if (app.ipcReady) {
-    // Magnet links opened from Chrome won't focus the app without a setTimeout.
+    windows.main.send('dispatch', 'onOpen', torrentId)
-    // 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(() => windows.main.show(), 100)
+    setTimeout(function () {
-
+      windows.focusWindow(windows.main)
-    processArgv([ torrentId ])
+    }, 100)
   } else {
     argv.push(torrentId)
   }
@@ -119,7 +105,7 @@ function onAppOpen (newArgv) {
 
   if (app.ipcReady) {
     log('Second app instance opened, but was prevented:', newArgv)
-    windows.main.show()
+    windows.focusWindow(windows.main)
 
     processArgv(newArgv)
   } else {
@@ -132,22 +118,18 @@ function sliceArgv (argv) {
 }
 
 function processArgv (argv) {
-  var torrentIds = []
   argv.forEach(function (arg) {
     if (arg === '-n') {
-      dialog.openSeedDirectory()
+      windows.main.send('dispatch', 'showOpenSeedFiles')
     } else if (arg === '-o') {
-      dialog.openTorrentFile()
+      windows.main.send('dispatch', 'showOpenTorrentFile')
     } else if (arg === '-u') {
-      dialog.openTorrentAddress()
+      windows.main.send('showOpenTorrentAddress')
     } else if (arg.startsWith('-psn')) {
       // Ignore OS X launchd "process serial number" argument
-      // Issue: https://github.com/feross/webtorrent-desktop/issues/214
+      // More: https://github.com/feross/webtorrent-desktop/issues/214
     } else {
-      torrentIds.push(arg)
+      windows.main.send('dispatch', 'onOpen', arg)
     }
   })
-  if (torrentIds.length > 0) {
-    windows.main.dispatch('onOpen', torrentIds)
-  }
 }

main/ipc.js

@@ -5,32 +5,27 @@ module.exports = {
 var electron = require('electron')
 
 var app = electron.app
+var ipcMain = electron.ipcMain
+var powerSaveBlocker = electron.powerSaveBlocker
 
-var dialog = require('./dialog')
-var dock = require('./dock')
 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 shortcuts = require('./shortcuts')
 
-// Messages from the main process, to be sent once the WebTorrent process starts
+// has to be a number, not a boolean, and undefined throws an error
-var messageQueueMainToWebTorrent = []
+var powerSaveBlockID = 0
-
-// holds a ChildProcess while we're playing a video in VLC, null otherwise
-var vlcProcess
 
 function init () {
-  var ipc = electron.ipcMain
+  ipcMain.on('ipcReady', function (e) {
-
-  ipc.once('ipcReady', function (e) {
     app.ipcReady = true
     app.emit('ipcReady')
+    windows.main.show()
+    console.timeEnd('init')
   })
 
-  ipc.once('ipcReadyWebTorrent', function (e) {
+  var messageQueueMainToWebTorrent = []
+  ipcMain.on('ipcReadyWebTorrent', function (e) {
     app.ipcReadyWebTorrent = true
     log('sending %d queued messages from the main win to the webtorrent window',
       messageQueueMainToWebTorrent.length)
@@ -40,112 +35,57 @@ function init () {
     })
   })
 
-  /**
+  ipcMain.on('showOpenTorrentFile', menu.showOpenTorrentFile)
-   * Dialog
+  ipcMain.on('showOpenSeedFiles', menu.showOpenSeedFiles)
-   */
 
-  ipc.on('openTorrentFile', () => dialog.openTorrentFile())
+  ipcMain.on('setBounds', function (e, bounds, maximize) {
-  ipc.on('openFiles', () => dialog.openFiles())
+    setBounds(bounds, maximize)
+  })
 
-  /**
+  ipcMain.on('setAspectRatio', function (e, aspectRatio, extraSize) {
-   * Dock
+    setAspectRatio(aspectRatio, extraSize)
-   */
+  })
 
-  ipc.on('setBadge', (e, ...args) => dock.setBadge(...args))
+  ipcMain.on('setBadge', function (e, text) {
-  ipc.on('downloadFinished', (e, ...args) => dock.downloadFinished(...args))
+    setBadge(text)
+  })
 
-  /**
+  ipcMain.on('setProgress', function (e, progress) {
-   * Events
+    setProgress(progress)
-   */
+  })
 
-  ipc.on('onPlayerOpen', function () {
+  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('opening file or folder: ' + path)
+    electron.shell.openItem(path)
+  })
+
+  ipcMain.on('blockPowerSave', blockPowerSave)
+  ipcMain.on('unblockPowerSave', unblockPowerSave)
+
+  ipcMain.on('onPlayerOpen', function () {
     menu.onPlayerOpen()
-    shortcuts.onPlayerOpen()
+    shortcuts.registerPlayerShortcuts()
   })
-
+  ipcMain.on('onPlayerClose', function () {
-  ipc.on('onPlayerClose', function () {
     menu.onPlayerClose()
-    shortcuts.onPlayerOpen()
+    shortcuts.unregisterPlayerShortcuts()
   })
 
-  /**
+  ipcMain.on('focusWindow', function (e, windowName) {
-   * Power Save Blocker
+    windows.focusWindow(windows[windowName])
-   */
-
-  ipc.on('blockPowerSave', () => powerSaveBlocker.start())
-  ipc.on('unblockPowerSave', () => powerSaveBlocker.stop())
-
-  /**
-   * Shell
-   */
-
-  ipc.on('openItem', (e, ...args) => shell.openItem(...args))
-  ipc.on('showItemInFolder', (e, ...args) => shell.showItemInFolder(...args))
-
-  /**
-   * 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))
-
-  /**
-   * 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) {
-    var args = ['--play-and-exit', '--video-on-top', '--no-video-title-show', '--quiet', 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
+  var oldEmit = ipcMain.emit
-  ipc.emit = function (name, e, ...args) {
+  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') {
@@ -168,6 +108,81 @@ function init () {
     }
 
     // Emit all other events normally
-    oldEmit.call(ipc, name, e, ...args)
+    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 screen = require('screen')
+      var scr = 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, extraSize) {
+  log('setAspectRatio %o %o', aspectRatio, extraSize)
+  if (windows.main) {
+    windows.main.setAspectRatio(aspectRatio, extraSize)
+  }
+}
+
+// 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 () {
+  powerSaveBlockID = powerSaveBlocker.start('prevent-display-sleep')
+  log('blockPowerSave %d', powerSaveBlockID)
+}
+
+function unblockPowerSave () {
+  if (powerSaveBlocker.isStarted(powerSaveBlockID)) {
+    powerSaveBlocker.stop(powerSaveBlockID)
+    log('unblockPowerSave %d', powerSaveBlockID)
   }
 }

main/log.js

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

main/menu.js

@@ -1,11 +1,13 @@
 module.exports = {
   init,
-  onPlayerClose,
-  onPlayerOpen,
-  onToggleAlwaysOnTop,
   onToggleFullScreen,
-  onWindowBlur,
+  onWindowHide,
-  onWindowFocus
+  onWindowShow,
+  onPlayerOpen,
+  onPlayerClose,
+  showOpenSeedFiles,
+  showOpenTorrentFile,
+  toggleFullScreen
 }
 
 var electron = require('electron')
@@ -13,99 +15,171 @@ var electron = require('electron')
 var app = electron.app
 
 var config = require('../config')
-var dialog = require('./dialog')
+var log = require('./log')
-var shell = require('./shell')
 var windows = require('./windows')
 
-var menu
+var appMenu, dockMenu
 
 function init () {
-  menu = electron.Menu.buildFromTemplate(getMenuTemplate())
+  appMenu = electron.Menu.buildFromTemplate(getAppMenuTemplate())
-  electron.Menu.setApplicationMenu(menu)
+  electron.Menu.setApplicationMenu(appMenu)
+
+  dockMenu = electron.Menu.buildFromTemplate(getDockMenuTemplate())
+  if (app.dock) app.dock.setMenu(dockMenu)
 }
 
-function onPlayerClose () {
+function toggleFullScreen (flag) {
-  getMenuItem('Play/Pause').enabled = false
+  log('toggleFullScreen %s', flag)
-  getMenuItem('Increase Volume').enabled = false
+  if (windows.main && windows.main.isVisible()) {
-  getMenuItem('Decrease Volume').enabled = false
+    flag = flag != null ? flag : !windows.main.isFullScreen()
-  getMenuItem('Step Forward').enabled = false
+    windows.main.setFullScreen(flag)
-  getMenuItem('Step Backward').enabled = false
+  }
-  getMenuItem('Increase Speed').enabled = false
-  getMenuItem('Decrease Speed').enabled = false
-  getMenuItem('Add Subtitles File...').enabled = false
 }
 
-function onPlayerOpen () {
+// Sets whether the window should always show on top of other windows
-  getMenuItem('Play/Pause').enabled = true
+function toggleFloatOnTop (flag) {
-  getMenuItem('Increase Volume').enabled = true
+  log('toggleFloatOnTop %s', flag)
-  getMenuItem('Decrease Volume').enabled = true
+  if (windows.main) {
-  getMenuItem('Step Forward').enabled = true
+    flag = flag != null ? flag : !windows.main.isAlwaysOnTop()
-  getMenuItem('Step Backward').enabled = true
+    windows.main.setAlwaysOnTop(flag)
-  getMenuItem('Increase Speed').enabled = true
+    getMenuItem('Float on Top').checked = flag
-  getMenuItem('Decrease Speed').enabled = true
+  }
-  getMenuItem('Add Subtitles File...').enabled = true
 }
 
-function onToggleAlwaysOnTop (flag) {
+function increaseVolume () {
-  getMenuItem('Float on Top').checked = flag
+  if (windows.main) {
+    windows.main.send('dispatch', 'changeVolume', 0.1)
+  }
 }
 
-function onToggleFullScreen (flag) {
+function decreaseVolume () {
-  getMenuItem('Full Screen').checked = flag
+  if (windows.main) {
+    windows.main.send('dispatch', 'changeVolume', -0.1)
+  }
 }
 
-function onWindowBlur () {
+function toggleDevTools () {
-  getMenuItem('Full Screen').enabled = false
+  log('toggleDevTools')
-  getMenuItem('Float on Top').enabled = false
+  if (windows.main) {
+    windows.main.toggleDevTools()
+  }
 }
 
-function onWindowFocus () {
+function showWebTorrentWindow () {
+  windows.webtorrent.show()
+  windows.webtorrent.webContents.openDevTools({ detach: true })
+}
+
+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 () {
+  getMenuItem('Increase Volume').enabled = true
+  getMenuItem('Decrease Volume').enabled = true
+}
+
+function onPlayerClose () {
+  getMenuItem('Increase Volume').enabled = false
+  getMenuItem('Decrease Volume').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 < menu.items.length; i++) {
+  for (var i = 0; i < appMenu.items.length; i++) {
-    var menuItem = menu.items[i].submenu.items.find(function (item) {
+    var menuItem = appMenu.items[i].submenu.items.find(function (item) {
       return item.label === label
     })
     if (menuItem) return menuItem
   }
 }
 
-function getMenuTemplate () {
+// Prompts the user for a file or folder, then makes a torrent out of the data
+function showOpenSeedFiles () {
+  // Allow only a single selection
+  // To create a multi-file torrent, the user must select a folder
+  electron.dialog.showOpenDialog({
+    title: 'Select a file or folder for the torrent file.',
+    properties: [ 'openFile', 'openDirectory' ]
+  }, function (filenames) {
+    if (!Array.isArray(filenames)) return
+    var fileOrFolder = filenames[0]
+    windows.main.send('dispatch', 'showCreateTorrent', fileOrFolder)
+  })
+}
+
+// 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 (filenames) {
+    if (!Array.isArray(filenames)) return
+    filenames.forEach(function (filename) {
+      windows.main.send('dispatch', 'addTorrent', filename)
+    })
+  })
+}
+
+// Prompts the user for the URL of a torrent file, then downloads and adds it
+function showOpenTorrentAddress () {
+  windows.main.send('showOpenTorrentAddress')
+}
+
+function getAppMenuTemplate () {
+  var fileMenu = [
+    {
+      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
+    },
+    {
+      type: 'separator'
+    },
+    {
+      label: process.platform === 'windows' ? 'Close' : 'Close Window',
+      accelerator: 'CmdOrCtrl+W',
+      role: 'close'
+    }
+  ]
+
+  // File > Quit for Linux users with distros where the system tray is broken
+  if (process.platform === 'linux') {
+    fileMenu.push({
+      label: 'Quit',
+      click: () => app.quit()
+    })
+  }
+
   var template = [
     {
       label: 'File',
-      submenu: [
+      submenu: fileMenu
-        {
-          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'
-        },
-        {
-          label: process.platform === 'win32'
-            ? 'Close'
-            : 'Close Window',
-          accelerator: 'CmdOrCtrl+W',
-          role: 'close'
-        }
-      ]
     },
     {
       label: 'Edit',
@@ -129,14 +203,6 @@ function getMenuTemplate () {
           label: 'Select All',
           accelerator: 'CmdOrCtrl+A',
           role: 'selectall'
-        },
-        {
-          type: 'separator'
-        },
-        {
-          label: 'Preferences',
-          accelerator: 'CmdOrCtrl+,',
-          click: () => windows.main.dispatch('preferences')
         }
       ]
     },
@@ -149,20 +215,27 @@ function getMenuTemplate () {
           accelerator: process.platform === 'darwin'
             ? 'Ctrl+Command+F'
             : 'F11',
-          click: () => windows.main.toggleFullScreen()
+          click: () => toggleFullScreen()
         },
         {
           label: 'Float on Top',
           type: 'checkbox',
-          click: () => windows.main.toggleAlwaysOnTop()
+          click: () => toggleFloatOnTop()
         },
         {
           type: 'separator'
         },
         {
-          label: 'Go Back',
+          label: 'Increase Volume',
-          accelerator: 'Esc',
+          accelerator: 'CmdOrCtrl+Up',
-          click: () => windows.main.dispatch('escapeBack')
+          click: increaseVolume,
+          enabled: false
+        },
+        {
+          label: 'Decrease Volume',
+          accelerator: 'CmdOrCtrl+Down',
+          click: decreaseVolume,
+          enabled: false
         },
         {
           type: 'separator'
@@ -175,84 +248,27 @@ function getMenuTemplate () {
               accelerator: process.platform === 'darwin'
                 ? 'Alt+Command+I'
                 : 'Ctrl+Shift+I',
-              click: () => windows.main.toggleDevTools()
+              click: toggleDevTools
             },
             {
               label: 'Show WebTorrent Process',
               accelerator: process.platform === 'darwin'
                 ? 'Alt+Command+P'
                 : 'Ctrl+Shift+P',
-              click: () => windows.webtorrent.toggleDevTools()
+              click: showWebTorrentWindow
             }
           ]
         }
       ]
     },
     {
-      label: 'Playback',
+      label: 'Window',
+      role: 'window',
       submenu: [
         {
-          label: 'Play/Pause',
+          label: 'Minimize',
-          accelerator: 'Space',
+          accelerator: 'CmdOrCtrl+M',
-          click: () => windows.main.dispatch('playPause'),
+          role: 'minimize'
-          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', 1),
-          enabled: false
-        },
-        {
-          label: 'Step Backward',
-          accelerator: process.platform === 'darwin'
-            ? 'CmdOrCtrl+Alt+Left'
-            : 'Alt+Left',
-          click: () => windows.main.dispatch('skip', -1),
-          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
         }
       ]
     },
@@ -262,25 +278,25 @@ function getMenuTemplate () {
       submenu: [
         {
           label: 'Learn more about ' + config.APP_NAME,
-          click: () => shell.openExternal(config.HOME_PAGE_URL)
+          click: () => electron.shell.openExternal('https://webtorrent.io')
         },
         {
           label: 'Contribute on GitHub',
-          click: () => shell.openExternal(config.GITHUB_URL)
+          click: () => electron.shell.openExternal(config.GITHUB_URL)
         },
         {
           type: 'separator'
         },
         {
           label: 'Report an Issue...',
-          click: () => shell.openExternal(config.GITHUB_URL_ISSUES)
+          click: () => electron.shell.openExternal(config.GITHUB_URL + '/issues')
         }
       ]
     }
   ]
 
   if (process.platform === 'darwin') {
-    // Add WebTorrent app menu (OS X)
+    // WebTorrent menu (OS X)
     template.unshift({
       label: config.APP_NAME,
       submenu: [
@@ -291,14 +307,6 @@ function getMenuTemplate () {
         {
           type: 'separator'
         },
-        {
-          label: 'Preferences',
-          accelerator: 'Cmd+,',
-          click: () => windows.main.dispatch('preferences')
-        },
-        {
-          type: 'separator'
-        },
         {
           label: 'Services',
           role: 'services',
@@ -332,36 +340,17 @@ function getMenuTemplate () {
       ]
     })
 
-    // Add Window menu (OS X)
+    // Window menu (OS X)
-    template.splice(5, 0, {
+    template[4].submenu.push(
-      label: 'Window',
+      {
-      role: 'window',
+        type: 'separator'
-      submenu: [
+      },
-        {
+      {
-          label: 'Minimize',
+        label: 'Bring All to Front',
-          accelerator: 'CmdOrCtrl+M',
+        role: 'front'
-          role: 'minimize'
+      }
-        },
+    )
-        {
+  } else {
-          type: 'separator'
-        },
-        {
-          label: 'Bring All to Front',
-          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()
-    })
-
     // Help menu (Windows, Linux)
     template[4].submenu.push(
       {
@@ -369,19 +358,30 @@ function getMenuTemplate () {
       },
       {
         label: 'About ' + config.APP_NAME,
-        click: () => windows.about.init()
+        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/power-save-blocker.js

@@ -1,30 +0,0 @@
-module.exports = {
-  start,
-  stop
-}
-
-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 start () {
-  stop() // Stop the previous power saver block, if one exists.
-  blockId = electron.powerSaveBlocker.start('prevent-display-sleep')
-  log(`powerSaveBlocker.start: ${blockId}`)
-}
-
-/**
- * Stop blocking the system from entering low-power mode.
- */
-function stop () {
-  if (!electron.powerSaveBlocker.isStarted(blockId)) {
-    return
-  }
-  electron.powerSaveBlocker.stop(blockId)
-  log(`powerSaveBlocker.stop: ${blockId}`)
-}

main/shell.js

@@ -1,32 +0,0 @@
-module.exports = {
-  openExternal,
-  openItem,
-  showItemInFolder
-}
-
-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)
-}

main/shortcuts.js

@@ -1,20 +1,29 @@
 module.exports = {
-  onPlayerClose,
+  init,
-  onPlayerOpen
+  registerPlayerShortcuts,
+  unregisterPlayerShortcuts
 }
 
 var electron = require('electron')
+var localShortcut = require('electron-localshortcut')
+
+var globalShortcut = electron.globalShortcut
+
+var menu = require('./menu')
 var windows = require('./windows')
 
-function onPlayerOpen () {
+function init () {
-  // Register play/pause media key, available on some keyboards.
+  // ⌘+Shift+F is an alternative fullscreen shortcut to the ones defined in menu.js.
-  electron.globalShortcut.register(
+  // Electron does not support multiple accelerators for a single menu item, so this
-    'MediaPlayPause',
+  // is registered separately here.
-    () => windows.main.dispatch('playPause')
+  localShortcut.register('CmdOrCtrl+Shift+F', menu.toggleFullScreen)
-  )
 }
 
-function onPlayerClose () {
+function registerPlayerShortcuts () {
-  // Return the media key to the OS, so other apps can use it.
+  // Special "media key" for play/pause, available on some keyboards
-  electron.globalShortcut.unregister('MediaPlayPause')
+  globalShortcut.register('MediaPlayPause', () => windows.main.send('dispatch', 'playPause'))
+}
+
+function unregisterPlayerShortcuts () {
+  globalShortcut.unregister('MediaPlayPause')
 }

main/squirrel-win32.js

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

main/tray.js

@@ -1,62 +1,53 @@
 module.exports = {
-  hasTray,
   init,
-  onWindowBlur,
+  hasTray
-  onWindowFocus
 }
 
+var cp = require('child_process')
+var path = require('path')
 var electron = require('electron')
 
 var app = electron.app
+var Menu = electron.Menu
+var Tray = electron.Tray
 
-var config = require('../config')
 var windows = require('./windows')
 
-var tray
+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') {
-    initLinux()
+    checkLinuxTraySupport(function (supportsTray) {
+      if (supportsTray) createTrayIcon()
+    })
   }
-  if (process.platform === 'win32') {
+
-    initWin32()
+  // Windows always supports minimize-to-tray
-  }
+  if (process.platform === 'win32') createTrayIcon()
-  // OS X apps generally do not have menu bar icons
 }
 
-/**
- * Returns true if there a tray icon is active.
- */
 function hasTray () {
-  return !!tray
+  return !!trayIcon
 }
 
-function onWindowBlur () {
+function createTrayIcon () {
-  if (!tray) return
+  trayIcon = new 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 onWindowFocus () {
-  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.
@@ -68,48 +59,25 @@ function checkLinuxTraySupport (cb) {
   })
 }
 
-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())
+  var showHideMenuItem
-  tray.setContextMenu(contextMenu)
+  if (windows.main.isVisible()) {
-}
+    showHideMenuItem = { label: 'Hide to tray', click: hideApp }
-
+  } else {
-function getMenuTemplate () {
+    showHideMenuItem = { label: 'Show', click: showApp }
-  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()
-      }
-    }
   }
+  var contextMenu = Menu.buildFromTemplate([
+    showHideMenuItem,
+    { label: 'Quit', click: () => app.quit() }
+  ])
+  trayIcon.setContextMenu(contextMenu)
 }
 
-function getIconPath () {
+function showApp () {
-  return process.platform === 'win32'
+  windows.main.show()
-    ? config.APP_ICON + '.ico'
+}
-    : config.APP_ICON + '.png'
+
+function hideApp () {
+  windows.main.hide()
+  windows.main.send('dispatch', 'backToList')
 }

main/updater.js

@@ -1,76 +0,0 @@
-module.exports = {
-  init
-}
-
-var electron = require('electron')
-var get = require('simple-get')
-
-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()
-  } else {
-    initDarwinWin32()
-  }
-}
-
-// 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(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.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 initDarwinWin32 () {
-  electron.autoUpdater.on(
-    'error',
-    (err) => log.error(`Update error: ${err.message}`)
-  )
-
-  electron.autoUpdater.on(
-    'checking-for-update',
-    () => log('Checking for update')
-  )
-
-  electron.autoUpdater.on(
-    'update-available',
-    () => log('Update available')
-  )
-
-  electron.autoUpdater.on(
-    'update-not-available',
-    () => log('Update not available')
-  )
-
-  electron.autoUpdater.on(
-    'update-downloaded',
-    (e, notes, name, date, url) => log(`Update downloaded: ${name}: ${url}`)
-  )
-
-  electron.autoUpdater.setFeedURL(AUTO_UPDATE_URL)
-  electron.autoUpdater.checkForUpdates()
-}

main/vlc.js

@@ -1,22 +0,0 @@
-module.exports = {
-  checkForVLC,
-  spawn
-}
-
-var cp = require('child_process')
-var vlcCommand = require('vlc-command')
-
-// Finds if VLC is installed on Mac, Windows, or Linux.
-// Calls back with true or false: whether VLC was detected
-function checkForVLC (cb) {
-  vlcCommand((err) => cb(!err))
-}
-
-// Spawns VLC with child_process.spawn() to return a ChildProcess object
-// Calls back with (err, childProcess)
-function spawn (args, cb) {
-  vlcCommand(function (err, vlcPath) {
-    if (err) return cb(err)
-    cb(null, cp.spawn(vlcPath, args))
-  })
-}

main/windows.js

@@ -0,0 +1,131 @@
+var windows = module.exports = {
+  about: null,
+  main: null,
+  createAboutWindow,
+  createWebTorrentHiddenWindow,
+  createMainWindow,
+  focusWindow
+}
+
+var electron = require('electron')
+
+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 (!electron.app.isQuitting) {
+      e.preventDefault()
+      win.hide()
+    }
+  })
+
+  win.once('closed', function () {
+    windows.webtorrent = null
+  })
+}
+
+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 DOM finishes loading
+    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: 38 + (120 * 5) // header height + 4 torrents
+  })
+  win.loadURL(config.WINDOW_MAIN)
+
+  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()) {
+      electron.app.quit()
+    } else if (!electron.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
+}

main/windows/about.js

@@ -1,47 +0,0 @@
-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,
-    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'
-}

main/windows/index.js

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

main/windows/main.js

@@ -1,214 +0,0 @@
-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 (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 (win.setSheetOffset) win.setSheetOffset(HEADER_HEIGHT)
-
-  win.webContents.on('dom-ready', function () {
-    menu.onToggleFullScreen(main.win.isFullScreen())
-  })
-
-  win.on('blur', function () {
-    menu.onWindowBlur()
-    tray.onWindowBlur()
-  })
-
-  win.on('focus', function () {
-    menu.onWindowFocus()
-    tray.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()
-      win.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. (OS X)
- */
-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))
-    }
-    main.win.setBounds(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. (OS X)
-    main.win.setAspectRatio(0)
-  }
-
-  main.win.setFullScreen(flag)
-}
-
-function getIconPath () {
-  return process.platform === 'win32'
-    ? config.APP_ICON + '.ico'
-    : config.APP_ICON + '.png'
-}

main/windows/webtorrent.js

@@ -1,62 +0,0 @@
-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 })
-  }
-}

package.json

@@ -1,11 +1,11 @@
 {
   "name": "webtorrent-desktop",
   "description": "WebTorrent, the streaming torrent client. For OS X, Windows, and Linux.",
-  "version": "0.7.1",
+  "version": "0.3.3",
   "author": {
-    "name": "WebTorrent, LLC",
+    "name": "Feross Aboukhadijeh",
     "email": "feross@feross.org",
-    "url": "https://webtorrent.io"
+    "url": "http://feross.org"
   },
   "bin": {
     "webtorrent-desktop": "./bin/cmd.js"
@@ -14,65 +14,56 @@
     "url": "https://github.com/feross/webtorrent-desktop/issues"
   },
   "dependencies": {
-    "airplayer": "^2.0.0",
+    "airplay-js": "guerrerocarlos/node-airplay-js",
-    "application-config": "^0.2.1",
+    "application-config": "feross/node-application-config",
     "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",
+    "dlnacasts": "^0.0.3",
     "drag-drop": "^2.11.0",
-    "electron-prebuilt": "1.2.1",
+    "electron-localshortcut": "^0.6.0",
+    "electron-prebuilt": "0.37.6",
     "fs-extra": "^0.27.0",
     "hyperx": "^2.0.2",
-    "iso-639-1": "^1.2.1",
     "languagedetect": "^1.1.1",
     "main-loop": "^3.2.0",
     "musicmetadata": "^2.0.2",
     "network-address": "^1.1.0",
-    "parse-torrent": "^5.7.3",
     "prettier-bytes": "^1.0.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",
+    "upload-element": "^1.0.1",
     "virtual-dom": "^2.1.1",
-    "vlc-command": "^1.0.1",
+    "wcjs-player": "^0.5.7",
+    "webchimera.js": "^0.2.3",
     "webtorrent": "0.x",
-    "winreg": "^1.2.0",
+    "winreg": "^1.1.1"
-    "zero-fill": "^2.2.3"
   },
   "devDependencies": {
-    "cross-zip": "^2.0.1",
+    "cross-zip": "^1.0.0",
     "electron-osx-sign": "^0.3.0",
     "electron-packager": "^7.0.0",
-    "electron-winstaller": "^2.3.0",
+    "electron-winstaller": "feross/windows-installer#build",
     "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",
-    "rimraf": "^2.5.2",
     "run-series": "^1.1.4",
-    "standard": "^7.0.0"
+    "standard": "^6.0.5"
   },
   "homepage": "https://webtorrent.io",
   "keywords": [
     "desktop",
     "electron",
     "electron-app",
-    "hybrid webtorrent client",
-    "mad science",
-    "torrent client",
-    "torrent",
     "webtorrent"
   ],
   "license": "MIT",
   "main": "index.js",
   "optionalDependencies": {
-    "appdmg": "^0.4.3"
+    "appdmg": "^0.3.6"
   },
   "productName": "WebTorrent",
   "repository": {
@@ -81,10 +72,13 @@
   },
   "scripts": {
     "clean": "node ./bin/clean.js",
-    "open-config": "node ./bin/open-config.js",
     "package": "node ./bin/package.js",
     "start": "electron .",
-    "test": "standard && node ./bin/check-deps.js",
+    "test": "standard",
     "update-authors": "./bin/update-authors.sh"
+  },
+  "cmake-js": {
+    "runtime": "electron",
+    "runtimeVersion": "0.37.5"
   }
 }

renderer/about.html

@@ -29,10 +29,7 @@
   <body>
     <img src="../static/WebTorrent.png">
     <h1>WebTorrent</h1>
-    <p>
+    <p>Version <script>document.write(require('../package.json').version)</script></p>
-      Version <script>document.write(require('../package.json').version)</script>
-      (<script>document.write(require('webtorrent/package.json').version)</script>)
-    </p>
     <p><script>document.write(require('../config').APP_COPYRIGHT)</script></p>
   </body>
 </html>

renderer/index.css

@@ -50,22 +50,19 @@ table {
 }
 
 @keyframes fadein {
-  from {
+  from { opacity: 0; }
-    opacity: 0;
+  to   { opacity: 1; }
-  }
-  to {
-    opacity: 1;
-  }
 }
 
+
 .app {
   -webkit-user-select: none;
   -webkit-app-region: drag;
   height: 100%;
   display: flex;
   flex-flow: column;
+  animation: fadein 0.3s;
   background: rgb(40, 40, 40);
-  animation: fadein 0.5s;
 }
 
 .app:not(.is-focused) {
@@ -97,20 +94,11 @@ table {
   word-wrap: normal;
   white-space: nowrap;
   direction: ltr;
-  opacity: 0.85;
 
   -webkit-font-smoothing: antialiased;
   text-rendering: optimizeLegibility;
 }
 
-.icon.disabled {
-  opacity: 0.3;
-}
-
-.icon:not(.disabled):hover {
-  opacity: 1;
-}
-
 /*
  * UTILITY CLASSES
  */
@@ -121,14 +109,18 @@ table {
   white-space: nowrap;
 }
 
-.float-left {
+.disabled {
-  float: left;
+  opacity: 0.3;
 }
 
 .float-right {
   float: right;
 }
 
+.expand-collapse {
+  cursor: pointer;
+}
+
 .expand-collapse.expanded::before {
   content: '▲'
 }
@@ -156,8 +148,8 @@ table {
 .header {
   background: rgb(40, 40, 40);
   border-bottom: 1px solid rgb(20, 20, 20);
-  height: 38px; /* vertically center OS menu buttons (OS X) */
+  height: 37px; /* vertically center OS menu buttons (OS X) */
-  padding-top: 7px;
+  padding-top: 6px;
   overflow: hidden;
   flex: 0 1 auto;
   opacity: 1;
@@ -176,13 +168,7 @@ table {
 }
 
 .app.view-player .header {
-  background: rgba(40, 40, 40, 0.8);
+  opacity: 0.8;
-  border-bottom: none;
-}
-
-.app.view-player.is-win32 .header,
-.app.view-player.is-linux .header {
-  background: none;
 }
 
 .app.hide-video-controls.view-player .header {
@@ -190,8 +176,12 @@ table {
   cursor: none;
 }
 
+.app.hide-header .header {
+  display: none;
+}
+
 .header .title {
-  opacity: 0.7;
+  opacity: 0.6;
   position: absolute;
   margin-top: 1px;
   padding: 0 150px 0 150px;
@@ -202,22 +192,35 @@ table {
 
 .header .nav {
   font-weight: bold;
+  margin-right: 9px;
 }
 
 .header .nav.left {
-  margin-left: 10px;
+  float: left;
-}
-
-.header .nav.right {
-  margin-right: 10px;
 }
 
 .app.is-darwin:not(.is-fullscreen) .header .nav.left {
   margin-left: 78px;
 }
 
-.header .back,
+.header .nav.right {
-.header .forward {
+  float: right;
+}
+
+.header .nav * {
+  opacity: 0.6;
+}
+
+.header .nav .disabled {
+  opacity: 0.1;
+}
+
+.header .nav *:not(.disabled):hover {
+  opacity: 1;
+}
+
+.header .nav .back,
+.header .nav .forward {
   font-size: 30px;
   margin-top: -3px;
 }
@@ -273,6 +276,7 @@ table {
 }
 
 .modal label {
+  font-size: 16px;
   font-weight: bold;
 }
 
@@ -280,36 +284,36 @@ table {
   width: 100%;
 }
 
-.create-torrent {
+.create-torrent-page {
   padding: 10px 25px;
   overflow: hidden;
 }
 
-.create-torrent .torrent-attribute {
+.create-torrent-page .torrent-attribute {
   white-space: nowrap;
 }
 
-.create-torrent .torrent-attribute>* {
+.create-torrent-page .torrent-attribute>* {
   display: inline-block;
 }
 
-.create-torrent .torrent-attribute label {
+.create-torrent-page .torrent-attribute label {
   width: 60px;
   margin-right: 10px;
   vertical-align: top;
 }
 
-.create-torrent .torrent-attribute>div {
+.create-torrent-page .torrent-attribute>div {
   width: calc(100% - 90px);
 }
 
-.create-torrent .torrent-attribute div {
+.create-torrent-page .torrent-attribute div {
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
 }
 
-.create-torrent .torrent-attribute textarea {
+.create-torrent-page .torrent-attribute textarea {
   width: calc(100% - 80px);
   height: 80px;
   color: #eee;
@@ -321,11 +325,11 @@ table {
   padding: 4px 6px;
 }
 
-.create-torrent textarea.torrent-trackers {
+.create-torrent-page textarea.torrent-trackers {
   height: 200px;
 }
 
-.create-torrent input.torrent-is-private {
+.create-torrent-page input.torrent-is-private {
   width: initial;
   margin: 0;
 }
@@ -363,6 +367,7 @@ button { /* Rectangular text buttons */
   border-radius: 3px;
   font-size: 14px;
   font-weight: bold;
+  cursor: pointer;
   color: #aaa;
   outline: none;
 }
@@ -429,7 +434,7 @@ input {
 
 .torrent,
 .torrent-placeholder {
-  height: 100px;
+  height: 120px;
 }
 
 .torrent:not(:last-child) {
@@ -442,9 +447,9 @@ input {
 
 .torrent .metadata {
   position: absolute;
-  top: 25px;
+  top: 20px;
-  left: 15px;
+  left: 20px;
-  right: 15px;
+  right: 20px;
   width: calc(100% - 40px);
   text-shadow: rgba(0, 0, 0, 0.5) 0 0 4px;
 }
@@ -454,15 +459,12 @@ input {
 }
 
 .torrent .metadata span:not(:last-child)::after {
-  content: ' • ';
+  content: ' — ';
-  opacity: 0.7;
-  padding-left: 4px;
-  padding-right: 4px;
 }
 
 .torrent .buttons {
   position: absolute;
-  top: 29px;
+  top: 25px;
   right: 10px;
   align-items: center;
   display: none;
@@ -536,11 +538,6 @@ input {
   }
 }
 
-.torrent .buttons .play.resume-position {
-  position: relative;
-  -webkit-clip-path: circle(18px at center);
-}
-
 .torrent .buttons .delete {
   opacity: 0.5;
 }
@@ -549,13 +546,15 @@ input {
   opacity: 0.7;
 }
 
-.torrent .buttons .radial-progress {
+.torrent .name {
-  position: absolute;
+  font-size: 1.5em;
+  font-weight: bold;
+  line-height: 1.5em;
 }
 
-.torrent .name {
+.torrent .status,
-  font-size: 18px;
+.torrent .status2 {
-  font-weight: bold;
+  font-size: 1em;
   line-height: 1.5em;
 }
 
@@ -602,11 +601,11 @@ body.drag .app::after {
 }
 
 .torrent-details {
-  padding: 8em 0 20px 0;
+  padding: 8em 20px 20px 20px;
 }
 
-.torrent-details .warning {
+.torrent-details .open-folder {
-  padding-left: 15px;
+  float: right;
 }
 
 .torrent-details table {
@@ -620,35 +619,25 @@ body.drag .app::after {
   height: 28px;
 }
 
-.torrent-details td {
+.torrent-details tr:hover,
-  vertical-align: center;
+.torrent-details .open-folder:hover {
-}
-
-.torrent-details tr:hover {
   background-color: rgba(200, 200, 200, 0.3);
 }
 
 .torrent-details td {
   overflow: hidden;
   padding: 0;
-  vertical-align: middle;
+  vertical-align: bottom;
-}
-
-.torrent-details td .icon {
-  font-size: 18px;
-  position: relative;
-  top: 3px;
 }
 
 .torrent-details td.col-icon {
-  width: 3em;
+  width: 2em;
-  padding-left: 16px;
 }
 
-.torrent-details td.col-icon .radial-progress {
+.torrent-details td.col-icon .icon {
-  position: absolute;
+  font-size: 18px;
-  margin-top: 4px;
+  position: relative;
-  margin-left: 0.5px;
+  top: 3px;
 }
 
 .torrent-details td.col-name {
@@ -666,12 +655,6 @@ body.drag .app::after {
   text-align: right;
 }
 
-.torrent-details td.col-select {
-  width: 3em;
-  padding-right: 13px;
-  text-align: right;
-}
-
 /*
  * PLAYER
  */
@@ -691,16 +674,18 @@ body.drag .app::after {
   background-position: center;
 }
 
-.player video {
+.player .video-player {
   display: block;
   width: 100%;
+  height: 100%;
+  position: relative;
 }
 
 /*
  * PLAYER CONTROLS
  */
 
-.player .controls {
+.player-controls {
   position: fixed;
   background: rgba(40, 40, 40, 0.8);
   width: 100%;
@@ -709,60 +694,7 @@ body.drag .app::after {
   transition: opacity 0.15s ease-out;
 }
 
-.player .controls .icon {
+.app.hide-video-controls .player-controls {
-  display: block;
-  margin: 8px;
-  font-size: 22px;
-  opacity: 0.85;
-
-  /* Make all icons have uniform spacing */
-  max-width: 23px;
-  overflow: hidden;
-}
-
-.player .controls .icon:hover {
-  opacity: 1;
-}
-
-.player .controls .play-pause {
-  font-size: 28px;
-  margin-top: 5px;
-  margin-right: 10px;
-  margin-left: 15px;
-}
-
-.player .controls .volume-slider {
-  -webkit-appearance: none;
-  -webkit-app-region: no-drag;
-  width: 60px;
-  height: 3px;
-  margin: 18px 8px 8px 0;
-  border: none;
-  padding: 0;
-  opacity: 0.85;
-  vertical-align: sub;
-}
-
-.player .controls .time,
-.player .controls .rate {
-  font-weight: 100;
-  font-size: 13px;
-  margin: 9px 8px 8px 8px;
-  opacity: 0.8;
-}
-
-.player .controls .icon.closed-caption {
-  font-size: 26px;
-  margin-top: 6px;
-}
-
-.player .controls .icon.fullscreen {
-  font-size: 26px;
-  margin-right: 15px;
-  margin-top: 6px;
-}
-
-.app.hide-video-controls .player .controls {
   opacity: 0;
 }
 
@@ -770,16 +702,13 @@ body.drag .app::after {
   cursor: none;
 }
 
-/* TODO: find better way to handle this (that also
+.app.hide-video-controls .player .player-controls:hover {
- * keeps the header visible too).
- */
-.app.hide-video-controls .player .controls:hover {
   opacity: 1;
   cursor: default;
 }
 
 /* invisible click target for scrubbing */
-.player .controls .scrub-bar {
+.player-controls .scrub-bar {
   position: absolute;
   width: 100%;
   height: 23px; /* 3px .loading-bar plus 10px above and below */
@@ -788,7 +717,7 @@ body.drag .app::after {
   -webkit-app-region: no-drag;
 }
 
-.player .controls .loading-bar {
+.player-controls .loading-bar {
   position: relative;
   width: 100%;
   top: -3px;
@@ -798,14 +727,14 @@ body.drag .app::after {
   position: absolute;
 }
 
-.player .controls .loading-bar-part {
+.player-controls .loading-bar-part {
   position: absolute;
   background-color: #dd0000;
   top: 0;
   height: 100%;
 }
 
-.player .controls .playback-cursor {
+.player-controls .playback-cursor {
   position: absolute;
   top: -3px;
   background-color: #FFF;
@@ -814,26 +743,86 @@ body.drag .app::after {
   border-radius: 50%;
   margin-top: 0;
   margin-left: 0;
-  transition-property: width, height, top, margin-left;
+  transition-property: width, height, border-radius, margin-top, margin-left;
   transition-duration: 0.1s;
   transition-timing-function: ease-out;
 }
 
-.player .controls .closed-caption.active,
+.player-controls .play-pause {
-.player .controls .device.active {
+  display: block;
+  width: 30px;
+  height: 30px;
+  padding: 5px;
+  margin: 0 auto;
+}
+
+.player-controls .device,
+.player-controls .fullscreen,
+.player-controls .closed-captions,
+.player-controls .volume-icon,
+.player-controls .back {
+  display: block;
+  width: 20px;
+  height: 20px;
+  margin: 5px;
+}
+
+.player-controls .volume,
+.player-controls .back {
+  float: left;
+}
+
+.player-controls .device,
+.player-controls .closed-captions,
+.player-controls .fullscreen {
+  float: right;
+}
+
+.player-controls .fullscreen {
+  margin-right: 15px;
+}
+
+.player-controls .volume-icon,
+.player-controls .device {
+  font-size: 18px; /* make the cast icons less huge */
+  margin-top: 8px !important;
+}
+
+.player-controls .closed-captions.active,
+.player-controls .device.active {
   color: #9af;
 }
 
-.player .controls .volume-slider::-webkit-slider-thumb {
+.player-controls .volume {
+  display: block;
+  width: 90px;
+}
+
+.player-controls .volume-icon {
+  float: left;
+  margin-right: 0px;
+}
+
+.player-controls .volume-slider {
+  -webkit-appearance: none;
+  width: 50px;
+  height: 3px;
+  border: none;
+  padding: 0;
+  vertical-align: sub;
+}
+
+.player-controls .volume-slider::-webkit-slider-thumb {
   -webkit-appearance: none;
-  -webkit-app-region: no-drag;
   background-color: #fff;
-  width: 13px;
+  opacity: 1.0;
-  height: 13px;
+  width: 10px;
+  height: 10px;
+  border: 1px solid #303233;
   border-radius: 50%;
 }
 
-.player .controls .volume-slider:focus {
+.player-controls .volume-slider:focus {
   outline: none;
 }
 
@@ -843,49 +832,19 @@ body.drag .app::after {
 
 .player .playback-bar:hover .playback-cursor {
   top: -8px;
-  margin-left: -5px;
   width: 14px;
   height: 14px;
 }
 
-.player .controls .subtitles-list {
-  position: fixed;
-  background: rgba(40, 40, 40, 0.8);
-  min-width: 100px;
-  bottom: 45px;
-  right: 3px;
-  transition: opacity 0.15s ease-out;
-  padding: 5px 10px;
-  border-radius: 3px;
-  margin: 0;
-  list-style-type: none;
-  color: rgba(255, 255, 255, 0.8);
-}
-
-.player .controls .subtitles-list .icon {
-  display: inline;
-  font-size: 17px;
-  vertical-align: bottom;
-  line-height: 21px;
-  margin: 4px;
-}
-
-/**
- * Set the cue text position so it appears above the player controls.
- */
-video::-webkit-media-text-track-container {
-  bottom: 60px;
-  transition: bottom 0.1s ease-out;
-}
-.app.hide-video-controls video::-webkit-media-text-track-container {
-  bottom: 30px;
-}
 ::cue {
   background: none;
   color: #FFF;
+  font: 24px;
+  line-height: 1.3em;
   text-shadow: #000 -1px 0 1px, #000 1px 0 1px, #000 0 -1px 1px, #000 0 1px 1px, rgba(50, 50, 50, 0.5) 2px 2px 0;
 }
 
+
 /*
  * CHROMECAST / AIRPLAY CONTROLS
  */
@@ -913,172 +872,28 @@ video::-webkit-media-text-track-container {
 }
 
 /*
- * Preferences page, based on Atom settings style
+ * Subtitles list
  */
 
-.preferences {
+.subtitles-list {
-  font-size: 12px;
+  position: fixed;
-  line-height: calc(10/7);
+  background: rgba(40, 40, 40, 0.8);
-}
+  min-width: 100px;
-
+  bottom: 45px;
-.preferences .text {
+  right: 3px;
-  color: #a8a8a8;
+  transition: opacity 0.15s ease-out;
-}
+  padding: 5px 10px;
-
-.preferences .icon {
-  color: rgba(170, 170, 170, 0.6);
-  font-size: 16px;
-  margin-right: 0.2em;
-}
-
-.preferences .btn {
-  display: inline-block;
-  -webkit-appearance: button;
-  margin: 0;
-  font-weight: normal;
-  text-align: center;
-  vertical-align: middle;
-  border-color: #cccccc;
   border-radius: 3px;
-  color: #9da5b4;
-  text-shadow: none;
-  border: 1px solid #181a1f;
-  background-color: #3d3d3d;
-  white-space: initial;
-  font-size: 0.889em;
-  line-height: 1;
-  padding: 0.5em 0.75em;
-}
-
-.preferences .btn .icon {
   margin: 0;
-  color: #a8a8a8;
+  list-style-type: none;
+  color: rgba(255, 255, 255, 0.8);
 }
 
-.preferences .help .icon {
+.subtitles-list i {
-  vertical-align: sub;
+  font-size: 11px; /* make the cast icons less huge */
+  margin-right: 4px !important;
 }
 
-
-.preferences .preferences-panel .control-group + .control-group {
-  margin-top: 1.5em;
-}
-
-.preferences .section {
-  padding: 20px;
-  border-top: 1px solid #181a1f;
-}
-
-.preferences .section:first {
-  border-top: 0px;
-}
-
-.preferences .section:first-child,
-.preferences .section:last-child {
-  padding: 20px;
-}
-
-.preferences .section.section:empty {
-  padding: 0;
-  border-top: none;
-}
-
-.preferences .section-container {
-  width: 100%;
-  max-width: 800px;
-}
-
-.preferences section .section-heading,
-.preferences .section .section-heading {
-  margin-bottom: 10px;
-  color: #dcdcdc;
-  font-size: 1.75em;
-  font-weight: bold;
-  line-height: 1;
-  -webkit-user-select: none;
-  cursor: default;
-}
-
-.preferences .sub-section-heading.icon:before,
-.preferences .section-heading.icon:before {
-  margin-right: 8px;
-}
-
-.preferences .section-heading-count {
-  margin-left: .5em;
-}
-
-.preferences .section-body {
-  margin-top: 20px;
-}
-
-.preferences .sub-section {
-  margin: 20px 0;
-}
-
-.preferences .sub-section .sub-section-heading {
-  color: #dcdcdc;
-  font-size: 1.4em;
-  font-weight: bold;
-  line-height: 1;
-  -webkit-user-select: none;
-}
-
-.preferences .preferences-panel label {
-  color: #a8a8a8;
-}
-
-.preferences .preferences-panel .control-group + .control-group {
-  margin-top: 1.5em;
-}
-
-.preferences .preferences-panel .control-group .editor-container {
-  margin: 0;
-}
-
-.preferences .preference-title {
-  font-size: 1.2em;
-  -webkit-user-select: none;
-  display: inline-block;
-}
-
-.preferences .preference-description {
-    color: rgba(170, 170, 170, 0.6);
-    -webkit-user-select: none;
-    cursor: default;
-}
-
-.preferences input {
-  font-size: 1.1em;
-  line-height: 1.15em;
-  max-height: none;
-  width: 100%;
-  padding-left: 0.5em;
-  border-radius: 3px;
-  color: #a8a8a8;
-  border: 1px solid #181a1f;
-  background-color: #1b1d23;
-}
-
-.preferences input::-webkit-input-placeholder {
-  color: rgba(170, 170, 170, 0.6);
-}
-
-.preferences .control-group input {
-  margin-top: 0.2em;
-}
-
-.preferences .control-group input.file-picker-text {
-  width: calc(100% - 40px);
-}
-
-.preferences .control-group .checkbox .icon {
-  font-size: 1.5em;
-  margin: 0;
-  vertical-align: text-bottom;
-}
-
-
 /*
  * MEDIA OVERLAY / AUDIO DETAILS
  */
@@ -1147,6 +962,10 @@ video::-webkit-media-text-track-container {
   z-index: 1;
 }
 
+.app.hide-header .error-popover {
+  top: 0px;
+}
+
 .error-popover.hidden {
   display: none;
 }
@@ -1170,70 +989,3 @@ video::-webkit-media-text-track-container {
 .error-popover .error:last-child {
   border-bottom: none;
 }
-
-.error-text {
-  color: #c44;
-}
-
-/*
- * RADIAL PROGRESS BAR
- */
-
-.radial-progress {
-  width:  16px;
-  height: 16px;
-  border-radius: 50%;
-  background-color: #888;
-}
-
-.radial-progress .circle .mask,
-.radial-progress .circle .fill {
-  width:    16px;
-  height:   16px;
-  position: absolute;
-  border-radius: 50%;
-  -webkit-backface-visibility: hidden;
-}
-
-.radial-progress .circle .mask {
-  clip: rect(0px, 16px, 16px, 8px);
-}
-
-.radial-progress .circle .fill {
-  clip: rect(0px, 8px, 16px, 0px);
-  background-color: white;
-}
-
-.radial-progress .inset {
-  position: absolute;
-  width: 12px;
-  height: 12px;
-  margin: 2px 0 0 2px;
-  border-radius: 50%;
-  background-color: black;
-}
-
-.radial-progress-large {
-  width:  40px;
-  height: 40px;
-}
-
-.radial-progress-large .circle .mask,
-.radial-progress-large .circle .fill {
-  width:  40px;
-  height: 40px;
-}
-.radial-progress-large .circle .mask {
-  clip: rect(0px, 40px, 40px, 20px);
-}
-
-.radial-progress-large .circle .fill {
-  clip: rect(0px, 20px, 40px, 0px);
-  background-color: white;
-}
-
-.radial-progress-large .inset {
-  width: 32px;
-  height: 32px;
-  margin: 4px 0 0 4px;
-}

renderer/lib/cast.js

@@ -8,11 +8,10 @@ module.exports = {
   play,
   pause,
   seek,
-  setVolume,
+  setVolume
-  setRate
 }
 
-var airplayer = require('airplayer')()
+var airplay = require('airplay-js')
 var chromecasts = require('chromecasts')()
 var dlnacasts = require('dlnacasts')()
 
@@ -41,9 +40,10 @@ function init (appState, callback) {
     state.devices.dlna = dlnaPlayer(player)
   })
 
-  airplayer.on('update', function (player) {
+  var browser = airplay.createBrowser()
+  browser.on('deviceOn', function (player) {
     state.devices.airplay = airplayPlayer(player)
-  })
+  }).start()
 }
 
 // chromecast player implementation
@@ -128,31 +128,13 @@ function chromecastPlayer (player) {
 
 // airplay player implementation
 function airplayPlayer (player) {
-  function addEvents () {
-    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 open () {
-    player.play(state.server.networkURL, function (err, res) {
+    player.play(state.server.networkURL, 0, function (res) {
-      if (err) {
+      if (res.statusCode !== 200) {
         state.playing.location = 'local'
         state.errors.push({
           time: new Date().getTime(),
-          message: 'Could not connect to AirPlay. ' + err.message
+          message: 'Could not connect to AirPlay.'
         })
       } else {
         state.playing.location = 'airplay'
@@ -162,11 +144,11 @@ function airplayPlayer (player) {
   }
 
   function play (callback) {
-    player.resume(callback)
+    player.rate(1, callback)
   }
 
   function pause (callback) {
-    player.pause(callback)
+    player.rate(0, callback)
   }
 
   function stop (callback) {
@@ -174,18 +156,13 @@ function airplayPlayer (player) {
   }
 
   function status () {
-    player.playbackInfo(function (err, res, status) {
+    player.status(function (status) {
-      if (err) {
+      state.playing.isPaused = status.rate === 0
-        state.playing.location = 'local'
+      state.playing.currentTime = status.position
-        state.errors.push({
+      // TODO: get airplay volume, implementation needed. meanwhile set value in setVolume
-          time: new Date().getTime(),
+      // According to docs is in [-30 - 0] (db) range
-          message: 'Could not connect to AirPlay. ' + err.message
+      // should be converted to [0 - 1] using (val / 30 + 1)
-        })
+      update()
-      } else {
-        state.playing.isPaused = status.rate === 0
-        state.playing.currentTime = status.position
-        update()
-      }
     })
   }
 
@@ -194,13 +171,12 @@ function airplayPlayer (player) {
   }
 
   function volume (volume, callback) {
-    // AirPlay doesn't support volume
+    // TODO remove line below once we can fetch the information in status update
-    // TODO: We should just disable the volume slider
     state.playing.volume = volume
+    volume = (volume - 1) * 30
+    player.volume(volume, callback)
   }
 
-  addEvents()
-
   return {
     player: player,
     open: open,
@@ -368,22 +344,6 @@ function pause () {
   }
 }
 
-function setRate (rate) {
-  var device
-  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') {
-    device = state.devices.airplay
-    device.rate(rate, castCallback)
-  } else {
-    result = false
-  }
-  return result
-}
-
 function seek (time) {
   var device = getDevice()
   if (device) {

renderer/lib/dispatcher.js

@@ -1,39 +1,38 @@
 module.exports = {
+  setDispatch,
   dispatch,
-  dispatcher,
+  dispatcher
-  setDispatch
 }
 
-var dispatchers = {}
+// Memoize most of our event handlers, which are functions in the form
-var _dispatch = function () {}
+// () => dispatch(<args>)
+// ... this prevents virtual-dom from updating every listener on every update()
+var _dispatchers = {}
+var _dispatch = () => {}
 
 function setDispatch (dispatch) {
   _dispatch = dispatch
 }
 
-function dispatch (...args) {
+// Get a _memoized event handler that calls dispatch()
-  _dispatch(...args)
+// All args must be JSON-able
-}
-
-// Most DOM event handlers are trivial functions like `() => dispatch(<args>)`.
-// For these, `dispatcher(<args>)` is preferred because it memoizes the handler
-// function. This prevents virtual-dom from updating the listener functions on
-// each update().
 function dispatcher (...args) {
-  var str = JSON.stringify(args)
+  var json = JSON.stringify(args)
-  var handler = dispatchers[str]
+  var handler = _dispatchers[json]
   if (!handler) {
-    handler = dispatchers[str] = function (e) {
+    handler = _dispatchers[json] = (e) => {
-      // Do not propagate click to elements below the button
+      if (e && e.stopPropagation && e.currentTarget) {
-      e.stopPropagation()
+        // Don't click on whatever is below the button
-
+        e.stopPropagation()
-      if (e.currentTarget.classList.contains('disabled')) {
+        // Don't register clicks on disabled buttons
-        // Ignore clicks on disabled elements
+        if (e.currentTarget.classList.contains('disabled')) return
-        return
       }
-
+      _dispatch.apply(null, args)
-      dispatch(...args)
     }
   }
   return handler
 }
+
+function dispatch (...args) {
+  _dispatch.apply(null, args)
+}

renderer/lib/hx.js

@@ -1,5 +0,0 @@
-var h = require('virtual-dom/h')
-var hyperx = require('hyperx')
-var hx = hyperx(h)
-
-module.exports = hx

renderer/lib/location-history.js

@@ -4,123 +4,81 @@ function LocationHistory () {
   if (!new.target) return new LocationHistory()
   this._history = []
   this._forward = []
-  this._pending = false
+  this._pending = null
 }
 
-LocationHistory.prototype.url = function () {
+LocationHistory.prototype.go = function (page, cb) {
-  return this.current() && this.current().url
+  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.go = function (page, cb) {
-  if (!cb) cb = noop
-  if (this._pending) return cb(null)
-
-  console.log('go', page)
-
-  this.clearForward()
-  this._go(page, cb)
-}
-
-LocationHistory.prototype.back = function (cb) {
-  var self = this
-  if (!cb) cb = noop
-  if (self._history.length <= 1 || self._pending) return cb(null)
-
-  var page = self._history.pop()
-  self._unload(page, done)
-
-  function done (err) {
-    if (err) return cb(err)
-    self._forward.push(page)
-    self._load(self.current(), cb)
-  }
-}
-
 LocationHistory.prototype.hasBack = function () {
   return this._history.length > 1
 }
 
-LocationHistory.prototype.forward = function (cb) {
-  if (!cb) cb = noop
-  if (this._forward.length === 0 || this._pending) return cb(null)
-
-  var page = this._forward.pop()
-  this._go(page, cb)
-}
-
 LocationHistory.prototype.hasForward = function () {
   return this._forward.length > 0
 }
 
-LocationHistory.prototype.clearForward = function (url) {
+LocationHistory.prototype.pending = function () {
-  if (url == null) {
+  return this._pending
-    this._forward = []
-  } else {
-    console.log(this._forward)
-    console.log(url)
-    this._forward = this._forward.filter(function (page) {
-      return page.url !== url
-    })
-  }
 }
 
-LocationHistory.prototype.backToFirst = function (cb) {
+LocationHistory.prototype.clearPending = function () {
-  var self = this
+  this._pending = null
-  if (!cb) cb = noop
-  if (self._history.length <= 1) return cb(null)
-
-  self.back(function (err) {
-    if (err) return cb(err)
-    self.backToFirst(cb)
-  })
 }
-
-LocationHistory.prototype._go = function (page, cb) {
-  var self = this
-  if (!cb) cb = noop
-
-  self._unload(self.current(), done1)
-
-  function done1 (err) {
-    if (err) return cb(err)
-    self._load(page, done2)
-  }
-
-  function done2 (err) {
-    if (err) return cb(err)
-    self._history.push(page)
-    cb(null)
-  }
-}
-
-LocationHistory.prototype._load = function (page, cb) {
-  var self = this
-  self._pending = true
-
-  if (page && page.onbeforeload) page.onbeforeload(done)
-  else done(null)
-
-  function done (err) {
-    self._pending = false
-    cb(err)
-  }
-}
-
-LocationHistory.prototype._unload = function (page, cb) {
-  var self = this
-  self._pending = true
-
-  if (page && page.onbeforeunload) page.onbeforeunload(done)
-  else done(null)
-
-  function done (err) {
-    self._pending = false
-    cb(err)
-  }
-}
-
-function noop () {}

renderer/lib/migrations.js

@@ -1,88 +0,0 @@
-/* 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)
-  }
-
-  // Future migrations...
-  // if (semver.lt(version, '0.8.0')) {
-  //   migrate_0_8_0(state)
-  // }
-
-  // Config is now on the new version
-  state.saved.version = config.APP_VERSION
-}
-
-function migrate_0_7_0 (state) {
-  console.log('migrate to 0.7.0')
-
-  var fs = require('fs-extra')
-  var path = require('path')
-
-  state.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
-  })
-}

renderer/lib/sound.js

@@ -6,43 +6,41 @@ module.exports = {
 var config = require('../../config')
 var path = require('path')
 
-var VOLUME = 0.15
-
 /* Cache of Audio elements, for instant playback */
 var cache = {}
 
 var sounds = {
   ADD: {
     url: 'file://' + path.join(config.STATIC_PATH, 'sound', 'add.wav'),
-    volume: VOLUME
+    volume: 0.2
   },
   DELETE: {
     url: 'file://' + path.join(config.STATIC_PATH, 'sound', 'delete.wav'),
-    volume: VOLUME
+    volume: 0.1
   },
   DISABLE: {
     url: 'file://' + path.join(config.STATIC_PATH, 'sound', 'disable.wav'),
-    volume: VOLUME
+    volume: 0.2
   },
   DONE: {
     url: 'file://' + path.join(config.STATIC_PATH, 'sound', 'done.wav'),
-    volume: VOLUME
+    volume: 0.2
   },
   ENABLE: {
     url: 'file://' + path.join(config.STATIC_PATH, 'sound', 'enable.wav'),
-    volume: VOLUME
+    volume: 0.2
   },
   ERROR: {
     url: 'file://' + path.join(config.STATIC_PATH, 'sound', 'error.wav'),
-    volume: VOLUME
+    volume: 0.2
   },
   PLAY: {
     url: 'file://' + path.join(config.STATIC_PATH, 'sound', 'play.wav'),
-    volume: VOLUME
+    volume: 0.2
   },
   STARTUP: {
     url: 'file://' + path.join(config.STATIC_PATH, 'sound', 'startup.wav'),
-    volume: VOLUME * 2
+    volume: 0.4
   }
 }
 

renderer/lib/state.js

@@ -1,217 +0,0 @@
-module.exports = {
-  getDefaultPlayState,
-  load,
-  save
-}
-
-var appConfig = require('application-config')('WebTorrent')
-var path = require('path')
-
-var config = require('../../config')
-var migrations = require('./migrations')
-
-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 */
-      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,
-    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,
-    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.IS_PORTABLE
-        ? path.join(config.CONFIG_PATH, 'Downloads')
-        : 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)
-
-  var electron = require('electron')
-
-  // 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
-        }
-        torrent[key] = x[key]
-      }
-      return torrent
-    })
-
-  appConfig.write(copy, function (err) {
-    if (err) console.error(err)
-
-    // TODO: this doesn't belong here
-    electron.ipcRenderer.send('savedState')
-  })
-}

renderer/lib/torrent-player.js

@@ -16,27 +16,12 @@ function isPlayable (file) {
 
 function isVideo (file) {
   var ext = path.extname(file.name).toLowerCase()
-  return [
+  return ['.mp4', '.m4v', '.webm', '.mov', '.mkv'].indexOf(ext) !== -1
-    '.avi',
-    '.m4v',
-    '.mkv',
-    '.mov',
-    '.mp4',
-    '.mpg',
-    '.ogv',
-    '.webm'
-  ].includes(ext)
 }
 
 function isAudio (file) {
   var ext = path.extname(file.name).toLowerCase()
-  return [
+  return ['.mp3', '.aac', '.ogg', '.wav'].indexOf(ext) !== -1
-    '.aac',
-    '.ac3',
-    '.mp3',
-    '.ogg',
-    '.wav'
-  ].includes(ext)
 }
 
 function isPlayableTorrent (torrentSummary) {

renderer/lib/torrent-poster.js

@@ -4,18 +4,12 @@ var captureVideoFrame = require('./capture-video-frame')
 var path = require('path')
 
 function torrentPoster (torrent, cb) {
-  // First, try to use a poster image if available
+  // First, try to use the largest video file
-  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)
 
-  // Third, try to use the largest image file
+  // Second, try to use the largest image file
   var imgFile = getLargestFileByExtension(torrent, ['.gif', '.jpg', '.png'])
   if (imgFile) return torrentPosterFromImage(imgFile, torrent, cb)
 

renderer/lib/torrent-summary.js

@@ -10,14 +10,14 @@ var config = require('../../config')
 // 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)
+  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.POSTER_PATH, torrentSummary.posterFileName)
+  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

@@ -3,9 +3,9 @@
   <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
-    <link rel="stylesheet" href="main.css" charset="utf-8">
+    <link rel="stylesheet" href="index.css" charset="utf-8">
   </head>
   <body>
-    <script async src="main.js"></script>
+    <script async src="index.js"></script>
   </body>
 </html>

renderer/state.js

@@ -0,0 +1,264 @@
+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
+}
+
+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: {}
+  }
+}
+
+/* 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: [], /* subtitles file (Buffer) */
+      enabled: false
+    }
+  }
+}
+
+/* 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')
+  }
+}

renderer/views/app.js

@@ -1,19 +1,18 @@
 module.exports = App
 
-var hx = require('../lib/hx')
+var h = require('virtual-dom/h')
+var hyperx = require('hyperx')
+var hx = hyperx(h)
+
 var Header = require('./header')
-
 var Views = {
-  'home': require('./home'),
+  'home': require('./torrent-list'),
   'player': require('./player'),
-  'create-torrent': require('./create-torrent'),
+  'create-torrent': require('./create-torrent-page')
-  'preferences': require('./preferences')
 }
-
 var Modals = {
   'open-torrent-address-modal': require('./open-torrent-address-modal'),
-  'update-available-modal': require('./update-available-modal'),
+  'update-available-modal': require('./update-available-modal')
-  'unsupported-media-modal': require('./unsupported-media-modal')
 }
 
 function App (state) {
@@ -22,20 +21,24 @@ function App (state) {
   // * 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' &&
+  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' &&
+    state.playing.location === 'local'
-    state.playing.playbackRate === 1
+
+  // 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.url(), /* e.g. view-home, view-player */
+    '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(' ')}'>
@@ -50,13 +53,12 @@ function App (state) {
 function getErrorPopover (state) {
   var now = new Date().getTime()
   var recentErrors = state.errors.filter((x) => now - x.time < 5000)
-  var hasErrors = recentErrors.length > 0
 
   var errorElems = recentErrors.map(function (error) {
     return hx`<div class='error'>${error.message}</div>`
   })
   return hx`
-    <div class='error-popover ${hasErrors ? 'visible' : 'hidden'}'>
+  <div class='error-popover ${recentErrors.length > 0 ? 'visible' : 'hidden'}'>
       <div class='title'>Error</div>
       ${errorElems}
     </div>
@@ -77,6 +79,6 @@ function getModal (state) {
 }
 
 function getView (state) {
-  var url = state.location.url()
+  var url = state.location.current().url
   return Views[url](state)
 }

renderer/views/create-torrent-page.js

@@ -1,11 +1,14 @@
 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, dispatcher} = require('../lib/dispatcher')
+var {dispatch} = require('../lib/dispatcher')
-var hx = require('../lib/hx')
 
 function CreateTorrentPage (state) {
   var info = state.location.current()
@@ -14,19 +17,23 @@ function CreateTorrentPage (state) {
   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()
 
   // 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 (files.length > 0) {
-    if (!pathPrefix.endsWith('/') && !pathPrefix.endsWith('\\')) {
+      pathPrefix = files.map((x) => x.path).reduce(findCommonPrefix)
-      pathPrefix = path.dirname(pathPrefix)
+      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
+  console.log('FILES', files)
   var totalBytes = files
     .map((f) => f.size)
     .reduce((a, b) => a + b, 0)
@@ -34,16 +41,8 @@ function CreateTorrentPage (state) {
 
   // 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
+  var defaultName = path.basename(pathPrefix)
-  if (files.length === 1) {
+  var basePath = path.dirname(pathPrefix)
-    // 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)
@@ -56,7 +55,7 @@ function CreateTorrentPage (state) {
   var collapsedClass = info.showAdvanced ? 'expanded' : 'collapsed'
 
   return hx`
-    <div class='create-torrent'>
+    <div class='create-torrent-page'>
       <h2>Create torrent ${defaultName}</h2>
       <p class="torrent-info">
         ${torrentInfo}
@@ -113,10 +112,11 @@ function CreateTorrentPage (state) {
       comment: comment
     }
     dispatch('createTorrent', options)
+    dispatch('backToList')
   }
 
   function handleCancel () {
-    dispatch('back')
+    dispatch('backToList')
   }
 
   function handleToggleShowAdvanced () {
@@ -127,27 +127,6 @@ function CreateTorrentPage (state) {
   }
 }
 
-function CreateTorrentErrorPage () {
-  return hx`
-    <div class='create-torrent'>
-      <h2>Create torrent</h2>
-      <p class="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 class="float-right">
-        <button class='button-flat light' onclick=${dispatcher('back')}>
-          Cancel
-        </button>
-      </p>
-    </div>
-  `
-}
-
 // Finds the longest common prefix
 function findCommonPrefix (a, b) {
   for (var i = 0; i < a.length && i < b.length; i++) {

renderer/views/header.js

@@ -1,13 +1,16 @@
 module.exports = Header
 
+var h = require('virtual-dom/h')
+var hyperx = require('hyperx')
+var hx = hyperx(h)
+
 var {dispatcher} = require('../lib/dispatcher')
-var hx = require('../lib/hx')
 
 function Header (state) {
   return hx`
     <div class='header'>
       ${getTitle()}
-      <div class='nav left float-left'>
+      <div class='nav left'>
         <i.icon.back
           class=${state.location.hasBack() ? '' : 'disabled'}
           title='Back'
@@ -21,7 +24,7 @@ function Header (state) {
           chevron_right
         </i>
       </div>
-      <div class='nav right float-right'>
+      <div class='nav right'>
         ${getAddButton()}
       </div>
     </div>
@@ -34,12 +37,12 @@ function Header (state) {
   }
 
   function getAddButton () {
-    if (state.location.url() === 'home') {
+    if (state.location.current().url !== 'player') {
       return hx`
         <i
           class='icon add'
           title='Add torrent'
-          onclick=${dispatcher('openFiles')}>
+          onclick=${dispatcher('showOpenTorrentFile')}>
           add
         </i>
       `

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

@@ -1,7 +1,10 @@
 module.exports = OpenTorrentAddressModal
 
+var h = require('virtual-dom/h')
+var hyperx = require('hyperx')
+var hx = hyperx(h)
+
 var {dispatch} = require('../lib/dispatcher')
-var hx = require('../lib/hx')
 
 function OpenTorrentAddressModal (state) {
   return hx`

renderer/views/player.js

@@ -1,10 +1,13 @@
 module.exports = Player
 
-var Bitfield = require('bitfield')
+var h = require('virtual-dom/h')
-var prettyBytes = require('prettier-bytes')
+var hyperx = require('hyperx')
-var zeroFill = require('zero-fill')
+var hx = hyperx(h)
+
+var WebChimeraPlayer = require('wcjs-player')
+var prettyBytes = require('prettier-bytes')
+var Bitfield = require('bitfield')
 
-var hx = require('../lib/hx')
 var TorrentSummary = require('../lib/torrent-summary')
 var {dispatch, dispatcher} = require('../lib/dispatcher')
 
@@ -16,7 +19,6 @@ function Player (state) {
   return hx`
     <div
       class='player'
-      onwheel=${handleVolumeWheel}
       onmousemove=${dispatcher('mediaMouseMoved')}>
       ${showVideo ? renderMedia(state) : renderCastScreen(state)}
       ${renderPlayerControls(state)}
@@ -24,18 +26,19 @@ function Player (state) {
   `
 }
 
-// Handles volume change by wheel
-function handleVolumeWheel (e) {
-  dispatch('changeVolume', (-e.deltaY | e.deltaX) / 500)
-}
-
 function renderMedia (state) {
   if (!state.server) return
+  if (false) return renderMediaTag(state)
+  else return renderMediaVLC(state)
+}
 
+// Renders using a <video> or <audio> tag
+// Handles only a subset of codecs, but it's cleaner and more efficient
+// See renderMediaVLC()
+function renderMediaTag (state) {
   // 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) /* get the <video> or <audio> tag */
-  var mediaElement = document.querySelector(state.playing.type)
   if (mediaElement !== null) {
     if (state.playing.isPaused && !mediaElement.paused) {
       mediaElement.pause()
@@ -47,44 +50,35 @@ function renderMedia (state) {
       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
+    // fix textTrack cues not been removed <track> rerender
-    var tracks = mediaElement.textTracks || []
+    if (state.playing.subtitles.change) {
-    for (var j = 0; j < tracks.length; j++) {
+      var tracks = mediaElement.textTracks
-      var isSelectedTrack = j === state.playing.subtitles.selectedIndex
+      for (var j = 0; j < tracks.length; j++) {
-      tracks[j].mode = isSelectedTrack ? 'showing' : 'hidden'
+        // mode is not an <track> attribute, only available on DOM
+        tracks[j].mode = (tracks[j].label === state.playing.subtitles.change) ? 'showing' : 'hidden'
+      }
+      state.playing.subtitles.change = null
     }
 
-    // Save video position
+    state.playing.currentTime = mediaElement.currentTime
-    var file = state.getPlayingFileSummary()
+    state.playing.duration = mediaElement.duration
-    file.currentTime = state.playing.currentTime = mediaElement.currentTime
-    file.duration = state.playing.duration = mediaElement.duration
     state.playing.volume = mediaElement.volume
   }
 
   // Add subtitles to the <video> tag
   var trackTags = []
-  if (state.playing.subtitles.selectedIndex >= 0) {
+  if (state.playing.subtitles.enabled && state.playing.subtitles.tracks.length > 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' : ''}
+          ${track.selected ? 'default' : ''}
           label=${track.label}
           type='subtitles'
           src=${track.buffer}>
@@ -102,8 +96,7 @@ function renderMedia (state) {
       onstalling=${dispatcher('mediaStalled')}
       onerror=${dispatcher('mediaError')}
       ontimeupdate=${dispatcher('mediaTimeUpdate')}
-      onencrypted=${dispatcher('mediaEncrypted')}
+      autoplay>
-      oncanplay=${onCanPlay}>
       ${trackTags}
     </div>
   `
@@ -119,7 +112,7 @@ function renderMedia (state) {
     </div>
   `
 
-  // As soon as we know the video dimensions, resize the window
+  // 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
@@ -134,17 +127,101 @@ function renderMedia (state) {
   function onEnded (e) {
     state.playing.isPaused = true
   }
+}
 
-  function onCanPlay (e) {
+// Renders using WebChimera.js to render using VLC
-    var elem = e.target
+// That lets us play media that the <video> tag can't play
-    if (state.playing.type === 'video' &&
+function renderMediaVLC (state) {
-      elem.webkitVideoDecodedByteCount === 0) {
+  // Unfortunately, WebChimera can't be done just by modifying HTML.
-      dispatch('mediaError', 'Video codec unsupported')
+  // Instead, grab the DOM node
-    } else if (elem.webkitAudioDecodedByteCount === 0) {
+  if (document.querySelector('#media-player')) {
-      dispatch('mediaError', 'Audio codec unsupported')
+    if (!state.playing.chimera) {
+      state.playing.chimera = new WebChimeraPlayer('#media-player')
+        .addPlayer({
+          autoplay: true,
+          vlcArgs: ['-vvv'],
+          wcjsRendererOptions: {'fallbackRenderer': true}
+        })
+        .onPlaying(dispatcher('mediaPlaying'))
+        .onPaused(dispatcher('mediaPaused'))
+        .onBuffering(dispatcher('mediaStalled'))
+        .onTime(dispatcher('mediaTimeUpdate'))
+        .onEnded(onEnded)
+        .onFrameSetup(onLoadedMetadata)
+        .addPlaylist(state.server.localURL)
+      state.playing.chimera.ui(false)
     } else {
-      elem.play()
+      var player = state.playing.chimera
+      if (state.playing.isPaused && player.playing()) {
+        player.pause()
+      } else if (!state.playing.isPaused && !player.playing()) {
+        player.play()
+      }
+      // When the user clicks or drags on the progress bar, jump to that position
+      if (state.playing.jumpToTime) {
+        player.time(state.playing.jumpToTime * 1000) // WebChimera expects milliseconds
+        state.playing.jumpToTime = null
+      }
+      // Set volume
+      if (state.playing.setVolume !== null && isFinite(state.playing.setVolume)) {
+        player.volume(Math.round(state.playing.setVolume * 100)) // WebChimera expects integer percent
+        state.playing.setVolume = null
+      }
+
+      state.playing.currentTime = player.time() / 1000
+      state.playing.duration = player.length() / 1000
+      state.playing.volume = player.volume() / 100
     }
+  } else {
+    state.playing.chimera = null
+  }
+
+  // Add subtitles to the <video> tag
+  var trackTags = []
+  if (state.playing.subtitles.enabled && state.playing.subtitles.tracks.length > 0) {
+    for (var i = 0; i < state.playing.subtitles.tracks.length; i++) {
+      var track = state.playing.subtitles.tracks[i]
+      trackTags.push(hx`
+        <track
+        default=${track.selected ? 'default' : ''}
+        label=${track.language}
+        type='subtitles'
+        src=${track.buffer}>
+      `)
+    }
+  }
+
+  // Create the <audio> or <video> tag
+  var mediaType = state.playing.type /* 'video' or 'audio' */
+  var mediaTag = hx`
+    <div id='media-player' class='${mediaType}-player'>
+      ${trackTags}
+    </div>
+  `
+
+  // 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 (mediaType !== 'video') return
+    var dimensions = {
+      width: player.width(),
+      height: player.height()
+    }
+    dispatch('setDimensions', dimensions)
+  }
+
+  // When the video completes, pause the video instead of looping
+  function onEnded (e) {
+    state.playing.isPaused = true
   }
 }
 
@@ -163,8 +240,7 @@ function renderOverlay (state) {
   } else if (elems.length !== 0) {
     style = { backgroundImage: cssBackgroundImageDarkGradient() }
   } else {
-    // Video playing, so no spinner. No overlay needed
+    return /* Video, not audio, and it isn't stalled, so no spinner. No overlay needed. */
-    return
   }
 
   return hx`
@@ -175,7 +251,8 @@ function renderOverlay (state) {
 }
 
 function renderAudioMetadata (state) {
-  var fileSummary = state.getPlayingFileSummary()
+  var torrentSummary = getPlayingTorrentSummary(state)
+  var fileSummary = torrentSummary.files[state.playing.fileIndex]
   if (!fileSummary.audioInfo) return
   var info = fileSummary.audioInfo
 
@@ -194,37 +271,15 @@ function renderAudioMetadata (state) {
     track = info.track.no + ' of ' + info.track.of
   }
 
-  // Show a small info box in the middle of the screen with title/album/etc
+  // Show a small info box in the middle of the screen with title/album/artist/etc
   var elems = []
-  if (artist) {
+  if (artist) elems.push(hx`<div class='audio-artist'><label>Artist</label>${artist}</div>`)
-    elems.push(hx`
+  if (album) elems.push(hx`<div class='audio-album'><label>Album</label>${album}</div>`)
-      <div class='audio-artist'>
+  if (track) elems.push(hx`<div class='audio-track'><label>Track</label>${track}</div>`)
-        <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 other info, if available. Otherwise, center title
+  // Align the title with the artist/etc info, if available. Otherwise, center the title
   var emptyLabel = hx`<label></label>`
-  elems.unshift(hx`
+  elems.unshift(hx`<div class='audio-title'>${elems.length ? emptyLabel : undefined}${title}</div>`)
-    <div class='audio-title'>
-      ${elems.length ? emptyLabel : undefined}${title}
-    </div>
-  `)
 
   return hx`<div class='audio-metadata'>${elems}</div>`
 }
@@ -235,7 +290,7 @@ function renderLoadingSpinner (state) {
     (new Date().getTime() - state.playing.lastTimeUpdate > 2000)
   if (!isProbablyStalled) return
 
-  var prog = state.getPlayingTorrentSummary().progress || {}
+  var prog = getPlayingTorrentSummary(state).progress || {}
   var fileProgress = 0
   if (prog.files) {
     var file = prog.files[state.playing.fileIndex]
@@ -255,33 +310,20 @@ function renderLoadingSpinner (state) {
 }
 
 function renderCastScreen (state) {
-  var castIcon, castType, isCast
+  var castIcon, castType
   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
+  var castStatus = isStarting ? 'Connecting...' : 'Connected'
-  if (isCast) castStatus = isStarting ? 'Connecting...' : 'Connected'
-  else castStatus = ''
 
   // Show a nice title image, if possible
   var style = {
@@ -301,37 +343,23 @@ function renderCastScreen (state) {
 
 function renderSubtitlesOptions (state) {
   var subtitles = state.playing.subtitles
-  if (!subtitles.tracks.length || !subtitles.showMenu) return
+  if (subtitles.tracks.length && subtitles.show) {
-
+    return hx`<ul.subtitles-list>
-  var items = subtitles.tracks.map(function (track, ix) {
+      ${subtitles.tracks.map(function (w, i) {
-    var isSelected = state.playing.subtitles.selectedIndex === ix
+        return hx`<li onclick=${dispatcher('selectSubtitle', w.label)}><i.icon>${w.selected ? 'radio_button_checked' : 'radio_button_unchecked'}</i>${w.label}</li>`
-    return hx`
+      })}
-      <li onclick=${dispatcher('selectSubtitle', ix)}>
+        <li onclick=${dispatcher('selectSubtitle', '')}><i.icon>${!subtitles.enabled ? 'radio_button_checked' : 'radio_button_unchecked'}</i>None</li>
-        <i.icon>${'radio_button_' + (isSelected ? 'checked' : 'unchecked')}</i>
+      </ul>
-        ${track.label}
-      </li>
     `
-  })
+  }
-
-  var noneSelected = state.playing.subtitles.selectedIndex === -1
-  var noneClass = 'radio_button_' + (noneSelected ? 'checked' : 'unchecked')
-  return hx`
-    <ul.subtitles-list>
-      ${items}
-      <li onclick=${dispatcher('selectSubtitle', -1)}>
-        <i.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 playbackCursorStyle = { left: 'calc(' + positionPercent + '% - 8px)' }
   var captionsClass = state.playing.subtitles.tracks.length === 0
     ? 'disabled'
-    : state.playing.subtitles.selectedIndex >= 0
+    : state.playing.subtitles.enabled
       ? 'active'
       : ''
 
@@ -339,27 +367,15 @@ function renderPlayerControls (state) {
     hx`
       <div class='playback-bar'>
         ${renderLoadingBar(state)}
-        <div
+        <div class='playback-cursor' style=${playbackCursorStyle}></div>
-          class='playback-cursor'
+        <div class='scrub-bar'
-          style=${playbackCursorStyle}>
-        </div>
-        <div
-          class='scrub-bar'
           draggable='true'
-          ondragstart=${handleDragStart}
           onclick=${handleScrub},
-          ondrag=${handleScrub}>
+          ondrag=${handleScrub}></div>
-        </div>
       </div>
     `,
     hx`
-      <i class='icon play-pause float-left' onclick=${dispatcher('playPause')}>
+      <i class='icon fullscreen'
-        ${state.playing.isPaused ? 'play_arrow' : 'pause'}
-      </i>
-    `,
-    hx`
-      <i
-        class='icon fullscreen float-right'
         onclick=${dispatcher('toggleFullScreen')}>
         ${state.window.isFullScreen ? 'fullscreen_exit' : 'fullscreen'}
       </i>
@@ -369,10 +385,10 @@ function renderPlayerControls (state) {
   if (state.playing.type === 'video') {
     // show closed captions icon
     elements.push(hx`
-      <i.icon.closed-caption.float-right
+      <i.icon.closed-captions
         class=${captionsClass}
         onclick=${handleSubtitles}>
-        closed_caption
+        closed_captions
       </i>
     `)
   }
@@ -381,9 +397,7 @@ function renderPlayerControls (state) {
   var isOnChromecast = state.playing.location.startsWith('chromecast')
   var isOnAirplay = state.playing.location.startsWith('airplay')
   var isOnDlna = state.playing.location.startsWith('dlna')
-  var chromecastClass, chromecastHandler
+  var chromecastClass, chromecastHandler, airplayClass, airplayHandler, dlnaClass, dlnaHandler
-  var airplayClass, airplayHandler
-  var dlnaClass, dlnaHandler
   if (isOnChromecast) {
     chromecastClass = 'active'
     dlnaClass = 'disabled'
@@ -416,7 +430,7 @@ function renderPlayerControls (state) {
   if (state.devices.chromecast || isOnChromecast) {
     var castIcon = isOnChromecast ? 'cast_connected' : 'cast'
     elements.push(hx`
-      <i.icon.device.float-right
+      <i.icon.device
         class=${chromecastClass}
         onclick=${chromecastHandler}>
         ${castIcon}
@@ -425,7 +439,7 @@ function renderPlayerControls (state) {
   }
   if (state.devices.airplay || isOnAirplay) {
     elements.push(hx`
-      <i.icon.device.float-right
+      <i.icon.device
         class=${airplayClass}
         onclick=${airplayHandler}>
         airplay
@@ -434,8 +448,7 @@ function renderPlayerControls (state) {
   }
   if (state.devices.dlna || isOnDlna) {
     elements.push(hx`
-      <i
+      <i.icon.device
-        class='icon device float-right'
         class=${dlnaClass}
         onclick=${dlnaHandler}>
         tv
@@ -443,71 +456,56 @@ function renderPlayerControls (state) {
     `)
   }
 
-  // render volume
+  // On OSX, the back button is in the title bar of the window; see app.js
-  var volume = state.playing.volume
+  // On other platforms, we render one over the video on mouseover
-  var volumeIcon = 'volume_' + (
+  if (process.platform !== 'darwin') {
-    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 class='volume float-left'>
-      <i
-        class='icon volume-icon float-left'
-        onmousedown=${handleVolumeMute}>
-        ${volumeIcon}
-      </i>
-      <input
-        class='volume-slider float-right'
-        type='range' min='0' max='1' step='0.05'
-        value=${volumeChanging !== false ? volumeChanging : volume}
-        onmousedown=${handleVolumeScrub}
-        onmouseup=${handleVolumeScrub}
-        onmousemove=${handleVolumeScrub}
-        style=${volumeStyle}
-      />
-    </div>
-  `)
-
-  // Show video playback progress
-  var currentTimeStr = formatTime(state.playing.currentTime)
-  var durationStr = formatTime(state.playing.duration)
-  elements.push(hx`
-    <span class='time float-left'>
-      ${currentTimeStr} / ${durationStr}
-    </span>
-  `)
-
-  // render playback rate
-  if (state.playing.playbackRate !== 1) {
     elements.push(hx`
-      <span class='rate float-left'>
+      <i.icon.back
-        ${state.playing.playbackRate}x
+        onclick=${dispatcher('back')}>
-      </span>
+        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
+      onwheel=${handleVolumeWheel}>
+        <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}
+          onwheel=${handleVolumeWheel}
+          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='controls'>
+    <div class='player-controls'>
       ${elements}
       ${renderSubtitlesOptions(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) {
     dispatch('mediaMouseMoved')
@@ -517,6 +515,11 @@ function renderPlayerControls (state) {
     dispatch('playbackJump', position)
   }
 
+  // Handles volume change by wheel
+  function handleVolumeWheel (e) {
+    dispatch('changeVolume', (-e.deltaY | e.deltaX) / 500)
+  }
+
   // Handles volume muting and Unmuting
   function handleVolumeMute (e) {
     if (state.playing.volume === 0.0) {
@@ -550,7 +553,7 @@ function renderPlayerControls (state) {
       // if no subtitles available select it
       dispatch('openSubtitles')
     } else {
-      dispatch('toggleSubtitlesMenu')
+      dispatch('showSubtitles')
     }
   }
 }
@@ -561,7 +564,7 @@ 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()
+  var torrentSummary = getPlayingTorrentSummary(state)
   if (!torrentSummary.progress) {
     return []
   }
@@ -598,7 +601,7 @@ function renderLoadingBar (state) {
 
 // Returns the CSS background-image string for a poster image + dark vignette
 function cssBackgroundImagePoster (state) {
-  var torrentSummary = state.getPlayingTorrentSummary()
+  var torrentSummary = getPlayingTorrentSummary(state)
   var posterPath = TorrentSummary.getPosterPath(torrentSummary)
   if (!posterPath) return ''
   return cssBackgroundImageDarkGradient() + `, url(${posterPath})`
@@ -609,17 +612,7 @@ function cssBackgroundImageDarkGradient () {
     'rgba(0,0,0,0.4) 0%, rgba(0,0,0,1) 100%)'
 }
 
-function formatTime (time) {
+function getPlayingTorrentSummary (state) {
-  if (typeof time !== 'number' || Number.isNaN(time)) {
+  var infoHash = state.playing.infoHash
-    return '0:00'
+  return state.saved.torrents.find((x) => x.infoHash === infoHash)
-  }
-
-  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
 }

renderer/views/preferences.js

@@ -1,102 +0,0 @@
-module.exports = Preferences
-
-var hx = require('../lib/hx')
-var {dispatch} = require('../lib/dispatcher')
-
-var remote = require('electron').remote
-var dialog = remote.dialog
-
-function Preferences (state) {
-  return hx`
-    <div class='preferences'>
-      ${renderGeneralSection(state)}
-    </div>
-  `
-}
-
-function renderGeneralSection (state) {
-  return renderSection({
-    title: 'General',
-    description: '',
-    icon: 'settings'
-  }, [
-    renderDownloadDirSelector(state)
-  ])
-}
-
-function renderDownloadDirSelector (state) {
-  return renderFileSelector({
-    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) {
-    setStateValue('downloadPath', filePath)
-  })
-}
-
-// 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 : hx`
-    <div class='help text'>
-      <i.icon>help_outline</i>${definition.description}
-    </div>
-  `
-  return hx`
-    <section class='section preferences-panel'>
-      <div class='section-container'>
-        <div class='section-heading'>
-          <i.icon>${definition.icon}</i>${definition.title}
-        </div>
-        ${helpElem}
-        <div class='section-body'>
-          ${controls}
-        </div>
-      </div>
-    </section>
-  `
-}
-
-// 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) {
-  return hx`
-    <div class='control-group'>
-      <div class='controls'>
-        <label class='control-label'>
-          <div class='preference-title'>${definition.label}</div>
-          <div class='preference-description'>${definition.description}</div>
-        </label>
-        <div class='controls'>
-          <input type='text' class='file-picker-text'
-            id=${definition.property}
-            disabled='disabled'
-            value=${value} />
-          <button class='btn' onclick=${handleClick}>
-            <i.icon>folder_open</i>
-          </button>
-        </div>
-      </div>
-    </div>
-  `
-  function handleClick () {
-    dialog.showOpenDialog(remote.getCurrentWindow(), definition.options, function (filenames) {
-      if (!Array.isArray(filenames)) return
-      callback(filenames[0])
-    })
-  }
-}
-
-function setStateValue (property, value) {
-  dispatch('updatePreferences', property, value)
-}

renderer/views/torrent-list.js

@@ -1,17 +1,17 @@
 module.exports = TorrentList
 
+var h = require('virtual-dom/h')
+var hyperx = require('hyperx')
+var hx = hyperx(h)
 var prettyBytes = require('prettier-bytes')
 
-var hx = require('../lib/hx')
 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)
+    (torrentSummary) => renderTorrent(torrentSummary))
-  )
-
   return hx`
     <div class='torrent-list'>
       ${torrentRows}
@@ -20,7 +20,11 @@ function TorrentList (state) {
       </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
 
@@ -63,48 +67,38 @@ function TorrentList (state) {
     // If it's downloading/seeding then show progress info
     var prog = torrentSummary.progress
     if (torrentSummary.status !== 'paused' && prog) {
+      var progress = Math.floor(100 * prog.progress)
+      var downloaded = prettyBytes(prog.downloaded)
+      var total = prettyBytes(prog.length || 0)
+      if (downloaded !== total) downloaded += ` / ${total}`
+
       elements.push(hx`
-        <div class='ellipsis'>
+        <div class='status ellipsis'>
-          ${renderPercentProgress()}
+          ${getFilesLength()}
-          ${renderTotalProgress()}
+          <span>${getPeers()}</span>
-          ${renderPeers()}
+          <span>↓ ${prettyBytes(prog.downloadSpeed || 0)}/s</span>
-          ${renderDownloadSpeed()}
+          <span>↑ ${prettyBytes(prog.uploadSpeed || 0)}/s</span>
-          ${renderUploadSpeed()}
+        </div>
+      `)
+      elements.push(hx`
+        <div class='status2 ellipsis'>
+          <span class='progress'>${progress}%</span>
+          <span>${downloaded}</span>
         </div>
       `)
     }
 
     return hx`<div class='metadata'>${elements}</div>`
 
-    function renderPercentProgress () {
+    function getPeers () {
-      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>`
+      return `${prog.numPeers} ${count}`
     }
 
-    function renderDownloadSpeed () {
+    function getFilesLength () {
-      if (prog.downloadSpeed === 0) return
+      if (torrentSummary.files && torrentSummary.files.length > 1) {
-      return hx`<span>↓ ${prettyBytes(prog.downloadSpeed)}/s</span>`
+        return hx`<span class='files'>${torrentSummary.files.length} files</span>`
-    }
+      }
-
-    function renderUploadSpeed () {
-      if (prog.uploadSpeed === 0) return
-      return hx`<span>↑ ${prettyBytes(prog.uploadSpeed)}/s</span>`
     }
   }
 
@@ -114,7 +108,12 @@ function TorrentList (state) {
     var infoHash = torrentSummary.infoHash
 
     var playIcon, playTooltip, playClass
-    if (torrentSummary.playStatus === 'timeout') {
+    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 {
@@ -134,18 +133,6 @@ function TorrentList (state) {
       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 = renderRadialProgressBar(fraction, 'radial-progress-large')
-      playClass = 'resume-position'
-    }
-
     // Only show the play button for torrents that contain playable media
     var playButton
     if (TorrentPlayer.isPlayableTorrent(torrentSummary)) {
@@ -161,7 +148,6 @@ function TorrentList (state) {
 
     return hx`
       <div class='buttons'>
-        ${positionElem}
         ${playButton}
         <i.button-round.icon.download
           class=${torrentSummary.status}
@@ -181,6 +167,7 @@ function TorrentList (state) {
 
   // Show files, per-file download status and play buttons, and so on
   function renderTorrentDetails (torrentSummary) {
+    var infoHash = torrentSummary.infoHash
     var filesElement
     if (!torrentSummary.files) {
       // We don't know what files this torrent contains
@@ -190,17 +177,15 @@ function TorrentList (state) {
       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
+      var fileRows = torrentSummary.files.map(
-        .map((file, index) => ({ file, index }))
+        (file, index) => renderFileRow(torrentSummary, 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) => renderFileRow(torrentSummary, object.file, object.index))
-
       filesElement = hx`
         <div class='files'>
+          <strong>Files</strong>
+          <span class='open-folder'
+            onclick=${dispatcher('openFolder', infoHash)}>
+            Open folder
+          </span>
           <table>
             ${fileRows}
           </table>
@@ -218,9 +203,7 @@ function TorrentList (state) {
   // 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
-    // Are we even torrenting it?
+    var isDone = false
-    var isSelected = torrentSummary.selections && torrentSummary.selections[index]
-    var isDone = false // Are we finished torrenting it?
     var progress = ''
     if (torrentSummary.progress && torrentSummary.progress.files) {
       var fileProg = torrentSummary.progress.files[index]
@@ -228,69 +211,28 @@ function TorrentList (state) {
       progress = Math.round(100 * fileProg.numPiecesPresent / fileProg.numPieces) + '%'
     }
 
-    // Second, for media files where we saved our position, show how far we got
+    // Second, render the file as a table row
-    var positionElem
-    if (file.currentTime) {
-      // Radial progress bar. 0% = start from 0:00, 270% = 3/4 of the way thru
-      positionElem = 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 rowClass = ''
     var handleClick
-    if (isPlayable) {
+    if (TorrentPlayer.isPlayable(file)) {
       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('openItem', infoHash, index)
+      rowClass = isDone ? '' : 'disabled'
+      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 onclick=${handleClick}>
+      <tr onclick=${handleClick} class='${rowClass}'>
-        <td class='col-icon ${rowClass}'>
+        <td class='col-icon'>
-          ${positionElem}
           <i class='icon'>${icon}</i>
         </td>
-        <td class='col-name ${rowClass}'>
+        <td class='col-name'>${file.name}</td>
-          ${file.name}
+        <td class='col-progress'>${progress}</td>
-        </td>
+        <td class='col-size'>${prettyBytes(file.length)}</td>
-        <td class='col-progress ${rowClass}'>
-          ${isSelected ? progress : ''}
-        </td>
-        <td class='col-size ${rowClass}'>
-          ${prettyBytes(file.length)}
-        </td>
-        <td class='col-select'
-            onclick=${dispatcher('toggleTorrentFile', infoHash, index)}>
-          <i class='icon'>${isSelected ? 'close' : 'add'}</i>
-        </td>
       </tr>
     `
   }
 }
-
-function renderRadialProgressBar (fraction, cssClass) {
-  var rotation = 360 * fraction
-  var transformFill = {transform: 'rotate(' + (rotation / 2) + 'deg)'}
-  var transformFix = {transform: 'rotate(' + rotation + 'deg)'}
-
-  return hx`
-    <div class="radial-progress ${cssClass}">
-      <div class="circle">
-        <div class="mask full" style=${transformFill}>
-          <div class="fill" style=${transformFill}></div>
-        </div>
-        <div class="mask half">
-          <div class="fill" style=${transformFill}></div>
-          <div class="fill fix" style=${transformFix}></div>
-        </div>
-      </div>
-      <div class="inset"></div>
-    </div>
-  `
-}

renderer/views/unsupported-media-modal.js

@@ -1,39 +0,0 @@
-module.exports = UnsupportedMediaModal
-
-var electron = require('electron')
-
-var {dispatch, dispatcher} = require('../lib/dispatcher')
-var hx = require('../lib/hx')
-
-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,9 +1,12 @@
 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')
-var hx = require('../lib/hx')
 
 function UpdateAvailableModal (state) {
   return hx`

renderer/webtorrent.js

@@ -28,13 +28,13 @@ global.WEBTORRENT_ANNOUNCE = defaultAnnounceList
 
 // Connect to the WebTorrent and BitTorrent networks. WebTorrent Desktop is a hybrid
 // client, as explained here: https://webtorrent.io/faq
-var client = new WebTorrent()
+var client = window.client = new WebTorrent()
 
 // WebTorrent-to-HTTP streaming sever
-var server = null
+var server = window.server = null
 
 // Used for diffing, so we only send progress updates when necessary
-var prevProgress = null
+var prevProgress = window.prevProgress = null
 
 init()
 
@@ -42,8 +42,8 @@ function init () {
   client.on('warning', (err) => ipc.send('wt-warning', null, err.message))
   client.on('error', (err) => ipc.send('wt-error', null, err.message))
 
-  ipc.on('wt-start-torrenting', (e, torrentKey, torrentID, path, fileModtimes, selections) =>
+  ipc.on('wt-start-torrenting', (e, torrentKey, torrentID, path, fileModtimes) =>
-    startTorrenting(torrentKey, torrentID, path, fileModtimes, selections))
+    startTorrenting(torrentKey, torrentID, path, fileModtimes))
   ipc.on('wt-stop-torrenting', (e, infoHash) =>
     stopTorrenting(infoHash))
   ipc.on('wt-create-torrent', (e, torrentKey, options) =>
@@ -58,8 +58,6 @@ function init () {
     startServer(infoHash, index))
   ipc.on('wt-stop-server', (e) =>
     stopServer())
-  ipc.on('wt-select-files', (e, infoHash, selections) =>
-    selectFiles(infoHash, selections))
 
   ipc.send('ipcReadyWebTorrent')
 
@@ -68,27 +66,31 @@ function init () {
 
 // Starts a given TorrentID, which can be an infohash, magnet URI, etc. Returns WebTorrent object
 // See https://github.com/feross/webtorrent/blob/master/docs/api.md#clientaddtorrentid-opts-function-ontorrent-torrent-
-function startTorrenting (torrentKey, torrentID, path, fileModtimes, selections) {
+function startTorrenting (torrentKey, torrentID, path, fileModtimes) {
   console.log('starting torrent %s: %s', torrentKey, torrentID)
-
+  var torrent
-  var torrent = client.add(torrentID, {
+  try {
-    path: path,
+    torrent = client.add(torrentID, {
-    fileModtimes: fileModtimes
+      path: path,
-  })
+      fileModtimes: fileModtimes
+    })
+  } catch (err) {
+    return ipc.send('wt-error', torrentKey, err.message)
+  }
+  // If we add a duplicate magnet URI or infohash, WebTorrent returns the
+  // existing torrent object! (If we add a duplicate torrent file, it creates a
+  // new torrent object and raises an error later.) Workaround:
+  if (torrent.key) {
+    return ipc.send('wt-error', torrentKey, 'Can\'t add duplicate torrent')
+  }
   torrent.key = torrentKey
-
-  // Listen for ready event, progress notifications, etc
   addTorrentEvents(torrent)
-
-  // Only download the files the user wants, not necessarily all files
-  torrent.once('ready', () => selectFiles(torrent, selections))
-
   return torrent
 }
 
 function stopTorrenting (infoHash) {
   var torrent = client.get(infoHash)
-  if (torrent) torrent.destroy()
+  torrent.destroy()
 }
 
 // Create a new torrent, start seeding
@@ -157,7 +159,9 @@ function getTorrentFileInfo (file) {
   return {
     name: file.name,
     length: file.length,
-    path: file.path
+    path: file.path,
+    numPiecesPresent: 0,
+    numPieces: null
   }
 }
 
@@ -173,7 +177,7 @@ function saveTorrentFile (torrentKey) {
     }
 
     // Otherwise, save the .torrent file, under the app config folder
-    fs.mkdir(config.TORRENT_PATH, function (_) {
+    fs.mkdir(config.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)
@@ -186,7 +190,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.TORRENT_PATH, infoHash + '.torrent')
+  var torrentPath = path.join(config.CONFIG_TORRENT_PATH, infoHash + '.torrent')
   fs.exists(torrentPath, function (exists) {
     cb(torrentPath, exists)
   })
@@ -199,10 +203,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.POSTER_PATH, function (err) {
+    fs.mkdirp(config.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.POSTER_PATH, posterFileName)
+      var posterFilePath = path.join(config.CONFIG_POSTER_PATH, posterFileName)
       fs.writeFile(posterFilePath, buf, function (err) {
         if (err) return console.log('error saving poster: %o', err)
         // show the poster
@@ -270,7 +274,7 @@ function getTorrentProgress () {
 function startServer (infoHash, index) {
   var torrent = client.get(infoHash)
   if (torrent.ready) startServerFromReadyTorrent(torrent, index)
-  else torrent.once('ready', () => startServerFromReadyTorrent(torrent, index))
+  else torrent.on('ready', () => startServerFromReadyTorrent(torrent, index))
 }
 
 function startServerFromReadyTorrent (torrent, index, cb) {
@@ -308,44 +312,6 @@ function getAudioMetadata (infoHash, index) {
   })
 }
 
-function selectFiles (torrentOrInfoHash, selections) {
-  // Get the torrent object
-  var torrent
-  if (typeof torrentOrInfoHash === 'string') {
-    torrent = client.get(torrentOrInfoHash)
-  } else {
-    torrent = torrentOrInfoHash
-  }
-
-  // Selections not specified?
-  // Load all files. We still need to replace the default whole-torrent
-  // selection with individual selections for each file, so we can
-  // select/deselect files later on
-  if (!selections) {
-    selections = torrent.files.map((x) => true)
-  }
-
-  // Selections specified incorrectly?
-  if (selections.length !== torrent.files.length) {
-    throw new Error('got ' + selections.length + ' file selections, ' +
-      'but the torrent contains ' + torrent.files.length + ' files')
-  }
-
-  // Remove default selection (whole torrent)
-  torrent.deselect(0, torrent.pieces.length - 1, false)
-
-  // Add selections (individual files)
-  for (var i = 0; i < selections.length; i++) {
-    var file = torrent.files[i]
-    if (selections[i]) {
-      file.select()
-    } else {
-      console.log('deselecting file ' + i + ' of torrent ' + torrent.name)
-      file.deselect()
-    }
-  }
-}
-
 // Gets a WebTorrent handle by torrentKey
 // Throws an Error if we're not currently torrenting anything w/ that key
 function getTorrent (torrentKey) {