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

Popups sorta work

Browse Source
This commit is contained in:
Tamius Han 2019-02-13 23:58:19 +01:00
parent 295c363d60
commit c1d34fceb1
4 changed files with 99 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -3,6 +3,8 @@ import currentBrowser from '../conf/BrowserDetect';
import ExtensionConf from '../conf/ExtensionConf';
import ExtensionMode from '../../common/enums/extension-mode.enum';
import ObjectCopy from '../lib/ObjectCopy';
import Stretch from '../../common/enums/stretch.enum';
import VideoAlignment from '../../common/enums/video-alignment.enum';
class Settings {
@ -13,14 +15,6 @@ class Settings {
this.version = undefined;
this.updateCallback = updateCallback;
console.log("chrome object:", chrome)
console.log("browser.storage", browser.storage)
console.log("browser object:", browser)
console.log("window.browser", window.browser)
console.log("ExtensionConf", ExtensionConf)
const ths = this;
if(currentBrowser.firefox) {
@ -353,6 +347,22 @@ class Settings {
}
}
getDefaultOption(option) {
const allDefault = {
mode: ExtensionMode.Default,
autoar: ExtensionMode.Default,
autoarFallback: ExtensionMode.Default,
stretch: Stretch.Default,
videoAlignment: VideoAlignment.Default,
};
if (!option || allDefault[option] === undefined) {
return allDefault;
}
return allDefault[option];
}
getDefaultAr(site) {
site = this.getSiteSettings(site);

11
src/popup/App.vue
View File

@ -74,6 +74,15 @@
<!-- PANELS/CONTENT -->
<div id="tab-content" class="flex-grow" style="max-width: 480px !important;">
<b>This is some debug stuff. Please remove before release.</b> Site: {{site.host}}<br/>
<small>NOTE: in case you're using nightly builds, this extension could be completely broken.
It's also possible that everything is getting logged excessively, which may result in
degraded performance. If settings don't persist, check whether Debug.flushStorageSettings is set to true.</small>
<ShortcutButton class="button"
@click.native="settings.setDefaultSettings()"
label="Wipe settings"
/>
<VideoPanel v-if="settings && settings.active && selectedTab === 'video'"
class=""
:settings="settings"
@ -118,7 +127,7 @@ export default {
}
},
async created() {
this.settings.init();
await this.settings.init();
this.port.onMessage.addListener( (m,p) => this.processReceivedMessage(m,p));
this.execAction.setSettings(this.settings);

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

@ -1,13 +1,17 @@
import Comms from '../../ext/lib/comms/Comms';
class ExecAction {
constructor(settings) {
constructor(settings, site) {
this.settings = settings;
this.site = site;
}
setSettings(settings) {
this.settings = settings;
}
setSite(site) {
this.site = site;
}
exec(action, scope, frame) {
for (var cmd of action.cmd) {
@ -21,14 +25,24 @@ class ExecAction {
}
Comms.sendMessage(message);
} else if (scope === 'site') {
let site = this.site;
if (!this.site) {
site = window.location.host;
}
if (!this.settings.active.sites[site]) {
this.settings.active.sites[site] = this.settings.getDefaultOption();
}
if (cmd.action === "set-stretch") {
this.settings.active.sites[window.location.host].stretch = cmd.arg;
this.settings.active.sites[site].stretch = cmd.arg;
} else if (cmd.action === "set-alignment") {
this.settings.active.sites[window.location.host].videoAlignment = cmd.arg;
this.settings.active.sites[site].videoAlignment = cmd.arg;
} else if (cmd.action === "set-extension-mode") {
this.settings.active.sites[window.location.host].status = cmd.arg;
this.settings.active.sites[site].mode = cmd.arg;
} else if (cmd.action === "set-autoar-mode") {
this.settings.active.sites[window.location.host].arStatus = cmd.arg;
this.settings.active.sites[site].autoar = cmd.arg;
}
this.settings.save();
} else if (scope === 'global') {
@ -37,9 +51,9 @@ class ExecAction {
} else if (cmd.action === "set-alignment") {
this.settings.active.sites['@global'].videoAlignment = cmd.arg;
} else if (cmd.action === "set-extension-mode") {
this.settings.active.sites['@global'] = cmd.arg;
this.settings.active.sites['@global'].mode = cmd.arg;
} else if (cmd.action === "set-autoar-mode") {
this.settings.active.sites['@global'].autoar.arStatus = cmd.arg;
this.settings.active.sites['@global'].autoar = cmd.arg;
}
this.settings.save();
}

64
src/popup/panels/DefaultSettingsPanel.vue
View File

@ -1,16 +1,15 @@
<template>
<div class="w100 flex flex-column">
<div v-if="true"
<div v-if="settings && 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}"
class="button"
:class="{'setting-selected': getCurrent('mode') === action.cmd[0].arg }"
:label="(action.scopes[scope] && action.scopes[scope].label) ? action.scopes[scope].label : action.label"
:shortcut="parseShortcut(action)"
@click.native="execAction(action)"
@ -30,7 +29,7 @@
<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}"
:class="{'setting-selected': getCurrent('autoar') === action.cmd[0].arg}"
:label="(action.scopes[scope] && action.scopes[scope].label) ? action.scopes[scope].label : action.label"
:shortcut="parseShortcut(action)"
@click.native="execAction(action)"
@ -47,7 +46,7 @@
<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}"
:class="{'setting-selected': getCurrent('stretch') === action.cmd[0].arg}"
:label="(action.scopes[scope] && action.scopes[scope].label) ? action.scopes[scope].label : action.label"
:shortcut="parseShortcut(action)"
@click.native="execAction(action)"
@ -63,7 +62,7 @@
<template v-for="action of settings.active.actions">
<ShortcutButton v-if="action.scopes[scope] && action.scopes[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}"
:class="{'setting-selected': getCurrent('videoAlignment') === action.cmd[0].arg}"
:label="(action.scopes[scope] && action.scopes[scope].label) ? action.scopes[scope].label : action.label"
:shortcut="parseShortcut(action)"
@click.native="execAction(action)"
@ -100,12 +99,13 @@ export default {
return {
}
},
props: [
'settings',
'scope',
],
props: {
settings: Object,
scope: String,
site: String,
},
created() {
this.exec = new ExecAction(this.settings);
this.exec = new ExecAction(this.settings, this.site);
},
components: {
ShortcutButton,
@ -115,12 +115,43 @@ export default {
return this.settings.active.actions.filter(x => x.scopes[this.scope] && x.scopes[this.scope].show);
}
},
watch: {
settings: {
deep: true,
handler: function(val) {
this.$forceUpdate();
this.exec.setSettings(val);
}
},
site: function(val){
this.exec.setSite(val);
}
},
methods: {
execAction(action) {
this.exec.exec(action, this.scope);
},
getDefault(action) {
getCurrent(option) {
if (!this.settings) {
return undefined;
}
let site;
if (this.scope === 'global') {
site = '@global'
this.site = site;
} else {
if (!this.site) {
return '';
}
site = this.site;
}
// console.log("SETTINGS FOR SITE", site, "option", option, JSON.parse(JSON.stringify(this.settings.active.sites)))
if (this.settings.active.sites[site]) {
return this.settings.active.sites[site][option];
} else {
return this.settings.getDefaultOption(option);
}
},
parseShortcut(action) {
if (! action.scopes[this.scope].shortcut) {
@ -133,5 +164,10 @@ export default {
</script>
<style>
.button-selected {
background-color: "#fff"
}
.setting-selected {
background-color: #ffa;
}
</style>