270 lines
5.4 KiB
PHP
270 lines
5.4 KiB
PHP
<<<<<<< HEAD
|
|
<?php
|
|
session_start();
|
|
if (!isset($_SESSION['user'])) {
|
|
header("Location: index.php");
|
|
exit;
|
|
}
|
|
|
|
$conn = new mysqli("localhost", "root", "", "dodge_game");
|
|
$user = $_SESSION['user'];
|
|
|
|
// AMBIL SKIN USER SEKARANG
|
|
$qSkin = $conn->query("SELECT skin FROM users WHERE username='$user'");
|
|
$currentSkin = $qSkin->fetch_assoc()['skin'];
|
|
|
|
// LIST SKIN
|
|
$skins = [
|
|
"cyan" => "#00ffff",
|
|
"blue" => "#0066ff",
|
|
"yellow" => "#ffee00",
|
|
"purple" => "#ff55ff",
|
|
"green" => "#33ff55"
|
|
];
|
|
|
|
// AMBIL SKIN USER
|
|
$qSkin = $conn->query("SELECT skin FROM users WHERE username='$user'");
|
|
$data = $qSkin->fetch_assoc();
|
|
|
|
// PROSES SIMPAN SKIN
|
|
if (isset($_POST['chooseSkin'])) {
|
|
$selectedSkin = $_POST['skin'];
|
|
$conn->query("UPDATE users SET skin='$selectedSkin' WHERE username='$user'");
|
|
$currentSkin = $selectedSkin;
|
|
}
|
|
?>
|
|
|
|
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>Pilih Skin</title>
|
|
<link rel="stylesheet" href="assets/style.css">
|
|
|
|
<style>
|
|
body {
|
|
text-align: center;
|
|
padding-top: 40px;
|
|
color: white;
|
|
}
|
|
|
|
.skin-container {
|
|
margin-top: 20px;
|
|
}
|
|
|
|
.skin-box {
|
|
width: 90px;
|
|
height: 90px;
|
|
border-radius: 12px;
|
|
display: inline-block;
|
|
margin: 12px;
|
|
cursor: pointer;
|
|
transition: 0.2s;
|
|
border: 4px solid transparent;
|
|
}
|
|
|
|
.skin-box:hover {
|
|
transform: scale(1.1);
|
|
}
|
|
|
|
.skin-selected {
|
|
border: 4px solid #fff;
|
|
box-shadow: 0 0 15px white;
|
|
}
|
|
|
|
.hidden-radio {
|
|
display: none;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<h2>Pilih Skin Pemain</h2>
|
|
|
|
<form method="POST">
|
|
|
|
<div class="skin-container">
|
|
|
|
<?php foreach ($skins as $name => $color): ?>
|
|
<label>
|
|
<input
|
|
type="radio"
|
|
name="skin"
|
|
class="hidden-radio"
|
|
value="<?= $name ?>"
|
|
<?= $currentSkin == $name ? "checked" : "" ?>
|
|
>
|
|
<div
|
|
class="skin-box <?= $currentSkin == $name ? "skin-selected" : "" ?>"
|
|
style="background: <?= $color ?>"
|
|
></div>
|
|
</label>
|
|
<?php endforeach; ?>
|
|
|
|
</div>
|
|
|
|
<br><br>
|
|
<button type="submit" name="chooseSkin" style="width:250px;">Simpan Skin</button>
|
|
|
|
</form>
|
|
|
|
<a href="menu.php">
|
|
<button style="width:250px; background:#555; margin-top:20px;">Kembali</button>
|
|
</a>
|
|
|
|
<script>
|
|
// AUTO HIGHLIGHT SKIN KETIKA DIPILIH
|
|
const radios = document.querySelectorAll("input[name='skin']");
|
|
const boxes = document.querySelectorAll(".skin-box");
|
|
|
|
boxes.forEach((box, index) => {
|
|
box.addEventListener("click", () => {
|
|
// pilih radio
|
|
radios[index].checked = true;
|
|
|
|
// remove highlight
|
|
boxes.forEach(b => b.classList.remove("skin-selected"));
|
|
|
|
// add highlight ke yang dipilih
|
|
box.classList.add("skin-selected");
|
|
});
|
|
});
|
|
</script>
|
|
|
|
</body>
|
|
=======
|
|
<?php
|
|
session_start();
|
|
if (!isset($_SESSION['user'])) {
|
|
header("Location: index.php");
|
|
exit;
|
|
}
|
|
|
|
$conn = new mysqli("localhost", "root", "", "dodge_game");
|
|
$user = $_SESSION['user'];
|
|
|
|
// AMBIL SKIN USER SEKARANG
|
|
$qSkin = $conn->query("SELECT skin FROM users WHERE username='$user'");
|
|
$currentSkin = $qSkin->fetch_assoc()['skin'];
|
|
|
|
// LIST SKIN
|
|
$skins = [
|
|
"cyan" => "#00ffff",
|
|
"blue" => "#0066ff",
|
|
"yellow" => "#ffee00",
|
|
"purple" => "#ff55ff",
|
|
"green" => "#33ff55"
|
|
];
|
|
|
|
// AMBIL SKIN USER
|
|
$qSkin = $conn->query("SELECT skin FROM users WHERE username='$user'");
|
|
$data = $qSkin->fetch_assoc();
|
|
|
|
// PROSES SIMPAN SKIN
|
|
if (isset($_POST['chooseSkin'])) {
|
|
$selectedSkin = $_POST['skin'];
|
|
$conn->query("UPDATE users SET skin='$selectedSkin' WHERE username='$user'");
|
|
$currentSkin = $selectedSkin;
|
|
}
|
|
?>
|
|
|
|
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>Pilih Skin</title>
|
|
<link rel="stylesheet" href="assets/style.css">
|
|
|
|
<style>
|
|
body {
|
|
text-align: center;
|
|
padding-top: 40px;
|
|
color: white;
|
|
}
|
|
|
|
.skin-container {
|
|
margin-top: 20px;
|
|
}
|
|
|
|
.skin-box {
|
|
width: 90px;
|
|
height: 90px;
|
|
border-radius: 12px;
|
|
display: inline-block;
|
|
margin: 12px;
|
|
cursor: pointer;
|
|
transition: 0.2s;
|
|
border: 4px solid transparent;
|
|
}
|
|
|
|
.skin-box:hover {
|
|
transform: scale(1.1);
|
|
}
|
|
|
|
.skin-selected {
|
|
border: 4px solid #fff;
|
|
box-shadow: 0 0 15px white;
|
|
}
|
|
|
|
.hidden-radio {
|
|
display: none;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<h2>Pilih Skin Pemain</h2>
|
|
|
|
<form method="POST">
|
|
|
|
<div class="skin-container">
|
|
|
|
<?php foreach ($skins as $name => $color): ?>
|
|
<label>
|
|
<input
|
|
type="radio"
|
|
name="skin"
|
|
class="hidden-radio"
|
|
value="<?= $name ?>"
|
|
<?= $currentSkin == $name ? "checked" : "" ?>
|
|
>
|
|
<div
|
|
class="skin-box <?= $currentSkin == $name ? "skin-selected" : "" ?>"
|
|
style="background: <?= $color ?>"
|
|
></div>
|
|
</label>
|
|
<?php endforeach; ?>
|
|
|
|
</div>
|
|
|
|
<br><br>
|
|
<button type="submit" name="chooseSkin" style="width:250px;">Simpan Skin</button>
|
|
|
|
</form>
|
|
|
|
<a href="menu.php">
|
|
<button style="width:250px; background:#555; margin-top:20px;">Kembali</button>
|
|
</a>
|
|
|
|
<script>
|
|
// AUTO HIGHLIGHT SKIN KETIKA DIPILIH
|
|
const radios = document.querySelectorAll("input[name='skin']");
|
|
const boxes = document.querySelectorAll(".skin-box");
|
|
|
|
boxes.forEach((box, index) => {
|
|
box.addEventListener("click", () => {
|
|
// pilih radio
|
|
radios[index].checked = true;
|
|
|
|
// remove highlight
|
|
boxes.forEach(b => b.classList.remove("skin-selected"));
|
|
|
|
// add highlight ke yang dipilih
|
|
box.classList.add("skin-selected");
|
|
});
|
|
});
|
|
</script>
|
|
|
|
</body>
|
|
>>>>>>> 720425e3f38951553731cb9aae9a4c9a34f6c2b4
|
|
</html>
|