git.cworth.org Git - zombocom-ai/blob - index.html

   1 <!DOCTYPE html>
   2 <html>
   3
   4 <head>
   5   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
   6   <title>ZOMBO</title>
   7   <link href="/zombo.css" rel="stylesheet" type="text/css">
   8   <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
   9   <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  10   <meta name="HandheldFriendly" content="true">
  11 </head>
  12
  13 <body>
  14   <div align="center">
  15     <p>
  16       <br>
  17     </p>
  18
  19     <p>
  20       <img src="/zombocom.png" alt="Zombocom" longdesc="http://zombo.com" width="1199" height="217">
  21     </p>
  22   </div>
  23
  24   <p>
  25     Welcome to Zombocom. You can do anything at Zombcom, anything at
  26     all. The only limit is yourself!
  27   </p>
  28
  29   <p>
  30     <form action="" id="zombo-form">
  31       <div class="form-row large">
  32         <label for="prompt">
  33           What do you imagine?
  34         </label>
  35         <input id="prompt" autocomplete="off" required />
  36       </div>
  37
  38       <div class="form-row small left">
  39         <label for="code">
  40           Numeric code
  41         </label>
  42         <input id="code" autocomplete="off" placeholder="(Chosen randomly)" />
  43       </div>
  44
  45       <div class="form-row small right">
  46         <button>Safety prompt</button>
  47       </div>
  48
  49       <div class="form-row large">
  50         <button>Make the infinite possible</button>
  51       </div>
  52     </form>
  53   </p>
  54
  55   <div align="center">
  56    <div class="animate-flicker">
  57      <p>
  58        <img src="/pngwheel.png" class="rotate thefade">
  59      </p>
  60    </div>
  61   </div>
  62
  63   <audio loop="" src="/zombo_words.mp3" type="audio/mpeg"></audio>
  64   <button id="mute" class="fade volume">
  65     <div>🔊</div>
  66     <script>
  67 const mute = document.querySelector("#mute");
  68 const icon = document.querySelector("#mute > div");
  69 const audio = document.querySelector("audio");
  70
  71 mute.addEventListener("click", () => {
  72   if (audio.paused) {
  73       audio.volume = 0.2;
  74       audio.play();
  75       icon.innerHTML = "🔈";
  76   } else {
  77       audio.pause();
  78       icon.innerHTML = "🔊";
  79   }
  80   mute.classList.add("fade");
  81 });
  82     </script>
  83
  84   </button>
  85 </body>
  86 </html>