mirror of
https://github.com/cliffe/BreakEscape.git
synced 2026-02-20 13:50:46 +00:00
384 lines
14 KiB
HTML
384 lines
14 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Auto Desktop Mode Test</title>
|
|
|
|
<!-- Include the game's CSS -->
|
|
<link rel="stylesheet" href="css/main.css">
|
|
<link rel="stylesheet" href="css/minigames-framework.css">
|
|
<link rel="stylesheet" href="css/container-minigame.css">
|
|
<link rel="stylesheet" href="css/notifications.css">
|
|
|
|
<style>
|
|
body {
|
|
background: #1a1a1a;
|
|
color: white;
|
|
font-family: 'Press Start 2P', monospace;
|
|
margin: 0;
|
|
padding: 20px;
|
|
}
|
|
|
|
.test-container {
|
|
max-width: 1000px;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.test-section {
|
|
margin: 20px 0;
|
|
padding: 20px;
|
|
border: 2px solid #444;
|
|
border-radius: 10px;
|
|
background: #2a2a2a;
|
|
}
|
|
|
|
.test-button {
|
|
background: #3498db;
|
|
color: white;
|
|
border: none;
|
|
padding: 12px 24px;
|
|
border-radius: 5px;
|
|
cursor: pointer;
|
|
font-family: 'Press Start 2P', monospace;
|
|
font-size: 10px;
|
|
margin: 5px;
|
|
transition: background 0.3s ease;
|
|
}
|
|
|
|
.test-button:hover {
|
|
background: #2980b9;
|
|
}
|
|
|
|
.test-button.success {
|
|
background: #2ecc71;
|
|
}
|
|
|
|
.test-button.success:hover {
|
|
background: #27ae60;
|
|
}
|
|
|
|
.test-description {
|
|
font-size: 8px;
|
|
color: #ccc;
|
|
margin-bottom: 10px;
|
|
line-height: 1.4;
|
|
}
|
|
|
|
.test-results {
|
|
margin-top: 20px;
|
|
padding: 15px;
|
|
background: #1a1a1a;
|
|
border-radius: 5px;
|
|
border: 1px solid #444;
|
|
}
|
|
|
|
.test-results h3 {
|
|
color: #00ff00;
|
|
margin-top: 0;
|
|
}
|
|
|
|
.test-results pre {
|
|
background: #0a0a0a;
|
|
padding: 10px;
|
|
border-radius: 3px;
|
|
overflow-x: auto;
|
|
font-size: 8px;
|
|
}
|
|
|
|
.detection-info {
|
|
background: rgba(0, 255, 0, 0.1);
|
|
border: 1px solid #00ff00;
|
|
border-radius: 5px;
|
|
padding: 10px;
|
|
margin: 10px 0;
|
|
font-size: 8px;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="test-container">
|
|
<h1>Auto Desktop Mode Detection Test</h1>
|
|
<p>Test automatic desktop mode detection for PC, tablet, and computer containers.</p>
|
|
|
|
<div class="detection-info">
|
|
<strong>Auto-Detection Keywords:</strong> computer, pc, laptop, desktop, terminal, workstation, tablet, ipad, surface, monitor, screen, display, server, mainframe, console, kiosk, smartboard
|
|
</div>
|
|
|
|
<!-- Computer Container Test -->
|
|
<div class="test-section">
|
|
<h2>Computer Container (Auto Desktop)</h2>
|
|
<div class="test-description">
|
|
Test container with "computer" in the name - should automatically enable desktop mode.
|
|
</div>
|
|
<button class="test-button success" onclick="testComputerContainer()">Test Computer Container</button>
|
|
</div>
|
|
|
|
<!-- Tablet Container Test -->
|
|
<div class="test-section">
|
|
<h2>Tablet Container (Auto Desktop)</h2>
|
|
<div class="test-description">
|
|
Test container with "tablet" in the name - should automatically enable desktop mode.
|
|
</div>
|
|
<button class="test-button success" onclick="testTabletContainer()">Test Tablet Container</button>
|
|
</div>
|
|
|
|
<!-- PC Container Test -->
|
|
<div class="test-section">
|
|
<h2>PC Container (Auto Desktop)</h2>
|
|
<div class="test-description">
|
|
Test container with "pc" in the name - should automatically enable desktop mode.
|
|
</div>
|
|
<button class="test-button success" onclick="testPCContainer()">Test PC Container</button>
|
|
</div>
|
|
|
|
<!-- Regular Container Test -->
|
|
<div class="test-section">
|
|
<h2>Regular Container (No Auto Desktop)</h2>
|
|
<div class="test-description">
|
|
Test container with "safe" in the name - should NOT automatically enable desktop mode.
|
|
</div>
|
|
<button class="test-button" onclick="testRegularContainer()">Test Regular Container</button>
|
|
</div>
|
|
|
|
<!-- Manual Override Test -->
|
|
<div class="test-section">
|
|
<h2>Manual Override Test</h2>
|
|
<div class="test-description">
|
|
Test container with "safe" but manually force desktop mode - should enable desktop mode.
|
|
</div>
|
|
<button class="test-button" onclick="testManualOverride()">Test Manual Override</button>
|
|
</div>
|
|
|
|
<!-- Test Results -->
|
|
<div class="test-results">
|
|
<h3>Test Results</h3>
|
|
<pre id="test-results">Click a test button to see results here...</pre>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Include Phaser first -->
|
|
<script src="https://cdn.jsdelivr.net/npm/phaser@3.60.0/dist/phaser.min.js"></script>
|
|
|
|
<!-- Include the minigame framework -->
|
|
<script type="module">
|
|
// Import the minigame framework and container minigame
|
|
import { MinigameFramework } from './js/minigames/framework/minigame-manager.js';
|
|
import { ContainerMinigame } from './js/minigames/container/container-minigame.js';
|
|
|
|
// Initialize the framework
|
|
window.MinigameFramework = MinigameFramework;
|
|
MinigameFramework.registerScene('container', ContainerMinigame);
|
|
|
|
// Mock game object
|
|
window.game = {
|
|
sound: {
|
|
play: function(soundName) {
|
|
console.log('Playing sound:', soundName);
|
|
}
|
|
}
|
|
};
|
|
|
|
// Mock game alert function
|
|
window.gameAlert = function(message, type, title, duration) {
|
|
console.log(`[${type.toUpperCase()}] ${title}: ${message}`);
|
|
updateTestResults(`[${type.toUpperCase()}] ${title}: ${message}`);
|
|
};
|
|
|
|
// Mock inventory functions
|
|
window.addToInventory = function(item) {
|
|
console.log('Added to inventory:', item);
|
|
updateTestResults(`Added to inventory: ${item.name}`);
|
|
};
|
|
|
|
window.removeFromInventory = function(item) {
|
|
console.log('Removed from inventory:', item);
|
|
updateTestResults(`Removed from inventory: ${item.name}`);
|
|
};
|
|
|
|
// Test functions
|
|
function testComputerContainer() {
|
|
updateTestResults("Testing computer container (should auto-enable desktop mode)...");
|
|
|
|
const mockContainer = {
|
|
scenarioData: {
|
|
name: "Office Computer",
|
|
type: "container",
|
|
observations: "A computer that should auto-enable desktop mode"
|
|
},
|
|
name: "computer"
|
|
};
|
|
|
|
const contents = [
|
|
{
|
|
id: "file1",
|
|
name: "Document",
|
|
type: "document",
|
|
takeable: true
|
|
}
|
|
];
|
|
|
|
MinigameFramework.startMinigame('container', null, {
|
|
title: 'Computer Container Test',
|
|
containerItem: mockContainer,
|
|
contents: contents,
|
|
isTakeable: false,
|
|
desktopMode: null, // Let it auto-detect
|
|
onComplete: (success, result) => {
|
|
updateTestResults(`Computer container test completed. Success: ${success}, Desktop mode should be enabled automatically.`);
|
|
}
|
|
});
|
|
}
|
|
|
|
function testTabletContainer() {
|
|
updateTestResults("Testing tablet container (should auto-enable desktop mode)...");
|
|
|
|
const mockContainer = {
|
|
scenarioData: {
|
|
name: "Executive Tablet",
|
|
type: "container",
|
|
observations: "A tablet that should auto-enable desktop mode"
|
|
},
|
|
name: "tablet"
|
|
};
|
|
|
|
const contents = [
|
|
{
|
|
id: "note1",
|
|
name: "Notes",
|
|
type: "notes",
|
|
takeable: true
|
|
}
|
|
];
|
|
|
|
MinigameFramework.startMinigame('container', null, {
|
|
title: 'Tablet Container Test',
|
|
containerItem: mockContainer,
|
|
contents: contents,
|
|
isTakeable: false,
|
|
desktopMode: null, // Let it auto-detect
|
|
onComplete: (success, result) => {
|
|
updateTestResults(`Tablet container test completed. Success: ${success}, Desktop mode should be enabled automatically.`);
|
|
}
|
|
});
|
|
}
|
|
|
|
function testPCContainer() {
|
|
updateTestResults("Testing PC container (should auto-enable desktop mode)...");
|
|
|
|
const mockContainer = {
|
|
scenarioData: {
|
|
name: "Gaming PC",
|
|
type: "container",
|
|
observations: "A PC that should auto-enable desktop mode"
|
|
},
|
|
name: "pc"
|
|
};
|
|
|
|
const contents = [
|
|
{
|
|
id: "game1",
|
|
name: "Game Files",
|
|
type: "document",
|
|
takeable: true
|
|
}
|
|
];
|
|
|
|
MinigameFramework.startMinigame('container', null, {
|
|
title: 'PC Container Test',
|
|
containerItem: mockContainer,
|
|
contents: contents,
|
|
isTakeable: false,
|
|
desktopMode: null, // Let it auto-detect
|
|
onComplete: (success, result) => {
|
|
updateTestResults(`PC container test completed. Success: ${success}, Desktop mode should be enabled automatically.`);
|
|
}
|
|
});
|
|
}
|
|
|
|
function testRegularContainer() {
|
|
updateTestResults("Testing regular container (should NOT auto-enable desktop mode)...");
|
|
|
|
const mockContainer = {
|
|
scenarioData: {
|
|
name: "Safe Box",
|
|
type: "container",
|
|
observations: "A safe that should NOT auto-enable desktop mode"
|
|
},
|
|
name: "safe"
|
|
};
|
|
|
|
const contents = [
|
|
{
|
|
id: "item1",
|
|
name: "Valuable Item",
|
|
type: "key",
|
|
takeable: true
|
|
}
|
|
];
|
|
|
|
MinigameFramework.startMinigame('container', null, {
|
|
title: 'Regular Container Test',
|
|
containerItem: mockContainer,
|
|
contents: contents,
|
|
isTakeable: false,
|
|
desktopMode: null, // Let it auto-detect
|
|
onComplete: (success, result) => {
|
|
updateTestResults(`Regular container test completed. Success: ${success}, Desktop mode should NOT be enabled automatically.`);
|
|
}
|
|
});
|
|
}
|
|
|
|
function testManualOverride() {
|
|
updateTestResults("Testing manual override (force desktop mode on safe)...");
|
|
|
|
const mockContainer = {
|
|
scenarioData: {
|
|
name: "Safe Box",
|
|
type: "container",
|
|
observations: "A safe with manually forced desktop mode"
|
|
},
|
|
name: "safe"
|
|
};
|
|
|
|
const contents = [
|
|
{
|
|
id: "item1",
|
|
name: "Valuable Item",
|
|
type: "key",
|
|
takeable: true
|
|
}
|
|
];
|
|
|
|
MinigameFramework.startMinigame('container', null, {
|
|
title: 'Manual Override Test',
|
|
containerItem: mockContainer,
|
|
contents: contents,
|
|
isTakeable: false,
|
|
desktopMode: true, // Manually force desktop mode
|
|
onComplete: (success, result) => {
|
|
updateTestResults(`Manual override test completed. Success: ${success}, Desktop mode should be enabled manually.`);
|
|
}
|
|
});
|
|
}
|
|
|
|
function updateTestResults(message) {
|
|
const resultsElement = document.getElementById('test-results');
|
|
const timestamp = new Date().toLocaleTimeString();
|
|
resultsElement.textContent += `[${timestamp}] ${message}\n`;
|
|
resultsElement.scrollTop = resultsElement.scrollHeight;
|
|
}
|
|
|
|
// Make functions globally available
|
|
window.testComputerContainer = testComputerContainer;
|
|
window.testTabletContainer = testTabletContainer;
|
|
window.testPCContainer = testPCContainer;
|
|
window.testRegularContainer = testRegularContainer;
|
|
window.testManualOverride = testManualOverride;
|
|
|
|
// Initialize test results
|
|
updateTestResults("Auto desktop mode detection test suite loaded and ready.");
|
|
</script>
|
|
</body>
|
|
</html>
|