//	odaeri/js/odaeri20160224.js



///////////////////////////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////////////////////////////
//	sweetPages 테이블의 온로드 및 선택TH 동기화를 위한 펑션 & 호출부
//	2016-02-10오전 11:43
//	JQM 반응형테이블 columntoggle 을 적용시키고, 모든 클래스테이블들으로 동기화시켜준다.
$(document).on("pageinit", ".jqmPageClass", function () {
//	console.log("debugging started...");
	//	디폴트첵
	defaultChkTableTh();
	//	전체 클래스테이블 동기화
	syncroChkTableTh();



	/* The following code is executed once the DOM is loaded */

	// Calling the jQuery plugin and splitting the
	// #holder UL into pages of 5 LIs each:

//	$('#postScriptsUl').sweetPages({perPage:5});
//	var controls1 = $('.swControls').detach();
//	controls1.appendTo('.holder');
//	console.log("sweetPages called...");
//	$("#postScriptsUl").trigger("create");


//	$('#hotLinksUl').sweetPages({perPage:5});

//	$('#priceExampleTable').sweetPages({perPage:1});

//	$('#recentOrdersTable').sweetPages({perPage:1});
//	var controls2 = $('.swControls').detach();
//	controls2.appendTo('.holderTable');

	// The default behaviour of the plugin is to insert the
	// page links in the ul, but we need them in the main container:

//	var controls1 = $('.swControls').detach();
//	var controls2 = $('.swControls').detach();
//	controls1.appendTo('.holder');
//	controls2.appendTo('.holderTable');
});


//	JQM 반응형 테이블의 TH 요소중 일부(0,1,2)를 디폴트 디스플레이 ON 체크
function defaultChkTableTh() {
	//	디폴트첵
	//$(document).on(".recentOrdersTables", "tablecreate", function () {
	$(document).off(".recentOrdersTables", "tablecreate").on(".recentOrdersTables", "tablecreate", function () {
		$(".recentOrdersTables").each( function() {
			var thisIdStr= $(this).attr("id");
			$("#"+thisIdStr+"-popup [type=checkbox]:lt(3)") /* second checkbox */
				.prop("checked", true)            /* uncheck it */
				.checkboxradio("refresh")          /* refresh UI */
				.trigger("change");                /* trigger change to update table */
		});
	});
}

//	JQM 반응형 테이블 TH 요소 디스플레이 변경시, 모든 클래스 테이블에 똑같이 적용
function syncroChkTableTh() {
	//	전체 클래스테이블 동기화
	$(".ui-controlgroup-controls input[type=checkbox]").on("click", function() {
		//	몇번째 요소인지 확인하고, checked/unchecked 어트리뷰트 확인,

		//	형제요소 table 의 각각 ui-controlgroup-controls 에 적용..
		//	refresh UI
		//	trigger change
	});
}
///////////////////////////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////////////////////////////


///////////////////////////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////////////////////////////





//	검색파라메터 값
var keyId= "";
var keywordCat= "";
var serializedStr= "";

