(Probably) fixed key shortcuts not working issue, started preparations for settings screen and rebindable keys
This commit is contained in:
parent
d7a258fb6d
commit
d703e6f6cb
@ -96,3 +96,9 @@ Keybind `a` just doesn't work at all, so no 16:10.
|
||||
|
||||
* The aspect ratio thingy is now also in GUI
|
||||
* Fixed code for forcing aspect ratio. At least I think it's fixed now.
|
||||
|
||||
###v0.9.9.1
|
||||
|
||||
* Keybinds `a` and `w` now work.
|
||||
* Some changes under the bonnet, mostly regarding the way keypresses are handled.
|
||||
* 'Settings' page is ~15% done.
|
||||
|
10220
js/jquery-3.1.1.js
vendored
Normal file
10220
js/jquery-3.1.1.js
vendored
Normal file
File diff suppressed because it is too large
Load Diff
5
js/jquery.js
vendored
5
js/jquery.js
vendored
File diff suppressed because one or more lines are too long
230
js/uw.js
230
js/uw.js
@ -7,7 +7,7 @@ var zoomStep = 0.05;
|
||||
var whatdo_persistence = true;
|
||||
var last_whatdo = "reset";
|
||||
|
||||
var debugmsg = true;
|
||||
var debugmsg = false;
|
||||
|
||||
var ctlbar_classnames = ["ytp-chrome-controls"];
|
||||
var serviceArray = [".video-stream" ]; //Youtube
|
||||
@ -44,41 +44,146 @@ $("<style>")
|
||||
}\
|
||||
.show{\
|
||||
display: block;\
|
||||
}")
|
||||
}\
|
||||
.uw-ext-settings-bg{\
|
||||
display: none;\
|
||||
position: absolute !important;\
|
||||
width: 100% !important;\
|
||||
height: 100% !important;\
|
||||
z-index: 1000 !important;\
|
||||
\
|
||||
background-color: rgba(0,0,0,0.69) !important;\
|
||||
color: #fff !important; \
|
||||
font-family: 'Oxygen' !important;\
|
||||
text-align: center;\
|
||||
\
|
||||
}\
|
||||
.uw-ext-settings-content{\
|
||||
display: inline-block;\
|
||||
min-width: 75%;\
|
||||
max-width: 90%;\
|
||||
text-align: left;\
|
||||
padding: 2em !important;\
|
||||
font-size: 1.4em;\
|
||||
font-family: 'Oxygen' !important;\
|
||||
}\
|
||||
.uw_top{\
|
||||
z-index: 1337;\
|
||||
}\
|
||||
.uw-h1{\
|
||||
font-size: 4em !important;\
|
||||
color: #f46007 !important;\
|
||||
font-family: 'Oxygen' !important;\
|
||||
}\
|
||||
.uw_settings_tab{\
|
||||
font-size: 1.4em !important;\
|
||||
padding-left: 1em;\
|
||||
color: #ddd !important;\
|
||||
}\
|
||||
.uw_settings_tab:hover{\
|
||||
font-size: 1.6em;\
|
||||
padding-left: 1.6em;\
|
||||
color: #ffdb6e !important;\
|
||||
}\
|
||||
\
|
||||
")
|
||||
.appendTo("head");
|
||||
|
||||
var DEFAULT_KEYBINDINGS = [
|
||||
{ action: "fit-width",
|
||||
key: 'w',
|
||||
modifiers: []
|
||||
},
|
||||
{
|
||||
action: "fit-height",
|
||||
key: 'e',
|
||||
modifiers: []
|
||||
},
|
||||
{
|
||||
action: "reset",
|
||||
key: 'r',
|
||||
modifiers: []
|
||||
},
|
||||
{
|
||||
action: "zoom",
|
||||
key: "z",
|
||||
modifiers: []
|
||||
},
|
||||
{
|
||||
action: "unzoom",
|
||||
key: "u",
|
||||
modifiers: []
|
||||
},
|
||||
{
|
||||
action: "char",
|
||||
targetAR: (21/9),
|
||||
key: "d",
|
||||
modifiers: []
|
||||
},
|
||||
{
|
||||
action: "char",
|
||||
targetAR: (16/9),
|
||||
key: "s",
|
||||
modifiers: []
|
||||
},
|
||||
{
|
||||
action: "char",
|
||||
targetAR: (16/10),
|
||||
key: "x",
|
||||
modifiers: []
|
||||
},
|
||||
{
|
||||
action: "char",
|
||||
targetAR: (4/3),
|
||||
key: "a",
|
||||
modifiers: []
|
||||
}
|
||||
];
|
||||
|
||||
$(document).ready(function() {
|
||||
if(debugmsg)
|
||||
console.log("==========================================================================================");
|
||||
|
||||
$(document).keypress(function (event) { // Tukaj ugotovimo, katero tipko smo pritisnili
|
||||
switch (event.key){
|
||||
case 'w':
|
||||
changeCSS("fit","fitw");
|
||||
break;
|
||||
case 'e':
|
||||
changeCSS("fit","fith");
|
||||
break;
|
||||
case 'r':
|
||||
changeCSS("reset","reset");
|
||||
break;
|
||||
case 'z':
|
||||
changeCSS("fit","zoom");
|
||||
break;
|
||||
case 'u':
|
||||
changeCSS("fit","unzoom");
|
||||
break;
|
||||
case 'd':
|
||||
changeCSS("char", (21/9));
|
||||
break;
|
||||
case 's':
|
||||
changeCSS("char", (16/9));
|
||||
break;
|
||||
case 'a':
|
||||
changeCSS("char", (16/10));
|
||||
break;
|
||||
case 'x':
|
||||
changeCSS("char", (4/3));
|
||||
$(document).keydown(function (event) { // Tukaj ugotovimo, katero tipko smo pritisnili
|
||||
|
||||
// Tipke upoštevamo samo, če smo v celozaslonskem načinu oz. če ne pišemo komentarja
|
||||
// v nasprotnem primeru ne naredimo nič.
|
||||
// We only take actions if we're in full screen or not writing a comment
|
||||
if( !(inFullScreen || (
|
||||
(document.activeElement.getAttribute("role") != "textbox") &&
|
||||
(document.activeElement.getAttribute("type") != "text")
|
||||
))){
|
||||
if(debugmsg)
|
||||
console.log("We're writing a comment or something. Doing nothing");
|
||||
return;
|
||||
}
|
||||
|
||||
console.log("we pressed a key: ", event.key , " | keydown: ", event.keydown);
|
||||
|
||||
for(var i = 0; i < DEFAULT_KEYBINDINGS.length; i++){
|
||||
if(event.key == DEFAULT_KEYBINDINGS[i].key){
|
||||
console.log("Key matches!");
|
||||
//Tipka se ujema. Preverimo še modifierje:
|
||||
//Key matches. Let's check if modifiers match, too:
|
||||
var mods = true;
|
||||
for(var j = 0; j < DEFAULT_KEYBINDINGS[i].modifiers.length; j++){
|
||||
if(DEFAULT_KEYBINDINGS[i].modifiers[j] == "ctrl")
|
||||
mods &= event.ctrlKey ;
|
||||
else if(DEFAULT_KEYBINDINGS[i].modifiers[j] == "alt")
|
||||
mods &= event.altKey ;
|
||||
else if(DEFAULT_KEYBINDINGS[i].modifiers[j] == "shift")
|
||||
mods &= event.shiftKey ;
|
||||
}
|
||||
console.log("we pressed a key: ", event.key , " | mods match?", mods, "keybinding: ", DEFAULT_KEYBINDINGS[i]);
|
||||
if(mods){
|
||||
if(DEFAULT_KEYBINDINGS[i].action == "char"){
|
||||
changeCSS("char", DEFAULT_KEYBINDINGS[i].targetAR);
|
||||
return;
|
||||
}
|
||||
changeCSS("anything goes", DEFAULT_KEYBINDINGS[i].action);
|
||||
return;
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
@ -145,7 +250,7 @@ function addCtlButtons(provider_id){
|
||||
var smenu_ar_options = [];
|
||||
|
||||
buttons[5].appendChild(settings_menu);
|
||||
settings_menu.appendChild(smenu_settings);
|
||||
// settings_menu.appendChild(smenu_settings); //TODO: uncomment that to re-enable settings screen. This line should only be disabled for builds and commits until the settings screen is finalized
|
||||
settings_menu.appendChild(smenu_ar);
|
||||
settings_menu.appendChild(smenu_reset);
|
||||
|
||||
@ -183,6 +288,8 @@ function addCtlButtons(provider_id){
|
||||
smenu_ar.innerHTML = "Force aspect ratio";
|
||||
smenu_ar.appendChild(smenu_ar_menu);
|
||||
|
||||
smenu_settings.innerHTML = "Settings";
|
||||
|
||||
smenu_ar_options[0].innerHTML = "4:3";
|
||||
smenu_ar_options[1].innerHTML = "16:10";
|
||||
smenu_ar_options[2].innerHTML = "16:9";
|
||||
@ -204,6 +311,42 @@ function addCtlButtons(provider_id){
|
||||
smenu_ar_options[2].onclick = function() { changeCSS("char", (16/9 )) };
|
||||
smenu_ar_options[3].onclick = function() { changeCSS("char", (21/9 )) };
|
||||
|
||||
console.log(smenu_settings);
|
||||
smenu_settings.onclick = function() { showSettings() };
|
||||
|
||||
|
||||
|
||||
//BEGIN SETTINGS WINDOW
|
||||
var e_player;
|
||||
|
||||
if(inIframe())
|
||||
e_player = document.getElementById("player");
|
||||
else
|
||||
e_player = document.getElementById("movie_player");
|
||||
|
||||
|
||||
var menu_panel = document.createElement('div');
|
||||
menu_panel.id = "uw_settings_panel";
|
||||
menu_panel.className = "uw-ext-settings-bg";
|
||||
|
||||
var settings_content = document.createElement('div');
|
||||
settings_content.className = "uw-ext-settings-content";
|
||||
settings_content.innerHTML = "<h1 class='uw_top uw-h1'>SETTINGS</h1>\
|
||||
<div class='uw_top uw_settings_tabbar'>\
|
||||
<div class='uw_top uw_settings_tab'>Shortcuts</div>\
|
||||
<!---<div class='uw_top uw_settings_tab'>Customize UI</div>--->\
|
||||
<div class='uw_top uw_settings_tab'>About</div>\
|
||||
<div class='uw_top uw_settings_tab' id='uw_close_settings_view'>Close settings</div>\
|
||||
</div>"
|
||||
|
||||
|
||||
|
||||
|
||||
e_player.appendChild(menu_panel);
|
||||
menu_panel.appendChild(settings_content);
|
||||
|
||||
document.getElementById('uw_close_settings_view').onclick = function() { hideSettings() };
|
||||
//END SETTINGS WINDOW
|
||||
}
|
||||
|
||||
|
||||
@ -212,6 +355,13 @@ function addCtlButtons(provider_id){
|
||||
console.log("uw::addCtlButtons | buttons added");
|
||||
}
|
||||
|
||||
function showSettings(){
|
||||
document.getElementById("uw_settings_panel").style.display = "block";
|
||||
}
|
||||
function hideSettings(){
|
||||
document.getElementById("uw_settings_panel").style.display = "none";
|
||||
}
|
||||
|
||||
// Ta funkcija se proži, ko vstopimo ali izstopimo iz celozaslonskega načina
|
||||
// This function gets triggered by full screen state change
|
||||
function onFullScreenChange(){
|
||||
@ -480,7 +630,7 @@ function changeCSS_nofs(what_do, video, player){
|
||||
|
||||
var ar = video.width/video.height;
|
||||
|
||||
if(what_do == "fitw"){
|
||||
if(what_do == "fitw" || what_do == "fit-width"){
|
||||
// Ker bi bilo lepo, da atribut 'top' spremenimo hkrati z width in height, moramo najprej naračunati,
|
||||
// za kakšen faktor se poviša višina. To potrebujemo, da se pravilno izračuna offset.
|
||||
//
|
||||
@ -502,7 +652,7 @@ function changeCSS_nofs(what_do, video, player){
|
||||
left = 0; // Ker zavzamemo vso širino | cos we take up all the width
|
||||
}
|
||||
|
||||
if(what_do == "fith"){
|
||||
if(what_do == "fith" || what_do == "fit-height"){
|
||||
h = player.height;
|
||||
w = player.height / video.height * video.width;
|
||||
|
||||
@ -552,9 +702,11 @@ function changeCSS_nofs(what_do, video, player){
|
||||
left = (player.width - w) / 2;
|
||||
|
||||
if (h > player.height * 4){
|
||||
console.log("But this video is ... I mean, it's fucking huge. This is bigger than some rooms, this is bigger than some people's flats!");
|
||||
// Insert obligatory omnishambles & coffee machine quote here
|
||||
console.log("(No really, mate, you took this way too far already. Can't let you do that, Dave.)");
|
||||
if(debugmsg){
|
||||
console.log("But this video is ... I mean, it's fucking huge. This is bigger than some rooms, this is bigger than some people's flats!");
|
||||
// Insert obligatory omnishambles & coffee machine quote here
|
||||
console.log("(No really, mate, you took this way too far already. Can't let you do that, Dave.)");
|
||||
}
|
||||
return;
|
||||
}
|
||||
}
|
||||
@ -569,8 +721,10 @@ function changeCSS_nofs(what_do, video, player){
|
||||
left = (player.width - w) / 2;
|
||||
|
||||
if (h < player.height * 0.25){
|
||||
console.log("don't you think this is small enough already? You don't need to resize the video all the way down to the size smaller than your penis.");
|
||||
console.log("(if you're a woman, substitute 'penis' with whatever the female equivalent is.)");
|
||||
if(debugmsg){
|
||||
console.log("don't you think this is small enough already? You don't need to resize the video all the way down to the size smaller than your penis.");
|
||||
console.log("(if you're a woman, substitute 'penis' with whatever the female equivalent is.)");
|
||||
}
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
@ -2,7 +2,7 @@
|
||||
|
||||
"manifest_version": 2,
|
||||
"name": "Ultrawidify-git",
|
||||
"version": "0.9.9",
|
||||
"version": "0.9.9.1",
|
||||
|
||||
"icons": {
|
||||
"32":"icons/uw-32.png",
|
||||
@ -15,7 +15,7 @@
|
||||
"content_scripts": [
|
||||
{
|
||||
"matches": ["*://*.youtube.com/*", "*://youtube.com/*", "*://youtu.be/*"],
|
||||
"js": [ "js/jquery.js", "js/uw.js" ],
|
||||
"js": [ "js/jquery-3.1.1.js", "js/uw.js" ],
|
||||
"all_frames": true
|
||||
}
|
||||
],
|
||||
@ -31,10 +31,5 @@
|
||||
"img/ytplayer-icons/fith.png",
|
||||
"img/ytplayer-icons/reset.png",
|
||||
"img/ytplayer-icons/settings.png"
|
||||
],
|
||||
"applications": {
|
||||
"gecko": {
|
||||
"update_url": "https://tamius.net/ultrawidify/updates/updates.json"
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user