!
DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Escape Room Game</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #333;
color: white;
text-align: center;
padding: 50px;
}
.room {
display: none;
}
.[Link] {
display: block;
}
input {
padding: 10px;
margin: 10px;
}
button {
padding: 10px 20px;
background-color: #555;
color: white;
border: none;
cursor: pointer;
}
button:hover {
background-color: #777;
}
</style>
<script>
function showRoom(roomNumber) {
// Hide all rooms
var rooms = [Link]('.room');
[Link](function(room) {
[Link]('active');
});
// Show the current room
[Link]('room' + roomNumber).[Link]('active');
}
function checkAnswer(roomNumber, correctAnswer) {
var userAnswer = [Link]('answer' +
roomNumber).[Link]();
var feedback = [Link]('feedback' + roomNumber);
if (userAnswer === [Link]()) {
[Link] = "Benar! Anda berhasil membuka pintu!";
// Move to the next room
setTimeout(function() {
showRoom(roomNumber + 1);
}, 1000);
} else {
[Link] = "Salah! Coba lagi.";
}
}
</script>
</head>
<body>
<h1>Escape Room Challenge</h1>
<p>Pecahkan teka-teki untuk melarikan diri dari setiap ruangan!</p>
<!-- Room 1 -->
<div id="room1" class="room active">
<h2>Ruangan 1</h2>
<p>Berapa jumlah kaki seekor laba-laba?</p>
<input type="text" id="answer1" placeholder="Jawaban Anda">
<button onclick="checkAnswer(1, '8')">Submit</button>
<p id="feedback1"></p>
</div>
<!-- Room 2 -->
<div id="room2" class="room">
<h2>Ruangan 2</h2>
<p>Nama ibu kota Indonesia?</p>
<input type="text" id="answer2" placeholder="Jawaban Anda">
<button onclick="checkAnswer(2, 'jakarta')">Submit</button>
<p id="feedback2"></p>
</div>
<!-- Room 3 -->
<div id="room3" class="room">
<h2>Ruangan 3</h2>
<p>Sebutkan warna bendera Indonesia?</p>
<input type="text" id="answer3" placeholder="Jawaban Anda">
<button onclick="checkAnswer(3, 'merah putih')">Submit</button>
<p id="feedback3"></p>
</div>
<!-- Success Page -->
<div id="room4" class="room">
<h2>Selamat!</h2>
<p>Anda telah menyelesaikan semua teka-teki dan berhasil keluar dari Escape
Room!</p>
</div>
</body>
</html>
