Jofthomas's picture
Upload 12 files
a303b0f verified
<!DOCTYPE html>
<html>
<head>
<title>LLM GeoGuessr</title>
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
<style>
#auth-card, #gate-card { max-width: 560px; margin: 20px auto; background: white; padding: 24px; border-radius: var(--border-radius); box-shadow: 0 4px 12px rgba(0,0,0,0.1); }
.muted { color: #666; font-size: 0.95rem; }
</style>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="referrer" content="no-referrer" />
<meta http-equiv="Cross-Origin-Opener-Policy" content="same-origin" />
<meta http-equiv="Cross-Origin-Embedder-Policy" content="require-corp" />
<meta http-equiv="X-Content-Type-Options" content="nosniff" />
<meta http-equiv="X-Frame-Options" content="DENY" />
<meta http-equiv="Referrer-Policy" content="strict-origin-when-cross-origin" />
<meta http-equiv="Cache-Control" content="no-store" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />
<meta name="google-maps-api-key" content="{{ google_maps_api_key }}" />
<meta name="description" content="Daily GeoGuessr-style challenge with LLM rival" />
<meta name="theme-color" content="#F97316" />
<link rel="preconnect" href="https://maps.googleapis.com" crossorigin>
<link rel="preconnect" href="https://maps.gstatic.com" crossorigin>
<link rel="dns-prefetch" href="https://maps.googleapis.com">
<link rel="dns-prefetch" href="https://maps.gstatic.com">
<link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='0.9em' font-size='90'>🗺️</text></svg>">
<meta name="robots" content="noindex, nofollow">
</head>
<body>
<h1>LLM GeoGuessr</h1>
<div id="auth-card">
<div id="auth-section">
<p class="muted">Sign in to play today’s single round set.</p>
<a id="signin-btn" href="/login"><button>Sign in with Hugging Face</button></a>
<div id="signedin" style="display:none;">
<p>Signed in as <strong id="username"></strong></p>
<a href="/logout"><button>Sign out</button></a>
</div>
</div>
</div>
<div id="gate-card">
<div id="play-gate">
<label for="difficulty-select-lobby">Choose a difficulty:</label>
<select id="difficulty-select-lobby">
<option value="easy">Easy</option>
<option value="medium">Medium</option>
<option value="hard">Hard</option>
</select>
<button id="start-btn" disabled>Start Today’s Game</button>
<p id="limit-msg" class="muted" style="display:none;"></p>
</div>
</div>
<script src="{{ url_for('static', filename='script.js') }}"></script>
<script async defer src="https://maps.googleapis.com/maps/api/js?key={{ google_maps_api_key }}&callback=initIndexApp"></script>
</body>
</html>