klafyvel/live_share_youtube
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

boutons next/prev

Browse source
This commit is contained in:
Klafyvel 2018-03-25 19:24:19 +02:00
parent 227b161de0
commit a58f3365ed
1 changed files with 31 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
player/templates/player/playlist.html
View file

@ -19,7 +19,21 @@
</div> </div>
<div class="row" style="height:100%"> <div class="row" style="height:100%">
<div class="col-md-6"> <div class="col-md-6">
<div class="row">
<div class="col-md-10">
<h2>Lecture</h2> <h2>Lecture</h2>
</div>
<div class="col-md-2">
<div class="btn-group">
<a class="btn btn-outline-dark" role="button" onclick="prev();">
<i class="fas fa-step-backward"></i>
</a>
<a class="btn btn-outline-dark" role="button" onclick="next();">
<i class="fas fa-step-forward"></i>
</a>
</div>
</div>
</div>
<!-- 1. The <iframe> (and video player) will replace this <div> tag. --> <!-- 1. The <iframe> (and video player) will replace this <div> tag. -->
<div id="player" style="max-width:100%"></div> <div id="player" style="max-width:100%"></div>
<form onSubmit="return addLink();" class="form" id="add_link_form"> <form onSubmit="return addLink();" class="form" id="add_link_form">
@ -64,6 +78,22 @@ function onPlayerReady(event) {
setInterval(loadLinks, 5000); setInterval(loadLinks, 5000);
} }
function next() {
if (current_link < (tracks.length -1)) {
current_link += 1
player.loadVideoById(tracks[current_link]);
event.target.playVideo();
}
}
function prev() {
if (current_link > 0) {
current_link -= 1
player.loadVideoById(tracks[current_link]);
event.target.playVideo();
}
}
function onPlayerStateChange(event) { function onPlayerStateChange(event) {
if (event.data == YT.PlayerState.ENDED) { if (event.data == YT.PlayerState.ENDED) {
onPlayerReady(); onPlayerReady();