Dynamic Thumbnail

dynamic_thumbnail.js

// Dynamic Thumbnail
  var fileUpload = document.getElementById("assets_");
  fileUpload.onchange = function () {
      if (typeof (FileReader) != "undefined") {
          var dvPreview = document.getElementById("dvPreview");
          dvPreview.classList.add('hide');
          dvPreview.innerHTML = "";
          if (fileUpload.files.length <= 5) {
            var regex = /^([a-zA-Z0-9\s_\\.\-:])+(.jpg|.jpeg|.gif|.png|.bmp)$/;
            for (var i = 0; i < fileUpload.files.length; i++) {
                var file = fileUpload.files[i];
                const fSize = file.size; 
                const fileKb = Math.round((fSize / 1024));

                if (fileKb >= (1024 * 5)) { 
                    alert("O tamanho máximo permitido para os arquivos é 5MB e o arquivo ["+ file.name + "] ultrapassa esse limite."); 
                    fileUpload.value = "";
                    dvPreview.classList.add('hide');
                    dvPreview.innerHTML = "";
                    return false;
                }

                if (regex.test(file.name.toLowerCase())) {
                    var reader = new FileReader();
                    reader.onload = function (e) {
                        var img = document.createElement("IMG");
                        img.src = e.target.result;
                        dvPreview.appendChild(img)
                        dvPreview.classList.remove('hide');;
                    }
                    reader.readAsDataURL(file);
                } else {
                    alert("["+ file.name + "] não é um arquivo válido. \n O nome dos arquivos NÃO deve conter acentos ou carecteres especiais.");
                    fileUpload.value = "";
                    dvPreview.classList.add('hide');
                    dvPreview.innerHTML = "";
                    return false;
                }
            }
          } else {
            alert("São permitidos no máximo 5 arquivos de imagem.");
            fileUpload.value = "";
            return false;
          }
      } else {
          console.error("Este navegador não suporta thumbnails dinâmicos.");
      }
  }
});