Extrator de cloud

<!DOCTYPE html>
<html>
<head>
<title>Extrator de Dados</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
  body {
    background-color: #121212;
    color: #eee;
    font-family: 'Courier New', Courier, monospace;
    margin: 0;
    padding: 20px;
  }
  h2 {
    color: #8a2be2;
    text-align: center;
    font-size: 1.8em;
    margin-bottom: 20px;
  }
  label {
    display: block;
    margin-bottom: 5px;
    color: #d4d4d4;
    font-size: 1em;
  }
  input[type="text"], input[type="file"] {
    background-color: #252525;
    color: #eee;
    border: 2px solid #8a2be2;
    padding: 10px;
    margin-bottom: 15px;
    width: calc(100% - 24px);
    transition: border-color 0.3s;
    font-size: 1em;
  }
  input[type="text"]:focus, input[type="file"]:focus {
    outline: none;
    border-color: #c084ff;
  }
  button {
    background-color: #8a2be2;
    color: #eee;
    border: none;
    padding: 10px 20px;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s;
    font-size: 1em;
    width: 100%;
  }
  button:hover {
    background-color: #c084ff;
  }
  #output {
    margin-top: 20px;
    border: 1px solid #8a2be2;
    padding: 10px;
    background-color: #1e1e1e;
    color: #d4d4d4;
    white-space: pre-wrap;
    font-size: 0.9em;
  }
  #progressBar {
    width: 0%;
    height: 10px;
    background-color: #8a2be2;
    margin-top: 10px;
    border-radius: 5px;
  }
</style>
</head>
<body>

<h2>Extrator de Dados</h2>
<label for="keyword">Palavra-chave:</label>
<input type="text" id="keyword" name="keyword">
<input type="file" id="fileInput">
<button onclick="extractLinks()">Extrair Dados</button>
<div id="progressBar"></div>
<div id="output"></div>

<script>
function extractLinks() {
  const fileInput = document.getElementById('fileInput');
  const keyword = document.getElementById('keyword').value;
  const output = document.getElementById('output');
  const progressBar = document.getElementById('progressBar');
  output.innerHTML = '';
  progressBar.style.width = '0%';

  if (fileInput.files.length > 0) {
    const file = fileInput.files[0];
    const reader = new FileReader();
    const chunkSize = 1024 * 1024 * 50;
    const extractedData = [];
    let offset = 0;

    reader.onload = function(e) {
      const chunk = e.target.result;
      const lines = chunk.split('\n');

      for (const line of lines) {
        if (line.includes(keyword)) {
          extractedData.push(line);
        }
      }

      offset += chunkSize;
      progressBar.style.width = (offset / file.size * 100) + '%';

      if (offset < file.size) {
        readNextChunk();
      } else {
        const now = new Date();
        const year = now.getFullYear();
        const month = (now.getMonth() + 1).toString().padStart(2, '0');
        const day = now.getDate().toString().padStart(2, '0');
        const hours = now.getHours().toString().padStart(2, '0');
        const minutes = now.getMinutes().toString().padStart(2, '0');
        const seconds = now.getSeconds().toString().padStart(2, '0');
        const formattedDate = `${year}-${month}-${day}_${hours}-${minutes}-${seconds}`;
        const blob = new Blob([extractedData.join('\n')], { type: 'text/plain' });
        const url = window.URL.createObjectURL(blob);
        const a = document.createElement('a');
        a.href = url;
        a.download = `${keyword}_${formattedDate}.txt`;
        a.click();
        window.URL.revokeObjectURL(url);
      }
    };

    function readNextChunk() {
      const blob = file.slice(offset, offset + chunkSize);
      reader.readAsText(blob);
    }

    readNextChunk();
  } else {
    output.textContent = 'Por favor, selecione um arquivo.';
  }
}
</script>

</body>
</html>