<!DOCTYPE html>
<html lang="id">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">

  <title>Konfigurasi Server</title>


  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">


  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" integrity="sha512-dyZtD5JQ8fXk6ePgxhcG6ItHqu1S+flkX0dP/8zv8S9R7mQECtIlb2KGsMvbJYqFhaGMJ7hAwKnN3+JJFsBv7w==" crossorigin="anonymous" referrerpolicy="no-referrer" />


  <link rel="stylesheet" href="/styles.css">
</head>
<body>

  <div class="starfield"></div>


  <div class="overlay"></div>

  
  <nav class="navbar navbar-expand-lg navbar-dark bg-transparent">
    <div class="container-fluid">
      <a class="navbar-brand" href="#">
        <i class="fas fa-rocket"></i> Server Config
      </a>
      <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" 
              aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
      </button>
    </div>
  </nav>

  
  <div class="container mt-5">
    <div class="row justify-content-center">
      <div class="col-md-8">
        <% if (typeof successMsg !== 'undefined' && successMsg.length > 0) { %>
          <div class="alert alert-success alert-dismissible fade show" role="alert">
            <i class="fas fa-check-circle"></i> <%= successMsg %>
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
          </div>
        <% } %>

        <% if (typeof errorMsg !== 'undefined' && errorMsg.length > 0) { %>
          <div class="alert alert-danger alert-dismissible fade show" role="alert">
            <i class="fas fa-exclamation-triangle"></i> <%= errorMsg %>
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
          </div>
        <% } %>

        <div class="card bg-dark text-white shadow">
          <div class="card-header bg-secondary">
            <h4 class="mb-0"><i class="fas fa-cogs"></i> Konfigurasi Server</h4>
          </div>
          <div class="card-body">
            <form action="/config" method="POST" novalidate>
              <div class="mb-3">
                <label for="ip" class="form-label"><i class="fas fa-network-wired"></i> IP Server</label>
                <input type="text" class="form-control bg-dark text-white" id="ip" name="ip" value="<%= config.ip %>" required>
                <div class="invalid-feedback">
                  Silakan masukkan IP server.
                </div>
              </div>

              <div class="mb-3">
                <label for="port" class="form-label"><i class="fas fa-server"></i> Port</label>
                <input type="number" class="form-control bg-dark text-white" id="port" name="port" value="<%= config.port %>" required>
                <div class="invalid-feedback">
                  Silakan masukkan port.
                </div>
              </div>

              <div class="mb-3">
                <label for="loginurl" class="form-label"><i class="fas fa-sign-in-alt"></i> Login URL</label>
                <input type="url" class="form-control bg-dark text-white" id="loginurl" name="loginurl" value="<%= config.loginurl %>" required>
                <div class="invalid-feedback">
                  Silakan masukkan Login URL yang valid.
                </div>
              </div>

              <div class="mb-3">
                <label for="cdn" class="form-label"><i class="fas fa-cloud"></i> CDN Path</label>
                <input type="text" class="form-control bg-dark text-white" id="cdn" name="cdn" value="<%= config.cdn %>" required>
                <div class="invalid-feedback">
                  Silakan masukkan CDN Path.
                </div>
              </div>

              <div class="mb-3">
                <label for="username" class="form-label"><i class="fas fa-cloud"></i> Username (ADMIN LOGIN)</label>
                <input type="text" class="form-control bg-dark text-white" id="username" name="username" value="<%= config.username %>" required>
                <div class="invalid-feedback">
                  Silakan masukkan Username untuk mengganti username.
                </div>
              </div>

              <div class="mb-3">
                <label for="password" class="form-label"><i class="fas fa-cloud"></i> Password (ADMIN LOGIN)</label>
                <input type="text" class="form-control bg-dark text-white" id="password" name="password" value="<%= config.password %>" required>
                <div class="invalid-feedback">
                  Silakan masukkan Password untuk mengganti password.
                </div>
              </div>

              <button type="submit" class="btn btn-primary"><i class="fas fa-save"></i> Simpan Konfigurasi</button>
              <button type="button" class="btn btn-warning" id="restartButton"><i class="fas fa-sync-alt"></i> Restart HTTP</button>
              <button type="button" class="btn btn-warning" id="shutdownButton"><i class="fas fa-sync-alt"></i> Shutdown HTTP</button>
              <script>
                document.getElementById('restartButton').addEventListener('click', function () {
                  if (confirm('Are you sure you want to restart the server? This will temporarily disconnect all users.')) {
                    fetch('/restart', {
                      method: 'POST',
                    })
                    .then(response => response.json())
                    .then(data => alert(data.message))
                    .catch(error => console.error('Error:', error));
                  }
                });

                document.getElementById('shutdownButton').addEventListener('click', function () {
                  if (confirm('Are you sure you want to shutdown the server?')) {
                    fetch('/shutdown', {
                      method: 'POST',
                    })
                    .then(response => response.json())
                    .then(data => alert(data.message))
                    .catch(error => console.error('Error:', error));
                  }
                });
              </script>
            </form>
          </div>
        </div>
      </div>
    </div>
  </div>
<script src="/starfield.js"></script>

  
  <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.6/dist/umd/popper.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.min.js"></script>
  <script>
    
    (function () {
      'use strict';
      var forms = document.querySelectorAll('.needs-validation');
      Array.prototype.slice.call(forms).forEach(function (form) {
        form.addEventListener('submit', function (event) {
          if (!form.checkValidity()) {
            event.preventDefault();
            event.stopPropagation();
          }
          form.classList.add('was-validated');
        }, false);
      });
    })();
  </script>
</body>
</html>


can you add server logs (show the cmd console.log to the dashboard)