JSFiddle - React, Tailwind, and code Playground

JavaScript

(function (exampleCode) {
"use strict";		

var face = faces[i];

if(	face.state === testState.FACE_TRACKING_START ||
	face.state === testState.FACE_TRACKING) {
	// Yawn Detection - Or: How wide open is the mouth?

	setPoint(face.vertices, 39, p1); // right eye inner corner
	setPoint(face.vertices, 42, p0); // left eye inner corner

	var eyeDist = calcDistance(p0, p1);

	setPoint(face.vertices, 62, p0); // mouth corner left
	setPoint(face.vertices, 66, p1); // mouth corner right

	var mouthOpen = calcDistance(p0, p1);
	var yawnFactor = mouthOpen / eyeDist;

	yawnFactor -= 0.35; // remove smiling

	if(yawnFactor < 0) yawnFactor = 0;

	yawnFactor *= 2.0; // scale up a bit

	if(yawnFactor > 1.0) yawnFactor = 1.0;

	if(yawnFactor < 0.0) { yawnFactor = 0.0; }
	if(yawnFactor > 1.0) { yawnFactor = 1.0; }
			
	// Face Tracking results: 68 facial feature points.

	draw.drawTriangles(	face.vertices, face.triangles, false, 1.0, color, 0.4);
	draw.drawVertices(	face.vertices, 2.0, false, color, 0.4);

	FaceExample.dom.updateHeadline("\n" +
	"Mund offen: " + (yawnFactor * 1).toFixed(2));  

/////////////////////////////////////////////////////////////
	var wert = 0.5;
		
	Object.assign( exampleCode, {
  
		getValue: function() {
    
			return wert;
      
    }    
	}); 		
/////////////////////////////////////////////////////////////
};	

var p0				= new test.Point();
var p1				= new test.Point();

var setPoint		= testPointUtils.setPoint;
var calcDistance	= testPointUtils.calcDistance;

FaceExample.dom.updateHeadline("\n" +
"Mund offen.");	

FaceExample.dom.updateCodeSnippet(exampleCode + "");

})( window.exampleCode = window.exampleCode || {} );