var to;
OpenKey = "";
keepOpen = !0;
var focused = !0;
altCooldown = !1;

function CallBack(f, p) {
	fetch(`https://${(window.GetParentResourceName ? window.GetParentResourceName() : "nui-frame-app")}/${f}`, {
		method: 'POST',
		headers: {
			'Content-Type': 'application/json; charset=UTF-8',
		},
		body: JSON.stringify({
			itemId: null != p ? p : ""
		})
	});
}

function Reset() {
	$("#menuHolder").html($("#defaultMenu").html());
	$(".menuitemholder").hover(function () {
		clearTimeout(to), $(".menuitemholder").removeClass("hover");
		$(this).addClass("hover");
		$("#secondarylabel").html($(this).attr("data-name"))
	}, function () {
		var e = this;
		to = setTimeout(function () {
			$(e).removeClass("hover");
			$("#secondarylabel").html("")
		}, 400)
	});
}

function imageExists(image_url) {
	var http = new XMLHttpRequest();
	http.open('HEAD', image_url, false);
	http.send();
	return http.status != 404;
}

$(document).ready(function () {
	$(".menuitemholder").hover(function () {
		clearTimeout(to);
		$(".menuitemholder").removeClass("hover");
		$(this).addClass("hover");
		$("#secondarylabel").html($(this).attr("data-name"));
	}, function () {
		var e = this;
		to = setTimeout(function () {
			$(e).removeClass("hover");
			$("#secondarylabel").html("");
		}, 400)
	});
});

window.addEventListener("message", function (e) {
	var a = 0;
	if ("Visible" == e.data.action) {
		if (e.data.visible) {
			$("#menumode").removeClass("modeactive");
			$("#movemode").removeClass("modeactive");
			$("#menumode").addClass("modeactive");
			$("#menu").removeClass("unfocused");
			$("#menu").removeClass("hidden");
			$("#menutoggle").removeClass("hidden");
			focused = !0;
		} else {
			$("#menu").addClass("hidden");
			$("#menutoggle").addClass("hidden");
		}
	}
	else if ("RenderMenu" == e.data.action) {
		Reset();
		var d = JSON.parse(e.data.items);

		var x = 0;
		$('#mainlabel').html(event.data.menuname);
		for (x = 0; x < d.items.length; x++) {
			tot = x + 1;
			if (x > 11) {
				//too many to fit so done
			} else {
				var mi = $('#opt' + (x + 1));
				var mih = $('#mih' + (x + 1));
				var icon = $('#icon' + (x + 1));
				$(mih).attr('data-id', d.items[x].id);
				$(mih).attr('data-name', d.items[x].description);
				$(mih).click(function () { CallBack('ItemClick', $(this).attr("data-id")) });
				var ii = '';
				if (imageExists('assets/img/' + d.items[x].icon + '.svg')) {
					ii = d.items[x].icon + '.svg';
				} else {
					ii = d.items[x].icon + '.png';
				}
				$(icon).attr('src', 'assets/img/' + ii);
				$(mi).removeClass('hidden');
				if (event.data.visible) {
					$('#menu').removeClass('hidden');
				}
				if (event.data.back) {
					$('#backbutton').removeClass('hidden');
				} else {
					if (!$('#backbutton').hasClass('hidden')) $('#backbutton').addClass('hidden');
				}
			}
		}
		if (x < 12) {
			for (let i = 1; i < tot; i++) {
				$('#opt' + (i + 1)).css('transform', 'translate(-50%,0%) rotate(' + ((360 / tot) * i) + 'deg)');
				$('#icon' + (i + 1)).css('transform', 'translate(-50%,2vh) rotate(-' + ((360 / tot) * i) + 'deg)');
			}
			for (let i = tot + 1; i < 13; i++) {
				$('#opt' + i).remove();
			}
		}

		$("#menu").removeClass("hidden");
		$("#menumode").removeClass("modeactive");
		$("#movemode").removeClass("modeactive");
		$("#menumode").addClass("modeactive");
		$("#menu").removeClass("unfocused");
		$("#menutoggle").removeClass("hidden");
		altCooldown = !0;
		setTimeout(() => {
			altCooldown = !1
		}, 200)
	} else if ("togglefocus" == e.data.action) {
		if (e.data.visible) {
			$("#menumode").removeClass("modeactive");
			$("#movemode").removeClass("modeactive");
			$("#menumode").addClass("modeactive");
			$("#menu").removeClass("unfocused");
			$("#menutoggle").removeClass("hidden");
			altCooldown = !0;
			setTimeout(() => {
				altCooldown = !1
			}, 200);
		} else {
			$("#menumode").removeClass("modeactive");
			$("#movemode").removeClass("modeactive");
			$("#movemode").addClass("modeactive")
			$("#menu").addClass("unfocused");
			$("#menutoggle").removeClass("hidden");
			altCooldown = !0;
			setTimeout(() => {
				altCooldown = !1
			}, 200);
		}
	}
});

