diff --git a/app/browser/webtorrent.js b/app/browser/webtorrent.js index 4e8f73e69ac..54fefd3c7bf 100644 --- a/app/browser/webtorrent.js +++ b/app/browser/webtorrent.js @@ -65,7 +65,7 @@ function setupFiltering () { return { responseHeaders: { - 'Location': viewerUrl + 'Location': [ viewerUrl ] }, statusLine: 'HTTP/1.1 301 Moved Permanently', resourceName: 'webtorrent' diff --git a/app/extensions.js b/app/extensions.js index 2e3aecebf81..58d978097da 100644 --- a/app/extensions.js +++ b/app/extensions.js @@ -166,7 +166,7 @@ let generateTorrentManifest = () => { let cspDirectives = { 'default-src': '\'self\'', // TODO(bridiver) - remove example.com when webtorrent no longer requires it - 'connect-src': '\'self\' https://example.com', + 'connect-src': '*', // so .torrent files can be downloaded and displayed 'media-src': '\'self\' http://localhost:*', 'form-action': '\'none\'', 'referrer': 'no-referrer', @@ -178,7 +178,6 @@ let generateTorrentManifest = () => { // allow access to webpack dev server resources let devServer = 'localhost:' + process.env.npm_package_config_port cspDirectives['default-src'] = '\'self\' http://' + devServer - cspDirectives['connect-src'] += ' http://' + devServer + ' ws://' + devServer cspDirectives['media-src'] = '\'self\' http://localhost:* http://' + devServer cspDirectives['frame-src'] = '\'self\' http://' + devServer cspDirectives['style-src'] = '\'self\' \'unsafe-inline\' http://' + devServer diff --git a/app/filtering.js b/app/filtering.js index 90de4440f99..3fa0bb187ff 100644 --- a/app/filtering.js +++ b/app/filtering.js @@ -284,7 +284,6 @@ function registerForBeforeSendHeaders (session, partition) { */ function registerForHeadersReceived (session, partition) { const isPrivate = module.exports.isPrivate(partition) - // Note that onBeforeRedirect listener doesn't take a callback session.webRequest.onHeadersReceived(function (details, cb) { // Using an electron binary which isn't from Brave if (shouldIgnoreUrl(details)) { @@ -303,7 +302,10 @@ function registerForHeadersReceived (session, partition) { continue } if (results.responseHeaders) { - cb({ responseHeaders: results.responseHeaders, statusLine: results.statusLine }) + cb({ + responseHeaders: results.responseHeaders, + statusLine: results.statusLine, + }) return } } diff --git a/js/webtorrent/components/app.js b/js/webtorrent/components/app.js new file mode 100644 index 00000000000..d7f85fc8d08 --- /dev/null +++ b/js/webtorrent/components/app.js @@ -0,0 +1,28 @@ +const React = require('react') + +const MediaViewer = require('./mediaViewer') +const TorrentViewer = require('./torrentViewer') + +class App extends React.Component { + render () { + const {torrent, torrentID, errorMessage, parsedTorrent} = this.props.store + const ix = parsedTorrent && parsedTorrent.ix // Selected file index + let name = parsedTorrent && parsedTorrent.name + if (name) document.title = name + + if (torrent && ix != null) { + return + } else { + return ( + + ) + } + } +} + +module.exports = App diff --git a/js/webtorrent/entry.js b/js/webtorrent/entry.js index 026dd7a9543..04f4c16486f 100644 --- a/js/webtorrent/entry.js +++ b/js/webtorrent/entry.js @@ -7,33 +7,35 @@ const React = require('react') const ReactDOM = require('react-dom') const WebTorrentRemoteClient = require('webtorrent-remote/client') -// React Components -const MediaViewer = require('./components/mediaViewer') -const TorrentViewer = require('./components/torrentViewer') +// React Component +const App = require('./components/app') // Stylesheets require('../../less/webtorrent.less') require('../../node_modules/font-awesome/css/font-awesome.css') -// UI state object. Pure function from `state` -> React element. -const state = { +// UI state object. Pure function from state -> React element. +const store = { torrentID: window.decodeURIComponent(window.location.hash.substring(1)), parsedTorrent: null, client: null, torrent: null, errorMessage: null } -window.state = state /* for easier debugging */ +window.store = store /* for easier debugging */ -state.parsedTorrent = parseTorrent(state.torrentID) +parseTorrent.remote(store.torrentID, function (err, parsedTorrent) { + if (err) return onError(err) + store.parsedTorrent = parsedTorrent +}) // Create the client, set up IPC to the WebTorrentRemoteServer -state.client = new WebTorrentRemoteClient(send) -state.client.on('warning', onWarning) -state.client.on('error', onError) +store.client = new WebTorrentRemoteClient(send) +store.client.on('warning', onWarning) +store.client.on('error', onError) ipc.on(messages.TORRENT_MESSAGE, function (e, msg) { - state.client.receive(msg) + store.client.receive(msg) }) function send (msg) { @@ -42,26 +44,23 @@ function send (msg) { // Clean up the client before the window exits window.addEventListener('beforeunload', function () { - state.client.destroy({delay: 1000}) + store.client.destroy({delay: 1000}) }) // Check whether we're already part of this swarm. If not, show a Start button. -state.client.get(state.torrentID, function (err, torrent) { +store.client.get('' /*store.torrentID*/, function (err, torrent) { if (!err) { - state.torrent = torrent + store.torrent = torrent addTorrentEvents(torrent) } - render() -}) -// Page starts blank, once you call render() it shows a continuously updating torrent UI -function render () { + // Page starts blank. This shows a continuously updating torrent UI update() setInterval(update, 1000) -} +}) function update () { - const elem = + const elem = ReactDOM.render(elem, document.querySelector('#appContainer')) } @@ -75,28 +74,28 @@ function onWarning (err) { } function onError (err) { - state.errorMessage = err.message + store.errorMessage = err.message } function start () { - state.client.add(state.torrentID, onAdded, {server: {}}) + store.client.add(store.torrentID, onAdded, {server: {}}) } function onAdded (err, torrent) { if (err) { - state.errorMessage = err.message + store.errorMessage = err.message return console.error(err) } - state.torrent = torrent + store.torrent = torrent addTorrentEvents(torrent) update() } function saveTorrentFile () { - let parsedTorrent = parseTorrent(state.torrentID) + let parsedTorrent = parseTorrent(store.torrentID) let torrentFile = parseTorrent.toTorrentFile(parsedTorrent) - let torrentFileName = state.parsedTorrent.name + '.torrent' + let torrentFileName = parsedTorrent.name + '.torrent' let torrentFileBlobURL = URL.createObjectURL( new Blob([torrentFile], { type: 'application/x-bittorrent' } @@ -109,40 +108,13 @@ function saveTorrentFile () { a.click() } -class App extends React.Component { - constructor () { - super() - this.dispatch = this.dispatch.bind(this) - } - - dispatch (action) { - switch (action) { - case 'start': - return start() - case 'saveTorrentFile': - return saveTorrentFile() - default: - console.error('Ignoring unknown dispatch type: ' + JSON.stringify(action)) - } - } - - render () { - const {torrent, torrentID, errorMessage, parsedTorrent} = state - const ix = parsedTorrent && parsedTorrent.ix // Selected file index - let name = parsedTorrent && parsedTorrent.name - if (name) document.title = name - - if (state.torrent && ix != null) { - return - } else { - return ( - - ) - } +function dispatch (action) { + switch (action) { + case 'start': + return start() + case 'saveTorrentFile': + return saveTorrentFile() + default: + console.error('Ignoring unknown dispatch type: ' + JSON.stringify(action)) } } diff --git a/package.json b/package.json index 386c6eaf10a..478baa82e44 100644 --- a/package.json +++ b/package.json @@ -162,7 +162,6 @@ "muon-winstaller": "^2.5.4", "ncp": "^2.0.0", "node-gyp": "^3.2.1", - "node-libs-browser": "^1.0.0", "node-static": "^0.7.7", "node-uuid": "^1.4.7", "nsp": "^2.2.0", @@ -176,7 +175,7 @@ "style-loader": "^0.13.0", "uglify-js": "https://github.com/mishoo/UglifyJS2#harmony", "webdriverio": "4.2.5", - "webpack": "^1.12.9", + "webpack": "https://github.com/feross/webpack#webpack-1", "webpack-dev-server": "^1.14.0", "webpack-notifier": "^1.2.1", "xml2js": "^0.4.15"