let arrCanv = [0,0], canvas, context, html = document.getElementsByTagName('html')[0], rnd = (min, max) => Math.floor(Math.random()*max+min); html.textContent = ''; ['https://i.pinimg.com/736x/dd/1c/da/dd1cda9799732887e61ff7a3cc061415.jpg', 'https://i.pinimg.com/736x/b4/29/e3/b429e3f335402a5d498b0d683db26c3f.jpg'].map(e=>{ let img = document.createElement('img'); img.src = e; document.getElementsByTagName('html')[0].appendChild(img); }); setTimeout(()=>{ arrCanv = arrCanv.map((canvas, pos)=>{ canvas = document.createElement('canvas'); canvas.width = canvas.height = 300; context = canvas.getContext('2d'); context.fillStyle = '#FFF'; context.fillRect(0,0, canvas.width, canvas.height); context.beginPath(); if (pos % 2 == 0) { context.drawImage(document.getElementsByTagName('img')[0], 0, 0, canvas.width, canvas.height); } else { context.drawImage(document.getElementsByTagName('img')[1], 0, 0, canvas.width, canvas.height); context.fillStyle = '#000' context.font = (canvas.height/5).toString().concat("px serif"); context.fillText("Dyrk.org", canvas.width/5, canvas.height/5); }; return {canvas:canvas, context:context}; }); html.textContent = ''; html.appendChild(arrCanv[0].canvas); html.appendChild(arrCanv[0].canvas); blockToHideData = arrCanv[0].context.getImageData(0, 0, arrCanv[0].canvas.height, arrCanv[0].canvas.width); blockWithData = arrCanv[1].context.getImageData(0, 0, arrCanv[0].canvas.height, arrCanv[0].canvas.width); for (var i = 0; i <= blockToHideData.data.length-1; i+=4) { binString = []; blockToHideData.data[i].toString(2).split('').map((e,i)=>binString[i] =e); test = [blockWithData.data[i],blockWithData.data[i+1],blockWithData.data[i+2]].filter(e=>e<255).length-1 > 0; binString[binString.length-1] = test ? '1' : '0'; binString.map(e=>typeof e !='undefined' && e === 0 || e==1 ? e : 0); blockToHideData.data[i] = parseInt(binString.join(''), 2); }; arrCanv[0].context.putImageData(blockToHideData, 0, 0); }, 3000);