73 lines
2.5 KiB
TypeScript
73 lines
2.5 KiB
TypeScript
const elemTimer = document.querySelector<HTMLParagraphElement>('p.layout-timer')!
|
|
const elemCheck = document.querySelector<HTMLButtonElement>('a#action-send')!
|
|
const soundSet = document.querySelector<HTMLAudioElement>('audio#audio-set')!
|
|
const soundDel = document.querySelector<HTMLAudioElement>('audio#audio-del')!
|
|
let secondsElapsed = 0
|
|
|
|
function timestamp() {
|
|
const f = (s: number) => s.toString().padStart(2, '0')
|
|
const h = Math.floor(secondsElapsed / 3600)
|
|
const m = Math.floor((secondsElapsed % 3600) / 60)
|
|
const s = Math.floor(secondsElapsed % 60)
|
|
return `Time Spent: ${f(h)}:${f(m)}:${f(s)}`
|
|
}
|
|
|
|
setInterval(() => {
|
|
secondsElapsed++
|
|
elemTimer.textContent = timestamp()
|
|
}, 1000)
|
|
|
|
document.querySelector<HTMLDivElement>('div.layout-content')!.addEventListener(
|
|
// Prevent annoying context menu popup whenever you miss a grid tile by 1 pixel
|
|
'contextmenu',
|
|
(e) => e.preventDefault(),
|
|
)
|
|
|
|
document.querySelectorAll('button.picross-button').forEach((e) => {
|
|
// Initialize Buttons
|
|
e.addEventListener('click', () => {
|
|
e.classList.remove('state-ignore')
|
|
e.classList.toggle('state-active') ? soundSet.play() : soundDel.play()
|
|
})
|
|
e.addEventListener('contextmenu', (ev) => {
|
|
ev.preventDefault()
|
|
e.classList.remove('state-active')
|
|
e.classList.toggle('state-ignore')
|
|
soundDel.play()
|
|
})
|
|
})
|
|
|
|
elemCheck.addEventListener('click', () => {
|
|
// Calculate Answer
|
|
let given = 0
|
|
const rows = document.querySelectorAll<HTMLDivElement>('div.picross-row')
|
|
|
|
rows.forEach((childRow, rowIndex) => {
|
|
let childIndex = 0
|
|
for (const child of childRow.children) {
|
|
if (child.nodeName === 'BUTTON') {
|
|
if (child.classList.contains('state-active')) {
|
|
given += 1 << ((rowIndex - 3) * 9 + childIndex)
|
|
}
|
|
childIndex++
|
|
}
|
|
}
|
|
})
|
|
|
|
if (given !== 2560660350) {
|
|
alert('Nope! Try Again')
|
|
return
|
|
}
|
|
|
|
// Render Certificate
|
|
const time = timestamp()
|
|
const name = prompt('Congratulations you won! Please enter the name for your certificate:', 'Anon')
|
|
|
|
document.querySelector<HTMLDivElement>('div.layout-document')!.style.display = 'block'
|
|
document.querySelector<HTMLSpanElement>('span#date')!.textContent = new Date().toDateString()
|
|
document.querySelector<HTMLSpanElement>('span#time')!.textContent = time
|
|
document.querySelector<HTMLSpanElement>('span#name')!.textContent = name
|
|
print()
|
|
document.location.assign('/')
|
|
})
|