playback-device-server/www/integration.html

93 lines
3.1 KiB
HTML

<!DOCTYPE html>
<html lang="de" data-bs-theme="dark">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
<title>Integration</title>
</head>
<body>
<div>
<div style="padding: 1em; border: 1px solid #444">
<p style="font-weight: bold">Register</p>
<label for="register-name">Name:</label>
<input type="text" id="register-name" name="register-name" required />
<label for="register-code">Code:</label>
<input type="text" id="register-code" name="register-code" required />
<button id="register-button">Register</button>
</div>
</div>
<script type="module">
let registerButton = document.getElementById("register-button");
registerButton.addEventListener("click", register);
async function register() {
let name = document.getElementById("register-name").value;
let code = document.getElementById("register-code").value;
console.log("Registering with name:", name, "and code:", code);
let response = await sendJsonRequest({
method: "POST",
url: "/api/integrations",
data: { name, code },
});
if (response.status === 200) {
console.log("Registration successful");
console.log(JSON.parse(response.data));
} else {
console.error("Registration failed with status code:", response.status);
console.log(JSON.parse(response.data));
}
}
async function sendJsonRequest({ method, url, data, headers }) {
if (typeof data !== "string") {
data = JSON.stringify(data);
}
if (!headers) headers = {};
headers["Content-Type"] = "application/json";
return sendRequest({ method, url, data, headers });
}
async function sendRequest({ method, url, data, headers, queryParams }) {
if (queryParams) {
let params = new URLSearchParams();
for (var queryParam in queryParams) {
params.append(queryParam, queryParams[queryParam]);
}
let queryString = params.toString();
queryString = queryString ? "?" + queryString : "";
url = url + queryString;
}
return new Promise((resolve, reject) => {
let xhr = new XMLHttpRequest();
xhr.addEventListener("load", function () {
resolve({ status: xhr.status, data: xhr.response });
});
xhr.addEventListener("readystatechange", function () {
if (xhr.readyState === XMLHttpRequest.DONE) {
resolve({ status: xhr.status, data: xhr.response });
}
});
xhr.addEventListener("error", function () {
reject(xhr.response);
});
xhr.open(method, url, true);
for (var header in headers) {
xhr.setRequestHeader(header, headers[header]);
}
try {
xhr.send(data);
} catch (error) {
reject(error);
}
});
}
</script>
</body>
</html>