2526-web/Kelompok02-Memory-Card
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

testing

Browse Source
This commit is contained in:
Nathan 2025-12-09 15:58:38 +07:00
parent 3fb9ae5e9e
commit 99c33ab04f
4 changed files with 153 additions and 143 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

140
login.html
View File

@ -313,102 +313,102 @@ input:focus {
</p>
<script>
/*LOGIN VALIDATION*/
/* LOGIN VALIDATION FRONT-END RINGAN */
document.getElementById("loginForm").addEventListener("submit", function(e) {
e.preventDefault();
e.preventDefault(); // jangan reload halaman
const username = document.getElementById("username").value.trim();
const password = document.getElementById("password").value.trim();
const errorBox = document.getElementById("errorBox");
const username = document.getElementById("username").value.trim();
const password = document.getElementById("password").value.trim();
const errorBox = document.getElementById("errorBox");
errorBox.style.display = "none";
errorBox.innerText = "";
errorBox.style.display = "none";
errorBox.innerText = "";
if (!username || !password) {
showError("Username dan password harus diisi");
return;
}
// Validasi form
if (!username || !password) {
showError("Username dan password harus diisi");
return;
}
if (password.length < 6) {
showError("Password minimal 6 karakter");
return;
}
if (password.length < 6) {
showError("Password minimal 6 karakter");
return;
}
const usersData = localStorage.getItem("users");
const users = usersData ? JSON.parse(usersData) : [];
const user = users.find(u => u.username === username);
if (!user) {
showError("Username tidak ditemukan");
return;
}
if (user.password !== password) {
showError("Password salah");
return;
}
// Login sukses
localStorage.setItem("loggedInUser", JSON.stringify(user));
window.location.href = "mainboard.html";
// Kirim ke login.php via AJAX
fetch("login.php", {
method: "POST",
headers: {"Content-Type": "application/x-www-form-urlencoded"},
body: `username=${encodeURIComponent(username)}&password=${encodeURIComponent(password)}`
})
.then(response => response.text())
.then(data => {
data = data.trim();
if (data === "OK") {
// login sukses -> redirect ke mainboard.php
window.location.href = "mainboard.php";
} else {
// tampilkan error dari PHP
showError(data);
}
})
.catch(err => {
showError("Terjadi kesalahan server");
console.error(err);
});
});
function showError(msg) {
const errorBox = document.getElementById("errorBox");
errorBox.innerText = msg;
errorBox.style.display = "block";
const errorBox = document.getElementById("errorBox");
errorBox.innerText = msg;
errorBox.style.display = "block";
}
function toggleDemo() {
const box = document.getElementById("demoBox");
const btn = document.querySelector(".demo-toggle");
const box = document.getElementById("demoBox");
const btn = document.querySelector(".demo-toggle");
box.classList.toggle("show");
box.classList.toggle("show");
// Ubah teks tombol
if (box.classList.contains("show")) {
btn.textContent = "Sembunyikan Demo Akun ▲";
} else {
btn.textContent = "Lihat Demo Akun ▼";
}
// Ubah teks tombol
if (box.classList.contains("show")) {
btn.textContent = "Sembunyikan Demo Akun ▲";
} else {
btn.textContent = "Lihat Demo Akun ▼";
}
}
/* GLITTER EFFECT*/
/* GLITTER EFFECT */
document.addEventListener("DOMContentLoaded", function () {
const card = document.querySelector(".login-card");
const card = document.querySelector(".login-card");
if (!card) return;
if (!card) return;
for (let i = 0; i < 20; i++) {
const g = document.createElement("div");
g.className = "glitter";
// Tambah glitter 20x
for (let i = 0; i < 20; i++) {
const g = document.createElement("div");
g.className = "glitter";
// Random posisi ledakan glitter
g.style.setProperty("--x", (Math.random() * 200 - 100) + "px");
g.style.setProperty("--y", (Math.random() * 200 - 100) + "px");
// Random posisi ledakan glitter
g.style.setProperty("--x", (Math.random() * 200 - 100) + "px");
g.style.setProperty("--y", (Math.random() * 200 - 100) + "px");
g.style.left = (Math.random() * 100) + "%";
g.style.top = (Math.random() * 100) + "%";
g.style.left = (Math.random() * 100) + "%";
g.style.top = (Math.random() * 100) + "%";
g.style.animationDelay = (Math.random() * 2) + "s";
g.style.animationDelay = (Math.random() * 2) + "s";
card.appendChild(g);
}
card.appendChild(g);
}
});
setInterval(() => {
document.querySelectorAll(".glitter").forEach(g => {
g.style.setProperty("--x", (Math.random() * 200 - 100) + "px");
g.style.setProperty("--y", (Math.random() * 200 - 100) + "px");
g.style.left = Math.random() * window.innerWidth + "px";
g.style.top = Math.random() * window.innerHeight + "px";
});
document.querySelectorAll(".glitter").forEach(g => {
g.style.setProperty("--x", (Math.random() * 200 - 100) + "px");
g.style.setProperty("--y", (Math.random() * 200 - 100) + "px");
g.style.left = Math.random() * window.innerWidth + "px";
g.style.top = Math.random() * window.innerHeight + "px";
});
}, 900);
</script>
</body>
</html>

17
login.php
View File

@ -5,22 +5,17 @@ include "koneksi.php";
$username = $_POST['username'];
$password = $_POST['password'];
$enc = md5($password);
$stmt = mysqli_prepare($conn, "SELECT * FROM user WHERE username=? AND password=?");
mysqli_stmt_bind_param($stmt, "ss", $username, $enc);
$stmt = mysqli_prepare($conn, "SELECT * FROM user WHERE username=?");
mysqli_stmt_bind_param($stmt, "s", $username);
mysqli_stmt_execute($stmt);
$result = mysqli_stmt_get_result($stmt);
if ($row = mysqli_fetch_assoc($result)) {
if ($row && password_verify($password, $row['password'])) {
$_SESSION['username'] = $row['username'];
$_SESSION['email'] = $row['email'];
header("Location: mainboard.html");
echo "OK";
exit;
} else {
echo "<script>alert('Username atau password salah!'); window.history.back();</script>";
echo "Username atau password salah";
exit;
}
?>

66
register.html
View File

@ -255,18 +255,19 @@ input:focus {
</div>
<script>
document.getElementById("registerForm").addEventListener("submit", function (e) {
e.preventDefault();
document.getElementById("registerForm").addEventListener("submit", function(e) {
e.preventDefault(); // jangan reload halaman
let username = document.getElementById("username").value.trim();
let email = document.getElementById("email").value.trim();
let password = document.getElementById("password").value.trim();
let confirmPassword = document.getElementById("confirm_password").value.trim();
let errorBox = document.getElementById("errorBox");
const username = document.getElementById("username").value.trim();
const email = document.getElementById("email").value.trim();
const password = document.getElementById("password").value.trim();
const confirmPassword = document.getElementById("confirm_password").value.trim();
const errorBox = document.getElementById("errorBox");
errorBox.style.display = "none";
errorBox.innerText = "";
// Validasi
// Validasi form
if (!username || !email || !password || !confirmPassword) {
showError("Semua field harus diisi");
return;
@ -282,44 +283,39 @@ input:focus {
return;
}
if (password !== confirm_password) {
if (password !== confirmPassword) {
showError("Password dan konfirmasi password tidak cocok");
return;
}
let users = JSON.parse(localStorage.getItem("users") || "[]");
if (users.some(u => u.username === username)) {
showError("Username sudah digunakan");
return;
}
if (users.some(u => u.email === email)) {
showError("Email sudah digunakan");
return;
}
// Simpan user baru
users.push({
id: Date.now().toString(),
username,
email,
password,
role: "player"
// Kirim ke register.php via AJAX
fetch("register.php", {
method: "POST",
headers: {"Content-Type": "application/x-www-form-urlencoded"},
body: `username=${encodeURIComponent(username)}&email=${encodeURIComponent(email)}&password=${encodeURIComponent(password)}`
})
.then(response => response.text())
.then(data => {
data = data.trim();
if (data === "OK") {
// registrasi sukses -> redirect ke mainboard.php
window.location.href = "mainboard.php";
} else {
showError(data); // tampilkan error dari PHP
}
})
.catch(err => {
showError("Terjadi kesalahan server");
console.error(err);
});
localStorage.setItem("users", JSON.stringify(users));
alert("Registrasi berhasil! Silakan login.");
window.location.href = "login.html";
});
function showError(msg) {
let box = document.getElementById("errorBox");
const box = document.getElementById("errorBox");
box.innerText = msg;
box.style.display = "block";
}
</script>
</body>
</html>

73
register.php
View File

@ -1,34 +1,53 @@
<?php
session_start();
include "koneksi.php";
$username = $_POST['username'];
$email = $_POST['email'];
$password = $_POST['password'];
$confirm = $_POST['confirm_password'];
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
$username = trim($_POST['username']);
$email = trim($_POST['email']);
$password = trim($_POST['password']);
$confirmPassword = trim($_POST['confirm_password']);
if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
echo "<script>alert('Format email tidak valid!'); window.history.back();</script>";
if (!$username || !$email || !$password || !$confirmPassword) {
echo "<script>alert('Semua field harus diisi'); window.history.back();</script>";
exit;
}
if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
echo "<script>alert('Format email tidak valid'); window.history.back();</script>";
exit;
}
if ($password !== $confirmPassword) {
echo "<script>alert('Password dan konfirmasi password tidak cocok'); window.history.back();</script>";
exit;
}
if (strlen($password) < 6) {
echo "<script>alert('Password minimal 6 karakter'); window.history.back();</script>";
exit;
}
// cek username & email di database
$stmt = mysqli_prepare($conn, "SELECT id FROM user WHERE username=? OR email=?");
mysqli_stmt_bind_param($stmt, "ss", $username, $email);
mysqli_stmt_execute($stmt);
mysqli_stmt_store_result($stmt);
if (mysqli_stmt_num_rows($stmt) > 0) {
echo "<script>alert('Username atau email sudah digunakan'); window.history.back();</script>";
exit;
}
// hash password
$hash = password_hash($password, PASSWORD_DEFAULT);
// insert user
$stmt = mysqli_prepare($conn, "INSERT INTO user (username, email, password, role) VALUES (?, ?, ?, 'player')");
mysqli_stmt_bind_param($stmt, "sss", $username, $email, $hash);
mysqli_stmt_execute($stmt);
echo "<script>alert('Registrasi berhasil! Silakan login.'); window.location.href='login.html';</script>";
exit;
}
if ($password != $confirm) {
echo "<script>alert('Password tidak sama'); window.history.back();</script>";
exit;
}
$cek = mysqli_query($conn, "SELECT * FROM user WHERE username='$username' OR email='$email'");
if (mysqli_num_rows($cek) > 0) {
echo "<script>alert('Username atau email sudah digunakan'); window.history.back();</script>";
exit;
}
$hash = md5($password);
$sql = "INSERT INTO user (username, email, password) VALUES ('$username', '$email', '$hash')";
if (mysqli_query($conn, $sql)) {
echo "<script>alert('Registrasi berhasil! Silakan login.'); window.location='login.html';</script>";
} else {
echo "Error: " . mysqli_error($conn);
}
?>