<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta
      http-equiv="Content-Security-Policy"
      content="default-src 'self'; 
             style-src 'self' https://fonts.googleapis.com; 
             font-src 'self' https://fonts.gstatic.com;"
    />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta name="description" content="DataScanner: Easily and securely scan datasets locally. Search through multiple .xlsx, .xlsm, and .csv files for exact matches, all offline to ensure privacy." />
    <meta name="keywords" content="DataScanner, scan datasets, .xlsx, .xlsm, .csv, data privacy, data security, cryptodata, crypto, cryptocurrency, big data" />
    <link rel="stylesheet" href="styles.css" />
    <script src="xlsx.full.min.js" defer></script>
    <script src="app.js" defer></script>
    <title>DataScanner: Scan Datasets Locally and Securely</title>
  </head>
  <body>
    <div class="container">
      <header>
        <h1 id="mainTitle">DataScanner</h1>
        <h2 id="subTitle">Scan Datasets Locally and Securely</h2>
      </header>
      <main>
        <p id="toolInfo">
          Easily search through multiple .xlsx, .xlsm, and .csv files on your
          device. Enter values (names, numbers, emails, cryptodata, etc.), and
          DataScanner will meticulously scan each file and sheet for exact
          matches—all the magic happens offline to keep your data private. Once
          completed, a detailed report of the matches is generated and downloaded.
          <br /><br />
          Fast, secure, and efficient—DataScanner is perfect for uncovering
          insights across large datasets!
        </p>

        <div class="file-upload-wrapper">
          <label for="fileInput" class="custom-file-upload">Select Files</label>
          <span class="file-name">No file selected</span>
          <input type="file" id="fileInput" multiple accept=".xlsx,.xlsm,.csv" />
        </div>

        <label for="searchValues"
          >Enter Search Values (semicolon-separated, case-insensitive):</label
        >
        <input
          type="text"
          autocomplete="off"
          id="searchValues"
          placeholder="e.g.: john; 1,500.25; email@mail.com; 0.9455102; BTC; qp3wjpa..."
          aria-label="Enter search values"
        />

        <button id="startSearch">Search</button>

        <div id="progress" role="status" aria-live="polite">
          <span id="progressMessage">0%</span>
          <div id="progressBar"><div></div></div>
        </div>
      </main>
      <footer>
        &copy; <span id="year"></span> DefectedCode (defectedcode@gmail.com)
        <p id="prohibition">For personal use only. Redistribution strictly prohibited.</p>
      </footer>
    </div>
  </body>
</html>
