var rand = function (min, max) {
    k = Math.floor(Math.random() * (max - min) + min);
    return (Math.round(k / s) * s);
}
function generateApple() {
    a = [rand(0, innerWidth),rand(0, innerHeight)];
}
var gP = document.getElementById('game');
var g = gP.getContext('2d');
var sBody = [{x: 0,y: 0}];
var d = 1; //Направление змейки 1 - вправо, 2 - вниз 3 - влево, 4 - вверх
var a = null;
var s = 25;
var sound = new Audio("audio/coin.wav");
gP.width = innerWidth; //на всю ширину экрана
gP.height = innerHeight; //на всю высоту экрана
generateApple();
setInterval(function(){
    if (a[0] + s >= gP.width || a[1] + s >= gP.height) {
        generateApple();
    }
    g.clearRect(0,0,gP.width,gP.height); //Очищаем старое
    g.fillStyle = "red";
    g.fillRect(...a, s, s);
    g.fillStyle = "#000";
    sBody.forEach(function(el, i){
        if (el.x == sBody[sBody.length - 1].x
            && el.y == sBody[sBody.length - 1].y
            && i < sBody.length - 1) { //Проверка на столкновение
                sBody.splice(0,sBody.length-1);
                sBody = [{x:0,y:0}];
                d = 1;
            }
    });
    var m = sBody[0], f = {x: m.x,y: m.y}, l = sBody[sBody.length - 1];
    // сохраняем хвост и голову змейки
    if (d == 1)  f.x = l.x + s, f.y = Math.round(l.y / s) * s;
    // если направление вправо, то тогда сохраняем Y, но меняем X на + s
    if (d == 2) f.y = l.y + s, f.x = Math.round(l.x / s) * s;
    // если направление вниз, то сохраняем X, но меняем Y на + s
    if (d == 3) f.x = l.x - s, f.y = Math.round(l.y / s) * s;
    // если направление влево, то сохраняем Y, но меняем X на -s
    if (d == 4) f.y = l.y - s, f.x = Math.round(l.x / s) * s;
    // если направление вверх, то сохраняем X, Но меняем Y на -ss
    sBody.push(f); //Добавляем хвост после головы с новыми координатами
    sBody.splice(0,1); //Удаляем хвост
    //Отрисовываем каждый элемент змейки
    sBody.forEach(function(pob, i){
        if (d == 1) if (pob.x > Math.round(gP.width / s) * s) pob.x = 0;
        if (d == 2) if (pob.y > Math.round(gP.height / s) * s) pob.y = 0;
        if (d == 3) if (pob.x < 0) pob.x = Math.round(gP.width / s) * s;
        if (d == 4) if (pob.y < 0) pob.y = Math.round(gP.height / s) * s;
        if (pob.x == a[0] && pob.y == a[1]) {
            generateApple();
            sBody.unshift({x: f.x - s, y:l.y})
            sound.play();
        }
        g.fillRect(pob.x, pob.y, s, s);
        // s - это ширина и высота нашего "квадрата"
    });
}, 1000/30);

onkeydown = function (e) {
    var k = e.keyCode;
    if ([38,39,40,37].indexOf(k) >= 0)
        e.preventDefault();
    if (k == 39 && d != 3) d = 1; //Вправо
    if (k == 40 && d != 4) d = 2; //Вниз
    if (k == 37 && d != 1) d = 3; //Влево
    if (k == 38 && d != 2) d = 4; //Вверх
};