<table width="250" height="333" border="0" align="center" class="colorborder" > <tr> <td colspan="3" id="v21idpoint" align="center">баллов: 0</td> </tr> <tr> <td width="76" height="76" style="border: 1px solid #66aaee;"><canvas id="v21myCanvas0" width="76" height="76" style="cursor: pointer;" onclick="v21ButtonClick(9,0)"></canvas></td> <td width="76" height="76" style="border: 1px solid #66aaee;"><canvas id="v21myCanvas1" width="76" height="76" style="cursor: pointer;" onclick="v21ButtonClick(10,1)"></canvas></td> <td width="76" height="76" style="border: 1px solid #66aaee;"><canvas id="v21myCanvas2" width="76" height="76" style="cursor: pointer;" onclick="v21ButtonClick(11,2)"></canvas></td> </tr><tr> <td width="76" height="76" style="border: 1px solid #66aaee;"><canvas id="v21myCanvas3" width="76" height="76" style="cursor: pointer;" onclick="v21ButtonClick(9,3)"></canvas></td> <td width="76" height="76" style="border: 1px solid #66aaee;"><canvas id="v21myCanvas4" width="76" height="76" style="cursor: pointer;" onclick="v21ButtonClick(10,4)"></canvas></td> <td width="76" height="76" style="border: 1px solid #66aaee;"><canvas id="v21myCanvas5" width="76" height="76" style="cursor: pointer;" onclick="v21ButtonClick(11,5)"></canvas></td> </tr><tr> <td width="76" height="76" style="border: 1px solid #66aaee;"><canvas id="v21myCanvas6" width="76" height="76" style="cursor: pointer;" onclick="v21ButtonClick(9,6)"></canvas></td> <td width="76" height="76" style="border: 1px solid #66aaee;"><canvas id="v21myCanvas7" width="76" height="76" style="cursor: pointer;" onclick="v21ButtonClick(10,7)"></canvas></td> <td width="76" height="76" style="border: 1px solid #66aaee;"><canvas id="v21myCanvas8" width="76" height="76" style="cursor: pointer;" onclick="v21ButtonClick(11,8)"></canvas></td> </tr><tr> <td colspan="3" align="center"><input type="button" onclick="v21SortClick()" value="старт" /></td> </tr><tr> <td width="76" height="76" style="border: 1px solid #66aaee;"><canvas id="v21myCanvas9" width="76" height="76"></canvas></td> <td width="76" height="76" style="border: 1px solid #66aaee;"><canvas id="v21myCanvas10" width="76" height="76"></canvas></td> <td width="76" height="76" style="border: 1px solid #66aaee;"><canvas id="v21myCanvas11" width="76" height="76"></canvas></td> </tr><tr> <td colspan="3" align="center"><input type="button" onclick="v21NextClick()" value="далее" /></td> </tr> </table> <script> var v21canvas0 = document.querySelector("#v21myCanvas0"); var v21canvas1 = document.querySelector("#v21myCanvas1"); var v21canvas2 = document.querySelector("#v21myCanvas2"); var v21canvas3 = document.querySelector("#v21myCanvas3"); var v21canvas4 = document.querySelector("#v21myCanvas4"); var v21canvas5 = document.querySelector("#v21myCanvas5"); var v21canvas6 = document.querySelector("#v21myCanvas6"); var v21canvas7 = document.querySelector("#v21myCanvas7"); var v21canvas8 = document.querySelector("#v21myCanvas8"); var v21canvas9 = document.querySelector("#v21myCanvas9"); var v21canvas10 = document.querySelector("#v21myCanvas10"); var v21canvas11 = document.querySelector("#v21myCanvas11"); var v21context0 = v21canvas0.getContext("2d"); var v21context1 = v21canvas1.getContext("2d"); var v21context2 = v21canvas2.getContext("2d"); var v21context3 = v21canvas3.getContext("2d"); var v21context4 = v21canvas4.getContext("2d"); var v21context5 = v21canvas5.getContext("2d"); var v21context6 = v21canvas6.getContext("2d"); var v21context7 = v21canvas7.getContext("2d"); var v21context8 = v21canvas8.getContext("2d"); var v21context9 = v21canvas9.getContext("2d"); var v21context10 = v21canvas10.getContext("2d"); var v21context11 = v21canvas11.getContext("2d"); var v21ColorFon = ['#F1F3F4','#A080FF','#4080FF','#80FFA0','#80FF40','#60A060', '#408040','#90F090','#62646F','#60F060']; var v21ColorNum = ['#62646F','#62646F','#60F060','#FF8040','#FF80A0','#FF80A0','#FF8040','#A080FF','#F1F3F4','#A080FF']; var v21Size = '43'; var v21Left = '53'; var v21Top = '18'; var v21Number = [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]; var v21level = 0; var v21colpoint = 0; var v21Array9 = []; var v21Array10 = []; var v21Array11 = []; </script> <script> function v21getRandomInt(min, max) { return Math.floor(Math.random() * (max - min)) + min; } function v21getRandomIntNoRepid(min, max) { var tmpValue = v21getRandomInt(min, max); var tmpFlagRepid = false; for (i=0; i<9; i=i+1) if (v21Number[i] === tmpValue) tmpFlagRepid = true; while (tmpFlagRepid === true) { tmpValue = v21getRandomInt(min, max); tmpFlagRepid = false; for (i=0; i<9; i=i+1) if (v21Number[i] === tmpValue) tmpFlagRepid = true; } return tmpValue; } function v21NoArray(num) { var tmpnoar = true; for (j=0; j<10; j=j+1) { if (v21Array9[j] === num) tmpnoar = false; if (v21Array10[j] === num) tmpnoar = false; if (v21Array11[j] === num) tmpnoar = false; } return tmpnoar; } function v21getRandomIntNoRepid2(num, min, max) { var tmpCountWhile = 0; var tmpValue = v21getRandomInt(min, max); var tmpFlagRepid = v21NoArray(tmpValue); while ((tmpFlagRepid === true)&&(tmpCountWhile < 150)) { tmpCountWhile ++; tmpValue = v21getRandomInt(min, max); tmpFlagRepid = v21NoArray(tmpValue); } return tmpValue; } function v21SortClick() { for (j=0; j<9; j=j+3) { v21Number[j] = v21getRandomIntNoRepid(1, 10); } for (j=1; j<9; j=j+3) { v21Number[j] = v21getRandomIntNoRepid(11, 20); } for (j=2; j<9; j=j+3) { v21Number[j] = v21getRandomIntNoRepid(21, 30); } // for (i=1; i<10; i++) { v21Array9[i] = i; v21Array10[i] = i+10; v21Array11[i] = i+20; } // v21colpoint = 0; v21level = 0; document.getElementById('v21idpoint').innerHTML = 'баллов = ' + v21colpoint; v21NextClick(); v21Sort(); } function v21Sort() { var tmpsort = 0; for (m=0; m<5; m=m+1) for (i=m; i<9; i=i+3) for (j=i+3; j<9; j=j+3) if (v21Number[j] < v21Number[i]) { tmpsort = v21Number[j]; v21Number[j] = v21Number[i]; v21Number[i] = tmpsort; } } function v21NextClick() { v21Number[9] = v21getRandomIntNoRepid2(9, 1, 10); v21Number[10] = v21getRandomIntNoRepid2(10, 11, 20); v21Number[11] = v21getRandomIntNoRepid2(11, 21, 30); // for (j=1; j<10; j++) { if (v21Array9[j] === v21Number[9]) v21Array9[j] = 0; if (v21Array10[j] === v21Number[10]) v21Array10[j] = 0; if (v21Array11[j] === v21Number[11]) v21Array11[j] = 0; } // v21level ++; // var tmpArisEmpty = true; for (j=1; j<10; j++) if (v21Array9[j] != 0) tmpArisEmpty = false; if (tmpArisEmpty === true) for (j=1; j<10; j++) v21Array9[j] = j; tmpArisEmpty = true; for (j=1; j<10; j++) if (v21Array10[j] != 0) tmpArisEmpty = false; if (tmpArisEmpty === true) for (j=1; j<10; j++) v21Array10[j] = j+10; tmpArisEmpty = true; for (j=1; j<10; j++) if (v21Array11[j] != 0) tmpArisEmpty = false; if (tmpArisEmpty === true) for (j=1; j<10; j++) v21Array11[j] = j+20; } function v21ButtonClick(num1, num2) { if (v21Number[num2] != 0) { if (v21Number[num1] === v21Number[num2]) { v21colpoint = v21colpoint + v21Number[num2]; document.getElementById('v21idpoint').innerHTML = 'баллов = ' + v21colpoint; // v21Number[num2] = 0; } // var tmpFieldClear = true; for (j=0; j<9; j=j+1) if (v21Number[j] != 0) tmpFieldClear = false; if (tmpFieldClear === true) document.getElementById('v21idpoint').innerHTML += ' игровое поле очищено за ' + v21level + ' ходов'; } } function v21update() { for (i=0; i<12; i++) { var elm = eval("v21context" + i); elm.clearRect(0, 0, 76, 76); elm.beginPath(); elm.rect(4, 4, 67, 67); elm.fillStyle = v21ColorFon[Math.floor(v21Number[i]*10/30)]; elm.fill(); elm.closePath(); elm.beginPath(); elm.rect(1, 1, 72, 72); elm.strokeStyle = "#FFFF00"; elm.stroke(); elm.closePath(); elm.beginPath(); elm.font = v21Size + "px serif"; elm.fillStyle = v21ColorNum[Math.floor(v21Number[i]*10/30)]; if (v21Number[i] > 0) elm.fillText(v21Number[i], v21Top, v21Left); elm.fill(); elm.closePath(); } requestAnimationFrame(v21update); } v21update(); </script>