Skip to content
This repository has been archived by the owner on Dec 11, 2019. It is now read-only.

Commit

Permalink
Torrent Viewer: add download links
Browse files Browse the repository at this point in the history
  • Loading branch information
dcposch committed Nov 19, 2016
1 parent 9761cee commit 6ffe619
Show file tree
Hide file tree
Showing 6 changed files with 45 additions and 39 deletions.
1 change: 1 addition & 0 deletions app/extensions/torrent/locales/en-US/app.properties
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ downloading=Downloading
downloadingTorrent=Downloading Torrent
files=Files
num=#
downloadFile=Download
torrentStatus=Torrent Status
torrentLoadingInfo=Loading torrent info...
torrentUntitled=Untitled torrent
Expand Down
9 changes: 5 additions & 4 deletions js/components/sortableTable.js
Original file line number Diff line number Diff line change
Expand Up @@ -336,14 +336,15 @@ class SortableTable extends React.Component {
'sort-header': true,
'sort-default': this.sortingDisabled || heading === this.props.defaultHeading
}
headerClasses['heading-' + heading] = true
const isString = typeof heading === 'string'
if (isString) headerClasses['heading-' + heading] = true
return <th className={cx(headerClasses)}
data-sort-method={dataType === 'number' ? 'number' : undefined}
data-sort-order={this.props.defaultHeadingSortOrder}>
{
typeof heading === 'string'
? <div className='th-inner' data-l10n-id={heading} />
: heading
isString
? <div className='th-inner' data-l10n-id={heading} />
: heading
}
</th>
})}
Expand Down
23 changes: 6 additions & 17 deletions js/webtorrent/components/mediaViewer.js
Original file line number Diff line number Diff line change
Expand Up @@ -25,30 +25,19 @@ module.exports = class MediaViewer extends React.Component {
const fileExt = file && getExtension(file.name)
const isVideo = SUPPORTED_VIDEO_EXTENSIONS.includes(fileExt)
const isAudio = SUPPORTED_AUDIO_EXTENSIONS.includes(fileExt)
const fileURL = torrent.serverURL && (torrent.serverURL + '/' + ix)

let content
if (torrent.serverURL == null) {
content = <div data-l10n-id='torrentLoadingMedia' />
} else if (isVideo) {
content = (
<video
src={torrent.serverURL + '/' + ix}
autoplay='true'
controls='true' />
)
content = <video src={fileURL} autoPlay controls />
} else if (isAudio) {
content = (
<audio
src={torrent.serverURL + '/' + ix}
autoplay='true'
controls='true' />
)
content = <audio src={fileURL} autoPlay controls />
} else {
content = (
<iframe
src={torrent.serverURL + '/' + ix}
sandbox='allow-same-origin' />
)
// For security, sandbox and disallow scripts.
// We need allow-same-origin so that the iframe can load from http://localhost:...
content = <iframe src={fileURL} sandbox='allow-same-origin' />
}

return (
Expand Down
39 changes: 23 additions & 16 deletions js/webtorrent/components/torrentFileList.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,40 +3,31 @@ const React = require('react')
const SortableTable = require('../../components/sortableTable')

class TorrentFileList extends React.Component {
constructor () {
super()
this.onClick = this.onClick.bind(this)
}

onClick (file) {
window.location = this.props.torrentID + '&ix=' + this.props.files.indexOf(file)
}

render () {
const files = this.props.files
const torrent = this.props.torrent
const files = torrent && torrent.files

let content
if (files == null) {
content = <div data-l10n-id='missingFilesList' />
} else if (files.length === 0) {
content = <div data-l10n-id='loadingFilesList' />
} else {
// TODO(feross): Add context menu support, like History page has.
content = [
<SortableTable
headings={['num', 'name', 'size']}
headings={['num', 'name', 'downloadFile', 'size']}
defaultHeading='num'
defaultHeadingSortOrder='asc'
rows={files.map((file, i) => [
String(i + 1),
file.name,
{cell: this.renderFileLink(file, false)},
{cell: this.renderFileLink(file, true)},
prettierBytes(file.length)
])}
rowObjects={files}
columnClassNames={['num', 'name', 'size']}
columnClassNames={['num', 'name', 'downloadFile', 'size']}
addHoverClass
stateOwner={this.props.stateOwner}
onClick={this.onClick} />
stateOwner={this.props.stateOwner} />
]
}

Expand All @@ -47,6 +38,22 @@ class TorrentFileList extends React.Component {
</div>
)
}

renderFileLink (file, isDownload) {
const { torrent, torrentID } = this.props
const ix = torrent.files.indexOf(file)
if (isDownload) {
if (torrent.serverURL) {
const httpURL = torrent.serverURL + '/' + ix
return <a href={httpURL} download={file.name}></a>
} else {
return <div /> // No download links until the server is ready
}
} else {
const magnetURL = torrentID + '&ix=' + ix
return <a href={magnetURL}>{file.name}</a>
}
}
}

module.exports = TorrentFileList
2 changes: 1 addition & 1 deletion js/webtorrent/components/torrentViewer.js
Original file line number Diff line number Diff line change
Expand Up @@ -60,7 +60,7 @@ class TorrentViewer extends React.Component {
<div className='siteDetailsPageContent'>
<TorrentStatus torrent={torrent} errorMessage={errorMessage} />
<TorrentFileList
files={torrent && torrent.files}
torrent={torrent}
stateOwner={this}
torrentID={torrentID} />
{legalNotice}
Expand Down
10 changes: 9 additions & 1 deletion less/webtorrent.less
Original file line number Diff line number Diff line change
Expand Up @@ -55,8 +55,16 @@
width: 60px;
}

.heading-downloadFile {
width: 100px;
}

.heading-size {
width: 120px;
width: 100px;
}

a {
text-decoration: none;
}
}
}
Expand Down

0 comments on commit 6ffe619

Please sign in to comment.