View Code - 20260722

face-punch.js | 20260722_120325.php Initial Domain Snapshot

// face-punch.js
document.addEventListener('DOMContentLoaded', async function(){
  await loadFaceApiModels();
  const video = document.getElementById('fc-video');
  const captureBtn = document.getElementById('fc-capture-btn');
  const resultBox = document.getElementById('fc-punch-result');
  let stream = null;

async function startCamera(){
    if(stream) return;
    try {
      stream = await navigator.mediaDevices.getUserMedia({video:{facingMode:'user'}, audio:false});
      video.srcObject = stream;
    } catch(e){ alert('Camera error'); console.error(e); }
  }
  startCamera();

captureBtn.addEventListener('click', async ()=>{
    // capture canvas
    const canvas = document.createElement('canvas');
    canvas.width = video.videoWidth || 640;
    canvas.height = video.videoHeight || 480;
    canvas.getContext('2d').drawImage(video,0,0,canvas.width,canvas.height);
    const blob = await new Promise(res=> canvas.toBlob(res,'image/jpeg',0.85));
    const descriptor = await getDescriptorFromImageBlob(blob);
    if(!descriptor){ resultBox.textContent='No face detected. Try again.'; resultBox.className='notice notice-error'; return; }

// Send descriptor and optional image base64 (optional)
    const reader = new FileReader();
    reader.onload = async function(){
      const dataUrl = reader.result; // data:image/jpeg;base64,...
      try {
        const body = { descriptor, photo: dataUrl };
        const res = await fetch('/erp/api/attendance/recognize_embedding.php', {
          method:'POST',
          headers:{'Content-Type':'application/json'},
          credentials:'same-origin',
          body: JSON.stringify(body)
        });
        const j = await res.json();
        if(j && j.ok){
          resultBox.textContent = `Matched: ${j.employee_name || j.employee_id} (score: ${j.score}) — Punch recorded`;
          resultBox.className='notice notice-success';
        } else {
          resultBox.textContent = 'No match: ' + (j.error || j.msg || 'Try again');
          resultBox.className='notice notice-error';
        }
      } catch(e){ console.error(e); resultBox.textContent='Network error'; resultBox.className='notice notice-error'; }
    };
    reader.readAsDataURL(blob);
  });
});