Video player html

Dla specjalistów Webmastering
#1

Hej!

 

potrzebuję pomocy w udoskonaleniu kodu na własny player. Chodziło głównie o to by stworzyć własne przyciski umieszczone pod divem z video. Po przetestowaniu wielu skryptów i możliwości ten działa, ale…;)wiem, że to pewno nie jest napisane jak trzeba ale jestem w fazie nauki;)

wklejam kod:

<div id="player">
  <video id="video" width="600" height="500" controls>
   <source src="01/1.webm" type="video/webm" />
   </video>
<script>
var video = document.getElementById("video");
video.controls = false;
</script>
 
  <input type="range" id="seek-bar" value="0">
<div id="buttons">
<button onclick="playVid()" id="play" type="button"></button>
<button onclick="pauseVid()" id="pause" type="button"></button>
<button onclick="rewind()" id="rewind" type="button"></button>
<button onclick="fastForward()" id="fastForward" type="button"></button>
</div>
 
<script>
var video = document.getElementById('video');
function playVid() {
   video.play();
}
 
function pauseVid() {
   video.pause();
}
 
$("#fastForward").click(function() { // button function for 3x fast speed forward
    video.playbackRate = 3.0;
});
$("#rewind").click(function() { // button function for rewind
   intervalRewind = setInterval(function(){
       video.playbackRate = 1.0;
       if(video.currentTime == 0){
           clearInterval(intervalRewind);
           video.pause();
       }
       else{
           video.currentTime += -.1;
       }
                },30);
});
 
$("#video").on("timeupdate", function () {
        var video = $(this)[0];
        var value = (100 / video.duration) * video.currentTime;
        $("#seek-bar").val(value);
    });
 
$("#seek-bar").on("mouseup", function () {
        var video = $("#video")[0];
        var currentTime = $("#seek-bar").val() / (100 / video.duration);
        video.currentTime = currentTime;
    });
    $("#seek-bar").on("mousedown", function () {
        var video = $("#video")[0];
        video.pause();
    });
 
</script>

chodzi o to, że jak przewijam na przyciskach, to jak daje pause i ponownie play to dalej się przewija w szybszym tempie. jak to sobie ustawić, żeby przewijać do tego momentu co się chce?

a druga sprawa to suwak seek-bar po ponownym odswiezeniu strony nie powraca na pozycje O.

 

Z góry dzięki za wszelkie pomoce:)