<!DOCTYPE html>
<html>
<body onload="press(event)">
<canvas id="myCanvas" width="500" height="500" style="border:1px solid
#d3d3d3;" onclick="press(event)">
</canvas>
<div id="mytext"> </div>
<div id="mytext2"> </div>
<script>
let c = document.getElementById("myCanvas");
let ctx = c.getContext("2d");
let color_1 = '#' + Math.floor(Math.random()*16777215).toString(16);
let color_2 = '#' + Math.floor(Math.random()*16777215).toString(16);
let objs = ['0', '50','100','150','200','250','300','350','400'];
let fplay = [1,1,1,1,1,1,1,1,1];
let globalX = 0;
let GlobalY = 0;
function getRandomInt(min, max) {
return Math.floor(Math.random() * (max - min + 1)) + min;
}
let state = new Array(11);
for (let i = 0; i <= 10; i++) {
state[i] = new Array(11);
}
for (let i = 0; i <= 10;i++){
for (let k = 0; k <= 10;k++){
state[i][k] = 1;
}
}
for (let i= 0;i <=10;i++){
state[getRandomInt(1,9)][i] = 2;
}
let counter1 = 0;
let counter2 = 0;
function press(event){
for (let y = 0;y <= 500;y+=50){
for (let x = 0;x <= 500;x+=50){
if ((x >= event.pageX-10 && x <= event.pageX+40) && (y >= event.pageY-10
&& y <= event.pageY+40))
{
counter1++;
if (state[y/50][x/50] == 2) state[y/50][x/50]=3;
if (state[y/50][x/50] == 1) state[y/50][x/50]=5;
//let elem = document.getElementById("mytext");
//elem.innerHTML = x + " " + y +"<br>";
}
}
}
//очистка холста
ctx.clearRect(0,0,500,500);
ctx.beginPath();
for (let y = 0; y <= 500; y += 50) {
for (let x = 0; x <= 500; x += 50) {
ctx.moveTo(0, y);
ctx.lineTo(500, y);
ctx.moveTo(x, 0);
ctx.lineTo(x, 500);
}
ctx.stroke();
}
//Рисовка квадратов
for (let y = 0; y <= 500; y += 50) {
for (let x = 0;x <= 500;x+=50){
if (state[y/50][x/50] == 5)
{
ctx.fillStyle = 'red';
ctx.fillRect(x-50,y-50, 49, 49);
}
if (state[y/50][x/50] == 3)
{
counter2++;
ctx.fillStyle = 'blue';
ctx.fillRect(x-50,y-50, 49, 49);
state[y/50][x/50] = 4;
}
if (state[y/50][x/50] == 4)
{
ctx.fillStyle = 'blue';
ctx.fillRect(x-50,y-50, 49, 49);
}
}
}
let elem = document.getElementById("mytext");
elem.innerHTML = "количество попыток " +counter1+"<br>";
if (counter2 == 1) alert("подбит один корабль ");
if (counter2 == 2) alert("подбито два корабля ");
if (counter2 == 3) alert("подбито три корабля ");
if (counter2 == 4) alert("подбито четыре корабля ");
if (counter2 == 5) alert("подбито пять кораблей ");
if (counter2 == 6) alert("подбито шесть кораблей ");
if (counter2 == 7) alert("подбито семь кораблей ");
if (counter2 == 8) alert("подбито восемь кораблей ");
if (counter2 == 9) alert("подбито девять кораблей ");
if (counter2 == 10) alert("подбито десять кораблей,все корабли потоплены! ");
}
</script>
</body>
</html>
| 