diff --git a/src/common/interfaces/ArInterface.ts b/src/common/interfaces/ArInterface.ts index 0a2b91c..4605210 100644 --- a/src/common/interfaces/ArInterface.ts +++ b/src/common/interfaces/ArInterface.ts @@ -8,5 +8,6 @@ export enum ArVariant { export interface Ar { type: AspectRatioType, ratio?: number, - variant?: ArVariant + variant?: ArVariant, + offset?: number, } diff --git a/src/ext/lib/aard/Aard.ts b/src/ext/lib/aard/Aard.ts index 313082f..4ecc5e9 100644 --- a/src/ext/lib/aard/Aard.ts +++ b/src/ext/lib/aard/Aard.ts @@ -227,6 +227,7 @@ export class Aard { private siteSettings: SiteSettings; private eventBus: EventBus; private arid: string; + private arVariant: ArVariant; private eventBusCommands = { 'uw-environment-change': { @@ -415,10 +416,11 @@ export class Aard { * Checks whether autodetection can run */ startCheck(arVariant?: ArVariant) { - console.log('aard - starting checks') + this.arVariant = arVariant; + if (!this.videoData.player) { - console.warn('Player not detected!'); - console.log('--- video data: ---\n', this.videoData); + // console.warn('Player not detected!'); + // console.log('--- video data: ---\n', this.videoData); return; } if (this.siteSettings.data.enableAard[this.videoData.player.environment] === ExtensionMode.Enabled) { @@ -707,7 +709,7 @@ export class Aard { } } catch (e) { console.warn('[Ultrawidify] Aspect ratio autodetection crashed for some reason.\n\nsome reason:', e); - this.videoData.resizer.setAr({type: AspectRatioType.AutomaticUpdate, ratio: this.defaultAr}); + this.videoData.resizer.setAr({type: AspectRatioType.AutomaticUpdate, ratio: this.defaultAr, variant: this.arVariant}); } } @@ -2036,7 +2038,8 @@ export class Aard { this.videoData.resizer.updateAr({ type: AspectRatioType.AutomaticUpdate, ratio: this.getAr(), - offset: this.testResults.letterboxOffset + offset: this.testResults.letterboxOffset, + variant: this.arVariant }); this.testResults.activeAspectRatio = ar; } diff --git a/src/ext/lib/video-transform/Resizer.ts b/src/ext/lib/video-transform/Resizer.ts index 031e6ce..415f8ea 100644 --- a/src/ext/lib/video-transform/Resizer.ts +++ b/src/ext/lib/video-transform/Resizer.ts @@ -141,7 +141,7 @@ class Resizer { } }], 'set-zoom': [{ - function: (config: any) => this.setZoom(config.zoom, config.axis, config.noAnnounce) + function: (config: any) => this.setZoom(config.zoom) }], 'change-zoom': [{ function: (config: any) => this.zoomStep(config.zoom) @@ -285,7 +285,7 @@ class Resizer { return ar; } - updateAr(ar) { + updateAr(ar: Ar) { if (!ar) { return; } @@ -602,9 +602,36 @@ class Resizer { } } - setZoom(zoomLevel: number, axis?: 'x' | 'y', noAnnounce?) { + private _setZoomTimeout; + private _latestSetZoomArgs: any | undefined; + private _SET_ZOOM_RATE_LIMIT_MS = 50; + /** + * Sets zoom level. This function is rate limited, because slider may spam the fuck out of this function call + * @param zoomLevel + * @param axis + * @param noAnnounce + * @returns + */ + setZoom(zoomLevel: number | {x: number, y: number}, noAnnounce?) { + if (this._setZoomTimeout) { + this._latestSetZoomArgs = {zoomLevel, noAnnounce}; + return; + } this.manualZoom = true; - this.zoom.setZoom(zoomLevel, axis, noAnnounce); + this.zoom.setZoom(zoomLevel); + + this._setZoomTimeout = setTimeout( + () => { + clearTimeout(this._setZoomTimeout); + this._setZoomTimeout = undefined; + + if (this._latestSetZoomArgs) { + this.setZoom(this._latestSetZoomArgs.zoomLevel); + } + this._latestSetZoomArgs = undefined; + }, + this._SET_ZOOM_RATE_LIMIT_MS + ); } zoomStep(step){ diff --git a/src/ext/lib/video-transform/Zoom.ts b/src/ext/lib/video-transform/Zoom.ts index 2201b62..a9bde0b 100644 --- a/src/ext/lib/video-transform/Zoom.ts +++ b/src/ext/lib/video-transform/Zoom.ts @@ -2,9 +2,14 @@ import Debug from '../../conf/Debug'; import Logger from '../Logger'; import VideoData from '../video-data/VideoData'; -// računa približevanje ter računa/popravlja odmike videa // calculates zooming and video offsets/panning +const MIN_SCALE = 0.5; +const MAX_SCALE = 8; +const LOG_MAX_SCALE = Math.log2(MAX_SCALE); +const LOG_MIN_SCALE = Math.log2(MIN_SCALE); + + class Zoom { //#region flags @@ -21,8 +26,10 @@ class Zoom { logScale: number = 0; logScaleY: number = 0; scaleStep: number = 0.1; - minScale: number = -1; // 50% (log2(0.5) = -1) - maxScale: number = 3; // 800% (log2(8) = 3) + logMinScale: number = -1; // 50% (log2(0.5) = -1) + logMaxScale: number = 3; // 800% (log2(8) = 3) + minScale = 0.5; + maxScale = 8; //#endregion @@ -33,7 +40,9 @@ class Zoom { reset(){ this.scale = 1; + this.scaleY = 1; this.logScale = 0; + this.logScaleY = 0; } /** @@ -45,7 +54,7 @@ class Zoom { zoomStep(amount: number, axis?: 'x' | 'y') { let newLog = axis === 'y' ? this.logScaleY : this.logScale; newLog += amount; - newLog = Math.min(Math.max(newLog, this.minScale), this.maxScale); + newLog = Math.min(Math.max(newLog, LOG_MIN_SCALE), LOG_MAX_SCALE); // if axis is undefined, both of this statements should trigger) if (axis !== 'y') { @@ -62,25 +71,23 @@ class Zoom { this.processZoom(); } - setZoom(scale: number, axis?: 'x' |'y', noAnnounce?){ + /** + * Sets zoom to specific value + * @param scale + */ + setZoom(scale: number | {x: number, y: number}){ // NOTE: SCALE IS NOT LOGARITHMIC - if(scale < Math.pow(2, this.minScale)) { - scale = this.minScale; - } else if (scale > Math.pow(2, this.maxScale)) { - scale = this.maxScale; - } + const scaleIn = (typeof scale === 'number') ? + { + x: scale, + y: scale + } : { + x: scale.x ?? this.scale, + y: scale.y ?? this.scaleY + }; - switch (axis) { - case 'x': - this.scale = scale; - break; - case 'y': - this.scaleY = scale; - break; - default: - this.scale = scale; - this.scaleY = scale; - } + this.scale = Math.min(Math.max(scaleIn.x, MIN_SCALE), MAX_SCALE); + this.scaleY = Math.min(Math.max(scaleIn.y, MIN_SCALE), MAX_SCALE); this.processZoom(); }