Files
Backend-Api/ServiceHost/wwwroot/AssetsCamera/js/Index.js
2024-12-22 02:47:29 +03:30

692 lines
24 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
// ------------------------------------------------------------- start camera standby
let timeout;
const redirectTime = 600000; // 10 دقیقه
function resetTimer() {
clearTimeout(timeout);
timeout = setTimeout(() => {
window.location.href = "/Camera/CamStandby";
}, redirectTime);
}
window.onload = resetTimer; // بارگذاری صفحه
window.onmousemove = resetTimer; // حرکت ماوس
window.onmousedown = resetTimer; // کلیک کردن
window.ontouchstart = resetTimer; // لمس روی دستگاه‌های لمسی
window.onclick = resetTimer; // کلیک کردن
window.onkeypress = resetTimer; // فشردن کلید
window.onscroll = resetTimer; // اسکرول کردن
resetTimer();
// ------------------------------------------------------------- end camera standby
window.onload = function () {
//setTimeout(function () {
/* const loader = document.getElementById("loader");*/
/* loader.classList.add("hidden");*/
//}, 3000);
//setTimeout(function () {
/* loader.style.display = "none";*/
//}, 3500);
document.getElementById("content").style.display = "block";
setTimeout(function () {
const loader = document.getElementById("loader");
loader.style.display = "none";
document.getElementById("content").style.opacity = 1;
}, 6000);
};
// ------------------------------------------------------------- start camera
$(document).ready(function () {
if ($(window).width() > 992) {
$('#desktopDisplay').show();
$('#mobileDisplay').hide();
$('#keypadSection').hide();
$('#mobileDisplay').html('');
$('#keypadSection').html('');
}
if ($(window).width() <= 992) {
$('#desktopDisplay').html('');
$('#desktopDisplay').hide();
$('#mobileDisplay').show();
let display = document.getElementById("display");
const run = async () => {
await Promise.all([
//api
// faceapi.nets.ssdMobilenetv1.loadFromUri(modelsUrl + 'ssd_mobilenetv1_model-weights_manifest.json'),
// faceapi.nets.faceRecognitionNet.loadFromUri(modelsUrl + 'face_recognition_model-weights_manifest.json'),
// faceapi.nets.faceLandmark68Net.loadFromUri(modelsUrl + 'face_landmark_68_model-weights_manifest.json')
//local source
faceapi.nets.ssdMobilenetv1.loadFromUri("\\weights\\"),
faceapi.nets.faceRecognitionNet.loadFromUri("\\weights\\"),
faceapi.nets.faceLandmark68Net.loadFromUri("\\weights\\")
// faceapi.nets.ssdMobilenetv1.loadFromDisk(modelPath),
// faceapi.nets.faceRecognitionNet.loadFromDisk(modelPath),
// faceapi.nets.faceLandmark68Net.loadFromDisk(modelPath)
]);
}
run();
startWebcam();
//sendPersonelCodeToGetEmployeeId(23);
// Webcam.set({
// width: 350,
// height: 350,
// image_format: 'jpeg',
// jpeg_quality: 90,
// });
// Webcam.attach('#my_camera');
// $("#detect").click(function () {
// $("#btn1").hide();
// $("#btn2").show();
// });
// $("#enter").click(function () {
// $("#btn2").hide();
// $("#btn3").show();
// $("#btn3").addClass('d-flex');
// });
// $("#leaveStartTimomente").click(function () {
// $("#btn3").hide();
// $("#btn4").show();
// });
// $("#leaveEndTime").click(function () {
// $("#btn4").hide();
// $("#btn2").show();
// });
}
// Password
$('#form').attr('autocomplete', 'off');
$('#password').attr('autocomplete', 'new-password');
$('#password').on('keypress', function (e) {
var persianLetters = /[\u0600-\u06FF]/;
if (persianLetters.test(String.fromCharCode(e.which))) {
e.preventDefault();
}
});
$('#passwordModal').on('shown.bs.modal', function () {
$('#password').focus();
});
$('#toggle-password').on('click', function () {
var passwordInput = $('#password');
var passwordFieldType = passwordInput.attr('type');
if (passwordFieldType === 'password') {
passwordInput.attr('type', 'text');
$(this).html(`
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" width="18" height="18">
<path stroke-linecap="round" stroke-linejoin="round" d="M3.98 8.223A10.477 10.477 0 0 0 1.934 12C3.226 16.338 7.244 19.5 12 19.5c.993 0 1.953-.138 2.863-.395M6.228 6.228A10.451 10.451 0 0 1 12 4.5c4.756 0 8.773 3.162 10.065 7.498a10.522 10.522 0 0 1-4.293 5.774M6.228 6.228 3 3m3.228 3.228 3.65 3.65m7.894 7.894L21 21m-3.228-3.228-3.65-3.65m0 0a3 3 0 1 0-4.243-4.243m4.242 4.242L9.88 9.88" />
</svg>
`);
} else {
passwordInput.attr('type', 'password');
$(this).html(`
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" width="18" height="18">
<path stroke-linecap="round" stroke-linejoin="round" d="M2.036 12.322a1.012 1.012 0 0 1 0-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178Z" />
<path stroke-linecap="round" stroke-linejoin="round" d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z" />
</svg>
`);
}
});
});
// let modelsUrl = "https://raw.githubusercontent.com/justadudewhohacks/face-api.js/master/weights/";
//window.onload = async () => {
// await run();
//};
/*var personIds = [];*/
var empId = -1;
/*var urls = [];*/
var stop = false;
async function startWebcam() {
await navigator.mediaDevices
.getUserMedia({
video: true,
audio: false,
})
.then((stream) => {
video.srcObject = stream;
waiting.style.display = "block";
})
.catch((error) => {
console.error(error);
});
}
function stopWebcam() {
window.location.reload();
//let stream = video.srcObject;
//let tracks = stream.getTracks();
//tracks.forEach(track => track.stop());
//video.srcObject = null;
//waiting.style.display = "none";
//$('.keypad-section').show();
//$("#display canvas").remove();
//stop = false;
}
async function firstLoad() {
const path1 = await `${urlPath}/Camera?handler=ShowPicture&index=${1}&workshopId=${11}&label=${1}`;
const path2 = await `${urlPath}/Camera?handler=ShowPicture&index=${2}&workshopId=${11}&label=${1}`;
const img1 = await faceapi.fetchImage(path1);
await faceapi.detectSingleFace(img1).withFaceLandmarks().withFaceDescriptor();
const img2 = await faceapi.fetchImage(path2);
await faceapi.detectSingleFace(img2).withFaceLandmarks().withFaceDescriptor();
}
// var getImages = document.getElementById("imageData");
async function getLabeledFaceDescriptions() {
let descriptions = [];
const path1 = await `${urlPath}/Camera?handler=ShowPicture&index=${1}&workshopId=${workshopId}&label=${empId}`;
const path2 = await `${urlPath}/Camera?handler=ShowPicture&index=${2}&workshopId=${workshopId}&label=${empId}`;
const img1 = await faceapi.fetchImage(path1);
const detections1 = await faceapi.detectSingleFace(img1).withFaceLandmarks().withFaceDescriptor();
const img2 = await faceapi.fetchImage(path2);
const detections2 = await faceapi.detectSingleFace(img2).withFaceLandmarks().withFaceDescriptor();
await descriptions.push(detections1.descriptor);
await descriptions.push(detections2.descriptor);
return new faceapi.LabeledFaceDescriptors(empId, descriptions);
}
//function getLabeledFaceDescriptions() {
// return Promise.all(
// urls.map(async (url) => {
// let startDate = new Date().getTime();
// let descriptions = [];
// url.listUrls.forEach(async function (path) {
// // var a = `\\Faces\\${workshopId}\\${label}\\${i}.jpg`;
// // var mix = `${label}${i}`;
// // let img = getImages.querySelector(".imageData[data-imageId='" + mix + "']");
// console.log(`${url.id} ${path}`)
// const img1 = await faceapi.fetchImage(path);
// /* const test = await resizeBase64Image(img);*/
// const detections = await faceapi.detectSingleFace(img).withFaceLandmarks().withFaceDescriptor();
// descriptions.push(detections.descriptor);
// });
// let endDate = new Date().getTime();
// let elapsed = (endDate - startDate) / 1000;
// console.log(`time forloop elapsed is ${elapsed}`);
// console.log(url.id);
// console.log(descriptions);
// return new faceapi.LabeledFaceDescriptors(url.id, descriptions);
// })
// );
//}
//var cacheName = [];
//var unknown = [];
var reloadActionControl = false;
// }
reloadRec.style.display = "none";
endOfRecognition = true;
reloadRec.addEventListener("click", function () {
// let oldName = document.getElementById("btnName");
// if (oldName != null) {
// oldName.remove(); // حذف نام قبلی
// }
$("#display canvas").remove();
$('#users').html('');
$('#btnOutOrIn').html('');
//$('#testDistance').html('');
endOfRecognition = false; // خاموشی پایان شناسایی
stop = false; //خاموشی استاپ شناسایی
recognizing.style.display = "block"; // نمایش آیکون درحال شناسایی
reloadActionControl = true;
reloadRec.style.display = "none"; // مخفی شدن دکمه شناسایی
notFound.style.display = "none"; // مخفی شدن دکمه شناسایی
// cacheName = []; // خالی کردن لیست شناسایی شده ها
// unknown = [];
startWebcam();
});
/*let interId;*/
video.addEventListener("play", async () => {
let startDate = new Date().getTime();
if (empId == -1) {
const labeledFaceDescriptors = await firstLoad();
} else {
const labeledFaceDescriptors = await getLabeledFaceDescriptions();
const faceMatcher = await new faceapi.FaceMatcher(labeledFaceDescriptors);
const canvas = await faceapi.createCanvasFromMedia(video);
await display.append(canvas);
const displaySize = await { width: video.width, height: video.height };
await faceapi.matchDimensions(canvas, displaySize);
var recogSuccess = await false;
let endDate = new Date().getTime();
let elapsed = (endDate - startDate) / 1000;
console.log(`time forloop elapsed is ${elapsed}`);
for (let c = 0; c < 10; c++) {
if (endOfRecognition === false) {
waiting.style.display = "none";
reloadActionControl = true;
recognizing.style.display = "block";
console.log("start recog");
const detections = await faceapi
.detectSingleFace(video)
.withFaceLandmarks()
.withFaceDescriptor();
if (typeof detections !== 'undefined') {
const resizedDetections = await faceapi.resizeResults(detections, displaySize);
await canvas.getContext("2d").clearRect(0, 0, canvas.width, canvas.height);
const results = await faceMatcher.findBestMatch(resizedDetections.descriptor);
console.log("end recog");
const box = resizedDetections.detection.box;
const drawBox = new faceapi.draw.DrawBox(box,
{
label: "آنالیز چهره",
});
await drawBox.draw(canvas);
let userId = results.label;
let userDistance = results.distance;
if (userId == empId && userDistance <= 0.45) {
endOfRecognition = true;
stop = true;
notFound.style.display = "none";
recognizing.style.display = "none";
recogSuccess = true;
await getPersonel(results.label);
}
}
}
}
if (!recogSuccess) {
notFound.style.display = "block";
recognizing.style.display = "none";
reloadActionControl = false;
//reloadRec.style.display = "block";
endOfRecognition = true;
stop = true;
}
reloadRec.style.display = "block";
$('#roloadAgain').removeClass("d-none");
}
//interId = setInterval(async () => {
//interId = setInterval(async () => {
// if (!stop) {
// waiting.style.display = "none";
// if (!reloadActionControl) {
// reloadRec.style.display = "block";
// }
// if (endOfRecognition === false) {
// waiting.style.display = "none";
// reloadActionControl = true;
// recognizing.style.display = "block";
// console.log("start recog");
// const detections = await faceapi
// .detectSingleFace(video)
// .withFaceLandmarks()
// .withFaceDescriptor();
// console.log("end recog");
// const resizedDetections = await faceapi.resizeResults(detections, displaySize);
// canvas.getContext("2d").clearRect(0, 0, canvas.width, canvas.height);
// const results = await faceMatcher.findBestMatch(resizedDetections.descriptor);
// const box = resizedDetections.detection.box;
// const drawBox = new faceapi.draw.DrawBox(box,
// {
// label: "آنالیز چهره",
// });
// drawBox.draw(canvas);
// let userId = results.label;
// let userDistance = results.distance;
// // console.log(cacheName.length);
// // 0.38
// if (userId == "unknown" && userDistance <= 0.45) {
// cacheName.push(userId);
// let res = "[ user : " + results.label + " - distance : " + userDistance + " ]";
// let testUser = `<h1 style="color:green;">${res}</h1>`;
// //$('#testDistance').append(testUser);
// } else {
// let res2 = "[ user : " + results.label + " - distance : " + userDistance + " ]";
// let testUser = `<h1 style="color:red;">${res2}</h1>`;
// // $('#testDistance').append(testUser);
// unknown.push("unknown");
// }
// // var t = $('#display').find;
// // cacheName.push(userId);
// if (cacheName.length > 0) {
// endOfRecognition = true;
// stop = true;
// recognizing.style.display = "none";
// //reloadRec.style.display = "none";
// // t.addClass('.hiddenCanvas');
// getPersonel(results.label);
// } else if (unknown.length > 10) {
// recognizing.style.display = "none";
// reloadActionControl = false;
// //reloadRec.style.display = "block";
// endOfRecognition = true;
// stop = true;
// notFound.style.display = "block";
// // t.addClass('.hiddenCanvas');
// }
// reloadRec.style.display = "block";
// $('#roloadAgain').removeClass('d-none');
// //results.forEach((result, i) => {
// // // reloadRec.style.display = "none";
// //});
// }
// }
//}, 300);
});
// Reload Click
function roloadAgain() {
$('.keypad-section').show();
$("#display canvas").remove();
$('#users').html('');
$('#btnOutOrIn').html('');
$('#inputField').val('');
$('.entered-numbers .num').text('');
//$('#testDistance').html('');
$('#notFound').hide();
recognizing.style.display = "block"; // نمایش آیکون درحال شناسایی
reloadActionControl = true;
reloadRec.style.display = "none"; // مخفی شدن دکمه شناسای
$('#roloadAgain').addClass("d-none");
}
//// AjAx to get EmployeeId with personnel code
function sendPersonelCodeToGetEmployeeId(personelCode) {
const workshopId = $('#workshopId').val();
$.ajax({
async: false,
// contentType: 'application/json',
// dataType: 'data',
type: 'GET',
url: AjaxSendPersonelCodeToGetEmployeeId,
data: { "personelCode": Number(personelCode), "workshopId": Number(workshopId) },
headers: { "RequestVerificationToken": antiForgeryToken },
success: function (response) {
if (response.isSuccess) {
//personIds = [];
//personIds.push(response.personId);
empId = response.personId;
endOfRecognition = false;
startWebcam();
/* endOfRecognition = false;*/
$('.keypad-section').hide();
/* reloadRec.click();*/
} else {
$('#errorMessage').text(response.message);
return;
}
},
failure: function (response) {
console.log(5, response);
}
});
}
function getPersonel(employeeId) {
const workshopId = $('#workshopId').val();
let users = document.getElementById("users");
let user1 = $('#users');
let btnOutOrIn = $('#btnOutOrIn')
let employeeIdNumber = Number(employeeId)
if (employeeIdNumber > 0) {
$.ajax({
async: false,
//contentType: 'application/json',
//dataType: 'data',
type: 'GET',
url: AjaxEmployeeFlag,
data: { "employeeId": employeeIdNumber, "workshopId": Number(workshopId) },
headers: { "RequestVerificationToken": antiForgeryToken },
success: function (response) {
if (response.flag > 0) {
let e = document.createElement('span');
e.innerHTML = response.employeeName;
// e.id = "btnName";
// e.className += "btn ";
// e.className += "btn-primary";
// const out = `<button type="button" id="out" class="btn btn-warning btnAction" onclick="out(${response.flag})">ثبت خروج</button>`;
const out = `<button type="button" id="out" class="btn-exit" onclick="out(${response.flag})">ثبت خروج</button>`;
user1.html('');
btnOutOrIn.html('');
users.append(e);
btnOutOrIn.append(out);
} else {
let e = document.createElement('span');
e.innerHTML = response.employeeName;
// e.id = "btnName";
// e.className += "btn ";
// e.className += "btn-primary";
// const incom = `<button type="button" id="incom" class="btn btn-info btnAction" onclick="inCom(${employeeId})">ثبت ورود</button>`;
const incom = `<button type="button" id="incom" class="btn-incom" onclick="inCom(${employeeId})">ثبت ورود</button>`;
user1.html('');
btnOutOrIn.html('');
users.appendChild(e);
btnOutOrIn.append(incom);
}
},
failure: function (response) {
console.log(5, response);
}
});
}
}
//ثبت خروج
function out(flagId) {
$.ajax({
async: false,
// contentType: 'application/json',
// dataType: 'data',
type: 'GET',
url: AjaxOut,
data: { "flagId": Number(flagId) },
headers: { "RequestVerificationToken": antiForgeryToken },
success: function (response) {
if (response.isSuccess) {
// $.Notification.autoHideNotify('success', 'top center', 'پیام سیستم ', "خروج شما ثبت شد");
$('.alert-success-msg').show();
$('.alert-success-msg p').text('خروج شما ثبت شد');
setTimeout(function () {
$('.alert-success-msg').hide();
$('.alert-success-msg p').text('');
}, 1500);
roloadAgain();
} else {
$('.alert-msg').show();
$('.alert-msg p').text('خطا در ثبت اطلاعات');
setTimeout(function () {
$('.alert-msg').hide();
$('.alert-msg p').text('');
}, 1500);
}
},
failure: function (response) {
console.log(5, response);
}
});
}
//ثبت ورود
function inCom(employeeId) {
const workshopId = $('#workshopId').val();
$.ajax({
async: false,
// contentType: 'application/json',
// dataType: 'data',
type: 'GET',
url: AjaxInCom,
data: { "employeeId": Number(employeeId), "workshopId": Number(workshopId) },
headers: { "RequestVerificationToken": antiForgeryToken },
success: function (response) {
if (response.isSuccess) {
// $.Notification.autoHideNotify('success', 'top center', 'پیام سیستم ', "ورود شما ثبت شد");
$('.alert-success-msg').show();
$('.alert-success-msg p').text('ورود شما ثبت شد');
setTimeout(function () {
$('.alert-success-msg').hide();
$('.alert-success-msg p').text('');
}, 1500);
roloadAgain();
} else {
// $.Notification.autoHideNotify('error', 'top center', 'پیام سیستم ', "خطا در ثبت اطلاعات");
$('.alert-msg').show();
$('.alert-msg p').text('خطا در ثبت اطلاعات');
setTimeout(function () {
$('.alert-msg').hide();
$('.alert-msg p').text('');
}, 1500);
}
},
failure: function (response) {
console.log(5, response);
}
});
}
// ------------------------------------------------------------- keyboard number start
$(document).ready(function () {
$('.keypad-numbers .item').click(function () {
let number = $(this).text().trim();
let currentInput = $('#inputField').val();
$('#inputField').val(currentInput + number);
$('.entered-numbers .num').text(currentInput + number);
});
$('#cleanBtn').click(function () {
$('#inputField').val('');
$('.entered-numbers .num').text('');
});
$('.backspace-icon').click(function () {
let currentInput = $('#inputField').val();
let updatedInput = currentInput.slice(0, -1);
$('#inputField').val(updatedInput);
$('.entered-numbers .num').text(updatedInput);
});
});
// ------------------------------------------------------------- keyboard number end
function enterPersonnelCode() {
var code = $('#inputField').val();
if (code === "") {
$('#errorMessage').text('کد پرسنلی خود را وارد کنید.');
} else {
$('#errorMessage').text('');
sendPersonelCodeToGetEmployeeId(code);
}
}
function openPersonnelModal() {
var goTo = `#showmodal=/Camera/Index?handler=PersonnelWorkshopAjax`;
window.location.href = goTo;
}
//setTimeout(function () {
/* loader.classList.add("hidden");*/
//}, 3000);