mirror of
https://github.com/Kizuren/uLinkShortener.git
synced 2025-12-21 21:16:17 +01:00
85 lines
3.1 KiB
HTML
85 lines
3.1 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>URL Shortener</title>
|
|
<link rel="stylesheet" href="/static/style.css">
|
|
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
|
<script>
|
|
// Pass server-side stats to frontend
|
|
window.stats = {{ stats|tojson|safe }};
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
createCharts();
|
|
});
|
|
</script>
|
|
<script src="/static/script.js"></script>
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<h1>URL Shortener</h1>
|
|
|
|
<div id="auth-section">
|
|
<div class="error-message" id="auth-error"></div>
|
|
<div class="form-group">
|
|
<button onclick="register()">Register</button>
|
|
<div class="form-group">
|
|
<input type="text" id="account-id" placeholder="Enter 8-digit Account ID">
|
|
<button onclick="login()">Login</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="url-section" style="display: none;">
|
|
<div class="account-info">
|
|
<span>Account ID: <strong id="current-account-display"></strong></span>
|
|
<button onclick="logout()" class="logout-btn">Logout</button>
|
|
</div>
|
|
<div class="error-message" id="url-error"></div>
|
|
<div class="success-message" id="url-success"></div>
|
|
<div class="form-group">
|
|
<input type="url" id="url-input"
|
|
placeholder="Enter URL to shorten"
|
|
pattern="https?://.+"
|
|
title="Please enter a valid URL starting with http:// or https://"
|
|
required>
|
|
<button onclick="createShortUrl()">Shorten URL</button>
|
|
</div>
|
|
<div id="result" style="display: none;"></div>
|
|
<div id="analytics"></div>
|
|
</div>
|
|
|
|
<div id="stats">
|
|
<h2>Public Statistics</h2>
|
|
|
|
<div class="stats-grid">
|
|
<div class="stats-card">
|
|
<h3>IP Versions</h3>
|
|
<canvas id="ipChart"></canvas>
|
|
</div>
|
|
<div class="stats-card">
|
|
<h3>Operating Systems</h3>
|
|
<canvas id="osChart"></canvas>
|
|
</div>
|
|
<div class="stats-card">
|
|
<h3>Countries</h3>
|
|
<canvas id="countryChart"></canvas>
|
|
</div>
|
|
<div class="stats-card">
|
|
<h3>ISPs</h3>
|
|
<canvas id="ispChart"></canvas>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="dialog-overlay" id="deleteDialog">
|
|
<div class="dialog-box">
|
|
<h3 class="dialog-title">Confirm Delete</h3>
|
|
<p class="dialog-message">Are you sure you want to delete this link? This action cannot be undone.</p>
|
|
<div class="dialog-buttons">
|
|
<button class="dialog-cancel" onclick="closeDeleteDialog()">Cancel</button>
|
|
<button class="dialog-confirm" id="confirmDelete">Delete</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|