For a brief moment, I got this extension to autoremove unnecessary black bars. Progress!
This commit is contained in:
parent
90fdfe1a2c
commit
f64993a0d1
@ -77,6 +77,10 @@ At the moment, I'm not aware of anything that this extension advertises not work
|
|||||||
|
|
||||||
## Changelog
|
## Changelog
|
||||||
|
|
||||||
|
###v1.2.0 (this repo, unstable as fuck)
|
||||||
|
|
||||||
|
* After an afternoon's worth of work, I managed to get the Rube Goldberg machine (that automagically removes unnecessary black borders on ultrawide videos — on netflix only) working for a few moments before the background script crashed. Now that feature only needs a bit of a polish (and by 'a bit', I mean a metric ton of it). gg
|
||||||
|
|
||||||
###v1.1.1 (waiting for approval)
|
###v1.1.1 (waiting for approval)
|
||||||
|
|
||||||
* Fixed zooming issue on netflix
|
* Fixed zooming issue on netflix
|
||||||
|
134
js/uw-bg.js
134
js/uw-bg.js
@ -1,7 +1,11 @@
|
|||||||
debugmsg = true;
|
debugmsg = false;
|
||||||
|
debugmsg_imdb = true;
|
||||||
url_changed = false;
|
url_changed = false;
|
||||||
|
if(debugmsg){
|
||||||
|
console.log(". . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . ");
|
||||||
|
console.log("\nLoading ultrawidify background script (uw-bg)\nIf you can see this, extension at least tried to load\n\nRandom number: ",Math.floor(Math.random() * 20) + 1,"\n");
|
||||||
|
console.log(". . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . ");
|
||||||
|
}
|
||||||
/********************************************
|
/********************************************
|
||||||
**** script-related stuff starts here ****
|
**** script-related stuff starts here ****
|
||||||
********************************************/
|
********************************************/
|
||||||
@ -22,14 +26,128 @@ function notifyChange(){
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
browser.tabs.onUpdated.addListener(notifyChange);
|
browser.tabs.onUpdated.addListener(notifyChange);
|
||||||
|
|
||||||
|
//BEGIN Goldberg machine that gets aspect ratio data off imdb
|
||||||
|
|
||||||
|
function getAspectRatio(title, sender_tab){
|
||||||
|
// presledki morajo biti zamenjani s +
|
||||||
|
// spaces need to be replaced with +
|
||||||
|
var rektitle = title.replace(/ /g, '+');
|
||||||
|
|
||||||
|
// Zdaj lahko pošljemo zahtevek na omdbapi
|
||||||
|
// now we can send a request to omdbapi
|
||||||
|
httpGET("http://www.omdbapi.com/?t=" + rektitle,
|
||||||
|
function(response, sender_tab) {
|
||||||
|
if(debugmsg || debugmsg_imdb)
|
||||||
|
console.log("uw-bg::getAspectRatio | omdbapi gave us this: ", response);
|
||||||
|
|
||||||
|
var info = JSON.parse(response);
|
||||||
|
if(debugmsg || debugmsg_imdb){
|
||||||
|
console.log("uw-bg::getAspectRatio | movie title: »»", info.Title, "«« | imdb ID:", info.imdbID,"\nTrying to get technical specs off IMDB");
|
||||||
|
}
|
||||||
|
httpGET("https://www.imdb.com/title/" + info.imdbID + "/technical",
|
||||||
|
function(response, sender_tab){
|
||||||
|
var lines = response.split('\n');
|
||||||
|
if(debugmsg || debugmsg_imdb){
|
||||||
|
console.log("uw-bg::getAspectRatio | we just got something off IMDB, it's",lines.length,"long. Here's what we got:\n",response);
|
||||||
|
}
|
||||||
|
|
||||||
|
// IMDB nam zraven da veliko nepotrebnega sranja. Na testni strani je bil relevanten podatek
|
||||||
|
// 700+ (!) vrstic globoko. Stvar, ki nam jo da IMDB ima 1500+ vrstic. Iskanje bomo zato začeli
|
||||||
|
// od sredine
|
||||||
|
//
|
||||||
|
// IMDB gives us a lot of unnecessary shit along with the data we want. On our test page the
|
||||||
|
// relevant data was buried 700+ lines deep (1500+ lines total). Because we don't want to
|
||||||
|
// pointlessly search half the page, the best place to start seems to be the middle.
|
||||||
|
|
||||||
|
var lines_nr = lines.length;
|
||||||
|
if(lines_nr % 2 == 1)
|
||||||
|
++lines_nr;
|
||||||
|
var i = lines_nr / 2;
|
||||||
|
var j = i;
|
||||||
|
var ar_found = 0;
|
||||||
|
|
||||||
|
while(i > 400 && j < lines_nr){
|
||||||
|
|
||||||
|
if(lines[i].indexOf("Aspect Ratio") != -1){
|
||||||
|
if(debugmsg || debugmsg_imdb)
|
||||||
|
console.log("uw-bg::getAspectRatio | »Aspect Ratio« has been found on line",i," — searching for aspect ratio ...");
|
||||||
|
|
||||||
|
ar_found = i;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
if(lines[j].indexOf("Aspect Ratio") != -1){
|
||||||
|
if(debugmsg || debugmsg_imdb)
|
||||||
|
console.log("uw-bg::getAspectRatio | »Aspect Ratio« has been found on line",j," — searching for aspect ratio ...");
|
||||||
|
|
||||||
|
ar_found = j;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
--i;
|
||||||
|
++j;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
if(ar_found){
|
||||||
|
var ar_limit = ar_found + 5;
|
||||||
|
for(var i = ar_found; i < ar_limit; ++i){
|
||||||
|
if(debugmsg || debugmsg_imdb)
|
||||||
|
console.log("uw-bg::getAspectRatio | scanning lines for aspect ratio number. Line:",lines[i],"has ar:", lines[i].indexOf(":"));
|
||||||
|
if(lines[i].indexOf(":") != -1){
|
||||||
|
// To pomeni, da smo našli razmerje stranic. gg ez
|
||||||
|
// This means we found our aspect ratio, gg ez
|
||||||
|
|
||||||
|
var ar = lines[i].trim().split(":");
|
||||||
|
ar[0] = ar[0].trim();
|
||||||
|
ar[1] = ar[1].trim();
|
||||||
|
|
||||||
|
if(debugmsg || debugmsg_imdb)
|
||||||
|
console.log("uw-bg::getAspectRatio | Aspect ratio found:",ar[0],":",ar[1]);
|
||||||
|
|
||||||
|
// Pa povejmo to naši strani:
|
||||||
|
// Let's break the news:
|
||||||
|
browser.tabs.sendMessage(sender_tab.id, {type:"arInfo", arx:ar[0], ary:ar[1]});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
else
|
||||||
|
if(debugmsg || debugmsg_imdb)
|
||||||
|
console.log("uw-bg::getAspectRatio | Aspect ratio hasn't been found");
|
||||||
|
|
||||||
|
},
|
||||||
|
sender_tab
|
||||||
|
); //httpGET end
|
||||||
|
},
|
||||||
|
sender_tab
|
||||||
|
); //httpGET end
|
||||||
|
}
|
||||||
|
|
||||||
|
function httpGET(url, callback, callback_args){
|
||||||
|
var rek = new XMLHttpRequest();
|
||||||
|
rek.onreadystatechange = function(){
|
||||||
|
if(rek.readyState == 4 && rek.status == 200){
|
||||||
|
callback(rek.responseText, callback_args);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
rek.open("GET", url, true);
|
||||||
|
rek.send(null);
|
||||||
|
}
|
||||||
|
//END 3rd party snooping for aspect ratios
|
||||||
browser.runtime.onMessage.addListener(function(request, sender, sendResponse) {
|
browser.runtime.onMessage.addListener(function(request, sender, sendResponse) {
|
||||||
if(debugmsg)
|
|
||||||
console.log("content script gibed: ", request.test);
|
//Stvari delamo samo, če ima naše sporočilce tip
|
||||||
|
//We only do stuff if our message has a type
|
||||||
|
if(request.type){
|
||||||
|
if(request.type == "debug"){
|
||||||
|
console.log("uw-bg::onMessage | got a message. It was a debugging message. Here's the full message:",request);
|
||||||
|
}
|
||||||
|
if(request.type == "gibAspectRatio"){
|
||||||
|
if(debugmsg || debugmsg_imdb)
|
||||||
|
console.log("uw-bg::onMessage | got a message, we want to set aspect ratio. message:",request,"sender:",sender);
|
||||||
|
var result = getAspectRatio(request.title, sender.tab);
|
||||||
|
}
|
||||||
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
|
109
js/uw.js
109
js/uw.js
@ -1,13 +1,17 @@
|
|||||||
var debugmsg = false;
|
var debugmsg = false;
|
||||||
var debugmsg_click = false;
|
var debugmsg_click = false;
|
||||||
|
var debugmsg_message = true;
|
||||||
var debugmsg_periodic = false;
|
var debugmsg_periodic = false;
|
||||||
if(debugmsg || debugmsg_click){
|
if(debugmsg || debugmsg_click || debugmsg_message){
|
||||||
console.log(". . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . ");
|
console.log(". . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . ");
|
||||||
console.log("\nLoading ultrawidify (uw)\nIf you can see this, extension at least tried to load\n\nRandom number: ",Math.floor(Math.random() * 20) + 1,"\n");
|
console.log("\nLoading ultrawidify (uw)\nIf you can see this, extension at least tried to load\n\nRandom number: ",Math.floor(Math.random() * 20) + 1,"\n");
|
||||||
|
|
||||||
if(debugmsg_click)
|
if(debugmsg_click)
|
||||||
console.log("Logging debugmsg_click only");
|
console.log("Logging debugmsg_click only");
|
||||||
|
|
||||||
|
if(debugmsg_message)
|
||||||
|
console.log("Logging debugmsg_message only");
|
||||||
|
|
||||||
console.log(". . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . ");
|
console.log(". . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . ");
|
||||||
}
|
}
|
||||||
const playercheck_recursion_depth_limit = 3;
|
const playercheck_recursion_depth_limit = 3;
|
||||||
@ -38,11 +42,16 @@ var sample_button_class; // Class of a sample button
|
|||||||
var sample_button_index = 0; // index of a sample button
|
var sample_button_index = 0; // index of a sample button
|
||||||
var button_size_base = "x"; // Determines if size of extension buttons is defined by width or height of sample button
|
var button_size_base = "x"; // Determines if size of extension buttons is defined by width or height of sample button
|
||||||
|
|
||||||
|
var char_strat = "contain";
|
||||||
|
|
||||||
var video_wrap;
|
var video_wrap;
|
||||||
|
|
||||||
// Here we store the window size, so we know when to trigger css change.
|
// Here we store the window size, so we know when to trigger css change.
|
||||||
var winsize = {w: window.innerWidth, h: window.innerHeight};
|
var winsize = {w: window.innerWidth, h: window.innerHeight};
|
||||||
|
|
||||||
|
// Video title for third party
|
||||||
|
var title = "";
|
||||||
|
|
||||||
// provider-specific variables
|
// provider-specific variables
|
||||||
|
|
||||||
var netflix_cltbar_visibility = -1; // -1 for invisible, anything non-negative for visible
|
var netflix_cltbar_visibility = -1; // -1 for invisible, anything non-negative for visible
|
||||||
@ -260,10 +269,10 @@ if(debugmsg)
|
|||||||
|
|
||||||
var num_of_msg = 0;
|
var num_of_msg = 0;
|
||||||
browser.runtime.onMessage.addListener(function (message, sender, stuff ) {
|
browser.runtime.onMessage.addListener(function (message, sender, stuff ) {
|
||||||
if(debugmsg)
|
if(debugmsg || debugmsg_message)
|
||||||
console.log("uw::onMessage | message number: ", num_of_msg++ , "; message:", message.message, "player-status elements:", document.getElementsByClassName("player-status").length, document.getElementsByClassName("player-status"), "uw_elements:", document.getElementsByClassName("uw_element").length, document.getElementsByClassName("uw_element") );
|
console.log("uw::onMessage | message number: ", num_of_msg++ , "; message:", message );
|
||||||
|
|
||||||
if(message.message == "page-change"){
|
if(message.message && message.message == "page-change"){
|
||||||
if(document.getElementsByClassName("uw_element").length === 0){
|
if(document.getElementsByClassName("uw_element").length === 0){
|
||||||
if(debugmsg)
|
if(debugmsg)
|
||||||
console.log("uw::onMessage | page was updated but control buttons aren't there. Trying to readd.")
|
console.log("uw::onMessage | page was updated but control buttons aren't there. Trying to readd.")
|
||||||
@ -284,8 +293,24 @@ browser.runtime.onMessage.addListener(function (message, sender, stuff ) {
|
|||||||
if(debugmsg)
|
if(debugmsg)
|
||||||
console.log("uw::onMessage | message number:",num_of_msg," »» everything is done. Buttons: ", document.getElementsByClassName("uw-button"));
|
console.log("uw::onMessage | message number:",num_of_msg," »» everything is done. Buttons: ", document.getElementsByClassName("uw-button"));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if(message.type && message.type == "arInfo"){
|
||||||
|
char_imdb(message.arx, message.ary);
|
||||||
|
}
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// browser.runtime.onMessage.addListener(request => {
|
||||||
|
// console.log("Message from the background script:");
|
||||||
|
// console.log(request.greeting);
|
||||||
|
// return Promise.resolve({response: "Hi from content script"});
|
||||||
|
// });
|
||||||
|
|
||||||
|
if(debugmsg)
|
||||||
|
console.log("uw | Comms with background scripts: done");
|
||||||
|
//END comms with uw-bg
|
||||||
|
|
||||||
|
//BEGIN periodic functions
|
||||||
//Because onUpdated event isn't reliable enough for what we're doing on netflix.
|
//Because onUpdated event isn't reliable enough for what we're doing on netflix.
|
||||||
function periodic() {
|
function periodic() {
|
||||||
if(debugmsg_periodic)
|
if(debugmsg_periodic)
|
||||||
@ -330,17 +355,31 @@ function periodic() {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if(page_url.indexOf("netflix.com") != -1){
|
||||||
|
//Netflix-specific stuff
|
||||||
|
var qntitle = document.querySelector(".player-status-main-title");
|
||||||
|
var ntitle = "";
|
||||||
|
|
||||||
|
//querySelector lahko vrne null, zato moramo preveriti, kaj smo dobili — drugače se .textContent pritožuje.
|
||||||
|
//querySelector can return null, in which case .textContent will complain.
|
||||||
|
if(qntitle)
|
||||||
|
ntitle = qntitle.textContent;
|
||||||
|
|
||||||
|
if(ntitle && ntitle != title){
|
||||||
|
if(debugmsg || debugmsg_message)
|
||||||
|
console.log("uw::periodic | title changed. New title:",ntitle,"Old title:",title);
|
||||||
|
title = ntitle;
|
||||||
|
var sending = browser.runtime.sendMessage({
|
||||||
|
type: "gibAspectRatio",
|
||||||
|
title: title
|
||||||
|
});
|
||||||
|
sending.then( function(){}, function(err1, err2){console.log("uw::periodic: there was an error while sending a message", err1, err2)} );
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
//END periodic functions
|
||||||
|
|
||||||
// browser.runtime.onMessage.addListener(request => {
|
|
||||||
// console.log("Message from the background script:");
|
|
||||||
// console.log(request.greeting);
|
|
||||||
// return Promise.resolve({response: "Hi from content script"});
|
|
||||||
// });
|
|
||||||
|
|
||||||
if(debugmsg)
|
|
||||||
console.log("uw | Comms with background scripts: done");
|
|
||||||
//END comms with uw-bg
|
|
||||||
|
|
||||||
|
|
||||||
$(document).ready(function() {
|
$(document).ready(function() {
|
||||||
@ -403,13 +442,14 @@ function keydownSetup(){
|
|||||||
console.log("We're writing a comment or something. Doing nothing");
|
console.log("We're writing a comment or something. Doing nothing");
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
if(debugmsg){
|
if(debugmsg || debugmsg_message){
|
||||||
// console.log(KEYBINDS);
|
// console.log(KEYBINDS);
|
||||||
console.log("we pressed a key: ", event.key , " | keydown: ", event.keydown);
|
console.log("we pressed a key: ", event.key , " | keydown: ", event.keydown);
|
||||||
if(event.key == 'p'){
|
if(event.key == 'p'){
|
||||||
console.log("uw/keydown: attempting to send message")
|
console.log("uw/keydown: attempting to send message")
|
||||||
var sending = browser.runtime.sendMessage({
|
var sending = browser.runtime.sendMessage({
|
||||||
test: "test message pls dont ignore"
|
type: "debug",
|
||||||
|
message: "Test message, please ignore"
|
||||||
});
|
});
|
||||||
sending.then( function(){}, function(){console.log("uw/keydown: there was an error while sending a message")} );
|
sending.then( function(){}, function(){console.log("uw/keydown: there was an error while sending a message")} );
|
||||||
console.log("uw/keydown: test message sent! (probably)");
|
console.log("uw/keydown: test message sent! (probably)");
|
||||||
@ -771,10 +811,10 @@ function addCtlButtons(recursion_depth){
|
|||||||
// Press the button, something awesome has to happen.
|
// Press the button, something awesome has to happen.
|
||||||
// — Bioware
|
// — Bioware
|
||||||
// ( https://www.youtube.com/watch?v=hMcVZQI6ybw | [NSFW] )
|
// ( https://www.youtube.com/watch?v=hMcVZQI6ybw | [NSFW] )
|
||||||
|
if(smenu_el[6]){
|
||||||
$(smenu_el[6]).on("mouseenter", function(){showMenu("uw-armenu")});
|
$(smenu_el[6]).on("mouseenter", function(){showMenu("uw-armenu")});
|
||||||
$(smenu_el[6]).on("mouseleave", function(){hideMenu("uw-armenu")});
|
$(smenu_el[6]).on("mouseleave", function(){hideMenu("uw-armenu")});
|
||||||
|
}
|
||||||
// event.stopPropagation, ker nočemo togglati še funkcij od knofa za popup z nastavitvami
|
// event.stopPropagation, ker nočemo togglati še funkcij od knofa za popup z nastavitvami
|
||||||
// event.stopPropagation, because we don't want to trigger onclick functions of the settings popup button in
|
// event.stopPropagation, because we don't want to trigger onclick functions of the settings popup button in
|
||||||
// the player bar
|
// the player bar
|
||||||
@ -1023,6 +1063,41 @@ function char(new_ar, video, player){
|
|||||||
set_video_ar(new_ar, video, player);
|
set_video_ar(new_ar, video, player);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function char_imdb(arx, ary){
|
||||||
|
var ar = arx / ary;
|
||||||
|
|
||||||
|
var nplayer = { width: player.clientWidth, height: player.clientHeight };
|
||||||
|
|
||||||
|
var calc_width = nplayer.height * ar;
|
||||||
|
var calc_height = nplayer.width / ar;
|
||||||
|
|
||||||
|
var nv = {w: "", h: ""};
|
||||||
|
|
||||||
|
var evideo = $("video")[0];
|
||||||
|
var video = {width: evideo.videoWidth, height: evideo.videoHeight};
|
||||||
|
var vidar = video.width / video.height;
|
||||||
|
|
||||||
|
// V tem primeru zapolnimo po višini
|
||||||
|
// In this case, we calculate new dimension based on player height
|
||||||
|
|
||||||
|
// NOTE: Everything below this line (in this function) is TODO/FIXME
|
||||||
|
// if(calc_width > player.width){
|
||||||
|
nv.w = nplayer.width;
|
||||||
|
nv.h = nplayer.height * (ar / vidar);
|
||||||
|
// }
|
||||||
|
// else{
|
||||||
|
// nv.h = player.width * (vidar / a
|
||||||
|
// }
|
||||||
|
|
||||||
|
nv.top = (nplayer.height - nv.h)/2;
|
||||||
|
nv.left = (nplayer.width - nv.w)/2;
|
||||||
|
|
||||||
|
if(debugmsg || debugmsg_message)
|
||||||
|
console.log("uw::char_imdb | nv:",nv);
|
||||||
|
|
||||||
|
applyCSS(nv);
|
||||||
|
}
|
||||||
|
|
||||||
/* Tukaj povemo, kakšno razmerje stranic ima video.
|
/* Tukaj povemo, kakšno razmerje stranic ima video.
|
||||||
// Kaj to pomeni:
|
// Kaj to pomeni:
|
||||||
// Mi rečemo, da ima video razmerje stranic 16:9. Dejanski video
|
// Mi rečemo, da ima video razmerje stranic 16:9. Dejanski video
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
{
|
{
|
||||||
"manifest_version": 2,
|
"manifest_version": 2,
|
||||||
"name": "Ultrawidify-git",
|
"name": "Ultrawidify-git",
|
||||||
"version": "1.1.1",
|
"version": "1.2.0dev",
|
||||||
|
|
||||||
"icons": {
|
"icons": {
|
||||||
"32":"res/icons/uw-32.png",
|
"32":"res/icons/uw-32.png",
|
||||||
@ -20,11 +20,11 @@
|
|||||||
],
|
],
|
||||||
|
|
||||||
"background": {
|
"background": {
|
||||||
"scripts": ["js/uw-bg.js"]
|
"scripts": ["js/jquery-3.1.1.js", "js/uw-bg.js"]
|
||||||
},
|
},
|
||||||
|
|
||||||
"permissions": [
|
"permissions": [
|
||||||
"tabs", "storage", "activeTab", "*://*.youtube.com/*", "*://youtube.com/*"
|
"tabs", "storage", "activeTab", "webrequest", "*://*.youtube.com/*", "*://youtube.com/*", "*://imdb.com/*", "*://*.imdb.com/*"
|
||||||
],
|
],
|
||||||
|
|
||||||
"web_accessible_resources": [
|
"web_accessible_resources": [
|
||||||
|
Loading…
Reference in New Issue
Block a user