forked from platypush/platypush
Finalized video.omxplayer FE plugin
This commit is contained in:
parent
b5b61f0442
commit
e310ef0a04
3 changed files with 56 additions and 9 deletions
|
@ -7,3 +7,7 @@
|
|||
width: 100%;
|
||||
}
|
||||
|
||||
form#video-ctrl {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
|
|
@ -1,9 +1,10 @@
|
|||
$(document).ready(function() {
|
||||
var $container = $('#video-container'),
|
||||
$form = $('#video-form');
|
||||
$searchForm = $('#video-search'),
|
||||
$ctrlForm = $('#video-ctrl');
|
||||
|
||||
var initBindings = function() {
|
||||
$form.on('submit', function(event) {
|
||||
$searchForm.on('submit', function(event) {
|
||||
var formData = $(this).serializeArray().reduce(function(obj, item) {
|
||||
var value = item.value.trim();
|
||||
if (value.length > 0) {
|
||||
|
@ -32,6 +33,18 @@ $(document).ready(function() {
|
|||
|
||||
return false;
|
||||
});
|
||||
|
||||
$searchForm.find('button[data-action]').on('click', function(evt) {
|
||||
var action = $(this).data('action');
|
||||
var $btn = $(this);
|
||||
|
||||
execute(
|
||||
{
|
||||
type: 'request',
|
||||
action: 'video.omxplayer.' + action,
|
||||
}
|
||||
);
|
||||
});
|
||||
};
|
||||
|
||||
var init = function() {
|
||||
|
|
|
@ -2,11 +2,15 @@
|
|||
<link rel="stylesheet" href="{{ url_for('static', filename='css/video.omxplayer.css') }}"></script>
|
||||
|
||||
<div class="row" id="video-container">
|
||||
<form action="#" id="video-form">
|
||||
<div class="eleven columns">
|
||||
<form action="#" id="video-search">
|
||||
<div class="row">
|
||||
<label for="resource">
|
||||
Supported formats: <tt>file://[path]</tt>, <tt>https://www.youtube.com/?v=[video_id]</tt>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="eleven columns">
|
||||
<input type="text" name="resource" placeholder="Video URL">
|
||||
</div>
|
||||
<div class="one column">
|
||||
|
@ -14,6 +18,32 @@
|
|||
<i class="fa fa-podcast"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<form action="#" id="video-ctrl">
|
||||
<div class="row">
|
||||
<div class="ten columns offset-by-one">
|
||||
<button data-action="previous">
|
||||
<i class="fa fa-step-backward"></i>
|
||||
</button>
|
||||
|
||||
<button data-action="play">
|
||||
<i class="fa fa-play"></i>
|
||||
</button>
|
||||
|
||||
<button data-action="pause">
|
||||
<i class="fa fa-pause"></i>
|
||||
</button>
|
||||
|
||||
<button data-action="stop">
|
||||
<i class="fa fa-stop"></i>
|
||||
</button>
|
||||
|
||||
<button data-action="next">
|
||||
<i class="fa fa-step-forward"></i>
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
|
|
Loading…
Reference in a new issue