Frontend: QLS Settings under test
Signed-off-by: Fred Boniface <fred@fjla.uk>
This commit is contained in:
parent
f77d262808
commit
3a93e29e51
@ -53,15 +53,8 @@
|
||||
apologies for any inconvinience caused to you.</p>
|
||||
|
||||
<h2>Quick Links</h2>
|
||||
<button class="actionbutton" onclick="gotoBoard('bth')">BTH</button>
|
||||
<button class="actionbutton" onclick="gotoBoard('bri')">BRI</button>
|
||||
<button class="actionbutton" onclick="gotoBoard('bpw')">BPW</button>
|
||||
<button class="actionbutton" onclick="gotoBoard('cdf')">CDF</button>
|
||||
<button class="actionbutton" onclick="gotoBoard('gcr')">GCR</button>
|
||||
<button class="actionbutton" onclick="gotoBoard('olf')">OLF</button>
|
||||
<button class="actionbutton" onclick="gotoBoard('sou')">SOU</button>
|
||||
<button class="actionbutton" onclick="gotoBoard('wsb')">WSB</button>
|
||||
<button class="actionbutton" onclick="gotoBoard('wsm')">WSM</button>
|
||||
<div id="quick_links">
|
||||
</div>
|
||||
|
||||
<br>
|
||||
<br>
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
async function fetchEntry(){
|
||||
async function fetchEntry(){ // This can be condensed
|
||||
showLoading();
|
||||
var name = document.getElementById("name")
|
||||
var crs = document.getElementById("3alpha")
|
||||
|
||||
@ -13,3 +13,21 @@ async function sidebarClose() {
|
||||
async function gotoBoard(station){
|
||||
window.location.assign(`${window.location.origin}/board.html?stn=${station}`)
|
||||
}
|
||||
|
||||
async function setQls(){
|
||||
var qlOpt = JSON.parse(localStorage.getItem("qlOpt"))
|
||||
var qlDef = ["bri","lwh","srd","mtp","rda","cfn","sml","shh","pri","avn"]
|
||||
if (qlOpt) {
|
||||
for(var i = 0; i < qlOpt.length; i++) {
|
||||
console.log(`Button: ${qlOpt[i]}`)
|
||||
var btn = `<button class="actionbutton" onclick="gotoBoard(${qlOpt[i]})">${qlOpt[i].toUpperCase()}</button>`
|
||||
document.getElementById("quick_links").insertAdjacentHTML("beforeend", btn) // Append btn
|
||||
}
|
||||
} else {
|
||||
for(var i = 0; i < qlDef.length; i++) {
|
||||
console.log(`Button: ${qlDef[i]}`)
|
||||
var btn = `<button class="actionbutton" onclick="gotoBoard(${qlDef[i]})">${qlDef[i].toUpperCase()}</button>`
|
||||
document.getElementById("quick_links").insertAdjacentHTML("beforeend", btn) // Append btn
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,52 @@
|
||||
// Init:
|
||||
const ql = ["ql0","ql1","ql2","ql3","ql4","ql5","ql6","ql7","ql8","ql9"]
|
||||
checkStorageSupport();
|
||||
|
||||
async function checkStorageSupport(){
|
||||
if (window.localStorage){
|
||||
localStorage.setItem("support-check","8441");
|
||||
if (localStorage.getItem("support-check")=="8441"){
|
||||
console.log("Local Storage supported.")
|
||||
localStorage.removeItem("support-check")
|
||||
} else if (localStorage.getItem("support-check" != "8441")){
|
||||
console.log("Error fetching test value.")
|
||||
}
|
||||
} else {
|
||||
console.log("Local Storage is not supported")
|
||||
window.alert("Settings cannot be saved on your device, try updating your browser.")
|
||||
}
|
||||
}
|
||||
|
||||
async function getQl(){
|
||||
var qlOpt = JSON.parse(localStorage.getItem("qlOpt"))
|
||||
if (qlOpt){
|
||||
var i = 0
|
||||
while (i < 10) {
|
||||
if (qlOpt[i] != 'undefined') {
|
||||
console.log(`Setting box ql${i} to ${qlOpt[i]}`)
|
||||
document.getElementById(`ql${i}`).value = qlOpt[i]
|
||||
i +=1
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
async function setQl(){
|
||||
var qlSet = []
|
||||
for (i in ql) {
|
||||
console.log(`Try to get value of 'ql${i}'`)
|
||||
var opt = document.getElementById(`ql${i}`).value
|
||||
console.log(`Found value: ${opt}`)
|
||||
if (opt != ""){
|
||||
qlSet.push(opt)
|
||||
}
|
||||
qlSet.sort()
|
||||
}
|
||||
console.log(qlSet)
|
||||
localStorage.setItem("qlOpt", JSON.stringify(qlSet))
|
||||
}
|
||||
|
||||
async function clearQl(){
|
||||
localStorage.removeItem("qlOpt")
|
||||
getQl()
|
||||
}
|
||||
@ -13,7 +13,7 @@
|
||||
<link rel="icon" type="image/png" href="./images/logo/logo-sq-256.png"/>
|
||||
<link rel="manifest" type="application/json" href="./manifest.json"/>
|
||||
<title>OwlBoard - Settings</title>
|
||||
<script src="./js/settings.js"></script>
|
||||
<script async src="./js/settings.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
@ -32,19 +32,21 @@
|
||||
<p>Any settings you apply will only apply to the device you are using now.</p>
|
||||
|
||||
<p>Settings are not yet fully implemented, some options won't apply properly yet.</p>
|
||||
<form>
|
||||
<label>Personal Quick Links:</label><br>
|
||||
<p>Enter one CRS/3ALPHA code per box</p>
|
||||
<input type="text" maxlength="3" id="ql0" name="ql0" autocomplete="off" class="small-box">
|
||||
<input type="text" maxlength="3" id="ql1" name="ql1" autocomplete="off" class="small-box"><br>
|
||||
<input type="text" maxlength="3" id="ql2" name="ql2" autocomplete="off" class="small-box">
|
||||
<input type="text" maxlength="3" id="ql3" name="ql3" autocomplete="off" class="small-box"><br>
|
||||
<input type="text" maxlength="3" id="ql4" name="ql4" autocomplete="off" class="small-box">
|
||||
<input type="text" maxlength="3" id="ql5" name="ql5" autocomplete="off" class="small-box"><br>
|
||||
<input type="text" maxlength="3" id="ql6" name="ql6" autocomplete="off" class="small-box">
|
||||
<input type="text" maxlength="3" id="ql7" name="ql7" autocomplete="off" class="small-box"><br>
|
||||
<input type="text" maxlength="3" id="ql8" name="ql8" autocomplete="off" class="small-box">
|
||||
<input type="text" maxlength="3" id="qp9" name="ql9" autocomplete="off" class="small-box"><br>
|
||||
</form>
|
||||
|
||||
<label>Personal Quick Links:</label><br>
|
||||
<p>Enter one CRS/3ALPHA code per box</p>
|
||||
<input type="text" maxlength="3" id="ql0" name="ql0" autocomplete="off" class="small-lookup-box">
|
||||
<input type="text" maxlength="3" id="ql1" name="ql1" autocomplete="off" class="small-lookup-box"><br>
|
||||
<input type="text" maxlength="3" id="ql2" name="ql2" autocomplete="off" class="small-lookup-box">
|
||||
<input type="text" maxlength="3" id="ql3" name="ql3" autocomplete="off" class="small-lookup-box"><br>
|
||||
<input type="text" maxlength="3" id="ql4" name="ql4" autocomplete="off" class="small-lookup-box">
|
||||
<input type="text" maxlength="3" id="ql5" name="ql5" autocomplete="off" class="small-lookup-box"><br>
|
||||
<input type="text" maxlength="3" id="ql6" name="ql6" autocomplete="off" class="small-lookup-box">
|
||||
<input type="text" maxlength="3" id="ql7" name="ql7" autocomplete="off" class="small-lookup-box"><br>
|
||||
<input type="text" maxlength="3" id="ql8" name="ql8" autocomplete="off" class="small-lookup-box">
|
||||
<input type="text" maxlength="3" id="ql9" name="ql9" autocomplete="off" class="small-lookup-box"><br>
|
||||
<button onclick="setQl()" class="lookup-button">Apply</button>
|
||||
<button onclick="clearQl()" class="lookup-button">Reset</button>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -1,9 +1,4 @@
|
||||
.small-box{
|
||||
.small-lookup-box{
|
||||
max-width: 100px;
|
||||
height: 20px;
|
||||
margin-top: 5px;
|
||||
font-family: urwgothic, sans-serif;
|
||||
text-align: center;
|
||||
border-radius: 40px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
@ -160,6 +160,11 @@ label {
|
||||
margin-bottom: 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
#quick_links{
|
||||
width: 75%;
|
||||
max-width: 300px;
|
||||
margin: auto;
|
||||
}
|
||||
.actionbutton {
|
||||
display: inline-block;
|
||||
text-decoration: none;
|
||||
@ -173,6 +178,8 @@ label {
|
||||
padding: 3px;
|
||||
padding-left: 8px;
|
||||
padding-right: 8px;
|
||||
margin-left: 5px;
|
||||
margin-right: 5px;
|
||||
margin-bottom: 10px;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user