Misc file moving and cleanup

- Rename JS/CSS for main.html to be consistent (main.js, main.css)
- Add hx.js module to reduce virtual-dom boilerplate
- Move state.js into renderer/lib.js where it belongs
- Rename torrent-list.js -> home.js for consistency
- Rename create-torrent-page.js -> create-torrent.js for consistency
This commit is contained in:
Feross Aboukhadijeh
2016-05-26 17:47:16 -07:00
parent 501a07c386
commit 6e240b3fd4
15 changed files with 48 additions and 63 deletions

View File

@@ -8,6 +8,7 @@ module.exports = {
// () => dispatch(<args>) // () => dispatch(<args>)
// ... this prevents virtual-dom from updating every listener on every update() // ... this prevents virtual-dom from updating every listener on every update()
var _dispatchers = {} var _dispatchers = {}
var _dispatch = () => {} var _dispatch = () => {}
function setDispatch (dispatch) { function setDispatch (dispatch) {
@@ -17,14 +18,18 @@ function setDispatch (dispatch) {
// Get a _memoized event handler that calls dispatch() // Get a _memoized event handler that calls dispatch()
// All args must be JSON-able // All args must be JSON-able
function dispatcher (...args) { function dispatcher (...args) {
var json = JSON.stringify(args) var str = JSON.stringify(args)
var handler = _dispatchers[json] var handler = _dispatchers[str]
if (!handler) { if (!handler) {
handler = _dispatchers[json] = (e) => { handler = _dispatchers[str] = function (e) {
// Don't click on whatever is below the button // Do not propagate click to elements below the button
e.stopPropagation() e.stopPropagation()
// Don't regisiter clicks on disabled buttons
if (e.currentTarget.classList.contains('disabled')) return if (e.currentTarget.classList.contains('disabled')) {
// Do not allow clicks on disabled buttons
return
}
_dispatch.apply(null, args) _dispatch.apply(null, args)
} }
} }

5
renderer/lib/hx.js Normal file
View File

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

View File

@@ -3,8 +3,8 @@ var path = require('path')
var remote = electron.remote var remote = electron.remote
var config = require('../config') var config = require('../../config')
var LocationHistory = require('./lib/location-history') var LocationHistory = require('./location-history')
module.exports = { module.exports = {
getInitialState, getInitialState,

View File

@@ -280,36 +280,36 @@ table {
width: 100%; width: 100%;
} }
.create-torrent-page { .create-torrent {
padding: 10px 25px; padding: 10px 25px;
overflow: hidden; overflow: hidden;
} }
.create-torrent-page .torrent-attribute { .create-torrent .torrent-attribute {
white-space: nowrap; white-space: nowrap;
} }
.create-torrent-page .torrent-attribute>* { .create-torrent .torrent-attribute>* {
display: inline-block; display: inline-block;
} }
.create-torrent-page .torrent-attribute label { .create-torrent .torrent-attribute label {
width: 60px; width: 60px;
margin-right: 10px; margin-right: 10px;
vertical-align: top; vertical-align: top;
} }
.create-torrent-page .torrent-attribute>div { .create-torrent .torrent-attribute>div {
width: calc(100% - 90px); width: calc(100% - 90px);
} }
.create-torrent-page .torrent-attribute div { .create-torrent .torrent-attribute div {
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
} }
.create-torrent-page .torrent-attribute textarea { .create-torrent .torrent-attribute textarea {
width: calc(100% - 80px); width: calc(100% - 80px);
height: 80px; height: 80px;
color: #eee; color: #eee;
@@ -321,11 +321,11 @@ table {
padding: 4px 6px; padding: 4px 6px;
} }
.create-torrent-page textarea.torrent-trackers { .create-torrent textarea.torrent-trackers {
height: 200px; height: 200px;
} }
.create-torrent-page input.torrent-is-private { .create-torrent input.torrent-is-private {
width: initial; width: initial;
margin: 0; margin: 0;
} }

View File

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

View File

@@ -28,7 +28,7 @@ var App = require('./views/app')
var config = require('../config') var config = require('../config')
var errors = require('./lib/errors') var errors = require('./lib/errors')
var sound = require('./lib/sound') var sound = require('./lib/sound')
var State = require('./state') var State = require('./lib/state')
var TorrentPlayer = require('./lib/torrent-player') var TorrentPlayer = require('./lib/torrent-player')
var TorrentSummary = require('./lib/torrent-summary') var TorrentSummary = require('./lib/torrent-summary')

View File

@@ -1,16 +1,15 @@
module.exports = App module.exports = App
var h = require('virtual-dom/h') var hx = require('../lib/hx')
var hyperx = require('hyperx')
var hx = hyperx(h)
var Header = require('./header') var Header = require('./header')
var Views = { var Views = {
'home': require('./torrent-list'), 'home': require('./home'),
'player': require('./player'), 'player': require('./player'),
'create-torrent': require('./create-torrent-page'), 'create-torrent': require('./create-torrent'),
'preferences': require('./preferences') 'preferences': require('./preferences')
} }
var Modals = { var Modals = {
'open-torrent-address-modal': require('./open-torrent-address-modal'), 'open-torrent-address-modal': require('./open-torrent-address-modal'),
'update-available-modal': require('./update-available-modal'), 'update-available-modal': require('./update-available-modal'),

View File

@@ -1,14 +1,11 @@
module.exports = CreateTorrentPage module.exports = CreateTorrentPage
var h = require('virtual-dom/h')
var hyperx = require('hyperx')
var hx = hyperx(h)
var createTorrent = require('create-torrent') var createTorrent = require('create-torrent')
var path = require('path') var path = require('path')
var prettyBytes = require('prettier-bytes') var prettyBytes = require('prettier-bytes')
var {dispatch, dispatcher} = require('../lib/dispatcher') var {dispatch, dispatcher} = require('../lib/dispatcher')
var hx = require('../lib/hx')
function CreateTorrentPage (state) { function CreateTorrentPage (state) {
var info = state.location.current() var info = state.location.current()
@@ -59,7 +56,7 @@ function CreateTorrentPage (state) {
var collapsedClass = info.showAdvanced ? 'expanded' : 'collapsed' var collapsedClass = info.showAdvanced ? 'expanded' : 'collapsed'
return hx` return hx`
<div class='create-torrent-page'> <div class='create-torrent'>
<h2>Create torrent ${defaultName}</h2> <h2>Create torrent ${defaultName}</h2>
<p class="torrent-info"> <p class="torrent-info">
${torrentInfo} ${torrentInfo}
@@ -132,7 +129,7 @@ function CreateTorrentPage (state) {
function CreateTorrentErrorPage () { function CreateTorrentErrorPage () {
return hx` return hx`
<div class='create-torrent-page'> <div class='create-torrent'>
<h2>Create torrent</h2> <h2>Create torrent</h2>
<p class="torrent-info"> <p class="torrent-info">
<p> <p>

View File

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

View File

@@ -1,17 +1,17 @@
module.exports = TorrentList module.exports = TorrentList
var h = require('virtual-dom/h')
var hyperx = require('hyperx')
var hx = hyperx(h)
var prettyBytes = require('prettier-bytes') var prettyBytes = require('prettier-bytes')
var hx = require('../lib/hx')
var TorrentSummary = require('../lib/torrent-summary') var TorrentSummary = require('../lib/torrent-summary')
var TorrentPlayer = require('../lib/torrent-player') var TorrentPlayer = require('../lib/torrent-player')
var {dispatcher} = require('../lib/dispatcher') var {dispatcher} = require('../lib/dispatcher')
function TorrentList (state) { function TorrentList (state) {
var torrentRows = state.saved.torrents.map( var torrentRows = state.saved.torrents.map(
(torrentSummary) => renderTorrent(torrentSummary)) (torrentSummary) => renderTorrent(torrentSummary)
)
return hx` return hx`
<div class='torrent-list'> <div class='torrent-list'>
${torrentRows} ${torrentRows}
@@ -20,11 +20,7 @@ function TorrentList (state) {
</div> </div>
</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) { function renderTorrent (torrentSummary) {
// Get ephemeral data (like progress %) directly from the WebTorrent handle
var infoHash = torrentSummary.infoHash var infoHash = torrentSummary.infoHash
var isSelected = infoHash && state.selectedInfoHash === infoHash var isSelected = infoHash && state.selectedInfoHash === infoHash

View File

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

View File

@@ -1,13 +1,10 @@
module.exports = Player module.exports = Player
var h = require('virtual-dom/h')
var hyperx = require('hyperx')
var hx = hyperx(h)
var Bitfield = require('bitfield') var Bitfield = require('bitfield')
var prettyBytes = require('prettier-bytes') var prettyBytes = require('prettier-bytes')
var zeroFill = require('zero-fill') var zeroFill = require('zero-fill')
var hx = require('../lib/hx')
var TorrentSummary = require('../lib/torrent-summary') var TorrentSummary = require('../lib/torrent-summary')
var {dispatch, dispatcher} = require('../lib/dispatcher') var {dispatch, dispatcher} = require('../lib/dispatcher')

View File

@@ -1,8 +1,6 @@
module.exports = Preferences module.exports = Preferences
var h = require('virtual-dom/h') var hx = require('../lib/hx')
var hyperx = require('hyperx')
var hx = hyperx(h)
var {dispatch} = require('../lib/dispatcher') var {dispatch} = require('../lib/dispatcher')
var remote = require('electron').remote var remote = require('electron').remote

View File

@@ -1,12 +1,9 @@
module.exports = UnsupportedMediaModal module.exports = UnsupportedMediaModal
var h = require('virtual-dom/h')
var hyperx = require('hyperx')
var hx = hyperx(h)
var electron = require('electron') var electron = require('electron')
var {dispatch, dispatcher} = require('../lib/dispatcher') var {dispatch, dispatcher} = require('../lib/dispatcher')
var hx = require('../lib/hx')
function UnsupportedMediaModal (state) { function UnsupportedMediaModal (state) {
var err = state.modal.error var err = state.modal.error

View File

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