Popup: moved stretching settings to a new tab
This commit is contained in:
parent
029efd92ed
commit
0eb70babf3
@ -132,28 +132,18 @@ canStartExtension = function(site) {
|
||||
site = window.location.hostname;
|
||||
}
|
||||
|
||||
console.log("CAN WE START THIS EXTENSION ON SITE", site,
|
||||
"?\n\nExtensionConf.sites[site]=",ExtensionConf.sites[site],
|
||||
"\nExtension mode?", ExtensionConf.extensionMode
|
||||
);
|
||||
// console.log("CAN WE START THIS EXTENSION ON SITE", site,
|
||||
// "?\n\nExtensionConf.sites[site]=",ExtensionConf.sites[site],
|
||||
// "\nExtension mode?", ExtensionConf.extensionMode
|
||||
// );
|
||||
|
||||
if (ExtensionConf.sites[site] === undefined) {
|
||||
return ExtensionConf.extensionMode === "blacklist"; // site not defined, this does default option
|
||||
}
|
||||
|
||||
if (ExtensionConf.extensionMode === "blacklist") {
|
||||
console.log("Extension mode is 'blacklist', returning true unless disabled. Ret:", ExtensionConf.sites[site].status !== "disabled");
|
||||
} else if (ExtensionConf.arDetect.mode === "whitelist" ) {
|
||||
console.log("Extension mode set to 'whitelist, returning true only if enabled", ExtensionConf.sites[site].status === "enabled");
|
||||
} else {
|
||||
console.log("Extension is not even enabled globally");
|
||||
return false;
|
||||
}
|
||||
|
||||
|
||||
if (ExtensionConf.extensionMode === "blacklist") {
|
||||
return ExtensionConf.sites[site].status !== "disabled";
|
||||
} else if (ExtensionConf.arDetect.mode === "whitelist" ) {
|
||||
} else if (ExtensionConf.extensionMode === "whitelist" ) {
|
||||
return ExtensionConf.sites[site].status === "enabled";
|
||||
} else {
|
||||
return false;
|
||||
|
||||
@ -229,6 +229,10 @@ class CommsServer {
|
||||
port.postMessage({cmd: "set-config", conf: ExtensionConf, site: this.server.currentSite})
|
||||
} else if (message.cmd === 'set-stretch') {
|
||||
this.sendToActive(message);
|
||||
} else if (message.cmd === 'set-stretch-default') {
|
||||
ExtensionConf.stretch.initialMode = message.mode;
|
||||
Settings.save(ExtensionConf);
|
||||
this.sendToAll({cmd: 'reload-settings', newConf: ExtensionConf});
|
||||
} else if (message.cmd === 'set-ar') {
|
||||
this.sendToActive(message);
|
||||
} else if (message.cmd === 'autoar-start') {
|
||||
@ -236,10 +240,7 @@ class CommsServer {
|
||||
} else if (message.cmd === "autoar-enable") { // LEGACY - can be removed prolly?
|
||||
ExtensionConf.arDetect.mode = "blacklist";
|
||||
Settings.save(ExtensionConf);
|
||||
this.sendToAll({cmd: "reload-settings", sender: "uwbg"})
|
||||
if(Debug.debug){
|
||||
console.log("[uw-bg] autoar set to enabled (blacklist). evidenz:", ExtensionConf);
|
||||
}
|
||||
this.sendToAll({cmd: 'reload-settings', newConf: ExtensionConf});
|
||||
} else if (message.cmd === "autoar-disable") { // LEGACY - can be removed prolly?
|
||||
ExtensionConf.arDetect.mode = "disabled";
|
||||
if(message.reason){
|
||||
@ -249,9 +250,6 @@ class CommsServer {
|
||||
}
|
||||
Settings.save(ExtensionConf);
|
||||
this.sendToAll({cmd: 'reload-settings', newConf: ExtensionConf});
|
||||
if(Debug.debug){
|
||||
console.log("[uw-bg] autoar set to disabled. evidenz:", ExtensionConf);
|
||||
}
|
||||
} else if (message.cmd === "autoar-set-interval") {
|
||||
if(Debug.debug)
|
||||
console.log("[uw-bg] trying to set new interval for autoAr. New interval is",message.timeout,"ms");
|
||||
|
||||
@ -5,20 +5,22 @@ document.getElementById("uw-version").textContent = browser.runtime.getManifest(
|
||||
|
||||
var Menu = {};
|
||||
// Menu.noVideo = document.getElementById("no-videos-display");
|
||||
Menu.general = document.getElementById("extension-mode");
|
||||
Menu.thisSite = document.getElementById("settings-for-current-site");
|
||||
Menu.arSettings = document.getElementById("aspect-ratio-settings");
|
||||
Menu.autoAr = document.getElementById("autoar-basic-settings");
|
||||
Menu.cssHacks = document.getElementById("css-hacks-settings");
|
||||
Menu.about = document.getElementById("panel-about");
|
||||
Menu.general = document.getElementById("extension-mode");
|
||||
Menu.thisSite = document.getElementById("settings-for-current-site");
|
||||
Menu.arSettings = document.getElementById("aspect-ratio-settings");
|
||||
Menu.autoAr = document.getElementById("autoar-basic-settings");
|
||||
Menu.cssHacks = document.getElementById("css-hacks-settings");
|
||||
Menu.about = document.getElementById("panel-about");
|
||||
Menu.stretchSettings = document.getElementById("stretch-settings")
|
||||
|
||||
var MenuTab = {};
|
||||
MenuTab.general = document.getElementById("_menu_general");
|
||||
MenuTab.thisSite = document.getElementById("_menu_this_site");
|
||||
MenuTab.arSettings = document.getElementById("_menu_aspectratio");
|
||||
MenuTab.cssHacks = document.getElementById("_menu_hacks");
|
||||
MenuTab.about = document.getElementById("_menu_about");
|
||||
MenuTab.autoAr = document.getElementById("_menu_autoar");
|
||||
MenuTab.general = document.getElementById("_menu_general");
|
||||
MenuTab.thisSite = document.getElementById("_menu_this_site");
|
||||
MenuTab.arSettings = document.getElementById("_menu_aspectratio");
|
||||
MenuTab.cssHacks = document.getElementById("_menu_hacks");
|
||||
MenuTab.about = document.getElementById("_menu_about");
|
||||
MenuTab.autoAr = document.getElementById("_menu_autoar");
|
||||
MenuTab.stretchSettings = document.getElementById("_menu_stretch");
|
||||
|
||||
var ExtPanel = {};
|
||||
ExtPanel.globalOptions = {};
|
||||
@ -47,6 +49,13 @@ ArPanel.alignment.center = document.getElementById("_align_center");
|
||||
ArPanel.alignment.right = document.getElementById("_align_right");
|
||||
ArPanel.autoar = {};
|
||||
|
||||
var StretchPanel = {};
|
||||
StretchPanel.global = {};
|
||||
StretchPanel.global.none = document.getElementById("_stretch_global_none");
|
||||
StretchPanel.global.basic = document.getElementById("_stretch_global_basic");
|
||||
StretchPanel.global.hybrid = document.getElementById("_stretch_global_hybrid");
|
||||
StretchPanel.global.conditional = document.getElementById("_stretch_global_conditional");
|
||||
|
||||
|
||||
var selectedMenu = "arSettings";
|
||||
var hasVideos = false;
|
||||
@ -94,6 +103,9 @@ function loadConfig(extensionConf, site){
|
||||
|
||||
// ----------------------
|
||||
//#region extension-basics - SET BASIC EXTENSION OPTIONS
|
||||
if(Debug.debug)
|
||||
console.log("EXT: site is:", site, "|extensionConf for this site: ", (site && extensionConf.sites[site]) ? extensionConf.sites[site] : "default site")
|
||||
|
||||
|
||||
for(var button in ExtPanel.globalOptions) {
|
||||
ExtPanel.globalOptions[button].classList.remove("selected");
|
||||
@ -104,7 +116,7 @@ function loadConfig(extensionConf, site){
|
||||
|
||||
ExtPanel.globalOptions[extensionConf.extensionMode].classList.add("selected");
|
||||
if(site && extensionConf.sites[site]) {
|
||||
ExtPanel.siteOptions[extensionConf.sites[site].arStatus].classList.add("selected");
|
||||
ExtPanel.siteOptions[extensionConf.sites[site].status].classList.add("selected");
|
||||
} else {
|
||||
ExtPanel.siteOptions.default.classList.add("selected");
|
||||
}
|
||||
@ -113,7 +125,7 @@ function loadConfig(extensionConf, site){
|
||||
// ------------
|
||||
//#region autoar - SET AUTOAR OPTIONS
|
||||
// if(Debug.debug)
|
||||
// console.log("Autodetect mode?", extensionConf.arDetect.mode, "| site & site options:", site, ",", (site && extensionConf.sites[site]) ? extensionConf.sites[site].arStatus : "fucky wucky?" );
|
||||
// console.log("Autodetect mode?", extensionConf.arDetect.mode, "| site & site options:", site, ",", (site && extensionConf.sites[site]) ? extensionConf.sites[site].arStatus : "fucky wucky?" );
|
||||
// document.getElementById("_autoAr_disabled_reason").textContent = extensionConf.arDetect.DisabledReason;
|
||||
document.getElementById("_input_autoAr_timer").value = extensionConf.arDetect.timer_playing;
|
||||
|
||||
@ -125,6 +137,7 @@ function loadConfig(extensionConf, site){
|
||||
AutoArPanel.siteOptions[button].classList.remove("selected");
|
||||
}
|
||||
|
||||
|
||||
AutoArPanel.globalOptions[extensionConf.arDetect.mode].classList.add("selected");
|
||||
if(site && extensionConf.sites[site]) {
|
||||
AutoArPanel.siteOptions[extensionConf.sites[site].arStatus].classList.add("selected");
|
||||
@ -141,6 +154,21 @@ function loadConfig(extensionConf, site){
|
||||
ArPanel.alignment[extensionConf.miscFullscreenSettings.videoFloat].classList.add("selected");
|
||||
}
|
||||
|
||||
//#region - SET STRETCH
|
||||
for (var button in StretchPanel.global) {
|
||||
StretchPanel.global[button].classList.remove("selected");
|
||||
}
|
||||
if (extensionConf.stretch.initialMode === 0) {
|
||||
StretchPanel.global.none.classList.add("selected");
|
||||
} else if (extensionConf.stretch.initialMode === 1) {
|
||||
StretchPanel.global.basic.classList.add("selected");
|
||||
} else if (extensionConf.stretch.initialMode === 2) {
|
||||
StretchPanel.global.hybrid.classList.add("selected");
|
||||
} else if (extensionConf.stretch.initialMode === 3) {
|
||||
StretchPanel.global.conditional.classList.add("selected");
|
||||
}
|
||||
//#endregion
|
||||
|
||||
// process keyboard shortcuts:
|
||||
if(extensionConf.keyboard.shortcuts){
|
||||
for(var key in extensionConf.keyboard.shortcuts){
|
||||
@ -315,6 +343,9 @@ document.addEventListener("click", (e) => {
|
||||
else if(e.target.classList.contains("_menu_aspectratio")){
|
||||
openMenu("arSettings");
|
||||
}
|
||||
else if(e.target.classList.contains("_menu_stretch")){
|
||||
openMenu("stretchSettings");
|
||||
}
|
||||
else if(e.target.classList.contains("_menu_hacks")){
|
||||
openMenu("cssHacks");
|
||||
}
|
||||
@ -395,6 +426,20 @@ document.addEventListener("click", (e) => {
|
||||
}
|
||||
}
|
||||
if(e.target.classList.contains("_stretch")){
|
||||
if (e.target.classList.contains("_ar_stretch_global")) {
|
||||
command.cmd = "set-stretch-default"
|
||||
if (e.target.classList.contains("_none")) {
|
||||
command.mode = 0;
|
||||
} else if (e.target.classList.contains("_basic")) {
|
||||
command.mode = 1;
|
||||
} else if (e.target.classList.contains("_hybrid")) {
|
||||
command.mode = 2;
|
||||
} else if (e.target.classList.contains("_conditional")) {
|
||||
command.mode = 3;
|
||||
}
|
||||
return command;
|
||||
}
|
||||
|
||||
if(e.target.classList.contains("_ar_stretch_none")) {
|
||||
command.cmd = "set-stretch";
|
||||
command.mode = "NO_STRETCH";
|
||||
|
||||
@ -17,7 +17,9 @@
|
||||
font-family: "overpass";
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
strike {
|
||||
opacity: 0.5;
|
||||
}
|
||||
a {
|
||||
color: #af7f37;
|
||||
}
|
||||
@ -178,7 +180,10 @@
|
||||
Automatic aspect ratio detection (auto-ar)
|
||||
</div>
|
||||
<div id="_menu_aspectratio" class="menu-item selected _menu_aspectratio">
|
||||
Letterbox removal and alignment
|
||||
Crop settings
|
||||
</div>
|
||||
<div id="_menu_stretch" class="menu-item _menu_stretch">
|
||||
Stretc settings
|
||||
</div>
|
||||
<div id="_menu_csshacks" class="menu-item disabled hidden _menu_hacks">
|
||||
CSS hacks for this site
|
||||
@ -253,8 +258,8 @@
|
||||
</div>
|
||||
|
||||
<div id="aspect-ratio-settings" class="suboption hidden">
|
||||
|
||||
<div id="no-videos-warning" class="warning">No videos were detected on this page. The buttons may not work at all. Check that this site is not blacklisted and reload the page.</div>
|
||||
<div id="no-videos-warning"></div>
|
||||
<!-- <div id="no-videos-warning" class="warning">No videos were detected on this page. The buttons may not work at all. Check that this site is not blacklisted and reload the page.</div> -->
|
||||
<div class="row">
|
||||
<span class="label">Cropping mode</span>
|
||||
<div class="button-row">
|
||||
@ -264,13 +269,6 @@
|
||||
<a class="button _changeAr _ar_189 w24">2:1 (18:9)<br/><span id="_b_changeAr_189_key" class="smallcaps small darker"></span></a>
|
||||
<a class="button _changeAr _ar_169 w24">16:9<br/><span id="_b_changeAr_169_key" class="smallcaps small darker"></span></a>
|
||||
</div>
|
||||
<span class="label">Stretching mode<br><small>Stretching is independent of crop mode. Crop gets applied before stretching.</small></span>
|
||||
<div class="button-row">
|
||||
<a class="button _stretch _ar_stretch_none w24">Never<br/><span id="_b_changeAr_reset_key" class="smallcaps small darker"></span></a>
|
||||
<a class="button _stretch _ar_stretch_basic w24">Basic<br/><span id="_b_changeAr_reset_key" class="smallcaps small darker"></span></a>
|
||||
<a class="button _stretch _ar_stretch_hybrid w24">Hybrid<br/><span id="_b_changeAr_sw_key" class="smallcaps small darker"></span></a>
|
||||
<a class="button _stretch _ar_stretch_conditional w24">Thin borders<br/><span id="_b_changeAr_sh_key" class="smallcaps small darker"></span></a>
|
||||
</div>
|
||||
</div>
|
||||
<!--<div class="row">
|
||||
<span class="label">Automatic aspect ratio autodetection:</span>
|
||||
@ -291,6 +289,28 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="stretch-settings" class="suboption hidden">
|
||||
<p class="warning">
|
||||
Stretching video is currently experimental and has <strike>been tested even less rigorously than the rest of this addon</strike> not been tested thoroughly. If you notice any bugs, please consider reporting via github or email.
|
||||
</p>
|
||||
|
||||
<span class="label">Default stretching mode<br><small>Stretching is independent of crop mode. Crop gets applied before stretching.</small></span>
|
||||
<div class="button-row">
|
||||
<a id="_stretch_global_none" class="button _stretch _ar_stretch_global _none w24">Never<br/><span id="_b_changeAr_reset_key" class="smallcaps small darker"></span></a>
|
||||
<a id="_stretch_global_basic" class="button _stretch _ar_stretch_global _basic w24">Basic<br/><span id="_b_changeAr_reset_key" class="smallcaps small darker"></span></a>
|
||||
<a id="_stretch_global_hybrid" class="button _stretch _ar_stretch_global _hybrid w24">Hybrid<br/><span id="_b_changeAr_sw_key" class="smallcaps small darker"></span></a>
|
||||
<a id="_stretch_global_conditional" class="button _stretch _ar_stretch_global _conditional w24">Thin borders<br/><span id="_b_changeAr_sh_key" class="smallcaps small darker"></span></a>
|
||||
</div>
|
||||
|
||||
<span class="label">Stretching mode for this video<br><small>Temporarily overrides default stretching mode.</small></span>
|
||||
<div class="button-row">
|
||||
<a class="button _stretch _ar_stretch_none w24">Never<br/><span id="_b_changeAr_reset_key" class="smallcaps small darker"></span></a>
|
||||
<a class="button _stretch _ar_stretch_basic w24">Basic<br/><span id="_b_changeAr_reset_key" class="smallcaps small darker"></span></a>
|
||||
<a class="button _stretch _ar_stretch_hybrid w24">Hybrid<br/><span id="_b_changeAr_sw_key" class="smallcaps small darker"></span></a>
|
||||
<a class="button _stretch _ar_stretch_conditional w24">Thin borders<br/><span id="_b_changeAr_sh_key" class="smallcaps small darker"></span></a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="css-hacks-settings" class="suboption hidden">
|
||||
<p>If zoomed in video doesn't align properly, try enabling or disabling certain CSS rules below:</p>
|
||||
</div>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user