Mirrors/community-apps
3
0
Fork 0
mirror of https://github.com/overte-org/community-apps.git synced 2025-04-05 21:22:00 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge pull request #56 from Colorfingers/facelift

Browse source 
Added video select
This commit is contained in:
ksuprynowicz 2023-12-04 21:52:32 +01:00 committed by GitHub
commit d24d5db3c4
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 33163 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

100
applications/emocam/index.html
View file

@ -235,7 +235,6 @@
};
</script>
<meta charset="utf-8">
<meta http-equiv="Cache-control" content="no-cache, no-store, must-revalidate">
<meta http-equiv="Pragma" content="no-cache">
@ -247,14 +246,13 @@
</head>
<body bgcolor="white">
<div id="liveView" class="videoView">
<table width="320px">
<tr>
<td>
<button id="webcamButton" class="mdc-button mdc-button--raised">
<button id="webcamButton" style="white-space:nowrap;width:100px" class="mdc-button mdc-button--raised">
<span class="mdc-button__ripple"></span>
<span class="mdc-button__label">ENABLE PREDICTIONS</span>
<span class="mdc-button__label">VIDEO ON</span>
</button>
</td>
<td>
@ -270,14 +268,18 @@
</label>
</td>
</tr>
</table>
<tr><td colspan="4">
<div class="select">
<select id="videoSource"></select>
</div>
</td></tr>
</table><br>
<div style="position: relative;">
<video id="webcam" autoplay playsinline></video>
<canvas class="output_canvas" id="output_canvas" style="position: absolute; left: 0px; top: 0px;"></canvas>
</div>
</div>
<div>
<select id="landmarkDropdown" onchange="handleLandmarkChange()">
<!-- Options for the dropdown will be populated in the script -->
</select>
@ -711,29 +713,97 @@
} else {
console.warn("getUserMedia() is not supported by your browser");
}
$(document).on("click", ".vid_link", function (event) {
var videoElement = document.querySelector('video');
hrefValue = $(this).text();
var idValue = $(this).attr('id');
vidopttrigger = true;
document.querySelector("#videoSource").value=idValue;
$("#videoSource").val(idValue).prop('selected', true);
$("#videoSource").val(idValue).change();
$("#videoDropdown").val(hrefValue);
});
// Enable the live webcam view and start detection.
function enableCam(event) {
var videoElement = document.querySelector('video');
var videoSelect = document.querySelector('select#videoSource');
videoSelect.onchange = getStream;
if (!faceLandmarker) {
console.log("Wait! faceLandmarker not loaded yet.");
return;
}
if (webcamRunning === true) {
webcamRunning = false;
enableWebcamButton.innerText = "ENABLE PREDICTIONS";
enableWebcamButton.innerText = "VIDEO ON";
$('#videoSource').empty();
window.stream.getTracks().forEach(track => {
track.stop();
});
} else {
getStream().then(getDevices).then(gotDevices);
webcamRunning = true;
enableWebcamButton.innerText = "DISABLE PREDICTIONS";
enableWebcamButton.innerText = "VIDEO OFF";
video.addEventListener("loadeddata", predictWebcam);
}
// getUsermedia parameters.
// Copyright 2017 Google Inc.
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
// http://www.apache.org/licenses/LICENSE-2.0
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.
function getDevices() {
// AFAICT in Safari this only gets default devices until gUM is called :/
return navigator.mediaDevices.enumerateDevices();
}
function gotDevices(deviceInfos) {
window.deviceInfos = deviceInfos; // make available to console
console.log('Available input and output devices:', deviceInfos);
for (const deviceInfo of deviceInfos) {
const option = document.createElement('option');
option.value = deviceInfo.deviceId;
if (deviceInfo.kind === 'videoinput') {
option.text = deviceInfo.label || `Camera ${videoSelect.length + 1}`;
videoSelect.appendChild(option);
$("#vid_list").append("<a class='vid_link' href='#' id='"+option.value+"'>" + option.text + "</a>");
}
}
}
function getStream() {
if (window.stream) {
window.stream.getTracks().forEach(track => {
track.stop();
});
}
const videoSource = videoSelect.value;
const constraints = {
video: true
video: {deviceId: videoSource ? {exact: videoSource} : undefined}
};
// Activate the webcam stream.
navigator.mediaDevices.getUserMedia(constraints).then(function (stream) {
video.srcObject = stream;
video.addEventListener("loadeddata", predictWebcam);
});
return navigator.mediaDevices.getUserMedia(constraints).
then(gotStream).catch(handleError);
}
function gotStream(stream) {
window.stream = stream; // make stream available to console
videoSelect.selectedIndex = [...videoSelect.options].
findIndex(option => option.text === stream.getVideoTracks()[0].label);
videoElement.srcObject = stream;
}
function handleError(error) {
console.error('Error: ', error);
}
}
let lastVideoTime = -1;

33078
applications/emocam/js/tasks-vision.ts Normal file
View file

File diff suppressed because it is too large Load diff

BIN
applications/emocam/models/face_landmarker.task Normal file
View file

Binary file not shown.