File "FOR-S-CCI-27.js"

Full Path: C:/wamp64/www/CALIDADWEB/CALIDADWEB/FRONTED/INPUTS/FOR-S-CCI-27.js
File size: 3.43 KB
MIME-type: text/plain
Charset: utf-8

//---------- funcion para la firma en el formulario auditoria proceso----//-------------------------------------------------
document.addEventListener("DOMContentLoaded", () => {
  const canvas = document.getElementById("firmaAuditoria");
  const ctx = canvas.getContext("2d");
  const clearBtn = document.getElementById("clearBtnAuditoria");
  const base64Input = document.getElementById("base64Auditoria");
  const enviarBtn = document.getElementById("controlEnviar"); // Botón que realmente hace submit

  let drawing = false;
  let lastPos = { x: 0, y: 0 };

  // Estilos del pincel
  ctx.lineWidth = 2;
  ctx.lineCap = "round";
  ctx.strokeStyle = "black";

  // Obtener posición del mouse
  function getMousePos(e) {
    const rect = canvas.getBoundingClientRect();
    return {
      x: e.clientX - rect.left,
      y: e.clientY - rect.top,
    };
  }

  // Obtener posición táctil
  function getTouchPos(e) {
    const rect = canvas.getBoundingClientRect();
    return {
      x: e.touches[0].clientX - rect.left,
      y: e.touches[0].clientY - rect.top,
    };
  }

  // Empezar a dibujar
  canvas.addEventListener("mousedown", (e) => {
    drawing = true;
    lastPos = getMousePos(e);
  });

  canvas.addEventListener(
    "touchstart",
    (e) => {
      e.preventDefault();
      drawing = true;
      lastPos = getTouchPos(e);
    },
    { passive: false },
  );

  // Dejar de dibujar
  canvas.addEventListener("mouseup", () => {
    drawing = false;
  });

  canvas.addEventListener(
    "touchend",
    (e) => {
      e.preventDefault();
      drawing = false;
    },
    { passive: false },
  );

  // Dibujar mientras se mueve
  canvas.addEventListener("mousemove", (e) => {
    if (drawing) {
      const mousePos = getMousePos(e);
      drawLine(lastPos, mousePos);
      lastPos = mousePos;
    }
  });

  canvas.addEventListener(
    "touchmove",
    (e) => {
      e.preventDefault();
      if (drawing) {
        const touchPos = getTouchPos(e);
        drawLine(lastPos, touchPos);
        lastPos = touchPos;
      }
    },
    { passive: false },
  );

  // Función para dibujar línea
  function drawLine(from, to) {
    ctx.beginPath();
    ctx.moveTo(from.x, from.y);
    ctx.lineTo(to.x, to.y);
    ctx.stroke();
  }

  // Limpiar firma
  clearBtn.addEventListener("click", () => {
    ctx.clearRect(0, 0, canvas.width, canvas.height);
    base64Input.value = "";
  });

  // Guardar firma cuando se hace clic en el botón de envío
  enviarBtn?.addEventListener("click", () => {
    /* if (isCanvasBlank(canvas)) {
       alert("Por favor, firme en el campo de firma.");
       return;
     }
 */
    const base64Image = canvas.toDataURL();
    base64Input.value = base64Image;
    // console.log("📌 Firma guardada:", base64Image);
  });

  // Validar si el canvas está vacío
  function isCanvasBlank(c) {
    const blank = document.createElement("canvas");
    blank.width = c.width;
    blank.height = c.height;
    return c.toDataURL() === blank.toDataURL();
  }
});

// funcion para el sweet alert
document.addEventListener('DOMContentLoaded', function () {

  if (typeof window.swalData !== 'undefined') {

    Swal.fire({
        title: window.swalData.title,
        text: window.swalData.text,
        icon: window.swalData.icon,
        confirmButtonText: 'Aceptar',
        confirmButtonColor: '#3085d6'
    });

  }

});