Add button in YouTube video player controls for hiding/showing controls. (They do not auto-hide when video is paused.)
/* This work is free. You can redistribute it and/or modify it under the
terms of the Do What The Fuck You Want To Public License, Version 2,
as published by Sam Hocevar. See http://www.wtfpl.net/ for more details.*/
// ==UserScript==
// @name YouTube - hide controls
// @namespace http://ttmyller.azurewebsites.net/
// @license WTFPL; http://www.wtfpl.net/
// @version 0.3
// @description Add button in YouTube video player controls for hiding/showing controls. (They do not auto-hide when video is paused.)
// @author ttmyller
// @include https://www.youtube.com/*
// @require http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js
// ==/UserScript==
(function() {
'use strict';
var setupButton = function(hidden) {
btn.prop('title', hidden ? 'Show controls' : 'Hide controls');
btn.html(hidden ? '' : 'hide');
btn.css('background-color', hidden ? 'rgba(255,255,255,0.1)' : 'rgba(255,255,255,0)');
btn.prop('aria-pressed', hidden);
};
// create button
var btn = $('<button class="ytp-button" />');
setupButton(false);
btn.css('float', 'left');
btn.click(function (e) {
var hidden = btn.prop('aria-pressed');
$('.ytp-gradient-bottom').toggle(hidden);
$('.ytp-gradient-top').toggle(hidden);
$('.ytp-chrome-top').toggle(hidden);
$('.ytp-progress-bar-container').toggle(hidden);
$('.ytp-left-controls').toggle(hidden);
$('.ytp-right-controls').toggle(hidden);
$('.ytp-pause-overlay').toggle(hidden);
$('.ytp-large-play-button').toggle(hidden);
$('.ytp-button.ytp-expand').toggle(hidden);
$('.video-annotations').toggle(hidden);
setupButton(!hidden);
});
$('.ytp-chrome-controls').prepend(btn);
})();