kalugin66/webtorrent-desktop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Style: no more var

Browse Source
This commit is contained in:
DC
2016-08-31 14:36:11 -07:00
parent 0bda5358bd
commit 3f6cc97a02
54 changed files with 676 additions and 679 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
src/renderer/pages/App.js
View File

@@ -33,21 +33,21 @@ darkBaseTheme.palette.accent3Color = colors.redA100
class App extends React.Component {
render () {
var state = this.props.state
const state = this.props.state
// Hide player controls while playing video, if the mouse stays still for a while
// Never hide the controls when:
// * The mouse is over the controls or we're scrubbing (see CSS)
// * The video is paused
// * The video is playing remotely on Chromecast or Airplay
var hideControls = state.location.url() === 'player' &&
const hideControls = state.location.url() === 'player' &&
state.playing.mouseStationarySince !== 0 &&
new Date().getTime() - state.playing.mouseStationarySince > 2000 &&
!state.playing.isPaused &&
state.playing.location === 'local' &&
state.playing.playbackRate === 1
var cls = [
const cls = [
'view-' + state.location.url(), /* e.g. view-home, view-player */
'is-' + process.platform /* e.g. is-darwin, is-win32, is-linux */
]
@@ -55,7 +55,7 @@ class App extends React.Component {
if (state.window.isFocused) cls.push('is-focused')
if (hideControls) cls.push('hide-video-controls')
var vdom = (
const vdom = (
<MuiThemeProvider muiTheme={getMuiTheme(darkBaseTheme)}>
<div className={'app ' + cls.join(' ')}>
<Header state={state} />
@@ -70,12 +70,12 @@ class App extends React.Component {
}
getErrorPopover () {
var state = this.props.state
var now = new Date().getTime()
var recentErrors = state.errors.filter((x) => now - x.time < 5000)
var hasErrors = recentErrors.length > 0
const state = this.props.state
const now = new Date().getTime()
const recentErrors = state.errors.filter((x) => now - x.time < 5000)
const hasErrors = recentErrors.length > 0
var errorElems = recentErrors.map(function (error, i) {
const errorElems = recentErrors.map(function (error, i) {
return (<div key={i} className='error'>{error.message}</div>)
})
return (
@@ -88,9 +88,9 @@ class App extends React.Component {
}
getModal () {
var state = this.props.state
const state = this.props.state
if (!state.modal) return
var ModalContents = Modals[state.modal.id]
const ModalContents = Modals[state.modal.id]
return (
<div key='modal' className='modal'>
<div key='modal-background' className='modal-background' />
@@ -102,8 +102,8 @@ class App extends React.Component {
}
getView () {
var state = this.props.state
var View = Views[state.location.url()]
const state = this.props.state
const View = Views[state.location.url()]
return (<View state={state} />)
}
}

41
src/renderer/pages/create-torrent-page.js
View File

@@ -20,11 +20,11 @@ class CreateTorrentPage extends React.Component {
constructor (props) {
super(props)
var state = this.props.state
var info = state.location.current()
const state = this.props.state
const info = state.location.current()
// First, extract the base folder that the files are all in
var pathPrefix = info.folderPath
let pathPrefix = info.folderPath
if (!pathPrefix) {
pathPrefix = info.files.map((x) => x.path).reduce(findCommonPrefix)
if (!pathPrefix.endsWith('/') && !pathPrefix.endsWith('\\')) {
@@ -33,14 +33,14 @@ class CreateTorrentPage extends React.Component {
}
// Then, exclude .DS_Store and other dotfiles
var files = info.files
const files = info.files
.filter((f) => !containsDots(f.path, pathPrefix))
.map((f) => ({name: f.name, path: f.path, size: f.size}))
if (files.length === 0) return (<CreateTorrentErrorPage state={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
let defaultName, basePath
if (files.length === 1) {
// Single file torrent: /a/b/foo.jpg -> torrent name 'foo.jpg', path '/a/b'
defaultName = files[0].name
@@ -52,7 +52,7 @@ class CreateTorrentPage extends React.Component {
}
// Default trackers
var trackers = createTorrent.announceList.join('\n')
const trackers = createTorrent.announceList.join('\n')
this.state = {
comment: '',
@@ -72,14 +72,14 @@ class CreateTorrentPage extends React.Component {
}
render () {
var files = this.state.files
const files = this.state.files
// Sanity check: show the number of files and total size
var numFiles = files.length
var totalBytes = files
const numFiles = files.length
const totalBytes = files
.map((f) => f.size)
.reduce((a, b) => a + b, 0)
var torrentInfo = `${numFiles} files, ${prettyBytes(totalBytes)}`
const torrentInfo = `${numFiles} files, ${prettyBytes(totalBytes)}`
return (
<div className='create-torrent'>
@@ -119,10 +119,10 @@ class CreateTorrentPage extends React.Component {
// * Comment
renderAdvanced () {
// Create file list
var maxFileElems = 100
var files = this.state.files
var fileElems = files.slice(0, maxFileElems).map((file, i) => {
var relativePath = path.relative(this.state.pathPrefix, file.path)
const maxFileElems = 100
const files = this.state.files
const fileElems = files.slice(0, maxFileElems).map((file, i) => {
const relativePath = path.relative(this.state.pathPrefix, file.path)
return (<div key={i}>{relativePath}</div>)
})
if (files.length > maxFileElems) {
@@ -130,8 +130,8 @@ class CreateTorrentPage extends React.Component {
}
// Align the text fields
var textFieldStyle = { width: '' }
var textareaStyle = { margin: 0 }
const textFieldStyle = { width: '' }
const textareaStyle = { margin: 0 }
return (
<div key='advanced' className='create-torrent-advanced'>
@@ -178,11 +178,11 @@ class CreateTorrentPage extends React.Component {
}
function handleSubmit () {
var announceList = this.state.trackers
const announceList = this.state.trackers
.split('\n')
.map((s) => s.trim())
.filter((s) => s !== '')
var options = {
const options = {
// We can't let the user choose their own name if we want WebTorrent
// to use the files in place rather than creating a new folder.
name: this.state.defaultName,
@@ -197,7 +197,8 @@ function handleSubmit () {
// Finds the longest common prefix
function findCommonPrefix (a, b) {
for (var i = 0; i < a.length && i < b.length; i++) {
let i
for (i = 0; i < a.length && i < b.length; i++) {
if (a.charCodeAt(i) !== b.charCodeAt(i)) break
}
if (i === a.length) return a
@@ -206,7 +207,7 @@ function findCommonPrefix (a, b) {
}
function containsDots (path, pathPrefix) {
var suffix = path.substring(pathPrefix.length).replace(/\\/g, '/')
const suffix = path.substring(pathPrefix.length).replace(/\\/g, '/')
return ('/' + suffix).includes('/.')
}

174
src/renderer/pages/player-page.js
View File

@@ -13,9 +13,9 @@ module.exports = class Player extends React.Component {
render () {
// Show the video as large as will fit in the window, play immediately
// If the video is on Chromecast or Airplay, show a title screen instead
var state = this.props.state
var showVideo = state.playing.location === 'local'
var showControls = state.playing.location !== 'external'
const state = this.props.state
const showVideo = state.playing.location === 'local'
const showControls = state.playing.location !== 'external'
return (
<div
className='player'
@@ -39,7 +39,7 @@ function renderMedia (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)
const mediaElement = document.querySelector(state.playing.type)
if (mediaElement !== null) {
if (state.playing.isPaused && !mediaElement.paused) {
mediaElement.pause()
@@ -67,20 +67,20 @@ function renderMedia (state) {
}
// Switch to the newly added subtitle track, if available
var tracks = mediaElement.textTracks || []
for (var j = 0; j < tracks.length; j++) {
var isSelectedTrack = j === state.playing.subtitles.selectedIndex
const tracks = mediaElement.textTracks || []
for (let j = 0; j < tracks.length; j++) {
const isSelectedTrack = j === state.playing.subtitles.selectedIndex
tracks[j].mode = isSelectedTrack ? 'showing' : 'hidden'
}
// Save video position
var file = state.getPlayingFileSummary()
const file = state.getPlayingFileSummary()
file.currentTime = state.playing.currentTime = mediaElement.currentTime
file.duration = state.playing.duration = mediaElement.duration
// Save selected subtitle
if (state.playing.subtitles.selectedIndex !== -1) {
var index = state.playing.subtitles.selectedIndex
const index = state.playing.subtitles.selectedIndex
file.selectedSubtitle = state.playing.subtitles.tracks[index].filePath
} else if (file.selectedSubtitle != null) {
delete file.selectedSubtitle
@@ -90,11 +90,11 @@ function renderMedia (state) {
}
// Add subtitles to the <video> tag
var trackTags = []
const trackTags = []
if (state.playing.subtitles.selectedIndex >= 0) {
for (var i = 0; i < state.playing.subtitles.tracks.length; i++) {
var track = state.playing.subtitles.tracks[i]
var isSelected = state.playing.subtitles.selectedIndex === i
for (let i = 0; i < state.playing.subtitles.tracks.length; i++) {
const track = state.playing.subtitles.tracks[i]
const isSelected = state.playing.subtitles.selectedIndex === i
trackTags.push(
<track
key={i}
@@ -107,8 +107,8 @@ function renderMedia (state) {
}
// Create the <audio> or <video> tag
var MediaTagName = state.playing.type
var mediaTag = (
const MediaTagName = state.playing.type
const mediaTag = (
<MediaTagName
src={Playlist.getCurrentLocalURL(state)}
onDoubleClick={dispatcher('toggleFullScreen')}
@@ -137,8 +137,8 @@ function renderMedia (state) {
// As soon as we know the video dimensions, resize the window
function onLoadedMetadata (e) {
if (state.playing.type !== 'video') return
var video = e.target
var dimensions = {
const video = e.target
const dimensions = {
width: video.videoWidth,
height: video.videoHeight
}
@@ -155,7 +155,7 @@ function renderMedia (state) {
}
function onCanPlay (e) {
var elem = e.target
const elem = e.target
if (state.playing.type === 'video' &&
elem.webkitVideoDecodedByteCount === 0) {
dispatch('mediaError', 'Video codec unsupported')
@@ -169,15 +169,15 @@ function renderMedia (state) {
}
function renderOverlay (state) {
var elems = []
var audioMetadataElem = renderAudioMetadata(state)
var spinnerElem = renderLoadingSpinner(state)
const elems = []
const audioMetadataElem = renderAudioMetadata(state)
const spinnerElem = renderLoadingSpinner(state)
if (audioMetadataElem) elems.push(audioMetadataElem)
if (spinnerElem) elems.push(spinnerElem)
// Video fills the window, centered with black bars if necessary
// Audio gets a static poster image and a summary of the file metadata.
var style
let style
if (state.playing.type === 'audio') {
style = { backgroundImage: cssBackgroundImagePoster(state) }
} else if (elems.length !== 0) {
@@ -195,27 +195,27 @@ function renderOverlay (state) {
}
function renderAudioMetadata (state) {
var fileSummary = state.getPlayingFileSummary()
const fileSummary = state.getPlayingFileSummary()
if (!fileSummary.audioInfo) return
var info = fileSummary.audioInfo
const info = fileSummary.audioInfo
// Get audio track info
var title = info.title
let title = info.title
if (!title) {
title = fileSummary.name
}
var artist = info.artist && info.artist[0]
var album = info.album
let artist = info.artist && info.artist[0]
let album = info.album
if (album && info.year && !album.includes(info.year)) {
album += ' (' + info.year + ')'
}
var track
let track
if (info.track && info.track.no && info.track.of) {
track = info.track.no + ' of ' + info.track.of
}
// Show a small info box in the middle of the screen with title/album/etc
var elems = []
const elems = []
if (artist) {
elems.push((
<div key='artist' className='audio-artist'>
@@ -239,7 +239,7 @@ function renderAudioMetadata (state) {
}
// Align the title with the other info, if available. Otherwise, center title
var emptyLabel = (<label />)
const emptyLabel = (<label />)
elems.unshift((
<div key='title' className='audio-title'>
{elems.length ? emptyLabel : undefined}{title}
@@ -251,14 +251,14 @@ function renderAudioMetadata (state) {
function renderLoadingSpinner (state) {
if (state.playing.isPaused) return
var isProbablyStalled = state.playing.isStalled ||
const isProbablyStalled = state.playing.isStalled ||
(new Date().getTime() - state.playing.lastTimeUpdate > 2000)
if (!isProbablyStalled) return
var prog = state.getPlayingTorrentSummary().progress || {}
var fileProgress = 0
const prog = state.getPlayingTorrentSummary().progress || {}
let fileProgress = 0
if (prog.files) {
var file = prog.files[state.playing.fileIndex]
const file = prog.files[state.playing.fileIndex]
fileProgress = Math.floor(100 * file.numPiecesPresent / file.numPieces)
}
@@ -275,7 +275,7 @@ function renderLoadingSpinner (state) {
}
function renderCastScreen (state) {
var castIcon, castType, isCast
let castIcon, castType, isCast
if (state.playing.location.startsWith('chromecast')) {
castIcon = 'cast_connected'
castType = 'Chromecast'
@@ -290,8 +290,8 @@ function renderCastScreen (state) {
isCast = true
} else if (state.playing.location === 'external') {
// TODO: get the player name in a more reliable way
var playerPath = state.saved.prefs.externalPlayerPath
var playerName = playerPath ? path.basename(playerPath).split('.')[0] : 'VLC'
const playerPath = state.saved.prefs.externalPlayerPath
const playerName = playerPath ? path.basename(playerPath).split('.')[0] : 'VLC'
castIcon = 'tv'
castType = playerName
isCast = false
@@ -301,15 +301,15 @@ function renderCastScreen (state) {
isCast = false
}
var isStarting = state.playing.location.endsWith('-pending')
var castName = state.playing.castName
var castStatus
const isStarting = state.playing.location.endsWith('-pending')
const castName = state.playing.castName
let castStatus
if (isCast && isStarting) castStatus = 'Connecting to ' + castName + '...'
else if (isCast && !isStarting) castStatus = 'Connected to ' + castName
else castStatus = ''
// Show a nice title image, if possible
var style = {
const style = {
backgroundImage: cssBackgroundImagePoster(state)
}
@@ -327,12 +327,12 @@ function renderCastScreen (state) {
function renderCastOptions (state) {
if (!state.devices.castMenu) return
var {location, devices} = state.devices.castMenu
var player = state.devices[location]
const {location, devices} = state.devices.castMenu
const player = state.devices[location]
var items = devices.map(function (device, ix) {
var isSelected = player.device === device
var name = device.name
const items = devices.map(function (device, ix) {
const isSelected = player.device === device
const name = device.name
return (
<li key={ix} onClick={dispatcher('selectCastDevice', ix)}>
<i className='icon'>{isSelected ? 'radio_button_checked' : 'radio_button_unchecked'}</i>
@@ -349,11 +349,11 @@ function renderCastOptions (state) {
}
function renderSubtitleOptions (state) {
var subtitles = state.playing.subtitles
const subtitles = state.playing.subtitles
if (!subtitles.tracks.length || !subtitles.showMenu) return
var items = subtitles.tracks.map(function (track, ix) {
var isSelected = state.playing.subtitles.selectedIndex === ix
const items = subtitles.tracks.map(function (track, ix) {
const isSelected = state.playing.subtitles.selectedIndex === ix
return (
<li key={ix} onClick={dispatcher('selectSubtitle', ix)}>
<i className='icon'>{'radio_button_' + (isSelected ? 'checked' : 'unchecked')}</i>
@@ -362,8 +362,8 @@ function renderSubtitleOptions (state) {
)
})
var noneSelected = state.playing.subtitles.selectedIndex === -1
var noneClass = 'radio_button_' + (noneSelected ? 'checked' : 'unchecked')
const noneSelected = state.playing.subtitles.selectedIndex === -1
const noneClass = 'radio_button_' + (noneSelected ? 'checked' : 'unchecked')
return (
<ul key='subtitle-options' className='options-list'>
{items}
@@ -376,17 +376,17 @@ function renderSubtitleOptions (state) {
}
function renderPlayerControls (state) {
var positionPercent = 100 * state.playing.currentTime / state.playing.duration
var playbackCursorStyle = { left: 'calc(' + positionPercent + '% - 3px)' }
var captionsClass = state.playing.subtitles.tracks.length === 0
const positionPercent = 100 * state.playing.currentTime / state.playing.duration
const playbackCursorStyle = { left: 'calc(' + positionPercent + '% - 3px)' }
const captionsClass = state.playing.subtitles.tracks.length === 0
? 'disabled'
: state.playing.subtitles.selectedIndex >= 0
? 'active'
: ''
var prevClass = Playlist.hasPrevious(state) ? '' : 'disabled'
var nextClass = Playlist.hasNext(state) ? '' : 'disabled'
const prevClass = Playlist.hasPrevious(state) ? '' : 'disabled'
const nextClass = Playlist.hasNext(state) ? '' : 'disabled'
var elements = [
const elements = [
<div key='playback-bar' className='playback-bar'>
{renderLoadingBar(state)}
<div
@@ -444,24 +444,24 @@ function renderPlayerControls (state) {
}
// If we've detected a Chromecast or AppleTV, the user can play video there
var castTypes = ['chromecast', 'airplay', 'dlna']
var isCastingAnywhere = castTypes.some(
const castTypes = ['chromecast', 'airplay', 'dlna']
const isCastingAnywhere = castTypes.some(
(castType) => state.playing.location.startsWith(castType))
// Add the cast buttons. Icons for each cast type, connected/disconnected:
var buttonIcons = {
const buttonIcons = {
'chromecast': {true: 'cast_connected', false: 'cast'},
'airplay': {true: 'airplay', false: 'airplay'},
'dlna': {true: 'tv', false: 'tv'}
}
castTypes.forEach(function (castType) {
// Do we show this button (eg. the Chromecast button) at all?
var isCasting = state.playing.location.startsWith(castType)
var player = state.devices[castType]
const isCasting = state.playing.location.startsWith(castType)
const player = state.devices[castType]
if ((!player || player.getDevices().length === 0) && !isCasting) return
// Show the button. Three options for eg the Chromecast button:
var buttonClass, buttonHandler
let buttonClass, buttonHandler
if (isCasting) {
// Option 1: we are currently connected to Chromecast. Button stops the cast.
buttonClass = 'active'
@@ -475,7 +475,7 @@ function renderPlayerControls (state) {
buttonClass = ''
buttonHandler = dispatcher('toggleCastMenu', castType)
}
var buttonIcon = buttonIcons[castType][isCasting]
const buttonIcon = buttonIcons[castType][isCasting]
elements.push((
<i
@@ -488,13 +488,13 @@ function renderPlayerControls (state) {
})
// Render volume slider
var volume = state.playing.volume
var volumeIcon = 'volume_' + (
const volume = state.playing.volume
const volumeIcon = 'volume_' + (
volume === 0 ? 'off'
: volume < 0.3 ? 'mute'
: volume < 0.6 ? 'down'
: 'up')
var volumeStyle = {
const volumeStyle = {
background: '-webkit-gradient(linear, left top, right top, ' +
'color-stop(' + (volume * 100) + '%, #eee), ' +
'color-stop(' + (volume * 100) + '%, #727272))'
@@ -519,8 +519,8 @@ function renderPlayerControls (state) {
))
// Show video playback progress
var currentTimeStr = formatTime(state.playing.currentTime)
var durationStr = formatTime(state.playing.duration)
const currentTimeStr = formatTime(state.playing.currentTime)
const durationStr = formatTime(state.playing.duration)
elements.push((
<span key='time' className='time float-left'>
{currentTimeStr} / {durationStr}
@@ -547,7 +547,7 @@ function renderPlayerControls (state) {
function handleDragStart (e) {
// Prevent the cursor from changing, eg to a green + icon on Mac
if (e.dataTransfer) {
var dt = e.dataTransfer
const dt = e.dataTransfer
dt.effectAllowed = 'none'
}
}
@@ -556,9 +556,9 @@ function renderPlayerControls (state) {
function handleScrub (e) {
if (!e.clientX) return
dispatch('mediaMouseMoved')
var windowWidth = document.querySelector('body').clientWidth
var fraction = e.clientX / windowWidth
var position = fraction * state.playing.duration /* seconds */
const windowWidth = document.querySelector('body').clientWidth
const fraction = e.clientX / windowWidth
const position = fraction * state.playing.duration /* seconds */
dispatch('skipTo', position)
}
@@ -589,18 +589,18 @@ function renderPlayerControls (state) {
// 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()
const torrentSummary = state.getPlayingTorrentSummary()
if (!torrentSummary.progress) {
return []
}
// Find all contiguous parts of the torrent which are loaded
var prog = torrentSummary.progress
var fileProg = prog.files[state.playing.fileIndex]
var parts = []
var lastPiecePresent = false
for (var i = fileProg.startPiece; i <= fileProg.endPiece; i++) {
var partPresent = Bitfield.prototype.get.call(prog.bitfield, i)
const prog = torrentSummary.progress
const fileProg = prog.files[state.playing.fileIndex]
const parts = []
let lastPiecePresent = false
for (let i = fileProg.startPiece; i <= fileProg.endPiece; i++) {
const partPresent = Bitfield.prototype.get.call(prog.bitfield, i)
if (partPresent && !lastPiecePresent) {
parts.push({start: i - fileProg.startPiece, count: 1})
} else if (partPresent) {
@@ -610,8 +610,8 @@ function renderLoadingBar (state) {
}
// Output some bars to show which parts of the file are loaded
var loadingBarElems = parts.map(function (part, i) {
var style = {
const loadingBarElems = parts.map(function (part, i) {
const style = {
left: (100 * part.start / fileProg.numPieces) + '%',
width: (100 * part.count / fileProg.numPieces) + '%'
}
@@ -623,8 +623,8 @@ function renderLoadingBar (state) {
// Returns the CSS background-image string for a poster image + dark vignette
function cssBackgroundImagePoster (state) {
var torrentSummary = state.getPlayingTorrentSummary()
var posterPath = TorrentSummary.getPosterPath(torrentSummary)
const torrentSummary = state.getPlayingTorrentSummary()
const posterPath = TorrentSummary.getPosterPath(torrentSummary)
if (!posterPath) return ''
return cssBackgroundImageDarkGradient() + `, url('${posterPath}')`
}
@@ -639,12 +639,12 @@ function formatTime (time) {
return '0:00'
}
var hours = Math.floor(time / 3600)
var minutes = Math.floor(time % 3600 / 60)
let hours = Math.floor(time / 3600)
let minutes = Math.floor(time % 3600 / 60)
if (hours > 0) {
minutes = zeroFill(2, minutes)
}
var seconds = zeroFill(2, Math.floor(time % 60))
let seconds = zeroFill(2, Math.floor(time % 60))
return (hours > 0 ? hours + ':' : '') + minutes + ':' + seconds
}

8
src/renderer/pages/preferences-page.js
View File

@@ -93,7 +93,7 @@ class PreferencesPage extends React.Component {
}
setDefaultAppButton () {
var isFileHandler = this.props.state.unsaved.prefs.isFileHandler
const isFileHandler = this.props.state.unsaved.prefs.isFileHandler
if (isFileHandler) {
return (
<Preference>
@@ -117,7 +117,7 @@ class PreferencesPage extends React.Component {
}
render () {
var style = {
const style = {
color: colors.grey400,
marginLeft: 25,
marginRight: 25
@@ -147,7 +147,7 @@ class PreferencesSection extends React.Component {
}
render () {
var style = {
const style = {
marginBottom: 25,
marginTop: 25
}
@@ -162,7 +162,7 @@ class PreferencesSection extends React.Component {
class Preference extends React.Component {
render () {
var style = { marginBottom: 10 }
const style = { marginBottom: 10 }
return (<div style={style}>{this.props.children}</div>)
}
}

106
src/renderer/pages/torrent-list-page.js
View File

@@ -7,9 +7,9 @@ const {dispatcher} = require('../lib/dispatcher')
module.exports = class TorrentList extends React.Component {
render () {
var state = this.props.state
const state = this.props.state
var contents = []
const contents = []
if (state.downloadPathStatus === 'missing') {
contents.push(
<div key='torrent-missing-path'>
@@ -21,7 +21,7 @@ module.exports = class TorrentList extends React.Component {
</div>
)
}
var torrentElems = state.saved.torrents.map(
const torrentElems = state.saved.torrents.map(
(torrentSummary) => this.renderTorrent(torrentSummary)
)
contents.push(...torrentElems)
@@ -39,23 +39,23 @@ module.exports = class TorrentList extends React.Component {
}
renderTorrent (torrentSummary) {
var state = this.props.state
var infoHash = torrentSummary.infoHash
var isSelected = infoHash && state.selectedInfoHash === infoHash
const state = this.props.state
const infoHash = torrentSummary.infoHash
const isSelected = infoHash && state.selectedInfoHash === infoHash
// Background image: show some nice visuals, like a frame from the movie, if possible
var style = {}
const style = {}
if (torrentSummary.posterFileName) {
var gradient = isSelected
const gradient = isSelected
? 'linear-gradient(to bottom, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.4) 100%)'
: 'linear-gradient(to bottom, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 100%)'
var posterPath = TorrentSummary.getPosterPath(torrentSummary)
const posterPath = TorrentSummary.getPosterPath(torrentSummary)
style.backgroundImage = gradient + `, url('${posterPath}')`
}
// Foreground: name of the torrent, basic info like size, play button,
// cast buttons if available, and delete
var classes = ['torrent']
const classes = ['torrent']
// playStatus turns the play button into a loading spinner or error icon
if (torrentSummary.playStatus) classes.push(torrentSummary.playStatus)
if (isSelected) classes.push('selected')
@@ -77,13 +77,13 @@ module.exports = class TorrentList extends React.Component {
// Show name, download status, % complete
renderTorrentMetadata (torrentSummary) {
var name = torrentSummary.name || 'Loading torrent...'
var elements = [(
const name = torrentSummary.name || 'Loading torrent...'
const elements = [(
<div key='name' className='name ellipsis'>{name}</div>
)]
// If it's downloading/seeding then show progress info
var prog = torrentSummary.progress
const prog = torrentSummary.progress
if (torrentSummary.error) {
elements.push(
<div key='progress-info' className='ellipsis'>
@@ -107,18 +107,18 @@ module.exports = class TorrentList extends React.Component {
return (<div key='metadata' className='metadata'>{elements}</div>)
function renderProgressBar () {
var progress = Math.floor(100 * prog.progress)
const progress = Math.floor(100 * prog.progress)
return (<progress value={progress} max='100'>{progress}%</progress>)
}
function renderPercentProgress () {
var progress = Math.floor(100 * prog.progress)
const progress = Math.floor(100 * prog.progress)
return (<span key='percent-progress'>{progress}%</span>)
}
function renderTotalProgress () {
var downloaded = prettyBytes(prog.downloaded)
var total = prettyBytes(prog.length || 0)
const downloaded = prettyBytes(prog.downloaded)
const total = prettyBytes(prog.length || 0)
if (downloaded === total) {
return (<span key='total-progress'>{downloaded}</span>)
} else {
@@ -128,7 +128,7 @@ module.exports = class TorrentList extends React.Component {
function renderPeers () {
if (prog.numPeers === 0) return
var count = prog.numPeers === 1 ? 'peer' : 'peers'
const count = prog.numPeers === 1 ? 'peer' : 'peers'
return (<span key='peers'>{prog.numPeers} {count}</span>)
}
@@ -143,22 +143,22 @@ module.exports = class TorrentList extends React.Component {
}
function renderEta () {
var downloaded = prog.downloaded
var total = prog.length || 0
var missing = total - downloaded
var downloadSpeed = prog.downloadSpeed
const downloaded = prog.downloaded
const total = prog.length || 0
const missing = total - downloaded
const downloadSpeed = prog.downloadSpeed
if (downloadSpeed === 0 || missing === 0) return
var rawEta = missing / downloadSpeed
var hours = Math.floor(rawEta / 3600) % 24
var minutes = Math.floor(rawEta / 60) % 60
var seconds = Math.floor(rawEta % 60)
const rawEta = missing / downloadSpeed
const hours = Math.floor(rawEta / 3600) % 24
const minutes = Math.floor(rawEta / 60) % 60
const seconds = Math.floor(rawEta % 60)
// Only display hours and minutes if they are greater than 0 but always
// display minutes if hours is being displayed
var hoursStr = hours ? hours + 'h' : ''
var minutesStr = (hours || minutes) ? minutes + 'm' : ''
var secondsStr = seconds + 's'
const hoursStr = hours ? hours + 'h' : ''
const minutesStr = (hours || minutes) ? minutes + 'm' : ''
const secondsStr = seconds + 's'
return (<span>ETA: {hoursStr} {minutesStr} {secondsStr}</span>)
}
@@ -167,9 +167,9 @@ module.exports = class TorrentList extends React.Component {
// Download button toggles between torrenting (DL/seed) and paused
// Play button starts streaming the torrent immediately, unpausing if needed
renderTorrentButtons (torrentSummary) {
var infoHash = torrentSummary.infoHash
const infoHash = torrentSummary.infoHash
var playIcon, playTooltip, playClass
let playIcon, playTooltip, playClass
if (torrentSummary.playStatus === 'timeout') {
playIcon = 'warning'
playTooltip = 'Playback timed out. No seeds? No internet? Click to try again.'
@@ -178,7 +178,7 @@ module.exports = class TorrentList extends React.Component {
playTooltip = 'Start streaming'
}
var downloadIcon, downloadTooltip
let downloadIcon, downloadTooltip
if (torrentSummary.status === 'seeding') {
downloadIcon = 'file_upload'
downloadTooltip = 'Seeding. Click to stop.'
@@ -191,7 +191,7 @@ module.exports = class TorrentList extends React.Component {
}
// Only show the play/dowload buttons for torrents that contain playable media
var playButton, downloadButton, positionElem
let playButton, downloadButton, positionElem
if (!torrentSummary.error) {
downloadButton = (
<i
@@ -205,11 +205,11 @@ module.exports = class TorrentList extends React.Component {
// 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 willShowSpinner = torrentSummary.playStatus === 'requested'
var mostRecentFile = torrentSummary.files &&
const willShowSpinner = torrentSummary.playStatus === 'requested'
const mostRecentFile = torrentSummary.files &&
torrentSummary.files[torrentSummary.mostRecentFileIndex]
if (mostRecentFile && mostRecentFile.currentTime && !willShowSpinner) {
var fraction = mostRecentFile.currentTime / mostRecentFile.duration
const fraction = mostRecentFile.currentTime / mostRecentFile.duration
positionElem = this.renderRadialProgressBar(fraction, 'radial-progress-large')
playClass = 'resume-position'
}
@@ -245,9 +245,9 @@ module.exports = class TorrentList extends React.Component {
// Show files, per-file download status and play buttons, and so on
renderTorrentDetails (torrentSummary) {
var filesElement
let filesElement
if (torrentSummary.error || !torrentSummary.files) {
var message = ''
let message = ''
if (torrentSummary.error === 'path-missing') {
// Special case error: this torrent's download dir or file is missing
message = 'Missing path: ' + TorrentSummary.getFileOrFolder(torrentSummary)
@@ -268,7 +268,7 @@ module.exports = class TorrentList extends React.Component {
)
} else {
// We do know the files. List them and show download stats for each one
var fileRows = torrentSummary.files
const fileRows = torrentSummary.files
.filter((file) => !file.path.includes('/.____padding_file/'))
.map((file, index) => ({ file, index }))
.map((object) => this.renderFileRow(torrentSummary, object.file, object.index))
@@ -295,28 +295,28 @@ module.exports = class TorrentList extends React.Component {
renderFileRow (torrentSummary, file, index) {
// First, find out how much of the file we've downloaded
// Are we even torrenting it?
var isSelected = torrentSummary.selections && torrentSummary.selections[index]
var isDone = false // Are we finished torrenting it?
var progress = ''
const isSelected = torrentSummary.selections && torrentSummary.selections[index]
let isDone = false // Are we finished torrenting it?
let progress = ''
if (torrentSummary.progress && torrentSummary.progress.files &&
torrentSummary.progress.files[index]) {
var fileProg = torrentSummary.progress.files[index]
const fileProg = torrentSummary.progress.files[index]
isDone = fileProg.numPiecesPresent === fileProg.numPieces
progress = Math.round(100 * fileProg.numPiecesPresent / fileProg.numPieces) + '%'
}
// Second, for media files where we saved our position, show how far we got
var positionElem
let positionElem
if (file.currentTime) {
// Radial progress bar. 0% = start from 0:00, 270% = 3/4 of the way thru
positionElem = this.renderRadialProgressBar(file.currentTime / file.duration)
}
// Finally, render the file as a table row
var isPlayable = TorrentPlayer.isPlayable(file)
var infoHash = torrentSummary.infoHash
var icon
var handleClick
const isPlayable = TorrentPlayer.isPlayable(file)
const infoHash = torrentSummary.infoHash
let icon
let handleClick
if (isPlayable) {
icon = 'play_arrow' /* playable? add option to play */
handleClick = dispatcher('playFile', infoHash, index)
@@ -327,7 +327,7 @@ module.exports = class TorrentList extends React.Component {
: (e) => e.stopPropagation() // noop if file is not ready
}
// TODO: add a css 'disabled' class to indicate that a file cannot be opened/streamed
var rowClass = ''
let rowClass = ''
if (!isSelected) rowClass = 'disabled' // File deselected, not being torrented
if (!isDone && !isPlayable) rowClass = 'disabled' // Can't open yet, can't stream
return (
@@ -354,9 +354,9 @@ module.exports = class TorrentList extends React.Component {
}
renderRadialProgressBar (fraction, cssClass) {
var rotation = 360 * fraction
var transformFill = {transform: 'rotate(' + (rotation / 2) + 'deg)'}
var transformFix = {transform: 'rotate(' + rotation + 'deg)'}
const rotation = 360 * fraction
const transformFill = {transform: 'rotate(' + (rotation / 2) + 'deg)'}
const transformFix = {transform: 'rotate(' + rotation + 'deg)'}
return (
<div key='radial-progress' className={'radial-progress ' + cssClass}>
@@ -376,7 +376,7 @@ module.exports = class TorrentList extends React.Component {
}
function getErrorMessage (torrentSummary) {
var err = torrentSummary.error
const err = torrentSummary.error
if (err === 'path-missing') {
return (
<span>