Advertisement
MizunoBrasil

Código para renomear arquivos no formato aaaa-mm-dd-hh-mm-ss (HTML, Javascript e CSS)

Dec 20th, 2023
912
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6.     <title>Upload de Arquivo</title>
  7.     <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;700&display=swap">
  8.     <style>
  9.         body {
  10.             font-family: 'Poppins', sans-serif;
  11.             background-color: #f0f0f0;
  12.             display: flex;
  13.             align-items: center;
  14.             justify-content: center;
  15.             height: 100vh;
  16.             margin: 0;
  17.         }
  18.  
  19.         .container {
  20.             text-align: center;
  21.             color: #333;
  22.         }
  23.  
  24.         form {
  25.             background-color: #ffffff;
  26.             padding: 20px;
  27.             border-radius: 8px;
  28.             box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  29.             display: flex;
  30.             flex-direction: column;
  31.             align-items: center;
  32.             margin-top: 20px;
  33.         }
  34.  
  35.         input, button {
  36.             margin-bottom: 10px;
  37.             padding: 10px;
  38.             width: 100%;
  39.             box-sizing: border-box;
  40.         }
  41.  
  42.         button {
  43.             cursor: pointer;
  44.             background-color: #4caf50;
  45.             color: white;
  46.             border: none;
  47.             border-radius: 4px;
  48.             transition: background-color 0.3s;
  49.         }
  50.  
  51.         button:hover {
  52.             background-color: #45a049;
  53.         }
  54.     </style>
  55. </head>
  56. <body>
  57.     <form id="uploadForm">
  58.         <label for="fileInput"><h2>Renomear Arquivo</h2></label>
  59.         <p>o nome do arquivo será no formato <b>aaaa-mm-dd-hh-mm-ss</b></p>
  60.         <input type="file" id="fileInput" accept="image/*" required>
  61.  
  62.         <button type="button" onclick="uploadFile()">Enviar</button>
  63.     </form>
  64.  
  65.     <script>
  66.         function uploadFile() {
  67.             var fileInput = document.getElementById('fileInput');
  68.             var file = fileInput.files[0];
  69.  
  70.             if (file) {
  71.                 var currentDate = new Date();
  72.                 var uniqueFileName = currentDate.getFullYear() + '-' +
  73.                                      pad(currentDate.getMonth() + 1) + '-' +
  74.                                      pad(currentDate.getDate()) + '-' +
  75.                                      pad(currentDate.getHours()) + '-' +
  76.                                      pad(currentDate.getMinutes()) + '-' +
  77.                                      pad(currentDate.getSeconds());
  78.  
  79.                 var fileExtension = file.name.split('.').pop();
  80.                 var newFileName = uniqueFileName + "." + fileExtension;
  81.  
  82.                 var blob = new Blob([file], { type: file.type });
  83.  
  84.                 var link = document.createElement('a');
  85.                 link.href = window.URL.createObjectURL(blob);
  86.                 link.download = newFileName;
  87.  
  88.                 document.body.appendChild(link);
  89.                 link.click();
  90.  
  91.                 document.body.removeChild(link);
  92.             } else {
  93.                 alert("Por favor, selecione um arquivo.");
  94.             }
  95.         }
  96.  
  97.         function pad(number) {
  98.             return (number < 10 ? '0' : '') + number;
  99.         }
  100.     </script>
  101. </body>
  102. </html>
  103.  
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement