javascript - How to allow rewind but disable fast-forwarding in html5-video -


i have following code (using videojs)

this.on("timeupdate", function(event) {             previoustime = this.currenttime();         });          this.on("seeking", function(){             if (this.currenttime() > previoustime){                 this.currenttime = previoustime;             }         }); 

problem that, once try fast-forward 1 time, no longers keeps track of timeupdate on progress bar. can not longer seek on bar - not rewind video. missing here?

first off, these not standard htmlmediaelement methods , properties, i'm assuming you're using kind of framework, perhaps popcorn.js? , i'm assuming this refers object wrapping video element.

the problem you're overwriting currenttime method. if reference video element directly, seek way you're doing it, setting currenttime property, like: videoelement.currenttime = previoustime. since you're using framework, this.currenttime supposed function until change number.

to demonstrate, modify code follows:

this.on("seeking", function(){     console.log(typeof this.currenttime); // 'function'     if (this.currenttime() > previoustime){         this.currenttime = previoustime;         console.log(typeof this.currenttime); // 'number'     } }); 

the next time run "timeupdate" handler, call this.currenttime() throw error because no longer function.

you can fix (assuming you're using popcorn or works similarly):

this.on("seeking", function(){     if (this.currenttime() > previoustime){         this.currenttime(previoustime);     } }); 

you'll want make sure don't set previoustime while seeking, since "timeupdate" may fire before "seeking" does. i'm not sure how framework, here's link working example using native htmlvideoelement api:

http://jsbin.com/kilemoto/1/edit


Comments

Popular posts from this blog

javascript - RequestAnimationFrame not working when exiting fullscreen switching space on Safari -

Python ctypes access violation with const pointer arguments -