YouTube: make timer always shown

#javascript #tutorial #productivity #tooling

Sometimes, when listening to lectures on YouTube, I type notes in a personal notebook. I would usually want to make a reference to a time on a note.

The problem is that YouTube shows current time only when you move a mouse over video or hit stop/play. Then it quickly disappears making it a daunting experience to change windows, tap play/pause, take note of the time and repeat...

The timer lives in this element:

<span class="ytp-time-current">37:58</span>

When it's hidden, it's not ticking.

Make timer always on

1) Open dev tools -> find in the bottom tools panel a Search tool -> search for autohideupdate -> you will get 4 catches all in a file base.js.

At the moment of writing the file has this url:

www.youtube.com/s/player/89e685a2/player_ias.vflset/en_GB/base.js

The hash 89e685a2 will likely be updated with next release of this file.

2) In search results, selecting a row with the name ...H!==U&&Q.publish("autohideupdate",U) will take you to this fragment in the base.js file.

3) Click the Pretty Print button {}.

4) Right click in the window with this file -> select Override Content -> Select location for the overrides.

5) Comment out this row as follows:

Dd = function(Q, U, q) {
    Q.GC();
    var H = J2(Q);
    q ? (Q.C |= U,
    U & 1 && Q.u2.start(),
    U & 2 && Q.ZE.start(),
    U & 2048 && Q.AG.start()) : (Q.C &= ~U,
    U & 1 && Q.u2.stop(),
    U & 2 && Q.ZE.stop(),
    U & 2048 && Q.AG.stop(),
    U & 512 && Q.hG.stop());
    Q.C & 512 && !(Q.C & 128) && g.Z6(Q.hG, Q.XZ);
    U = J2(Q);
    // H !== U && Q.publish("autohideupdate", U) 
    // this call is disabled now
}