let posStarted = -1;
const posIcon = document.createElement("img");
function getPos() {
	posStarted = -posStarted;

	const canvas = document.getElementsByClassName("ol-unselectable")[0];

	if (posStarted == 1) {
		posIcon.src = chrome.runtime.getURL("icons/position_alt.png");
		posButton.appendChild(posIcon);
		canvas.addEventListener("click", drawPos, true);
	} else {
		posIcon.src = chrome.runtime.getURL("icons/position.png");
		posButton.appendChild(posIcon);
		canvas.removeEventListener("click", drawPos, true);
	}
}

function drawPos(event) {
	event.preventDefault();
	if (event.target.className == "ol-unselectable") {
		const bttm = document.getElementsByClassName("pl-2");
		const x = bttm[0].innerHTML;
		const y = bttm[1].innerHTML;
		const canvas = document.getElementsByClassName("ol-unselectable")[0];
		const ctx = canvas.getContext("2d");

		const header = canvas.getBoundingClientRect().top;

		ctx.beginPath();
		ctx.arc(event.clientX, event.clientY - header, 3, 0, Math.PI * 2, true);
		ctx.fill();

		let URL = `https://epsg.io/trans?data=${x},${y}&s_srs=2177&t_srs=4326`;

		fetch(URL, {
			method: "GET",
		})
			.then((response) => response.json())
			.then((data) => {
				const x = data.x; //E
				const y = data.y; //N

				const degreesNorth = Math.floor(y);
				const degreesEast = Math.floor(x);

				const minutesNorth = Math.floor((y - degreesNorth) * 60);
				const minutesEast = Math.floor((x - degreesEast) * 60);

				const secondsNorth = Math.floor(
					((y - degreesNorth) * 60 - minutesNorth) * 60
				);
				const secondsEast = Math.floor(
					((x - degreesEast) * 60 - minutesEast) * 60
				);

				const positionText =
					"" +
					degreesNorth +
					"°" +
					minutesNorth +
					"'" +
					secondsNorth +
					'"N ' +
					degreesEast +
					"°" +
					minutesEast +
					"'" +
					secondsEast +
					'"E';

				//https://www.calculatorsoup.com/calculators/conversions/convert-decimal-degrees-to-degrees-minutes-seconds.php
				ctx.font = "20px Arial";
				ctx.fillText(positionText, event.clientX + 5, event.clientY - header);

				navigator.clipboard.writeText(positionText);
			});
	}
}