DoubleVee
/
kingsrp-samp


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348
							<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Dashboard - Server</title>
    <link rel="shortcut icon" href="/logo.gif" type="image/gif" />
    <link
      href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta3/dist/css/bootstrap.min.css"
      rel="stylesheet"
      integrity="sha384-eOJMYsd53ii+scO/bJGFsiCZc+5NDVN2yr8+0RDqr0Ql0h+rP48ckxlpbzKgwra6"
      crossorigin="anonymous"
    />
    <link
      rel="stylesheet"
      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.min.css"
    />
    <link
      rel="stylesheet"
      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/fontawesome.min.css"
    />
  </head>
  <body>
    <section class="main">
      <!--Main Navigation-->
      <header>
        <!-- Sidebar -->
        <nav id="sidebarMenu" class="collapse d-lg-block sidebar collapse">
          <div class="position-sticky">
            <div class="list-group list-group-flush mx-3 mt-4">
              <a
                href="/dashboard"
                class="list-group-item list-group-item-action py-2 ripple"
                aria-current="true"
              >
                <i class="fas fa-tachometer-alt fa-fw me-3"></i
                ><span>Main dashboard</span>
              </a>
              <a
                href="/servers"
                class="list-group-item list-group-item-action py-2 ripple"
              >
                <i class="fas fa-server fa-fw me-3"></i
                ><span>Manage Servers</span>
              </a>
              <a
                href="/logout"
                class="list-group-item list-group-item-action py-2 ripple"
              >
                <i class="fas fa-sign-out-alt fa-fw me-3"></i
                ><span>Logout</span>
              </a>
            </div>
          </div>
        </nav>
        <!-- Sidebar -->

        <!-- Navbar -->
        <nav
          id="main-navbar"
          class="navbar navbar-expand-lg navbar-light fixed-top"
        >
          <!-- Container wrapper -->
          <div class="container-fluid">
            <!-- Toggle button -->
            <button
              class="navbar-toggler"
              type="button"
              data-mdb-toggle="collapse"
              data-mdb-target="#sidebarMenu"
              aria-controls="sidebarMenu"
              aria-expanded="false"
              aria-label="Toggle navigation"
              onclick="function re(){ let r = $('#sidebarMenu'); if(r.hasClass('collapse'))r.removeClass('collapse');else r.addClass('collapse')}re()"
            >
              <i class="fas fa-bars"></i>
            </button>

            <!-- Brand -->
            <a class="navbar-brand text-white" href="/">
              <img src="/logo.gif" height="40" alt="" loading="lazy" />
              Dashboard - Manage Server
            </a>
            <div>
              <h1 class="server-name"></h1>
            </div>
          </div>
        </nav>
        <!-- Navbar -->
      </header>
      <!--Main Navigation-->

      <!--Main layout-->
      <main style="margin-top: 58px">
        <div class="container pt-4">
          <!--Section: Manage Server -->
          <section>
            <h1>Manage server</h1>
            <div class="row">
              <div class="col-xl-3 col-sm-6 col-12 mb-4">
                <div class="card">
                  <div class="card-body">
                    <div class="d-flex justify-content-between px-md-1">
                      <div>
                        <h3 class="text-danger" id="songInQueue">0</h3>
                        <p class="mb-0">Song in queue</p>
                      </div>
                      <div class="align-self-center">
                        <i class="fas fa-music text-danger fa-3x"></i>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
              <div class="col-xl-3 col-sm-6 col-12 mb-4">
                <div class="card">
                  <div class="card-body">
                    <div class="d-flex justify-content-between px-md-1">
                      <div>
                        <h3 class="text-success" id="songLoop"></h3>
                        <p class="mb-0">Song Loop</p>
                      </div>
                      <div class="align-self-center">
                        <i class="fas fa-redo text-success fa-3x"></i>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
              <div class="col-xl-3 col-sm-6 col-12 mb-4">
                <div class="card">
                  <div class="card-body">
                    <div class="d-flex justify-content-between px-md-1">
                      <div>
                        <h3 class="text-warning" id="queueLoop"></h3>
                        <p class="mb-0">Queue Loop</p>
                      </div>
                      <div class="align-self-center">
                        <i class="fas fa-sync text-warning fa-3x"></i>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
              <div class="col-xl-3 col-sm-6 col-12 mb-4">
                <div class="card">
                  <div class="card-body">
                    <div class="d-flex justify-content-between px-md-1">
                      <div>
                        <h3 class="text-info" id="prefix">&gt;</h3>
                        <p class="mb-0">Prefix</p>
                      </div>
                      <div class="align-self-center">
                        <i class="fas fa-robot text-info fa-3x"></i>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>

            <div class="container text-center" id="song-info">
              <h1>Song info</h1>
              <p>Now playing: <span id="now-playing"></span></p>
              <br />
              <p>Duration</p>
              <p id="duration"></p>
            </div>
          </section>
          <!-- Footer -->
          <div class="footer">
            <div class="container">
              <div class="row">
                <div class="col-md-12">
                  <div class="copyright-text">
                    <p>
                      © 2021
                      <a href="//github.com/SudhanPlayz/Discord-MusicBot"
                        >Discord Music Bot</a
                      >. All rights reserved. Made by
                      <a href="//github.com/SudhanPlayz">Sudhan</a> and its
                      <a
                        href="//github.com/SudhanPlayz/Discord-MusicBot/graphs/contributors"
                        >contributers</a
                      >
                    </p>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <!-- End Footer -->
        </div>
      </main>
      <!--Main layout-->
    </section>
    <script
      src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta3/dist/js/bootstrap.bundle.min.js"
      integrity="sha384-JEW9xMcG8R+pH31jmWH6WWP0WintQrMb4s7ZOdauHnUtxwoG2vI5DkLtS3qm9Ekf"
      crossorigin="anonymous"
    ></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script src="https://cdn.socket.io/4.0.1/socket.io.min.js"></script>
  </body>
  <style>
    body {
      background: var(--bs-gray-dark);
      color: #fff;
      overflow-x: hidden;
    }

    .card {
      color: black;
    }

    @media (min-width: 991.98px) {
      main {
        padding-left: 240px;
      }
    }

    /* Sidebar */
    .sidebar {
      position: fixed;
      top: 0;
      bottom: 0;
      left: 0;
      padding: 58px 0 0; /* Height of navbar */
      box-shadow: 0 2px 5px 0 rgb(0 0 0 / 5%), 0 2px 10px 0 rgb(0 0 0 / 5%);
      width: 240px;
      z-index: 600;
    }

    @media (max-width: 991.98px) {
      .sidebar {
        width: 100%;
      }
    }
    .sidebar .active {
      border-radius: 5px;
      box-shadow: 0 2px 5px 0 rgb(0 0 0 / 16%), 0 2px 10px 0 rgb(0 0 0 / 12%);
    }

    .sidebar-sticky {
      position: relative;
      top: 0;
      height: calc(100vh - 48px);
      padding-top: 0.5rem;
      overflow-x: hidden;
      overflow-y: auto;
    }

    #song-info span {
      color: #5867dd;
      text-decoration: none;
      cursor: pointer;
    }

    #song-info span:hover {
      color: #34bfa3;
    }

    .footer {
      position: fixed;
      bottom: 0;
      background: #192027;
      text-align: center;
      padding: 32px 0;
      width: 85%;
      overflow: hidden;
    }

    .footer p {
      margin: 0;
      line-height: 26px;
      font-size: 15px;
      color: #999;
    }

    .footer p a {
      color: #5867dd;
      text-decoration: none;
    }

    .footer p a:hover {
      color: #34bfa3;
    }

    ::-webkit-scrollbar {
      width: 15px;
    }

    ::-webkit-scrollbar-track {
      background: #192027;
    }

    ::-webkit-scrollbar-thumb {
      background: #5867dd;
      border-radius: 20px;
    }

    ::-webkit-scrollbar-thumb:hover {
      background: #414ca1;
    }
  </style>
  <script>
    $(document).ready(() => {
      $.get("/api/user", (data) => {
        let Guild = data.user.guilds.find(
          (x) => x.id == window.location.pathname.split("/")[2]
        );
        if (!Guild.inGuild) {
          $.get("/api/info", (data) => {
            window.location = `https://discord.com/oauth2/authorize?client_id=${
              data.ClientID
            }&permissions=${data.Permissions}&scope=bot%20${data.Scopes.join(
              "%20"
            )}&redirect_uri=${data.Website}${
              data.CallbackURL
            }&response_type=code`;
          });
        }
        $(".server-name").text(Guild.name);
      });

      var socket = io();
      socket.emit("server", window.location.pathname.split("/")[2]);

      socket.on("server", (data) => {
        $("#songLoop").text(data.songsLoop);
        $("#queueLoop").text(data.queueLoop);
        $("#prefix").text(data.prefix);
        $("#now-playing").text(
          data.nowPlaying ? data.nowPlaying.title : "Nothing playing"
        );
        if (data.position)
          $("#duration").html(
            `${data.position}<span> ${data.bar} </span>${data.maxDuration}`
          );
        else
          $("#duration").html(
            `<span> Nothing is playing right now, Add some songs in discord? </span>`
          );
      });
    });
  </script>
</html>