Let's try to avoid injecting ultrawidify-specific CSS before we actually need it. Part 1/?
This commit is contained in:
parent
65556d9cad
commit
27b0609d34
@ -42,6 +42,7 @@ class ArDetector {
|
||||
arid: string;
|
||||
|
||||
// ar detector starts in this state. running main() sets both to false
|
||||
_ready: boolean = false;
|
||||
_paused: boolean;
|
||||
_halted: boolean = true;
|
||||
_exited: boolean = true;
|
||||
@ -159,16 +160,7 @@ class ArDetector {
|
||||
|
||||
init(){
|
||||
this.logger.log('info', 'init', `[ArDetect::init] <@${this.arid}> Initializing autodetection.`);
|
||||
|
||||
try {
|
||||
if (this.settings.canStartAutoAr()) {
|
||||
this.setup();
|
||||
} else {
|
||||
throw "Settings prevent autoar from starting"
|
||||
}
|
||||
} catch (e) {
|
||||
this.logger.log('error', 'init', `%c[ArDetect::init] <@${this.arid}> Initialization failed.`, _ard_console_stop, e);
|
||||
}
|
||||
this.setup();
|
||||
}
|
||||
|
||||
setup(cwidth?: number, cheight?: number){
|
||||
@ -290,10 +282,8 @@ class ArDetector {
|
||||
this.canvasImageDataRowLength = cwidth << 2;
|
||||
this.noLetterboxCanvasReset = false;
|
||||
|
||||
if (this.settings.canStartAutoAr() ) {
|
||||
// this.main();
|
||||
this.start();
|
||||
}
|
||||
this._ready = true;
|
||||
this.start();
|
||||
|
||||
if(Debug.debugCanvas.enabled){
|
||||
// this.debugCanvas.init({width: cwidth, height: cheight});
|
||||
@ -312,11 +302,15 @@ class ArDetector {
|
||||
|
||||
//#region AARD control
|
||||
start() {
|
||||
if (this.settings.canStartAutoAr()) {
|
||||
this.logger.log('info', 'debug', `"%c[ArDetect::start] <@${this.arid}> Starting automatic aspect ratio detection`, _ard_console_start);
|
||||
} else {
|
||||
this.logger.log('warn', 'debug', `"%c[ArDetect::start] <@${this.arid}> Wanted to start automatic aspect ratio detection, but settings don't allow that. Aard won't be started.`, _ard_console_change);
|
||||
return;
|
||||
// if (this.settings.canStartAutoAr()) {
|
||||
// this.logger.log('info', 'debug', `"%c[ArDetect::start] <@${this.arid}> Starting automatic aspect ratio detection`, _ard_console_start);
|
||||
// } else {
|
||||
// this.logger.log('warn', 'debug', `"%c[ArDetect::start] <@${this.arid}> Wanted to start automatic aspect ratio detection, but settings don't allow that. Aard won't be started.`, _ard_console_change);
|
||||
// return;
|
||||
// }
|
||||
if (!this._ready) {
|
||||
this.init();
|
||||
return; // we will return to this function once initialization is complete
|
||||
}
|
||||
|
||||
if (this.conf.resizer.lastAr.type === AspectRatioType.AutomaticUpdate) {
|
||||
|
||||
@ -3,6 +3,7 @@ import PlayerData from './PlayerData';
|
||||
import Resizer from '../video-transform/Resizer';
|
||||
import ArDetector from '../ar-detect/ArDetector';
|
||||
import AspectRatioType from '../../../common/enums/AspectRatioType.enum';
|
||||
import CropModePersistence from '../../../common/enums/CropModePersistence.enum';
|
||||
import * as _ from 'lodash';
|
||||
import BrowserDetect from '../../conf/BrowserDetect';
|
||||
import Logger from '../Logger';
|
||||
@ -175,8 +176,6 @@ class VideoData {
|
||||
*/
|
||||
async setupStageOne() {
|
||||
this.logger.log('info', 'init', '%c[VideoData::setupStageOne] ——————————— Starting setup stage one! ———————————', 'color: #0f9');
|
||||
// ensure base css is loaded before doing anything
|
||||
this.injectBaseCss();
|
||||
|
||||
// this is in case extension loads before the video
|
||||
this.video.addEventListener('loadeddata', this.onLoadedData.bind(this));
|
||||
@ -195,14 +194,55 @@ class VideoData {
|
||||
async setupStageTwo() {
|
||||
// NOTE: ORDERING OF OBJ INITIALIZATIONS IS IMPORTANT (arDetect needs to go last)
|
||||
this.player = new PlayerData(this);
|
||||
|
||||
if (this.player.invalid) {
|
||||
this.invalid = true;
|
||||
return;
|
||||
}
|
||||
|
||||
this.resizer = new Resizer(this);
|
||||
this.arDetector = new ArDetector(this); // this starts Ar detection. needs optional parameter that prevents ArDetector from starting
|
||||
|
||||
// INIT OBSERVERS
|
||||
this.logger.log('info', ['debug', 'init'], '[VideoData::ctor] Created videoData with vdid', this.vdid, '\nextension mode:', this.extensionMode)
|
||||
|
||||
|
||||
// Everything is set up at this point. However, we are still purely "read-only" at this point. Player CSS should not be changed until
|
||||
// after we receive a "please crop" or "please stretch".
|
||||
|
||||
// Time to apply any crop from address of crop mode persistence
|
||||
const defaultCrop = this.settings.getDefaultCrop();
|
||||
const defaultStretch = this.settings.getDefaultStretchMode();
|
||||
|
||||
// Crop mode persistence is intended to avoid resetting video aspect ratio to site or extension default
|
||||
// when going from one video to another. As such, crop persistence takes priority over site defaults.
|
||||
// This option should only trigger if we have modified the aspect ratio manually.
|
||||
if (
|
||||
this.settings.getDefaultCropPersistenceMode(window.location.hostname) !== CropModePersistence.Disabled
|
||||
&& this.pageInfo.defaultCrop
|
||||
) {
|
||||
this.resizer.setAr(this.pageInfo.defaultCrop);
|
||||
} else {
|
||||
this.resizer.setAr(defaultCrop);
|
||||
this.resizer.setStretchMode(defaultStretch);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Must be triggered on first action. TODO
|
||||
*/
|
||||
preparePage() {
|
||||
this.injectBaseCss();
|
||||
|
||||
this.pageInfo.initMouseActionHandler(this);
|
||||
|
||||
// aspect ratio autodetection cannot be properly initialized at this time,
|
||||
// so we'll avoid doing that
|
||||
this.enable();
|
||||
|
||||
// start fallback video/player size detection
|
||||
this.fallbackChangeDetection();
|
||||
}
|
||||
|
||||
initializeObservers() {
|
||||
try {
|
||||
if (BrowserDetect.firefox) {
|
||||
this.observer = new ResizeObserver(
|
||||
@ -235,45 +275,6 @@ class VideoData {
|
||||
console.error('[VideoData] Observer setup failed:', e);
|
||||
}
|
||||
this.observer.observe(this.video);
|
||||
|
||||
// INIT AARD
|
||||
this.arDetector = new ArDetector(this); // this starts Ar detection. needs optional parameter that prevets ardetdctor from starting
|
||||
// player dimensions need to be in:
|
||||
// this.player.dimensions
|
||||
|
||||
// apply default align and stretch
|
||||
this.logger.log('info', 'debug', "%c[VideoData::ctor] Initial resizer reset!", "background: #afd, color: #132");
|
||||
this.resizer.reset();
|
||||
|
||||
this.logger.log('info', ['debug', 'init'], '[VideoData::ctor] Created videoData with vdid', this.vdid, '\nextension mode:', this.extensionMode)
|
||||
|
||||
this.pageInfo.initMouseActionHandler(this);
|
||||
|
||||
// aspect ratio autodetection cannot be properly initialized at this time,
|
||||
// so we'll avoid doing that
|
||||
this.enable({withoutAard: true});
|
||||
|
||||
// start fallback video/player size detection
|
||||
this.fallbackChangeDetection();
|
||||
|
||||
// force reload last aspect ratio (if default crop ratio exists), but only after the video is
|
||||
if (this.pageInfo.defaultCrop) {
|
||||
this.resizer.setAr(this.pageInfo.defaultCrop);
|
||||
}
|
||||
|
||||
try {
|
||||
if (!this.pageInfo.defaultCrop) {
|
||||
if (!this.invalid) {
|
||||
this.initArDetection();
|
||||
} else {
|
||||
this.logger.log('error', 'debug', '[VideoData::secondStageSetup] Video is invalid. Aard not started.', this.video);
|
||||
}
|
||||
} else {
|
||||
this.logger.log('info', 'debug', '[VideoData::secondStageSetup] Default crop is specified for this site. Not starting aard.');
|
||||
}
|
||||
} catch (e) {
|
||||
this.logger.log('error', 'init', `[VideoData::secondStageSetup] Error with aard initialization (or error with default aspect ratio application)`, e)
|
||||
}
|
||||
}
|
||||
|
||||
setupMutationObserver() {
|
||||
@ -352,7 +353,7 @@ class VideoData {
|
||||
* Enables ultrawidify in general.
|
||||
* @param options
|
||||
*/
|
||||
enable(options?: {fromPlayer?: boolean, withoutAard?: boolean}) {
|
||||
enable(options?: {fromPlayer?: boolean}) {
|
||||
this.enabled = true;
|
||||
|
||||
// NOTE — since base class for our <video> element depends on player aspect ratio,
|
||||
@ -360,10 +361,6 @@ class VideoData {
|
||||
this.video.classList.add(this.baseCssName);
|
||||
this.video.classList.add(this.userCssClassName); // this also needs to be applied BEFORE we initialize resizer! — O RLY? NEEDS TO BE CHECKED
|
||||
|
||||
if (!options?.withoutAard) {
|
||||
this.startArDetection();
|
||||
}
|
||||
|
||||
if (!options?.fromPlayer) {
|
||||
this.player?.enable();
|
||||
}
|
||||
|
||||
@ -207,7 +207,23 @@ class Resizer {
|
||||
return;
|
||||
}
|
||||
|
||||
if (ar.type !== AspectRatioType.Automatic) {
|
||||
// handle autodetection stuff
|
||||
if (ar.type === AspectRatioType.Automatic) {
|
||||
this.conf.arDetector.start();
|
||||
return;
|
||||
} else if (ar.type !== AspectRatioType.AutomaticUpdate) {
|
||||
this.conf.arDetector.stop();
|
||||
}
|
||||
|
||||
// unless we're trying to reset aspect ratio, we need to tell VideoData that this would
|
||||
// be a good time to start injecting CSS modifications into the page.
|
||||
//
|
||||
// CSS, et. al. initialization is deferred in order to avoid breaking wonky sites by default.
|
||||
if (ar.type !== AspectRatioType.Reset && ar.type !== AspectRatioType.Initial) {
|
||||
await this.conf.preparePage();
|
||||
}
|
||||
|
||||
if (ar.type !== AspectRatioType.AutomaticUpdate) {
|
||||
this.manualZoom = false;
|
||||
}
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user