Initial commit
This commit is contained in:
Allen
@@ -0,0 +1,210 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Clear Cache - GamerComp</title>
|
||||
<style>
|
||||
* { box-sizing: border-box; }
|
||||
body {
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #312e81 100%);
|
||||
color: white;
|
||||
min-height: 100vh;
|
||||
margin: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 20px;
|
||||
}
|
||||
.container {
|
||||
background: rgba(255,255,255,0.1);
|
||||
border-radius: 16px;
|
||||
padding: 32px;
|
||||
max-width: 450px;
|
||||
text-align: center;
|
||||
}
|
||||
h1 { margin: 0 0 16px; font-size: 24px; }
|
||||
p { margin: 0 0 20px; opacity: 0.8; line-height: 1.5; }
|
||||
button {
|
||||
background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 16px 32px;
|
||||
border-radius: 12px;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
cursor: pointer;
|
||||
width: 100%;
|
||||
margin-bottom: 12px;
|
||||
transition: opacity 0.2s;
|
||||
}
|
||||
button:hover { opacity: 0.9; }
|
||||
button:disabled { opacity: 0.5; cursor: not-allowed; }
|
||||
.btn-secondary {
|
||||
background: rgba(255,255,255,0.2);
|
||||
}
|
||||
.status {
|
||||
margin-top: 20px;
|
||||
padding: 16px;
|
||||
border-radius: 12px;
|
||||
background: rgba(255,255,255,0.1);
|
||||
text-align: left;
|
||||
font-size: 14px;
|
||||
line-height: 1.6;
|
||||
}
|
||||
.success { background: rgba(34, 197, 94, 0.3); }
|
||||
.error { background: rgba(239, 68, 68, 0.3); }
|
||||
a { color: #a5b4fc; }
|
||||
.divider {
|
||||
height: 1px;
|
||||
background: rgba(255,255,255,0.2);
|
||||
margin: 24px 0;
|
||||
}
|
||||
.manual-section {
|
||||
background: rgba(255,255,255,0.05);
|
||||
border-radius: 12px;
|
||||
padding: 16px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
.manual-section h3 {
|
||||
margin: 0 0 12px;
|
||||
font-size: 16px;
|
||||
}
|
||||
.shortcut {
|
||||
display: inline-block;
|
||||
background: rgba(0,0,0,0.3);
|
||||
padding: 4px 10px;
|
||||
border-radius: 6px;
|
||||
font-family: monospace;
|
||||
font-size: 14px;
|
||||
margin: 2px;
|
||||
}
|
||||
.steps {
|
||||
text-align: left;
|
||||
font-size: 14px;
|
||||
opacity: 0.9;
|
||||
}
|
||||
.steps li {
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<h1>🔄 Clear Cache</h1>
|
||||
<p>Having issues seeing updates? Clear all cached data for GamerComp.</p>
|
||||
|
||||
<button onclick="clearAllCaches()" id="clearBtn">Clear All Caches</button>
|
||||
<button onclick="forceReload()" class="btn-secondary" id="reloadBtn">Force Hard Reload</button>
|
||||
|
||||
<div id="status" class="status" style="display:none;"></div>
|
||||
|
||||
<div class="manual-section">
|
||||
<h3>🔧 Manual Hard Refresh</h3>
|
||||
<p style="font-size: 13px; margin-bottom: 12px;">If the buttons above don't work, try these keyboard shortcuts:</p>
|
||||
<p style="margin-bottom: 8px;">
|
||||
<strong>Windows/Linux:</strong><br>
|
||||
<span class="shortcut">Ctrl + Shift + R</span> or <span class="shortcut">Ctrl + F5</span>
|
||||
</p>
|
||||
<p style="margin-bottom: 0;">
|
||||
<strong>Mac:</strong><br>
|
||||
<span class="shortcut">Cmd + Shift + R</span>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="divider"></div>
|
||||
|
||||
<p style="font-size: 14px; margin-bottom: 0;">
|
||||
<a href="/">← Back to GamerComp</a>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
async function clearAllCaches() {
|
||||
const btn = document.getElementById('clearBtn');
|
||||
const status = document.getElementById('status');
|
||||
btn.disabled = true;
|
||||
btn.textContent = 'Clearing...';
|
||||
status.style.display = 'block';
|
||||
status.className = 'status';
|
||||
status.textContent = 'Working...';
|
||||
|
||||
let results = [];
|
||||
|
||||
try {
|
||||
// 1. Unregister all service workers
|
||||
if ('serviceWorker' in navigator) {
|
||||
const registrations = await navigator.serviceWorker.getRegistrations();
|
||||
for (const registration of registrations) {
|
||||
await registration.unregister();
|
||||
results.push('✓ Service worker unregistered');
|
||||
}
|
||||
if (registrations.length === 0) {
|
||||
results.push('✓ No service workers to remove');
|
||||
}
|
||||
}
|
||||
|
||||
// 2. Clear all caches (Cache API)
|
||||
if ('caches' in window) {
|
||||
const cacheNames = await caches.keys();
|
||||
for (const cacheName of cacheNames) {
|
||||
await caches.delete(cacheName);
|
||||
results.push(`✓ Cache "${cacheName}" deleted`);
|
||||
}
|
||||
if (cacheNames.length === 0) {
|
||||
results.push('✓ No caches to clear');
|
||||
}
|
||||
}
|
||||
|
||||
// 3. Clear localStorage (except auth token)
|
||||
const token = localStorage.getItem('token');
|
||||
localStorage.clear();
|
||||
if (token) {
|
||||
localStorage.setItem('token', token);
|
||||
results.push('✓ LocalStorage cleared (kept login)');
|
||||
} else {
|
||||
results.push('✓ LocalStorage cleared');
|
||||
}
|
||||
|
||||
// 4. Clear sessionStorage
|
||||
sessionStorage.clear();
|
||||
results.push('✓ SessionStorage cleared');
|
||||
|
||||
status.className = 'status success';
|
||||
status.innerHTML = `
|
||||
<strong>✅ All caches cleared!</strong><br><br>
|
||||
${results.join('<br>')}<br><br>
|
||||
<strong>Next step:</strong> Click "Force Hard Reload" below or press <span class="shortcut">Ctrl+Shift+R</span> to reload with fresh files.
|
||||
`;
|
||||
|
||||
btn.textContent = 'Done!';
|
||||
|
||||
} catch (err) {
|
||||
status.className = 'status error';
|
||||
status.textContent = 'Error: ' + err.message;
|
||||
btn.disabled = false;
|
||||
btn.textContent = 'Try Again';
|
||||
}
|
||||
}
|
||||
|
||||
function forceReload() {
|
||||
const status = document.getElementById('status');
|
||||
status.style.display = 'block';
|
||||
status.className = 'status';
|
||||
status.textContent = 'Reloading with fresh files...';
|
||||
|
||||
// Add cache-busting query param and reload
|
||||
// Using location.href with a timestamp forces a fresh fetch
|
||||
const freshUrl = '/?_=' + Date.now();
|
||||
|
||||
// Try to clear browser cache via fetch with cache: 'reload'
|
||||
// Then navigate to homepage
|
||||
fetch('/', { cache: 'reload' })
|
||||
.finally(() => {
|
||||
window.location.href = freshUrl;
|
||||
});
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user