<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>GeoDB WASM Demo</title>
<link data-trunk rel="rust" data-wasm-opt="z"/>
<style>
body {
font-family: system-ui, sans-serif;
margin: 30px;
max-width: 780px;
}
h1 {
color: #333;
}
input {
width: 100%;
padding: 8px;
margin: 6px 0 12px 0;
font-size: 16px;
border: 1px solid #ccc;
border-radius: 4px;
}
.result-card {
border-radius: 6px;
padding: 12px;
background: #f8f8f8;
margin-top: 10px;
line-height: 1.4;
border-left: 4px solid #444;
}
.flag {
font-size: 32px;
margin-right: 12px;
vertical-align: middle;
}
.kind {
font-weight: bold;
color: #444;
}
.small {
color: #555;
font-size: 14px;
}
.section-title {
margin-top: 28px;
border-bottom: 1px solid #ddd;
padding-bottom: 4px;
font-size: 20px;
color: #222;
}
.stats-box {
background: #eef3ff;
padding: 12px;
border-radius: 6px;
margin-bottom: 20px;
border-left: 5px solid #4a6cff;
}
.url-params-box {
background: #fff8e1;
padding: 12px;
border-radius: 6px;
margin-bottom: 20px;
border-left: 5px solid #ffc107;
}
.city-marker {
color: #d32f2f;
font-weight: bold;
}
</style>
</head>
<body>
<h1>GeoDB WASM Demo</h1>
<div id="stats" class="stats-box">
Initializing WASM...
</div>
<div id="urlParams" class="url-params-box" style="display:none">
<strong>URL Parameters detected:</strong>
<div id="urlParamsContent"></div>
</div>
<p class="info">All searches run fully offline inside WASM after initial load.</p>
<div class="section-title">Search Country (ISO2)</div>
<input id="countryInput" placeholder="Enter ISO2 code (e.g. US, DE, CN)"/>
<div id="countryOut"></div>
<div class="section-title">Search by Phone Code</div>
<input id="phoneInput" placeholder="Enter phone code (e.g. +1, +49, +86)"/>
<div id="phoneOut"></div>
<div class="section-title">Search City</div>
<input id="cityInput" placeholder="Enter city name (e.g. Zürich, Tokyo, Lüdinghausen)"/>
<div id="cityOut"></div>
<div class="section-title">Smart Search (Country + State + City)</div>
<input id="smartInput" placeholder="Try: de, germany, bayern, wuhan, tokyo, +49"/>
<div id="smartOut"></div>
<script type="module">
window.addEventListener('load', () => {
setTimeout(() => {
if (window.wasmBindings && window.wasmBindings.run_app) {
window.wasmBindings.run_app();
console.log("✓ GeoDB WASM Initialized via bindings");
}
}, 100);
});
</script>
</body>
</html>