Try to make mosre code (Copy 14765)

✨ นายภัทรชัย เทิบจันทึก

<html>
  <head>
    <style>
      body{
        background-color: hsla(0,0%,0%,.8);
        text-align:center;
        margin:0;
      }
      .work{
        margin-top:2px;
        position:absolute;
        display:flex;
		  border:1px black solid;
        border-radius:2%;
	   }
      .work0{
		  background: linear-gradient(to right, hsla(1,0%,30%,1) , hsla(1,0%,80%,1));
        border-radius:2%;
      }
      h1{
		  font-size:3rem;
      }
      .h1{
        margin-left:2px;
        margin-right:2px;
		  background: linear-gradient(to right, hsla(1,0%,80%,1) , hsla(1,0%,30%,1));
      }
      p{
		  font-size:20px;
      }
      .p{
        margin-top:2px;
        margin-bottom:2px;
		  background: linear-gradient(to right, hsla(1,0%,80%,1) , hsla(1,0%,30%,1));
      }
      .image{
		  height:750px;
        width:1000px;
      }
      img{
		  height:100%;
        width:100%;
        border-radius:2%;
      }
      button{
        height: 30px;
        color: hsla(1,100%,0%,1);
        background: hsla(0,0%,80%,1);
      }
    </style>
  </head>
  <body>
    <div class="work">
      <div class="image"><img src="https://cdn.discordapp.com/attachments/934357529033596938/947070347973386281/stock-vector-international-morse-code-vector-384392266.png" alt="morse code">
      </div>
      <div class="work0">
        <div class="h1"><h1>International Morse Code</h1></div>
        <button onclick="play([0,1,0,1,0,0,1,1,0,1,0,0,1,1,0,0,1,0,0,1,0,1,1,0,1,0], 25)">
          Inter</button>
        <button onclick="play([0,1,1,0,1,0,0,1,0,1,1,0,0,1,1,0,0,1,0,1,0,0,1,1,0,1,1,0,1,1,0,0,1,1,0,1,0,0,1,0,1,1,0,0,1,0,1,1,0,1,0,1,0], 52)">
          national</button>
        <button onclick="play([0,1,1,0,1,1,0, 0,1,1,0,1,1,0,1,1,0, 0,1,0,1,1,0,1,0, 0,1,0,1,0,1,0, 0,1,0], 34)">
          Morse</button>
		  <button onclick="play([0,1,1,0,1,0,1,1,0,1,0, 0,1,1,0,1,1,0,1,1,0, 0,1,1,0,1,0,1,0, 0,1,0], 31)">Code</button>
          <br><br>
        <button onclick="play([0,1, 0,1,1, 0], 5)">
          A</button>
        <button onclick="play([0,1,1, 0,1, 0,1, 0,1, 0], 9)">
          B</button>
        <button onclick="play([0,1,1, 0,1, 0,1,1, 0,1, 0], 10)">
          C</button>
        <button onclick="play([0,1,1, 0,1, 0,1, 0], 7)">
          D</button>
        <button onclick="play([0,1, 0], 2)">
          E</button>
        <button onclick="play([0,1, 0,1, 0,1,1, 0,1, 0], 9)">
          F</button>
        <button onclick="play([0,1,1, 0,1,1, 0,1, 0], 8)">
          G</button>
        <button onclick="play([0,1, 0,1, 0,1, 0,1, 0], 8)">
          H</button>
        <br><br>
        <button onclick="play([0,1, 0,1, 0], 4)">
          I</button>
        <button onclick="play([0,1, 0,1,1, 0,1,1, 0,1,1, 0], 11)">
          J</button>
        <button onclick="play([0,1,1, 0,1, 0,1,1, 0], 8)">
          K</button>
        <button onclick="play([0,1, 0,1,1, 0,1, 0,1, 0], 9)">
          L</button>
        <button onclick="play([0,1,1, 0,1,1, 0], 6)">
          M</button>
        <button onclick="play([0,1,1, 0,1, 0], 5)">
          N</button>
        <button onclick="play([0,1,1, 0,1,1, 0,1,1, 0], 9)">
          O</button>
        <button onclick="play([0,1, 0,1,1, 0,1,1, 0,1, 0], 10)">
          P</button>
        <br><br>
        <button onclick="play([0,1,1, 0,1,1, 0,1, 0], 8)">
          Q</button>
        <button onclick="play([0,1, 0,1,1, 0,1, 0], 7)">
          R</button>
        <button onclick="play([0,1, 0,1, 0,1, 0], 6)">
          S</button>
        <button onclick="play([0,1,1, 0], 3)">
          T</button>
        <button onclick="play([0,1, 0,1, 0,1,1, 0], 7)">
          U</button>
        <button onclick="play([0,1, 0,1, 0,1, 0,1,1, 0], 9)">
          V</button>
        <button onclick="play([0,1, 0,1,1, 0,1,1, 0], 8)">
          W</button>
        <button onclick="play([0,1,1, 0,1, 0,1, 0,1,1, 0], 10)">
          X</button>
        <br><br>
        <button onclick="play([0,1,1, 0,1, 0,1,1, 0,1,1, 0], 11)">
          Y</button>
        <button onclick="play([0,1,1, 0,1,1, 0,1, 0,1, 0], 10)">
          Z</button>
		  <br><br>
        <br><br>
        <button onclick="play([0,1, 0,1,1, 0,1,1, 0,1,1, 0,1,1, 0], 14)">
          1</button>
        <button onclick="play([0,1, 0,1, 0,1,1, 0,1,1, 0,1,1, 0], 13)">
          2</button>
        <button onclick="play([0,1, 0,1, 0,1, 0,1,1, 0,1,1, 0], 12)">
          3</button>
        <button onclick="play([0,1, 0,1, 0,1, 0,1, 0,1,1, 0], 11)">
          4</button>
        <button onclick="play([0,1, 0,1, 0,1, 0,1, 0,1, 0], 10)">
          5</button>
        <br><br>
        <button onclick="play([0,1,1, 0,1, 0,1, 0,1, 0,1, 0], 11)">
          6</button>
        <button onclick="play([0,1,1, 0,1,1, 0,1, 0,1, 0,1, 0], 12)">
          7</button>
        <button onclick="play([0,1,1, 0,1,1, 0,1,1, 0,1, 0,1, 0], 13)">
          8</button>
        <button onclick="play([0,1,1, 0,1,1, 0,1,1, 0,1,1, 0,1, 0], 14)">
          9</button>
        <button onclick="play([0,1,1, 0,1,1, 0,1,1, 0,1,1, 0,1,1, 0], 15)">
          0</button>
        <br><br>
        <button onclick="play([0,1, 0,1,1, 0,1, 0,1,1, 0,1, 0,1,1, 0], 15)">
          .</button>
        <button onclick="play([0,1,1, 0,1,1, 0,1, 0,1, 0,1,1, 0,1,1, 0], 16)">
          ,</button>
        <button onclick="play([0,1,1, 0,1, 0,1,1, 0,1, 0,1,1, 0,1,1, 0], 16)">
          !</button>
        <button onclick="play([0,1, 0,1, 0,1,1, 0,1,1, 0,1, 0,1, 0], 14)">
          ?</button>
        <button onclick="play([0,1,1, 0,1, 0,1, 0,1,1, 0,1, 0], 12)">
          /</button>
        <button onclick="play([0,1,1, 0,1, 0,1, 0,1, 0,1,1, 0], 12)">
          =</button>

