<!DOCTYPE html>
<html>
    <head>
        <script>
            const sleep = (milliseconds) => {
                 return new Promise(resolve => setTimeout(resolve, milliseconds*1000))
                }
            const start = async() => {
                p1 = document.getElementById('snakeAnimation');
                p2 = document.getElementById('snakeAnimation2');
                var sleepDelay = 1;
                while(true) {
                    p1.innerHTML = "⬛⬛⬛⬜⬜⬛⬛⬛⬜⬜⬛";
                    p2.innerHTML = p1.innerHTML;
                    await sleep(sleepDelay);
                    p1.innerHTML = "⬜⬛⬛⬛⬜⬜⬛⬛⬛⬜⬜";
                    p2.innerHTML = p1.innerHTML;
                    await sleep(sleepDelay);
                    p1.innerHTML = "⬜⬜⬛⬛⬛⬜⬜⬛⬛⬛⬜";
                    p2.innerHTML = p1.innerHTML;
                    await sleep(sleepDelay);
                    p1.innerHTML = "⬛⬜⬜⬛⬛⬛⬜⬜⬛⬛⬛";
                    p2.innerHTML = p1.innerHTML;
                    await sleep(sleepDelay);
                    p1.innerHTML = "⬛⬛⬜⬜⬛⬛⬛⬜⬜⬛⬛";
                    p2.innerHTML = p1.innerHTML;
                    await sleep(sleepDelay);
                 }
            }
        </script>
        <style>
            *{
                padding: 0;
                margin: 0;
                font-family: "Segoe UI",Arial,sans-serif;
            }
          p {
          	width: 80vw;
          	padding: 5px;
          }
          h3 {
          	transform: translateX(50px);
          }
          .offcenter {
          	transform: translateX(-175px);
          }
          #grad {
                height: 60vh;
                background-image: linear-gradient(#239023,#32cd32);
            }
            .snakeAnimationWindow {
                width: 100vw;
                position: relative;
                transform: translateY(-40px);
            }
            .mainWindow {
                width: 100vw;
                position: relative;
                text-align: left;
                text-shadow: #239023;
                font-weight: bold;
                font-family: "Segoe UI",Arial,sans-serif;
                transform: translateY(-50px);
            }
            #snakeAnimation2,
            #snakeAnimation {
                font-size: 7vw;
                color: darkgreen;
          		transform: translateX(-10px);
            }
            .line{
                width: 100vw;
                height: 0px;
                border-bottom: 3px solid black;
                position: absolute;
            }
            #SnakeTitle {
                font-size: 8vw;
            }
          #page {
          	background-color: #32cd32 !important;
          }
        </style>
    </head>
    <body id = "grad" onload="start();">
      <div id="page">
        <div class="snakeAnimationWindow">
            <p id="snakeAnimation">⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜</p>
        </div>
        <div class="mainWindow">
            <h1 id="SnakeTitle">Snake Discord Bot</h1>
            <div class="line"></div>
            <h3 style="font-size: 5vw;">What Is Snake Bot?</h3>
            <p style="font-size: 2vw;">Snake Bot is a discord bot that allows a user to play a game of snake within the discord messenger service using reactions.</p>
            <div class="line"></div>
            <h3 style="font-size: 5vw;">How Is the Game Played?</h3>
            <p style="font-size: 2vw; padding: 0px;">
               Upon adding the Snake Bot to your server, it's commands will be completely functional. To begin a game, use the command s/start and you will be presented with a grid like this<br>
                <div class="offcenter">
                <center>
                <br>
                ⬛⬛⬛⬛⬛⬛⬛⬛⬛⬛<br>
                ⬛⬛⬛⬛⬛⬛⬛⬛⬛⬛<br>
                ⬛⬛⬛⬛⬛&#127822;⬛⬛⬛⬛<br>
                ⬛⬛⬛⬛⬛⬛⬛⬛⬛⬛<br>
                ⬛⬛⬛⬛⬛⬛⬛⬛⬛⬛<br>
                ⬛⬛⬛⬛⬛⬛⬛⬛⬛⬛<br>
                ⬛⬛⬛⬛⬛⬛⬛⬛⬛⬛<br>
                ⬛⬛⬛⬛⬛⬛⬛⬛⬛⬛<br>
                ⬜⬛⬛⬛⬛⬛⬛⬛⬛⬛<br>
                ⬛⬛⬛⬛⬛⬛⬛⬛⬛⬛<br>
                <br>
                Once the grid is displayed, the bot will begin adding the following Reactions to the message<br>
                ⬅ LEFT<br>
                ⬆ UP<br>
                ⬇ DOWN<br>
                ➡ RIGHT<br>
                <br>
                  </center>
                            </div>
                During the game you can click on the direction that is appropriate to the direction you want to go in
                <br>If you're still confused you can use the s/help command for more specific information
            </p>
            <div class="line"></div>
            <h3 style="font-size: 5vw; width: 80vw;">How Do I Add SnakeBot To My Server?</h3>
            <p style="font-size: 2vw; padding: 0px;">You can use the command s/invite in a server that Snake Bot is in or you can follow the link <br><center><a class="offcenter" href="https://discordapp.com/oauth2/authorize?client_id=556266236472983562&scope=bot&permissions=1073835200">Invite Snake Bot</a></center></p>
        </div>
        <div class="snakeAnimationWindow">
             <p id="snakeAnimation2">⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜</p>
        </div>
      </div>
    </body>
</html>

Snake

Snake allows for an intuitive and fun Discord experience utilising reactions to allow for a user to play a game of snake

Snake 투표

저희를 지원하고 싶으십니까?