Fix stretch mode

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "ultrawidify",
-  "version": "6.2.2",
+  "version": "6.2.3",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "ultrawidify",
-  "version": "6.2.2",
+  "version": "6.2.3",
   "description": "Aspect ratio fixer for youtube and other sites, with automatic aspect ratio detection. Supports ultrawide and other ratios.",
   "author": "Tamius Han <tamius.han@gmail.com>",
   "scripts": {

src/common/interfaces/SettingsInterface.ts

@@ -321,7 +321,7 @@ export interface SiteSettingsInterface {
 
   defaults?: {       // must be defined in @global and @empty
     crop?: {type: AspectRatioType, [x: string]: any},
-    stretch?: StretchType,
+    stretch?: {type: StretchType, ratio?: number},
     alignment?: {x: VideoAlignmentType, y: VideoAlignmentType},
   }
 

src/common/interfaces/StretchInterface.ts

@@ -0,0 +1,6 @@
+import StretchType from '../enums/StretchType.enum';
+
+export interface Stretch {
+  type: StretchType,
+  ratio?: number
+}

src/csui/src/PlayerUiPanels/ChangelogPanel.vue

@@ -32,6 +32,11 @@
           <li>Half-fixed in-player UI on sites where player is not detected correctly</li>
         </ul>
 
+        <h3>6.2.3</h3>
+        <ul>
+          <li>Fixed default persistent mode</li>
+        </ul>
+
         <hr/>
 
         <h2>6.0.0</h2>

src/ext/conf/ExtConfPatches.ts

@@ -193,6 +193,15 @@ const ExtensionConfPatch = [
       userOptions.arDetect = defaultOptions.arDetect;
       userOptions.newFeatureTracker = defaultOptions.newFeatureTracker;
     }
+  }, {
+    forVersion: '6.2.3',
+    updateFn: (userOptions: SettingsInterface, defaultOptions) => {
+      for (const site in userOptions.sites) {
+        if (userOptions.sites[site].defaults?.stretch && !userOptions.sites[site].defaults?.stretch.type) {
+          userOptions.sites[site].defaults.stretch = {type: userOptions.sites[site].defaults?.stretch as any as StretchType};
+        }
+      }
+    }
   }
 ];
 

src/ext/conf/ExtensionConf.ts

@@ -1438,7 +1438,7 @@ const ExtensionConf: SettingsInterface = {
 
       defaults: {
         crop: {type: AspectRatioType.Automatic},
-        stretch: StretchType.NoStretch,
+        stretch: {type: StretchType.NoStretch},
         alignment: {x: VideoAlignmentType.Center, y: VideoAlignmentType.Center},
       }
     },
@@ -1463,7 +1463,7 @@ const ExtensionConf: SettingsInterface = {
       persistCSA: CropModePersistence.Default,
       defaults: {
         crop: null,
-        stretch: StretchType.Default,
+        stretch: {type: StretchType.Default},
         alignment: {x: VideoAlignmentType.Default, y: VideoAlignmentType.Default},
       }
     },

src/ext/lib/Settings.ts

@@ -349,22 +349,6 @@ class Settings {
     return JSON.parse(JSON.stringify(this.default));
   }
 
