<!DOCTYPE html>
<html>
<head>
  <title>passORD</title>
  <style>
    body {
    background-color: black;
    color: white;
    font-family: sans-serif;
    }
    button {
    background-color: orange;
    border: none;
    color: white;
    padding: 5px;
    width: 100px;
    }
  </style>
</head>
<body>
  <center>
  <form>
    passORD:
    <input type="password" id="password" required><br><br>
    <button type="button" id="decryptBtn">Show content</button><br><br>
    <span id="errormessage"></span><br>
    <label for="result">Cleartext:</label><br>
    <textarea id="result" rows="6" cols="60" readonly></textarea>
  </form>

  <script>
    document.getElementById('decryptBtn').addEventListener('click', async () => {

      const base64Ciphertext = "PyEuN0/e0DWw3t4woG89Txffr97adFcmSnlchgaB0pySiKNNKkY3zhA16RtPPLPe9DjNoOkOmIYMJ9z91r35rIb0Y7pn5OnH8rCHD5AJqupIemnTK47sFjN547RLcBy/aR+o/4wnE4iaBiz1hnnshvzYagVvTEpMliVDm7DM36x1d1om77jKjR3pzdd66lUw1FZ07cCjScqryauEhF0TG65jXoVDZy9avWipZU77mJtZa6wRsY50ZiTsQeSb/2Eh";
      const password = document.getElementById('password').value;

      try {
        const passwordBuffer = new TextEncoder().encode(password);
        const passwordKey = await window.crypto.subtle.importKey('raw', passwordBuffer, 'PBKDF2', false, ['deriveBits']);
        const saltedCiphertext = base64ToArrayBuffer(base64Ciphertext);
        const salt = saltedCiphertext.slice(0, 16);
        const iv = saltedCiphertext.slice(16, 28);
        const ciphertext = saltedCiphertext.slice(28);

        const aesKey = await window.crypto.subtle.deriveBits(
          { name: 'PBKDF2', salt, iterations: 600000, hash: 'SHA-256' },
          passwordKey, 256
        );
        const key = await window.crypto.subtle.importKey('raw', aesKey, 'AES-GCM', false, ['decrypt']);

        const decryptedData = await window.crypto.subtle.decrypt({ name: 'AES-GCM', iv }, key, ciphertext);

        const resultTextarea = document.getElementById('result');
        resultTextarea.value = new TextDecoder().decode(decryptedData);
      } catch (error) {
        errormessage.textContent = "Error in decryption, please check the password"
        errormessage.style.color = "red"
        console.error(error);
      }
    });

    function base64ToArrayBuffer(base64) {
      const binaryString = window.atob(base64);
      const bytes = new Uint8Array(binaryString.length);
      for (let i = 0; i < binaryString.length; i++) {
        bytes[i] = binaryString.charCodeAt(i);
      }
      return bytes.buffer;
    }
  </script>
  </center>
</body>
</html>