Fix legacy canvas loading

This commit is contained in:
Tamius Han 2025-04-27 17:53:50 +02:00
parent 508ef5cbbb
commit 269dddc92e
5 changed files with 13 additions and 18 deletions

View File

@ -234,6 +234,7 @@
/>
<input
v-model="settings.active.arDetect.timers.playing"
@change="setArCheckFrequency($event.target.value)"
class="input"
type="text"
>
@ -244,10 +245,10 @@
<div class="field">
<div class="label">Frame extraction canvas type:</div>
<div class="select">
<select v-model="settings.active.arDetect.aardType">
<select v-model="settings.active.arDetect.aardType" @change="settings.saveWithoutReload">
<option value="auto">Automatic</option>
<option value="webgl">WebGL only</option>
<option value="fallback">Legacy / fallback</option>
<option value="legacy">Legacy / fallback</option>
</select>
</div>
</div>

View File

@ -370,14 +370,14 @@ export class Aard {
return new GlCanvas({...this.settings.active.arDetect.canvasDimensions.sampleCanvas, id: 'main-gl'});
} catch (e) {
if (this.settings.active.arDetect.aardType !== 'webgl') {
return new FallbackCanvas({...this.settings.active.arDetect.canvasDimensions.sampleCanvas, id: 'main-fallback'});
return new FallbackCanvas({...this.settings.active.arDetect.canvasDimensions.sampleCanvas, id: 'main-legacy'});
}
console.error('[ultrawidify|Aard::createCanvas] could not create webgl canvas:', e);
this.eventBus.send('uw-config-broadcast', {type: 'aard-error', aardErrors: {webglError: true}});
throw e;
}
} else if (this.settings.active.arDetect.aardType === 'legacy') {
return new FallbackCanvas({...this.settings.active.arDetect.canvasDimensions.sampleCanvas, id: 'main-fallback'});
return new FallbackCanvas({...this.settings.active.arDetect.canvasDimensions.sampleCanvas, id: 'main-legacy'});
} else {
console.error('[ultrawidify|Aard::createCanvas] invalid value in settings.arDetect.aardType:', this.settings.active.arDetect.aardType);
this.eventBus.send('uw-config-broadcast', {type: 'aard-error', aardErrors: {invalidSettings: true}});

View File

@ -2,7 +2,9 @@ import { GlCanvas, GlCanvasOptions } from './GlCanvas';
export class FallbackCanvas extends GlCanvas {
get type() {
return 'legacy';
}
context: CanvasRenderingContext2D;
constructor(options: GlCanvasOptions) {
@ -24,7 +26,7 @@ export class FallbackCanvas extends GlCanvas {
protected initWebgl() { }
drawVideoFrame(video: HTMLVideoElement) {
this.context.drawImage(video, this.context.canvas.width, this.context.canvas.height);
this.context.drawImage(video, 0, 0, this.context.canvas.width, this.context.canvas.height);
}
getImageData() {

View File

@ -52,6 +52,9 @@ interface GlCanvasProgramInfo {
}
export class GlCanvas {
get type() {
return 'webgl';
}
private _canvas: HTMLCanvasElement;
private set canvas(x: HTMLCanvasElement) {

View File

@ -574,7 +574,7 @@
<div class="flex flex-row button-box sticky-bottom">
<Button label="Cancel"
@click.native="cancel()"
>
>
</Button>
<Button label="Save settings"
@click.native="saveManual()"
@ -601,17 +601,6 @@ export default {
},
created() {
this.sensitivity = this.getSensitivity();
const canvas = document.createElement('canvas');
canvas.width = 10;
canvas.height = 10;
const ctx = canvas.getContext('2d');
try {
ctx.drawWindow(window,0, 0, 10, 10, "rgba(0,0,0,0)");
this.fallbackModeAvailable = true;
} catch (e) {
this.fallbackModeAvailable = false;
}
},
methods: {
setArCheckFrequency(event) {