Video Speed Buttons

Add speed buttons to any HTML5 <video> element. Comes with a loader for YouTube and Vimeo

< Feedback on Video Speed Buttons

Review: Good - script works

§
Posted: 19.12.2017

Video Speed Buttons: Request for KeyBoard Controls change...

Very fine script!
Just a Request:
Change Key Contols (Because on my Keyboard these contols are more practical and intuitive):

"-", "Speed Down" (old ",")

"+", "Speed Up" (old ".")

"*", "Reset Speed" (old "=")

const keyboard_controls = [
["-", "Speed Down", function(ev){
if(is_comment_box(ev.target))
return false;

(buttons.selected || buttons.head)
.getprev()
.el
.dispatchEvent(new MouseEvent("click"));
}],
["+", "Speed Up", function(ev){
if(is_comment_box(ev.target))
return false;

(buttons.selected || buttons.head)
.getnext()
.el
.dispatchEvent(new MouseEvent("click"));
}],
["*", "Reset Speed", function(ev){
let selbtn = buttons.head;
let result = null;

if(is_comment_box(ev.target))
return false;

while(selbtn !== null && result === null)
if(selbtn.speed === DEFAULT_SPEED)
result = selbtn;
else
selbtn = selbtn.next;

if(result === null)
result = buttons.head;

result.el.dispatchEvent(new MouseEvent("click"));
}],
["?", "Show Help", function(ev){
let infobox;

if(is_comment_box(ev.target))
return false;

(infobox = Infobox(container))
.log("Keyboard Controls (click to close)
");

keyboard_controls.forEach(function([key, description]){
infobox.log(` [${key}] ${description}
`);
});
}]
];

§
Posted: 19.12.2017
Edited: 19.12.2017

Just another question:
how to use "+" or "-" keys without affecting the Volume of the video ?

Braden BestAuthor
§
Posted: 22.05.2018
Edited: 22.05.2018

I'm not sure. That's why the defaults are what they are: to avoid conflicting with other controls (I bound it to the document body so you could use them without having to explicitly focus the video). I thought I changed speed down and up to ; ' because I didn't want it to override the default behavior for , . (frame stepping).

Perhaps you could try your luck with "undoing" the volume change. Here's how it works: The HTML Video element has a property 'volume' that is a number between 0 (mute) and 1 (full). I could not reproduce your -/+ volume change on my end, but using up/down caused a volume change of 5%. So on the speed down function, you would add something like video_el.volume += 0.05;, and vice versa for speed up. Putting these immediately after the call to dispatchEvent() should suffice.

Braden BestAuthor
§
Posted: 22.05.2018
Edited: 22.05.2018

--duplicate--

Braden BestAuthor
§
Posted: 22.05.2018
Edited: 22.05.2018

@janvier56 said: Just another question: how to use "+" or "-" keys without affecting the Volume of the video ?

Upon further investigation, yeah, I can't reproduce the volume changing behavior, so it's not going into upstream. I will, however, push the new default controls, since it does seem more reasonable than what I had. I also hacked together a mod that changes the volume in accordance with the suggestion I gave. Here you go:

    ["-", "Speed Down", function(ev){
        if(is_comment_box(ev.target))
            return false;

        if(typeof video_el !== "undefined" && typeof video_el.volume === "number")
            video_el.volume = Math.min(video_el.volume + 0.05, 1.0);

        (buttons.selected || buttons.head)
            .getprev()
            .el
            .dispatchEvent(new MouseEvent("click"));
    }],
    ["+", "Speed Up", function(ev){
        if(is_comment_box(ev.target))
            return false;

        if(typeof video_el !== "undefined" && typeof video_el.volume === "number")
            video_el.volume = Math.max(video_el.volume - 0.05, 0);

        (buttons.selected || buttons.head)
            .getnext()
            .el
            .dispatchEvent(new MouseEvent("click"));
    }],

As described earlier, it changes the volume in the opposite direction, in effect "undoing" the volume change caused by hitting - +.

Post reply

Sign in to post a reply.