working changes

This commit is contained in:
Enstrayed
2024-04-09 15:02:16 -07:00
parent 98de002e14
commit 3b96e07d13
8 changed files with 317 additions and 102 deletions

View File

@@ -0,0 +1,61 @@
//Firefox check
window.onload = function() {
document.getElementById('resultfeed').value = "hii :3"
if (navigator.userAgent.includes("Firefox")) {
document.getElementById('resultfeed').value += `\nClipboard functionality does not work on Firefox.`
document.getElementById('clipboard1').disabled = true
document.getElementById('clipboard2').disabled = true
}
}
function makeRandomHex(amount) {
const characters = "1234567890abcdef"
let counter = 0
let result = ""
while (counter < amount) {
result += characters.charAt(Math.floor(Math.random() * characters.length))
counter += 1
}
return result
}
function randomUrlTick() {
if (document.getElementById("randomizationtoggle").checked == true) {
document.getElementById("targetfield").disabled = true
document.getElementById("targetfield").value = makeRandomHex(6)
} else {
document.getElementById("targetfield").disabled = false
document.getElementById("targetfield").value = null
}
}
function buttonCopyResult() {
navigator.clipboard.writeText(`${document.location.href}${document.getElementById("urlfield").value}`)
}
function buttonFillFromClipboard() {
navigator.clipboard.readText().then(res => {
document.getElementById("valuefield").value = res;
})
}
function postData() {
fetch("http://nrdesktop:8081/etydwrite", {
method: "POST",
mode: "cors",
headers: {
"Authorization": document.getElementById("authfield").value
},
body: JSON.stringify({
"target": document.getElementById("targetfield").value,
"value": document.getElementById("valuefield").value,
"action": document.getElementById("actiondropdown").value,
"random": document.getElementById("randomizationtoggle").checked
})
}).then(response => {
document.getElementById("resultfeed").value += `\n${response.status} ${response.body}`
}).catch(error => {
document.getElementById("resultfeed").value += `\nError: ${error}`
})
}

View File

@@ -0,0 +1,22 @@
body {
font-family: Arial, Helvetica, sans-serif;
}
.flexbox {
display: flex;
flex-wrap: wrap;
}
.marginright1em {
margin-right: 1em;
}
.resultfeed {
height: 100%;
}
@media (max-width: 700px) {
.resultfeed {
min-height: 20vh;
}
}

75
etydFrontend/index.html Normal file
View File

@@ -0,0 +1,75 @@
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="_static/etyd.js"></script>
<link rel="stylesheet" href="_static/index.css">
<title>etyd.cc</title>
</head>
<body>
<!--Title-->
<h1>etyd.cc URL Shortener</h1>
<hr>
<div class="flexbox">
<div class="marginright1em">
<!--Input-->
<label for="auth">Authorization:</label><br>
<input type="password" id="authfield" data-bwautofill> <label>CTRL+Shift+L to Autofill</label><br>
<label for="url">URL (API Target):</label><br>
<input type="text" id="targetfield"><input type="checkbox" id="randomizationtoggle" onclick="randomUrlTick()"> <label>Random</label><br>
<label for="value">Value (Redirect Target):</label><br>
<input type="text" id="valuefield">
<button onclick="buttonFillFromClipboard()" id="clipboard1">Clipboard</button><br>
<label for="action">Action:</label><br>
<select name="action" id="actiondropdown">
<option value="POST">Add</option>
<option value="DELETE">Delete</option>
</select>
<button onclick="postData()">POST Data</button>
<button onclick="buttonCopyResult()" id="clipboard2">Copy Shortened URL</button>
<label id="copyconfirmation" style="display: none;">OK</label><br><br>
</div>
<div>
<textarea id="resultfeed" cols="50" class="resultfeed" readonly></textarea>
</div>
</div>
<hr>
<!--Details-->
<div class="flexbox">
<div class="marginright1em">
<h2>Instructions</h2>
<p>
1. Enter your API Key in the 'Authorization' field <br>
2. Enter the shortened URL you want to act upon under the 'URL' field<br>
3. Enter the URL that the user will be redirected to under the 'Value' field<br>
4. Change 'Action' depending if you want to create or delete a URL<br>
5. Press 'POST Data' to submit the form to the server
</p>
</div>
<div>
<h2>Status Code Reference</h2>
<p>
400: Bad Request - You will see this if you try and delete a non-existent URL<br>
401: Unauthorized - Did you enter your API key?<br>
405: Method Not Allowed - You will see this if you try a request with no arguments<br>
409: Conflict - The entered URL already exists, tick 'Random' and try again<br>
500: Internal Server Error - If this happens something has gone very wrong<br>
502: Bad Gateway - If you see this the backend is down/unreachable by Caddy<br>
</p>
</div>
</div>
</body>
</html>