mirror of
https://github.com/cliffe/BreakEscape.git
synced 2026-02-20 13:50:46 +00:00
b8c8c79f86
Introduce a new Notes Minigame that allows players to view and interact with notes in a notepad-style interface. The minigame supports adding notes to the inventory, displaying observations, and includes navigation features such as previous/next buttons and search functionality. Update relevant files for integration with the existing game systems, including interaction and inventory management. Add test HTML for verifying minigame features and include necessary assets for the notepad background.
205 lines
7.2 KiB
HTML
205 lines
7.2 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Notes Minigame Features Test</title>
|
|
<style>
|
|
body {
|
|
font-family: Arial, sans-serif;
|
|
margin: 20px;
|
|
background: #1a1a1a;
|
|
color: white;
|
|
}
|
|
.test-section {
|
|
margin: 20px 0;
|
|
padding: 15px;
|
|
border: 1px solid #444;
|
|
border-radius: 5px;
|
|
}
|
|
button {
|
|
background: #3498db;
|
|
color: white;
|
|
border: none;
|
|
padding: 10px 20px;
|
|
border-radius: 5px;
|
|
cursor: pointer;
|
|
margin: 5px;
|
|
}
|
|
button:hover {
|
|
background: #2980b9;
|
|
}
|
|
.test-notes {
|
|
background: #2c3e50;
|
|
padding: 10px;
|
|
margin: 10px 0;
|
|
border-radius: 3px;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<h1>Notes Minigame Features Test</h1>
|
|
|
|
<div class="test-section">
|
|
<h2>Test Mission Brief</h2>
|
|
<p>Test the mission brief functionality:</p>
|
|
<button onclick="testMissionBrief()">Show Mission Brief</button>
|
|
</div>
|
|
|
|
<div class="test-section">
|
|
<h2>Test Notes with Observations</h2>
|
|
<p>Test notes with observations, search functionality, and editing:</p>
|
|
<button onclick="addTestNotes()">Add Test Notes</button>
|
|
<button onclick="testNotesMinigame()">Open Notes Minigame</button>
|
|
<p><small>Features to test: Edit observations, celotape effect, search, navigation</small></p>
|
|
</div>
|
|
|
|
<div class="test-section">
|
|
<h2>Current Notes</h2>
|
|
<div id="notes-display"></div>
|
|
</div>
|
|
|
|
<!-- Load the minigame framework -->
|
|
<script type="module">
|
|
// Import the minigame framework
|
|
import { MinigameFramework, showMissionBrief, startNotesMinigame } from './js/minigames/index.js';
|
|
|
|
// Make functions available globally for testing
|
|
window.showMissionBrief = showMissionBrief;
|
|
window.startNotesMinigame = startNotesMinigame;
|
|
|
|
// Initialize game state
|
|
window.gameState = {
|
|
notes: []
|
|
};
|
|
|
|
// Mock game scenario
|
|
window.gameScenario = {
|
|
scenario_brief: `MISSION BRIEF: CYBER SECURITY BREACH INVESTIGATION
|
|
|
|
You are a cybersecurity expert called in to investigate a potential data breach at TechCorp Industries.
|
|
|
|
OBJECTIVES:
|
|
- Investigate suspicious network activity
|
|
- Identify the source of the breach
|
|
- Recover any compromised data
|
|
- Document findings for legal proceedings
|
|
|
|
INTEL:
|
|
- Unusual network traffic detected at 2:47 AM
|
|
- Multiple failed login attempts from unknown IPs
|
|
- Employee reports of system slowdowns
|
|
- CEO's laptop may contain critical evidence
|
|
|
|
APPROACH:
|
|
- Start in the reception area
|
|
- Gather information from available systems
|
|
- Look for physical evidence
|
|
- Document everything you find
|
|
|
|
Remember: Time is critical. The longer the breach goes unaddressed, the more data could be compromised.`
|
|
};
|
|
|
|
// Mock addNote function
|
|
window.addNote = function(title, text, important = false) {
|
|
const note = {
|
|
title: title,
|
|
text: text,
|
|
important: important,
|
|
timestamp: new Date().toISOString()
|
|
};
|
|
window.gameState.notes.push(note);
|
|
updateNotesDisplay();
|
|
return note;
|
|
};
|
|
|
|
// Mock addToInventory function
|
|
window.addToInventory = function(item) {
|
|
console.log('Added to inventory:', item);
|
|
return true;
|
|
};
|
|
|
|
// Mock notification functions
|
|
window.showNotification = function(message, type) {
|
|
console.log(`Notification [${type}]: ${message}`);
|
|
};
|
|
|
|
window.gameAlert = function(message, type, title, duration) {
|
|
console.log(`Alert [${type}] ${title}: ${message}`);
|
|
};
|
|
|
|
function updateNotesDisplay() {
|
|
const display = document.getElementById('notes-display');
|
|
display.innerHTML = '';
|
|
|
|
window.gameState.notes.forEach((note, index) => {
|
|
const noteDiv = document.createElement('div');
|
|
noteDiv.className = 'test-notes';
|
|
noteDiv.innerHTML = `
|
|
<strong>${note.title}</strong> ${note.important ? '(Important)' : ''}
|
|
<br><small>${note.text.substring(0, 100)}...</small>
|
|
`;
|
|
display.appendChild(noteDiv);
|
|
});
|
|
}
|
|
|
|
// Test functions
|
|
window.testMissionBrief = function() {
|
|
console.log('Testing mission brief...');
|
|
window.showMissionBrief();
|
|
};
|
|
|
|
window.addTestNotes = function() {
|
|
// Add some test notes with observations
|
|
window.addNote("Security Log Entry #1",
|
|
"System accessed at 2:47 AM from IP 192.168.1.100\nMultiple failed login attempts detected\nUser: admin\nStatus: BLOCKED\n\nObservation: The handwriting appears rushed and there are coffee stains on the paper.",
|
|
true);
|
|
|
|
window.addNote("Employee Report",
|
|
"Sarah Johnson reports system slowdowns starting around 2:30 AM\nScreens freezing intermittently\nNetwork connection unstable\n\nObservation: The note is written in neat handwriting with a blue pen.",
|
|
false);
|
|
|
|
window.addNote("Network Analysis",
|
|
"Traffic analysis shows unusual patterns\nHigh bandwidth usage during off-hours\nMultiple connection attempts to external servers\n\nObservation: This appears to be printed from a system log.",
|
|
true);
|
|
|
|
window.addNote("CEO Laptop Access",
|
|
"Laptop found in CEO's office\nPassword protected\nContains sensitive financial data\n\nObservation: The laptop shows signs of recent use - warm to the touch.",
|
|
true);
|
|
|
|
// Add a note without observations to test the edit functionality
|
|
window.addNote("Suspicious Activity",
|
|
"Found unusual files in the temp directory\nFiles appear to be encrypted\nCreated around 2:45 AM\nNo legitimate user activity at that time",
|
|
true);
|
|
|
|
updateNotesDisplay();
|
|
};
|
|
|
|
window.testNotesMinigame = function() {
|
|
if (window.gameState.notes.length === 0) {
|
|
alert('Please add test notes first!');
|
|
return;
|
|
}
|
|
|
|
// Create a test item for the first note
|
|
const firstNote = window.gameState.notes[0];
|
|
const testItem = {
|
|
scene: null,
|
|
scenarioData: {
|
|
type: 'notes',
|
|
name: firstNote.title,
|
|
text: firstNote.text,
|
|
important: firstNote.important
|
|
}
|
|
};
|
|
|
|
window.startNotesMinigame(testItem, firstNote.text, '');
|
|
};
|
|
|
|
// Initialize
|
|
updateNotesDisplay();
|
|
console.log('Notes minigame test page loaded');
|
|
</script>
|
|
</body>
|
|
</html>
|