72 lines
1.5 KiB
JavaScript
72 lines
1.5 KiB
JavaScript
const target = document.querySelector('canvas');
|
|
|
|
const ctx = target.getContext('2d');
|
|
|
|
export let lolState = false;
|
|
|
|
let scale = 0.7;
|
|
|
|
function analogLikeNoise(){
|
|
let tH = target.height;
|
|
let tW = target.width;
|
|
//console.log('window dimensions :', tH, tW)
|
|
const img = ctx.createImageData(tW, tH);
|
|
let offset = 0;
|
|
let index = 0;
|
|
let brightness = 0;
|
|
|
|
for(let x = 0; x<tW; x++){
|
|
const sx = x * scale + offset
|
|
for(let y = 0; y<tH; y++){
|
|
let lum = Math.random()*161
|
|
|
|
//img.data[index++] = lum*150/255;
|
|
index++
|
|
img.data[index++] = lum;
|
|
img.data[index++] = lum;
|
|
img.data[index++] = 255;
|
|
}
|
|
}
|
|
ctx.putImageData(img, 0, 0);
|
|
|
|
offset ++;
|
|
if(offset>1024){
|
|
offset = 0;
|
|
}
|
|
}
|
|
|
|
let time = 0
|
|
|
|
function scanlines(){
|
|
time += 0.05;
|
|
let tH = target.height;
|
|
let tW = target.width;
|
|
//console.log('window dimensions :', tH, tW)
|
|
const img = ctx.createImageData(tW, tH);
|
|
let index = 0;
|
|
|
|
for(let y = 0; y<tH; y++){
|
|
for(let x = 0; x<tW; x++){
|
|
let lum = (Math.sin(y*2 - time*3.1415) * 44) + 77;
|
|
|
|
//img.data[index++] = lum;
|
|
index++;
|
|
img.data[index++] = lum;
|
|
//img.data[index++] = lum + Math.random()*32;
|
|
index++
|
|
img.data[index++] = 255;
|
|
}
|
|
}
|
|
ctx.putImageData(img, 0, 0);
|
|
}
|
|
|
|
export function scanlinesAnimation(){
|
|
scanlines();
|
|
requestAnimationFrame(scanlinesAnimation);
|
|
}
|
|
|
|
export function noiseAnimation(){
|
|
analogLikeNoise();
|
|
requestAnimationFrame(noiseAnimation);
|
|
}
|