picoCTF - Chromatophoria

Chromatophoria.html

<img id='steg' onload="draw()" src='steg.png'>
<canvas id="canv" width="800" height="600" style="border:1px solid #d3d3d3;"></canvas>
<script src='zappy.js'></script>
<script>
var c=document.getElementById("canv");
var ctx=c.getContext("2d");
var img=document.getElementById("steg");
function draw(){
ctx.drawImage(img,0,0);

imgdata = ctx.getImageData(0,0,800,600)
copy = ctx.createImageData(imgdata)
binaryLSB=""
//generate 100 x 75 img
for (var i=0; i<imgdata.data.length/128; i+=8){
    var data = imgdata.data
    var dd = ""
    //skip alpha bytes, every 4th byte
    for(var j=0;j<7;j++){
        if(j==3)
            continue
        dd+=data[j+i].toString(2).z(-1)
    }
    binaryLSB+=dd
}
var outstring=""
parsed = []// list of color values
for(var i =0;i<binaryLSB.length;i+=8){
    parsed.push(parseInt(binaryLSB.slice(i,i+8),2))
}
parsedInv=[]
for(var i=0;i<parsed.length;i++){
    parsedInv.push(parsed[i])
    if(i%3==2)
        parsedInv.push(255)
}
for(var i=0;i<parsedInv.length;i++){
    imgdata.data[i] = parsedInv[i]
}
for(var i=0;i<parsed.length;i++){
    outstring+=String.fromCharCode(parsed[i])
}
console.log(outstring)
ctx.putImageData(imgdata, 0, 0)

}
</script>