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

Made keyboard shortcuts work again, changed videoFloat -> videoAlignment for consistency, roughly completed ActionList.js

Browse Source
This commit is contained in:
Tamius Han 2018-12-31 03:34:26 +01:00
parent 9c3ca3744b
commit 10a8746338
13 changed files with 232 additions and 100 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -51,7 +51,7 @@ var ActionList = {
page: true,
}
},
'align': {
'set-alignment': {
name: 'Set video alignment',
args: [{
name: 'Left',
@ -68,7 +68,101 @@ var ActionList = {
scopes: {
site: true,
}
}]
}],
scopes: {
global: true,
site: true,
page: true,
}
},
'pan': {
name: 'Pan',
args: [{
name: '',
arg: 'toggle'
}],
scopes: {
page: true,
}
},
'toggle-pan': {
name: 'Toggle panning mode',
args: [{
name: 'Toggle',
arg: 'toggle',
},{
name: 'Enable',
arg: 'enable',
},{
name: 'Disable',
arg: 'disable'
}],
scopes: {
page: true
}
},
'set-zoom': {
name: 'Zoom',
args: [{
name: 'Zoom level increase/decrease',
customArg: true,
hintHTML: '<small>Positive values zoom in, negative values zoom out. Increases/decreases are logarithmic: value of \'1\' will double the zoom, value of \'-1\' will halve it.</small>'
}],
scopes: {
page: true,
}
},
'set-extension-mode': {
name: 'Set extension mode',
args: [{
name: 'Enable',
arg: 'blacklist',
},{
name: 'On whitelisted only',
arg: 'whitelist',
scopes: {
global: true,
}
},{
name: 'Default',
arg: 'default',
scopes: {
page: true,
}
},{
name: 'Disable',
arg: 'disabled'
}],
scopes: {
global: true,
site: true,
}
},
'set-autoar-mode': {
name: 'Set automatic aspect ratio detection mode',
args: [{
name: 'Enable',
arg: 'blacklist',
},{
name: 'On whitelisted only',
arg: 'whitelist',
scopes: {
global: true,
}
},{
name: 'Default',
arg: 'default',
scopes: {
page: true,
}
},{
name: 'Disable',
arg: 'disabled'
}],
scopes: {
global: true,
site: true,
}
}
};

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

