fix flip on safari again - webgbcam - [fork] gameboy webcam
HTML git clone git://src.adamsgaard.dk/webgbcam
DIR Log
DIR Files
DIR Refs
DIR README
DIR LICENSE
---
DIR commit 7cffd552de40387d74adab2e4e39d91d6ac886c7
DIR parent 6a9f7cec7deb3137748e6c4f6b90f978cbb3a57f
HTML Author: Erin Pinheiro <hello@mynameiser.in>
Date: Mon, 24 Jan 2022 22:28:23 -0300
fix flip on safari again
Diffstat:
M app.js | 21 ++++-----------------
M index.html | 2 +-
2 files changed, 5 insertions(+), 18 deletions(-)
---
DIR diff --git a/app.js b/app.js
@@ -242,8 +242,7 @@ var cameraVars = {
xOffset: 0,
yOffset: 0,
xScale: 1,
- yScale: 1,
- flipped: false
+ yScale: 1
};
const sliderGamma = [
@@ -750,19 +749,10 @@ function initCameraDrawing() {
}
// canvas starts flipped for user facing camera
- let isSafari = navigator.vendor && navigator.vendor.indexOf('Apple') > -1 &&
- navigator.userAgent &&
- navigator.userAgent.indexOf('CriOS') == -1 &&
- navigator.userAgent.indexOf('FxiOS') == -1;
-
- if(settings.facingMode != 'environment' && !isSafari) {
- //cameraView.getContext('2d').setTransform(-1, 0, 0, 1, 0, 0);
- cameraVars.flipped = true;
- // cameraView.getContext('2d').scale(-1,1);
- // cameraVars.xOffset *= -1;
- // cameraVars.xScale *= -1;
+ if(settings.facingMode != "environment") { // not environment = front-facing phone cam or pc webcam, flip
+ cameraView.getContext('2d').setTransform(-1, 0, 0, 1, cameraVars.width, 0);
} else {
- cameraVars.flipped = false;
+ cameraView.getContext('2d').setTransform(1, 0, 0, 1, 0, 0);
}
console.log(cameraVars);
@@ -834,9 +824,6 @@ function gifFrame() {
function drawFrame() {
let camctx = cameraView.getContext('2d');
- if (cameraVars.flipped) {
- camctx.setTransform(-1, 0, 0, 1, cameraVars.width, 0);
- }
camctx.drawImage(cameraStream, cameraVars.xOffset, cameraVars.yOffset, cameraVars.xScale, cameraVars.yScale, 0, 0, cameraVars.width, cameraVars.height);
Filters.filterImage(Filters.gbcamera, cameraView, [cameraVars.dither]);
DIR diff --git a/index.html b/index.html
@@ -16,7 +16,7 @@
<body>
<div class="maple-window">
- <div class="maple-window-title"><span>webgbcam v3.1</span></div>
+ <div class="maple-window-title"><span>webgbcam v3.1-ios-fixes1</span></div>
<div id="camera">
<canvas id="app-view"></canvas>
<canvas id="camera-view"></canvas>