///////////////////////////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////////////////////////////
/************		prevent JQM multiple event binding..		***************/
//	Search Form 핸들러
$(document).on('pageinit', '.jqmPageClass', function(){


/*  2016/03/23 09:09
	링크 클릭시 이벤트... JQM 의 기본세팅을 $.mobile.ajaxEnabled = false; 해준다면 이건 필요 없다.
//	2016-02-24오후 11:29
//	링크 클릭시 중요 파라메터 값 보관 및 전달처리..
	$(document).off("click",".keyIdLinks").on("click",".keyIdLinks", function(e, data) {
		var href= $(this).attr("href");
		var keywordCat= $(this).data("keywordcat");
		var nonKuCity= $(this).data("nonkucity");
		var keyId = $(this).data("keyid");
	//	keyId=5248;
		sessionStorage.hrefKeywordCat= keywordCat;
		sessionStorage.hrefnonKuCity= nonKuCity;
		sessionStorage.hrefKeywordCat= keyId;
		$("#keyId").val(keyId);
		$("#keywordCat").val(keywordCat);
		$("#nonKuCity").val(nonKuCity);
	//	changePage()
		$.changePage( href );
		e.preventDefault();
	});
*/
/*
	//	검색버튼 클릭이벤트 Authorizing & ajax.load()
	$(document).off("click", "#searchActionBtn").on("click", "#searchActionBtn", function(e) {
		console.log("Search Btn Clicked.");
		if( validateForm()===false ) { alert("목적지를 선택해주세요."); return false; };

		//	먼저 Div 에 ajax Loading Image 를 띄워준다
		//$("#searchResultShowDiv").html("<div class='ajaxLoader'><img src='/images/ajax-loader.gif'></div>");

		serializedStr = $("#odaeriTopSeaechForm").serialize();
		var actUrl = $("#odaeriTopSeaechForm").attr("action");
		var actionURI = actUrl+"?"+serializedStr;
		console.log("search start...");
		console.log("actUrl."+actUrl);
		console.log("actionURI."+actionURI);

		_deptGeoId= $("#deptGeoId").val();
		_destGeoId= $("#destGeoId").val();
		$.getJSON("/ajax/calcCharge.php?deptGeoId="+_deptGeoId+"&destGeoId="+_destGeoId,
			function( data ) {
				console.log(JSON.stringify(data));
				$.each( data, function( key, val ) {
				//	if(key=="defaultPrice") $("#defaultPrice").text(val);
				//	searchResultPopUp 내부요소 #defaultPrice, #driveDistance, #priceRange0 등은
				//	정해진 네이밍 규칙에 따라 유니크하게 확보되어 있어야 한다.
					$("#"+key).text(val);
					console.log("key: "+key);
					console.log("val: "+val);
				//	출발지/도착지 풀 스트링 업데이트
					$("#deptGeoFullStr").text( $("#deptInputFullStr").val() );
					$("#destGeoFullStr").text( $("#destInputFullStr").val() );
				});
				$("#searchResultPopUp").trigger("create");			//	생성된 엘리먼트의 IQM 이펙트를 부여
				$.mobile.changePage('#searchResultPopUp', 'pop', true, true);	//	팝업 트리거
			//	storeDestPoint( $("#destInputFullStr").val() );		//	목적지 풀어드레스를 sessionStorage 에 보관

				sessionStorage.setItem('destAddressFullStr', encodeURI( $("#destInputFullStr").val() ) );	//	sessionStorage 로 보관된다.
				sessionStorage.setItem('destAddressGeoId', _destGeoId );		//	sessionStorage 로 보관된다.
			}
		);
*/
/*
		$("#searchResultPopUp").html("");
		$("#searchResultPopUp").load(
			actionURI+" #odaeriTopSearchResultDiv",
			function() {
				$("#searchResultPopUp").trigger("create");			//	생성된 엘리먼트의 IQM 이펙트를 부여
				//$("#searchResultShowDiv").slideDown('slow');
				$.mobile.changePage('#searchResultPopUp', 'pop', true, true);	//	팝업 트리거

				목적지를 JS.sessionStorage 에 스토어해야 하는데, searchAction.php 의 JS 에서는 보관되지 않는다.
				여기서 목적지를 파싱해 보관할 수 밖에 없다.
				그런데 문제는, ajax 로 받아온 Data 는 Html 블럭이라는 것...
				너무 복잡해지니까.... PHP SESSION 에 보간해서 처리하자.
//				storeDeptPoint(destAddressFullStr);

			}
		);
*/
/*
		e.preventDefault();
	});
*/
	//	Ajax Selector 클릭 이벤트 처리허용여부 체크...
	//	출발지 범위가 city 이면 return false..
	// OK!! 이벤트 중복 바인딩 문제는 제거되었다. 2016-02-24오후 10:03
	$(document).off("click", ".ajaxSelectBox").on("click", ".ajaxSelectBox", function(e) {
		console.log( "ajaxSelectBox clicked.." );
		keyId= $("#odaeriTopSeaechForm :input[name='keyId']").val();
		keywordCat= $("#odaeriTopSeaechForm :input[name='keywordCat']").val();
		nonKuCity= $("#odaeriTopSeaechForm :input[name='nonKuCity']").val();
		serializedStr = $("#odaeriTopSeaechForm").serialize();
		if(keyId=="") { alert("현재위치를 찾을 수 없습니다. 현재위치 새로고침 버튼을 눌러주세요."); e.preventDefault(); return; };
		if(keywordCat=="city" && nonKuCity!="Yes") { alert("출발지 범위가 너무 넓습니다. 현재위치 새로고침 버튼을 눌러주세요."); e.preventDefault(); return; };
		//console.log("serializedStr."+serializedStr);
	});

	//	Ajax Selector 클릭 이벤트 처리...
	//	주소 요소를 ajax 로 받아와서 selectBox 에 넣어준다.
	$(document).off("change", ".ajaxSelectBox").on("change", ".ajaxSelectBox", function() {
		console.log( "ajaxSelectBox changing.." );
	//	addAjaxSelectBox($(this).attr("id"), "세부주소 선택");
		makeAddrSelector( $(this).attr("name"), $("option:selected",this).text() );
		//	deptDongRiSelectBox 일 때, 페이지 이동
		if( $(this).attr('id')=="provinceSelectBox" )  {
			$("#provinceSelectedStr").val( $("option:selected", this).text() );
		}
		else if( $(this).attr('id')=="citySelectBox" )  {
			$("#citySelectedStr").val(  $("option:selected", this).text() );
		}
		else if( $(this).attr('id')=="dongRiSelectBox" ) {
			$("#destGeoId").val( $(this).val() );
			$("#destInputFullStr").val( $("#provinceSelectedStr").val()+" "+ $("#citySelectedStr").val() + " "+ $("option:selected", this).text() );
			//console.log("append trigger activated!!!");
		}
		console.log("option text: "+ $("option:selected", this).text()) ;
		//	deptDongRiSelectBox 일 때, 페이지 이동
		/*  사용되지 않는다. 2016/04/10 13:47
		if( $(this).attr('name')=="deptDongRi" ) {
			document.location.href= "/land/landing.html?geoId="+$(this).val();
		}
		*/
	});

	//	search Result Box 닫기... closeSearchResultBtn
	$(document).off("click", "#closeSearchResultBtn").on("click", "#closeSearchResultBtn", function() {
		$("#searchResultShowDiv").slideUp('slow');
	});



	//	display ajax-loader Div for every ajax Actions.
	//	모든 ajax 리퀘스트에 대해 시작과 끝을 모니터링하고 #ajaxloading 를 디스플레이한다.
	//	jQuery.ajaxStart() 메서드는 XHTTPRequest 를 사용하지만 getJASON 은 다른 방식으로 통신하는 것으로 보인다.
	//	getJASON() 은 모니터링이 불가능하다.
	$(document).ajaxStart(function() {
		$("#ajaxloading").show();
		console.log("ajax action started..");
	}).ajaxStop(function() {
		$("#ajaxloading").hide();
		console.log("ajax action finished..");
	});
});


