function checkDevice(){
	var w = window.innerWidth;
	if(w < 996){
		return "tablet";
	} else if(w < 768){
		return "mobile";
	}
	return "pc";
}

$(function () {
	$("[data-js]").each(function(i, el){
		var jsType = $(el).attr("data-js");
		switch(jsType){
			case "jqry-slt": // jquery-ui select
				$(el).selectmenu({ width : '100%'}).selectmenu("menuWidget").addClass("overflow");
				break;
			case "input-container-first" : // input container expand
				$(el).find(".expand > button").click(function(e){
					var titleArr = $(this).attr("data-msg-toggle").split("|");
					if($(el).hasClass("open")){
						$(el).removeClass("open");
						$(this).attr("title", titleArr[0]).find("span").text(titleArr[0]);
					}else{
						$(el).addClass("open");
						$(this).attr("title", titleArr[1]).find("span").text(titleArr[1]);
					}
					e.preventDefault();
				})
				break;
			case "input-container-second" : // input container expand
				$(el).find(".expand > button").click(function(e){
					var titleArr = $(this).attr("data-msg-toggle").split("|");
					if($(el).hasClass("open")){
						$(el).removeClass("open");
						$(this).attr("title", titleArr[0]).find("span").text(titleArr[0]);
					}else{
						$(el).addClass("open");
						$(this).attr("title", titleArr[1]).find("span").text(titleArr[1]);
					}
					e.preventDefault();
				})
				break;
			case "jqry-acrdn": // jquery-ui accordion
				$(el).accordion({
					icons: { "header": "ui-icon-custom", "activeHeader": "ui-icon-custom" },
					heightStyle: "content",
					animate: 300
				});
				break;
			case "jqry-datepicker": // jquery-ui datepicker
				$(el).datepicker({
					dateFormat: "yy-mm-dd",
					showOn: 'both',
					changeYear: 'true',
					changeMonth: 'true',
					dayNamesMin: ['월', '화', '수', '목', '금', '토', '일'],
					monthNamesShort: ['1월','2월','3월','4월','5월','6월','7월','8월','9월','10월','11월','12월'],
					buttonImageOnly: true,
					buttonImage: "/img/icon/icon-calendar--v1.png",
					buttonText: "Calendar"
				}).attr('readonly', 'readonly');

				break;
			default:
				console.log("js not binding::", this)
		}
	});

	// GNB Event
	$(".nav-link, .nav-link + ul").on("mouseover focus", function(e){
		if(checkDevice() !== "pc") return false;
		$(".navbar-nav > li").removeClass("active");
		$(this).parent().addClass("active");
		$(".navbar-nav").addClass("active");
	});
	$(".navbar-nav").on("mouseleave", function(e){
		if(checkDevice() !== "pc") return false;
		$(this).removeClass("active").find("> li").removeClass("active");
	});

	$(document).on("click focusin", function(e){
		var cName = e.target.className;
		if(checkDevice() === "pc" && cName !== "navbar-toggler" && cName !== "navbar-toggler-icon"){
			if($(e.target).parents(".navbar-nav").length < 1){
				$(".navbar-nav").removeClass("active").find("> li").removeClass("active");
			};
		}
	});

	$(".navbar-toggler").on("click", function(e){
		$("#gnb").toggleClass("active");
		$("nav").toggleClass("active-m");
		if(checkDevice() !== "pc") $(".navbar-container a").eq(0).focus();
	});
	//mobile
	$(".nav-link").on("click", function(e){
		if(checkDevice() !== "pc"){
			$(this).parent().toggleClass("active");
			e.preventDefault();
		}
	});
	$(".nav-header-m > .btn-close").on("click", function(e){
		$("nav").removeClass("active-m");
		$(".navbar-toggler").focus();
	});

	// Button Event
	$(".map-layer-info .btn-close").on("click", function(e){
		$(".map-layer-info").removeClass("show");
	});
	$(".map .btn-map-expand").on("click", function(e){
		$(".map").toggleClass("show-m");

		if ($(".map-content").is(':visible')) {
			window.MAP.map.updateSize();
		}
	});

});

function onMapToggle() {
}

