Settings page is more or less finished and works. Might need minor fixes before v1.0rc1 becomes v1.0.
This commit is contained in:
Tamius Han
parent
9daac678a0
commit
5062f7f7bb
10
README.md
10
README.md
@ -24,7 +24,7 @@ This extension also allows you to zoom in or out of video (similar to how SMPlay
|
||||
|
||||
### Permanent install
|
||||
|
||||
~~[v0.9.9.5 — Experimental version — download from here](http://tamius.net/ultrawidify) — If 30 minutes old is stable enough for you, this is it. This version is pretty much code from this repo. It's also unlisted so I don't have to go through AMO for every minor change. It hasn't been tested whether autoupdating works, and it probably doesn't.~~
|
||||
[v1.0-rc1 — Experimental version — download from here](http://tamius.net/ultrawidify) — If 30 minutes old is stable enough for you, this is it. This version is pretty much code from this repo. It's also unlisted so I don't have to go through AMO for every minor change. It hasn't been tested whether autoupdating works, and it probably doesn't.
|
||||
|
||||
[v0.9.9 — Regular version — download from AMO](https://addons.mozilla.org/en/firefox/addon/ultrawidify/) — more stable and with AMO's approval. No experimental features either. (NOTE: there's a version number hiccup going on with AMO version. Stuff here on Github is the freshest, regardless of what manifest says)
|
||||
|
||||
@ -32,7 +32,7 @@ This extension also allows you to zoom in or out of video (similar to how SMPlay
|
||||
|
||||
## How do I use it?
|
||||
|
||||
This is the interface (**NOTE: AMO version doesn't have buttons yet!**):
|
||||
This is the interface:
|
||||
|
||||
|
||||
|
||||
@ -54,7 +54,7 @@ If you can read this, you'll probably figure out the rest of the way.
|
||||
|
||||
¹These ratios are calculated using the number in the brackets, as 1920/1080 does not strictly equal to 16/9 (same goes for 21:9).
|
||||
|
||||
**Please note that these keybindings could change at any time, and some definitely will** (apparently some of them conflict with youtube player)**.** I'll try to get them sorted out by the end of october.
|
||||
|
||||
|
||||
## What works
|
||||
|
||||
@ -110,3 +110,7 @@ Keybind `a` just doesn't work at all, so no 16:10.
|
||||
* All buttons in the player's control bar are now also in the settings popup.
|
||||
* Had to scrap settings page in its current form
|
||||
* TODO: sometimes not all buttons can fit in the control bar. Such occurences should be detected.
|
||||
|
||||
###v1.0-rc1
|
||||
|
||||
* Settings page is added and mostly working.
|
||||
|
||||
BIN
img-demo/example-jasonbourne.png
Normal file
BIN
img-demo/example-jasonbourne.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 616 KiB |
97
js/uw.js
97
js/uw.js
@ -66,49 +66,49 @@ if(page_url.indexOf("youtu") != -1){
|
||||
// Yeah hi /r/badcode.
|
||||
// Anyway, because nazi localstorage flat out refuses to store arrays:
|
||||
var DEFAULT_KEYBINDINGS = {
|
||||
1:{ action: "fitw",
|
||||
0:{ action: "fitw",
|
||||
key: 'w',
|
||||
modifiers: []
|
||||
},
|
||||
2:{
|
||||
1:{
|
||||
action: "fith",
|
||||
key: 'e',
|
||||
modifiers: []
|
||||
},
|
||||
3: {
|
||||
2: {
|
||||
action: "reset",
|
||||
key: 'r',
|
||||
modifiers: []
|
||||
},
|
||||
4: {
|
||||
3: {
|
||||
action: "zoom",
|
||||
key: "z",
|
||||
modifiers: []
|
||||
},
|
||||
5: {
|
||||
4: {
|
||||
action: "unzoom",
|
||||
key: "u",
|
||||
modifiers: []
|
||||
},
|
||||
6: {
|
||||
5: {
|
||||
action: "char",
|
||||
targetAR: (21/9),
|
||||
key: "d",
|
||||
modifiers: []
|
||||
},
|
||||
7: {
|
||||
6: {
|
||||
action: "char",
|
||||
targetAR: (16/9),
|
||||
key: "s",
|
||||
modifiers: []
|
||||
},
|
||||
8: {
|
||||
7: {
|
||||
action: "char",
|
||||
targetAR: (16/10),
|
||||
key: "x",
|
||||
modifiers: []
|
||||
},
|
||||
9: {
|
||||
8: {
|
||||
action: "char",
|
||||
targetAR: (4/3),
|
||||
key: "a",
|
||||
@ -423,7 +423,7 @@ function addCtlButtons(provider_id){
|
||||
smenu_ar_options[2].onclick = function(event) {event.stopPropagation(); changeCSS("char", (16/9 )); };
|
||||
smenu_ar_options[3].onclick = function(event) {event.stopPropagation(); changeCSS("char", (21/9 )); };
|
||||
|
||||
// smenu_el[0].onclick = function() { showSettings() };
|
||||
smenu_el[0].onclick = function (event) {event.stopPropagation(); showSettings() };
|
||||
|
||||
smenu_el[5].onclick = function (event) {event.stopPropagation(); changeCSS("fit" ,"fitw" ) };
|
||||
smenu_el[4].onclick = function (event) {event.stopPropagation(); changeCSS("fit" ,"fith" ) };
|
||||
@ -431,58 +431,6 @@ function addCtlButtons(provider_id){
|
||||
smenu_el[1].onclick = function (event) {event.stopPropagation(); changeCSS("fit" ,"zoom" ) };
|
||||
smenu_el[2].onclick = function (event) {event.stopPropagation(); changeCSS("fit" ,"unzoom") };
|
||||
|
||||
|
||||
//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 uw_element";
|
||||
|
||||
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 = "";
|
||||
|
||||
e_player.appendChild(menu_panel);
|
||||
// menu_panel.appendChild(settings_content);
|
||||
|
||||
|
||||
|
||||
document.getElementById('uw_close_settings_view').onclick = function() { hideSettings() };
|
||||
|
||||
//END SETTINGS WINDOW
|
||||
}
|
||||
|
||||
|
||||
@ -493,16 +441,25 @@ function addCtlButtons(provider_id){
|
||||
|
||||
//END UI
|
||||
|
||||
function showSettings(){
|
||||
document.getElementById("uw_settings_panel").style.display = "block";
|
||||
function onOpen(){
|
||||
if(debugmsg)
|
||||
console.log("uw | Options page opened");
|
||||
}
|
||||
function hideSettings(){
|
||||
document.getElementById("uw_settings_panel").style.display = "none";
|
||||
}
|
||||
// function saveKeybinds(){
|
||||
// console.log($('uw_kbshortcuts_form').serializeArray());
|
||||
// }
|
||||
|
||||
function onError(err){
|
||||
if(debug){
|
||||
console.log(`Error: ${error}`);
|
||||
console.log("uw | Error opening the page", err);
|
||||
}
|
||||
}
|
||||
|
||||
function showSettings(){
|
||||
var prettypls = browser.runtime.openOptionsPage();
|
||||
prettypls.then(onOpen, onError);
|
||||
|
||||
console.log(prettypls);
|
||||
|
||||
}
|
||||
|
||||
// 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.6",
|
||||
"version": "1.0rc1",
|
||||
|
||||
"icons": {
|
||||
"32":"res/icons/uw-32.png",
|
||||
@ -41,6 +41,7 @@
|
||||
],
|
||||
|
||||
"options_ui" : {
|
||||
"page": "res/settings.html"
|
||||
"page": "res/settings.html",
|
||||
"open_in_tab": true
|
||||
}
|
||||
}
|
||||
|
||||
@ -76,50 +76,63 @@
|
||||
.tab{
|
||||
color: #fa6607;
|
||||
}
|
||||
.tab-selected{
|
||||
.tab:hover{
|
||||
text-shadow: #aa5 0px 0px 0.02em,#aa5 0px 0px 0.02em;
|
||||
}
|
||||
.tab-selected {
|
||||
color: #ff9 !important;
|
||||
}
|
||||
#all{
|
||||
min-width: 100%;
|
||||
min-height: 100vh;
|
||||
background-image: url('res/img/settings/about-bg.png');
|
||||
background-image: url('img/settings/about-bg.png');
|
||||
background-position: calc(50vw + 20em) 10vh;
|
||||
background-attachment: fixed;
|
||||
background-size: auto 100%;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
.dup_keybinds{
|
||||
background-color: #720 !important;
|
||||
}
|
||||
input[type=text]{
|
||||
font-size: 1em;
|
||||
padding-left: 0.6em;
|
||||
margin-left: 1em;
|
||||
width: 2em;
|
||||
background-color: #000;
|
||||
border: 1px #442 solid;
|
||||
}
|
||||
.uw_shortcuts_line{
|
||||
padding-top: 0.25em;
|
||||
padding-left: 10em;
|
||||
}
|
||||
.uw_shortcuts_label{
|
||||
display: inline-block;
|
||||
color: #fff;
|
||||
width: 7.5em;
|
||||
}
|
||||
.buttonbar{
|
||||
width: 100%;
|
||||
padding-left: 20em;
|
||||
margin-bottom: 2em;
|
||||
}
|
||||
.button{
|
||||
display: inline-block;
|
||||
margin-left: 1em;
|
||||
margin-right: 1em;
|
||||
padding-left: 1em;
|
||||
padding-right: 1em;
|
||||
padding-top: 0.4em;
|
||||
width: 4em;
|
||||
text-align: center;
|
||||
background-color: rgba(0,0,0,0.66);
|
||||
color: #ffc;
|
||||
height: 1.7em;
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
function showAbout(){
|
||||
document.getElementById("uw_shortcuts").classList.add("hide");
|
||||
document.getElementById("about").classList.remove("hide");
|
||||
|
||||
document.getElementById("tab_shortcuts").classList.remove("tab-selected");
|
||||
document.getElementById("tab_about").classList.add("tab-selected");
|
||||
}
|
||||
function showShortcuts(){
|
||||
document.getElementById("uw_shortcuts").classList.remove("hide");
|
||||
document.getElementById("about").classList.add("hide");
|
||||
|
||||
document.getElementById("tab_shortcuts").classList.add("tab-selected");
|
||||
document.getElementById("tab_about").classList.remove("tab-selected");
|
||||
|
||||
}
|
||||
|
||||
//TODO TODO TODO correct resourceToUrl so it'll work properly. (uncomment the return statement)
|
||||
function resourceToUrl(img){
|
||||
return "../" + img;
|
||||
// return chrome.extension.getURL(img);
|
||||
}
|
||||
|
||||
function onload(){
|
||||
//Adding background to 'about' page:
|
||||
document.getElementById("all").style.backgroundImage = "url('" + resourceToUrl("res/img/settings/about-bg.png") + "')";
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="onload()">
|
||||
<body>
|
||||
<div id="all">
|
||||
<header>
|
||||
<div class="content center">
|
||||
@ -129,98 +142,100 @@
|
||||
</div>
|
||||
<div class="tabline center">
|
||||
<div class="content left">
|
||||
<div id="tab_shortcuts" onclick="showShortcuts()" class="block tab tab-selected">Shortcuts</div>
|
||||
<div id="tab_about" onclick="showAbout()" class="block tab">About</div>
|
||||
<div id="tab_shortcuts" class="block tab tab-selected">Shortcuts</div>
|
||||
<div id="tab_about" class="block tab">About</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<div id="uw_shortcuts">
|
||||
<div class="content left">
|
||||
<form>
|
||||
<!-- BEGIN FORM -->
|
||||
<!-- fit width -->
|
||||
<div class="uw_shortcuts_line">
|
||||
<div class="uw_shortcuts_label">Fit to width</div>
|
||||
<input type='checkbox' value='fitw_ctrl' > Ctrl +
|
||||
<input type='checkbox' value='fitw_shift' > Shift +
|
||||
<input type='checkbox' value='fitw_alt' > Alt +
|
||||
<input type='text' name='fitw_letter' maxlength='1' class='shortcut_input'>
|
||||
<input type='checkbox' id='fitw_ctrl' > Ctrl +
|
||||
<input type='checkbox' id='fitw_shift' > Shift +
|
||||
<input type='checkbox' id='fitw_alt' > Alt +
|
||||
<input type='text' id='fitw_letter' maxlength='1' class='shortcut_input'>
|
||||
</div>
|
||||
|
||||
<!-- fit height -->
|
||||
<div class="uw_shortcuts_line">
|
||||
<div class="uw_shortcuts_label">Fit to height</div>
|
||||
<input type='checkbox' value='fith_ctrl' > Ctrl +
|
||||
<input type='checkbox' value='fith_shift' > Shift +
|
||||
<input type='checkbox' value='fith_alt' > Alt +
|
||||
<input type='text' name='fith_letter' maxlength='1' class='shortcut_input'>
|
||||
<input type='checkbox' id='fith_ctrl' > Ctrl +
|
||||
<input type='checkbox' id='fith_shift' > Shift +
|
||||
<input type='checkbox' id='fith_alt' > Alt +
|
||||
<input type='text' id='fith_letter' maxlength='1' class='shortcut_input'>
|
||||
</div>
|
||||
|
||||
<!-- reset -->
|
||||
<div class="uw_shortcuts_line">
|
||||
<div class="uw_shortcuts_label">Reset</div>
|
||||
<input type='checkbox' value='reset_ctrl' > Ctrl +
|
||||
<input type='checkbox' value='reset_shift' > Shift +
|
||||
<input type='checkbox' value='reset_alt' > Alt +
|
||||
<input type='text' name='reset_letter' maxlength='1' class='shortcut_input'>
|
||||
<input type='checkbox' id='reset_ctrl' > Ctrl +
|
||||
<input type='checkbox' id='reset_shift' > Shift +
|
||||
<input type='checkbox' id='reset_alt' > Alt +
|
||||
<input type='text' id='reset_letter' maxlength='1' class='shortcut_input'>
|
||||
</div>
|
||||
|
||||
<!-- zoom -->
|
||||
<div class="uw_shortcuts_line">
|
||||
<div class="uw_shortcuts_label">Zoom</div>
|
||||
<input type='checkbox' value='zoom_ctrl' > Ctrl +
|
||||
<input type='checkbox' value='zoom_shift' > Shift +
|
||||
<input type='checkbox' value='zoom_alt' > Alt +
|
||||
<input type='text' name='zoom_letter' maxlength='1' class='shortcut_input'>
|
||||
<input type='checkbox' id='zoom_ctrl' > Ctrl +
|
||||
<input type='checkbox' id='zoom_shift' > Shift +
|
||||
<input type='checkbox' id='zoom_alt' > Alt +
|
||||
<input type='text' id='zoom_letter' maxlength='1' class='shortcut_input'>
|
||||
</div>
|
||||
|
||||
<!-- unzoom -->
|
||||
<div class="uw_shortcuts_line">
|
||||
<div class="uw_shortcuts_label">Unzoom</div>
|
||||
<input type='checkbox' value='unzoom_ctrl' > Ctrl +
|
||||
<input type='checkbox' value='unzoom_shift' > Shift +
|
||||
<input type='checkbox' value='unzoom_alt' > Alt +
|
||||
<input type='text' name='unzoom_letter' maxlength='1' class='shortcut_input'>
|
||||
<input type='checkbox' id='unzoom_ctrl' > Ctrl +
|
||||
<input type='checkbox' id='unzoom_shift' > Shift +
|
||||
<input type='checkbox' id='unzoom_alt' > Alt +
|
||||
<input type='text' id='unzoom_letter' maxlength='1' class='shortcut_input'>
|
||||
</div>
|
||||
|
||||
<!-- force 21:9 -->
|
||||
<div class="uw_shortcuts_line">
|
||||
<div class="uw_shortcuts_label">Fit to height</div>
|
||||
<input type='checkbox' value='ar219_ctrl' > Ctrl +
|
||||
<input type='checkbox' value='ar219_shift' > Shift +
|
||||
<input type='checkbox' value='ar219_alt' > Alt +
|
||||
<input type='text' name='ar219_letter' maxlength='1' class='shortcut_input'>
|
||||
<input type='checkbox' id='ar219_ctrl' > Ctrl +
|
||||
<input type='checkbox' id='ar219_shift' > Shift +
|
||||
<input type='checkbox' id='ar219_alt' > Alt +
|
||||
<input type='text' id='ar219_letter' maxlength='1' class='shortcut_input'>
|
||||
</div>
|
||||
|
||||
<!-- force 16:9 -->
|
||||
<div class="uw_shortcuts_line">
|
||||
<div class="uw_shortcuts_label">Fit to height</div>
|
||||
<input type='checkbox' value='ar169_ctrl' > Ctrl +
|
||||
<input type='checkbox' value='ar169_shift' > Shift +
|
||||
<input type='checkbox' value='ar169_alt' > Alt +
|
||||
<input type='text' name='ar169_letter' maxlength='1' class='shortcut_input'>
|
||||
<input type='checkbox' id='ar169_ctrl' > Ctrl +
|
||||
<input type='checkbox' id='ar169_shift' > Shift +
|
||||
<input type='checkbox' id='ar169_alt' > Alt +
|
||||
<input type='text' id='ar169_letter' maxlength='1' class='shortcut_input'>
|
||||
</div>
|
||||
|
||||
<!-- force 16:10 -->
|
||||
<div class="uw_shortcuts_line">
|
||||
<div class="uw_shortcuts_label">Fit to height</div>
|
||||
<input type='checkbox' value='ar1610_ctrl' > Ctrl +
|
||||
<input type='checkbox' value='ar1610_shift' > Shift +
|
||||
<input type='checkbox' value='ar1610_alt' > Alt +
|
||||
<input type='text' name='ar1610_letter' maxlength='1' class='shortcut_input'>
|
||||
<input type='checkbox' id='ar1610_ctrl' > Ctrl +
|
||||
<input type='checkbox' id='ar1610_shift' > Shift +
|
||||
<input type='checkbox' id='ar1610_alt' > Alt +
|
||||
<input type='text' id='ar1610_letter' maxlength='1' class='shortcut_input'>
|
||||
</div>
|
||||
|
||||
<!-- force 4:3 -->
|
||||
<div class="uw_shortcuts_line">
|
||||
<div class="uw_shortcuts_label">Fit to height</div>
|
||||
<input type='checkbox' value='ar43_ctrl' > Ctrl +
|
||||
<input type='checkbox' value='ar43_shift' > Shift +
|
||||
<input type='checkbox' value='ar43_alt' > Alt +
|
||||
<input type='text' name='ar43_letter' maxlength='1' class='shortcut_input'>
|
||||
<input type='checkbox' id='ar43_ctrl' > Ctrl +
|
||||
<input type='checkbox' id='ar43_shift' > Shift +
|
||||
<input type='checkbox' id='ar43_alt' > Alt +
|
||||
<input type='text' id='ar43_letter' maxlength='1' class='shortcut_input'>
|
||||
</div>
|
||||
<!-- END FORM -->
|
||||
</form>
|
||||
<div class="buttonbar">Cancel | Close</div>
|
||||
<div class="buttonbar"><div class="button" id="kb_cancel">Cancel</div><div class="button" id="kb_save">Save</div></div>
|
||||
<div id="errbox"></div>
|
||||
<div><b>Note:</b> keyboard shortcut conflicts aren't handled by this extension. You must know your shortcuts.<br/><b>Pro tip:</b> If you don't want to have a keybind for a shortcut, just uncheck all boxes for the action and remove the letter</div>
|
||||
<div><small><b>Note:</b> keyboard shortcut conflicts aren't handled by this extension. You must know your shortcuts.<br/><b>Pro tip:</b> If you don't want to have a keybind for a shortcut, just uncheck all boxes for the action and remove the letter</small></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -239,6 +254,9 @@
|
||||
<p>Special thanks to me for making this extension. You're welcome.</p>
|
||||
</div>
|
||||
</div>
|
||||
</all>
|
||||
</div>
|
||||
|
||||
|
||||
<script src="./settings.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
150
res/settings.js
Normal file
150
res/settings.js
Normal file
@ -0,0 +1,150 @@
|
||||
function showAbout(){
|
||||
document.getElementById("uw_shortcuts").classList.add("hide");
|
||||
document.getElementById("about").classList.remove("hide");
|
||||
|
||||
document.getElementById("tab_shortcuts").classList.remove("tab-selected");
|
||||
document.getElementById("tab_about").classList.add("tab-selected");
|
||||
}
|
||||
function showShortcuts(){
|
||||
document.getElementById("uw_shortcuts").classList.remove("hide");
|
||||
document.getElementById("about").classList.add("hide");
|
||||
|
||||
document.getElementById("tab_shortcuts").classList.add("tab-selected");
|
||||
document.getElementById("tab_about").classList.remove("tab-selected");
|
||||
|
||||
}
|
||||
|
||||
function saveopts(){
|
||||
|
||||
var actions = ["fitw", "fith", "reset", "zoom", "unzoom", "ar219", "ar169", "ar1610", "ar43"];
|
||||
var new_keybinds = {};
|
||||
|
||||
// Preberemo naš obrazec in iz njega naredimo nov objekt z bližnjicami.
|
||||
// Let's read our form and make a new object with keybinds.
|
||||
|
||||
for(var i = 0; i < actions.length; i++){
|
||||
var action = actions[i];
|
||||
var targetAR = "";
|
||||
|
||||
if(action == "ar219"){
|
||||
action = "char";
|
||||
targetAR = (21/9);
|
||||
}
|
||||
if(action == "ar169"){
|
||||
action = "char";
|
||||
targetAR = (16/9);
|
||||
}
|
||||
if(action == "ar1610"){
|
||||
action = "char";
|
||||
targetAR = (16/10);
|
||||
}
|
||||
if(action == "ar43"){
|
||||
action = "char";
|
||||
targetAR = (4/3);
|
||||
}
|
||||
|
||||
if(targetAR != ""){
|
||||
var keybind = {
|
||||
action: action,
|
||||
targetAR: targetAR,
|
||||
key: document.querySelector("#" + actions[i] + "_letter").value.toLowerCase().replace(/[^a-z0-9]/,""),
|
||||
modifiers: []
|
||||
}
|
||||
}
|
||||
else{
|
||||
var keybind = {
|
||||
action: action,
|
||||
key: document.querySelector("#" + actions[i] + "_letter").value.toLowerCase().replace(/[^a-z0-9]/,""),
|
||||
modifiers: []
|
||||
}
|
||||
}
|
||||
|
||||
if(document.querySelector("#" + actions[i] + "_ctrl").checked)
|
||||
keybind.modifiers.push("ctrl");
|
||||
if(document.querySelector("#" + actions[i] + "_alt").checked)
|
||||
keybind.modifiers.push("alt");
|
||||
if(document.querySelector("#" + actions[i] + "_shift").checked)
|
||||
keybind.modifiers.push("shift");
|
||||
|
||||
new_keybinds[i] = keybind;
|
||||
}
|
||||
|
||||
// Preveriti moramo, da nismo dvema možnostima dodali isto bližnjico.
|
||||
// We need to check if all keybinds are unique.
|
||||
|
||||
var fail = false;
|
||||
|
||||
for(var i = 0; i < actions.length; i++)
|
||||
document.querySelector("#" + actions[i] + "_letter").classList.remove("dup_keybinds");
|
||||
|
||||
for(var i = 0; i < actions.length; i++){
|
||||
if(new_keybinds[i].key == "")
|
||||
continue;
|
||||
|
||||
for(var j = i + 1; j < actions.length; j++){
|
||||
if(new_keybinds[i].key == new_keybinds[j].key){
|
||||
if(compareModifiers(new_keybinds[i].modifiers, new_keybinds[j].modifiers)){
|
||||
fail = true;
|
||||
document.querySelector("#" + actions[i] + "_letter").classList.add("dup_keybinds");
|
||||
document.querySelector("#" + actions[j] + "_letter").classList.add("dup_keybinds");
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (!fail){
|
||||
browser.storage.local.set({ultrawidify_keybinds:new_keybinds});
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function compareModifiers(a,b){
|
||||
//NOTE: to je precej slab in neprenoslijv način primerjanja dveh tabel, ampak za naš primer deluje dovolj
|
||||
// dobro, saj 'ctrl' vedno pride pred 'alt' in 'alt' vedno pride pred 'shift' (če se sploh pojavijo).
|
||||
//NOTE: this is bad and totally unfoolproof practice. In our example comparing arrays the way we do works
|
||||
// because values ALWAYS appear in the same order: 'ctrl' always appears before 'alt' (or it doesn't
|
||||
// appear at all). 'alt' always appears before 'shift' (or it doesn't appear at all).
|
||||
if(a.length != b.length)
|
||||
return false;
|
||||
|
||||
var match = true;
|
||||
for(var i = 0; i < a.length; i++)
|
||||
match &= a[i] == b[i]
|
||||
|
||||
return match;
|
||||
}
|
||||
|
||||
function printerr(err){
|
||||
console.log(err);
|
||||
}
|
||||
|
||||
function gotopts(opts){
|
||||
var KEYBINDS = Object.keys(opts.ultrawidify_keybinds).map(function (key) { return opts.ultrawidify_keybinds[key];});
|
||||
|
||||
var actions = ["fitw", "fith", "reset", "zoom", "unzoom", "ar219", "ar169", "ar1610", "ar43"];
|
||||
for(var i = 0; i < actions.length; i++){
|
||||
document.querySelector("#" + actions[i] + "_letter").classList.remove("dup_keybinds");
|
||||
document.querySelector("#" + actions[i] + "_letter").value = KEYBINDS[i].key;
|
||||
for(var j = 0; j < KEYBINDS[i].modifiers.length; j++){
|
||||
if(KEYBINDS[i].modifiers[j] == "ctrl")
|
||||
document.querySelector("#" + actions[i] + "_ctrl").checked = true;
|
||||
if(KEYBINDS[i].modifiers[j] == "alt")
|
||||
document.querySelector("#" + actions[i] + "_alt").checked = true;
|
||||
if(KEYBINDS[i].modifiers[j] == "shift")
|
||||
document.querySelector("#" + actions[i] + "_shift").checked = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function loadopts(){
|
||||
var ask4keybinds = browser.storage.local.get("ultrawidify_keybinds");
|
||||
ask4keybinds.then(gotopts, printerr);
|
||||
}
|
||||
|
||||
document.addEventListener("DOMContentLoaded", loadopts);
|
||||
|
||||
document.querySelector("#tab_shortcuts").addEventListener("click", showShortcuts);
|
||||
document.querySelector("#tab_about").addEventListener("click", showAbout);
|
||||
|
||||
document.querySelector("#kb_save").addEventListener("click", saveopts);
|
||||
document.querySelector("#kb_cancel").addEventListener("click",loadopts);
|
||||
BIN
ultrawidify.zip
Normal file
BIN
ultrawidify.zip
Normal file
Binary file not shown.
Loading…
Reference in New Issue
Block a user