A common but frustrating user-interface thing that we see in video or audio playing devices is they use one key for both play and pause. That's easy for humans, but annoying for us because we want to know that when we sent a certain keypress the video stops, and a different key will start it, so we don't end up 'de synchronized' if the keypress is missed or double-counted somehow.

This script alters behavior on youtube.com so that pressing "p" will pause the video if it was playing. Youtube has a keypress "k" which will pause a playing video or restart a paused video, but for our program we need a way to get the video into a known state. Otherwise, the program could work backwards--pausing when you pedal, playing when you stop.

A simple extension solves this problem and gives us different keys for playing and pausing videos.

Open the Chromium browser on your Pi, go to the Chrome Web Store, and install the "tampermonkey" extension. This extension allows the installation of "user scripts", which can modify the behavior of websites.

Once tampermonkey is installed, click here to download and install the script shown below. Tampermonkey will pop up a screen with an "install" button. Click it.

Head over to YouTube and check that you can pause the playing video by typing "p" and continue playback by pressing "k". If so, you're good to go. Otherwise, you will need to double check the above steps to make sure that the Tampermonkey extension and the Youtube Pause Key userscript are correctly installed.

(There are other extensions that add capabilities like this to YouTube, but they are very complex. We wrote our own so that you can see exactly what it does, and be confident it isn't doing anything you don't want.)

Click here to download and install the script shown below.

// ==UserScript==
// @name          Youtube Pause Key
// @version       1
// @namespace     http://unpythonic.net.com/youtube-pause-key
// @include       http://youtube.com/*
// @include       https://youtube.com/*
// @include       http://www.youtube.com/*
// @include       https://www.youtube.com/*
// @grant none
// ==/UserScript==

(function () {
    var inject = function() {
        var is_press_key = function (e, key) {
            document.last_target = e.target;
            document.last_event = e;
            var keyCode = e.keyCode ? e.keyCode : e.which;
            return (! (e.altKey || e.ctrlKey || e.metaKey)
                    && keyCode == key);
        }

        var gr_in_bg_event = function(e) {
            var pause_key = 112; // 'p' key
            var videos = e.target.getElementsByTagName('video');
            if(videos.length == 0) { return true; }
            if (is_press_key(e, pause_key)) {
                videos[0].pause();
                e.stopPropagation();
                e.preventDefault();
                return;
            }
            return true;
        }

        document.addEventListener("keypress", gr_in_bg_event, true);
    }

    var newel = document.createElement("script");
    var newcontent = document.createTextNode("(" + inject + ")()")
    newel.appendChild(newcontent);
    document.body.appendChild(newel);
})()

This guide was first published on Dec 02, 2020. It was last updated on Dec 02, 2020.

This page (Set up Chrome Browser Extension) was last updated on Oct 15, 2021.

Text editor powered by tinymce.