//	append() 된 select box 에 options 를 체워넣는다.
function makeAddrSelector(name,val) {
	if(name=="province") var subSelectId= "citySelectBox";
	else if(name=="deptProvince") var subSelectId= "deptCitySelectBox";
	else if(name=="city") var subSelectId= "dongRiSelectBox";
	else if(name=="deptCity") var subSelectId= "deptDongRiSelectBox";
	if(name!="dongRi") {
		$.getJSON("/ajax/subAddr.php", { cate: name, name: val },
			function(data){
				console.log(name);
				$("#"+subSelectId).empty();
				$("#dongRiSelectBox").empty();
				$.each(data, function() {
					$("#"+subSelectId).append(new Option(this.name,this.geoId ));
				});
				//	jQueryMobile 1.5.x 렌더링 문제로 콜백함수에서 리프레쉬 해줘야 한다.
				//	차후 버그패치가 되면 아래 라인 제거해줄 것.
				$("#"+subSelectId).selectmenu('refresh', true);
			}
		);
	}
//	console.log("id:"+subSelectId);
}
//	폼 전송 validate
function validateForm() {
	if( $("#dongRiSelectBox").val()=="" ) return false;
}

//	출발지 선택 Div 토글
$("#toggleSelectDeptPointDiv").click( function() {
	$("#deptPointSelectDiv").slideToggle("slow", function() {
		if($("#deptProvinceSelectBox").length<1) $("#provinceSelectBox").clone().prop({ id: "deptProvinceSelectBox", name: "deptProvince"}).appendTo("#deptPointSelectDivHeader");
	});
});

