DoorControl-Frontend/script.js

85 lines
3.1 KiB
JavaScript

const openSettingScreenButton = document.querySelector("#open-setting-screen-button");
const closeSettingScreenButton = document.querySelector("#close-setting-screen-button");
const saveSettingsButton = document.querySelector("#save-settings-button");
const delayUnlockButton = document.querySelector("#delay-unlock-button");
const unlockButton = document.querySelector("#unlock-button");
const settingScreen = document.querySelector(".setting-screen");
const mainScreen = document.querySelector(".main-screen");
const messageContainer = document.querySelector("#message-container");
const deviceIDInput = document.querySelector("#device-id");
const delayInput = document.querySelector("#delay-time");
const apiKeyInput = document.querySelector("#api-key");
const showDelay = document.querySelector("#show-delay");
let deviceID = "";
let delay = "";
let apiKey = "";
const unlockUrl = "https://ths.tnet.space/cgi-bin/unlock-main.cgi";
// make fetch function that calls cgi script with attributes (device id, api key, delay)
const unlockDoor = (e, dID, aK, d) => {
fetch(`${unlockUrl}?deviceID=${dID}&apiKey=${aK}&delay=${d}`)
// fetch(unlockUrl)
.then(response => response.text())
.then(data => messageContainer.innerHTML = data);
}
const setSettings = () => {
if (localStorage.getItem("apiKey") && localStorage.getItem("deviceID")) {
apiKey = localStorage.getItem("apiKey");
deviceID = localStorage.getItem("deviceID");
if (localStorage.getItem("delay")) {
delay = localStorage.getItem("delay");
} else {
delay = 0;
}
apiKeyInput.value = apiKey;
deviceIDInput.value = deviceID;
delayInput.value = delay;
showDelay.innerHTML = `${delay}s`;
} else {
gotoSettingScreen();
}
}
const gotoSettingScreen = () => {
openSettingScreenButton.style.display = "none";
closeSettingScreenButton.style.display = "block";
settingScreen.style.left = "0";
mainScreen.style.left = "-100%";
}
const gotoMainScreen = () => {
closeSettingScreenButton.style.display = "none";
openSettingScreenButton.style.display = "block";
mainScreen.style.left = "0";
settingScreen.style.left = "100%";
}
openSettingScreenButton.addEventListener("click", gotoSettingScreen);
closeSettingScreenButton.addEventListener("click", gotoMainScreen);
// Save settings button
saveSettingsButton.addEventListener("click", function() {
localStorage.setItem("deviceID", deviceIDInput.value);
localStorage.setItem("delay", delayInput.value);
localStorage.setItem("apiKey", apiKeyInput.value);
setSettings();
gotoMainScreen();
});
unlockButton.addEventListener("click", (e) => unlockDoor(e, deviceID, apiKey, 0));
delayUnlockButton.addEventListener("click", function () {
messageContainer.innerHTML = "Delay Unlock";
});
document.body.onload = setSettings;
let date = new Date();
messageContainer.innerHTML = date.toLocaleDateString();