//tab common [20.11.02] yeon
$( document ).ready(function() {
	if ($('.tabList').length > 0) {
		window.addEventListener("DOMContentLoaded", function () {
			const tabList = document.querySelector('[role="tabBtnList"]');
			const tabs = document.querySelectorAll('[role="tabBtn"]');

			// Add a click event handler to each tab
			/*/
			tabs.forEach( function (tab) {
				tab.addEventListener("click", changeTabs);
			});
			/*/
			for(var i = 0; i < tabs.length; i++) {
				tabs[i].addEventListener("click", changeTabs);
			}
			//*/

			// Enable arrow navigation between tabs in the tab list
			let tabFocus = 0;

			tabList.addEventListener("keydown", function (e) {
				// Move right
				if (e.keyCode === 39 || e.keyCode === 37) {
					tabs[tabFocus].setAttribute("tabindex", -1);
					if (e.keyCode === 39) {
						tabFocus++;
						// If we're at the end, go to the start
						if (tabFocus >= tabs.length) {
						tabFocus = 0;
						}
						// Move left
					} else if (e.keyCode === 37) {
						tabFocus--;
						// If we're at the start, move to the end
						if (tabFocus < 0) {
						tabFocus = tabs.length - 1;
						}
					}

					tabs[tabFocus].setAttribute("tabindex", 0);
					tabs[tabFocus].focus();
				}
			});

		});

		function changeTabs(e) {
			var target = e.target;
			var parent = target.parentNode;
			var grandparent = parent.parentNode;
			var nodes;

			// Remove all current selected tabs
			/*/
			parent
				.querySelectorAll('[aria-selected="true"]')
				.forEach(function (t) { t.setAttribute("aria-selected", false)});
			/*/
			nodes = parent.querySelectorAll('[aria-selected="true"]');
			for(var i = 0; i < nodes.length; i++) {
				nodes[i].setAttribute("aria-selected", false);
			}
			//*/

			// Set this tab as selected
			target.setAttribute("aria-selected", true);

			// Hide all tab panels
			/*/
			grandparent
				.querySelectorAll('[role="tabCtsPanel"]')
				.forEach(function (p){ p.setAttribute("hidden", true)});
			/*/
			nodes = grandparent.querySelectorAll('[role="tabCtsPanel"]');
			for(var i = 0; i < nodes.length; i++) {
				nodes[i].setAttribute("hidden", true);
			}
			//*/

			// Show the selected panel
			/*/
			grandparent.parentNode
				.querySelector(`#${target.getAttribute("aria-controls")}`)
				.removeAttribute("hidden");
			/*/
			nodes = grandparent.parentNode.querySelector('#' + target.getAttribute("aria-controls"));
			if (nodes.length) {
				for(var i = 0; i < nodes.length; i++) {
					nodes[i].removeAttribute("hidden");
				}
			} else {
				nodes.removeAttribute("hidden");
			}
			//*/

		}
	} else {
	}
});

window.MAP = window.MAP ? window.MAP : {
	id: '',
	map: null,
	projection: "EPSG:3857",
	extent: [13920618 - 100000, 3882799 - 100000, 14538229 + 100000, 4672852 + 100000],
	minZoom: 7,
	maxZoom: 19,
	zoom: 7
};
window.MAP.layers = window.MAP.layers ? window.MAP.layers : {};
window.MAP.features = window.MAP.features ? window.MAP.features : {};


function initMap(divId) {
	window.MAP.id = divId;

	var controls = [];
	controls.push(new ol.control.Zoom());
	controls.push(
		new ol.control.MousePosition({
			projection: "EPSG:4326",
			coordinateFormat: ol.coordinate.createStringXY(2)
		})
	);
	controls.push(new ol.control.ZoomToExtent({ extent: window.MAP.extent }));
	controls.push(new ol.control.ScaleLine());

	var centerX = (window.MAP.extent[0] + window.MAP.extent[2]) / 2;
	var centerY = (window.MAP.extent[1] + window.MAP.extent[3]) / 2;
	var viewOps = {
		projection: window.MAP.projection,
		center: [ centerX, centerY ],
		extent: window.MAP.extent,
		minZoom: window.MAP.minZoom,
		maxZoom: window.MAP.maxZoom,
		zoom: window.MAP.zoom
	};

	var layer = new ol.layer.Tile({
		name: "vworld-street",
		title: "vworld 일반",
		visible: true,
		type: "base",
		source: new ol.source.XYZ({
			url: "https://xdworld.vworld.kr/2d/Base/service/{z}/{x}/{y}.png"
		})
	});

	var map = new ol.Map({
		target: divId,
		renderer: "canvas",
		controls: controls,
		interactions: ol.interaction.defaults({ doubleClickZoom: false }),
		layers: [
			layer
		],
		view: new ol.View(viewOps)
	});

	var vectorSource = new ol.source.Vector({
		features: []
	});

	var vectorLayer = new ol.layer.Vector({
		source: vectorSource
	});
	map.addLayer(vectorLayer);

	window.MAP.layers.vectorLayer = vectorLayer;

	return map;
}