Created
December 10, 2017 07:39
-
-
Save phi16/c5a52aa305cf5f21165b4d0964eaed41 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // dokka kara totte kita | |
| function dataURItoBlob(dataURI) { | |
| // convert base64/URLEncoded data component to raw binary data held in a string | |
| var byteString; | |
| if (dataURI.split(',')[0].indexOf('base64') >= 0) | |
| byteString = atob(dataURI.split(',')[1]); | |
| else | |
| byteString = unescape(dataURI.split(',')[1]); | |
| // separate out the mime component | |
| var mimeString = dataURI.split(',')[0].split(':')[1].split(';')[0]; | |
| // write the bytes of the string to a typed array | |
| var ia = new Uint8Array(byteString.length); | |
| for (var i = 0; i < byteString.length; i++) { | |
| ia[i] = byteString.charCodeAt(i); | |
| } | |
| return new Blob([ia], {type:mimeString}); | |
| } | |
| var next = async cur=>{ | |
| // Paste all images | |
| let canvas = document.createElement('canvas'); | |
| let ctx = canvas.getContext('2d'); | |
| canvas.width = 246*6; | |
| canvas.height = 246; | |
| canvas.id = "po"; | |
| let url = "http://qubicrube.pwn.seccon.jp:33654"; | |
| //let cur = "02c286df1bbd7923d1f7"; | |
| let ns = ["U","L","R","B","D","F"]; | |
| let is = []; | |
| let allload = _=>_, cnt = 0; | |
| for(let i=0;i<6;i++){ | |
| let fn = url + "/images/" + cur + "_" + ns[i] + ".png"; | |
| let blob = await (await fetch(fn)).blob(); | |
| let imurl = URL.createObjectURL(blob); | |
| let img = new Image(); | |
| img.src = imurl; | |
| img.onload = _=>{ | |
| cnt++; | |
| if(cnt == 6) allload(); | |
| }; | |
| is.push(img); | |
| } | |
| await (new Promise(resolve=>{ | |
| allload = resolve; | |
| })); | |
| for(let i=0;i<6;i++){ | |
| ctx.drawImage(is[i],i*246,0,246,246); | |
| } | |
| let oldc = document.getElementById("po"); | |
| if(oldc) document.body.removeChild(oldc); | |
| for(let i=0;i<6;i++){ | |
| let oldt = document.getElementById("tile" + i); | |
| if(oldt) document.body.removeChild(oldt); | |
| } | |
| document.body.appendChild(canvas); | |
| let colors = [ | |
| [255,255,255], | |
| [196,30,58], | |
| [255,88,0], | |
| [255,213,0], | |
| [0,158,96], | |
| [0,81,186] | |
| ]; | |
| for(let colorIx = 0; colorIx < 6; colorIx ++){ | |
| // Clip images | |
| let clip = document.createElement('canvas'); | |
| let ctt = clip.getContext('2d'); | |
| let s = 246/3; | |
| clip.width = s; | |
| clip.height = s; | |
| let corners = []; | |
| let edges = []; | |
| let faces = []; | |
| let writeTo = [corners,edges,corners,edges,faces,edges,corners,edges,corners]; | |
| let rots = [0,0,3,1,0,3,1,2,2]; | |
| for(let i=0;i<6;i++){ | |
| for(let j=0;j<3;j++){ | |
| for(let k=0;k<3;k++){ | |
| let ox = i*246 + j*s; | |
| let oy = k*s; | |
| ctt.drawImage(canvas,ox,oy,s,s,0,0,s,s); | |
| let buff = ctt.getImageData(0,0,s,s).data; | |
| let isYellow = false; | |
| for(let p=0;p<82*82;p++){ | |
| if( | |
| buff[p*4 + 0]==colors[colorIx][0] && | |
| buff[p*4 + 1]==colors[colorIx][1] && | |
| buff[p*4 + 2]==colors[colorIx][2]) { | |
| isYellow = true; | |
| break; | |
| } else if( | |
| buff[p*4 + 0]==0 && | |
| buff[p*4 + 1]==0 && | |
| buff[p*4 + 2]==0) { | |
| // do nothing | |
| } else { | |
| isYellow = false; | |
| } | |
| } | |
| if(isYellow) { | |
| let cc = document.createElement("canvas"); | |
| cc.width = s, cc.height = s; | |
| let t = cc.getContext('2d'); | |
| let rx = j*s, ry = k*s; | |
| let target = writeTo[j*3+k]; | |
| t.save(); | |
| if(target == edges){ | |
| t.translate(0,-246/3); | |
| }else if(target == faces){ | |
| t.translate(-246/3,-246/3); | |
| } | |
| t.translate(246/2,246/2); | |
| t.rotate(-rots[j*3+k]*Math.PI/2); | |
| t.translate(-246/2,-246/2); | |
| t.drawImage(canvas,ox,oy,s,s,rx,ry,s,s); | |
| t.restore(); | |
| let dir = target==edges | |
| ? [[0,s*6],[s+s-1,-6],[s*s-1,-s*6],[s*s-s,6]] | |
| : [[0,6],[s+s-1,s*6],[s*s-1,-6],[s*s-s,-s*6]]; | |
| let frame = []; | |
| let buff = t.getImageData(0,0,s,s).data; | |
| for(let i=0;i<4;i++){ | |
| let c = dir[i][0]; | |
| let v = []; | |
| for(let j=0;j<14;j++){ | |
| if( | |
| buff[c*4+0] == 0 && | |
| buff[c*4+1] == 0 && | |
| buff[c*4+2] == 0){ | |
| v.push(1); | |
| }else v.push(0); | |
| c += dir[i][1]; | |
| } | |
| frame.push(v); | |
| } | |
| console.log(JSON.stringify(frame)); | |
| target.push([cc,frame]); | |
| } | |
| } | |
| } | |
| } | |
| let tile = document.createElement("canvas"); | |
| tile.width = 246, tile.height = 246; | |
| tile.id = "tile" + colorIx; | |
| let ttt = tile.getContext('2d'); | |
| // Face | |
| let fframe = faces[0][1]; | |
| ttt.drawImage(faces[0][0],s,s); | |
| // Edge | |
| let eframes = [[],[],[],[]]; | |
| for(let i=0;i<4;i++){ | |
| edges.forEach(e=>{ | |
| if(JSON.stringify(e[1][2]) == JSON.stringify(fframe[i])){ | |
| ttt.save(); | |
| ttt.translate(246/2,246/2); | |
| ttt.rotate((i+1)*Math.PI/2); | |
| ttt.translate(-246/2,-246/2); | |
| ttt.drawImage(e[0],0,s,s,s); | |
| ttt.restore(); | |
| eframes[i].push(e[1][1],e[1][3]); | |
| } | |
| }); | |
| } | |
| // Corner | |
| for(let i=0;i<4;i++){ | |
| corners.forEach(c=>{ | |
| if(JSON.stringify(c[1][2]) == JSON.stringify(eframes[i][0]) && JSON.stringify(c[1][1]) == JSON.stringify(eframes[(i+1)%4][1])){ | |
| ttt.save(); | |
| ttt.translate(246/2,246/2); | |
| ttt.rotate((i+1)*Math.PI/2); | |
| ttt.translate(-246/2,-246/2); | |
| ttt.drawImage(c[0],0,0,s,s); | |
| ttt.restore(); | |
| } | |
| }); | |
| } | |
| document.body.appendChild(tile); | |
| let reconBlob = dataURItoBlob(tile.toDataURL('image/png')); | |
| let a = document.createElement('a'); | |
| a.download = "QR" + colorIx + "_" + cur + ".png"; | |
| a.href = URL.createObjectURL(reconBlob); | |
| a.click(); | |
| } | |
| }; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment