Draw your background image. Right-Click on the single element (black borders square upon the clean button) to save it as an image ...
_="l=64A=10VO#fff'd=docum; g(iQ&d.getE3mById(i)} c(t,i5eg(i~!e5ed.cqateE3m9' t.appendChild(ee.Pi; }&e;}b.innzHTMLO<>{float:3ft}.C{ZZ}#S,#^^a{;;}</Wv%Ga%Gbr*IC\"* onX=\"top.qload()Re`t\"/br/WS%/W%>';aa?vv?SS?II'Kx=|getContext(\"2d\")|=l|=l;-upVF-dragstart'(e5V;e.pqvDefault(FOrgb(0,0,0,0)' (t5t=t$x1]y0]Sty3=;ReK(x0y011g9?..Ourl9+|toDataURL()+?'}Ji0; iYi++QJj0; jYj++Qe=c(v,i+'_'+jdown=1;()Feovz~5()}F}}Ichange=.valueF;ec(S,=e$;eX=F`3Ked_C.addEvListenz9backgroundfunKionmou`0=par`Int(t.P.split9_?['(5bordz:solP 1@ #000divolorvar e.classNameOC';esty3 P=\"height);, ><wPth = =g9thisent.bgc:768@}#\" type=\"Kx.fill$..C=%\"/&qturn */input-window3le5){9('?')@pxF}GcanvasJfor (KctO='PidQ) {V=0WXclickY< l; Z:10@;^v,#{`seqrezer|a.~if (:64@";for(Y in $="~|zq`^ZYXWVQPOKJGF@?953-*&%$")with(_.split($[Y]))_=join(pop());eval(_)
Xz0iD2w9NjQVQT0xMBVWFQJPI2ZmZicVZD1kb2N1bRs7BSBnKGlRJmQuZ2V0RTNtG0J5SWQoaSl9BSBjKHQsaTUPZRhnKGkUfiFlNWUYZC5jcWF0ZUUzbRs5DCcUCXQuYXBwZW5kQ2hpbGQoZRRlLlAYaTsJCX0mZTt9Yi5pbm56SFRNTE88ET4Me2Zsb2F0OjNmdH0uQ3sXWhNaC30jUywjXhcdXhMdYXsLOxd/OxN/fTwvEVd2JQwWDBZHEmElRxZicioSSR5DDlwiKiBvblg9XCJ0b3AucWxvYWQoKR5SZWB0XCIvFmJyL1dTJQwWLwxXBCUMPic7D2EZYT8Vdhl2PxVTGVM/FUkZSScUS3g9fGdldENvbnRleHQoXCIyZFwiKRV8Fz1sFXwTPWw7LQZ1cAhWRi1kcmFnc3RhcnQnFQUoZTVWO2UucHF2G0RlZmF1bHQoFEYCT3JnYigwLDAsMCwwKScBBSAEKHQ1dBw9dCQBeAcxXRR5BzBdFB9TdHkzPQI7H1JlSyh4MBV5MBUxFTEUZzkEPy4RLgRPdXJsOSt8dG9EYXRhVVJMKCkrPyd9SmkYMDsgaVlpKytRSmoYMDsgallqKytRD2U9Yyh2LGkrJ18nK2oQAwZkb3duCAY9MTsEKBopRmUDBm92egh+BjUEKBopfUZ9fUkDY2hhbmdlCAI9Gi52YWx1ZUYBOw9lGGMoUywCEBw9ZSQ7ZQNYCAI9GhxGAmAzS2VkX0MOAy5hZGRFdhtMaXN0ZW56OQRiYWNrZ3JvdW5kBWZ1bktpb24GbW91YAcwPXBhcmBJbnQodC5QLnNwbGl0OV8/WwgnFQUoNQtib3Jkejpzb2xQIDFAICMwMDAMZGl2Dm9sb3IPdmFyIBAUZS5jbGFzc05hbWVPQyc7ZRFzdHkzEiBQPVwiE2hlaWdodBQpOxUsIBY+PBd3UHRoGCA9IBk9ZzkadGhpcxtlbnQcLmJnYw4dOjc2OEB9Ix5cIiB0eXBlPVwiH0t4LmZpbGwkLhEuBEMOPQIlXCIWLyZxdHVybiAqLxZpbnB1dC13aW5kb3cDM2xlNSl7OSgnPycpQHB4Rn0UR2NhbnZhc0pmb3IgKA9LY3RPPSdQaWRRKSB7VgY9MFcWDBJYY2xpY2tZPCBsOyBaOjEwQDtediwjBHtgc2VxcmV6ZXJ8YS5+aWYgKH86NjRAIjtmb3IoWSBpbiAkPSJ/fnx6cWBeWllYV1ZRUE9LSkdGQD85NTMtKiYlJB8eHRwbGhkYFxYVFBMSERAPDgwLCAcGBQQDAgEiKXdpdGgoXy5zcGxpdCgkW1ldKSlfPWpvaW4ocG9wKCkpO2V2YWwoXyk=
/**
* @file javascript into shim.html
* @version 2019-02-05-10-52-00
* @date 2019/02/05
* @author Patrice CHASSAING
* @copyright Me
* @brief JS1k 2019 demo contest : "Draw it back."
*/
//1013bytes
///*
var l=64, A=10, mouse=0, selected_Color='#fff', d=document;
//s=768, //l*12
function g(i) {
return d.getElementById(i)
}
function c(t,i){
var e = g(i);
if (!e){
e = d.createElement('div');
t.appendChild(e);
e.id = i;
}
return e;
}
b.innerHTML='<style>div{float:left}.C{width:10px;height:10px;border:solid 1px #000}#S,#v,#background{width:768px}#v,#background{height:768px}#a{border:solid 1px #000;width:64px;height:64px}</style><div id="v"></div><div><canvas id="a"></canvas><br/><input id="I" type="Color"/><input onclick="top.reload()" type="Reset"/><br/><div id="S"></div></div><div id="background"></div>';
var a=g('a'), v=g('v'), S=g('S'), I=g('I');
ctx=a.getContext("2d"), a.width=l, a.height=l;
window.addEventListener('mouseup', function(){mouse=0});
window.addEventListener('dragstart', function(e){mouse=0;e.preventDefault();});
selected_Color='rgb(0,0,0,0)';var e = c(S,selected_Color);e.className='C';e.bgcolor=e.style.backgroundColor=selected_Color;e.addEventListener('click', function(){selected_Color=this.bgcolor});
function background(t){t.bgcolor=t.style.backgroundColor=selected_Color;var e = c(S,selected_Color);e.className='C';e.bgcolor=e.style.backgroundColor=selected_Color;e.addEventListener('click', function(){selected_Color=this.bgcolor});x0=parseInt(t.id.split('_')[1]);y0=parseInt(t.id.split('_')[0]);ctx.fillStyle=selected_Color;ctx.fillRect(x0, y0, 1, 1);g('background').style.background='url('+a.toDataURL()+')'}
for (var i = 0; i< l; i++) {
for (var j = 0; j< l; j++) {
var e=c(v,i+'_'+j);
e.className='C';
e.addEventListener('mousedown', function(){mouse=1;background(this)});
e.addEventListener('mouseover', function(){if (mouse){background(this)}});
}
}
I.addEventListener('change', function(){selected_Color=this.value});
//*/