window.addEventListener("keyup", e => {
	if ("Backspace" == e.key || "Escape" == e.key) {
		$("#menumode").removeClass("modeactive");
		$("#movemode").removeClass("modeactive");
		CallBack("MenuClosed");
		$("#map").hide();
	}

	if ("Alt" != e.key || altCooldown || CallBack("ToggleFocus")) {
		$("#map").hide();
		$('#scorecard').hide();
	}
});







$(document).ready(function () {
	const canvas = document.getElementById('myCanvas');
	const imgW = $("#mapholder").width();
	const imgH = $("#mapholder").height();
	canvas.width = imgW;
	canvas.height = imgH;
});

window.addEventListener('message', function (event) {
	if (event.data.action === 'ShowMap') {
		drawPolygons(event.data.data);
	} else if (event.data.action == "HuntingKillMenu") {
		//build kill menu
		$('#col1').html("");
		//console.log(event.data.data);
		var d = JSON.parse(event.data.data);
		for (i = 0; i < d.length; i++) {
			var item = $('#killitem').html();
			item = item.replace(/{displayname}/g, d[i].displayname)
			item = item.replace(/{model}/g, d[i].model)
			item = item.replace(/{weight}/g, d[i].weight)
			item = item.replace(/{lbs}/g, d[i].weight > 1 ? 'lbs' : 'lb');
			if (d[i].pricePerPound != 0 && event.data.loop) {
				item = item.replace(/{ppp}/g, (d[i].weight * d[i].pricePerPound).toFixed(2));
				item = item.replace(/{visibility}/g, '');
			} else {
				item = item.replace(/{ppp}/g, '');
				item = item.replace(/{visibility}/g, 'hidden');
			}
			$('#col1').append(item);
		}
		$('#scorecard').show();
	}

});

function SellCallBack(b, d, a) {
	//console.log(JSON.stringify({
	//	desc: null != d ? d : "Game",
	//	amount: null != a ? a : 0
	//}));
	fetch(`https://${(window.GetParentResourceName ? window.GetParentResourceName() : "nui-frame-app")}/SellKills`, {
		method: 'POST',
		headers: {
			'Content-Type': 'application/json; charset=UTF-8',
		},
		body: JSON.stringify({
			desc: null != d ? d : "Game",
			amount: null != a ? a : 0
		})
	});
	$(b).parent().remove();
}

function drawPolygons(polygonsString) {

	$('#map').show();
	$(".groundslabel").remove();

	var polygons = JSON.parse(polygonsString);
	const canvas = document.getElementById('myCanvas');
	const ctx = canvas.getContext('2d');
	const imgW = $("#mapholder").width();
	const imgH = $("#mapholder").height();
	canvas.width = imgW;
	canvas.height = imgH;

	ctx.clearRect(0, 0, canvas.width, canvas.height);

	polygons.forEach(polygon => {
		ctx.beginPath();

		polygon.points.forEach((point, index) => {
			const converted = ConvertPoint(point.X, point.Y);
			const x = converted.x;
			const y = converted.y;

			//console.log('Drawing to:', x, y);
			//$('#map').append('<div class="mapdot" id="spawnpoint' + point.x + '" style="top:' + y + 'px; left: ' + x + ';"></div>');

			if (index === 0) {
				ctx.moveTo(x, y);
			} else {
				ctx.lineTo(x, y);
			}
		});

		ctx.closePath();
		if (polygon.type == "fishing") {
			ctx.strokeStyle = polygon.strokeColor || 'blue';
		} else {
			ctx.strokeStyle = polygon.strokeColor || 'darkgreen';
		}
		ctx.lineWidth = polygon.lineWidth || 2;
		ctx.stroke();
		ctx.fillStyle = ctx.strokeStyle;
		ctx.fill();

		var center = getBoundingBoxCenter(polygon.points);
		var centerp = ConvertPoint(center.x, center.y);

		var label = '<div class="groundslabel" style="left: ' + centerp.x + '; top: ' + centerp.y + ';">' + polygon.name + '</div>';
		$('#map').append(label);

	});
}

function ConvertPoint(x, y) {
	//console.log('converting ' + x + ' ' + y)
	var imgW = $('#map img').width();
	var sizePerc = imgW / 2000;
	var cW = $('#map').width();
	cW = (cW / 2) - (imgW / 2);

	var x1 = x * .16;
	var y1 = y * .16;
	var x2 = 0;
	var y2 = 0;

	var x2 = 925 + x1;
	var y2 = 1349 - y1;

	x2 = (x2 * sizePerc) + cW;
	y2 = y2 * sizePerc;
	return { x: x2, y: y2 };
}

function getBoundingBoxCenter(points) {
	let minX = Infinity, maxX = -Infinity;
	let minY = Infinity, maxY = -Infinity;

	points.forEach(p => {
		if (p.X < minX) minX = p.X;
		if (p.X > maxX) maxX = p.X;
		if (p.Y < minY) minY = p.Y;
		if (p.Y > maxY) maxY = p.Y;
	});

	return {
		x: (minX + maxX) / 2,
		y: (minY + maxY) / 2
	};
}