String.prototype.trim = function() {
    return this.replace(/(^\s*)|(\s*$)/gi, "");
}








/*	위치 새로고팀 클릭시...
 *	1. 브라우저 객체로부터 기본 좌표를 획득,	--	Done
 *	2. 변환좌표계를 미리 확보해해두고,			--	Done
 *	3. 국가지도 API 에 좌표의 주소값을 쿼리하는 php 스크립트를 Ajax 호출한다.		--	Done
 *	4. 리다이렉션 될 $keyId 가 필요하다. 이 역시 동일한 PHP 스크립트의 리턴값을 통해 얻어온다... 이건 세션값으로???
 *	5. 모든 획득에 성공하면 리다이렉션 : /land/landing.html?keyId=$keyId
*/
//navigator.geolocation.getCurrentPosition(successCallback, errorCallback, options);
var latiVal= "";
var longVal= "";

//	refreshLocationBtn
/*
$(document).on("click","#refreshLocationBtn", function(e) {
	if(navigator.geolocation) {
		//	1. 브라우저 객체로부터 기본 좌표를 획득,
		navigator.geolocation.getCurrentPosition( tryGeoAddr, onError);
	}
//	$("#deptAddressFullStr").load( "/ajax/refreshLocation.php", function() {
	e.preventDefault();
});
*/
/***`2016/03/28 16:18
이 펑션은 호출되지 않는다.
function storeDestPoint(destAddressFullStr) {
	sessionStorage.setItem('destAddressFullStr', encodeURI( destAddressFullStr ) );		//	sessionStorage 로 보관된다.

	//console.log( decodeURI(sessionStorage.getItem("destAddressFullStr") ) );
	console.log( "출력 시작..." );
	for (var i = 0; i < sessionStorage.length; i++){
    	console.log(sessionStorage.key(i) + "=[" + sessionStorage.getItem(sessionStorage.key(i)) + "]");
	}
	console.log( decodeURI(sessionStorage.getItem("destAddressFullStr")  ) );
}
***/

//	geolocation 의 콜백함수로 호출된다. 사용자 좌표를 받아와 변환좌표계까지 확보한다.
function getGeoLocations(location) {
	latiVal= location.coords.latitude;
	longVal= location.coords.longitude;
	//	2. 변환좌표계를 미리 확보해해두고,
	var coord4326 = [ longVal , latiVal ];
	var coord3857 = ol.proj.transform([longVal, latiVal], 'EPSG:4326', 'EPSG:3857');	//	3857 좌표
	console.log("변환좌표계 3857: "+coord3857[0]+", "+coord3857[1]);

	sessionStorage.setItem('geoLocation4326', JSON.stringify(coord4326) );		//	sessionStorage 로 보관된다.
	sessionStorage.setItem('geoLocation3857', JSON.stringify(coord3857) );		//	sessionStorage 로 보관된다.
	getGeoAddress(coord3857);

	//	2016/03/26 13:02
	//	오더폼의 입력값을 동기화시켜주는 펑션... ajax 동기화 시점을 맞추려니 여기에 넣을 수 밖에 없었더.
	assignGeoData2Form();

	console.log("경위도좌표계: "+latiVal+", "+longVal);
	var coord4326 = [ longVal, latiVal ];
}

//	오더폼의 입력값을 동기화시켜주는 펑션...
function assignGeoData2Form() {
	console.log( "출력 시작..." );
	for (var i = 0; i < sessionStorage.length; i++){
    //	console.log(sessionStorage.key(i) + "=[" + decodeURI( sessionStorage.getItem(sessionStorage.key(i)) ) + "]");
	}
	console.log( decodeURI(sessionStorage.getItem("deptAddressFullStr") ) );
	var g3857Arr = JSON.parse(sessionStorage.getItem("geoLocation3857"));
	var g4326Arr = JSON.parse(sessionStorage.getItem("geoLocation4326"));
	$("#deptGeo3857Y").val( g3857Arr[0] );
	$("#deptGeo3857Z").val( g3857Arr[1] );
	$("#deptGeo4326Y").val( g4326Arr[0] );
	$("#deptGeo4326Z").val( g4326Arr[1] );
	$("#deptAddressFullStr").val( decodeURI(sessionStorage.getItem("deptAddressFullStr")  ) );
//	$("#deptGeoId").val( sessionStorage.getItem("deptAddressGeoId") );
//	$("#destGeoId").val( destAddressGeoId );
	$("#orderPrice").val( $("#orderPriceSuggest").text() );
}

