Impostor/index.html

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Impostor | Among Us Private Server</title>

        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css" integrity="sha384-xOolHFLEh07PJGoPkLv1IbcEPTNtaed2xpHsD9ESMhqIYd0nLMwNLD69Npy4HI+N" crossorigin="anonymous">
        <link rel="stylesheet" href="style.css">
    </head>

    <body class="row flex-column justify-content-center align-items-center p-0 m-0">
        <div class="container text-light d-flex flex-column justify-content-center p-4 p-md-3" style="flex: 1;">
            <section class="container mb-4">
                <div class="row justify-content-center">
                    <h1 class="site-title text-center">Impostor</h1>
                </div>
                <div class="row justify-content-center">
                    <h2 class="site-subtitle text-center">Among Us Private Server</h2>
                </div>
            </section>

            <section class="container">
                <div class="mb-4 mb-md-3">
                    <h3 class="text-center mb-4 mb-md-3 w-100">Connect to a Server</h3>
                </div>
                <form id="serverFileForm" class="container p-0" onsubmit="return false;">
                    <div class="form-row justify-content-center mb-4 mx-md-5">
                        <select name="serverProtocol" id="protocol" class="col custom-select text-light" style="height: unset;" onchange="onProtocolChange()">
                            <option value="http" selected>http://</option>
                            <option value="https">https://</option>
                        </select>
                        <input class="col-6 col-md-8 mx-1 mx-md-2 form-control form-control-lg bg-transparent text-light text-center"
                               type="text" placeholder="Server address" id="address" name="address" required>
                        <input class="col form-control form-control-lg bg-transparent text-light" style="max-width: 110px"
                               type="number" placeholder="Port" id="port" name="port" min="1" max="65535" required>
                    </div>

                    <div class="row justify-content-center mb-4">
                        <div class="row justify-content-center flex-nowrap">
                            <input class="form-control form-control-lg bg-transparent text-light text-center mr-2"
                                   type="text" placeholder="Server name" id="name" name="name">
                        </div>
                    </div>
                    <div class="row justify-content-center">
                        <button class="col-md-4 btn btn-primary btn-lg support-text desktop-support" onclick="downloadAsync()">Download server file</button>
                        <button class="col-md-4 btn btn-primary btn-lg support-text android-support ios-support" onclick="openApp()">Open in Among Us</button>
                        <button class="col-md-4 offset-md-1 mt-1 mt-md-0 btn btn-secondary btn-lg" onclick="setLocationHash()">Create sharable link</button>
                    </div>
                </form>
                <div class="mt-4">
                    <h3>
                        Instructions
                        <i id="desktop" class="platform fab fa-windows" onclick="setPlatform('desktop');"></i>
                        <i id="android" class="platform fab fa-android" onclick="setPlatform('android');"></i>
                        <i id="ios" class="platform fab fa-apple" onclick="setPlatform('ios');"></i>
                    </h3>

                    <div class="support-text desktop-support">
                        To play on a private server follow the following steps:
                        <ol>
                            <li>Type the server IP and download click the button "Download server file".</li>
                            <li>Make sure that the file is named <code>regionInfo.json</code> and doesn't have additional numbers (e.g. <code>regionInfo (1).json</code>) because you downloaded it multiple times.</li>
                            <li>
                                Press <kbd class="key"><i class="fab fa-windows"></i></kbd> + <kbd class="key">R</kbd> on your keyboard and paste the following:<br/>
                                <div class="text-center my-2">
                                    <code>%APPDATA%\..\LocalLow\Innersloth\Among Us</code>
                                </div>
                            </li>
                            <li>Press <span class="key">Enter</span> or click "OK".</li>
                            <li>Copy the downloaded file and paste it in the opened folder.</li>
                            <li>You can now play on your server by opening Among Us and clicking "Online".</li>
                        </ol>
                        To switch back to the original servers, change the region in the bottom right corner.<br/>
                    </div>

                    <div class="support-text android-support ios-support">
                        <p class="text-justify text-sm-center text-md-left">
                            To play on a private server, fill in the form, then click "Open in Among Us". You can then switch to your server using the Region Selection menu in the bottom right corner.<br/>
                            You may get a confirmation prompt from your browser to confirm that you want to open Among Us, which you should accept.
                            If the region doesn't show up, keep the game running in the background and click the button again.
                            Note for server admins: to support mobile phones, you need to support connecting over HTTPS
                        </p>
                    </div>
                </div>
            </section>

        </div>

        <footer class="container text-light text-center">
            <p>To create a server, see the instructions in <a href="https://github.com/Impostor/Impostor">Github</a> project page.</p>
            <p>Having issues? Ask for help on <a href="https://discord.gg/Mk3w6Tb">our Discord server</a> and try to fix your problem.</p>
        </footer>

        <script src="https://kit.fontawesome.com/1a00236538.js" crossorigin="anonymous"></script>
        <script src="script.js"></script>
    </body>
</html>