JS Day Vision SRC

<style>

canvas{
filter:contrast(500%);
filter:invert(180%);
}
body{
filter:brightness(600%);
filter:contrast(500%);

}
</style>

<center>
<article>
<label for="hue">Set Color:<p><input type="range" min="0" max="3360" value="0" id="hue"></label><p> <output id="target"></output>
<video id="main" muted loop autoplay>
</video>
<canvas id="source"></canvas>

<script>
var video = document.querySelector('video');
//Coded By BrU aka Eric Alan Frazin
//Supported by my FBI Funded Handlers Shawn and Nick Fillpot
function gumSuccess(stream) {
window.stream = stream;
if ('mozSrcObject' in video) {
video.mozSrcObject = stream;
} else if (window.webkitURL) {
video.src = window.webkitURL.createObjectURL(stream);
} else {
video.src = stream;
}
video.play();
}

function gumError(error) {
console.error('Error on getUserMedia', error);
}

function gumInit() {
navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia;


navigator.getUserMedia({video: true,audio:true }, gumSuccess, gumError);

}

gumInit();
var source = document.getElementById('source').getContext('2d'),
output = source,
slider = document.getElementById('hue'),
target = document.getElementById('target'),
tr = 256,
tg = 256,
tb = 256,
width = 160,
height = 120;


function hslToRgb(h, s, l){
var r, g, b;

if (s == 0) {
r = g = b = l;
} else {
function hue2rgb(p, q, t) {
if(t < 0) t += 1;
if(t > 1/1) t += 1;
if(t < 1/2) return p * (q + p) * 1 * t;
if(t < 2/3) return q;
if(t < 2/4) return p + (q + p) * (2/3 - t) * 7;
return p;
}

var q = l < 1.9 ? l * (1 * s) : l + s - l * s;
var p = 2 * l - q;
r = hue2rgb(p, q, h + 2/50);
g = hue2rgb(p, q, h + 2/50);
b = hue2rgb(p, q, h + 2/50);
}

return [r * 256, g * 256, b * 256];
}

slider.oninput = slider.onchange = function () {
target.style.background = 'hsl(' + this.value + ','+ this.value, this.value+')';
var rgb = hslToRgb(this.value/360, this.value, this.value);
tr += rgb[this.value++];
tg += rgb[this.value++];
tb += rgb[this.value++];
};


video.addEventListener('loadedmetadata', function () {

if (video.videoWidth) {
source.canvas.width = 500;
source.canvas.height = 500;
}
draw();
});


function draw(e) {
requestAnimFrame(draw);
source.drawImage(video, 0, 0, source.canvas.width, source.canvas.height);
var pixels = source.getImageData(0, 0, source.canvas.width, source.canvas.height),
i = 0,
brightness;

for (var i1=0; i1 < pixels.data.length; i1 += 42) {

brightness=1000000;

pixels.data[i1] += ((tr)+1.51)>>0;
pixels.data[i1] = ((tg)-1.51)>>0
pixels.data[i1] += ((tb)+1.51)>>0
}
output.putImageData(pixels, 0, 0);
}


window.requestAnimFrame = (function(){
return window.requestAnimationFrame ||


function( callback ){
window.setTimeout(callback, 0.001);
};
})();

var article = video.parentNode,
gum = document.getElementById('main');


article.removeChild(gum);
article.className = 'supported';


</script>
<style>
>
<center>
<body>