/**
 * Snake v0.1.0
 */

// set share btns urls
const shareBtns = function() {
	const currentPageLink = location.href;
	const vkEl = document.getElementById("vk");
	vkEl.setAttribute("href", `https://vk.com/share.php?url=${currentPageLink}`);

	const fbEl = document.getElementById("fb");
	fbEl.setAttribute(
		"href",
		`https://www.facebook.com/sharer/sharer.php?u=${currentPageLink}`
	);

	const twEl = document.getElementById("tw");
	twEl.setAttribute(
		"href",
		`http://twitter.com/share?text=WebSnake!&url=${currentPageLink}`
	);
};

const config = {
	initialLength: 10,
	stepDuration: 300,
	speedMult: 0.8,
	foodScore: 25,
	speedUpScoreN: 50,
	fieldWidth: 20,
	fieldHeight: 20,
	cellSize: 20
};

let gameStatus = "new"; // "new" | "play" | "stopped"
let score = 0;
let speed = 1;
let currentSpeedDuration = config.stepDuration;
let food = {};
let snake = [];
let snakeDirection = "right"; // "up" | "right" | "down" | "left"
let tickId = null;
let currentStepDuration = config.stepDuration;

// елементы DOM-дерева
const gameEl = document.getElementById("game");
const scoreEl = document.getElementById("score");
const speedEl = document.getElementById("speed");

const newGameEl = document.getElementById("new");
const playGameEl = document.getElementById("play");

const makeMapElement = (x, y) => {
	return { x: x, y: y };
};

// создание поля игры
function initField() {
	const fieldEl = document.createElement("div");
	fieldEl.classList.add("field");
	fieldEl.setAttribute(
		"style",
		`width: ${config.cellSize * config.fieldWidth}px; height: ${config.cellSize *
			config.fieldHeight}px;`
	);

	for (i = 0; i < config.fieldWidth; i++) {
		for (j = 0; j < config.fieldHeight; j++) {
			const cellEl = document.createElement("div");
			cellEl.classList.add("cell");
			cellEl.setAttribute("id", `${i}.${j}`);
			cellEl.setAttribute(
				"style",
				`width: ${config.cellSize}px; height: ${config.cellSize}px;`
			);
			fieldEl.append(cellEl);
		}
	}

	gameEl.innerHTML = "";
	gameEl.append(fieldEl);
}

// инициализация змейки
function initSnake() {
	const newSnake = [];

	const initialY = Math.floor(config.fieldHeight / 2);
	const initialX = 1;

	for (i = 0; i < config.initialLength; i++) {
		newSnake.push(makeMapElement(initialX + i, initialY));
	}

	snake = newSnake.slice().reverse();
	snakeDirection = "right";
}

// проверка координат на совпадение со змейкой
const checkIfOnSnake = coords => {
	for (i = 0; i < snake.length; i++) {
		const chunk = snake[i];
		if (coords.x === chunk.x && coords.y === chunk.y) {
			return true;
		}
	}
};

// создаем еду
function createFood() {
	let x;
	let y;
	let notOnSnake = true;
	while (notOnSnake) {
		x = Math.floor(Math.random() * config.fieldWidth);
		y = Math.floor(Math.random() * config.fieldHeight);
		notOnSnake = checkIfOnSnake(makeMapElement(x, y));
	}
	if (food !== {}) {
		clearFood();
	}

	food = makeMapElement(x, y);
	drawFood();
}

// удаление еды
function clearFood() {
	const foodCellEls = document.querySelectorAll("div.em-roll_of_paper");
	for (element of foodCellEls) {
		if (element) {
			element.classList.remove("em-roll_of_paper");
		}
	}
}

// рисование еды
function drawFood() {
	clearFood();
	const cellFoodEl = document.getElementById(`${food.y}.${food.x}`);
	if (cellFoodEl) {
		cellFoodEl.classList.add("em-roll_of_paper");
		cellFoodEl.classList.add("em");
	}
}

// стирание змейки
function clearSnake() {
	const snakeCellEls = document.querySelectorAll("div.em-mask");
	for (chunk of snakeCellEls) {
		if (chunk) {
			chunk.classList.remove("em-mask");
		}
	}
}

