mirror of
https://github.com/cliffe/BreakEscape.git
synced 2026-02-20 13:50:46 +00:00
134 lines
4.1 KiB
HTML
134 lines
4.1 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Test Keyboard Pause</title>
|
|
<style>
|
|
body {
|
|
font-family: monospace;
|
|
padding: 20px;
|
|
}
|
|
.log {
|
|
background: #f0f0f0;
|
|
padding: 10px;
|
|
margin: 10px 0;
|
|
border: 1px solid #ccc;
|
|
max-height: 300px;
|
|
overflow-y: auto;
|
|
}
|
|
button {
|
|
margin: 5px;
|
|
padding: 10px 20px;
|
|
font-size: 16px;
|
|
}
|
|
input {
|
|
padding: 10px;
|
|
font-size: 16px;
|
|
margin: 10px 0;
|
|
width: 300px;
|
|
}
|
|
.status {
|
|
padding: 10px;
|
|
margin: 10px 0;
|
|
font-weight: bold;
|
|
}
|
|
.status.paused {
|
|
background: #ffcccc;
|
|
color: #cc0000;
|
|
}
|
|
.status.active {
|
|
background: #ccffcc;
|
|
color: #00cc00;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<h1>Keyboard Pause Test</h1>
|
|
|
|
<div class="status active" id="status">Keyboard Active</div>
|
|
|
|
<div>
|
|
<button onclick="pauseKeyboard()">Pause Keyboard</button>
|
|
<button onclick="resumeKeyboard()">Resume Keyboard</button>
|
|
<button onclick="clearLog()">Clear Log</button>
|
|
</div>
|
|
|
|
<div>
|
|
<h3>Test typing WASD in this input:</h3>
|
|
<input type="text" id="testInput" placeholder="Type WASD here...">
|
|
</div>
|
|
|
|
<div>
|
|
<h3>Event Log:</h3>
|
|
<div class="log" id="log"></div>
|
|
</div>
|
|
|
|
<script type="module">
|
|
// Simulate the player keyboard system
|
|
let keyboardPaused = false;
|
|
|
|
function log(message, isError = false) {
|
|
const logDiv = document.getElementById('log');
|
|
const entry = document.createElement('div');
|
|
entry.style.color = isError ? 'red' : 'black';
|
|
entry.textContent = `[${new Date().toLocaleTimeString()}] ${message}`;
|
|
logDiv.appendChild(entry);
|
|
logDiv.scrollTop = logDiv.scrollHeight;
|
|
}
|
|
|
|
function updateStatus() {
|
|
const statusDiv = document.getElementById('status');
|
|
if (keyboardPaused) {
|
|
statusDiv.textContent = '🔒 Keyboard PAUSED';
|
|
statusDiv.className = 'status paused';
|
|
} else {
|
|
statusDiv.textContent = '✅ Keyboard ACTIVE';
|
|
statusDiv.className = 'status active';
|
|
}
|
|
}
|
|
|
|
window.pauseKeyboard = function() {
|
|
keyboardPaused = true;
|
|
log('🔒 Keyboard PAUSED');
|
|
updateStatus();
|
|
};
|
|
|
|
window.resumeKeyboard = function() {
|
|
keyboardPaused = false;
|
|
log('🔓 Keyboard RESUMED');
|
|
updateStatus();
|
|
};
|
|
|
|
window.clearLog = function() {
|
|
document.getElementById('log').innerHTML = '';
|
|
};
|
|
|
|
// Simulate player keydown handler
|
|
document.addEventListener('keydown', (event) => {
|
|
const key = event.key.toLowerCase();
|
|
|
|
// Check if it's a game control key
|
|
if (['w', 'a', 's', 'd', 'e', 'arrowup', 'arrowdown', 'arrowleft', 'arrowright'].includes(key)) {
|
|
if (keyboardPaused) {
|
|
log(`⏸️ Game key "${event.key}" blocked (keyboard paused) - event should pass to input`, false);
|
|
return; // Don't prevent default, let it go to the input
|
|
} else {
|
|
log(`🎮 Game key "${event.key}" intercepted - moving player`, false);
|
|
event.preventDefault(); // Prevent default for game controls
|
|
return;
|
|
}
|
|
}
|
|
});
|
|
|
|
// Log when text input receives keys
|
|
document.getElementById('testInput').addEventListener('keydown', (event) => {
|
|
log(`📝 Input received: "${event.key}"`, false);
|
|
});
|
|
|
|
log('Test initialized. Try typing WASD with keyboard paused vs active.');
|
|
updateStatus();
|
|
</script>
|
|
</body>
|
|
</html>
|