tamius-han/ultrawidify
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Enumification, reorg of ExtensionConf

Browse Source
This commit is contained in:
Tamius Han 2019-01-20 22:59:06 +01:00
parent 08469074a6
commit d2a8a177a7
21 changed files with 308 additions and 162 deletions

2
src/common/components/action-alt.vue
View File

@ -107,7 +107,7 @@
</template>
<script>
import StretchMode from '../enums/stretch-mode';
import StretchMode from '../enums/stretch.enum';
import KeyboardShortcutParser from '../js/KeyboardShortcutParser';

2
src/common/components/action-row.vue
View File

@ -46,7 +46,7 @@
</template>
<script>
import StretchMode from '../enums/stretch-mode';
import StretchMode from '../enums/stretch.enum';
import KeyboardShortcutParser from '../js/KeyboardShortcutParser'
export default {

7
src/common/enums/extension-mode.js → src/common/enums/extension-mode.enum.js
View File

@ -2,8 +2,9 @@ var ExtensionMode = Object.freeze({
AutoDisabled: -2,
Disabled: -1,
Default: 0,
Basic: 1,
Full: 2
Whitelist: 1,
Basic: 2,
Enabled: 3,
});
export default ExtensionMode;
export default ExtensionMode;

8
src/common/enums/stretch-mode.js
View File

@ -1,8 +0,0 @@
var StretchMode = Object.freeze({
NO_STRETCH: 0,
BASIC: 1,
HYBRID: 2,
CONDITIONAL: 3
});
export default StretchMode;

9
src/common/enums/stretch.enum.js Normal file
View File

@ -0,0 +1,9 @@
var Stretch = Object.freeze({
NoStretch: 0,
Basic: 1,
Hybrid: 2,
Conditional: 3,
Default: -1
});
export default Stretch;

8
src/common/enums/video-alignment.enum.js Normal file
View File

@ -0,0 +1,8 @@
var VideoAlignment = Object.freeze({
Left: 0,
Center: 1,
Right: 2,
Default: -1
});
export default VideoAlignment;

40
src/ext/conf/ActionList.js
View File

@ -1,3 +1,7 @@
import VideoAlignment from '../../common/enums/video-alignment.enum';
import Stretch from '../../common/enums/stretch.enum';
import ExtensionMode from '../../common/enums/extension-mode.enum';
var ActionList = {
'set-ar': {
name: 'Set aspect ratio',
@ -24,22 +28,22 @@ var ActionList = {
page: true,
}
},
'stretch': {
'set-stretch': {
name: 'Set stretch',
args: [{
name: 'Normal',
arg: 0
arg: Stretch.NoStretch
},{
name: 'Basic',
arg: 1,
arg: Stretch.Basic,
},{
name: 'Hybrid',
arg: 2,
arg: Stretch.Hybrid,
},{
name: 'Thin borders',
arg: 3,
arg: Stretch.Conditional,
},{
name: 'Default',
name: Stretch.Default,
arg: -1,
scopes: {
site: true
@ -55,16 +59,16 @@ var ActionList = {
name: 'Set video alignment',
args: [{
name: 'Left',
arg: 'left',
arg: VideoAlignment.Left,
},{
name: 'Center',
arg: 'center',
arg: VideoAlignment.Center,
},{
name: 'Right',
arg: 'right'
arg: VideoAlignment.Right
},{
name: 'Default',
arg: 'default',
arg: VideoAlignment.Default,
scopes: {
site: true,
}
@ -127,22 +131,22 @@ var ActionList = {
name: 'Set extension mode',
args: [{
name: 'Enable',
arg: 'blacklist',
arg: ExtensionMode.Enabled,
},{
name: 'On whitelisted only',
arg: 'whitelist',
arg: ExtensionMode.Whitelist,
scopes: {
global: true,
}
},{
name: 'Default',
arg: 'default',
arg: ExtensionMode.Default,
scopes: {
page: true,
}
},{
name: 'Disable',
arg: 'disabled'
arg: ExtensionMode.Default
}],
scopes: {
global: true,
@ -153,22 +157,22 @@ var ActionList = {
name: 'Set automatic aspect ratio detection mode',
args: [{
name: 'Enable',
arg: 'blacklist',
arg: ExtensionMode.Enabled,
},{
name: 'On whitelisted only',
arg: 'whitelist',
arg: ExtensionMode.Whitelist,
scopes: {
global: true,
}
},{
name: 'Default',
arg: 'default',
arg: ExtensionMode.Default,
scopes: {
page: true,
}
},{
name: 'Disable',
arg: 'disabled'
arg: ExtensionMode.Disabled
}],
scopes: {
global: true,

85
src/ext/conf/ExtensionConf.js
View File

@ -1,20 +1,14 @@
import Debug from './Debug';
import currentBrowser from './BrowserDetect';
import VideoAlignment from '../../common/enums/video-alignment.enum';
import Stretch from '../../common/enums/stretch.enum';
import ExtensionMode from '../../common/enums/extension-mode.enum';
if(Debug.debug)
console.log("Loading: ExtensionConf.js");
var ExtensionConf = {
basicExtensionMode: "blacklist",
extensionMode: "blacklist", // how should this extension work?
// 'blacklist' - work everywhere except blacklist
// 'whitelist' - only work on whitelisted sites
// 'disabled' - work nowhere
arDetect: {
mode: "blacklist", // how should autodetection work?
// 'blacklist' - work by default, problem sites need to be blocked
// 'whitelist' - only work if site has been specifically approved
// 'disabled' - don't work at all
disabledReason: "", // if automatic aspect ratio has been disabled, show reason
allowedMisaligned: 0.05, // top and bottom letterbox thickness can differ by this much.
// Any more and we don't adjust ar.
@ -60,7 +54,6 @@ var ExtensionConf = {
edgeTolerancePercent: null // unused. same as above, except use % of canvas height instead of pixels
},
fallbackMode: {
enabled: true,
safetyBorderPx: 5, // determines the thickness of safety border in fallback mode
noTriggerZonePx: 8 // if we detect edge less than this many pixels thick, we don't correct.
},
@ -106,15 +99,12 @@ var ExtensionConf = {
announceDebounce: 200 // we wait this long before announcing new zoom
},
miscSettings: {
videoAlignment: "center",
mousePan: {
enabled: false
},
mousePanReverseMouse: false,
defaultAr: "original",
},
stretch: {
initialMode: 0, // 0 - no stretch, 1 - basic, 2 - hybrid, 3 - conditional
conditionalDifferencePercent: 0.05 // black bars less than this wide will trigger stretch
// if mode is set to '1'. 1.0=100%
},
@ -130,11 +120,6 @@ var ExtensionConf = {
rescan: 1500
}
},
colors:{
// criticalFail: "background: #fa2; color: #000"
},
keyboard: {
},
// -----------------------------------------
// ::: ACTIONS :::
// -----------------------------------------
@ -427,7 +412,7 @@ var ExtensionConf = {
label: 'Don\'t stretch',
cmd: [{
action: 'set-stretch',
arg: 0,
arg: Stretch.NoStretch,
}],
scopes: {
global: {
@ -452,7 +437,7 @@ var ExtensionConf = {
label: 'Basic stretch',
cmd: [{
action: 'set-stretch',
arg: 1,
arg: Stretch.Basic,
}],
scopes: {
global: {
@ -477,7 +462,7 @@ var ExtensionConf = {
label: 'Hybrid stretch',
cmd: [{
action: 'set-stretch',
arg: 2,
arg: Stretch.Hybrid,
}],
scopes: {
global: {
@ -502,7 +487,7 @@ var ExtensionConf = {
label: 'Thin borders only',
cmd: [{
action: 'set-stretch',
arg: 3,
arg: Stretch.Conditional,
}],
scopes: {
global: {
@ -527,7 +512,7 @@ var ExtensionConf = {
label: 'Default',
cmd: [{
action: 'set-stretch',
arg: -1,
arg: Stretch.Default,
}],
scopes: {
site: {
@ -543,7 +528,7 @@ var ExtensionConf = {
label: 'Left',
cmd: [{
action: 'set-alignment',
arg: 'left'
arg: VideoAlignment.Left,
}],
scopes: {
global: {
@ -565,7 +550,7 @@ var ExtensionConf = {
label: 'Center',
cmd: [{
action: 'set-alignment',
arg: 'center'
arg: VideoAlignment.Center,
}],
scopes: {
global: {
@ -587,7 +572,7 @@ var ExtensionConf = {
label: 'Right',
cmd: [{
action: 'set-alignment',
arg: 'right'
arg: VideoAlignment.Right
}],
scopes: {
global: {
@ -609,7 +594,7 @@ var ExtensionConf = {
label: 'Default',
cmd: [{
action: 'set-alignment',
arg: 'default'
arg: VideoAlignment.Default
}],
scopes: {
site: {
@ -626,7 +611,7 @@ var ExtensionConf = {
label: 'Enable',
cmd: [{
action: 'set-extension-mode',
arg: 'blacklist',
arg: ExtensionMode.Enabled,
persistent: true,
}],
scopes: {
@ -642,7 +627,7 @@ var ExtensionConf = {
label: 'On whitelist only',
cmd: [{
action: 'set-extension-mode',
arg: 'whitelist',
arg: ExtensionMode.Whitelist,
persistent: true,
}],
scopes: {
@ -655,7 +640,7 @@ var ExtensionConf = {
label: 'Default',
cmd: [{
action: 'set-extension-mode',
arg: 'default',
arg: ExtensionMode.Default,
persistent: true,
}],
scopes: {
@ -668,7 +653,7 @@ var ExtensionConf = {
label: 'Disable',
cmd: [{
action: 'set-extension-mode',
arg: 'disabled',
arg: ExtensionMode.Disabled,
persistent: true,
}],
scopes: {
@ -684,7 +669,7 @@ var ExtensionConf = {
label: 'Enabled',
cmd: [{
action: 'set-autoar-mode',
arg: 'blacklist',
arg: ExtensionMode.Enabled,
persistent: true,
}],
scopes: {
@ -700,7 +685,7 @@ var ExtensionConf = {
label: 'On whitelist only',
cmd: [{
action: 'set-autoar-mode',
arg: 'whitelist',
arg: ExtensionMode.Whitelist,
persistent: true,
}],
scopes: {
@ -713,7 +698,7 @@ var ExtensionConf = {
label: 'Default',
cmd: [{
action: 'set-autoar-mode',
arg: 'default',
arg: ExtensionMode.Default,
persistent: true,
}],
scopes: {
@ -726,7 +711,7 @@ var ExtensionConf = {
label: 'Disable',
cmd: [{
action: 'set-autoar-mode',
arg: 'disabled',
arg: ExtensionMode.Disabled,
persistent: true,
}],
scopes: {
@ -770,18 +755,36 @@ var ExtensionConf = {
// * disabled — never allow
//
sites: {
"@global": { // global defaults. Possible options will state site-only options in order
// to avoid writing this multiple times. Tags:
// #g — only available in @global
// #s — only available for specific site
mode: ExtensionMode.Enabled, // How should extension work:
// 'enabled' - work everywhere except blacklist
// 'whitelist' - only work on whitelisted sites (#g)
// 'disabled' - work nowhere
// 'basic' - (Possible future use)
// 'default' - follow global rules (#s)
autoar: ExtensionMode.Enabled, // Should we try to automatically detect aspect ratio?
// Options: 'enabled', 'whitelist' (#g), 'default' (#s), 'disabled'
autoarFallback: currentBrowser.firefox ? // if autoAr fails, try fallback mode?
ExtensionMode.Enabled : // Options same as in autoar.
ExtensionMode.Disabled, // if autoar is disabled, this setting is irrelevant
stretch: Stretch.NoStretch, // Default stretch mode.
videoAlignment: VideoAlignment.Center, // Video alignment
},
"www.youtube.com" : {
status: "enabled", // should extension work on this site?
arStatus: "default", // should we enable autodetection
statusEmbedded: "enabled", // should extension work for this site when embedded on other sites?
mode: ExtensionMode.Enabled,
autoar: ExtensionMode.Enabled,
autoarFallback: ExtensionMode.Enabled,
override: false, // ignore value localStorage in favour of this
type: 'official', // is officially supported? (Alternatives are 'community' and 'user-defined')
actions: null, // overrides global keyboard shortcuts and button configs. Is array, is optional.
},
"www.netflix.com" : {
status: "enabled",
arStatus: currentBrowser.firefox ? "default" : "disabled",
statusEmbedded: "enabled",
mode: ExtensionMode.Enabled,
autoar: currentBrowser.firefox ? ExtensionMode.Enabled : ExtensionMode.Disabled,
override: false,
type: 'official'
},

8
src/ext/lib/ActionHandler.js
View File

@ -210,13 +210,13 @@ class ActionHandler {
this.settings.save();
} else if (action.scope === 'global') {
if (cmd.action === "set-stretch") {
this.settings.active.stretch.initialMode = cmd.arg;
this.settings.active.site['@global'].stretch = cmd.arg;
} else if (cmd.action === "set-alignment") {
this.settings.active.miscSettings.videoAlignment = cmd.arg;
this.settings.active.site['@global'].videoAlignment = cmd.arg;
} else if (cmd.action === "set-extension-mode") {
this.settings.active.extensionMode = cmd.arg;
this.settings.active.sites['@global'] = cmd.arg;
} else if (cmd.action === "set-autoar-mode") {
this.settings.active.arDetect.mode.arStatus = cmd.arg;
this.settings.active.site['@global'].autoar.arStatus = cmd.arg;
}
this.settings.save();
}

30
src/ext/lib/Settings.js
View File

@ -237,20 +237,20 @@ class Settings {
try {
// if site-specific settings don't exist for the site, we use default mode:
if (! this.active.sites[site]) {
if (this.active.extensionMode === "blacklist") {
return ExtensionMode.Full;
if (this.active.sites['@global'] === "blacklist") {
return ExtensionMode.Enabled;
} else {
return this.active.basicExtensionMode === "blacklist" ? ExtensionMode.Basic : ExtensionMode.Disabled;
}
}
if (this.active.sites[site].status === 'enabled') {
return ExtensionMode.Full;
return ExtensionMode.Enabled;
} else if (this.active.sites[site].status === 'basic') {
return ExtensionMode.Basic;
} else if (this.active.sites[site].status === 'default') {
if (this.active.extensionMode === "blacklist") {
return ExtensionMode.Full;
if (this.active.sites['@global'] === "blacklist") {
return ExtensionMode.Enabled;
} else {
return this.active.basicExtensionMode === "blacklist" ? ExtensionMode.Basic : ExtensionMode.Disabled;
}
@ -289,12 +289,12 @@ class Settings {
try{
// if site is not defined, we use default mode:
if (! this.active.sites[site]) {
return this.active.extensionMode === "blacklist";
return this.active.sites['@global'] === "blacklist";
}
if(this.active.extensionMode === "blacklist") {
if(this.active.sites['@global'] === "blacklist") {
return this.active.sites[site].status !== "disabled";
} else if (this.active.extensionMode === "whitelist") {
} else if (this.active.sites['@global'] === "whitelist") {
return this.active.sites[site].status === "enabled";
} else {
return false;
@ -308,7 +308,7 @@ class Settings {
}
extensionEnabled(){
return this.active.extensionMode !== 'disabled'
return this.active.sites['@global'] !== 'disabled'
}
extensionEnabledForSite(site) {
@ -334,19 +334,19 @@ class Settings {
console.log("[Settings::canStartAutoAr] ----------------\nCAN WE START THIS EXTENSION ON SITE", site,
"?\n\nsettings.active.sites[site]=", this.active.sites[site],
"\nExtension mode?", this.active.arDetect.mode,
"\nExtension mode?", this.active.site['@global'].autoar,
"\nCan extension be started?", csar
);
}
// if site is not defined, we use default mode:
if (! this.active.sites[site]) {
return this.active.arDetect.mode === "blacklist";
return this.active.site['@global'].autoar === "blacklist";
}
if (this.active.arDetect.mode === "blacklist") {
if (this.active.site['@global'].autoar === "blacklist") {
return this.active.sites[site].arStatus !== "disabled";
} else if (this.active.arDetect.mode === "whitelist") {
} else if (this.active.site['@global'].autoar === "whitelist") {
return this.active.sites[site].arStatus === "enabled";
} else {
return false;
@ -368,7 +368,7 @@ class Settings {
if (site.stretch) {
return site.stretch;
}
return this.active.stretch.initialMode;
return this.active.site['@global'].stretch;
}
getDefaultVideoAlignment(site) {
@ -377,7 +377,7 @@ class Settings {
if (site.videoAlignment) {
return site.videoAlignment;
}
return this.active.miscSettings.videoAlignment;
return this.active.site['@global'].videoAlignment;
}
}

8
src/ext/lib/comms/CommsServer.js
View File

@ -225,14 +225,14 @@ class CommsServer {
}
Promise.resolve(ret);
} else if (message.cmd === "autoar-enable") {
this.settings.active.arDetect.mode = "blacklist";
this.settings.active.site['@global'].autoar = "blacklist";
this.settings.save();
this.sendToAll({cmd: "reload-settings", sender: "uwbg"})
if(Debug.debug){
console.log("[uw-bg] autoar set to enabled (blacklist). evidenz:", this.settings.active);
}
} else if (message.cmd === "autoar-disable") {
this.settings.active.arDetect.mode = "disabled";
this.settings.active.site['@global'].autoar = "disabled";
if(message.reason){
this.settings.active.arDetect.disabledReason = message.reason;
} else {
@ -268,14 +268,14 @@ class CommsServer {
sendResponse({extensionConf: JSON.stringify(this.settings.active), site: this.getCurrentTabHostname()});
// return true;
} else if (message.cmd === "autoar-enable") {
this.settings.active.arDetect.mode = "blacklist";
this.settings.active.site['@global'].autoar = "blacklist";
this.settings.save();
this.sendToAll({cmd: "reload-settings", sender: "uwbg"})
if(Debug.debug){
console.log("[uw-bg] autoar set to enabled (blacklist). evidenz:", this.settings.active);
}
} else if (message.cmd === "autoar-disable") {
this.settings.active.arDetect.mode = "disabled";
this.settings.active.site['@global'].autoar = "disabled";
if(message.reason){
this.settings.active.arDetect.disabledReason = message.reason;
} else {

4
src/ext/lib/video-data/PlayerData.js
View File

@ -41,7 +41,7 @@ class PlayerData {
this.dimensions = undefined;
this.overlayNode = undefined;
if (this.extensionMode === ExtensionMode.Full) {
if (this.extensionMode === ExtensionMode.Enabled) {
this.getPlayerDimensions();
}
this.startChangeDetection();
@ -213,7 +213,7 @@ class PlayerData {
}
ghettoWatcher(){
if (this.extensionMode === ExtensionMode.Full) {
if (this.extensionMode === ExtensionMode.Enabled) {
this.ghettoWatcherFull();
this.scheduleGhettoWatcher();
} else if (this.extensionMode === ExtensionMode.Basic) {

24
src/ext/lib/video-transform/Resizer.js
View File

@ -4,7 +4,7 @@ import Stretcher from './Stretcher';
import Zoom from './Zoom';
import PlayerData from '../video-data/PlayerData';
import ExtensionMode from '../../../common/enums/extension-mode';
import StretchMode from '../../../common/enums/stretch-mode';
import StretchMode from '../../../common/enums/stretch.enum';
if(Debug.debug)
console.log("Loading: Resizer.js");
@ -88,7 +88,7 @@ class Resizer {
}
}
if (this.extensionMode !== ExtensionMode.Full && !PlayerData.isFullScreen() && ar !== 'reset') {
if (this.extensionMode !== ExtensionMode.Enabled && !PlayerData.isFullScreen() && ar !== 'reset') {
// don't actually apply or calculate css when using basic mode if not in fullscreen
// ... unless we're resetting the aspect ratio to original
return;
@ -99,21 +99,21 @@ class Resizer {
this.videoData.destroy();
}
if (this.extensionMode !== ExtensionMode.Full || PlayerData.isFullScreen()) {
if (this.extensionMode !== ExtensionMode.Enabled || PlayerData.isFullScreen()) {
this.startCssWatcher();
}
this.cssWatcherIncreasedFrequencyCounter = 20;
// // pause AR on basic stretch, unpause when using other mdoes
// fir sine reason unpause doesn't unpause. investigate that later
// if (this.stretcher.mode === StretchMode.BASIC) {
// if (this.stretcher.mode === StretchMode.Basic) {
// this.conf.arDetector.pause();
// } else {
// this.conf.arDetector.unpause();
// }
// do stretch thingy
if (this.stretcher.mode === StretchMode.NO_STRETCH || this.stretcher.mode === StretchMode.CONDITIONAL){
if (this.stretcher.mode === StretchMode.NoStretch || this.stretcher.mode === StretchMode.Conditional){
var stretchFactors = this.scaler.calculateCrop(ar);
if(! stretchFactors || stretchFactors.error){
@ -125,12 +125,12 @@ class Resizer {
}
return;
}
if(this.stretcher.mode === StretchMode.CONDITIONAL){
if(this.stretcher.mode === StretchMode.Conditional){
this.stretcher.applyConditionalStretch(stretchFactors, ar);
}
} else if (this.stretcher.mode === StretchMode.HYBRID) {
} else if (this.stretcher.mode === StretchMode.Hybrid) {
var stretchFactors = this.stretcher.calculateStretch(ar);
} else if (this.stretcher.mode === StretchMode.BASIC) {
} else if (this.stretcher.mode === StretchMode.Basic) {
var stretchFactors = this.stretcher.calculateBasicStretch();
}
@ -225,7 +225,7 @@ class Resizer {
}
scheduleCssWatcher(timeout, force_reset) {
if (this.destroyed || (this.extensionMode !== ExtensionMode.Full && !PlayerData.isFullScreen())) {
if (this.destroyed || (this.extensionMode !== ExtensionMode.Enabled && !PlayerData.isFullScreen())) {
return;
}
@ -275,7 +275,7 @@ class Resizer {
}
reset(){
this.setStretchMode(StretchMode.NO_STRETCH);
this.setStretchMode(StretchMode.NoStretch);
this.zoom.setZoom(1);
this.resetPan();
this.setAr('reset');
@ -313,7 +313,7 @@ class Resizer {
}
resetStretch(){
this.stretcher.mode = StretchMode.NO_STRETCH;
this.stretcher.mode = StretchMode.NoStretch;
this.restore();
}
@ -323,7 +323,7 @@ class Resizer {
computeOffsets(stretchFactors){
if (Debug.debug) {
console.log("[Resizer::_res_computeOffsets] <rid:"+this.resizerId+"> video will be aligned to ", this.settings.active.miscSettings.videoAlignment);
console.log("[Resizer::_res_computeOffsets] <rid:"+this.resizerId+"> video will be aligned to ", this.settings.active.site['@global'].videoAlignment);
}
const wdiff = this.conf.player.dimensions.width - this.conf.video.offsetWidth;

2
src/options/controls-settings/add-edit-action-popup.vue
View File

@ -99,7 +99,7 @@
</template>
<script>
import StretchMode from '../../common/enums/stretch-mode';
import StretchMode from '../../common/enums/stretch.enum';
import KeyboardShortcutParser from '../../common/js/KeyboardShortcutParser';
import CommandChain from './command-builder/command-chain';
import CommandAddEdit from './command-builder/command-add-edit';

2
src/options/controls-settings/command-builder/command-add-edit.vue
View File

@ -78,7 +78,7 @@
<script>
import ActionList from '../../../ext/conf/ActionList';
import StretchMode from '../../../common/enums/stretch-mode';
import StretchMode from '../../../common/enums/stretch.enum';
export default {
data () {

2
src/options/controls-settings/controls-settings.vue
View File

@ -81,7 +81,7 @@
<script>
import Button from '../../common/components/button';
import StretchMode from '../../common/enums/stretch-mode';
import StretchMode from '../../common/enums/stretch.enum';
import ActionAlt from '../../common/components/action-alt';
export default {

62
src/options/general-settings.vue
View File

@ -5,18 +5,18 @@
</div>
<div class="flex flex-row button-box">
<Button label="Always"
:selected="settings.active.extensionMode === 'blacklist'"
@click.native="setDefaultExtensionMode('blacklist')"
:selected="settings.active.sites['@global'] === ExtensionMode.Enabled"
@click.native="setDefaultExtensionMode(ExtensionMode.Enabled)"
>
</Button>
<Button label="On whitelisted sites"
:selected="settings.active.extensionMode === 'whitelist'"
@click.native="setDefaultExtensionMode('whitelist')"
:selected="settings.active.sites['@global'] === ExtensionMode.Whitelist"
@click.native="setDefaultExtensionMode(ExtensionMode.Whitelist)"
>
</Button>
<Button label="Never"
:selected="settings.active.extensionMode === 'disabled'"
@click.native="setDefaultExtensionMode('disabled')"
:selected="settings.active.sites['@global'] === ExtensionMode.Disabled"
@click.native="setDefaultExtensionMode(ExtensionMode.Disabled)"
>
</Button>
</div>
@ -31,15 +31,15 @@
</div>
<div class="flex flex-row button-box">
<Button label="Always"
:selected="settings.active.arDetect.mode === 'blacklist'"
@click.native="setDefaultAutodetectionMode('blacklist')">
:selected="settings.active.site['@global'].autoar === ExtensionMode.Enabled"
@click.native="setDefaultAutodetectionMode(ExtensionMode.Enabled)">
</Button>
<Button label="On whitelisted sites"
:selected="settings.active.arDetect.mode === 'whitelist'"
@click.native="setDefaultAutodetectionMode('whitelist')">
:selected="settings.active.site['@global'].autoar === ExtensionMode.Whitelist"
@click.native="setDefaultAutodetectionMode(ExtensionMode.Whitelist)">
</Button>
<Button label="Never"
:selected="settings.active.arDetect.mode === 'disabled'"
:selected="settings.active.site['@global'].autoar === ExtensionMode.Disabled"
@click.native="setDefaultAutodetectionMode('never')">
</Button>
</div>
@ -57,16 +57,16 @@
</div>
<div class="flex flex-row button-box">
<Button label="Left"
:selected="settings.active.miscSettings.videoAlignment === 'left'"
@click.native="setDefaultvideoAlignment('left')">
:selected="settings.active.site['@global'].videoAlignment === VideoAlignment.Left"
@click.native="setDefaultvideoAlignment(VideoAlignment.Left)">
</Button>
<Button label="Center"
:selected="settings.active.miscSettings.videoAlignment === 'center'"
@click.native="setDefaultvideoAlignment('center')">
:selected="settings.active.site['@global'].videoAlignment === VideoAlignment.Center"
@click.native="setDefaultvideoAlignment(VideoAlignment.Center)">
</Button>
<Button label="Right"
:selected="settings.active.miscSettings.videoAlignment === 'right'"
@click.native="setDefaultvideoAlignment('right')">
:selected="settings.active.site['@global'].videoAlignment === VideoAlignment.Right"
@click.native="setDefaultvideoAlignment(VideoAlignment.Right)">
</Button>
</div>
@ -75,20 +75,20 @@
</div>
<div class="flex flex-row button-box">
<Button label="Don't stretch"
:selected="settings.active.stretch.initialMode === StretchMode.NO_STRETCH"
@click.native="setDefaultStretchingMode(StretchMode.NO_STRETCH)">
:selected="settings.active.site['@global'].stretch === StretchMode.NoStretch"
@click.native="setDefaultStretchingMode(StretchMode.NoStretch)">
</Button>
<Button label="Basic stretch"
:selected="settings.active.stretch.initialMode === StretchMode.BASIC"
@click.native="setDefaultStretchingMode(StretchMode.BASIC)">
:selected="settings.active.site['@global'].stretch === StretchMode.Basic"
@click.native="setDefaultStretchingMode(StretchMode.Basic)">
</Button>
<Button label="Hybrid stretch"
:selected="settings.active.stretch.initialMode === StretchMode.HYBRID"
@click.native="setDefaultStretchingMode(StretchMode.HYBRID)">
:selected="settings.active.site['@global'].stretch === StretchMode.Hybrid"
@click.native="setDefaultStretchingMode(StretchMode.Hybrid)">
</Button>
<Button label="Thin borders only"
:selected="settings.active.stretch.initialMode === StretchMode.CONDITIONAL"
@click.native="setDefaultStretchingMode(StretchMode.CONDITIONAL)"
:selected="settings.active.site['@global'].stretch === StretchMode.Conditional"
@click.native="setDefaultStretchingMode(StretchMode.Conditional)"
>
</Button>
</div>
@ -120,7 +120,9 @@
<script>
import Button from '../common/components/button';
import StretchMode from '../common/enums/stretch-mode';
import StretchMode from '../common/enums/stretch.enum';
import ExtensionMode from '../common/enums/extension-mode.enum';
import VideoAlignment from '../common/enums/video-alignment.enum';
export default {
components: {
@ -129,6 +131,8 @@ export default {
data () {
return {
StretchMode: StretchMode,
ExtensionMode: ExtensionMode,
VideoAlignment: VideoAlignment,
stretchThreshold: 0,
}
},
@ -139,11 +143,11 @@ export default {
},
methods: {
setDefaultAutodetectionMode(mode) {
this.settings.active.arDetect.mode = mode;
this.settings.active.site['@global'].autoar = mode;
this.settings.save();
},
setDefaultExtensionMode(mode) {
this.settings.active.extensionMode = mode;
this.settings.active.sites['@global'] = mode;
this.settings.save();
},
setDefaultvideoAlignment(mode) {
@ -151,7 +155,7 @@ export default {
this.settings.save();
},
setDefaultStretchingMode(mode) {
this.settings.active.stretch.initialMode = mode;
this.settings.active.site['@global'].stretch = mode;
this.settings.save();
},
updateStretchTreshold(newTreshold) {

13
src/popup/App.vue
View File

@ -281,19 +281,6 @@ html, body {
font-variant: normal;
}
.left-side {
display: inline-block;
width: 39%;
float: left;
font-size: 1.6em;
}
.right-side {
display: inline-block;
width: 60%;
float: right;
}
.menu-item {
padding-left: 15px;
padding-top: 5px;

8
src/popup/js/ExecAction.js
View File

@ -33,13 +33,13 @@ class ExecAction {
this.settings.save();
} else if (scope === 'global') {
if (cmd.action === "set-stretch") {
this.settings.active.stretch.initialMode = cmd.arg;
this.settings.active.site['@global'].stretch = cmd.arg;
} else if (cmd.action === "set-alignment") {
this.settings.active.miscSettings.videoAlignment = cmd.arg;
this.settings.active.site['@global'].videoAlignment = cmd.arg;
} else if (cmd.action === "set-extension-mode") {
this.settings.active.extensionMode = cmd.arg;
this.settings.active.sites['@global'] = cmd.arg;
} else if (cmd.action === "set-autoar-mode") {
this.settings.active.arDetect.mode.arStatus = cmd.arg;
this.settings.active.site['@global'].autoar.arStatus = cmd.arg;
}
this.settings.save();
}

138
src/popup/panels/SitePanel.vue Normal file
View File

@ -0,0 +1,138 @@
<template>
<div class="w100 flex flex-column">
<div v-if="true"
class="w100"
>
<!-- ENABLE EXTENSION -->
<div class="label">Enable extension {{scope === 'site' ? 'for this site' : ''}}:</div>
<div class="flex flex-row flex-wrap">
<template v-for="action of siteActions">
<ShortcutButton v-if="action.cmd.length === 1 && action.cmd[0].action === 'set-extension-mode'"
class="flex button"
:class="{'setting-selected': getDefault('set-extension-mode') === action.cmd[0].arg}"
:label="(action.scopes[this.scope] && action.scopes[this.scope].label) ? action.scopes[this.scope].label : action.label"
:shortcut="parseShortcut(action)"
@click.native="execAction(action)"
>
</ShortcutButton>
</template>
</div>
</div>
<!-- ENABLE AUTODETECTION -->
<div v-if="true"
class="w100"
>
<div class="label">Enable autodetection {{scope === 'site' ? 'for this site' : ''}}:</div>
<div class="warning"><small>Note: some sites implement restrictions that make autodetection a fair bit less reliable in Firefox and outright impossible in anything else.</small></div>
<div class="flex flex-row flex-wrap">
<template v-for="action of siteActions">
<ShortcutButton v-if="action.cmd.length === 1 && action.cmd[0].action === 'set-autoar-mode'"
class="flex button"
:class="{'setting-selected': getDefault('set-autoar-mode') === action.cmd[0].arg}"
:label="(action.scopes[this.scope] && action.scopes[this.scope].label) ? action.scopes[this.scope].label : action.label"
:shortcut="parseShortcut(action)"
@click.native="execAction(action)"
>
</ShortcutButton>
</template>
</div>
</div>
<!-- DEFAULT SETTINGS -->
<div v-if="true">
<div class="label">Default stretching mode:</div>
<div class="flex flex-row flex-wrap">
<template v-for="action of siteActions">
<ShortcutButton v-if="action.cmd.length === 1 && action.cmd[0].action === 'set-stretch'"
class="flex b3 button"
:class="{'setting-selected': getDefault('set-stretch') === action.cmd[0].arg}"
:label="(action.scopes[this.scope] && action.scopes[this.scope].label) ? action.scopes[this.scope].label : action.label"
:shortcut="parseShortcut(action)"
@click.native="execAction(action)"
>
</ShortcutButton>
</template>
</div>
</div>
<div v-if="true">
<div class="label">Video alignment:</div>
<div class="flex flex-row flex-wrap">
<template v-for="action of settings.active.actions">
<ShortcutButton v-if="action.scopes[this.scope] && action.scopes[this.scope].show && action.cmd.length === 1 && action.cmd[0].action === 'set-alignment'"
class="flex b3 button"
:class="{'setting-selected': getDefault('set-alignment') === action.cmd[0].arg}"
:label="(action.scopes[this.scope] && action.scopes[this.scope].label) ? action.scopes[this.scope].label : action.label"
:shortcut="parseShortcut(action)"
@click.native="execAction(action)"
>
</ShortcutButton>
</template>
</div>
</div>
<div v-if="true">
<div class="label">Multi-command actions:</div>
<div class="flex flex-row flex-wrap">
<template v-for="action of settings.active.actions">
<ShortcutButton v-if="action.scopes[this.scope] && action.scopes[this.scope].show && action.cmd.length > 1"
class="flex b3 button"
:label="(action.scopes[this.scope] && action.scopes[this.scope].label) ? action.scopes[this.scope].label : action.label"
:shortcut="parseShortcut(action)"
@click.native="execAction(action)"
>
</ShortcutButton>
</template>
</div>
</div>
</div>
</template>
<script>
import ExecAction from '../js/ExecAction'
import KeyboardShortcutParser from '../../common/js/KeyboardShortcutParser'
import ShortcutButton from '../../common/components/shortcut-button'
export default {
data() {
return {
}
},
props: [
'settings',
'frame',
'scope',
],
created() {
this.exec = new ExecAction(this.settings);
},
components: {
ShortcutButton,
},
computed: {
siteActions: function() {
return this.settings.active.actions.filter(x => x.scopes[this.scope] && x.scopes[this.scope].show);
}
},
methods: {
execAction(action) {
this.exec.exec(action, this.scope, this.frame);
},
getDefault(action) {
},
parseShortcut(action) {
if (! action.scopes[this.scope].shortcut) {
return '';
}
return KeyboardShortcutParser.parseShortcut(action.scopes[this.scope].shortcut[0]);
},
}
}
</script>
<style>
</style>

8
src/res/popup/js/popup.js
View File

@ -321,11 +321,11 @@ function configureGlobalTab() {
processButtonsForPopupCategory(GlobalPanel.elements.stretchSettings, stretchButtons);
processButtonsForPopupCategory(GlobalPanel.elements.alignmentSettings, alignButtons);
selectButton('set-stretch', settings.active.stretch.initialMode, GlobalPanel.elements.stretchSettings.buttons);
selectButton('set-alignment', settings.active.miscSettings.videoAlignment, GlobalPanel.elements.alignmentSettings.buttons);
selectButton('set-stretch', settings.active.site['@global'].stretch, GlobalPanel.elements.stretchSettings.buttons);
selectButton('set-alignment', settings.active.site['@global'].videoAlignment, GlobalPanel.elements.alignmentSettings.buttons);
selectButton('set-extension-mode', settings.active.extensionMode, GlobalPanel.elements.extensionSettings.buttons);
selectButton('set-extension-mode', settings.active.arDetect.mode, GlobalPanel.elements.autoarSettings.buttons);
selectButton('set-extension-mode', settings.active.sites['@global'], GlobalPanel.elements.extensionSettings.buttons);
selectButton('set-extension-mode', settings.active.site['@global'].autoar, GlobalPanel.elements.autoarSettings.buttons);
}
function configureSitesTab(site) {