Support keyboard shortcuts in web editor for contributions

[ocram]

[ocram]

Keyboard shortcuts

Already implemented

Built-in with most web browsers

• Play or pause: SPACE
• Enter or leave fullscreen: F11

Possible additions

• Skip forward (plus 5 seconds): ARROW RIGHT
• Skip forward (plus 20 seconds): CTRL + ARROW RIGHT
• Skip forward (plus 1 minute): SHIFT + ARROW RIGHT
• Skip forward (plus 4 minutes): ALT + ARROW RIGHT
• Skip backward (minus 5 seconds): ARROW LEFT
• Skip backward (minus 20 seconds): CTRL + ARROW LEFT
• Skip backward (minus 1 minute): SHIFT + ARROW LEFT
• Skip backward (minus 4 minutes): ALT + ARROW LEFT
• Move to next frame: DOT
• Move to previous frame: COMMA
• Increase speed (plus 0.25x): PLUS
• Increase speed (plus 0.1x): CTRL + PLUS
• Increase speed (plus 0.02x): ALT + PLUS
• Decrease speed (minus 0.25x): MINUS
• Decrease speed (minus 0.1x): CTRL + MINUS
• Decrease speed (minus 0.02x): ALT + MINUS
• Reset speed (to 1.00x): EQUALS
• Start cut: DELETE
• End cut: ENTER
• Cancel cut: INSERT
• Increase volume (plus 10 %): ARROW UP
• Decrease volume (minus 10 %): ARROW DOWN

Implementation in JavaScript

window.addEventListener("keydown", function (event) {
    // if the event has already been processed
    if (event.defaultPrevented) {
        // do nothing
        return;
    }

    switch (event.key) {
        /*case " ":
            // Play or pause
            break;*/
        case "ArrowRight":
            if (event.ctrlKey) {
                // TODO: Skip forward (plus 20 seconds)
            }
            else if (event.shiftKey) {
                // TODO: Skip forward (plus 1 minute)
            }
            else if (event.altKey) {
                // TODO: Skip forward (plus 4 minutes)
            }
            else {
                // TODO: Skip forward (plus 5 seconds)
            }

            break;
        case "ArrowLeft":
            if (event.ctrlKey) {
                // TODO: Skip backward (minus 20 seconds)
            }
            else if (event.shiftKey) {
                // TODO: Skip backward (minus 1 minute)
            }
            else if (event.altKey) {
                // TODO: Skip backward (minus 4 minutes)
            }
            else {
                // TODO: Skip backward (minus 5 seconds)
            }

            break;
        case ".":
            // TODO: Move to next frame
            break;
        case ",":
            // TODO: Move to previous frame
            break;
        case "+":
            if (event.ctrlKey) {
                // TODO: Increase speed (plus 0.1x)
            }
            else if (event.altKey) {
                // TODO: Increase speed (plus 0.02x)
            }
            else {
                // TODO: Increase speed (plus 0.25x)
            }

            break;
        case "-":
            if (event.ctrlKey) {
                // TODO: Decrease speed (minus 0.1x)
            }
            else if (event.altKey) {
                // TODO: Decrease speed (minus 0.02x)
            }
            else {
                // TODO: Decrease speed (minus 0.25x)
            }

            break;
        case "=":
            // TODO: Reset speed (to 1.00x)
            break;
        case "Delete":
            // TODO: Start cut
            break;
        case "Enter":
            // TODO: End cut
            break;
        case "Insert":
            // TODO: Cancel cut
            break;
        case "ArrowUp":
            // TODO: Increase volume (plus 10 %)
            break;
        case "ArrowDown":
            // TODO: Decrease volume (minus 10 %)
            break;
        /*case "F11":
            // Enter or leave fullscreen
            break;*/
        default:
            return;
    }

    // cancel the default action to avoid the event being handled twice
    event.preventDefault();
}, true);