<p><table width="400" height="400" border="1" align="center"> <tr> <td colspan="7" id="v11idpoint" align="center">point = 0</td> </tr> <tr> <td width="57" height="57" style="cursor:pointer" onclick="v11sharclick(0)"><canvas id="v11myCanvas0" width="57" height="57"></canvas></td> <td> </td> <td width="57" height="57" style="cursor:pointer" onclick="v11sharclick(1)"><canvas id="v11myCanvas1" width="57" height="57"></canvas></td> <td> </td> <td width="57" height="57" style="cursor:pointer" onclick="v11sharclick(2)"><canvas id="v11myCanvas2" width="57" height="57"></canvas></td> <td> </td> <td width="57" height="57" style="cursor:pointer" onclick="v11sharclick(3)"><canvas id="v11myCanvas3" width="57" height="57"></canvas></td> </tr> <tr> <td> </td> <td width="57" height="57" style="cursor:pointer" onclick="v11sharclick(4)"><canvas id="v11myCanvas4" width="57" height="57"></canvas></td> <td> </td> <td width="57" height="57" style="cursor:pointer" onclick="v11sharclick(5)"><canvas id="v11myCanvas5" width="57" height="57"></canvas></td> <td> </td> <td width="57" height="57" style="cursor:pointer" onclick="v11sharclick(6)"><canvas id="v11myCanvas6" width="57" height="57"></canvas></td> <td> </td> </tr> <tr> <td width="57" height="57" style="cursor:pointer" onclick="v11sharclick(7)"><canvas id="v11myCanvas7" width="57" height="57"></canvas></td> <td> </td> <td width="57" height="57" style="cursor:pointer" onclick="v11sharclick(8)"><canvas id="v11myCanvas8" width="57" height="57"></canvas></td> <td> </td> <td width="57" height="57" style="cursor:pointer" onclick="v11sharclick(9)"><canvas id="v11myCanvas9" width="57" height="57"></canvas></td> <td> </td> <td width="57" height="57" style="cursor:pointer" onclick="v11sharclick(10)"><canvas id="v11myCanvas10" width="57" height="57"></canvas></td> </tr> <tr> <td> </td> <td width="57" height="57" style="cursor:pointer" onclick="v11sharclick(11)"><canvas id="v11myCanvas11" width="57" height="57"></canvas></td> <td> </td> <td width="57" height="57" style="cursor:pointer" onclick="v11sharclick(12)"><canvas id="v11myCanvas12" width="57" height="57"></canvas></td> <td> </td> <td width="57" height="57" style="cursor:pointer" onclick="v11sharclick(13)"><canvas id="v11myCanvas13" width="57" height="57"></canvas></td> <td> </td> </tr> <tr> <td width="57" height="57" style="cursor:pointer" onclick="v11sharclick(14)"><canvas id="v11myCanvas14" width="57" height="57"></canvas></td> <td> </td> <td width="57" height="57" style="cursor:pointer" onclick="v11sharclick(15)"><canvas id="v11myCanvas15" width="57" height="57"></canvas></td> <td> </td> <td width="57" height="57" style="cursor:pointer" onclick="v11sharclick(16)"><canvas id="v11myCanvas16" width="57" height="57"></canvas></td> <td> </td> <td width="57" height="57" style="cursor:pointer" onclick="v11sharclick(17)"><canvas id="v11myCanvas17" width="57" height="57"></canvas></td> </tr> <tr> <td> </td> <td width="57" height="57" style="cursor:pointer" onclick="v11sharclick(18)"><canvas id="v11myCanvas18" width="57" height="57"></canvas></td> <td> </td> <td width="57" height="57" style="cursor:pointer" onclick="v11sharclick(19)"><canvas id="v11myCanvas19" width="57" height="57"></canvas></td> <td> </td> <td width="57" height="57" style="cursor:pointer" onclick="v11sharclick(20)"><canvas id="v11myCanvas20" width="57" height="57"></canvas></td> <td> </td> </tr> <tr> <td width="57" height="57" style="cursor:pointer" onclick="v11sharclick(21)"><canvas id="v11myCanvas21" width="57" height="57"></canvas></td> <td> </td> <td width="57" height="57" style="cursor:pointer" onclick="v11sharclick(22)"><canvas id="v11myCanvas22" width="57" height="57"></canvas></td> <td> </td> <td width="57" height="57" style="cursor:pointer" onclick="v11sharclick(23)"><canvas id="v11myCanvas23" width="57" height="57"></canvas></td> <td> </td> <td width="57" height="57" style="cursor:pointer" onclick="v11sharclick(24)"><canvas id="v11myCanvas24" width="57" height="57"></canvas></td> </tr> </table></p> <p> <script> var v11canvas0 = document.querySelector("#v11myCanvas0"); var v11canvas1 = document.querySelector("#v11myCanvas1"); var v11canvas2 = document.querySelector("#v11myCanvas2"); var v11canvas3 = document.querySelector("#v11myCanvas3"); var v11canvas4 = document.querySelector("#v11myCanvas4"); var v11canvas5 = document.querySelector("#v11myCanvas5"); var v11canvas6 = document.querySelector("#v11myCanvas6"); var v11canvas7 = document.querySelector("#v11myCanvas7"); var v11canvas8 = document.querySelector("#v11myCanvas8"); var v11canvas9 = document.querySelector("#v11myCanvas9"); var v11canvas10 = document.querySelector("#v11myCanvas10"); var v11canvas11 = document.querySelector("#v11myCanvas11"); var v11canvas12 = document.querySelector("#v11myCanvas12"); var v11canvas13 = document.querySelector("#v11myCanvas13"); var v11canvas14 = document.querySelector("#v11myCanvas14"); var v11canvas15 = document.querySelector("#v11myCanvas15"); var v11canvas16 = document.querySelector("#v11myCanvas16"); var v11canvas17 = document.querySelector("#v11myCanvas17"); var v11canvas18 = document.querySelector("#v11myCanvas18"); var v11canvas19 = document.querySelector("#v11myCanvas19"); var v11canvas20 = document.querySelector("#v11myCanvas20"); var v11canvas21 = document.querySelector("#v11myCanvas21"); var v11canvas22 = document.querySelector("#v11myCanvas22"); var v11canvas23 = document.querySelector("#v11myCanvas23"); var v11canvas24 = document.querySelector("#v11myCanvas24"); var v11context0 = v11canvas0.getContext("2d"); var v11context1 = v11canvas1.getContext("2d"); var v11context2 = v11canvas2.getContext("2d"); var v11context3 = v11canvas3.getContext("2d"); var v11context4 = v11canvas4.getContext("2d"); var v11context5 = v11canvas5.getContext("2d"); var v11context6 = v11canvas6.getContext("2d"); var v11context7 = v11canvas7.getContext("2d"); var v11context8 = v11canvas8.getContext("2d"); var v11context9 = v11canvas9.getContext("2d"); var v11context10 = v11canvas10.getContext("2d"); var v11context11 = v11canvas11.getContext("2d"); var v11context12 = v11canvas12.getContext("2d"); var v11context13 = v11canvas13.getContext("2d"); var v11context14 = v11canvas14.getContext("2d"); var v11context15 = v11canvas15.getContext("2d"); var v11context16 = v11canvas16.getContext("2d"); var v11context17 = v11canvas17.getContext("2d"); var v11context18 = v11canvas18.getContext("2d"); var v11context19 = v11canvas19.getContext("2d"); var v11context20 = v11canvas20.getContext("2d"); var v11context21 = v11canvas21.getContext("2d"); var v11context22 = v11canvas22.getContext("2d"); var v11context23 = v11canvas23.getContext("2d"); var v11context24 = v11canvas24.getContext("2d"); var v11Color = ["#F2F4FF","#4080FF","#FF8040"]; var v11myColor = ["#4080FF","#F2F4FF","#F2F4FF","#FF8040", "#F2F4FF","#F2F4FF","#F2F4FF","#4080FF","#F2F4FF", "#F2F4FF","#FF8040","#F2F4FF","#F2F4FF", "#F2F4FF","#4080FF","#F2F4FF","#F2F4FF","#FF8040", "#F2F4FF","#F2F4FF","#F2F4FF","#4080FF","#F2F4FF", "#F2F4FF","#FF8040"]; var v11select = [false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false]; </script> <script> function v11update() { for (i=0; i<25; i++) { var elm = eval("v11context" + i); elm.clearRect(0, 0, 57, 57); elm.beginPath(); elm.rect(3, 3, 50, 50); elm.fillStyle = v11myColor[i]; elm.fill(); if (v11select[i]) { elm.rect(1, 1, 54, 54); elm.strokeStyle = "#008000"; elm.stroke(); }} requestAnimationFrame(v11update); } v11update(); </script> <script> var v11colpoint = 0; var Click1 = false; var NClick1 = -1; var Click2 = false; var NClick2 = -1; function v11sharclick(numshar) { if ((Click1 === false) && (Click2 === false)) { if (v11Color[0] !== v11myColor[numshar]) { NClick1 = numshar; NClick2 = -1; Click1 = true; v11select[numshar] = true; } } else { if ((Click1 === true) && (Click2 === false)) { // if (NClick1 === numshar) { NClick1 = -1; NClick2 = -1; Click1 = false; Click2 = false; v11select = [false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false]; } else { if ((numshar === (NClick1 - 4))||(numshar === (NClick1 - 3))||(numshar === (NClick1 + 4))|| (numshar === (NClick1 + 3))) { if (v11Color[0] === v11myColor[numshar]){ NClick2 = numshar; Click2 = true; v11select[numshar] = true; }}} // } else { if ((Click1 === false) && (Click2 === true)) { NClick1 = -1; NClick2 = -1; Click1 = false; Click2 = false; v11select = [false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false]; }}} if ((Click1 === true) && (Click2 === true)) { var tempColor = v11myColor[NClick2]; v11myColor[NClick2] = v11myColor[NClick1]; v11myColor[NClick1] = tempColor; v11colpoint = v11colpoint + 1; document.getElementById('v11idpoint').innerHTML = 'point = '+v11colpoint; Check(); NClick1 = -1; NClick2 = -1; Click1 = false; Click2 = false; v11select = [false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false]; } } function Check() { var tresult = false; if (v11myColor[4] === v11Color[1]) if ((v11myColor[0] === v11Color[2])|| (v11myColor[1] === v11Color[2])||(v11myColor[7] === v11Color[2])||(v11myColor[8] === v11Color[2])) {tresult = true}; if (v11myColor[4] === v11Color[2]) if ((v11myColor[0] === v11Color[1])|| (v11myColor[1] === v11Color[1])||(v11myColor[7] === v11Color[1])||(v11myColor[8] === v11Color[1])) {tresult = true}; if (v11myColor[5] === v11Color[1]) if ((v11myColor[1] === v11Color[2])|| (v11myColor[2] === v11Color[2])||(v11myColor[9] === v11Color[2])||(v11myColor[8] === v11Color[2])) {tresult = true}; if (v11myColor[5] === v11Color[2]) if ((v11myColor[1] === v11Color[1])|| (v11myColor[2] === v11Color[1])||(v11myColor[9] === v11Color[1])||(v11myColor[8] === v11Color[1])) {tresult = true}; if (v11myColor[6] === v11Color[1]) if ((v11myColor[3] === v11Color[2])|| (v11myColor[2] === v11Color[2])||(v11myColor[9] === v11Color[2])||(v11myColor[10] === v11Color[2])) {tresult = true}; if (v11myColor[6] === v11Color[2]) if ((v11myColor[3] === v11Color[1])|| (v11myColor[2] === v11Color[1])||(v11myColor[9] === v11Color[1])||(v11myColor[10] === v11Color[1])) {tresult = true}; if (v11myColor[11] === v11Color[1]) if ((v11myColor[7] === v11Color[2])|| (v11myColor[8] === v11Color[2])||(v11myColor[14] === v11Color[2])||(v11myColor[15] === v11Color[2])) {tresult = true}; if (v11myColor[11] === v11Color[2]) if ((v11myColor[7] === v11Color[1])|| (v11myColor[8] === v11Color[1])||(v11myColor[14] === v11Color[1])||(v11myColor[15] === v11Color[1])) {tresult = true}; if (v11myColor[12] === v11Color[1]) if ((v11myColor[8] === v11Color[2])|| (v11myColor[9] === v11Color[2])||(v11myColor[15] === v11Color[2])||(v11myColor[16] === v11Color[2])) {tresult = true}; if (v11myColor[12] === v11Color[2]) if ((v11myColor[8] === v11Color[1])|| (v11myColor[9] === v11Color[1])||(v11myColor[15] === v11Color[1])||(v11myColor[16] === v11Color[1])) {tresult = true}; if (v11myColor[13] === v11Color[1]) if ((v11myColor[9] === v11Color[2])|| (v11myColor[10] === v11Color[2])||(v11myColor[16] === v11Color[2])||(v11myColor[17] === v11Color[2])) {tresult = true}; if (v11myColor[13] === v11Color[2]) if ((v11myColor[9] === v11Color[1])|| (v11myColor[10] === v11Color[1])||(v11myColor[16] === v11Color[1])||(v11myColor[17] === v11Color[1])) {tresult = true}; if (v11myColor[18] === v11Color[1]) if ((v11myColor[14] === v11Color[2])|| (v11myColor[15] === v11Color[2])||(v11myColor[21] === v11Color[2])||(v11myColor[22] === v11Color[2])) {tresult = true}; if (v11myColor[18] === v11Color[2]) if ((v11myColor[14] === v11Color[1])|| (v11myColor[15] === v11Color[1])||(v11myColor[21] === v11Color[1])||(v11myColor[22] === v11Color[1])) {tresult = true}; if (v11myColor[19] === v11Color[1]) if ((v11myColor[15] === v11Color[2])|| (v11myColor[16] === v11Color[2])||(v11myColor[22] === v11Color[2])||(v11myColor[23] === v11Color[2])) {tresult = true}; if (v11myColor[19] === v11Color[2]) if ((v11myColor[15] === v11Color[1])|| (v11myColor[16] === v11Color[1])||(v11myColor[22] === v11Color[1])||(v11myColor[23] === v11Color[1])) {tresult = true}; if (v11myColor[20] === v11Color[1]) if ((v11myColor[16] === v11Color[2])|| (v11myColor[17] === v11Color[2])||(v11myColor[23] === v11Color[2])||(v11myColor[24] === v11Color[2])) {tresult = true}; if (v11myColor[20] === v11Color[2]) if ((v11myColor[16] === v11Color[1])|| (v11myColor[17] === v11Color[1])||(v11myColor[23] === v11Color[1])||(v11myColor[24] === v11Color[1])) {tresult = true}; if (tresult) alert ('Недопустимый ход') } </script></p>