-  getDefaultOption(option?) {
-    const allDefault = {
-      mode: ExtensionMode.Default,
-      autoar: ExtensionMode.Default,
-      autoarFallback: ExtensionMode.Default,
-      stretch: StretchType.Default,
-      videoAlignment: VideoAlignmentType.Default,
-    };
-
-    if (!option || allDefault[option] === undefined) {
-      return allDefault;
-    }
-
-    return allDefault[option];
-  }
-
   /**
    * Gets default site configuration. Only returns essential settings.
    * @returns

src/ext/lib/settings/SiteSettings.ts

@@ -66,7 +66,7 @@ export class SiteSettings {
       this.data.defaults.crop = this.data.defaults.crop ?? _cp(this.defaultSettings.defaults.crop);
 
       // these can contain default options, but can also be undefined
-      if (this.data.defaults?.stretch === StretchType.Default || this.data.defaults?.stretch === undefined) {
+      if ([undefined, StretchType.Default].includes(this.data.defaults?.stretch?.type)) {
         this.data.defaults.stretch = _cp(this.defaultSettings.defaults.stretch ?? StretchType.NoStretch);
       }
       if (this.data.defaults?.alignment === undefined) {  // distinguish between undefined and 0!

src/ext/lib/video-data/VideoData.ts

@@ -16,6 +16,7 @@ import { Ar } from '../../../common/interfaces/ArInterface';
 import { ExtensionStatus } from './ExtensionStatus';
 import { RunLevel } from '../../enum/run-level.enum';
 import { Aard } from '../aard/Aard';
+import { Stretch } from '../../../common/interfaces/StretchInterface';
 
 /**
  * VideoData — handles CSS for the video element.
@@ -262,7 +263,7 @@ class VideoData {
 
     // Time to apply any crop from address of crop mode persistence
     const defaultCrop = this.siteSettings.getDefaultOption('crop') as Ar;
-    const defaultStretch = this.siteSettings.getDefaultOption('stretch');
+    const defaultStretch = this.siteSettings.getDefaultOption('stretch') as Stretch;
 
     this.resizer.setAr(defaultCrop);
     this.resizer.setStretchMode(defaultStretch);

src/ext/lib/video-transform/Resizer.ts

@@ -20,6 +20,7 @@ import { Ar } from '../../../common/interfaces/ArInterface';
 import { RunLevel } from '../../enum/run-level.enum';
 import * as _ from 'lodash';
 import getElementStyles from '../../util/getElementStyles';
+import { Stretch } from '../../../common/interfaces/StretchInterface';
 
 if(Debug.debug) {
   console.log("Loading: Resizer.js");
@@ -113,7 +114,7 @@ class Resizer {
     'set-stretch': [{
       function: (config: any) => {
         this.manualZoom = false; // we also need to unset manual aspect ratio when doing this
-        this.setStretchMode(config.type, config.ratio)
+        this.setStretchMode(config)
       }
     }],
     'set-zoom': [{
@@ -130,7 +131,7 @@ class Resizer {
         'uw-resizer-config-broadcast',
         {
           ar: this.lastAr,
-          stretchMode: this.stretcher.mode,
+          stretchMode: this.stretcher.stretch,
           videoAlignment: this.videoAlignment
         }
       )
@@ -285,7 +286,7 @@ class Resizer {
     // without any human interaction
     if (
       [AspectRatioType.Reset, AspectRatioType.Initial].includes(ar.type) &&
-      [StretchType.NoStretch, StretchType.Default].includes(this.stretcher.mode)
+      [StretchType.NoStretch, StretchType.Default].includes(this.stretcher.stretch.type)
     ) {
       this.eventBus.send('set-run-level', RunLevel.UIOnly);
     } else {
@@ -364,7 +365,7 @@ class Resizer {
     // * ar.type is auto, but stretch is set to basic basic stretch
     //
     // unpause when using other modes
-    if ((ar.type !== AspectRatioType.Automatic && ar.type !== AspectRatioType.AutomaticUpdate) || this.stretcher.mode === StretchType.Basic) {
+    if ((ar.type !== AspectRatioType.Automatic && ar.type !== AspectRatioType.AutomaticUpdate) || this.stretcher.stretch.type === StretchType.Basic) {
       this.videoData?.aard?.stop();
     } else {
       if (ar.type !== AspectRatioType.AutomaticUpdate) {
@@ -375,10 +376,7 @@ class Resizer {
     }
 
     // do stretch thingy
-    if (this.stretcher.mode === StretchType.NoStretch
+    if ([StretchType.NoStretch, StretchType.Conditional, StretchType.FixedSource].includes(this.stretcher.stretch.type)) {
-        || this.stretcher.mode === StretchType.Conditional
-        || this.stretcher.mode === StretchType.FixedSource
-    ){
       stretchFactors = this.scaler.calculateCrop(ar);
 
       if(! stretchFactors || stretchFactors.error){
@@ -398,23 +396,23 @@ class Resizer {
         }
       }
 
-      if (this.stretcher.mode === StretchType.Conditional){
+      if (this.stretcher.stretch.type === StretchType.Conditional){
         this.stretcher.applyConditionalStretch(stretchFactors, ar.ratio);
-      } else if (this.stretcher.mode === StretchType.FixedSource) {
+      } else if (this.stretcher.stretch.type === StretchType.FixedSource) {
         this.stretcher.applyStretchFixedSource(stretchFactors);
       }
       this.logger.log('info', 'debug', "[Resizer::setAr] Processed stretch factors for ",
-                      this.stretcher.mode === StretchType.NoStretch ? 'stretch-free crop.' :
+                      this.stretcher.stretch.type === StretchType.NoStretch ? 'stretch-free crop.' :
-                        this.stretcher.mode === StretchType.Conditional ? 'crop with conditional StretchType.' : 'crop with fixed stretch',
+                        this.stretcher.stretch.type === StretchType.Conditional ? 'crop with conditional StretchType.' : 'crop with fixed stretch',
                       'Stretch factors are:', stretchFactors
       );
 
-    } else if (this.stretcher.mode === StretchType.Hybrid) {
+    } else if (this.stretcher.stretch.type === StretchType.Hybrid) {
       stretchFactors = this.stretcher.calculateStretch(ar.ratio);
       this.logger.log('info', 'debug', '[Resizer::setAr] Processed stretch factors for hybrid stretch/crop. Stretch factors are:', stretchFactors);
-    } else if (this.stretcher.mode === StretchType.Fixed) {
+    } else if (this.stretcher.stretch.type === StretchType.Fixed) {
       stretchFactors = this.stretcher.calculateStretchFixed(ar.ratio)
-    } else if (this.stretcher.mode === StretchType.Basic) {
+    } else if (this.stretcher.stretch.type === StretchType.Basic) {
       stretchFactors = this.stretcher.calculateBasicStretch();
       this.logger.log('info', 'debug', '[Resizer::setAr] Processed stretch factors for basic StretchType. Stretch factors are:', stretchFactors);
     } else {
@@ -455,8 +453,8 @@ class Resizer {
   }
 
 
-  setStretchMode(stretchMode, fixedStretchRatio?){
+  setStretchMode(stretch: {type: StretchType, ratio?: number}) {
-    this.stretcher.setStretchMode(stretchMode, fixedStretchRatio);
+    this.stretcher.setStretchMode(stretch);
     this.restore();
   }
 
@@ -558,7 +556,7 @@ class Resizer {
   }
 
   reset(){
-    this.setStretchMode(this.siteSettings.getDefaultOption('stretch'));
+    this.setStretchMode(this.siteSettings.getDefaultOption('stretch') as Stretch);
     this.zoom.setZoom(1);
     this.resetPan();
     this.setAr({type: AspectRatioType.Reset});
@@ -596,7 +594,7 @@ class Resizer {
   }
 
   resetStretch(){
-    this.stretcher.setStretchMode(StretchType.NoStretch);
+    this.stretcher.setStretchMode({type: StretchType.NoStretch});
     this.restore();
   }
 

src/ext/lib/video-transform/Stretcher.ts

@@ -5,6 +5,7 @@ import AspectRatioType from '../../../common/enums/AspectRatioType.enum';
 import VideoData from '../video-data/VideoData';
 import Logger from '../Logger';
 import Settings from '../Settings';
+import { Stretch } from '../../../common/interfaces/StretchInterface';
 
 // računa vrednosti za transform-scale (x, y)
 // transform: scale(x,y) se uporablja za raztegovanje videa, ne pa za približevanje
@@ -24,7 +25,7 @@ class Stretcher {
   //#endregion
 
   //#region misc data
-  mode: any;
+  stretch: Stretch;
   fixedStretchRatio: any;
   //#endregion
 
@@ -34,19 +35,12 @@ class Stretcher {
     this.logger = videoData.logger;
     this.siteSettings = videoData.siteSettings;
     this.settings = videoData.settings;
-    this.mode = this.siteSettings.data.defaults.stretch;
+
-    this.fixedStretchRatio = undefined;
+    this.setStretchMode(this.siteSettings.getDefaultOption('stretch') as Stretch);
   }
 
-  setStretchMode(stretchMode, fixedStretchRatio?) {
+  setStretchMode(stretch: Stretch) {
-    if (stretchMode === StretchType.Default) {
+    this.stretch = stretch;
-      this.mode = this.siteSettings.data.defaults.stretch;
-    } else {
-      if (stretchMode === StretchType.Fixed || stretchMode == StretchType.FixedSource) {
-        this.fixedStretchRatio = fixedStretchRatio;
-      }
-      this.mode = stretchMode;
-    }
   }
 
   applyConditionalStretch(stretchFactors, actualAr){

src/manifest.json

@@ -2,7 +2,7 @@
   "manifest_version": 3,
   "name": "Ultrawidify",
   "description": "Removes black bars on ultrawide videos and offers advanced options to fix aspect ratio.",
-  "version": "6.2.2",
+  "version": "6.2.3",
   "icons": {
     "32":"res/icons/uw-32.png",
     "64":"res/icons/uw-64.png"