diff --git a/js/conf/ExtensionConf.js b/js/conf/ExtensionConf.js index d49fa92..ca2aeda 100644 --- a/js/conf/ExtensionConf.js +++ b/js/conf/ExtensionConf.js @@ -107,5 +107,50 @@ var ExtensionConf = { }, colors:{ // criticalFail: "background: #fa2; color: #000" + }, + keybinds: { + shortcuts: { + // automatic + "a": { + action: "auto-ar", + }, + //#region crop + "r": { + action: "crop", + arg: "reset" + }, + "w": { + action: "crop", + arg: "fitw" + }, + "e": { + action: "crop", + arg: "fith" + }, + "s": { + action: "crop", + arg: 1.78 + }, + "d": { + action: "crop", + arg: 2.39 + }, + "x": { + action: "crop", + arg: 2.0 + }, + //#endregion + //#region zoom + "z": { + action: "zoom", + arg: 0.1 + }, + "u": { + action: "zoom", + arg: -0.1 + } + //#endregion + }, + modKeys: ["ctrlKey", "shiftKey", "altKey"] } } diff --git a/js/conf/Keybinds.js b/js/conf/Keybinds.js index d5ff9c2..3dbbae4 100644 --- a/js/conf/Keybinds.js +++ b/js/conf/Keybinds.js @@ -1,150 +1,70 @@ if(Debug.debug) console.log("Loading: Keybinds.js"); -var _kbd_ModKeys = ["ctrlKey", "shiftKey", "altKey"]; -var _kbd_keybinds = {}; +class Keybinds { + constructor(pageInfo){ + this.pageInfo = pageInfo; + } -var DEFAULT_KEYBINDINGS = { - "w": { - action: "fitw" - }, - "e": { - action: "fith" - }, - "r": { - action: "reset" - }, - "a": { - action: "autoar" - }, - "s": { - action: "char", - targetAr: 1.78 - }, - "d": { - action: "char", - targetAr: 2.39 - }, - "x": { - action: "char", - targetAr: 2.0 + setup(){ + var ths = this; + document.addEventListener('keydown', (event) => ths.handleKeypress(event) ); } -} - -var _kbd_process = function (event) { // Tukaj ugotovimo, katero tipko smo pritisnili + handleKeypress(event) { // Tukaj ugotovimo, katero tipko smo pritisnili - if(Debug.debug && Debug.keyboard ){ - console.log("%c[Keybinds::_kbd_process] we pressed a key: ", "color: #ff0", event.key , " | keydown: ", event.keydown, "event:", event); - } - - // Tipke upoštevamo samo, če smo v celozaslonskem načinu oz. če ne pišemo komentarja - // v nasprotnem primeru ne naredimo nič. - // We only take actions if we're in full screen or not writing a comment - if( !(PlayerDetect.isFullScreen() || ( - (document.activeElement.getAttribute("role") != "textbox") && - (document.activeElement.getAttribute("type") != "text") - ))){ - if(Debug.debug && Debug.keyboard) - console.log("[Keybinds::_kbd_process] We're writing a comment or something. Doing nothing"); - return; - } - - - // building modifiers list: - var modlist = ""; - for(var mod of _kbd_ModKeys){ - if(event[mod]) - modlist += (mod + "_") - } - - if(Debug.debug && Debug.keyboard ){ - if(modlist) - console.log("[Keybinds::_kbd_process] there's been modifier keys. Modlist:", modlist); - } - - var keypress = modlist + event.key.toLowerCase(); - - if(Debug.debug && Debug.keyboard ) - console.log("[Keybinds::_kbd_process] our full keypress is this", keypress, "_kbd_keybinds:", {kb: _kbd_keybinds} ); - - - if(_kbd_keybinds[keypress]){ - var conf = _kbd_keybinds[keypress]; - - if(Debug.debug && Debug.keyboard) - console.log("[Keybinds::_kbd_process] there's an action associated with this keypress. conf:", conf); - - if(conf.action != "autoar") - ArDetect.stop(); - - if(conf.action == "char"){ - Resizer.setAr(conf.targetAr); + if(Debug.debug && Debug.keyboard ){ + console.log("%c[Keybinds::_kbd_process] we pressed a key: ", "color: #ff0", event.key , " | keydown: ", event.keydown, "event:", event); } - else{ - Resizer.legacyAr(conf.action); + + // Tipke upoštevamo samo, če smo v celozaslonskem načinu oz. če ne pišemo komentarja + // v nasprotnem primeru ne naredimo nič. + // We only take actions if we're in full screen or not writing a comment + if( !(PlayerData.isFullScreen() || ( + (document.activeElement.getAttribute("role") != "textbox") && + (document.activeElement.getAttribute("type") != "text") + ))){ + if(Debug.debug && Debug.keyboard) + console.log("[Keybinds::_kbd_process] We're writing a comment or something. Doing nothing"); + return; + } + + + // building modifiers list: + var modlist = ""; + for(var mod of ExtensionConf.keybinds.modKeys){ + if(event[mod]) + modlist += (mod + "_") + } + + if(Debug.debug && Debug.keyboard ){ + if(modlist) + console.log("[Keybinds::_kbd_process] there's been modifier keys. Modlist:", modlist); + } + + var keypress = modlist + event.key.toLowerCase(); + + if(Debug.debug && Debug.keyboard ) + console.log("[Keybinds::_kbd_process] our full keypress is this", keypress ); + + + if(ExtensionConf.keybinds.shortcuts[keypress]){ + var conf = ExtensionConf.keybinds.shortcuts[keypress]; + + if(Debug.debug && Debug.keyboard) + console.log("[Keybinds::_kbd_process] there's an action associated with this keypress. conf:", conf); + + if(conf.action === "crop"){ + this.pageInfo.stopArDetection(); + this.pageInfo.setAr(conf.arg); + } + if(conf.action === "zoom"){ + this.pageInfo.stopArDetection(); + this.pageInfo.zoomStep(conf.arg); + } + if(conf.action === "auto-ar"){ + this.pageInfo.startArDetection(); + } } } -} - -var _kbd_load = async function() { - if(Debug.debug) - console.log("[Keybinds::_kbd_setup_init] Setting up keybinds"); - - var ret = await StorageManager.getopt_async("keybinds"); - -// var keybinds = ret.keybinds; - var keybinds = {}; - - if(Array.isArray(keybinds)){ - StorageManager.delopt("keybinds"); - keybinds = DEFAULT_KEYBINDINGS; - } - - if(Debug.debug) - console.log("[Keybinds::_kbd_setup_init] loaded keybinds from storage. Do they exist?", keybinds, $.isEmptyObject(keybinds)); - - if( $.isEmptyObject(keybinds) ){ - keybinds = DEFAULT_KEYBINDINGS; - StorageManager.setopt({"keybinds":keybinds}); - - if(Debug.debug) - console.log("[Keybinds::_kbd_setup_init] setting keybinds to default", keybinds); - - } - - this.keybinds = keybinds; - _kbd_keybinds = keybinds; -} - -var _kbd_setup = async function() { - await _kbd_load(); - - document.addEventListener('keydown', _kbd_process); -} - -var _kbd_fetch = async function(){ - if($.isEmptyObject(_kbd_keybinds)){ - await _kbd_load(); - } - - if(Debug.debug){ - console.log("[Keybinds::_kbd_fetch] We'll be returning this:", _kbd_keybinds); - } - - return _kbd_keybinds; -} - - - -var _kbd_getKeybinds = function(){ - return _kbd_keybinds; -} - -var Keybinds = { - init: _kbd_setup, - fetch: _kbd_fetch, - mods: _kbd_ModKeys, - getKeybinds: _kbd_getKeybinds, - keybinds: _kbd_keybinds -} +} \ No newline at end of file diff --git a/js/lib/VideoData.js b/js/lib/VideoData.js index 997a973..b352ea8 100644 --- a/js/lib/VideoData.js +++ b/js/lib/VideoData.js @@ -31,11 +31,15 @@ class VideoData { this.arDetector.init(); } } - + startArDetection() { this.arDetector.start(); } + stopArDetection() { + this.arDetector.stop(); + } + destroy() { this.destroyed = true; if(this.arDetector){ @@ -96,4 +100,8 @@ class VideoData { this.resizer.setStretchMode(stretchMode); } + zoomStep(step){ + this.resizer.zoomStep(); + } + } \ No newline at end of file diff --git a/js/modules/PageInfo.js b/js/modules/PageInfo.js index a981361..647c461 100644 --- a/js/modules/PageInfo.js +++ b/js/modules/PageInfo.js @@ -3,6 +3,8 @@ if(Debug.debug) class PageInfo { constructor(){ + this.keybinds = new Keybinds(this); + this.keybinds.setup(); this.hasVideos = false; this.siteDisabled = false; this.videos = []; @@ -149,7 +151,7 @@ class PageInfo { } initArDetection(){ - for(var vd in this.videos){ + for(var vd of this.videos){ vd.initArDetection(); } } @@ -172,19 +174,38 @@ class PageInfo { } } + + + startArDetection(){ + for(var vd of this.videos){ + vd.startArDetection(); + } + } + + stopArDetection(){ + for(var vd of this.videos){ + vd.stopArDetection(); + } + } + setAr(ar){ // TODO: find a way to only change aspect ratio for one video - for(var vd in this.videos){ + for(var vd of this.videos){ vd.setAr(ar) } } setStretchMode(sm){ - for(var vd in this.videos){ + for(var vd of this.videos){ vd.setStretchMode(ar) } } + setZoom(step){ + for(var vd of this.videos){ + vd.zoomStep(step); + } + } } var RescanReason = { diff --git a/js/modules/Resizer.js b/js/modules/Resizer.js index f36ee80..f68c840 100644 --- a/js/modules/Resizer.js +++ b/js/modules/Resizer.js @@ -161,6 +161,10 @@ class Resizer { this.pan = undefined; } + zoomStep(step){ + this.zoom.zoomStep(step); + } + resetZoom(){ this.zoom.setZoom(1); this.restore(); diff --git a/js/modules/Zoom.js b/js/modules/Zoom.js index f782aeb..b8a8c44 100644 --- a/js/modules/Zoom.js +++ b/js/modules/Zoom.js @@ -8,7 +8,7 @@ class Zoom { // functions constructor(videoData) { this.scale = 1; - this.scaleStep = 1.2; + this.scaleStep = 0.1; this.minScale = 0.5; // not accurate, actually slightly less this.maxScale = 8; // not accurate, actually slightly more this.conf = videoData; @@ -19,15 +19,31 @@ class Zoom { } zoomIn(){ - if(this.scale >= this.maxScale) - return; - this.scale *= this.scaleStep; + this.scale += this.scaleStep; + + if (this.scale >= this.maxScale) { + this.scale = this.maxScale; + } } zoomOut(){ - if(this.scale <= this.minScale) - return; - this.scale *= (1/this.scaleStep); + this.scale -= this.scaleStep; + + if (this.scale <= this.minScale) { + this.scale = this.minScale; + } + + } + + zoomStep(amount){ + this.scale += amount; + + if (this.scale <= this.minScale) { + this.scale = this.minScale; + } + if (this.scale >= this.maxScale) { + this.scale = this.maxScale; + } } setZoom(scale){ diff --git a/js/uw-bg.js b/js/uw-bg.js index 356594e..e949d8d 100644 --- a/js/uw-bg.js +++ b/js/uw-bg.js @@ -24,7 +24,6 @@ async function main(){ console.log("[uw-bg::main] setting up background script"); await Settings.init(); - await Keybinds.init(); Keybinds.keybinds = await Keybinds.fetch(); @@ -259,4 +258,4 @@ function _uwbg_rcvmsg(message, sender, sendResponse){ } -main(); +// main(); diff --git a/js/uw.js b/js/uw.js index f74f61b..643ede1 100644 --- a/js/uw.js +++ b/js/uw.js @@ -19,27 +19,24 @@ async function init(){ console.log("[uw::main] loading configuration ..."); // load settings - var isSlave = true; - await Settings.init(isSlave); + // var isSlave = true; + // await Settings.init(isSlave); + await Settings.init(); // za sporočilca poslušamo v vsakem primeru, tudi če je razširitev na spletnem mestu onemogočena // we listen for messages in any case, even if extension is disabled on current site. - browser.runtime.onMessage.addListener(receiveMessage); + // browser.runtime.onMessage.addListener(receiveMessage); - await SitesConf.init(); + // await SitesConf.init(); // če je trenutno mesto onemogočeno, potem zaključimo na tem mestu // if current site is disabled, we quit here - if(! SitesConf.isEnabled(window.location.hostname)){ - if(Debug.debug) - console.log("[uw:main] | site", window.location.hostname, "is blacklisted."); + // if(! SitesConf.isEnabled(window.location.hostname)){ + // if(Debug.debug) + // console.log("[uw:main] | site", window.location.hostname, "is blacklisted."); - return; - } - - - - await Keybinds.init(); + // return; + // } if(Debug.debug) console.log("[uw::main] configuration should be loaded now"); @@ -58,195 +55,110 @@ async function setup(){ if(Debug.debug){ console.log("[uw.js::setup] pageInfo initialized. Here's the object:", pageInfo); } - - // if(ExtensionConf.arDetect.mode == "blacklist"){ - // if(Debug.debug) - // console.log("[uw::main] Aspect ratio detection is enabled (mode=",ExtensionConf.arDetect.mode,"). Starting ArDetect"); - // ArDetect.arSetup(); - // } - // else{ - // if(Debug.debug) - // console.log("[uw::main] Aspect ratio detection is disabled. Mode:", ExtensionConf.arDetect.mode); - // } - - - + } - -// tukaj gledamo, ali se je velikost predvajalnika spremenila. Če se je, ponovno prožimo resizer -// here we check (in the most ghetto way) whether player size has changed. If it has, we retrigger resizer. - -// var _video_recheck_counter = 5; -// var _video_recheck_period = 1; // on this many retries - -// function ghettoOnChange(){ - -// if(_video_recheck_counter++ > _video_recheck_period){ -// _video_recheck_counter = 0; - -// if ( GlobalVars.video == null || -// GlobalVars.video == undefined || -// GlobalVars.video.videoWidth == 0 || -// GlobalVars.video.videoHeight == 0 ){ - -// var video = document.getElementsByTagName("video")[0]; -// if ( video !== undefined && -// video !== null && -// video.videoWidth > 0 && -// video.videoHeight > 0 ){ -// if(Debug.debug){ -// console.log("%c[uw::ghettoOnChange] detected video. registering!", "color: #99f, background: #000"); -// console.log("[uw::ghettoOnChange] just for shits and giggles, let's see what's happened with GlobalVars.playerDimensions:", GlobalVars.playerDimensions) -// } - -// // zaznali smo novo