const c = document.getElementById('c'); const x = c.getContext('2d'); let w, h, f = 0; function r() { w = c.width = window.innerWidth; h = c.height = window.innerHeight; } window.onresize = r; r(); function d() { const i = x.createImageData(w, h); for (let p = 0; p < i.data.length; p += 4) { const v = Math.random() * 255; i.data[p] = i.data[p+1] = i.data[p+2] = v; i.data[p+3] = 255; } x.putImageData(i, 0, 0); x.strokeStyle = '#f00'; x.lineWidth = 2; x.beginPath(); x.moveTo(0, h/2 + Math.sin(f/10)*50); x.lineTo(w, h/2 + Math.cos(f/10)*50); x.stroke(); f++; requestAnimationFrame(d); } d(); const timer = document.getElementById('t'); let s = 900; setInterval(() => { s--; let m = Math.floor(s/60), sec = s % 60; timer.innerText = `${m}:${sec.toString().padStart(2, '0')}`; if(s <= 0) s = 900; }, 1000);