// рендеринг змейки
function drawSnake() {
	const drawingSnake = snake.slice();
	if (
		drawingSnake[0].x > config.fieldWidth ||
		drawingSnake[0].y > config.fieldHeight
	) {
		return false;
	}
	clearSnake();

	for (i = 0; i < drawingSnake.length; i++) {
		const x = drawingSnake[i].x;
		const y = drawingSnake[i].y;
		const snakeCellEl = document.getElementById(`${y}.${x}`);
		if (snakeCellEl) {
			snakeCellEl.classList.add("em");
			snakeCellEl.classList.add("em-mask");
		}
	}
}

// сдвиг змейки
function moveSnake() {
	let movedSnake = snake.slice();
	let head = Object.assign(movedSnake[0]);

	for (i = movedSnake.length - 1; i > 0; i--) {
		movedSnake[i].x = movedSnake[i - 1].x;
		movedSnake[i].y = movedSnake[i - 1].y;
	}

	switch (snakeDirection) {
		case "left":
			head.x--;
			break;
		case "right":
			head.x++;
			break;
		case "up":
			head.y--;
			break;
		default:
			head.y++;
	}

	movedSnake[0] = head;
	snake = movedSnake.slice();
}

// поедание еды
function eatFood() {
	score = score + config.foodScore;
	createFood();
	scoreEl.innerHTML = score;

	const tail = Object.assign(snake.slice().pop());
	moveSnake();
	const newSnake = snake.slice();
	newSnake.push(makeMapElement(tail.x, tail.y));
	snake = newSnake;

	if (score > 0 && score % config.speedUpScoreN === 0) {
		speed++;
		speedEl.innerHTML = speed;
		clearInterval(tickId);
		tickId = null;
		currentStepDuration = currentStepDuration * config.speedMult;
		tick();
	}
}

function isDead() {
	const head = snake.slice(0, 1)[0];
	const tail = snake.slice(3);

	const isWalls =
		head.x < 0 ||
		head.y < 0 ||
		head.x > config.fieldWidth - 1 ||
		head.y > config.fieldHeight - 1;

	let selfKill = false;

	tail.forEach(chunk => {
		if (head.x == chunk.x && head.y == chunk.y) selfKill = true;
	});

	return isWalls || selfKill;
}

function foodCollision() {
	const head = snake.slice(0, 1)[0];
	if (head.x == food.x && head.y == food.y) {
		eatFood();
	}
}

// очистка tick
function stopTick() {
	if (tickId) {
		clearInterval(tickId);
		tickId = null;
	}
}

// tick
function tick() {
	if (!tickId) {
		tickId = setInterval(() => {
			moveSnake();
			if (isDead()) {
				stopTick();
				alert("Collision");
				newGameEl.setAttribute("style", "display: block");
			} else {
				foodCollision();
				drawSnake();
			}
		}, currentStepDuration);
	}
}

// события клавиатуры
function setListeners() {
	newGameEl.addEventListener("click", event => {
		setDefaults();
		initField();
		initSnake();
		drawSnake();

		newGameEl.setAttribute("style", "display: none");
		playGameEl.setAttribute("style", "display: block");
	});

	playGameEl.addEventListener("click", event => {
		startGame();
		tick();
		playGameEl.setAttribute("style", "display: none");
	});

	document.addEventListener("keydown", event => {
		const keyCode = event.keyCode;
		const directions = {
			38: "up",
			87: "up",
			39: "right",
			68: "right",
			40: "down",
			83: "down",
			37: "left",
			65: "left"
		};

		if (directions[keyCode]) {
			event.preventDefault();
			if (canTurn(directions[keyCode])) {
				snakeDirection = directions[keyCode];
			}
		}
	});
}

// можно ли повернуть
function canTurn(direction) {
	if (snakeDirection === direction) {
		return false;
	}

	if (snakeDirection === "right") {
		if (direction === "left") {
			return false;
		}
	}

	if (snakeDirection === "left") {
		if (direction === "right") {
			return false;
		}
	}

	if (snakeDirection === "up") {
		if (direction === "down") {
			return false;
		}
	}

	if (snakeDirection === "down") {
		if (direction === "up") {
			return false;
		}
	}

	return true;
}

function setDefaults() {
	score = 0;
	speed = 1;
	currentSpeedDuration = config.stepDuration;
	food = [];
	snake = [];
	snakeDirection = "right";
	snakeChunksDirections = [];
	tickId = null;
	currentStepDuration = config.stepDuration;
	scoreEl.innerHTML = score;
	speedEl.innerHTML = speed;
}

function startGame() {
	setDefaults();
	initField();
	initSnake();
	drawSnake();
	createFood();
}

// Main function
const main = function() {
	shareBtns();

	initField();
	setListeners();
};

window.onload = main();