moth/theme/moth.js

227 lines
5.5 KiB
JavaScript
Raw Normal View History

2019-02-22 17:52:41 -07:00
// jshint asi:true
2020-02-29 17:12:35 -07:00
var devel = false
2019-02-22 17:52:41 -07:00
var teamId
var heartbeatInterval = 40000
2019-02-22 20:46:52 -07:00
function toast(message, timeout=5000) {
let p = document.createElement("p")
p.innerText = message
document.getElementById("messages").appendChild(p)
setTimeout(
e => { p.remove() },
timeout
)
}
2020-02-29 17:12:35 -07:00
function renderNotices(obj) {
let ne = document.getElementById("notices")
if (ne) {
ne.innerHTML = obj
}
}
2019-02-22 17:52:41 -07:00
function renderPuzzles(obj) {
let puzzlesElement = document.createElement('div')
2020-02-29 17:12:35 -07:00
document.getElementById("login").style.display = "none"
2019-02-22 17:52:41 -07:00
// Create a sorted list of category names
let cats = Object.keys(obj)
cats.sort()
for (let cat of cats) {
if (cat.startsWith("__")) {
// Skip metadata
continue
}
let puzzles = obj[cat]
let pdiv = document.createElement('div')
pdiv.className = 'category'
let h = document.createElement('h2')
pdiv.appendChild(h)
h.textContent = cat
// Extras if we're running a devel server
2020-02-29 17:12:35 -07:00
if (devel) {
2019-02-22 17:52:41 -07:00
let a = document.createElement('a')
h.insertBefore(a, h.firstChild)
a.textContent = "⬇️"
2019-02-27 16:15:45 -07:00
a.href = "mothballer/" + cat + ".mb"
2019-02-22 17:52:41 -07:00
a.classList.add("mothball")
a.title = "Download a compiled puzzle for this category"
}
// List out puzzles in this category
let l = document.createElement('ul')
pdiv.appendChild(l)
for (let puzzle of puzzles) {
2020-02-29 22:37:22 -07:00
let points = puzzle
let id = puzzle
if (Array.isArray(puzzle)) {
points = puzzle[0]
id = puzzle[1]
}
2019-02-22 17:52:41 -07:00
let i = document.createElement('li')
l.appendChild(i)
i.textContent = " "
if (points === 0) {
// Sentry: there are no more puzzles in this category
i.textContent = "✿"
} else {
let a = document.createElement('a')
i.appendChild(a)
a.textContent = points
2020-02-29 17:12:35 -07:00
let url = new URL("puzzle.html", window.location)
url.searchParams.set("cat", cat)
url.searchParams.set("points", points)
url.searchParams.set("pid", id)
a.href = url.toString()
2019-02-22 17:52:41 -07:00
}
}
puzzlesElement.appendChild(pdiv)
}
// Drop that thing in
let container = document.getElementById("puzzles")
while (container.firstChild) {
container.firstChild.remove()
}
container.appendChild(puzzlesElement)
}
2020-02-29 17:12:35 -07:00
function renderState(obj) {
2020-02-29 22:37:22 -07:00
devel = obj.Config.Devel
2020-02-29 17:12:35 -07:00
if (devel) {
let params = new URLSearchParams(window.location.search)
sessionStorage.id = "1"
2020-02-29 17:12:35 -07:00
sessionStorage.pid = "rodney"
}
2020-02-29 22:37:22 -07:00
if (Object.keys(obj.Puzzles).length > 0) {
renderPuzzles(obj.Puzzles)
2020-02-29 22:49:20 -07:00
if (obj.Config.Detachable) {
fetchAll(obj.Puzzles)
}
2020-02-29 17:12:35 -07:00
}
2020-02-29 22:37:22 -07:00
renderNotices(obj.Messages)
2020-02-29 17:12:35 -07:00
}
function heartbeat() {
let teamId = sessionStorage.id || ""
let participantId = sessionStorage.pid
let url = new URL("state", window.location)
url.searchParams.set("id", teamId)
if (participantId) {
url.searchParams.set("pid", participantId)
}
2019-02-23 12:04:42 -07:00
let fd = new FormData()
fd.append("id", teamId)
2020-02-29 17:12:35 -07:00
fetch(url)
2019-02-22 17:52:41 -07:00
.then(resp => {
if (resp.ok) {
resp.json()
2020-02-29 17:12:35 -07:00
.then(renderState)
2019-02-22 17:52:41 -07:00
.catch(err => {
2020-02-29 17:12:35 -07:00
toast("Error fetching recent state. I'll try again in a moment.")
2019-02-22 17:52:41 -07:00
console.log(err)
})
}
})
.catch(err => {
2020-02-29 17:12:35 -07:00
toast("Error fetching recent state. I'll try again in a moment.")
2019-02-22 17:52:41 -07:00
console.log(err)
})
}
2020-02-29 17:12:35 -07:00
function showPuzzles() {
2019-02-22 17:52:41 -07:00
let spinner = document.createElement("span")
spinner.classList.add("spinner")
document.getElementById("login").style.display = "none"
document.getElementById("puzzles").appendChild(spinner)
2020-02-29 17:12:35 -07:00
}
2020-02-29 22:49:20 -07:00
async function fetchAll(puzzles) {
2020-02-29 17:12:35 -07:00
let teamId = sessionStorage.id
2020-02-29 22:49:20 -07:00
console.log("Caching all currently-open content")
2020-02-29 17:12:35 -07:00
2020-02-29 22:49:20 -07:00
for (let cat in puzzles) {
for (let points of puzzles[cat]) {
let resp = await fetch(cat + "/" + points + "/")
if (! resp.ok) {
2020-02-29 17:12:35 -07:00
continue
}
2020-02-29 22:49:20 -07:00
let obj = await resp.json()
for (let file of obj.files) {
fetch(cat + "/" + points + "/" + file.name)
}
for (let file of obj.scripts) {
fetch(cat + "/" + points + "/" + file.name)
2020-02-29 17:12:35 -07:00
}
}
}
2020-02-29 22:49:20 -07:00
2020-02-29 22:49:38 -07:00
console.log("Done caching content")
2019-02-22 17:52:41 -07:00
}
2019-02-22 19:09:38 -07:00
function login(e) {
2019-02-22 20:46:52 -07:00
e.preventDefault()
2019-02-22 17:52:41 -07:00
let name = document.querySelector("[name=name]").value
2020-02-29 17:12:35 -07:00
let teamId = document.querySelector("[name=id]").value
let pide = document.querySelector("[name=pid]")
2020-08-17 17:43:57 -06:00
let participantId = pide?pide.value:Math.floor(Math.random() * Number.MAX_SAFE_INTEGER)
2019-02-22 17:52:41 -07:00
2019-02-23 12:04:42 -07:00
fetch("register", {
method: "POST",
body: new FormData(e.target),
2019-02-22 17:52:41 -07:00
})
.then(resp => {
if (resp.ok) {
resp.json()
.then(obj => {
2020-02-29 17:12:35 -07:00
if ((obj.status == "success") || (obj.data.short == "Already registered")) {
toast("Logged in")
sessionStorage.id = teamId
sessionStorage.pid = participantId
showPuzzles()
heartbeat()
2019-02-22 17:52:41 -07:00
} else {
toast(obj.data.description)
}
})
.catch(err => {
toast("Oops, the server has lost its mind. You probably need to tell someone so they can fix it.")
console.log(err, resp)
})
} else {
toast("Oops, something's wrong with the server. Try again in a few seconds.")
console.log(resp)
}
})
.catch(err => {
toast("Oops, something went wrong. Try again in a few seconds.")
console.log(err)
})
}
function init() {
2020-02-29 17:12:35 -07:00
heartbeat()
setInterval(e => heartbeat(), 40000)
2019-02-22 19:09:38 -07:00
document.getElementById("login").addEventListener("submit", login)
2019-02-22 17:52:41 -07:00
}
if (document.readyState === "loading") {
2020-02-29 17:12:35 -07:00
document.addEventListener("DOMContentLoaded", init)
2019-02-22 17:52:41 -07:00
} else {
2020-02-29 17:12:35 -07:00
init()
2019-02-22 17:52:41 -07:00
}
2020-02-29 17:12:35 -07:00