commit 2612371b0ee7297afe0395ea6cc67be37c8365bb Author: flashwave Date: Tue Jun 25 23:36:48 2024 +0200 Imported. diff --git a/8bitoperator-JVE.woff b/8bitoperator-JVE.woff new file mode 100644 index 0000000..3ca0d52 Binary files /dev/null and b/8bitoperator-JVE.woff differ diff --git a/8bitoperator-JVE.woff2 b/8bitoperator-JVE.woff2 new file mode 100644 index 0000000..ac51581 Binary files /dev/null and b/8bitoperator-JVE.woff2 differ diff --git a/admin.caf b/admin.caf new file mode 100644 index 0000000..d12ff0b Binary files /dev/null and b/admin.caf differ diff --git a/admin.css b/admin.css new file mode 100644 index 0000000..4c796d0 --- /dev/null +++ b/admin.css @@ -0,0 +1,93 @@ +@font-face { + font-family: '8bitoperator JVE'; + src: url('8bitoperator-JVE.woff2') format('woff2'), + url('8bitoperator-JVE.woff') format('woff'); + font-weight: normal; + font-style: normal; + font-display: swap; +} + +* { + margin: 0; + padding: 0; + box-sizing: border-box; + position: relative; +} + +html, body { + width: 100%; + height: 100%; +} + +body { + color: #000; + background: #fff; + font-family: '8bitoperator JVE', System; +} + +.hidden { + display: none; + visibility: hidden; +} + +.play { + position: absolute; + top: 0; + right: 0; + left: 0; + bottom: 0; + width: 100%; + height: 100%; + display: flex; + justify-content: center; + align-items: center; + background: #000; + color: #fff; + z-index: 9001; +} + +.bars { + position: absolute; + top: 0; + right: 0; + left: 0; + bottom: 0; + width: 100%; + height: 100%; + display: grid; + grid-template-columns: 1fr; + grid-template-rows: repeat(5, 1fr); +} + +.bar { + overflow: hidden; + text-align: center; + display: flex; + justify-content: center; + align-items: center; + font-size: 25vh; + font-size: 25dvh; + letter-spacing: 5px; +} + +.girl { + position: fixed; + top: 0; + right: 0; + left: 0; + bottom: 0; + width: 100%; + height: 100%; + display: flex; + justify-content: center; + align-items: center; +} + +.sprite { + flex-shrink: 0; + flex-grow: 0; + width: 100%; + height: 52vh; + height: 52dvh; + image-rendering: crisp-edges; +} diff --git a/admin.js b/admin.js new file mode 100644 index 0000000..6b5a190 --- /dev/null +++ b/admin.js @@ -0,0 +1,110 @@ +(() => { + const updateRate = 1000 / 10; + const sWidth = 224; + const sHeight = 208; + const colours = ['#0f9', '#ff9', '#f09', '#0ff', '#f0f']; + + const gfx = document.querySelector('.sprite').getContext('2d'); + const play = document.querySelector('.play'); + const bars = Array.from(document.querySelectorAll('.bar')); + + let audioBuffer; + const knowsWhatAnOpusIs = document.createElement('audio').canPlayType('audio/ogg;codecs=opus') !== ''; + + const displayPlayButton = () => { + play.onclick = () => { attemptPlay(); }; + play.classList.remove('hidden'); + }; + + const startAnimation = () => { + play.classList.add('hidden'); + requestAnimationFrame(update); + }; + + const aud = (() => { + const audObj = window.AudioContext || window.webkitAudioContext; + try { + return new audObj({ latencyHint: 'playback' }); + } catch(ex) { + return new audObj; + } + })(); + + const attemptPlay = () => { + play.onclick = null; + + aud.resume().then(() => { + if(aud.state !== 'running') { + displayPlayButton(); + return; + } + + aud.decodeAudioData(audioBuffer) + .then(buffer => { + const source = aud.createBufferSource(); + source.connect(aud.destination); + source.buffer = buffer; + source.loop = true; + source.start(); + startAnimation(); + }) + .catch(ex => { + console.error(ex); + alert('Failed to decode audio, oops!'); + startAnimation(); + }); + }); + }; + + let sFrames; + const sprite = new Image; + sprite.onload = () => { + sFrames = sprite.height / sHeight; + + const xhr = new XMLHttpRequest; + xhr.responseType = 'arraybuffer'; + xhr.onload = () => { + audioBuffer = xhr.response; + + if(aud.state === 'running') + attemptPlay(); + else + displayPlayButton(); + }; + xhr.onerror = ex => { + console.error(ex); + alert('Failed to load audio, oops!'); + startAnimation(); + }; + xhr.open('GET', `admin.${knowsWhatAnOpusIs ? 'opus' : 'caf'}`); + xhr.send(); + }; + sprite.src = 'lurkmoar.png'; + + let lastUpdate, updates = 0; + const update = t => { + try { + if(lastUpdate !== undefined && t - updateRate < lastUpdate) + return; + ++updates; + lastUpdate = t; + + gfx.canvas.width = gfx.canvas.clientWidth; + gfx.clearRect(0, 0, gfx.canvas.width, gfx.canvas.height); + + const saWidth = sWidth * (gfx.canvas.clientHeight / sHeight); + gfx.drawImage( + sprite, + 0, sHeight * (updates % sFrames), + sWidth, sHeight, + (gfx.canvas.width / 2) - (saWidth / 2), 0, + saWidth, gfx.canvas.height + ); + + for(let i = 0; i < bars.length; ++i) + bars[i].style.background = colours[(i + updates) % colours.length]; + } finally { + requestAnimationFrame(update); + } + }; +})(); diff --git a/admin.opus b/admin.opus new file mode 100644 index 0000000..3dfbc67 Binary files /dev/null and b/admin.opus differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..b7b4777 --- /dev/null +++ b/index.html @@ -0,0 +1,27 @@ + + + + + + + Admin + + + + +
+
LURK
+
+
+
+
MORE
+
+
+ +
+ + + diff --git a/lurkmoar.png b/lurkmoar.png new file mode 100644 index 0000000..ae7769b Binary files /dev/null and b/lurkmoar.png differ