// Функция для вращения координат вокруг центра
function rotate(coordinates, angle, center = { x: 0, y: 0 }) {
	return coordinates.map((point) => ({
		x:
			center.x +
			(point.x - center.x) * Math.cos(angle) -
			(point.y - center.y) * Math.sin(angle),
		y:
			center.y +
			(point.x - center.x) * Math.sin(angle) +
			(point.y - center.y) * Math.cos(angle),
	}));
}

// Функция для создания эллипса
function ellipse(centerX, centerY, a, b, points = 100) {
	let coordinates = [];
	const angle = (2 * Math.PI) / points;
	for (let i = 0; i <= points; i++) {
		coordinates.push({
			x: centerX + a * Math.cos(angle * i),
			y: centerY + b * Math.sin(angle * i),
		});
	}
	return coordinates;
}

// Функция для создания круга
function circle(centerX, centerY, radius, points = 100) {
	let coordinates = [];
	const angle = (2 * Math.PI) / points;
	for (let i = 0; i <= points; i++) {
		coordinates.push({
			x: centerX + radius * Math.cos(angle * i),
			y: centerY + radius * Math.sin(angle * i),
		});
	}
	return coordinates;
}

// Функция для рисования линии
function drawLines(
	ctx,
	coordinates,
	color = "black",
	fill = false,
	lineWidth = 2
) {
	ctx.beginPath();
	ctx.moveTo(coordinates[0].x, coordinates[0].y);
	for (let point of coordinates) {
		ctx.lineTo(point.x, point.y);
	}
	if (fill) {
		ctx.fillStyle = color;
		ctx.fill();
	} else {
		ctx.strokeStyle = color;
		ctx.lineWidth = lineWidth;
		ctx.stroke();
	}
	ctx.closePath();
}

// Функция для рисования атома
function drawAtom(ctx, centerX, centerY, size, angle) {
	const ellipseCoordinates = ellipse(centerX, centerY, size, size * 0.3);
	const center = { x: centerX, y: centerY };

	const deformed = (coordinates, angle) => rotate(coordinates, angle, center);

	for (let i = 0; i < 3; i++) {
		const deformedEllipse = deformed(
			ellipseCoordinates,
			Math.PI * (i * 0.333333333 + angle)
		);

		drawLines(ctx, deformedEllipse, "black");

		const x = deformedEllipse[(50 * i + 60) % 100];
		const deformedCircle = deformed(circle(x.x, x.y, size * 0.1), 0);

		drawLines(ctx, deformedCircle, "blue", true);
	}

	let changeColor = false;
	for (let point of circle(centerX, centerY, size * 0.15, 6)) {
		drawLines(
			ctx,
			deformed(circle(point.x, point.y, size * 0.1), angle * Math.PI),
			changeColor ? "red" : "blue",
			true
		);
		changeColor = !changeColor;
	}

	drawLines(
		ctx,
		deformed(circle(centerX, centerY, size * 0.1), 0),
		"blue",
		true
	);
}

// Получение элементов DOM
const canvas = document.querySelector("canvas");
const ctx = canvas.getContext("2d");

let rotateInput = document.querySelector("#rotate-input");
let sizeInput = document.querySelector("#size-input");

// Функция для рисования атома
const main = () => {
	ctx.clearRect(0, 0, canvas.width, canvas.height);
	drawAtom(ctx, x, y, sizeInput.value, rotateInput.value / 50);
};

let buttons = {
	up: document.querySelector("#button-up"),
	down: document.querySelector("#button-down"),
	left: document.querySelector("#button-left"),
	right: document.querySelector("#button-right"),
};

// Обработчики событий для кнопок
for (let [key, value] of Object.entries(buttons)) {
	value.addEventListener("click", () => {
		switch (key) {
			case "up":
				y -= 10;
				break;
			case "down":
				y += 10;
				break;
			case "left":
				x -= 10;
				break;
			case "right":
				x += 10;
				break;
			default:
				break;
		}
		main();
	});
}

// Обработчики событий для ввода
rotateInput.addEventListener("input", () => {
	main();
});

sizeInput.addEventListener("input", () => {
	main();
});

// Обработчик событий для кнопки сброса
document.querySelector("#button-reset").addEventListener("click", () => {
	x = 300;
	y = 300;
	rotateInput.value = 50;
	sizeInput.value = 170;
	main();
});

// Обработчик событий для кнопки масштабирования окна
document.querySelector("#button-window-scale").addEventListener("click", () => {
	x = canvas.width / 2;
	y = canvas.height / 2;
	sizeInput.value =
		canvas.height / 2 > canvas.width / 2 ? canvas.height / 2 : canvas.width / 2;
	rotateInput.value = 0;
	console.log(x, y, sizeInput.value);
	main();
});

// Начальные координаты
let x = 200;
let y = 200;

// Начальное рисование атома
main();