86 lines
3.3 KiB
JavaScript
86 lines
3.3 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}`)
|
|
.then(response => response.json())
|
|
.then(data => () {
|
|
setTimeout(function() { messageContainer.innerHTML = "" }, 3000);
|
|
messageContainer.innerHTML = data.message;
|
|
})
|
|
.catch(error => messageContainer.innerHTML = `Error: ${error}`)
|
|
}
|
|
|
|
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", (e) => unlockDoor(e, deviceID, apiKey, delay));
|
|
|
|
document.body.onload = setSettings;
|
|
let date = new Date();
|
|
messageContainer.innerHTML = date.toLocaleDateString();
|