201 lines
6.5 KiB
HTML
201 lines
6.5 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Academy UI Integration Test</title>
|
|
<link rel="stylesheet" href="src/styles/academy-ui.css">
|
|
<style>
|
|
* {
|
|
margin: 0;
|
|
padding: 0;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
body {
|
|
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
|
|
background: #1a1a1a;
|
|
color: #e0e0e0;
|
|
padding: 20px;
|
|
}
|
|
|
|
.container {
|
|
max-width: 1400px;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
h1 {
|
|
text-align: center;
|
|
color: #ff006e;
|
|
margin-bottom: 30px;
|
|
font-size: 2.5em;
|
|
}
|
|
|
|
.test-section {
|
|
background: #2a2a2a;
|
|
border-radius: 10px;
|
|
padding: 20px;
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
.test-section h2 {
|
|
color: #8338ec;
|
|
margin-bottom: 15px;
|
|
}
|
|
|
|
.button-group {
|
|
display: flex;
|
|
gap: 10px;
|
|
flex-wrap: wrap;
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
button {
|
|
padding: 12px 24px;
|
|
border: none;
|
|
border-radius: 8px;
|
|
background: linear-gradient(135deg, #ff006e, #8338ec);
|
|
color: white;
|
|
font-weight: bold;
|
|
cursor: pointer;
|
|
transition: transform 0.2s;
|
|
}
|
|
|
|
button:hover {
|
|
transform: translateY(-2px);
|
|
}
|
|
|
|
.status-box {
|
|
padding: 15px;
|
|
border-radius: 8px;
|
|
margin-bottom: 20px;
|
|
font-family: 'Courier New', monospace;
|
|
}
|
|
|
|
.status-box.success {
|
|
background: rgba(0, 255, 136, 0.1);
|
|
border: 1px solid #00ff88;
|
|
color: #00ff88;
|
|
}
|
|
|
|
.status-box.info {
|
|
background: rgba(131, 56, 236, 0.1);
|
|
border: 1px solid #8338ec;
|
|
color: #8338ec;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<h1>🎓 Academy UI Integration Test</h1>
|
|
|
|
<div class="test-section">
|
|
<h2>Manual Tests</h2>
|
|
<div class="button-group">
|
|
<button onclick="setupSampleData()">📦 Setup Sample Data</button>
|
|
<button onclick="showLevelSelect()">📋 Show Level Select</button>
|
|
<button onclick="testCheckpointModal(1)">🎯 Test L1 Checkpoint</button>
|
|
<button onclick="testCheckpointModal(5)">⚡ Test L5 Checkpoint</button>
|
|
<button onclick="testCheckpointModal(10)">💫 Test L10 Checkpoint</button>
|
|
<button onclick="resetData()">🔄 Reset Data</button>
|
|
</div>
|
|
<div id="output"></div>
|
|
</div>
|
|
|
|
<!-- Academy Setup Container (where UI will render) -->
|
|
<div id="academy-setup"></div>
|
|
</div>
|
|
|
|
<!-- Load Dependencies -->
|
|
<script src="src/data/gameData.js"></script>
|
|
<script src="src/features/academy/campaignManager.js"></script>
|
|
<script src="src/features/academy/preferenceManager.js"></script>
|
|
<script src="src/features/academy/libraryManager.js"></script>
|
|
<script src="src/features/academy/academyUI.js"></script>
|
|
|
|
<script>
|
|
function setupSampleData() {
|
|
console.log('📦 Setting up sample data...');
|
|
|
|
// Unlock first 10 levels
|
|
for (let i = 1; i <= 10; i++) {
|
|
if (i <= 7) {
|
|
// Complete first 7 levels
|
|
window.campaignManager.startLevel(i);
|
|
window.campaignManager.completeLevel(i, { duration: 600 });
|
|
}
|
|
}
|
|
|
|
// Add sample preferences
|
|
window.preferenceManager.updateCategoryPreferences('contentThemes', {
|
|
edging: true,
|
|
denial: true,
|
|
pov: true
|
|
}, 1);
|
|
|
|
window.preferenceManager.updateCategoryPreferences('intensity', {
|
|
visualIntensity: 4,
|
|
mentalIntensity: 3,
|
|
taskDifficulty: 3
|
|
}, 5);
|
|
|
|
// Add sample library items
|
|
const sampleFiles = [
|
|
{ path: 'assets/pornstars/video1.mp4', tags: ['solo', 'pov', 'professional'], rating: 5 },
|
|
{ path: 'assets/pornstars/video2.mp4', tags: ['couples', 'hd', 'hardcore'], rating: 4 },
|
|
{ path: 'assets/feet/video1.mp4', tags: ['feet', 'pov', 'fetish'], rating: 4 },
|
|
{ path: 'assets/hentai/video1.mp4', tags: ['hentai', 'animated'], rating: 3 },
|
|
{ path: 'assets/BBC/video1.mp4', tags: ['bbc', 'couples'], rating: 5 }
|
|
];
|
|
|
|
sampleFiles.forEach(file => {
|
|
window.libraryManager.addMediaItem(file.path, {
|
|
tags: file.tags,
|
|
rating: file.rating
|
|
});
|
|
});
|
|
|
|
showOutput('✅ Sample data created: 7 levels complete, preferences set, 5 media items added', 'success');
|
|
}
|
|
|
|
function showLevelSelect() {
|
|
console.log('📋 Showing level select screen...');
|
|
window.academyUI.showLevelSelect();
|
|
showOutput('✅ Level select screen displayed', 'success');
|
|
}
|
|
|
|
function testCheckpointModal(levelNum) {
|
|
console.log(`⚡ Testing checkpoint modal for Level ${levelNum}...`);
|
|
window.academyUI.showCheckpointModal(levelNum);
|
|
showOutput(`✅ Checkpoint modal shown for Level ${levelNum}`, 'success');
|
|
}
|
|
|
|
function resetData() {
|
|
if (confirm('Reset all academy data?')) {
|
|
window.campaignManager.resetProgress();
|
|
window.preferenceManager.resetPreferences();
|
|
window.libraryManager.resetLibrary();
|
|
|
|
// Clear the academy setup container
|
|
const setupContainer = document.getElementById('academy-setup');
|
|
if (setupContainer) {
|
|
setupContainer.innerHTML = '';
|
|
}
|
|
|
|
showOutput('🔄 All data reset', 'info');
|
|
}
|
|
}
|
|
|
|
function showOutput(message, type = 'info') {
|
|
const outputDiv = document.getElementById('output');
|
|
outputDiv.innerHTML = `<div class="status-box ${type}">${message}</div>`;
|
|
}
|
|
|
|
// Initialize on load
|
|
window.addEventListener('DOMContentLoaded', () => {
|
|
showOutput('🎓 Academy UI Integration ready. Click "Setup Sample Data" to begin.', 'info');
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|