@ -106,7 +106,7 @@ var ExtensionConf = {
announceDebounce: 200 // we wait this long before announcing new zoom
},
miscSettings: {
videoFloat: "center",
videoAlignment: "center",
mousePan: {
enabled: false
},

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

@ -1,5 +1,6 @@
import Debug from '../conf/Debug';
import PlayerData from './video-data/PlayerData'
import PlayerData from './video-data/PlayerData';
import Comms from './comms/Comms';
class ActionHandler {
@ -36,31 +37,69 @@ class ActionHandler {
actions = this.settings.active.actions;
}
console.log("----ACTIONS----", actions)
for (var action of actions) {
if(! action.shortcut) {
console.log("----ACTION:", action);
if (!action.scopes) {
continue;
}
var shortcut = action.shortcut[0];
if (shortcut.onKeyDown) {
this.keyDownActions.push(action);
}
if (shortcut.onKeyUp) {
this.keyUpActions.push(action);
}
if (shortcut.onScrollUp) {
this.mouseScrollUpActions.push(action);
}
if (shortcut.onScrollDown) {
this.mouseScrollDownActions.push(action);
}
if (shortcut.onMouseEnter) {
this.mouseEnterActions.push(action);
}
if (shortcut.onMouseLeave) {
this.mouseLeaveActions.push(action);
}
if (shortcut.onMouseMove) {
this.mouseMoveActions.push(action);
for (var scope in action.scopes) {
console.log("----ACTION - scope:", action.scopes[scope]);
if (! action.scopes[scope].shortcut) {
continue;
}
var shortcut = action.scopes[scope].shortcut[0];
if (shortcut.onKeyDown) {
this.keyDownActions.push({
shortcut: shortcut,
cmd: action.cmd,
scope: scope,
});
}
if (shortcut.onKeyUp) {
this.keyUpActions.push({
shortcut: shortcut,
cmd: action.cmd,
scope: scope,
});
}
if (shortcut.onScrollUp) {
this.mouseScrollUpActions.push({
shortcut: shortcut,
cmd: action.cmd,
scope: scope,
});
}
if (shortcut.onScrollDown) {
this.mouseScrollDownActions.push({
shortcut: shortcut,
cmd: action.cmd,
scope: scope,
});
}
if (shortcut.onMouseEnter) {
this.mouseEnterActions.push({
shortcut: shortcut,
cmd: action.cmd,
scope: scope,
});
}
if (shortcut.onMouseLeave) {
this.mouseLeaveActions.push({
shortcut: shortcut,
cmd: action.cmd,
scope: scope,
});
}
if (shortcut.onMouseMove) {
this.mouseMoveActions.push({
shortcut: shortcut,
cmd: action.cmd,
scope: scope,
});
}
}
}
@ -131,34 +170,54 @@ class ActionHandler {
shortcut.shiftKey === event.shiftKey
}
execAction(actions, event, shortcutIndex, videoData) {
execAction(actions, event, videoData) {
if(Debug.debug && Debug.keyboard ){
console.log("%c[ActionHandler::execAction] Trying to find and execute action for event. Actions/event: ", "color: #ff0", actions, event);
}
if (!shortcutIndex) {
shortcutIndex = 0;
}
for (var action of actions) {
if (this.isActionMatch(action.shortcut[shortcutIndex], event)) {
if (this.isActionMatch(action.shortcut, event)) {
if(Debug.debug && Debug.keyboard ){
console.log("%c[ActionHandler::execAction] found an action associated with keypress/event: ", "color: #ff0", action);
}
for (var cmd of action.cmd) {
if (cmd.action === "set-ar") {
this.pageInfo.setAr(cmd.arg);
} else if (cmd.action === "set-zoom") {
this.pageInfo.zoomStep(cmd.arg);
} else if (cmd.action === "set-stretch") {
this.pageInfo.setStretchMode(cmd.arg);
} else if (cmd.action === "toggle-pan") {
this.pageInfo.setPanMode(cmd.arg)
} else if (cmd.action === "pan") {
if (videoData) {
videoData.panHandler(event, true);
if (action.scope === 'page') {
if (cmd.action === "set-ar") {
this.pageInfo.setAr(cmd.arg);
} else if (cmd.action === "set-zoom") {
this.pageInfo.zoomStep(cmd.arg);
} else if (cmd.action === "set-stretch") {
this.pageInfo.setStretchMode(cmd.arg);
} else if (cmd.action === "toggle-pan") {
this.pageInfo.setPanMode(cmd.arg)
} else if (cmd.action === "pan") {
if (videoData) {
videoData.panHandler(event, true);
}
}
} else if (action.scope === 'site') {
if (cmd.action === "set-stretch") {
this.settings.active.sites[window.location.host].stretch = cmd.arg;
} else if (cmd.action === "set-alignment") {
this.settings.active.sites[window.location.host].videoAlignment = cmd.arg;
} else if (cmd.action === "set-extension-mode") {
this.settings.active.sites[window.location.host].status = cmd.arg;
} else if (cmd.action === "set-autoar-mode") {
this.settings.active.sites[window.location.host].arStatus = cmd.arg;
}
this.settings.save();
} else if (action.scope === 'global') {
if (cmd.action === "set-stretch") {
this.settings.active.stretch.initialMode = cmd.arg;
} else if (cmd.action === "set-alignment") {
this.settings.active.miscSettings.videoAlignment = cmd.arg;
} else if (cmd.action === "set-extension-mode") {
this.settings.active.extensionMode = cmd.arg;
} else if (cmd.action === "set-autoar-mode") {
this.settings.active.arDetect.mode.arStatus = cmd.arg;
}
this.settings.save();
}
}
@ -170,7 +229,7 @@ class ActionHandler {
handleKeyup(event) {
if(Debug.debug && Debug.keyboard ){
console.log("%c[ActionHandler::handleKeyup] we pressed a key: ", "color: #ff0", event.key , " | keydown: ", event.keyup, "event:", event);
console.log("%c[ActionHandler::handleKeyup] we pressed a key: ", "color: #ff0", event.key , " | keyup: ", event.keyup, "event:", event);
}
if (this.preventAction()) {
@ -180,7 +239,7 @@ class ActionHandler {
return;
}
this.execAction(this.keyUpActions, event, 0);
this.execAction(this.keyUpActions, event);
}
handleKeydown(event) {
@ -195,7 +254,7 @@ class ActionHandler {
return;
}
this.execAction(this.keyDownActions, event, 0);
this.execAction(this.keyDownActions, event);
}
handleMouseMove(event, videoData) {
@ -203,7 +262,7 @@ class ActionHandler {
console.log("[ActionHandler::handleMouseMove] mouse move is being handled.\nevent:", event, "\nvideo data:", videoData);
}
videoData.panHandler(event);
this.execAction(this.mouseMoveActions, event, undefined, videoData)
this.execAction(this.mouseMoveActions, event, videoData)
}
}

23
src/ext/lib/KeyboardShortcutParser.js
View File

@ -1,23 +0,0 @@
class KeyboardShortcutParser {
static parseShortcut(keypress) {
var shortcutCombo = '';
if (keypress.ctrlKey) {
shortcutCombo += 'Ctrl + ';
}
if (keypress.shiftKey) {
shortcutCombo += 'Shift + ';
}
if (keypress.metaKey) {
shortcutCombo += 'Meta + ';
}
if (keypress.altKey) {
shortcutCombo += 'Alt + ';
}
shortcutCombo += keypress.key.toUpperCase();
return shortcutCombo;
}
}
export default KeyboardShortcutParser;

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

@ -376,7 +376,7 @@ class Settings {
if (site.videoAlignment) {
return site.videoAlignment;
}
return this.active.miscSettings.videoFloat;
return this.active.miscSettings.videoAlignment;
}
}

4
src/ext/lib/ar-detect/ArDetector.js
View File

@ -494,9 +494,9 @@ class ArDetector {
var newCanvasWidth = window.innerHeight * (this.video.videoWidth / this.video.videoHeight);
var newCanvasHeight = window.innerHeight;
if (this.conf.resizer.videoFloat === "center") {
if (this.conf.resizer.videoAlignment === "center") {
this.canvasDrawWindowHOffset = Math.round((window.innerWidth - newCanvasWidth) * 0.5);
} else if (this.conf.resizer.videoFloat == "left") {
} else if (this.conf.resizer.videoAlignment == "left") {
this.canvasDrawWindowHOffset = 0;
} else {
this.canvasDrawWindowHOffset = window.innerWidth - newCanvasWidth;

11
src/ext/lib/comms/CommsClient.js
View File

@ -67,7 +67,7 @@ class CommsClient {
if (message.cmd === "set-ar") {
this.pageInfo.setAr(message.arg, message.playing);
} else if (message.cmd === 'set-alignment') {
this.pageInfo.setVideoFloat(message.arg, message.playing);
this.pageInfo.setvideoAlignment(message.arg, message.playing);
this.pageInfo.restoreAr();
} else if (message.cmd === "set-stretch") {
this.pageInfo.setStretchMode(message.arg, message.playing);
@ -143,9 +143,14 @@ class CommsClient {
if (Debug.debug && Debug.comms) {
console.log(`[CommsClient::registerVideo] <${this.commsId}>`, "Registering video for current page.");
}
if (this.pageInfo.videos.length) {
this.port.postMessage({cmd: "has-video"});
if (this.pageInfo) {
if (this.pageInfo.videos.length) {
this.port.postMessage({cmd: "has-video"});
}
} else {
// this.port.postMessage({cmd: "has-video"});
}
}
unregisterVideo(){

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

@ -166,9 +166,6 @@ class CommsServer {
this.sendToFrame(message, message.targetFrame);
} else if (message.cmd === 'set-ar') {
this.sendToFrame(message, message.targetFrame);
} else if (message.cmd === 'set-custom-ar') {
this.settings.active.keyboard.shortcuts.q.arg = message.arg;
this.settings.save();
} else if (message.cmd === 'set-alignment') {
this.sendToFrame(message, message.targetFrame);
} else if (message.cmd === 'autoar-start') {

6
src/ext/lib/video-data/PageInfo.js
View File

@ -343,16 +343,16 @@ class PageInfo {
}
}
setVideoFloat(videoFloat, playingOnly) {
setvideoAlignment(videoAlignment, playingOnly) {
if (playingOnly) {
for(var vd of this.videos) {
if (vd.isPlaying()) {
vd.setVideoFloat(videoFloat)
vd.setvideoAlignment(videoAlignment)
}
}
} else {
for(var vd of this.videos) {
vd.setVideoFloat(videoFloat)
vd.setvideoAlignment(videoAlignment)
}
}
}

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

@ -170,8 +170,8 @@ class VideoData {
this.resizer.setPanMode(mode);
}
setVideoFloat(videoFloat) {
this.resizer.setVideoFloat(videoFloat);
setvideoAlignment(videoAlignment) {
this.resizer.setvideoAlignment(videoAlignment);
}
restoreAr(){

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

@ -37,7 +37,7 @@ class Resizer {
this.lastAr = this.settings.getDefaultAr(); // this is the aspect ratio we start with
this.videoFloat = this.settings.getDefaultVideoAlignment(); // this is initial video alignment
this.videoAlignment = this.settings.getDefaultVideoAlignment(); // this is initial video alignment
this.destroyed = false;
this.resizerId = (Math.random(99)*100).toFixed(0);
@ -166,7 +166,7 @@ class Resizer {
return;
}
// dont allow weird floats
this.videoFloat = 'center';
this.videoAlignment = 'center';
const player = this.conf.player.element;
@ -202,8 +202,8 @@ class Resizer {
this.restore();
}
setVideoFloat(videoFloat) {
this.videoFloat = videoFloat;
setvideoAlignment(videoAlignment) {
this.videoAlignment = videoAlignment;
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.videoFloat);
console.log("[Resizer::_res_computeOffsets] <rid:"+this.resizerId+"> video will be aligned to ", this.settings.active.miscSettings.videoAlignment);
}
const wdiff = this.conf.player.dimensions.width - this.conf.video.offsetWidth;
@ -345,10 +345,10 @@ class Resizer {
translate.x += wdiffAfterZoom * this.pan.relativeOffsetX * this.zoom.scale;
translate.y += hdiffAfterZoom * this.pan.relativeOffsetY * this.zoom.scale;
} else {
if (this.videoFloat == "left") {
if (this.videoAlignment == "left") {
translate.x += wdiffAfterZoom * 0.5;
}
else if (this.videoFloat == "right") {
else if (this.videoAlignment == "right") {
translate.x -= wdiffAfterZoom * 0.5;
}
}

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

@ -57,16 +57,16 @@
</div>
<div class="flex flex-row button-box">
<Button label="Left"
:selected="settings.active.miscSettings.videoFloat === 'left'"
@click.native="setDefaultVideoFloat('left')">
:selected="settings.active.miscSettings.videoAlignment === 'left'"
@click.native="setDefaultvideoAlignment('left')">
</Button>
<Button label="Center"
:selected="settings.active.miscSettings.videoFloat === 'center'"
@click.native="setDefaultVideoFloat('center')">
:selected="settings.active.miscSettings.videoAlignment === 'center'"
@click.native="setDefaultvideoAlignment('center')">
</Button>
<Button label="Right"
:selected="settings.active.miscSettings.videoFloat === 'right'"
@click.native="setDefaultVideoFloat('right')">
:selected="settings.active.miscSettings.videoAlignment === 'right'"
@click.native="setDefaultvideoAlignment('right')">
</Button>
</div>
@ -146,8 +146,8 @@ export default {
this.settings.active.extensionMode = mode;
this.settings.save();
},
setDefaultVideoFloat(mode) {
this.settings.active.videoFloat = mode;
setDefaultvideoAlignment(mode) {
this.settings.active.videoAlignment = mode;
this.settings.save();
},
setDefaultStretchingMode(mode) {

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

@ -322,7 +322,7 @@ function configureGlobalTab() {
processButtonsForPopupCategory(GlobalPanel.elements.alignmentSettings, alignButtons);
selectButton('set-stretch', settings.active.stretch.initialMode, GlobalPanel.elements.stretchSettings.buttons);
selectButton('set-alignment', settings.active.miscSettings.videoFloat, GlobalPanel.elements.alignmentSettings.buttons);
selectButton('set-alignment', settings.active.miscSettings.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);