<button onclick="play([0,1, 0,1, 0,1, 0,1,1, 0,1,1, 0,1,1, 0,1, 0,1, 0,1, 0], 24)">
          SOS</button>
        <br><br><br>
        <button onclick="play([0,1,1,0,0,1,0,1,0,1,0,1,0,0,1,0,1,0,0,1,0,1,0,1,0,0,0,0,1,0,1,0,0,1,0,1,0,1,0],38)">
          I</button>
        <button 
        onclick="play([0,1,1,0,1,1,0,0,1,1,0,1,0,1,1,0,1,1,0,0,0,0,1,1,0,1,0,1,0,1,0,0,1,0,0,1,0,1,0,1,0,0,1,1,0], 44)">
          II</button>
        <button 
        onclick="play([0,1,0,1,0,1,0,1,0,0,1,1,0,1,1,0,1,1,0,0,1,1,0,1,1,0,0,1,0,0,1,0,1,1,0,1,1,0, 0,1,1,0,1,1,0,1,1,0,0,1,0,1,1,0,1,0,0,1,1,0,1,0,1,1,0], 64)">
          III</button>
        <button 
        onclick="play([0,1,0,1,0,1,1,0,1,0,0,1,0,1,1,0,1,0,0,1,1,0,1,1,0,1,1,0,0,1,1,0,1,1,0,0,0,0,1,0,1,1,0,0,1,0,1,1,0,1,0,1,0,0,1,0,1,1,0,1,0,1,0,0,1,0,1,1,0,1,0,1,1,0,1,0,1,1,0], 78)">
          IV</button>
        <button 
        onclick="play([0,1,0,1,1,0,1,1,0,1,1,0,1,1,0,0,1,1,0,1,1,0,1,1,0,1,1,0,1,1,0,0,1,1,0,1,1,0,1,1,0,1,1,0,1,1,0,0,1,1,0,1,0,1,0,1,1,0,1,0,0,1,0,1,1,0,1,1,0,1,1,0,1,1,0,0,1,1,0,1,1,0,1,1,0,1,1,0,1,1,0,0,1,1,0,1,1,0,1,1,0,1,1,0,1,1,0,0,1,1,0,1,0,1,1,0,1,0,1,1,0,1,1,0,0,1,0,1,0,1,1,0,1,1,0,1,0,1,0], 138)">
          V</button>
        <br><br>
        <div class="p"><p>Try to translate this. If you free.</p></div>
        <br>
      </div>
    </div>
    
    <script>
      audio = new (window.AudioContext || window.webkitAudioContext)()
      function play(value, time){
          console.log(value)
          console.log(time)
          let sound_osci = audio.createOscillator()
          let sound_gain = audio.createGain()
          sound_osci.connect(sound_gain)
          sound_gain.connect(audio.destination)
          sound_osci.start()
          sound_gain.gain.setValueCurveAtTime(value,audio.currentTime,(time/11))
      }
     
    </script>
  </body>
</html>