diff --git a/src/common/interfaces/SettingsInterface.ts b/src/common/interfaces/SettingsInterface.ts index 4db1525..2bec5f7 100644 --- a/src/common/interfaces/SettingsInterface.ts +++ b/src/common/interfaces/SettingsInterface.ts @@ -6,6 +6,12 @@ import ExtensionMode from '../enums/ExtensionMode.enum' import StretchType from '../enums/StretchType.enum' import VideoAlignmentType from '../enums/VideoAlignmentType.enum' +export enum ExtensionEnvironment { + Normal = 'normal', + Theater = 'theater', + Fullscreen = 'fullscreen', +} + export interface KeyboardShortcutInterface { key?: string, code?: string, diff --git a/src/csui/src/utils/UIProbeMixin.js b/src/csui/src/utils/UIProbeMixin.js index f13ee4e..cdb3861 100644 --- a/src/csui/src/utils/UIProbeMixin.js +++ b/src/csui/src/utils/UIProbeMixin.js @@ -36,7 +36,7 @@ export default { }, methods: { playerDimensionsUpdate(dimensions) { - if (!dimensions.width || !dimensions.height) { + if (!dimensions?.width || !dimensions?.height) { this.playerDimensions = undefined; } if (dimensions?.width !== this.playerDimensions?.width || dimensions?.height !== this.playerDimensions?.height) { diff --git a/src/ext/lib/Settings.ts b/src/ext/lib/Settings.ts index 128cbb5..cf86857 100644 --- a/src/ext/lib/Settings.ts +++ b/src/ext/lib/Settings.ts @@ -177,6 +177,9 @@ class Settings { } private applySettingsPatches(oldVersion, patches) { let index = this.findFirstNecessaryPatch(oldVersion, patches); + + console.log('ExtConfPatches — last unapplied patch is', index, patches[index]. patches); + if (index === -1) { this.logger?.log('info','settings','[Settings::applySettingsPatches] There are no pending conf patches.'); return; diff --git a/src/ext/lib/aard/Aard.ts b/src/ext/lib/aard/Aard.ts index 7222935..a8b4db9 100644 --- a/src/ext/lib/aard/Aard.ts +++ b/src/ext/lib/aard/Aard.ts @@ -1,7 +1,10 @@ import AspectRatioType from '../../../common/enums/AspectRatioType.enum'; +import ExtensionMode from '../../../common/enums/ExtensionMode.enum'; +import { ExtensionEnvironment } from '../../../common/interfaces/SettingsInterface'; import EventBus from '../EventBus'; import Logger from '../Logger'; import Settings from '../Settings'; +import { SiteSettings } from '../settings/SiteSettings'; import VideoData from '../video-data/VideoData'; import { Corner } from './enums/corner.enum'; import { VideoPlaybackState } from './enums/video-playback-state.enum'; @@ -218,10 +221,17 @@ export class Aard { private logger: Logger; private videoData: VideoData; private settings: Settings; + private siteSettings: SiteSettings; private eventBus: EventBus; private arid: string; private eventBusCommands = { + 'uw-environment-change': { + function: (newEnvironment: ExtensionEnvironment) => { + console.log('received extension environment:', newEnvironment, 'player env:', this.videoData?.player?.environment); + this.startCheck(); + } + } // 'get-aard-timing': { // function: () => this.handlePerformanceDataRequest() // } @@ -267,6 +277,7 @@ export class Aard { this.videoData = videoData; this.video = videoData.video; this.settings = videoData.settings; + this.siteSettings = videoData.siteSettings; this.eventBus = videoData.eventBus; this.eventBus.subscribeMulti(this.eventBusCommands, this); @@ -284,7 +295,6 @@ export class Aard { * This method should only ever be called from constructor. */ private init() { - this.canvasStore = { main: this.createCanvas('main-gl') }; @@ -301,7 +311,7 @@ export class Aard { ), }; - this.start(); + this.startCheck(); } private createCanvas(canvasId: string, canvasType?: 'webgl' | 'fallback') { @@ -341,6 +351,20 @@ export class Aard { } //#endregion + /** + * Checks whether autodetection can run + */ + startCheck() { + if (!this.videoData.player) { + console.warn('Player not detected!') + } + if (this.siteSettings.data.enableAard[this.videoData.player.environment] === ExtensionMode.Enabled) { + this.start(); + } else { + this.stop(); + } + } + /** * Starts autodetection loop. */ diff --git a/src/ext/lib/video-data/PlayerData.ts b/src/ext/lib/video-data/PlayerData.ts index 85d63b6..2574bfe 100644 --- a/src/ext/lib/video-data/PlayerData.ts +++ b/src/ext/lib/video-data/PlayerData.ts @@ -13,6 +13,7 @@ import UI from '../uwui/UI'; import { SiteSettings } from '../settings/SiteSettings'; import PageInfo from './PageInfo'; import { RunLevel } from '../../enum/run-level.enum'; +import { ExtensionEnvironment } from '../../../common/interfaces/SettingsInterface'; if (process.env.CHANNEL !== 'stable'){ console.info("Loading: PlayerData.js"); @@ -138,6 +139,7 @@ class PlayerData { private dimensionChangeListener = { that: this, handleEvent: function(event: Event) { + this.that.trackEnvironmentChanges(event); this.that.trackDimensionChanges() } } @@ -152,6 +154,7 @@ class PlayerData { } if (!this.dimensions) { this.trackDimensionChanges(); + this.trackEnvironmentChanges(); } return this.dimensions.width / this.dimensions.height; @@ -161,6 +164,21 @@ class PlayerData { } } + /** + * Gets current environment (needed when determining whether extension runs in fulls screen, theater, or normal) + */ + private lastEnvironment: ExtensionEnvironment; + + get environment(): ExtensionEnvironment { + if (this.isFullscreen) { + return ExtensionEnvironment.Fullscreen; + } + if (this.isTheaterMode) { + return ExtensionEnvironment.Theater; + } + return ExtensionEnvironment.Normal; + } + //#region lifecycle constructor(videoData) { try { @@ -198,6 +216,7 @@ class PlayerData { } this.trackDimensionChanges(); + this.trackEnvironmentChanges(); this.startChangeDetection(); document.addEventListener('fullscreenchange', this.dimensionChangeListener); @@ -337,6 +356,13 @@ class PlayerData { return newTheaterMode; } + trackEnvironmentChanges() { + if (this.environment !== this.lastEnvironment) { + this.lastEnvironment = this.environment; + this.eventBus.send('uw-environment-change', {newEnvironment: this.environment}); + } + } + /** * */ @@ -439,6 +465,7 @@ class PlayerData { onPlayerDimensionsChanged(mutationList?, observer?) { this.trackDimensionChanges(); + this.trackEnvironmentChanges(); } @@ -630,6 +657,7 @@ class PlayerData { this.element = elementStack[nextIndex].element; this.trackDimensionChanges(); + this.trackEnvironmentChanges(); } } @@ -834,7 +862,9 @@ class PlayerData { this.ui = undefined; this.element = this.getPlayer(); // this.notificationService?.replace(this.element); + this.trackDimensionChanges(); + this.trackEnvironmentChanges(); } } diff --git a/src/ext/lib/video-data/VideoData.ts b/src/ext/lib/video-data/VideoData.ts index f86d0db..a79b384 100644 --- a/src/ext/lib/video-data/VideoData.ts +++ b/src/ext/lib/video-data/VideoData.ts @@ -17,6 +17,8 @@ import { ExtensionStatus } from './ExtensionStatus'; import { RunLevel } from '../../enum/run-level.enum'; import { Aard } from '../aard/Aard'; import { Stretch } from '../../../common/interfaces/StretchInterface'; +import ExtensionMode from '../../../common/enums/ExtensionMode.enum'; +import { ExtensionEnvironment } from '../../../common/interfaces/SettingsInterface'; /** * VideoData — handles CSS for the video element. @@ -76,6 +78,8 @@ class VideoData { eventBus: EventBus; extensionStatus: ExtensionStatus; + + private currentEnvironment: ExtensionEnvironment; //#endregion @@ -97,6 +101,11 @@ class VideoData { }, 'set-run-level': { function: (runLevel: RunLevel) => this.setRunLevel(runLevel) + }, + 'uw-environment-change': { + function: () => { + this.onEnvironmentChanged(); + } } } @@ -191,7 +200,7 @@ class VideoData { if (!this.mutationObserver) { this.setupMutationObserver(); } - this.eventBus.send('inject-css', this.baseVideoCss); + // this.eventBus.send('inject-css', this.baseVideoCss); } catch (e) { console.error('Failed to inject base css!', e); } @@ -389,8 +398,26 @@ class VideoData { } //#endregion + onEnvironmentChanged() { + if (!this.player) { + return; + } + if (this.currentEnvironment !== this.player.environment) { + console.warn('environment changed to:', this.player.environment); + this.currentEnvironment = this.player.environment; + if (this.siteSettings.data.enable[this.player.environment] === ExtensionMode.Disabled) { + this.setRunLevel(RunLevel.Off); + } else { + this.restoreAr(); + } + } + } setRunLevel(runLevel: RunLevel, options?: {fromPlayer?: boolean}) { + if (this.player && this.siteSettings.data.enable[this.player.environment] !== ExtensionMode.Enabled) { + runLevel = RunLevel.Off; + } + if (this.runLevel === runLevel) { return; // also no need to propagate to the player } @@ -553,6 +580,8 @@ class VideoData { // the 'style' attributes don't necessarily trigger. This means we also need to trigger // restoreAr here, in case video size was changed this way this.player.forceRefreshPlayerElement(); + this.eventBus.send('uw-environment-change', {newEnvironment: this.player.environment}); + this.restoreAr(); // sometimes something fucky wucky happens and mutations aren't detected correctly, so we @@ -571,7 +600,7 @@ class VideoData { this._processDimensionsChanged, 250, { - leading: true, + // leading: true, trailing: true } ); @@ -694,7 +723,7 @@ class VideoData { if (!this.aard) { this.initArDetection(); } - this.aard.start(); + this.aard.startCheck(); } catch (e) { this.logger.log('warn', 'debug', '[VideoData::startArDetection()] Could not start aard for some reason. Was the function was called too early?', e); } diff --git a/src/ext/lib/video-transform/Resizer.ts b/src/ext/lib/video-transform/Resizer.ts index eb601ab..06692ed 100644 --- a/src/ext/lib/video-transform/Resizer.ts +++ b/src/ext/lib/video-transform/Resizer.ts @@ -295,7 +295,7 @@ class Resizer { // handle autodetection stuff if (ar.type === AspectRatioType.Automatic) { - this.videoData.aard?.start(); + this.videoData.aard?.startCheck(); return; } else if (ar.type !== AspectRatioType.AutomaticUpdate) { this.videoData.aard?.stop(); @@ -429,7 +429,7 @@ class Resizer { } applyScaling(stretchFactors: VideoDimensions, options?: {noAnnounce?: boolean, ar?: Ar}) { - this.stretcher.chromeBugMitigation(stretchFactors); + // this.stretcher.chromeBugMitigation(stretchFactors); // let the UI know if(!options?.noAnnounce) { @@ -533,6 +533,10 @@ class Resizer { this.restore(); } + /** + * Restores aspect ratio to last known aspect ratio + * @returns + */ restore() { if (!this.manualZoom) { this.logger.log('info', 'debug', "[Resizer::restore] attempting to restore aspect ratio", {'lastAr': this.lastAr} );