230 lines
6.6 KiB
HTML
230 lines
6.6 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html lang="en">
|
||
|
|
<head>
|
||
|
|
<meta charset="utf-8">
|
||
|
|
<title>FKX Tools</title>
|
||
|
|
<link rel="stylesheet" href="mini-nord.min.css" />
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<div class="row">
|
||
|
|
<h2>IN 1</h2>
|
||
|
|
<div class="col-2">
|
||
|
|
<br /><br />
|
||
|
|
<h3>HF enable</h3>
|
||
|
|
<button id="2" class="hf-enable primary">On</button>
|
||
|
|
</div>
|
||
|
|
<div class="col-2">
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-sm">
|
||
|
|
<div class="card">
|
||
|
|
<h3>50/70M</h3>
|
||
|
|
<button id="0" class="disabled-on-hf-enable row-button">Off</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col-sm">
|
||
|
|
<div class="card">
|
||
|
|
<h3>spare</h3>
|
||
|
|
<button id="1" class="disabled-on-hf-enable row-button">Off</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-sm">
|
||
|
|
<div class="card">
|
||
|
|
<h3>HF1</h3>
|
||
|
|
<button id="3" class="enabled-on-hf-enable row-button">Off</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col-sm">
|
||
|
|
<div class="card">
|
||
|
|
<h3>HF2</h3>
|
||
|
|
<button id="4" class="enabled-on-hf-enable row-button">Off</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col-sm">
|
||
|
|
<div class="card">
|
||
|
|
<h3>HF3</h3>
|
||
|
|
<button id="5" class="enabled-on-hf-enable row-button">Off</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col-sm">
|
||
|
|
<div class="card">
|
||
|
|
<h3>HF4</h3>
|
||
|
|
<button id="6" class="enabled-on-hf-enable row-button">Off</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col-sm">
|
||
|
|
<div class="card">
|
||
|
|
<h3>HF5</h3>
|
||
|
|
<button id="7" class="enabled-on-hf-enable row-button">Off</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col-sm">
|
||
|
|
<div class="card">
|
||
|
|
<h3>HF6</h3>
|
||
|
|
<button id="8" class="enabled-on-hf-enable row-button">Off</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="row">
|
||
|
|
<h2>IN 2</h2>
|
||
|
|
<div class="col-sm">
|
||
|
|
<div class="card">
|
||
|
|
<h3>VUHF1</h3>
|
||
|
|
<button id="9" class="secondary row-button">Off</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col-sm">
|
||
|
|
<div class="card">
|
||
|
|
<h3>VUHF2</h3>
|
||
|
|
<button id="10" class="secondary row-button">Off</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col-sm">
|
||
|
|
<div class="card">
|
||
|
|
<h3>VUHF3</h3>
|
||
|
|
<button id="11" class="secondary row-button">Off</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col-sm">
|
||
|
|
<div class="card">
|
||
|
|
<h3>VUHF4</h3>
|
||
|
|
<button id="12" class="secondary row-button">Off</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col-sm">
|
||
|
|
<div class="card">
|
||
|
|
<h3>VUHF5</h3>
|
||
|
|
<button id="13" class="secondary row-button">Off</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col-sm">
|
||
|
|
<div class="card">
|
||
|
|
<h3>VUHF6</h3>
|
||
|
|
<button id="14" class="secondary row-button">Off</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col-sm">
|
||
|
|
<div class="card">
|
||
|
|
<h3>VUHF Spare</h3>
|
||
|
|
<button id="15" class="secondary row-button">Off</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<footer>
|
||
|
|
<label for="board-url">Board URL</label>
|
||
|
|
<input id="board-url" placeholder="Board URL" />
|
||
|
|
<button id="board-url-save">Save</button>
|
||
|
|
<br />
|
||
|
|
<label for="secret">Secret</label>
|
||
|
|
<input id="secret" placeholder="secret" />
|
||
|
|
<button id="secret-save">Save</button>
|
||
|
|
</footer>
|
||
|
|
<script>
|
||
|
|
hf_enable_button = document.getElementsByClassName("hf-enable")[0];
|
||
|
|
enabled_on_hf_enable = document.getElementsByClassName("enabled-on-hf-enable");
|
||
|
|
disabled_on_hf_enable = document.getElementsByClassName("disabled-on-hf-enable");
|
||
|
|
row_buttons = document.getElementsByClassName("row-button");
|
||
|
|
|
||
|
|
function button_toggle(button) {
|
||
|
|
// toggle colour and text
|
||
|
|
if(button.classList.contains("secondary")) {
|
||
|
|
button.textContent = "On";
|
||
|
|
button.classList.remove("secondary");
|
||
|
|
button.classList.add("tertiary");
|
||
|
|
|
||
|
|
payload = 1 << parseInt(button.id);
|
||
|
|
|
||
|
|
fetch_url = localStorage.getItem("board-url") + "/Set/0/" + payload.toString() + "/" + localStorage.getItem("secret");
|
||
|
|
fetch(fetch_url)
|
||
|
|
.then((resp) => {
|
||
|
|
return resp.text();
|
||
|
|
})
|
||
|
|
.then((text) => {
|
||
|
|
console.log(text);
|
||
|
|
})
|
||
|
|
.catch((error) => {
|
||
|
|
console.log("Set failed:", error);
|
||
|
|
});
|
||
|
|
} else {
|
||
|
|
button.textContent = "Off";
|
||
|
|
button.classList.add("secondary");
|
||
|
|
button.classList.remove("tertiary");
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
function toggle_hf_enable(e) {
|
||
|
|
// hf is enabled if the button is green
|
||
|
|
hf_enabled = this.classList.contains("tertiary");
|
||
|
|
|
||
|
|
// toggle hf enable button text and color
|
||
|
|
button_toggle(hf_enable_button);
|
||
|
|
|
||
|
|
for(b of enabled_on_hf_enable) {
|
||
|
|
b.disabled = hf_enabled;
|
||
|
|
}
|
||
|
|
|
||
|
|
for(b of disabled_on_hf_enable) {
|
||
|
|
b.disabled = !hf_enabled;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
function toggle_in_row(event) {
|
||
|
|
button = event.target;
|
||
|
|
previously_on = button.closest(".row").querySelector(".tertiary");
|
||
|
|
if(previously_on != null) {
|
||
|
|
button_toggle(previously_on);
|
||
|
|
}
|
||
|
|
button_toggle(button);
|
||
|
|
}
|
||
|
|
|
||
|
|
function getRemoteState() {
|
||
|
|
fetch_url = localStorage.getItem("board-url") + "/GetAll/" + localStorage.getItem("secret");
|
||
|
|
fetch(fetch_url)
|
||
|
|
.then((resp) => {
|
||
|
|
return resp.text();
|
||
|
|
})
|
||
|
|
.then((text) => {
|
||
|
|
res_array = text.match(/\d(\d*)/g);
|
||
|
|
// console.log(res_array);
|
||
|
|
activated = Math.log2(parseInt(res_array[0]));
|
||
|
|
respective_button = document.getElementById(activated.toString());
|
||
|
|
button_toggle(respective_button);
|
||
|
|
})
|
||
|
|
.catch((error) => {
|
||
|
|
console.log("GetAll failed:", error);
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
// add event listeners
|
||
|
|
hf_enable_button.addEventListener("click", toggle_hf_enable, false);
|
||
|
|
|
||
|
|
for(b of row_buttons) {
|
||
|
|
b.addEventListener("click", toggle_in_row, false);
|
||
|
|
}
|
||
|
|
|
||
|
|
// add listener to save secret token to local storage
|
||
|
|
password_input = document.getElementById("secret");
|
||
|
|
password_input.value = localStorage.getItem("secret");
|
||
|
|
password_save_button = document.getElementById("secret-save");
|
||
|
|
password_save_button.addEventListener("click", (e) => {
|
||
|
|
localStorage.setItem("secret", password_input.value);
|
||
|
|
});
|
||
|
|
|
||
|
|
// add listener for board url saving feature
|
||
|
|
board_url_input = document.getElementById("board-url");
|
||
|
|
board_url_input.value = localStorage.getItem("board-url");
|
||
|
|
board_url_save_button = document.getElementById("board-url-save");
|
||
|
|
board_url_save_button.addEventListener("click", (e) => {
|
||
|
|
localStorage.setItem("board-url", board_url_input.value);
|
||
|
|
});
|
||
|
|
|
||
|
|
// keep updating state from remote
|
||
|
|
// var interval_updater = setInterval(getRemoteState, 1000);
|
||
|
|
|
||
|
|
</script>
|
||
|
|
</body>
|
||
|
|
</html>
|