Skip to content

Instantly share code, notes, and snippets.

@HT-7

HT-7/playback keyboard controls.js

Last active 3 hours ago
Star
Embed
What would you like to do?
Learn more about clone URLs
Download ZIP

Revisions

  1. HT-7 revised this gist 3 hours ago. 1 changed file with 3 additions and 3 deletions.
    6 playback keyboard controls.js
    View file
    @@ -35,7 +35,7 @@ function getVol() { return Math.round(document.getElementsByTagName(mediaType)[0
    // code deduplication
    function jumpNum(num) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.1*num ;
    console.log("Position: "+ 10*num +"% Time: " + getCurrentTime() + " / " + getDuration() + " s" );
    console.log("Position: "+ 10*num +" % Time: " + getCurrentTime() + " / " + getDuration() + " s" );
    }

    window.onkeydown = function(e) {
    @@ -114,7 +114,7 @@ window.onkeydown = function(e) {
    // increase volume by the value in volume_step
    document.getElementsByTagName(mediaType)[0].volume+=volume_step ;
    }
    console.log("Volume: " + getVol() + "%" );
    console.log("Volume: " + getVol() + " %" );
    }
    if (key == 173 || key == 109) {
    // set volume to 0% if below volume_step
    @@ -124,7 +124,7 @@ window.onkeydown = function(e) {
    // decrease volume by the value in volume_step
    document.getElementsByTagName(mediaType)[0].volume-=volume_step ;
    }
    console.log("Volume: " + getVol() + "%" );
    console.log("Volume: " + getVol() + " %" );
    }


  2. HT-7 revised this gist 8 hours ago. 1 changed file with 2 additions and 2 deletions.
    4 playback keyboard controls.js
    View file
    @@ -114,7 +114,7 @@ window.onkeydown = function(e) {
    // increase volume by the value in volume_step
    document.getElementsByTagName(mediaType)[0].volume+=volume_step ;
    }
    console.log("Volume: " + getVol(); + "%" );
    console.log("Volume: " + getVol() + "%" );
    }
    if (key == 173 || key == 109) {
    // set volume to 0% if below volume_step
    @@ -124,7 +124,7 @@ window.onkeydown = function(e) {
    // decrease volume by the value in volume_step
    document.getElementsByTagName(mediaType)[0].volume-=volume_step ;
    }
    console.log("Volume: " + getVol(); + "%" );
    console.log("Volume: " + getVol() + "%" );
    }


  3. HT-7 revised this gist 9 hours ago. 1 changed file with 6 additions and 4 deletions.
    10 playback keyboard controls.js
    View file
    @@ -27,8 +27,10 @@ window.onclick = function() { checkMediaType(); };
    window.addEventListener("keydown", function() { checkMediaType(); } );

    // shortcuts for current time and duration
    function getCurrentTime() { return Math.round( document.getElementsByTagName(mediaType)[0].currentTime ); }
    function getDuration() { return Math.round( document.getElementsByTagName(mediaType)[0].duration ); }
    function getCurrentTime() { return Math.floor( document.getElementsByTagName(mediaType)[0].currentTime ); }
    function getDuration() { return Math.floor( document.getElementsByTagName(mediaType)[0].duration ); }
    function getVol() { return Math.round(document.getElementsByTagName(mediaType)[0].volume*100 ); }
    // Using Math.round for volume to prevent showing a number that is one below a multiple of volume_step in case of floating-point rounding errors, since volume can be adjusted in either direction.

    // code deduplication
    function jumpNum(num) {
    @@ -112,7 +114,7 @@ window.onkeydown = function(e) {
    // increase volume by the value in volume_step
    document.getElementsByTagName(mediaType)[0].volume+=volume_step ;
    }
    console.log("Volume: " + Math.round(document.getElementsByTagName(mediaType)[0].volume*100 ) + " %");
    console.log("Volume: " + getVol(); + "%" );
    }
    if (key == 173 || key == 109) {
    // set volume to 0% if below volume_step
    @@ -122,7 +124,7 @@ window.onkeydown = function(e) {
    // decrease volume by the value in volume_step
    document.getElementsByTagName(mediaType)[0].volume-=volume_step ;
    }
    console.log("Volume: " + Math.round(document.getElementsByTagName(mediaType)[0].volume*100 ) + " %");
    console.log("Volume: " + getVol(); + "%" );
    }


  4. HT-7 revised this gist 11 hours ago. 1 changed file with 46 additions and 43 deletions.
    89 playback keyboard controls.js
    View file
    @@ -2,18 +2,20 @@
    // (currently only works on dedicated media pages)

    // Configuration
    jump_distance_forward = 10 // Jump this many seconds forward with right arrow key.
    jump_distance_backward = 5 // Jump this many seconds backward with left arrow key.
    speed_step = 1/4 // Speed incresaed or decreased by this value.
    volume_step = 1/10 // Volume increased or decreased by this value.
    jump_distance_forward = 10; // Jump this many seconds forward using right arrow key.
    jump_distance_backward = 5; // Jump this many seconds backward using left arrow key.
    speed_step = 1/4; // Speed increased or decreased by this value using arrow keys up and down.
    volume_step = 1/10; // Volume increased or decreased by this value using +-.
    // Seek: 0 to 9 Reset the speed using "Insert".

    var mediaType; // for compatibility
    var playerExists = 0; // set to 1 below if player exists

    function checkMediaType() {
    // checks whether it is a video or audio tag
    // checks whether it is a video or an audio tag
    mediaTypeBeforeCheck = mediaType;
    if (document.getElementsByTagName("video")[0]) mediaType = "video";
    if (document.getElementsByTagName("audio")[0]) mediaType = "audio";
    if (document.getElementsByTagName("video")[0]) { playerExists = 1; mediaType = "video"; }
    if (document.getElementsByTagName("audio")[0]) { playerExists = 1; mediaType = "audio"; }
    mediaTypeAfterCheck = mediaType;
    if (mediaTypeBeforeCheck != mediaTypeAfterCheck)
    // Only show media type in console if it has changed.
    @@ -28,54 +30,49 @@ window.addEventListener("keydown", function() { checkMediaType(); } );
    function getCurrentTime() { return Math.round( document.getElementsByTagName(mediaType)[0].currentTime ); }
    function getDuration() { return Math.round( document.getElementsByTagName(mediaType)[0].duration ); }

    // code deduplication
    function jumpNum(num) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.1*num ;
    console.log("Position: "+ 10*num +"% Time: " + getCurrentTime() + " / " + getDuration() + " s" );
    }

    window.onkeydown = function(e) {
    var key = e.keyCode ? e.keyCode : e.which;
    var key = e.keyCode ? e.keyCode : e.which;
    if (playerExists == 1) {

    // Keys 0 to 9 of main row and NUM pad, and also Home and End.
    // Keys 0 to 9 of main row and NUM pad, and also "Home" and "End".
    if (key == 48 || key == 96 || key == 36) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.0 ;
    console.log("Position: 0% Time: " + getCurrentTime() + " / " + getDuration() + " s" );
    jumpNum(0);
    }
    if (key == 49 || key == 97) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.1 ;
    console.log("Position: 10% Time: " + getCurrentTime() + " / " + getDuration() + " s" );
    jumpNum(1);
    }
    if (key == 50 || key == 98) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.2 ;
    console.log("Position: 20% Time: " + getCurrentTime() + " / " + getDuration() + " s" );
    }
    jumpNum(2);
    }
    if (key == 51 || key == 99) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.3 ;
    console.log("Position: 30% Time: " + getCurrentTime() + " / " + getDuration() + " s" );
    jumpNum(3);
    }
    if (key == 52 || key == 100) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.4 ;
    console.log("Position: 40% Time: " + getCurrentTime() + " / " + getDuration() + " s" );
    jumpNum(4);
    }
    if (key == 53 || key == 101) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.5 ;
    console.log("Position: 50% Time: " + getCurrentTime() + " / " + getDuration() + " s" );
    jumpNum(5);
    }
    if (key == 54 || key == 102) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.6 ;
    console.log("Position: 60% Time: " + getCurrentTime() + " / " + getDuration() + " s" );
    jumpNum(6);
    }
    if (key == 55 || key == 103) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.7 ;
    console.log("Position: 70% Time: " + getCurrentTime() + " / " + getDuration() + " s" );
    jumpNum(7);
    }
    if (key == 56 || key == 104) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.8 ;
    console.log("Position: 80% Time: " + getCurrentTime() + " / " + getDuration() + " s" );
    jumpNum(8);
    }
    if (key == 57 || key == 105) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.9 ;
    console.log("Position: 90% Time: " + getCurrentTime() + " / " + getDuration() + " s" );
    jumpNum(9);
    }
    if (key == 35) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*1.0 ;
    console.log("Position: 100% Time: " + getCurrentTime() + " / " + getDuration() + " s" );
    jumpNum(10);
    }

    // Time skipping with left and right arrow keys.
    @@ -89,27 +86,32 @@ window.onkeydown = function(e) {
    }


    // Speed control with up and down arrow keys.
    // Speed control with up and down arrow keys, and reset with "Home" key.
    if (key == 38) {
    document.getElementsByTagName(mediaType)[0].playbackRate+=speed_step ;
    console.log("Speed: " + document.getElementsByTagName(mediaType)[0].playbackRate);
    }
    if (key == 40 && document.getElementsByTagName(mediaType)[0].playbackRate >= speed_step) {
    // speed below 0 causes DOMException: Operation is not supported
    // Preventing speed below 0 that would cause "DOMException: Operation is not supported".
    document.getElementsByTagName(mediaType)[0].playbackRate-=speed_step ;
    console.log("Speed: " + document.getElementsByTagName(mediaType)[0].playbackRate);
    }
    if (key == 45) {
    // reset speed using "Insert" key
    document.getElementsByTagName(mediaType)[0].playbackRate=1;
    console.log("Speed reset to 1.");
    }


    // Volume control (+ -)
    if (key == 171 || key == 107) {
    // set volume to 100% if closer to it than the value in volume_step to prevent errors
    if (document.getElementsByTagName(mediaType)[0].volume >= (1-volume_step) ) {
    document.getElementsByTagName(mediaType)[0].volume = 1;
    } else {
    // increase volume by the value in volume_step
    document.getElementsByTagName(mediaType)[0].volume+=volume_step ;
    }
    // set volume to 100% if closer to it than the value in volume_step to prevent errors
    if (document.getElementsByTagName(mediaType)[0].volume >= (1-volume_step) ) {
    document.getElementsByTagName(mediaType)[0].volume = 1;
    } else {
    // increase volume by the value in volume_step
    document.getElementsByTagName(mediaType)[0].volume+=volume_step ;
    }
    console.log("Volume: " + Math.round(document.getElementsByTagName(mediaType)[0].volume*100 ) + " %");
    }
    if (key == 173 || key == 109) {
    @@ -121,7 +123,8 @@ window.onkeydown = function(e) {
    document.getElementsByTagName(mediaType)[0].volume-=volume_step ;
    }
    console.log("Volume: " + Math.round(document.getElementsByTagName(mediaType)[0].volume*100 ) + " %");
    }
    }


    };
    }
    };
  5. HT-7 revised this gist 5 days ago. 1 changed file with 2 additions and 2 deletions.
    4 playback keyboard controls.js
    View file
    @@ -21,8 +21,8 @@ mediaTypeAfterCheck = mediaType;
    }

    // Additional checks to ensure the player is detected
    document.getElementById("content").onclick = function() { checkMediaType(); };
    window.addEventListener("keydown", function() { checkMediaType(); } );
    window.onclick = function() { checkMediaType(); };
    window.addEventListener("keydown", function() { checkMediaType(); } );

    // shortcuts for current time and duration
    function getCurrentTime() { return Math.round( document.getElementsByTagName(mediaType)[0].currentTime ); }
  6. HT-7 revised this gist 6 days ago. No changes.
  7. HT-7 revised this gist 6 days ago. 1 changed file with 6 additions and 5 deletions.
    11 playback keyboard controls.js
    View file
    @@ -1,8 +1,9 @@
    // Playback keyboard controls script
    // (currently only works on dedicated file pages)
    // (currently only works on dedicated media pages)

    // Configuration
    jump_distance = 10 // Jump this many seconds with arrow keys.
    jump_distance_forward = 10 // Jump this many seconds forward with right arrow key.
    jump_distance_backward = 5 // Jump this many seconds backward with left arrow key.
    speed_step = 1/4 // Speed incresaed or decreased by this value.
    volume_step = 1/10 // Volume increased or decreased by this value.

    @@ -31,7 +32,7 @@ function getDuration() { return Math.round( document.getElementsByTagName(med
    window.onkeydown = function(e) {
    var key = e.keyCode ? e.keyCode : e.which;

    // Keys 0 to 9 of main row and NUM pad; also Home and End.
    // Keys 0 to 9 of main row and NUM pad, and also Home and End.
    if (key == 48 || key == 96 || key == 36) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.0 ;
    console.log("Position: 0% Time: " + getCurrentTime() + " / " + getDuration() + " s" );
    @@ -79,11 +80,11 @@ window.onkeydown = function(e) {

    // Time skipping with left and right arrow keys.
    if (key == 37) {
    document.getElementsByTagName(mediaType)[0].currentTime-=jump_distance ;
    document.getElementsByTagName(mediaType)[0].currentTime-=jump_distance_backward ;
    console.log("Time: " + getCurrentTime() + " / " + getDuration() + " s" );
    }
    if (key == 39) {
    document.getElementsByTagName(mediaType)[0].currentTime+=jump_distance ;
    document.getElementsByTagName(mediaType)[0].currentTime+=jump_distance_forward ;
    console.log("Time: " + getCurrentTime() + " / " + getDuration() + " s" );
    }

  8. HT-7 revised this gist 6 days ago. 1 changed file with 6 additions and 6 deletions.
    12 playback keyboard controls.js
    View file
    @@ -2,7 +2,7 @@
    // (currently only works on dedicated file pages)

    // Configuration
    jump_distance = 10 // Jump this many seconds with arrow keys
    jump_distance = 10 // Jump this many seconds with arrow keys.
    speed_step = 1/4 // Speed incresaed or decreased by this value.
    volume_step = 1/10 // Volume increased or decreased by this value.

    @@ -23,7 +23,7 @@ mediaTypeAfterCheck = mediaType;
    document.getElementById("content").onclick = function() { checkMediaType(); };
    window.addEventListener("keydown", function() { checkMediaType(); } );

    // shortcut for current time and duration
    // shortcuts for current time and duration
    function getCurrentTime() { return Math.round( document.getElementsByTagName(mediaType)[0].currentTime ); }
    function getDuration() { return Math.round( document.getElementsByTagName(mediaType)[0].duration ); }

    @@ -77,7 +77,7 @@ window.onkeydown = function(e) {
    console.log("Position: 100% Time: " + getCurrentTime() + " / " + getDuration() + " s" );
    }

    // Time jumping (left/right)
    // Time skipping with left and right arrow keys.
    if (key == 37) {
    document.getElementsByTagName(mediaType)[0].currentTime-=jump_distance ;
    console.log("Time: " + getCurrentTime() + " / " + getDuration() + " s" );
    @@ -88,7 +88,7 @@ window.onkeydown = function(e) {
    }


    // Speed control (up/down)
    // Speed control with up and down arrow keys.
    if (key == 38) {
    document.getElementsByTagName(mediaType)[0].playbackRate+=speed_step ;
    console.log("Speed: " + document.getElementsByTagName(mediaType)[0].playbackRate);
    @@ -100,9 +100,9 @@ window.onkeydown = function(e) {
    }


    // Volume control (+/-)
    // Volume control (+ -)
    if (key == 171 || key == 107) {
    // set volume to 100% if 90% or above
    // set volume to 100% if closer to it than the value in volume_step to prevent errors
    if (document.getElementsByTagName(mediaType)[0].volume >= (1-volume_step) ) {
    document.getElementsByTagName(mediaType)[0].volume = 1;
    } else {
  9. HT-7 revised this gist 6 days ago. 1 changed file with 2 additions and 2 deletions.
    4 playback keyboard controls.js
    View file
    @@ -20,8 +20,8 @@ mediaTypeAfterCheck = mediaType;
    }

    // Additional checks to ensure the player is detected
    document.getElementById("content").onclick = function() { checkMediaType(); setTimeout( checkMediaType(), 1000 ) };
    document.getElementById("content").onkeydown = function() { checkMediaType(); setTimeout( checkMediaType(), 1000 ) };
    document.getElementById("content").onclick = function() { checkMediaType(); };
    window.addEventListener("keydown", function() { checkMediaType(); } );

    // shortcut for current time and duration
    function getCurrentTime() { return Math.round( document.getElementsByTagName(mediaType)[0].currentTime ); }
  10. HT-7 revised this gist 6 days ago. 1 changed file with 5 additions and 1 deletion.
    6 playback keyboard controls.js
    View file
    @@ -10,9 +10,13 @@ var mediaType; // for compatibility

    function checkMediaType() {
    // checks whether it is a video or audio tag
    mediaTypeBeforeCheck = mediaType;
    if (document.getElementsByTagName("video")[0]) mediaType = "video";
    if (document.getElementsByTagName("audio")[0]) mediaType = "audio";
    console.log("Detected media type: " + mediaType);
    mediaTypeAfterCheck = mediaType;
    if (mediaTypeBeforeCheck != mediaTypeAfterCheck)
    // Only show media type in console if it has changed.
    console.log("Detected media type: " + mediaType);
    }

    // Additional checks to ensure the player is detected
  11. HT-7 revised this gist 6 days ago. 1 changed file with 3 additions and 3 deletions.
    6 playback keyboard controls.js
    View file
    @@ -15,13 +15,13 @@ if (document.getElementsByTagName("audio")[0]) mediaType = "audio";
    console.log("Detected media type: " + mediaType);
    }

    // Since the video or audio element only loads when starting playback on the legacy player (.mwPlayerContainer .k-player), the type needs to be checked on each click.
    // Additional check after a second to prevent checking before the player is loaded.
    // Additional checks to ensure the player is detected
    document.getElementById("content").onclick = function() { checkMediaType(); setTimeout( checkMediaType(), 1000 ) };
    document.getElementById("content").onkeydown = function() { checkMediaType(); setTimeout( checkMediaType(), 1000 ) };

    // shortcut for current time and duration
    function getCurrentTime() { return Math.round( document.getElementsByTagName(mediaType)[0].currentTime ); }
    function getDuration() { return Math.round( document.getElementsByTagName(mediaType)[0].duration ); }
    function getDuration() { return Math.round( document.getElementsByTagName(mediaType)[0].duration ); }


    window.onkeydown = function(e) {
  12. HT-7 revised this gist 6 days ago. 1 changed file with 32 additions and 27 deletions.
    59 playback keyboard controls.js
    View file
    @@ -1,6 +1,10 @@
    // Playback keyboard controls script
    // (currently only works on dedicated file pages)

    // Configuration
    jump_distance = 10 // Jump this many seconds with arrow keys
    speed_step = 1/4 // Speed incresaed or decreased by this value.
    volume_step = 1/10 // Volume increased or decreased by this value.

    var mediaType; // for compatibility

    @@ -15,8 +19,9 @@ console.log("Detected media type: " + mediaType);
    // Additional check after a second to prevent checking before the player is loaded.
    document.getElementById("content").onclick = function() { checkMediaType(); setTimeout( checkMediaType(), 1000 ) };

    // shortcut for current time
    function getCurrentTime() { return document.getElementsByTagName(mediaType)[0].currentTime; }
    // shortcut for current time and duration
    function getCurrentTime() { return Math.round( document.getElementsByTagName(mediaType)[0].currentTime ); }
    function getDuration() { return Math.round( document.getElementsByTagName(mediaType)[0].duration ); }


    window.onkeydown = function(e) {
    @@ -25,90 +30,90 @@ window.onkeydown = function(e) {
    // Keys 0 to 9 of main row and NUM pad; also Home and End.
    if (key == 48 || key == 96 || key == 36) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.0 ;
    console.log("Position: 0% Time: " + Math.round(getCurrentTime() ) );
    console.log("Position: 0% Time: " + getCurrentTime() + " / " + getDuration() + " s" );
    }
    if (key == 49 || key == 97) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.1 ;
    console.log("Position: 10% Time: " + Math.round(getCurrentTime() ) );
    console.log("Position: 10% Time: " + getCurrentTime() + " / " + getDuration() + " s" );
    }
    if (key == 50 || key == 98) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.2 ;
    console.log("Position: 20% Time: " + Math.round(getCurrentTime() ) );
    console.log("Position: 20% Time: " + getCurrentTime() + " / " + getDuration() + " s" );
    }
    if (key == 51 || key == 99) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.3 ;
    console.log("Position: 30% Time: " + Math.round(getCurrentTime() ) );
    console.log("Position: 30% Time: " + getCurrentTime() + " / " + getDuration() + " s" );
    }
    if (key == 52 || key == 100) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.4 ;
    console.log("Position: 40% Time: " + Math.round(getCurrentTime() ) );
    console.log("Position: 40% Time: " + getCurrentTime() + " / " + getDuration() + " s" );
    }
    if (key == 53 || key == 101) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.5 ;
    console.log("Position: 50% Time: " + Math.round(getCurrentTime() ) );
    console.log("Position: 50% Time: " + getCurrentTime() + " / " + getDuration() + " s" );
    }
    if (key == 54 || key == 102) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.6 ;
    console.log("Position: 60% Time: " + Math.round(getCurrentTime() ) );
    console.log("Position: 60% Time: " + getCurrentTime() + " / " + getDuration() + " s" );
    }
    if (key == 55 || key == 103) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.7 ;
    console.log("Position: 70% Time: " + Math.round(getCurrentTime() ) );
    console.log("Position: 70% Time: " + getCurrentTime() + " / " + getDuration() + " s" );
    }
    if (key == 56 || key == 104) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.8 ;
    console.log("Position: 80% Time: " + Math.round(getCurrentTime() ) );
    console.log("Position: 80% Time: " + getCurrentTime() + " / " + getDuration() + " s" );
    }
    if (key == 57 || key == 105) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.9 ;
    console.log("Position: 90% Time: " + Math.round(getCurrentTime() ) );
    console.log("Position: 90% Time: " + getCurrentTime() + " / " + getDuration() + " s" );
    }
    if (key == 35) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*1.0 ;
    console.log("Position: 100% Time: " + Math.round(getCurrentTime() ) );
    console.log("Position: 100% Time: " + getCurrentTime() + " / " + getDuration() + " s" );
    }

    // Time jumping (left/right)
    if (key == 37) {
    document.getElementsByTagName(mediaType)[0].currentTime-=10 ;
    console.log("Time: " + Math.round(getCurrentTime() ) );
    document.getElementsByTagName(mediaType)[0].currentTime-=jump_distance ;
    console.log("Time: " + getCurrentTime() + " / " + getDuration() + " s" );
    }
    if (key == 39) {
    document.getElementsByTagName(mediaType)[0].currentTime+=10 ;
    console.log("Time: " + Math.round(getCurrentTime() ) );
    document.getElementsByTagName(mediaType)[0].currentTime+=jump_distance ;
    console.log("Time: " + getCurrentTime() + " / " + getDuration() + " s" );
    }


    // Speed control (up/down)
    if (key == 38) {
    document.getElementsByTagName(mediaType)[0].playbackRate+=0.25 ;
    document.getElementsByTagName(mediaType)[0].playbackRate+=speed_step ;
    console.log("Speed: " + document.getElementsByTagName(mediaType)[0].playbackRate);
    }
    if (key == 40 && document.getElementsByTagName(mediaType)[0].playbackRate >= 0.25) {
    if (key == 40 && document.getElementsByTagName(mediaType)[0].playbackRate >= speed_step) {
    // speed below 0 causes DOMException: Operation is not supported
    document.getElementsByTagName(mediaType)[0].playbackRate-=0.25 ;
    document.getElementsByTagName(mediaType)[0].playbackRate-=speed_step ;
    console.log("Speed: " + document.getElementsByTagName(mediaType)[0].playbackRate);
    }


    // Volume control (+/-)
    if (key == 171 || key == 107) {
    // set volume to 100% if 90% or above
    if (document.getElementsByTagName(mediaType)[0].volume >= 0.9) {
    if (document.getElementsByTagName(mediaType)[0].volume >= (1-volume_step) ) {
    document.getElementsByTagName(mediaType)[0].volume = 1;
    } else {
    // increase volume by 10 %
    document.getElementsByTagName(mediaType)[0].volume+=0.1 ;
    // increase volume by the value in volume_step
    document.getElementsByTagName(mediaType)[0].volume+=volume_step ;
    }
    console.log("Volume: " + Math.round(document.getElementsByTagName(mediaType)[0].volume*100 ) + " %");
    }
    if (key == 173 || key == 109) {
    // set volume to 0% if 10% or below
    if (document.getElementsByTagName(mediaType)[0].volume <= 0.1) {
    // set volume to 0% if below volume_step
    if (document.getElementsByTagName(mediaType)[0].volume <= volume_step) {
    document.getElementsByTagName(mediaType)[0].volume = 0;
    } else {
    // decrease volume by 10 %
    document.getElementsByTagName(mediaType)[0].volume-=0.1 ;
    // decrease volume by the value in volume_step
    document.getElementsByTagName(mediaType)[0].volume-=volume_step ;
    }
    console.log("Volume: " + Math.round(document.getElementsByTagName(mediaType)[0].volume*100 ) + " %");
    }
  13. HT-7 revised this gist 6 days ago. 1 changed file with 2 additions and 2 deletions.
    4 playback keyboard controls.js
    View file
    @@ -100,7 +100,7 @@ window.onkeydown = function(e) {
    // increase volume by 10 %
    document.getElementsByTagName(mediaType)[0].volume+=0.1 ;
    }
    console.log("Volume: " + document.getElementsByTagName(mediaType)[0].volume*100 + " %");
    console.log("Volume: " + Math.round(document.getElementsByTagName(mediaType)[0].volume*100 ) + " %");
    }
    if (key == 173 || key == 109) {
    // set volume to 0% if 10% or below
    @@ -110,7 +110,7 @@ window.onkeydown = function(e) {
    // decrease volume by 10 %
    document.getElementsByTagName(mediaType)[0].volume-=0.1 ;
    }
    console.log("Volume: " + document.getElementsByTagName(mediaType)[0].volume*100 + " %");
    console.log("Volume: " + Math.round(document.getElementsByTagName(mediaType)[0].volume*100 ) + " %");
    }


  14. HT-7 revised this gist 6 days ago. 1 changed file with 18 additions and 14 deletions.
    32 playback keyboard controls.js
    View file
    @@ -12,7 +12,11 @@ console.log("Detected media type: " + mediaType);
    }

    // Since the video or audio element only loads when starting playback on the legacy player (.mwPlayerContainer .k-player), the type needs to be checked on each click.
    document.getElementById("content").onclick = function() { checkMediaType(); };
    // Additional check after a second to prevent checking before the player is loaded.
    document.getElementById("content").onclick = function() { checkMediaType(); setTimeout( checkMediaType(), 1000 ) };

    // shortcut for current time
    function getCurrentTime() { return document.getElementsByTagName(mediaType)[0].currentTime; }


    window.onkeydown = function(e) {
    @@ -21,57 +25,57 @@ window.onkeydown = function(e) {
    // Keys 0 to 9 of main row and NUM pad; also Home and End.
    if (key == 48 || key == 96 || key == 36) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.0 ;
    console.log("Position: 0% Time: " + document.getElementsByTagName(mediaType)[0].currentTime);
    console.log("Position: 0% Time: " + Math.round(getCurrentTime() ) );
    }
    if (key == 49 || key == 97) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.1 ;
    console.log("Position: 10% Time: " + document.getElementsByTagName(mediaType)[0].currentTime);
    console.log("Position: 10% Time: " + Math.round(getCurrentTime() ) );
    }
    if (key == 50 || key == 98) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.2 ;
    console.log("Position: 20% Time: " + document.getElementsByTagName(mediaType)[0].currentTime);
    console.log("Position: 20% Time: " + Math.round(getCurrentTime() ) );
    }
    if (key == 51 || key == 99) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.3 ;
    console.log("Position: 30% Time: " + document.getElementsByTagName(mediaType)[0].currentTime);
    console.log("Position: 30% Time: " + Math.round(getCurrentTime() ) );
    }
    if (key == 52 || key == 100) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.4 ;
    console.log("Position: 40% Time: " + document.getElementsByTagName(mediaType)[0].currentTime);
    console.log("Position: 40% Time: " + Math.round(getCurrentTime() ) );
    }
    if (key == 53 || key == 101) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.5 ;
    console.log("Position: 50% Time: " + document.getElementsByTagName(mediaType)[0].currentTime);
    console.log("Position: 50% Time: " + Math.round(getCurrentTime() ) );
    }
    if (key == 54 || key == 102) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.6 ;
    console.log("Position: 60% Time: " + document.getElementsByTagName(mediaType)[0].currentTime);
    console.log("Position: 60% Time: " + Math.round(getCurrentTime() ) );
    }
    if (key == 55 || key == 103) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.7 ;
    console.log("Position: 70% Time: " + document.getElementsByTagName(mediaType)[0].currentTime);
    console.log("Position: 70% Time: " + Math.round(getCurrentTime() ) );
    }
    if (key == 56 || key == 104) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.8 ;
    console.log("Position: 80% Time: " + document.getElementsByTagName(mediaType)[0].currentTime);
    console.log("Position: 80% Time: " + Math.round(getCurrentTime() ) );
    }
    if (key == 57 || key == 105) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.9 ;
    console.log("Position: 90% Time: " + document.getElementsByTagName(mediaType)[0].currentTime);
    console.log("Position: 90% Time: " + Math.round(getCurrentTime() ) );
    }
    if (key == 35) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*1.0 ;
    console.log("Position: 100% Time: " + document.getElementsByTagName(mediaType)[0].currentTime);
    console.log("Position: 100% Time: " + Math.round(getCurrentTime() ) );
    }

    // Time jumping (left/right)
    if (key == 37) {
    document.getElementsByTagName(mediaType)[0].currentTime-=10 ;
    console.log("Time: " + document.getElementsByTagName(mediaType)[0].currentTime);
    console.log("Time: " + Math.round(getCurrentTime() ) );
    }
    if (key == 39) {
    document.getElementsByTagName(mediaType)[0].currentTime+=10 ;
    console.log("Time: " + document.getElementsByTagName(mediaType)[0].currentTime);
    console.log("Time: " + Math.round(getCurrentTime() ) );
    }


  15. HT-7 created this gist 6 days ago.
    113 playback keyboard controls.js
    View file
    @@ -0,0 +1,113 @@
    // Playback keyboard controls script
    // (currently only works on dedicated file pages)


    var mediaType; // for compatibility

    function checkMediaType() {
    // checks whether it is a video or audio tag
    if (document.getElementsByTagName("video")[0]) mediaType = "video";
    if (document.getElementsByTagName("audio")[0]) mediaType = "audio";
    console.log("Detected media type: " + mediaType);
    }

    // Since the video or audio element only loads when starting playback on the legacy player (.mwPlayerContainer .k-player), the type needs to be checked on each click.
    document.getElementById("content").onclick = function() { checkMediaType(); };


    window.onkeydown = function(e) {
    var key = e.keyCode ? e.keyCode : e.which;

    // Keys 0 to 9 of main row and NUM pad; also Home and End.
    if (key == 48 || key == 96 || key == 36) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.0 ;
    console.log("Position: 0% Time: " + document.getElementsByTagName(mediaType)[0].currentTime);
    }
    if (key == 49 || key == 97) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.1 ;
    console.log("Position: 10% Time: " + document.getElementsByTagName(mediaType)[0].currentTime);
    }
    if (key == 50 || key == 98) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.2 ;
    console.log("Position: 20% Time: " + document.getElementsByTagName(mediaType)[0].currentTime);
    }
    if (key == 51 || key == 99) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.3 ;
    console.log("Position: 30% Time: " + document.getElementsByTagName(mediaType)[0].currentTime);
    }
    if (key == 52 || key == 100) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.4 ;
    console.log("Position: 40% Time: " + document.getElementsByTagName(mediaType)[0].currentTime);
    }
    if (key == 53 || key == 101) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.5 ;
    console.log("Position: 50% Time: " + document.getElementsByTagName(mediaType)[0].currentTime);
    }
    if (key == 54 || key == 102) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.6 ;
    console.log("Position: 60% Time: " + document.getElementsByTagName(mediaType)[0].currentTime);
    }
    if (key == 55 || key == 103) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.7 ;
    console.log("Position: 70% Time: " + document.getElementsByTagName(mediaType)[0].currentTime);
    }
    if (key == 56 || key == 104) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.8 ;
    console.log("Position: 80% Time: " + document.getElementsByTagName(mediaType)[0].currentTime);
    }
    if (key == 57 || key == 105) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*0.9 ;
    console.log("Position: 90% Time: " + document.getElementsByTagName(mediaType)[0].currentTime);
    }
    if (key == 35) {
    document.getElementsByTagName(mediaType)[0].currentTime=document.getElementsByTagName(mediaType)[0].duration*1.0 ;
    console.log("Position: 100% Time: " + document.getElementsByTagName(mediaType)[0].currentTime);
    }

    // Time jumping (left/right)
    if (key == 37) {
    document.getElementsByTagName(mediaType)[0].currentTime-=10 ;
    console.log("Time: " + document.getElementsByTagName(mediaType)[0].currentTime);
    }
    if (key == 39) {
    document.getElementsByTagName(mediaType)[0].currentTime+=10 ;
    console.log("Time: " + document.getElementsByTagName(mediaType)[0].currentTime);
    }


    // Speed control (up/down)
    if (key == 38) {
    document.getElementsByTagName(mediaType)[0].playbackRate+=0.25 ;
    console.log("Speed: " + document.getElementsByTagName(mediaType)[0].playbackRate);
    }
    if (key == 40 && document.getElementsByTagName(mediaType)[0].playbackRate >= 0.25) {
    // speed below 0 causes DOMException: Operation is not supported
    document.getElementsByTagName(mediaType)[0].playbackRate-=0.25 ;
    console.log("Speed: " + document.getElementsByTagName(mediaType)[0].playbackRate);
    }


    // Volume control (+/-)
    if (key == 171 || key == 107) {
    // set volume to 100% if 90% or above
    if (document.getElementsByTagName(mediaType)[0].volume >= 0.9) {
    document.getElementsByTagName(mediaType)[0].volume = 1;
    } else {
    // increase volume by 10 %
    document.getElementsByTagName(mediaType)[0].volume+=0.1 ;
    }
    console.log("Volume: " + document.getElementsByTagName(mediaType)[0].volume*100 + " %");
    }
    if (key == 173 || key == 109) {
    // set volume to 0% if 10% or below
    if (document.getElementsByTagName(mediaType)[0].volume <= 0.1) {
    document.getElementsByTagName(mediaType)[0].volume = 0;
    } else {
    // decrease volume by 10 %
    document.getElementsByTagName(mediaType)[0].volume-=0.1 ;
    }
    console.log("Volume: " + document.getElementsByTagName(mediaType)[0].volume*100 + " %");
    }


    };