Added support for VTT subtitles and subtitles toggling both in local and browser media players

This commit is contained in:
Fabio Manganiello 2019-02-12 01:30:55 +01:00
parent 41c34b4bc5
commit 5cbd0fdfe7
10 changed files with 257 additions and 107 deletions

View file

@ -11,7 +11,7 @@ import time
from multiprocessing import Process
from flask import Flask, Response, abort, jsonify, request as http_request, \
render_template, send_from_directory, make_response
render_template, send_from_directory
from redis import Redis
@ -379,8 +379,20 @@ class HttpBackend(Backend):
if media_id in media_map:
return media_map[media_id]
subfile = None
if subtitles:
try:
subfile = get_plugin('media.subtitles').download(
link=subtitles, convert_to_vtt=True
).output.get('filename')
except Exception as e:
self.logger.warning('Unable to load subtitle {}: {}'
.format(subtitles, str(e)))
media_hndl = MediaHandler.build(source, url=media_url,
subtitles=subtitles)
subtitles=subfile)
media_map[media_id] = media_hndl
media_hndl.media_id = media_id
@ -456,8 +468,9 @@ class HttpBackend(Backend):
media_url=media_hndl.url.replace(
self.remote_base_url, ''),
media_type=media_hndl.mime_type,
subtitles_url='/media/subtitles/{}.srt'.
format(media_id))
subtitles_url='/media/subtitles/{}.vtt'.
format(media_id) if media_hndl.subtitles
else None)
else:
return Response(media_hndl.get_data(
from_bytes=from_bytes, to_bytes=to_bytes,
@ -508,12 +521,13 @@ class HttpBackend(Backend):
subfile = get_plugin('media.subtitles').download(
link=subtitles[0].get('SubDownloadLink'),
media_resource=media_hndl.path).get('filename')
media_resource=media_hndl.path,
convert_to_vtt=True).get('filename')
media_hndl.set_subtitles(subfile)
return {
'filename': subfile,
'url': self.remote_base_url + '/media/subtitles/' + media_id + '.srt',
'url': self.remote_base_url + '/media/subtitles/' + media_id + '.vtt',
}
def remove_subtitles(media_id):
@ -530,7 +544,7 @@ class HttpBackend(Backend):
return {}
@app.route('/media/subtitles/<media_id>.srt', methods=['GET', 'PUT', 'DELETE'])
@app.route('/media/subtitles/<media_id>.vtt', methods=['GET', 'POST', 'DELETE'])
def handle_subtitles(media_id):
"""
This route can be used to download and/or expose subtitle files
@ -590,7 +604,7 @@ class HttpBackend(Backend):
ret = dict(media_hndl)
if media_hndl.subtitles:
ret['subtitles_url'] = self.remote_base_url + \
'/media/subtitles/' + media_hndl.media_id + '.srt'
'/media/subtitles/' + media_hndl.media_id + '.vtt'
return jsonify(ret)
except FileNotFoundError as e:
abort(404, str(e))
@ -754,6 +768,7 @@ class HttpBackend(Backend):
self.logger.info('Initialized HTTP backend on port {}'.format(self.port))
self.app = self.webserver()
self.app.debug = False
self.server_proc = Process(target=self.app.run,
name='WebServer',
kwargs=kwargs)

View file

@ -53,8 +53,9 @@ class MediaHandler:
def __iter__(self):
for attr in ['name', 'source', 'mime_type', 'url', 'subtitles',
'prefix_handlers']:
yield (attr, getattr(self, attr))
'prefix_handlers', 'media_id']:
if hasattr(self, attr):
yield (attr, getattr(self, attr))

View file

@ -18,7 +18,9 @@ $(document).ready(function() {
$mediaSubtitlesMessage = $mediaSubtitlesModal.find('.media-subtitles-message'),
$mediaSearchSubtitles = $ctrlForm.find('[data-modal="#media-subtitles-modal"]'),
prevVolume = undefined,
selectedResource = undefined;
selectedResource = undefined,
browserVideoWindow = undefined,
browserVideoElement = undefined;
const onEvent = (event) => {
switch (event.args.type) {
@ -158,7 +160,7 @@ $(document).ready(function() {
resolve(uri, subtitles);
} else {
reject(Error(xhr.responseText));
reject(xhr.responseText);
}
},
});
@ -192,13 +194,14 @@ $(document).ready(function() {
});
};
const downloadSubtitles = function(link, mediaResource) {
const downloadSubtitles = function(link, mediaResource, vtt=false) {
return new Promise((resolve, reject) => {
run({
action: 'media.subtitles.download',
args: {
'link': link,
'media_resource': mediaResource,
'convert_to_vtt': vtt,
}
}).then((response) => {
resolve(response.response.output.filename);
@ -244,10 +247,17 @@ $(document).ready(function() {
const playInBrowser = (resource, subtitles) => {
return new Promise((resolve, reject) => {
startStreaming(resource, subtitles).then((url, subtitles) => {
window.open(url + '?webplayer', '_blank');
browserVideoWindow = window.open(
url + '?webplayer', '_blank');
browserVideoWindow.addEventListener('load', () => {
browserVideoElement = browserVideoWindow.document
.querySelector('#video-player');
});
resolve(url, subtitles);
}).catch((xhr, status, error) => {
reject(xhr.responseText);
}).catch((error) => {
reject(error);
});
});
};
@ -287,8 +297,8 @@ $(document).ready(function() {
playHndl.then((response) => {
resolve(resource);
}).catch((error) => {
showError('Playback error: ' + error.message);
reject(error.message);
showError('Playback error: ' + (error ? error : 'undefined'));
reject(error);
});
});
};
@ -302,44 +312,36 @@ $(document).ready(function() {
resolve(resource);
};
var defaultPlay = () => { _play(resource).finally(onVideoReady); };
$mediaSearchSubtitles.data('resource', resource);
onVideoLoading();
var subtitlesConf = window.config.media.subtitles;
if (subtitlesConf) {
populateSubtitlesModal(resource);
if ('language' in subtitlesConf) {
tryFetchSubtitles(resource).then((subtitles) => {
if (!subtitles) {
showError('Cannot get subtitles');
_play(resource).finally(onVideoReady);
populateSubtitlesModal(resource).then((subs) => {
if ('language' in subtitlesConf) {
if (subs) {
downloadSubtitles(subs[0].SubDownloadLink, resource).then((subtitles) => {
_play(resource, subtitles).finally(onVideoReady);
resolve(resource, subtitles);
}).catch((error) => {
defaultPlay();
resolve(resource);
});
} else {
_play(resource, subtitles).finally(onVideoReady);
defaultPlay();
resolve(resource);
}
});
}
} else {
_play(resource).finally(onVideoReady);
}
});
};
const tryFetchSubtitles = (resource) => {
return new Promise((resolve, reject) => {
getSubtitles(resource).then((subs) => {
if (!subs) {
resolve();
return; // No subtitles found
}
downloadSubtitles(subs[0].SubDownloadLink, resource).then((filename) => {
resolve(filename);
}).catch((error) => {
resolve();
} else {
defaultPlay();
resolve(resource);
}
});
});
} else {
defaultPlay();
resolve(resource);
}
});
};
@ -361,8 +363,8 @@ $(document).ready(function() {
window.open(url, '_blank');
resolve(url);
})
.catch((xhr, status, error) => {
reject(xhr.responseText);
.catch((error) => {
reject(error);
})
.finally(() => {
onVideoReady();
@ -371,54 +373,114 @@ $(document).ready(function() {
};
const populateSubtitlesModal = (resource) => {
$mediaSubtitlesMessage.text('Loading subtitles...');
$mediaSubtitlesResults.text('');
$mediaSubtitlesMessage.show();
$mediaSubtitlesResultsContainer.hide();
return new Promise((resolve, reject) => {
$mediaSubtitlesMessage.text('Loading subtitles...');
$mediaSubtitlesResults.text('');
$mediaSubtitlesMessage.show();
$mediaSubtitlesResultsContainer.hide();
getSubtitles(resource).then((subs) => {
if (!subs.length) {
$mediaSubtitlesMessage.text('No subtitles found');
return;
}
getSubtitles(resource).then((subs) => {
if (!subs) {
$mediaSubtitlesMessage.text('No subtitles found');
resolve();
}
$mediaSearchSubtitles.show();
for (var sub of subs) {
var flagCode;
if ('ISO639' in sub) {
switch(sub.ISO639) {
case 'en': flagCode = 'gb'; break;
default: flagCode = sub.ISO639; break;
$mediaSearchSubtitles.show();
for (var sub of subs) {
var flagCode;
if ('ISO639' in sub) {
switch(sub.ISO639) {
case 'en': flagCode = 'gb'; break;
default: flagCode = sub.ISO639; break;
}
}
var $subContainer = $('<div></div>').addClass('row media-subtitle-container')
.data('download-link', sub.SubDownloadLink)
.data('resource', resource);
var $subFlagIconContainer = $('<div></div>').addClass('one column');
var $subFlagIcon = $('<span></span>')
.addClass(flagCode ? 'flag-icon flag-icon-' + flagCode : (
sub.IsLocal ? 'fa fa-download' : ''))
.text(!(flagCode || sub.IsLocal) ? '?' : '');
var $subMovieName = $('<div></div>').addClass('five columns')
.text(sub.MovieName);
var $subFileName = $('<div></div>').addClass('six columns')
.text(sub.SubFileName);
$subFlagIcon.appendTo($subFlagIconContainer);
$subFlagIconContainer.appendTo($subContainer);
$subMovieName.appendTo($subContainer);
$subFileName.appendTo($subContainer);
$subContainer.appendTo($mediaSubtitlesResults);
}
$mediaSubtitlesMessage.hide();
$mediaSubtitlesResultsContainer.show();
resolve(subs);
}).catch((error) => {
$mediaSubtitlesMessage.text('Unable to load subtitles: ' + error.message);
reject(error);
});
});
};
const setBrowserPlayerSubs = (resource, subtitles) => {
var mediaId;
if (!browserVideoElement) {
showError('No video is currently playing in the browser');
return;
}
return new Promise((resolve, reject) => {
$.get('/media').then((media) => {
for (var m of media) {
if (m.source === resource) {
mediaId = m.media_id;
break;
}
}
var $subContainer = $('<div></div>').addClass('row media-subtitle-container')
.data('download-link', sub.SubDownloadLink)
.data('resource', resource);
if (!mediaId) {
reject(resource + ' is not a registered media');
return;
}
var $subFlagIconContainer = $('<div></div>').addClass('one column');
var $subFlagIcon = $('<span></span>')
.addClass(flagCode ? 'flag-icon flag-icon-' + flagCode : (
sub.IsLocal ? 'fa fa-download' : ''))
.text(!(flagCode || sub.IsLocal) ? '?' : '');
return $.ajax({
type: 'POST',
url: '/media/subtitles/' + mediaId + '.vtt',
contentType: 'application/json',
data: JSON.stringify({
'filename': subtitles,
}),
});
}).then(() => {
resolve(resource, subtitles);
}).catch((error) => {
reject('Cannot set subtitles for ' + resource + ': ' + error);
});
});
};
var $subMovieName = $('<div></div>').addClass('five columns')
.text(sub.MovieName);
var $subFileName = $('<div></div>').addClass('six columns')
.text(sub.SubFileName);
$subFlagIcon.appendTo($subFlagIconContainer);
$subFlagIconContainer.appendTo($subContainer);
$subMovieName.appendTo($subContainer);
$subFileName.appendTo($subContainer);
$subContainer.appendTo($mediaSubtitlesResults);
}
$mediaSubtitlesMessage.hide();
$mediaSubtitlesResultsContainer.show();
}).catch((error) => {
$mediaSubtitlesMessage.text('Unable to load subtitles: ' + error.message);
const setLocalPlayerSubs = (resource, subtitles) => {
return new Promise((resolve, reject) => {
run({
action: 'media.remove_subtitles'
}).then((response) => {
return run({
action: 'media.set_subtitles',
args: {
'filename': subtitles,
}
})
}).then((response) => {
resolve(response);
}).catch((error) => {
reject(error);
});
});
};
@ -435,6 +497,7 @@ $(document).ready(function() {
};
$input.prop('disabled', true);
$mediaItemPanel.find('[data-action]').removeClass('disabled');
$videoResults.text('Searching...');
if (resource.match(new RegExp('^https?://')) ||
@ -594,8 +657,29 @@ $(document).ready(function() {
});
});
// $mediaSearchSubtitles.on('mouseup touchend', () => {
// });
$mediaSubtitlesModal.on('mouseup touchend', '.media-subtitle-container', (event) => {
var resource = $(event.currentTarget).data('resource');
var link = $(event.currentTarget).data('downloadLink');
var selectedDevice = getSelectedDevice();
if (selectedDevice.isRemote) {
showError('Changing subtitles at runtime on Chromecast is not yet supported');
return;
}
var convertToVTT = selectedDevice.isBrowser;
downloadSubtitles(link, resource, convertToVTT).then((subtitles) => {
if (selectedDevice.isBrowser) {
return setBrowserPlayerSubs(resource, subtitles);
} else {
return setLocalPlayerSubs(resource, subtitles);
}
}).catch((error) => {
console.warning('Could not load subtitles ' + link +
' to the player: ' + (error || 'undefined error'))
});
});
};
const initRemoteDevices = function() {
@ -607,8 +691,7 @@ $(document).ready(function() {
action: 'media.chromecast.get_chromecasts',
},
function(results) {
$devsRefreshBtn.removeClass('disabled');
onSuccess = function(results) {
$devsList.find('.cast-device[data-remote]').remove();
if (!results || results.response.errors.length) {
@ -641,6 +724,10 @@ $(document).ready(function() {
$nameContainer.appendTo($cast);
$cast.appendTo($devsList);
}
},
onComplete = function() {
$devsRefreshBtn.removeClass('disabled');
}
);
};

View file

@ -1,16 +1,18 @@
<script>
window.addEventListener('load', () => {
var video = document.querySelector('#video');
video.addEventListener('load', () => {
var tracks = video.textTracks;
if (tracks.length) {
tracks[0].mode = 'showing';
}
var video = document.querySelector('#video-player');
video.addEventListener('loadedmetadata', () => {
video.play();
});
var tracks = video.textTracks;
if (tracks.length) {
tracks[0].mode = 'showing';
}
}, false);
</script>
<video id="video" controls autoplay preload="metadata">
<video id="video-player" controls autoplay preload="metadata" width="100%" height="100%">
<source src="{{ media_url }}" type="{{ media_type }}">
{% if subtitles_url %}
<track label="Subtitles" kind="subtitles" src="{{ subtitles_url }}" default>

View file

@ -208,11 +208,11 @@ class Request(Message):
if response and response.is_error():
logger.warning(('Response processed with errors from ' +
'action {}.{}: {}').format(
plugin, self.action, str(response)))
'action {}: {}').format(
self.action, str(response)))
else:
logger.info('Processed response from action {}.{}: {}'.
format(plugin, self.action, str(response)))
logger.info('Processed response from action {}: {}'.
format(self.action, str(response)))
except Exception as e:
# Retry mechanism
plugin.logger.exception(e)

View file

@ -217,6 +217,10 @@ class MediaPlugin(Plugin):
def set_subtitles(self, filename, *args, **kwargs):
raise self._NOT_IMPLEMENTED_ERR
@action
def remove_subtitles(self, *args, **kwargs):
raise self._NOT_IMPLEMENTED_ERR
@action
def is_playing(self, *args, **kwargs):
raise self._NOT_IMPLEMENTED_ERR

View file

@ -353,6 +353,14 @@ class MediaMplayerPlugin(MediaPlugin):
self._exec('sub_visibility', 1)
return self._exec('sub_load', filename)
@action
def remove_subtitles(self, index=None):
""" Removes the subtitle specified by the index (default: all) """
if index is None:
return self._exec('sub_remove')
else:
return self._exec('sub_remove', index)
@action
def is_playing(self):
"""

View file

@ -2,6 +2,7 @@ import gzip
import os
import requests
import tempfile
import threading
from platypush.message.response import Response
from platypush.plugins import Plugin, action
@ -15,6 +16,7 @@ class MediaSubtitlesPlugin(Plugin):
Requires:
* **python-opensubtitles** (``pip install -e 'git+https://github.com/agonzalezro/python-opensubtitles#egg=python-opensubtitles'``)
* **webvtt** (``pip install webvtt-py``), optional, to convert srt subtitles into vtt format ready for web streaming
* **requests** (``pip install requests``)
"""
@ -39,6 +41,7 @@ class MediaSubtitlesPlugin(Plugin):
self._ost = OpenSubtitles()
self._token = self._ost.login(username, password)
self.languages = []
self._file_lock = threading.RLock()
if language:
if isinstance(language, str):
@ -116,7 +119,7 @@ class MediaSubtitlesPlugin(Plugin):
@action
def download(self, link, media_resource=None, path=None):
def download(self, link, media_resource=None, path=None, convert_to_vtt=False):
"""
Downloads a subtitle link (.srt/.vtt file or gzip/zip OpenSubtitles
archive link) to the specified directory
@ -132,6 +135,10 @@ class MediaSubtitlesPlugin(Plugin):
media local file then the subtitles will be saved in the same folder
:type media_resource: str
:param convert_to_vtt: If set to True, then the downloaded subtitles
will be converted to VTT format (default: no conversion)
:type convert_to_vtt: bool
:returns: dict. Format::
{
@ -142,6 +149,8 @@ class MediaSubtitlesPlugin(Plugin):
if link.startswith('file://'):
link = link[len('file://'):]
if os.path.isfile(link):
if convert_to_vtt:
link = self.to_vtt(link).output
return { 'filename': link }
gzip_content = requests.get(link).content
@ -166,11 +175,33 @@ class MediaSubtitlesPlugin(Plugin):
try:
with f:
f.write(gzip.decompress(gzip_content))
if convert_to_vtt:
path = self.to_vtt(path).output
except Exception as e:
os.unlink(path)
raise e
return { 'filename': path }
@action
def to_vtt(self, filename):
"""
Get the VTT content given an SRT file. Will return the original content if
the file is already in VTT format.
"""
if filename.lower().endswith('.vtt'):
return filename
import webvtt
with self._file_lock:
try:
webvtt.read(filename)
return filename
except Exception as e:
webvtt.from_srt(filename).save()
return '.'.join(filename.split('.')[:-1]) + '.vtt'
# vim:sw=4:ts=4:et:

View file

@ -126,4 +126,5 @@ inputs
# Support for media subtitles
# git+https://github.com/agonzalezro/python-opensubtitles#egg=python-opensubtitles
# webvtt-py

View file

@ -95,9 +95,10 @@ setup(
'Support for Plex plugin': ['plexapi'],
'Support for Chromecast plugin': ['pychromecast'],
'Support for sound devices': ['sounddevice', 'soundfile', 'numpy'],
'Support for web media subtitles': ['webvtt-py']
# 'Support for Leap Motion backend': ['git+ssh://git@github.com:BlackLight/leap-sdk-python3.git'],
# 'Support for Flic buttons': ['git+https://@github.com/50ButtonsEach/fliclib-linux-hci.git']
# 'Support for media subtitles: ['git+https://github.com/agonzalezro/python-opensubtitles#egg=python-opensubtitles']
# 'Support for media subtitles': ['git+https://github.com/agonzalezro/python-opensubtitles#egg=python-opensubtitles']
},
)