123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286 |
- <!doctype html>
- <html lang="en">
- <head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width, initial-scale=1">
- <title>ranked lobbies for osu!</title>
- <link rel="stylesheet" href="/styles.min.css?v=4">
- <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
- <link rel="icon" type="image/png" sizes="96x96" href="/favicon-96x96.png">
- <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
- <script defer src="/base.js?v=2" type="module"></script>
- <script defer src="/extra.js?v=4" type="module"></script>
- </head>
- <body class="bg-zinc-800">
- <header class="h-16 bg-zinc-900">
- <nav class="flex max-w-5xl m-auto p-1">
- <div>
- <a class="opacity-75 hover:opacity-100" href="/faq/">
- <img class="p-1 h-14" src="/images/o!RL-logo.png" />
- </a>
- </div>
- <div class="flex-auto self-center text-center">
- <a class="p-1 opacity-75 hover:opacity-100" href="/lobbies/">
- <span class="text-2xl">Lobbies</span>
- </a>
- <i class="border opacity-75 ml-1 mr-2"> </i>
- <a class="p-1 opacity-75 hover:opacity-100" href="/leaderboard/">
- <span class="text-2xl">Leaderboard</span>
- </a>
- </div>
- <div class="max-sm:absolute max-sm:top-16 max-sm:right-2 flex self-center">
- <a class="p-2 opacity-75 hover:opacity-100" href="https://kiwec.net/discord">
- <img class="h-8" src="/images/discord.png" />
- </a>
- <div class="relative">
- <button id="toggle-rulesets-dropdown-btn" class="p-2 opacity-75 hover:opacity-100">
- <img class="h-8" src="/images/mode-osu.png" />
- </button>
- <div id="rulesets-dropdown" class="absolute hidden z-10 mt-4 -ml-12 bg-zinc-700 rounded-md">
- <button class="choose-ruleset flex p-2 w-36 opacity-75 hover:opacity-100 hover:bg-zinc-900" data-ruleset="osu">
- <img class="h-8" src="/images/mode-osu.png" />
- <span class="px-2 leading-7">osu!</span>
- </button>
- <button class="choose-ruleset flex p-2 w-36 opacity-75 hover:opacity-100 hover:bg-zinc-900" data-ruleset="taiko">
- <img class="h-8" src="/images/mode-taiko.png" />
- <span class="px-2 leading-7">osu!taiko</span>
- </button>
- <button class="choose-ruleset flex p-2 w-36 opacity-75 hover:opacity-100 hover:bg-zinc-900" data-ruleset="catch">
- <img class="h-8" src="/images/mode-catch.png" />
- <span class="px-2 leading-7">osu!catch</span>
- </button>
- <button class="choose-ruleset flex p-2 w-36 opacity-75 hover:opacity-100 hover:bg-zinc-900" data-ruleset="mania">
- <img class="h-8" src="/images/mode-mania.png" />
- <span class="px-2 leading-7">osu!mania</span>
- </button>
- </div>
- </div>
- <a class="login-btn p-2 opacity-75 hover:opacity-100" href="/me/">
- <img class="h-8 rounded-full" src="/images/login.png" />
- </a>
- </div>
- </nav>
- </header>
- <main class="p-8 max-sm:pt-16">
- <div class="loading-placeholder text-center mt-24">
- <p>Loading...</p>
- <svg class="animate-spin m-auto my-4 h-10 w-10 text-orange-400" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
- <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
- <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
- </svg>
- </div>
- </main>
- <template id="lobbies-template">
- <div class="max-w-5xl m-auto">
- <div class="lobby-creation-banner border-2 border-orange-600 rounded-lg p-3 text-center mx-2 mb-2">
- <span class="pl-2 pr-4">Not satisfied?</span><button class="go-to-create-lobby default-btn">Create your own!</button>
- </div>
- <div class="open-lobby-list flex flex-wrap"></div>
- <h3 class="mt-4">Recently closed lobbies</h3>
- <div class="closed-lobby-list flex flex-wrap"></div>
- </div>
- </template>
- <template id="command-list-template">
- <div class="command-list">
- <ul>
- <li>
- !info or !discord - Display some information for new players.
- </li>
- <li>
- !start - Count down 30 seconds then start the map. Useful when some players are AFK or forget to ready up. Anybody can use this command.
- </li>
- <li>
- !wait - Cancel !start. Use it when you're not done downloading.
- </li>
- <li>
- !skip - Skip current map. You must have played 5 games in the lobby to unlock the command.
- </li>
- <li>
- !abort - Vote to abort the match. At least 1/4 of the lobby must vote to abort for a match to get aborted.
- </li>
- <li>
- !kick (player) - Vote to kick a player. You should probably use the in-game ignoring and reporting features instead.
- </li>
- <li>
- !rank (player) - Display your rank or the rank of another player.
- </li>
- <li>
- !close - Close the lobby. Only the lobby creator can use this command.
- </li>
- </ul>
- </div>
- </template>
- <template id="manual-lobby-creation-template">
- <div class="max-w-5xl m-auto">
- <p>Unfortunately, the bot couldn't create the lobby automatically. This happens when there are too many bot-created lobbies.</p>
- <p>But don't worry, you can still create it yourself! Just follow these steps:</p>
- <ul class="mb-2">
- <li>Create a lobby in osu!</li>
- <li>In the #multiplayer chat, send <strong>!mp addref botkiwec</strong></li>
- <li>BanchoBot should have sent a match history link. Copy the URL and paste it here.</li>
- </ul>
- <input class="mt-1 p-1.5 w-96 text-sm" type="text" name="tournament-url" placeholder="https://osu.ppy.sh/community/matches/123456789">
- <button class="create-lobby-with-ref-btn default-btn m-1 py-1">Create lobby</button>
- </div>
- </template>
- <template id="lobby-created-template">
- <div class="max-w-5xl m-auto">
- <h3 class="mt-4">Lobby created successfully!</h3>
- <div class="open-lobby-list flex flex-wrap mt-4">
- <div class="lobby"></div>
- </div>
- <div class="info mt-4"></div>
- </div>
- </template>
- <template id="lobby-creation-template">
- <div class="max-w-5xl m-auto">
- <h1 class="mb-6 font-bold">New lobby</h1>
- <div class="lobby-settings">
- <div class="title-settings">
- <div class="flex mt-2 cursor-pointer select-none">
- <div class="collapser"></div>
- <h3 class="underline">Title</h3>
- </div>
- <div class="hidden mb-4">
- <p>You can use <span class="mono">$min_xxx</span>, <span class="mono">$avg_xxx</span>, <span class="mono">$max_xxx</span> for <span class="mono">elo</span>, <span class="mono">pp</span> and <span class="mono">stars</span> to set the lobby title automatically.</p>
- <input class="mt-1 mb-1 p-1 w-72 text-sm" type="text" name="title" value="$min_stars-$max_stars* | o!RL (!info)">
- <p>Preview: <span class="mono preview">0-11* | o!RL (!info)</span></p>
- </div>
- </div>
- <div class="flex mt-2 cursor-pointer select-none">
- <div class="collapser"></div>
- <h3 class="underline">Map selection</h3>
- </div>
- <div class="hidden mb-4">
- <div class="radio-area flex border-2 border-orange-600 hover:bg-zinc-700 rounded-md m-1 max-w-xl cursor-pointer">
- <div class="radio flex align-center justify-center p-1.5 bg-orange-600"><input type="radio" name="map-selection-type" value="random"></div>
- <div class="info py-2 px-3 leading-5">
- <span class="font-bold">Random</span>
- <p>Pick any map that matches the given filters.</p>
- </div>
- </div>
- <div class="radio-area flex border-2 border-orange-600 hover:bg-zinc-700 rounded-md m-1 max-w-xl cursor-pointer">
- <div class="radio flex align-center justify-center p-1.5 bg-orange-600"><input type="radio" name="map-selection-type" value="pp" checked></div>
- <div class="info py-2 px-3 leading-5">
- <span class="font-bold">Performance Points</span>
- <p>Pick maps close to the lobby players's pp.</p>
- </div>
- </div>
- </div>
- <div class="flex mt-2 cursor-pointer select-none">
- <div class="collapser"></div>
- <h3 class="underline">Map pool</h3>
- </div>
- <div class="hidden mb-4">
- <div class="radio-area flex border-2 border-orange-600 hover:bg-zinc-700 rounded-md m-1 max-w-xl cursor-pointer">
- <div class="radio flex align-center justify-center p-1.5 bg-orange-600"><input type="radio" name="map-pool" value="leaderboarded" checked></div>
- <div class="info py-2 px-3 leading-5">
- <span class="font-bold">All maps with a leaderboard</span>
- <p>F2 gaming.</p>
- </div>
- </div>
- <div class="radio-area flex border-2 border-orange-600 hover:bg-zinc-700 rounded-md m-1 max-w-xl cursor-pointer">
- <div class="radio flex align-center justify-center p-1.5 bg-orange-600"><input type="radio" name="map-pool" value="collection"></div>
- <div class="info py-2 px-3 leading-5">
- <span class="font-bold">Custom <a href="https://osucollector.com/" target="_blank">osu!collector</a> collection</span>
- <input class="mt-1 p-1 w-72 text-sm" type="text" name="collection-url" placeholder="https://osucollector.com/collections/44">
- </div>
- </div>
- </div>
- <div class="mod-settings">
- <div class="flex mt-2 cursor-pointer select-none">
- <div class="collapser"></div>
- <h3 class="underline">Mods</h3>
- </div>
- <div class="hidden mb-4">
- <div>
- <div class="mod-btn nm">
- <img class="h-8" src="/images/[email protected]" title="None" alt="None" />
- <div>NM</div>
- </div>
- <div class="mod-btn ez">
- <img class="h-8" src="/images/[email protected]" title="Easy" alt="Easy" />
- <div>EZ</div>
- </div>
- <div class="mod-btn ht">
- <img class="h-8" src="/images/[email protected]" title="Half Time" alt="Half Time" />
- <div>HT</div>
- </div>
- <div class="mod-btn mr hidden">
- <img class="h-8" src="/images/[email protected]" title="Mirror" alt="Mirror" />
- <div>MR</div>
- </div>
- <div class="mod-btn co hidden">
- <img class="h-8" src="/images/[email protected]" title="Co-op" alt="Co-op" />
- <div>CO</div>
- </div>
- </div>
- <div>
- <div class="mod-btn">
- <img class="h-8" src="/images/[email protected]" title="Hidden" alt="Hidden" />
- <div>HD</div>
- </div>
- <div class="mod-btn hr">
- <img class="h-8" src="/images/[email protected]" title="Hard Rock" alt="Hard Rock" />
- <div>HR</div>
- </div>
- <div class="mod-btn dt">
- <img class="h-8" src="/images/[email protected]" title="Double Time" alt="Double Time" />
- <div>DT</div>
- </div>
- <div class="mod-btn nc hidden">
- <img class="h-8" src="/images/[email protected]" title="Nightcore" alt="Nightcore" />
- <div>NC</div>
- </div>
- <div class="mod-btn fi hidden">
- <img class="h-8" src="/images/[email protected]" title="Fade In" alt="Fade In" />
- <div>FI</div>
- </div>
- <div class="mod-btn">
- <img class="h-8" src="/images/[email protected]" title="Flashlight" alt="Flashlight" />
- <div>FL</div>
- </div>
- <div class="mod-btn">
- <img class="h-8" src="/images/[email protected]" title="Sudden Death" alt="Sudden Death" />
- <div>SD</div>
- </div>
- </div>
- <div class="mb-4">
- Enabling "NM" stops players from being able to pick the mods they want.
- </div>
- </div>
- </div>
- <div class="flex mt-2 cursor-pointer select-none">
- <div class="collapser"></div>
- <h3 class="underline">Filters</h3>
- </div>
- <div class="hidden mb-4">
- <div class="flex flex-wrap filter-list">
- </div>
- </div>
- <div class="mania-keycount-settings"></div>
- <button class="create-lobby-btn default-btn mt-8">Create lobby</button>
- </div>
- </div>
- </template>
- <footer class="p-4 text-center m-auto">o!rl is a hobby project and is not affiliated with <a href="https://osu.ppy.sh/" target="_blank">osu!</a>.</footer>
- </body>
- </html>
|