294 lines
11 KiB
HTML
294 lines
11 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Campaign Manager Test - Subphase 1.1</title>
|
|
<style>
|
|
body {
|
|
font-family: Arial, sans-serif;
|
|
max-width: 800px;
|
|
margin: 50px auto;
|
|
padding: 20px;
|
|
background: #1a1a1a;
|
|
color: #e0e0e0;
|
|
}
|
|
.test-section {
|
|
background: #2a2a2a;
|
|
padding: 20px;
|
|
margin: 20px 0;
|
|
border-radius: 8px;
|
|
border: 1px solid #333;
|
|
}
|
|
h1 { color: #ff006e; }
|
|
h2 { color: #8338ec; margin-top: 0; }
|
|
button {
|
|
background: linear-gradient(135deg, #ff006e, #8338ec);
|
|
color: white;
|
|
border: none;
|
|
padding: 10px 20px;
|
|
margin: 5px;
|
|
border-radius: 4px;
|
|
cursor: pointer;
|
|
font-weight: 600;
|
|
}
|
|
button:hover {
|
|
transform: translateY(-2px);
|
|
box-shadow: 0 4px 8px rgba(255, 0, 110, 0.4);
|
|
}
|
|
.status {
|
|
padding: 10px;
|
|
margin: 10px 0;
|
|
border-radius: 4px;
|
|
background: #333;
|
|
}
|
|
.success { border-left: 4px solid #06ffa5; }
|
|
.error { border-left: 4px solid #ff006e; }
|
|
.info { border-left: 4px solid #8338ec; }
|
|
pre {
|
|
background: #0a0a0a;
|
|
padding: 10px;
|
|
border-radius: 4px;
|
|
overflow-x: auto;
|
|
}
|
|
.test-result {
|
|
margin: 10px 0;
|
|
padding: 8px;
|
|
border-radius: 4px;
|
|
}
|
|
.pass { background: #06ffa533; border-left: 4px solid #06ffa5; }
|
|
.fail { background: #ff006e33; border-left: 4px solid #ff006e; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<h1>🎓 Campaign Manager Test - Subphase 1.1</h1>
|
|
|
|
<div class="test-section">
|
|
<h2>Campaign Progression System</h2>
|
|
<p>Testing basic level unlocking, completion tracking, and failure states.</p>
|
|
|
|
<button onclick="runAllTests()">🧪 Run All Tests</button>
|
|
<button onclick="resetProgress()">🔄 Reset Progress</button>
|
|
<button onclick="showProgress()">📊 Show Progress</button>
|
|
|
|
<div id="test-results"></div>
|
|
</div>
|
|
|
|
<div class="test-section">
|
|
<h2>Manual Testing</h2>
|
|
<button onclick="startLevel(1)">Start Level 1</button>
|
|
<button onclick="completeLevel(1)">Complete Level 1</button>
|
|
<button onclick="failLevel(1, 'cumming')">Fail Level 1 (cumming)</button>
|
|
<button onclick="startLevel(2)">Start Level 2 (should fail if L1 not complete)</button>
|
|
|
|
<div id="manual-results"></div>
|
|
</div>
|
|
|
|
<div class="test-section">
|
|
<h2>Current Progress</h2>
|
|
<div id="progress-display"></div>
|
|
</div>
|
|
|
|
<!-- Load dependencies -->
|
|
<script src="src/data/gameData.js"></script>
|
|
<script src="src/features/academy/campaignManager.js"></script>
|
|
<script>
|
|
// campaignManager is now available globally
|
|
|
|
// Test functions
|
|
window.runAllTests = function() {
|
|
const results = document.getElementById('test-results');
|
|
results.innerHTML = '<h3>Running Tests...</h3>';
|
|
|
|
const tests = [];
|
|
|
|
// Test 1: Initial state
|
|
campaignManager.resetProgress();
|
|
const stats = campaignManager.getProgressStats();
|
|
tests.push({
|
|
name: 'Initial state - L1 unlocked, L2 locked',
|
|
pass: stats.currentLevel === 1 && stats.highestUnlockedLevel === 1,
|
|
details: `Current: ${stats.currentLevel}, Highest: ${stats.highestUnlockedLevel}`
|
|
});
|
|
|
|
// Test 2: Can start L1
|
|
const l1Start = campaignManager.startLevel(1);
|
|
tests.push({
|
|
name: 'Can start Level 1',
|
|
pass: l1Start !== null && l1Start.levelNum === 1,
|
|
details: l1Start ? `Started ${l1Start.arc} arc` : 'Failed to start'
|
|
});
|
|
|
|
// Test 3: Cannot start L2 before completing L1
|
|
const l2Locked = campaignManager.startLevel(2);
|
|
tests.push({
|
|
name: 'Cannot start Level 2 (locked)',
|
|
pass: l2Locked === null,
|
|
details: l2Locked === null ? 'Correctly blocked' : 'ERROR: Started locked level'
|
|
});
|
|
|
|
// Test 4: Complete L1
|
|
const l1Complete = campaignManager.completeLevel(1, { duration: 300 });
|
|
tests.push({
|
|
name: 'Complete Level 1 unlocks Level 2',
|
|
pass: l1Complete.nextLevelUnlocked && l1Complete.nextLevel === 2,
|
|
details: `Next level: ${l1Complete.nextLevel}, Unlocked: ${l1Complete.nextLevelUnlocked}`
|
|
});
|
|
|
|
// Test 5: Can now start L2
|
|
const l2Start = campaignManager.startLevel(2);
|
|
tests.push({
|
|
name: 'Can start Level 2 after completing L1',
|
|
pass: l2Start !== null && l2Start.levelNum === 2,
|
|
details: l2Start ? `Started level ${l2Start.levelNum}` : 'Failed to start'
|
|
});
|
|
|
|
// Test 6: Fail L2
|
|
campaignManager.failLevel(2, 'cumming');
|
|
const statsAfterFail = campaignManager.getProgressStats();
|
|
tests.push({
|
|
name: 'Failing L2 allows restart',
|
|
pass: statsAfterFail.failedAttempts > 0,
|
|
details: `Failed attempts: ${statsAfterFail.failedAttempts}`
|
|
});
|
|
|
|
// Test 7: Progress persists
|
|
const beforeReload = campaignManager.getProgressStats();
|
|
// Simulate reload by getting fresh data
|
|
const savedData = JSON.parse(localStorage.getItem('webGame-data'));
|
|
tests.push({
|
|
name: 'Progress persists in localStorage',
|
|
pass: savedData.academyProgress !== undefined && savedData.academyProgress.highestUnlockedLevel === 2,
|
|
details: `Highest unlocked: ${savedData.academyProgress.highestUnlockedLevel}`
|
|
});
|
|
|
|
// Test 8: Arc detection
|
|
const l1Arc = campaignManager.getArcForLevel(1);
|
|
const l6Arc = campaignManager.getArcForLevel(6);
|
|
tests.push({
|
|
name: 'Arc detection works',
|
|
pass: l1Arc === 'Foundation' && l6Arc === 'Feature Discovery',
|
|
details: `L1: ${l1Arc}, L6: ${l6Arc}`
|
|
});
|
|
|
|
// Test 9: Checkpoint detection
|
|
const isCheckpoint1 = campaignManager.isCheckpointLevel(1);
|
|
const isCheckpoint2 = campaignManager.isCheckpointLevel(2);
|
|
const isCheckpoint5 = campaignManager.isCheckpointLevel(5);
|
|
tests.push({
|
|
name: 'Checkpoint detection works',
|
|
pass: isCheckpoint1 && !isCheckpoint2 && isCheckpoint5,
|
|
details: `L1: ${isCheckpoint1}, L2: ${isCheckpoint2}, L5: ${isCheckpoint5}`
|
|
});
|
|
|
|
// Display results
|
|
let html = '<h3>Test Results</h3>';
|
|
let passed = 0;
|
|
let failed = 0;
|
|
|
|
tests.forEach(test => {
|
|
if (test.pass) passed++;
|
|
else failed++;
|
|
|
|
html += `
|
|
<div class="test-result ${test.pass ? 'pass' : 'fail'}">
|
|
<strong>${test.pass ? '✅' : '❌'} ${test.name}</strong><br>
|
|
<small>${test.details}</small>
|
|
</div>
|
|
`;
|
|
});
|
|
|
|
html += `<div class="status ${failed === 0 ? 'success' : 'error'}">
|
|
<strong>Results: ${passed}/${tests.length} tests passed</strong>
|
|
</div>`;
|
|
|
|
results.innerHTML = html;
|
|
|
|
// Update progress display
|
|
showProgress();
|
|
};
|
|
|
|
window.resetProgress = function() {
|
|
campaignManager.resetProgress();
|
|
document.getElementById('manual-results').innerHTML =
|
|
'<div class="status success">✅ Progress reset to Level 1</div>';
|
|
showProgress();
|
|
};
|
|
|
|
window.startLevel = function(levelNum) {
|
|
const result = campaignManager.startLevel(levelNum);
|
|
const resultsDiv = document.getElementById('manual-results');
|
|
|
|
if (result) {
|
|
resultsDiv.innerHTML = `
|
|
<div class="status success">
|
|
✅ Started Level ${result.levelNum}<br>
|
|
Arc: ${result.arc}<br>
|
|
Checkpoint: ${result.isCheckpoint}
|
|
</div>
|
|
`;
|
|
} else {
|
|
resultsDiv.innerHTML = `
|
|
<div class="status error">
|
|
❌ Cannot start Level ${levelNum} - Level is locked
|
|
</div>
|
|
`;
|
|
}
|
|
showProgress();
|
|
};
|
|
|
|
window.completeLevel = function(levelNum) {
|
|
const result = campaignManager.completeLevel(levelNum, { duration: 300 });
|
|
const resultsDiv = document.getElementById('manual-results');
|
|
|
|
resultsDiv.innerHTML = `
|
|
<div class="status success">
|
|
✅ Level ${result.levelCompleted} completed!<br>
|
|
${result.nextLevelUnlocked ? `🔓 Level ${result.nextLevel} unlocked!` : ''}<br>
|
|
${result.arcComplete ? `🎉 ${result.completedArc} Arc complete!` : ''}
|
|
</div>
|
|
`;
|
|
showProgress();
|
|
};
|
|
|
|
window.failLevel = function(levelNum, reason) {
|
|
campaignManager.failLevel(levelNum, reason);
|
|
const resultsDiv = document.getElementById('manual-results');
|
|
|
|
resultsDiv.innerHTML = `
|
|
<div class="status error">
|
|
❌ Level ${levelNum} failed (${reason})<br>
|
|
You can restart this level.
|
|
</div>
|
|
`;
|
|
showProgress();
|
|
};
|
|
|
|
window.showProgress = function() {
|
|
const stats = campaignManager.getProgressStats();
|
|
const progress = window.gameData.academyProgress;
|
|
|
|
document.getElementById('progress-display').innerHTML = `
|
|
<pre>${JSON.stringify(stats, null, 2)}</pre>
|
|
<h3>Full Progress Data:</h3>
|
|
<pre>${JSON.stringify(progress, null, 2)}</pre>
|
|
`;
|
|
};
|
|
|
|
// Initial display
|
|
showProgress();
|
|
|
|
console.log('✅ Campaign Manager Test Page Ready');
|
|
console.log('📝 Run runAllTests() to execute automated tests');
|
|
</script>
|
|
|
|
<!-- Electron preload (if needed) -->
|
|
<script>
|
|
// Check if running in Electron
|
|
if (typeof require !== 'undefined') {
|
|
console.log('🖥️ Running in Electron');
|
|
}
|
|
</script>
|
|
</body>
|
|
</html>
|