diff --git a/package.json b/package.json index c2aa8333..88cc6f08 100644 --- a/package.json +++ b/package.json @@ -22,6 +22,7 @@ "hyperx": "^2.0.2", "main-loop": "^3.2.0", "mkdirp": "^0.5.1", + "musicmetadata": "^2.0.2", "network-address": "^1.1.0", "prettier-bytes": "^1.0.1", "upload-element": "^1.0.1", @@ -30,7 +31,6 @@ "winreg": "^1.0.1" }, "devDependencies": { - "appdmg": "^0.3.6", "electron-osx-sign": "^0.3.0", "electron-packager": "^5.0.0", "electron-prebuilt": "0.37.2", @@ -40,6 +40,9 @@ "rimraf": "^2.5.2", "standard": "^6.0.5" }, + "optionalDependencies": { + "appdmg": "^0.3.6" + }, "homepage": "https://webtorrent.io", "keywords": [ "electron", diff --git a/renderer/index.css b/renderer/index.css index b6528428..d9e6400b 100644 --- a/renderer/index.css +++ b/renderer/index.css @@ -730,6 +730,34 @@ body.drag .torrent-placeholder span { font-weight: bold; } +/* + * AUDIO DETAILS + */ + +.audio-metadata { + width: 500px; + max-width: 100%; + white-space: nowrap; + text-overflow: ellipsis; + align-self: center; + margin: 0 auto; + font-weight: bold; + font-size: 24px; + line-height: 2; +} + +.audio-metadata .audio-title { + font-size: 32px; +} + +.audio-metadata label { + display:inline-block; + width: 100px; + text-align: right; + font-weight: normal; + margin-right: 25px; +} + /* * ERRORS */ diff --git a/renderer/index.js b/renderer/index.js index 9d532192..2763be5f 100644 --- a/renderer/index.js +++ b/renderer/index.js @@ -8,6 +8,7 @@ var EventEmitter = require('events') var fs = require('fs') var mainLoop = require('main-loop') var mkdirp = require('mkdirp') +var musicmetadata = require('musicmetadata') var networkAddress = require('network-address') var path = require('path') var remote = require('remote') @@ -609,7 +610,17 @@ function startServerFromReadyTorrent (torrent, index, cb) { state.playing.infoHash = torrent.infoHash state.playing.fileIndex = index state.playing.type = TorrentPlayer.isVideo(file) ? 'video' : 'audio' + state.playing.audioInfo = null + // if it's audio, parse out the metadata (artist, title, etc) + musicmetadata(file.createReadStream(), function (err, info) { + if (err) return + console.log('Got audio metadata for %s: %v', file.name, info) + state.playing.audioInfo = info + update() + }) + + // either way, start a streaming torrent-to-http server var server = torrent.createServer() server.listen(0, function () { var port = server.address().port diff --git a/renderer/views/player.js b/renderer/views/player.js index 4dc7c69f..c769ceef 100644 --- a/renderer/views/player.js +++ b/renderer/views/player.js @@ -21,6 +21,8 @@ function Player (state, dispatch) { } function renderMedia (state, dispatch) { + if (!state.server) return + // Unfortunately, play/pause can't be done just by modifying HTML. // Instead, grab the DOM node and play/pause it if necessary var mediaType = state.playing.type /* 'audio' or 'video' */ @@ -57,8 +59,9 @@ function renderMedia (state, dispatch) { // Show the media. // Video fills the window, centered with black bars if necessary // Audio gets a static poster image and a summary of the file metadata. + var isAudio = mediaType === 'audio' var style = { - backgroundImage: mediaType === 'audio' ? cssBackgroundImagePoster(state) : '' + backgroundImage: isAudio ? cssBackgroundImagePoster(state) : '' } return hx`