Saltar a contenido

Ajustes varios

Lista incidencias

Cambiar la URL para cargar la foto y agregar una imagen de respaldo (fallback)

<img width="200px" src="${serverURL}/photo.php?foto=${data[i].foto}" 
onerror="this.onerror=null; this.src='./img/no-image.jpeg';"
/>

Formulario

Generer un nombre para el archivo de imagen

function generarNombreArchivo() {
  const nombreAleatorio = Date.now() + '-' + Math.floor(Math.random() * 10000); 
  return `${nombreAleatorio}`;
}

Obtener imagen en base64 y obtener el tipo de imagen

function getBase64Image(img_capt) {
  var canvas = document.createElement("canvas");
  canvas.width = img_capt.naturalWidth;
  canvas.height = img_capt.naturalHeight;
  var ctx = canvas.getContext("2d");
  ctx.drawImage(img_capt, 0, 0);
  var dataURL = canvas.toDataURL("image/png");
  return dataURL;
}

function obtenerExtensionBase64(base64) {
  const match = base64.match(/^data:image\/(png|jpeg|jpg|gif|webp|bmp);base64,/);
  return match ? match[1] : null; // Retorna la extensión o null si no coincide
}

Actualizar la funcion de subir fichero y subir la foto al servidor

function saveMarker() {
  const name = $('#nom').val(); 
  const desc = $('#descrip').val(); 
  const lat = $('#text-latitud').val(); 
  const lng = $('#text-longitud').val();
  const imge = getBase64Image(document.getElementById('fimg'));
  const ext = obtenerExtensionBase64(imge);
  const fotoName = generarNombreArchivo();
  $.ajax({
      type: 'POST',
      url: `${serverURL}/incidencia.php`,
      data: {
          x: lng, 
          y: lat,
          descripcio: desc,
          nombre: name,
          foto: `${fotoName}.${ext}`
      },
      success: function(){
        subirFoto(imge, fotoName)
      }
  });
}

function subirFoto(foto, name) {
  const fd = new FormData();
  fd.append('foto',foto);
  fd.append('name',name);
  $.ajax({
    type: 'POST',
    url: `${serverURL}/upload-photo.php`,
    data: fd,
    contentType: false,
    mimeType: "multipart/form-data",
    processData: false,
    success: function(){
      console.log('file uploaded');
      location.href = "list.html";
    }
  });
}