mirror of
https://github.com/SinTan1729/chhoto-url.git
synced 2025-12-06 05:24:25 -08:00
268 lines
8.5 KiB
HTML
268 lines
8.5 KiB
HTML
<!-- SPDX-FileCopyrightText: 2023 Sayantan Santra <sayantan.santra689@gmail.com> -->
|
|
<!-- SPDX-License-Identifier: MIT -->
|
|
|
|
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta
|
|
name="viewport"
|
|
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"
|
|
/>
|
|
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
|
|
|
|
<title>Chhoto URL</title>
|
|
|
|
<meta
|
|
name="description"
|
|
content="A simple selfhosted URL shortener with no unnecessary features."
|
|
/>
|
|
<meta property="og:title" content="Chhoto URL" />
|
|
<meta
|
|
property="og:description"
|
|
content="A simple selfhosted URL shortener with no unnecessary features."
|
|
/>
|
|
|
|
<meta
|
|
name="keywords"
|
|
content="url shortener, link shortener, self hosted, open source"
|
|
/>
|
|
<link
|
|
rel="icon"
|
|
type="image/x-icon"
|
|
href="assets/favicon.ico"
|
|
sizes="any"
|
|
/>
|
|
<link rel="icon" type="image/svg+xml" href="assets/favicon.svg" />
|
|
<link
|
|
rel="icon"
|
|
type="image/png"
|
|
href="assets/favicon-32.png"
|
|
sizes="32x32"
|
|
/>
|
|
<link
|
|
rel="icon"
|
|
type="image/png"
|
|
href="assets/favicon-196.png"
|
|
sizes="196x196"
|
|
/>
|
|
|
|
<script
|
|
src="https://cdn.jsdelivr.net/npm/qrcodejs@1.0.0/qrcode.min.js"
|
|
async
|
|
></script>
|
|
<script src="static/script.js" defer></script>
|
|
<link
|
|
rel="stylesheet"
|
|
href="https://cdn.jsdelivr.net/npm/purecss@3.0.0/build/pure-min.css"
|
|
integrity="sha384-X38yfunGUhNzHpBaEBsWLO+A0HDYOQi8ufWDkZ0k9e0eXz/tH3II7uKZ9msv++Ls"
|
|
crossorigin="anonymous"
|
|
/>
|
|
<link
|
|
rel="stylesheet"
|
|
type="text/css"
|
|
target="_blank"
|
|
href="static/styles.css"
|
|
/>
|
|
</head>
|
|
|
|
<body>
|
|
<div class="container" id="container">
|
|
<form class="pure-form pure-form-aligned" name="new-url-form">
|
|
<fieldset>
|
|
<legend id="logo">
|
|
<img src="assets/favicon.svg" alt="chhoto-url-logo" /> Chhoto URL
|
|
</legend>
|
|
<div class="pure-control-group">
|
|
<label for="longUrl">Long URL</label>
|
|
<input
|
|
class="chhoto-input"
|
|
type="url"
|
|
name="longUrl"
|
|
id="longUrl"
|
|
placeholder="Please enter a valid URL"
|
|
required
|
|
/>
|
|
</div>
|
|
<div class="pure-control-group">
|
|
<label for="shortUrl">Short URL (optional)</label>
|
|
<input
|
|
class="chhoto-input"
|
|
type="text"
|
|
name="shortUrl"
|
|
id="shortUrl"
|
|
placeholder="Only a-z, 0-9, - and _ are allowed"
|
|
pattern="[a-z0-9\-_]+"
|
|
title="Only a-z, 0-9, - and _ are allowed"
|
|
autocapitalize="off"
|
|
/>
|
|
</div>
|
|
<div class="pure-control-group">
|
|
<label for="expiryDelay">Expiry</label>
|
|
<select class="chhoto-select" name="expiryDelay" id="expiryDelay">
|
|
<option value="0">Never</option>
|
|
<option value="600">10 Minutes</option>
|
|
<option value="1800">30 Minutes</option>
|
|
<option value="3600">1 Hour</option>
|
|
<option value="43200">12 Hours</option>
|
|
<option value="86400">1 Day</option>
|
|
<option value="604800">1 Week</option>
|
|
<option value="2592000">1 Month</option>
|
|
<option value="7776000">3 Months</option>
|
|
<option value="15552000">6 Months</option>
|
|
<option value="31536000">1 Year</option>
|
|
</select>
|
|
</div>
|
|
<div class="pure-controls" id="controls">
|
|
<button class="chhoto-button pure-button pure-button-primary">
|
|
Shorten!
|
|
</button>
|
|
<div id="alert-box"> </div>
|
|
</div>
|
|
</fieldset>
|
|
</form>
|
|
|
|
<p id="loading-text">Loading links table...</p>
|
|
<table class="chhoto-table pure-table" id="table-box" hidden>
|
|
<caption>
|
|
<span>Active links</span>
|
|
<span id="pageControls" hidden="true">
|
|
<button
|
|
id="prevPageBtn"
|
|
class="svg-button"
|
|
title="Previous Page"
|
|
></button>
|
|
<button
|
|
id="nextPageBtn"
|
|
class="svg-button"
|
|
title="Next Page"
|
|
></button>
|
|
</span>
|
|
</caption>
|
|
<br />
|
|
<thead>
|
|
<tr>
|
|
<th name="numColumn">#</th>
|
|
<th id="short-url-header">Short URL</th>
|
|
<th>Long URL</th>
|
|
<th name="hitsColumn">Hits</th>
|
|
<th name="expiryColumn">Expiry</th>
|
|
<th name="actions">Actions</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="url-table">
|
|
<!-- The links would be inserted here -->
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<div name="links-div">
|
|
<button class="linkButton" id="admin-button" hidden>login</button>
|
|
|
|
<a
|
|
id="version-number"
|
|
href="https://github.com/SinTan1729/chhoto-url"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
hidden
|
|
>Source Code</a
|
|
>
|
|
<!-- The version number would be inserted here -->
|
|
</div>
|
|
|
|
<dialog id="login-dialog" closedby="none">
|
|
<form class="pure-form" name="login-form">
|
|
<p>Please enter password to access this website</p>
|
|
<div>
|
|
<input class="chhoto-input" type="password" id="password" />
|
|
<button
|
|
type="button"
|
|
id="password-eye-button"
|
|
title="Toggle Password Visibility"
|
|
>
|
|
👁
|
|
</button>
|
|
</div>
|
|
<button
|
|
class="chhoto-button pure-button pure-button-primary"
|
|
value="default"
|
|
>
|
|
Log in
|
|
</button>
|
|
<p id="wrong-pass" hidden>Wrong password!</p>
|
|
</form>
|
|
</dialog>
|
|
|
|
<dialog id="edit-dialog">
|
|
<form class="pure-form pure-form-stacked" name="edit-form">
|
|
<p>
|
|
Enter new long url for <span id="edit-link">placeholder</span>. <br />
|
|
Please check twice before you submit. It cannot be undone.
|
|
</p>
|
|
<fieldset>
|
|
<input class="chhoto-input" type="url" id="edited-url" />
|
|
<label for="edit-checkbox">
|
|
<input type="checkbox" id="edit-checkbox" checked="unchecked" />
|
|
Reset hit count
|
|
</label>
|
|
<button
|
|
class="chhoto-button pure-button pure-button-primary"
|
|
id="edit-cancel-button"
|
|
type="button"
|
|
>
|
|
Cancel
|
|
</button>
|
|
<button
|
|
class="chhoto-button pure-button pure-button-primary"
|
|
value="default"
|
|
>
|
|
Submit
|
|
</button>
|
|
</fieldset>
|
|
</form>
|
|
</dialog>
|
|
|
|
<dialog id="qr-code-dialog">
|
|
<!-- https://svgicons.com/icon/10667/download-solid -->
|
|
<a class="qr-button" id="qr-download" href="">
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
width="24"
|
|
height="24"
|
|
viewBox="0 0 24 24"
|
|
>
|
|
<path
|
|
fill="currentColor"
|
|
fill-rule="evenodd"
|
|
d="M5 16.25a.75.75 0 0 1 .75.75v2c0 .138.112.25.25.25h12a.25.25 0 0 0 .25-.25v-2a.75.75 0 0 1 1.5 0v2A1.75 1.75 0 0 1 18 20.75H6A1.75 1.75 0 0 1 4.25 19v-2a.75.75 0 0 1 .75-.75"
|
|
clip-rule="evenodd"
|
|
/>
|
|
<path
|
|
fill="currentColor"
|
|
d="M10.738 3.75a.992.992 0 0 0-.988.906a36.618 36.618 0 0 0-.082 5.27c-.247.013-.493.03-.74.047l-1.49.109a.76.76 0 0 0-.585 1.167a15.555 15.555 0 0 0 4.032 4.258l.597.429a.888.888 0 0 0 1.036 0l.597-.429a15.556 15.556 0 0 0 4.032-4.258a.76.76 0 0 0-.585-1.167l-1.49-.109a42.274 42.274 0 0 0-.74-.047a36.62 36.62 0 0 0-.081-5.27a.992.992 0 0 0-.989-.906z"
|
|
/>
|
|
</svg>
|
|
</a>
|
|
<!-- https://svgicons.com/icon/13141/cross-filled -->
|
|
<button class="qr-button" id="qr-close">
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
width="24"
|
|
height="24"
|
|
viewBox="0 0 24 24"
|
|
>
|
|
<g fill="currentColor" fill-rule="evenodd" clip-rule="evenodd">
|
|
<path
|
|
d="M5.47 5.47a.75.75 0 0 1 1.06 0l12 12a.75.75 0 1 1-1.06 1.06l-12-12a.75.75 0 0 1 0-1.06"
|
|
/>
|
|
<path
|
|
d="M18.53 5.47a.75.75 0 0 1 0 1.06l-12 12a.75.75 0 0 1-1.06-1.06l12-12a.75.75 0 0 1 1.06 0"
|
|
/>
|
|
</g>
|
|
</svg>
|
|
</button>
|
|
<div id="qr-code"></div>
|
|
</dialog>
|
|
</body>
|
|
</html>
|