haskal
/
jiti-meet
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix(face-centering) fix face centering on browsers with no offscreencanvas support (#11234)

This commit is contained in:
Avram Tudor 2022-03-28 14:13:00 +03:00 committed by GitHub
parent 9ea2b5836a
commit 7e5ffdb390
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 24 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
react/features/face-centering/faceCenteringWorker.js
View File

@ -35,7 +35,7 @@ const queue = [];
let lastValidFaceBox;
const detect = async message => {
const { baseUrl, imageBitmap, isHorizontallyFlipped, threshold } = message.data;
const { baseUrl, image, isHorizontallyFlipped, threshold } = message.data;
if (initInProgress || initError) {
return;
@ -70,8 +70,8 @@ const detect = async message => {
tf.engine().startScope();
const image = tf.browser.fromPixels(imageBitmap);
const detections = await model.estimateFaces(image, false, isHorizontallyFlipped, false);
const imageTensor = tf.browser.fromPixels(image);
const detections = await model.estimateFaces(imageTensor, false, isHorizontallyFlipped, false);
tf.engine().endScope();
@ -80,10 +80,10 @@ const detect = async message => {
if (detections.length) {
faceBox = {
// normalize to percentage based
left: Math.round(Math.min(...detections.map(d => d.topLeft[0])) * 100 / imageBitmap.width),
right: Math.round(Math.max(...detections.map(d => d.bottomRight[0])) * 100 / imageBitmap.width),
top: Math.round(Math.min(...detections.map(d => d.topLeft[1])) * 100 / imageBitmap.height),
bottom: Math.round(Math.max(...detections.map(d => d.bottomRight[1])) * 100 / imageBitmap.height)
left: Math.round(Math.min(...detections.map(d => d.topLeft[0])) * 100 / image.width),
right: Math.round(Math.max(...detections.map(d => d.bottomRight[0])) * 100 / image.width),
top: Math.round(Math.min(...detections.map(d => d.topLeft[1])) * 100 / image.height),
bottom: Math.round(Math.max(...detections.map(d => d.bottomRight[1])) * 100 / image.height)
};
if (lastValidFaceBox && Math.abs(lastValidFaceBox.left - faceBox.left) < threshold) {

18
react/features/face-centering/functions.js
View File

@ -44,6 +44,7 @@ export async function sendDataToWorker(
}
let imageBitmap;
let image;
try {
imageBitmap = await imageCapture.grabFrame();
@ -53,13 +54,28 @@ export async function sendDataToWorker(
return;
}
if (typeof OffscreenCanvas === 'undefined') {
const canvas = document.createElement('canvas');
const context = canvas.getContext('2d');
canvas.width = imageBitmap.width;
canvas.height = imageBitmap.height;
context.drawImage(imageBitmap, 0, 0);
image = context.getImageData(0, 0, imageBitmap.width, imageBitmap.height);
} else {
image = imageBitmap;
}
worker.postMessage({
id: DETECT_FACE_BOX,
baseUrl: getBaseUrl(),
imageBitmap,
image,
threshold,
isHorizontallyFlipped
});
imageBitmap.close();
}
/**