Add a demo

static/index.html

@@ -48,6 +48,51 @@
 	<h1>Roblox Audio Asset API Documentation</h1>
 	<p>This project is open source and you can find the code on <a href="https://git.chrischro.me/KCA/AudioDownloadAPI">Forgejo</a>.</p>
 	<p>We do not store any personal information. We only log a timestamp, IP address, HTTP method, and path for debugging and spam monitoring purposes. These logs are shown in the console and cleared daily.</p>
+
+	<div>
+		<h2>Demo</h2>
+		<form id="demoForm">
+			<label for="assetIds">Asset IDs (Separated by new line):</label>
+			<br>
+			<textarea id="assetIds" name="assetIds" required></textarea>
+			<br>
+			<label for="cookie">Cookie:</label>
+			<br>
+			<input type="text" id="cookie" name="cookie">
+			<br>
+			<button type="submit">Submit</button>
+		</form>
+		<div id="output"></div>
+	</div>
+
+	<script>
+		document.getElementById("demoForm").addEventListener("submit", function(event) {
+			event.preventDefault();
+			var assetIds = document.getElementById("assetIds").value;
+			var cookie = document.getElementById("cookie").value;
+
+			var xhr = new XMLHttpRequest();
+			xhr.open("POST", "/", true);
+			xhr.setRequestHeader("Content-Type", "application/json");
+
+			xhr.onreadystatechange = function() {
+				if (xhr.readyState === XMLHttpRequest.DONE && xhr.status === 200) {
+					var response = JSON.parse(xhr.responseText);
+					var output = document.getElementById("output");
+					output.innerHTML = "<pre>" + JSON.stringify(response, null, 4) + "</pre>";
+				}
+			};
+
+			var data = {
+				"type": "batching",
+				"data": assetIds.split("\n"),
+				"cookie": cookie
+			};
+
+			xhr.send(JSON.stringify(data));
+		});
+	</script>
+
 	<h2>Request Format</h2>
 	<p>The request must be sent as JSON with the following format:</p>
 	<pre>