NOTICE: By continued use of this site you understand and agree to the binding Terms of Service and Privacy Policy.
// ==UserScript==
// @name Floating youtube player
// @namespace https://www.youtube.com/
// @version 1.0
// @license MIT
// @description Make youtube player float
// @author pcktm
// @icon https://youtube.com/favicon.ico
// @match https://www.youtube.com/watch?v=*
// @grant none
// @require https://code.jquery.com/jquery-3.3.1.slim.min.js
// ==/UserScript==
(function () {
'use strict';
console.log('Floating youtube init');
})();
let state = {
bool: 1
};
let element = $('video')
$(window).scroll(function () {
if ($('.title').visible()) {
if (state.bool == 0) {
element.attr('style', state.initStyle);
state.bool = 1;
}
}
else {
if (state.bool == 1) {
state.initStyle = element.attr("style")
var size = {
width: state.initStyle.split(';')[0].split(' ')[1].slice(0, -2),
height: state.initStyle.split(';')[1].split(' ')[2].slice(0, -2)
}
size.calc = calculateAspectRatioFit(size.width, size.height, $(window).width() / 3, $(window).width() / 3)
element.attr('style', '');
element.css({
'position': 'fixed',
'left': $(window).width() - $(window).width() / 30 - size.calc.width + 'px',
'top': $(window).height() - $(window).height() / 30 - size.calc.height + 'px',
'width': size.calc.width,
'height': size.calc.height
})
state.bool = 0;
}
}
})
function calculateAspectRatioFit(srcWidth, srcHeight, maxWidth, maxHeight) {
var ratio = Math.min(maxWidth / srcWidth, maxHeight / srcHeight);
return {
width: srcWidth * ratio,
height: srcHeight * ratio
};
}
//EXTERNAL JQUERY PLUGIN THAT GREASESCRIPT DIDN'T LET ME LOAD (JQUERY VISIBLE)
! function (t) {
var i = t(window);
t.fn.visible = function (t, e, o) {
if (!(this.length < 1)) {
var r = this.length > 1 ? this.eq(0) : this,
n = r.get(0),
f = i.width(),
h = i.height(),
o = o ? o : "both",
l = e === !0 ? n.offsetWidth * n.offsetHeight : !0;
if ("function" == typeof n.getBoundingClientRect) {
var g = n.getBoundingClientRect(),
u = g.top >= 0 && g.top < h,
s = g.bottom > 0 && g.bottom <= h,
c = g.left >= 0 && g.left < f,
a = g.right > 0 && g.right <= f,
v = t ? u || s : u && s,
b = t ? c || a : c && a;
if ("both" === o) return l && v && b;
if ("vertical" === o) return l && v;
if ("horizontal" === o) return l && b
}
else {
var d = i.scrollTop(),
p = d + h,
w = i.scrollLeft(),
m = w + f,
y = r.offset(),
z = y.top,
B = z + r.height(),
C = y.left,
R = C + r.width(),
j = t === !0 ? B : z,
q = t === !0 ? z : B,
H = t === !0 ? R : C,
L = t === !0 ? C : R;
if ("both" === o) return !!l && p >= q && j >= d && m >= L && H >= w;
if ("vertical" === o) return !!l && p >= q && j >= d;
if ("horizontal" === o) return !!l && m >= L && H >= w
}
}
}
}(jQuery);