<?php session_start();?>
<?php include "koneksi.php";?>
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <link rel="apple-touch-icon" sizes="76x76" href="assets/img/apple-icon.png">
  <link rel="icon" href="assets/img/logo.png">
  <title>
    My-Kacil
  </title>
  <!--     Fonts and icons     -->
  <link rel="manifest" href="manifest.json">
  <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700" rel="stylesheet" />
  <!-- Nucleo Icons -->
  <link href="assets/css/nucleo-icons.css" rel="stylesheet" />
  <link href="assets/css/nucleo-svg.css" rel="stylesheet" />
  <!-- Font Awesome Icons -->
  <script src="https://kit.fontawesome.com/42d5adcbca.js" crossorigin="anonymous"></script>
  <link href="assets/css/nucleo-svg.css" rel="stylesheet" />
  <!-- CSS Files -->
  <link id="pagestyle" href="assets/css/argon-dashboard.css?v=2.0.4" rel="stylesheet" />
  <style>
    .hide {
      display: none;
    }
    .show {
      display: none;
    }
  </style>
</head>

<body class="">
  <main class="main-content  mt-0">
    <section>
      <div class="page-header min-vh-100">
        <div class="container">
          <div class="row">
            <div class="col-xl-12 col-lg-12 col-md-12 d-flex flex-column mx-lg-0 mx-auto">

              <!-- Form Login -->
              <div class="card mx-auto" id="form-login" style="min-width: 300px; max-width: 600px;">
                <div class="card-header pb-0 text-start">
                  <h4 class="font-weight-bolder">Sign In to GKJW App 🥺</h4>
                  <p class="mb-0">Simplifying Every Transaction</p>
                </div>
                <div class="card-body">
                  <form  method="post">
                    <div class="mb-3">
                      <input type="text" name="username" class="form-control form-control-lg" placeholder="Username" aria-label="Username">
                    </div>
                    <div class="mb-3">
                      <input type="password" name="password" class="form-control form-control-lg" placeholder="Password" aria-label="Password">
                    </div>
                    <!-- <span onclick="changeForm('register')">Don't have account ?</span> -->
                    <div class="text-center">
                      <button type="submit" name="login" class="btn btn-lg btn-danger btn-lg w-100 mt-4 mb-0">Sign in</button>
                    </div>
                  </form>
                  <?php 
                    if (isset($_POST['login'])) {
                        $username =htmlspecialchars($_POST['username']);
                        $password =htmlspecialchars($_POST['password']);
                    
                        $sql = "SELECT * FROM user WHERE username = '$username' LIMIT 1";
                        $result = $con->query($sql);
                    
                        if ($result->num_rows == 1) {
                            $row = $result->fetch_assoc();
                            if ($password == $row['password']) {
                                $_SESSION['admin'] = $row;
                                echo  "
                                  <script>
                                    alert('Berhasil Login');
                                    document.location.href='index.php';
                                  </script>
                                ";
                                header("Location: index.php"); // Redirect to dashboard or any other page
                            } else {
                                $error = "Invalid password";
                                echo "
                                  <script>
                                    alert('Password Salah');
                                    document.location.href='login.php';
                                  </script>
                                ";
                            }
                        } else {
                            $error = "Invalid username";
                            echo "
                            <script>
                              alert('Username Salah');
                              document.location.href='login.php';
                            </script>
                          ";
                        }
                    }
                  ?>
                </div>
              </div>

              <!-- Form Register -->
              <div class="card mx-auto hide" id="form-regis" style="min-width: 300px; max-width: 600px;">
                <div class="card-header pb-0 text-start">
                  <h4 class="font-weight-bolder">Sign-Up In to My-Kacil 🥺</h4>
                  <p class="mb-0">Simplifying Every Transaction</p>
                </div>
                <div class="card-body">
                  <form  method="post">
                    <div class="mb-3">
                      <input type="text" name="email" class="form-control form-control-lg" placeholder="Email" aria-label="Username">
                    </div>
                    <div class="mb-3">
                      <input type="text" name="phone" class="form-control form-control-lg" placeholder="Phone Number" aria-label="Username">
                    </div>
                    <div class="mb-3">
                      <input type="text" name="business" class="form-control form-control-lg" placeholder="Business Name" aria-label="Username">
                    </div>
                    <div class="mb-3">
                      <input type="text" name="username" class="form-control form-control-lg" placeholder="Username" aria-label="Username">
                    </div>
                    <div class="mb-3">
                      <input type="password" name="password" class="form-control form-control-lg" placeholder="Password" aria-label="Password">
                    </div>
                    <span onclick="changeForm('login')">Have account ?</span>
                    <div class="text-center">
                      <button name="register" class="btn btn-lg btn-danger btn-lg w-100 mt-4 mb-0">Sign up</button>
                    </div>
                  </form>
                  <?php 
                    if (isset($_POST['register'])) {
                        $email = htmlspecialchars($_POST['email']);
                        $phone = htmlspecialchars($_POST['phone']);
                        $business = htmlspecialchars($_POST['business']);
                        $username = htmlspecialchars($_POST['username']);
                        $password = htmlspecialchars($_POST['password']);
                        $id = substr(str_shuffle(str_repeat($characters, ceil($length / strlen($characters)))), 0, $length).date('ymdhis');

                        $cekEmail = $con->query("SELECT * FROM user WHERE email = '$email'");
                        if($cekEmail->num_rows <=  0){
                          $con->query("INSERT INTO user (id, email, phone, business, username, password) VALUES ('$id', '$email', '$phone', '$business', '$username', '$password')");
                          echo "
                            <script>
                              alert('Register Successfully');
                              document.location.href='login.php';
                            </script>
                          ";
                        }else{
                          echo "
                            <script>
                              alert('Email in Useds');
                            </script>
                          ";
                        }
                    }
                  ?>
                </div>
              </div>

            </div>
          </div>
        </div>
      </div>
    </section>
  </main>
  <script>
    function changeForm(form) {
      var logForm =document.getElementById('form-login');
      var regForm =document.getElementById('form-regis');
      if(form == 'register'){
        logForm.classList.add('hide');
        regForm.classList.remove('hide');
      }else{
        logForm.classList.remove('hide');
        regForm.classList.add('hide');
      }
    }
  </script>
  <!--   Core JS Files   -->
  <script src="script.js"></script>
  <script src="assets/js/core/popper.min.js"></script>
  <script src="assets/js/core/bootstrap.min.js"></script>
  <script src="assets/js/plugins/perfect-scrollbar.min.js"></script>
  <script src="assets/js/plugins/smooth-scrollbar.min.js"></script>
  <script>
    var win = navigator.platform.indexOf('Win') > -1;
    if (win && document.querySelector('#sidenav-scrollbar')) {
      var options = {
        damping: '0.5'
      }
      Scrollbar.init(document.querySelector('#sidenav-scrollbar'), options);
    }
  </script>
  <!-- Github buttons -->
  <script async defer src="https://buttons.github.io/buttons.js"></script>
  <!-- Control Center for Soft Dashboard: parallax effects, scripts for the example pages etc -->
  <script src="assets/js/argon-dashboard.min.js?v=2.0.4"></script>
</body>

</html>