ANGLE popup

This commit is contained in:
Tamius Han 2023-01-22 17:45:33 +01:00
parent 11bc79520a
commit 26ee2ffbb6
2 changed files with 20 additions and 2 deletions

View File

@ -85,7 +85,7 @@ function detectBackend(str) {
* Known limitations: D11on12 cannot be detected.
* @returns
*/
function detectANGLEBackend(): AngleVersion {
export function detectANGLEBackend(): AngleVersion {
const canvas = document.createElement("canvas");
const gl = canvas.getContext("webgl2") ||
canvas.getContext("webgl") ||
@ -112,7 +112,8 @@ function detectANGLEBackend(): AngleVersion {
(gl as any).compileShader(shader);
if (!(gl as any).getShaderParameter(shader, (gl as any).COMPILE_STATUS)) {
return console.error("invalid shader", (gl as any).getShaderInfoLog(shader));
console.error("invalid shader", (gl as any).getShaderInfoLog(shader));
return AngleVersion.NotAvailable;
}
const source = ext.getTranslatedShaderSource(shader);

View File

@ -20,6 +20,16 @@
Build channel: {{BrowserDetect.processEnvChannel}}
</div>
</div>
<!-- ANGLE warning for chrome/edge -->
<div v-if="warnings.angleBackend" class="flex flex-column">
<div class="warning-lite">
<b style="padding-left: 0.5rem">Hardware acceleration in <template v-if="BrowserDetect.edge">Edge</template><template v-else>Chrome</template> is broken</b><br/>
<small> This causes videos to be stretched incorrectly.
This is a bug with <template v-if="BrowserDetect.edge">Edge</template><template v-else>Chrome</template>, not with this addon.</small><br/>
To fix the problem, visit <code style="background-color: rgba(255,128,64, 0.2)"><template v-if="BrowserDetect.edge">edge</template><template v-else>chrome</template>://flags#use-angle</code> and choose <b>D3D9</b> or <b>OpenGL</b> from available options.
</div>
</div>
<div
v-if="narrowPopup"
class="w100 show-more flex flex-row flex-center flex-cross-center menu-button"
@ -212,9 +222,13 @@ import ExtensionMode from '../common/enums/ExtensionMode.enum';
import Logger from '../ext/lib/Logger';
import {ChromeShittinessMitigations as CSM} from '../common/js/ChromeShittinessMitigations';
import { browser } from 'webextension-polyfill-ts';
import { detectANGLEBackend, AngleVersion } from '../ext/lib/angle-detect/detect-angle-backend';
export default {
data () {
const angleBackend = detectANGLEBackend();
const gibAngleWarning = BrowserDetect.anyChromium && angleBackend !== AngleVersion.OpenGL && angleBackend !== AngleVersion.D3D9;
return {
selectedTab: 'video',
selectedFrame: '__all',
@ -238,6 +252,9 @@ export default {
BrowserDetect: BrowserDetect,
narrowPopup: null,
sideMenuVisible: null,
warnings: {
angleBackend: gibAngleWarning
}
}
},
async created() {