example/index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Penumbra Demo</title>
    <meta charset="UTF-8" />
    <link rel="stylesheet" type="text/css" href="style.css" />
  </head>

  <body>
    <div id="app">
      <h1>Penumbra: Browser Decryption Demo 2</h1>
      <a href="web-crypto.html">Compare vs. Web Crypto</a>
      <!-- <button onclick="downloadManyFiles()">Download all data</button> -->
      <p>
        Click the canvas below to test browser responsiveness.
        <a href="https://codepen.io/alexzaworski/pen/mEkvAG"
          >Source of animation: Alex Zaworski</a
        >
      </p>
      <canvas id="c"></canvas>
      <h2>The data below is downloaded and decrypted</h2>
      <table id="table">
        <tr id="headers">
          <th id="url">URL</th>
          <th id="type">Text or blob URI</th>
          <th id="mimetype">Mimetype</th>
          <th id="decryptionOptions">Encrypted</th>
          <th id="progress">Progress</th>
          <th id="size">File size</th>
          <th id="data">Result</th>
        </tr>
      </table>
    </div>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/animejs/1.0.0/anime.min.js"></script>
    <script src="jsAnimation.js"></script>
    <script src="files.js"></script>
    <script src="displayTable.js"></script>
    <script src="/dist/cjs/index.js" async defer></script>
    <script src="index.js"></script>
  </body>
</html>