Added all buttons to settings menu. TODO: detect if buttons take too much space on the control bar.
This commit is contained in:
Tamius Han
parent
8571fc1089
commit
cd738ea022
155
js/uw.js
155
js/uw.js
@ -14,6 +14,10 @@ var serviceArray = [".video-stream" ]; //Youtube
|
||||
|
||||
var buttons = [];
|
||||
|
||||
|
||||
console.log("????");
|
||||
|
||||
|
||||
$("<style>")
|
||||
.prop("type", "text/css")
|
||||
.html("\
|
||||
@ -85,7 +89,23 @@ $("<style>")
|
||||
padding-left: 1.6em;\
|
||||
color: #ffdb6e !important;\
|
||||
}\
|
||||
\
|
||||
.uw_settings_tabbar{\
|
||||
display: inline-block;\
|
||||
float: left;\
|
||||
width: 15em;\
|
||||
}\
|
||||
.uw_settings_container{\
|
||||
display: inline-block;\
|
||||
float: right;\
|
||||
width: calc(99% - 15em);\
|
||||
}\
|
||||
.uw_settings_kbshortcuts_label{\
|
||||
display: inline-block;\
|
||||
width: 15em;\
|
||||
}\
|
||||
.uw_settings_kbshortcuts_input{\
|
||||
width: 1.5em;\
|
||||
}\
|
||||
")
|
||||
.appendTo("head");
|
||||
|
||||
@ -227,6 +247,14 @@ $(document).ready(function() {
|
||||
|
||||
});
|
||||
|
||||
//UI helpers
|
||||
function saveKeybinds(){
|
||||
console.log($('uw_kbshortcuts_form').serializeArray());
|
||||
}
|
||||
|
||||
|
||||
//BEGIN UI
|
||||
|
||||
function addCtlButtons(provider_id){
|
||||
|
||||
// Gumb za nastavitve je bolj kot ne vselej prisoten, zato širino tega gumba uporabimo kot širino naših gumbov
|
||||
@ -240,6 +268,18 @@ function addCtlButtons(provider_id){
|
||||
|
||||
var button_panel;
|
||||
|
||||
// Če je ta dodatek že nameščen, potem odstranimo vse elemente. Vsi top-level elementi imajo definiran prazen razred
|
||||
// uw_element, prek katerega jih naberemo na kup. Ta del kode je tu bolj ali manj zaradi debugiranja.
|
||||
//
|
||||
// If this addon is already installed, we have to remove all prevously added elements (to avoid duplicating).
|
||||
// The easiest way to gather all of them is to tack an empty class, 'uw_element,' to each top-level element we add.
|
||||
// This is here mostly because debugging, but could also be useful in case of unforseen happenings.
|
||||
|
||||
var previousElements = document.getElementsByClassName("uw_element");
|
||||
if(previousElements && previousElements.length > 0)
|
||||
for( var i = 0; i < previousElements.length; i++)
|
||||
previousElements[i].parentNode.removeChild(previousElements[i]);
|
||||
|
||||
// If we're on youtube:
|
||||
if(provider_id == 0){
|
||||
|
||||
@ -252,7 +292,7 @@ function addCtlButtons(provider_id){
|
||||
// buttons[i].style.marginLeft = (button_width * 0.3) + "px";
|
||||
buttons[i].style.paddingLeft = (button_width *0.15 ) + "px";
|
||||
buttons[i].style.paddingRight = (button_width * 0.15) + "px";
|
||||
buttons[i].className += " uw-button";
|
||||
buttons[i].className += " uw-button uw_element";
|
||||
$(rctl).prepend(buttons[i]);
|
||||
}
|
||||
|
||||
@ -273,32 +313,44 @@ function addCtlButtons(provider_id){
|
||||
var smenu_ar = document.createElement("div");
|
||||
var smenu_ar_menu = document.createElement("div");
|
||||
var smenu_reset = document.createElement("div");
|
||||
var smenu_fitw = document.createElement("div");
|
||||
var smenu_fith = document.createElement("div");
|
||||
var smenu_zoom = document.createElement("div");
|
||||
var smenu_unzoom = document.createElement("div");
|
||||
|
||||
var smenu_ar_options = [];
|
||||
|
||||
buttons[5].appendChild(settings_menu);
|
||||
// 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_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_zoom);
|
||||
settings_menu.appendChild(smenu_unzoom);
|
||||
settings_menu.appendChild(smenu_reset);
|
||||
settings_menu.appendChild(smenu_fith);
|
||||
settings_menu.appendChild(smenu_fitw);
|
||||
settings_menu.appendChild(smenu_ar);
|
||||
|
||||
for(var i = 0; i < 4; i++){
|
||||
smenu_ar_options[i] = document.createElement("div");
|
||||
smenu_ar_options[i].className = "uw-setmenu-item";
|
||||
smenu_ar_options[i].className = "uw-setmenu-item uw_element";
|
||||
smenu_ar_menu.appendChild(smenu_ar_options[i]);
|
||||
}
|
||||
|
||||
settings_menu.id = "uw-smenu";
|
||||
settings_menu.className = "uw-setmenu";
|
||||
settings_menu.className = "uw-setmenu uw_element";
|
||||
smenu_settings.id = "uw-smenu_settings";
|
||||
smenu_settings.className = "uw-setmenu-item";
|
||||
smenu_settings.className = "uw-setmenu-item uw_element";
|
||||
smenu_ar.id = "uw-smenu_ar";
|
||||
smenu_ar.className = "uw-setmenu-item";
|
||||
// smenu_reset.id = "uw-smenu_reset;
|
||||
// smenu_reset.className = "uw-setmenu-item";
|
||||
smenu_ar.className = "uw-setmenu-item uw_element";
|
||||
smenu_fitw.className += "uw-setmenu-item";
|
||||
smenu_fith.className += "uw-setmenu-item";
|
||||
smenu_reset.className += "uw-setmenu-item";
|
||||
smenu_zoom.className += "uw-setmenu-item";
|
||||
smenu_unzoom.className += "uw-setmenu-item";
|
||||
|
||||
|
||||
|
||||
smenu_ar_menu.id = "uw-armenu";
|
||||
smenu_ar_menu.className = "uw-setmenu";
|
||||
smenu_ar_menu.className = "uw-setmenu uw_element";
|
||||
|
||||
// Stvari, ki se spreminjajo, se določijo tukaj
|
||||
// Things that can change are defined here
|
||||
@ -310,6 +362,27 @@ function addCtlButtons(provider_id){
|
||||
smenu_ar_menu.style.width = (button_width * 2.5) + "px";
|
||||
smenu_ar_menu.style.bottom = "0px";
|
||||
|
||||
smenu_fitw.style.width = (button_width * 7.5) + "px";
|
||||
smenu_fitw.style.fontSize = (button_width * 0.50) + "px";
|
||||
// smenu_fitw.style = (button_width * ) + "px";
|
||||
|
||||
smenu_fith.style.width = (button_width * 7.5) + "px";
|
||||
smenu_fith.style.fontSize = (button_width * 0.5) + "px";
|
||||
// smenu_fith.style = (button_width * ) + "px";
|
||||
|
||||
smenu_reset.style.width = (button_width * 7.5) + "px";
|
||||
smenu_reset.style.fontSize = (button_width * 0.5) + "px";
|
||||
// smenu_reset.style = (button_width * ) + "px";
|
||||
|
||||
smenu_zoom.style.width = (button_width * 7.5) + "px";
|
||||
smenu_zoom.style.fontSize = (button_width * 0.5) + "px";
|
||||
// smenu_zoom.style = (button_width * ) + "px";
|
||||
|
||||
smenu_unzoom.style.width = (button_width * 7.5) + "px";
|
||||
smenu_unzoom.style.fontSize = (button_width * 0.5) + "px";
|
||||
// smenu_unzoom.style = (button_width * ) + "px";
|
||||
|
||||
|
||||
// Tukaj se določa notranji HTML knofov
|
||||
// Inner HTML of elements is defined here
|
||||
smenu_ar.innerHTML = "Force aspect ratio";
|
||||
@ -322,6 +395,12 @@ function addCtlButtons(provider_id){
|
||||
smenu_ar_options[2].innerHTML = "16:9";
|
||||
smenu_ar_options[3].innerHTML = "21:9";
|
||||
|
||||
smenu_fitw.innerHTML = "Fit width";
|
||||
smenu_fith.innerHTML = "Fit height";
|
||||
smenu_reset.innerHTML = "Reset";
|
||||
smenu_zoom.innerHTML = "Zoom in";
|
||||
smenu_unzoom.innerHTML = "Zoom out";
|
||||
|
||||
// Pritisneš gumb, nekej zakon se more narest.
|
||||
// — Bioware
|
||||
// ( https://www.youtube.com/watch?v=hMcVZQI6ybw | [NVZD] )
|
||||
@ -341,6 +420,11 @@ function addCtlButtons(provider_id){
|
||||
console.log(smenu_settings);
|
||||
smenu_settings.onclick = function() { showSettings() };
|
||||
|
||||
smenu_fitw.onclick = function () { changeCSS("fit","fitw") };
|
||||
smenu_fith.onclick = function () { changeCSS("fit","fith") };
|
||||
smenu_reset.onclick = function () { changeCSS("reset","reset") };
|
||||
smenu_zoom.onclick = function () { changeCSS("fit","zoom") };
|
||||
smenu_unzoom.onclick = function () { changeCSS("fit","unzoom") };
|
||||
|
||||
|
||||
//BEGIN SETTINGS WINDOW
|
||||
@ -354,9 +438,37 @@ function addCtlButtons(provider_id){
|
||||
|
||||
var menu_panel = document.createElement('div');
|
||||
menu_panel.id = "uw_settings_panel";
|
||||
menu_panel.className = "uw-ext-settings-bg";
|
||||
menu_panel.className = "uw-ext-settings-bg uw_element";
|
||||
|
||||
console.log("boo");
|
||||
|
||||
var kbs_actions = [
|
||||
{action:"fitw", label:"Fit width:"},
|
||||
{action:"fith",label:"Fit height:"},
|
||||
{action:"reset",label:"Reset:"},
|
||||
{action:"zoom",label:"Zoom in:"},
|
||||
{action:"unzoom",label:"Zoom out:"},
|
||||
{action:"ar219",label:"Force 21:9"},
|
||||
{action:"ar169",label:"Force 16:9"},
|
||||
{action:"ar1610",label:"Force 16:10"},
|
||||
{action:"ar43",label:"Force 4:3"}
|
||||
];
|
||||
|
||||
var form = "";
|
||||
for( var i = 0; i < kbs_actions.length; i++){
|
||||
form += "<div class='uw_top uw_settings_kbshortcuts_line'>\
|
||||
<div class='uw_top uw_settings_kbshortcuts_label'>" + kbs_actions[i].label + "</div>\
|
||||
<input type='checkbox' value='" + kbs_actions[i].action + "_ctrl'> Ctrl + \
|
||||
<input type='checkbox' value='" + kbs_actions[i].action + "_shift'> Shift + \
|
||||
<input type='checkbox' value='" + kbs_actions[i].action + "_alt'> Alt + \
|
||||
<input type='text' name='" + kbs_actions[i].action + "_letter' maxlength='1' class='uw_settings_kbshortcuts_input'></div>";
|
||||
}
|
||||
|
||||
var settings_content = document.createElement('div');
|
||||
var savekb = document.createElement('div');
|
||||
savekb.className = 'uw_kbshortcuts_button';
|
||||
savekb.onclick = function() { saveKeybinds() };
|
||||
savekb.innerHTML = "Save";
|
||||
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'>\
|
||||
@ -364,15 +476,22 @@ function addCtlButtons(provider_id){
|
||||
<!---<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>\
|
||||
<div class='uw_top uw_settings_container' id='uw_settings_container'>\
|
||||
<div class='uw_top uw_settings_panel' id='uw_settings_kbshortcuts'>\
|
||||
<div>NOTE: some keys can't be rebound here (namely: keys in use by the player and some other quirky keys). Use the settings page instead.</div>\
|
||||
<form id='uw_kbshortcuts_form'>" + form + "</form>\
|
||||
<div id='uw_kbshortcuts_buttonrow'><div class='uw_settings_button'>Back</div>\
|
||||
</div>\
|
||||
</div>"
|
||||
|
||||
|
||||
|
||||
|
||||
e_player.appendChild(menu_panel);
|
||||
menu_panel.appendChild(settings_content);
|
||||
|
||||
|
||||
|
||||
document.getElementById('uw_close_settings_view').onclick = function() { hideSettings() };
|
||||
|
||||
//END SETTINGS WINDOW
|
||||
}
|
||||
|
||||
@ -382,12 +501,18 @@ function addCtlButtons(provider_id){
|
||||
console.log("uw::addCtlButtons | buttons added");
|
||||
}
|
||||
|
||||
//END UI
|
||||
|
||||
function showSettings(){
|
||||
document.getElementById("uw_settings_panel").style.display = "block";
|
||||
}
|
||||
function hideSettings(){
|
||||
document.getElementById("uw_settings_panel").style.display = "none";
|
||||
}
|
||||
// function saveKeybinds(){
|
||||
// console.log($('uw_kbshortcuts_form').serializeArray());
|
||||
// }
|
||||
|
||||
|
||||
// Ta funkcija se proži, ko vstopimo ali izstopimo iz celozaslonskega načina
|
||||
// This function gets triggered by full screen state change
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
|
||||
"manifest_version": 2,
|
||||
"name": "Ultrawidify-git",
|
||||
"version": "0.9.9.2",
|
||||
"version": "0.9.9.4",
|
||||
|
||||
"icons": {
|
||||
"32":"icons/uw-32.png",
|
||||
|
||||
Loading…
Reference in New Issue
Block a user