//	국가지도 API 에 쿼리해서 좌표의 주소를 받아온다.
function getGeoAddress(coord3857) {

	var data='lat='+latiVal+'&long='+longVal+"&x3857="+coord3857[0]+"&y3857="+coord3857[1];
	$.post( "/ajax/tryToGetAddr.php", data, function(result) {
//		console.log("comes here???");
//		console.log(result);
//		console.log( result.resultAddr ); //
//		console.log( "keywordTableId: "+result.resultKeyId ); //
//		console.log( "geoId: "+result.geoId ); //
//		$("#deptPointAddrStr").text(result.resultAddr);
//		sessionStorage.clear();
		sessionStorage.setItem('deptAddressFullStr', encodeURI(result.resultAddr) );		//	sessionStorage 로 보관된다.
		sessionStorage.setItem('deptAddressGeoId', result.geoId );		//	sessionStorage 로 보관된다.
	},"json");
}

//	getGeoLocations() + getGeoAddress() .... 몉달 묵은 올드버전이지만
//	아직 land/index.html 에서 이 방식으로 사용되고 있다.	2016/03/23 10:50
//	geolocation 의 콜백함수인데, prototype 을 써서 클래스처럼 활용할 수 있도록 코딩해볼 것.
function tryGeoAddr(location) {
	latiVal= location.coords.latitude;
	longVal= location.coords.longitude;
	console.log("경위도좌표계: "+latiVal+", "+longVal);
	//	2. 변환좌표계를 미리 확보해해두고,
	var coord3857 = ol.proj.transform([longVal, latiVal], 'EPSG:4326', 'EPSG:3857');	//	3857 좌표
	console.log("변환좌표계 3857: "+coord3857[0]+", "+coord3857[1]);

	//	3. 국가지도 API 에 좌표의 주소값을 쿼리하는 php 스크립트를 Ajax 호출한다.
	//	4. 리다이렉션 될 $keyId 가 필요하다. 이 값은 tryToGetAddr.php 스크립트에서 세션밸류로 처리 불가...
	var data='lat='+latiVal+'&long='+longVal+"&x3857="+coord3857[0]+"&y3857="+coord3857[1];
	console.log("Post data: "+data);
	$.post( "/ajax/tryToGetAddr.php", data, function(result) {
		console.log("comes here???");
		console.log(result);
		console.log( result.resultAddr ); //
		console.log( result.resultKeyId ); //
		$("#deptPointAddrStr").text(result.resultAddr);
		if(keyId != result.resultKeyId) {
			setTimeout( function() { document.location.replace(window.location.pathname+"?keyId="+result.resultKeyId); }, 500 );
		}
	},"json");

}

function onError(){ return; }



//$(document).ready(function(){
$(document).on("pagecreate", ".jqmPageClass", function() {

});



function swapDisplay( div1, div2 ) {
	console.log("펑션 swapDisplay");
	$(div1).slideUp();
	$(div2).slideDown();
	ajaxLoadingScreenOff();
}


/*******************************************************************************************/
/***************************			PROTOTYPES...			****************************/
// 숫자 타입에서 쓸 수 있도록 format() 함수 추가
Number.prototype.format = function(){
	if(this==0) return 0;
	var reg = /(^[+-]?\d+)(\d{3})/;
	var n = (this + '');
	while (reg.test(n)) n = n.replace(reg, '$1' + ',' + '$2');
	return n;
};

// 문자열 타입에서 쓸 수 있도록 format() 함수 추가
String.prototype.format = function(){
	var num = parseFloat(this);
	if( isNaN(num) ) return "0";
	return num.format();
};
/*******************************************************************************************/