// ==========================================================
// 	篩選器
// ==========================================================
;(function($){
	$(document).on("click", ".cleanButton", function(){
		let item = $(".filter-item"),
			wrapper = $(".filter-wrapper")
		item.removeClass("open-sub")
		wrapper.removeClass("filter-open")
		$("body").removeClass("overflow-hidden")
	})
	
	function clickBlank(e){
		let item = $(".filter-item"),
				wrapper = $(".filter-wrapper"),
				target = $(e.target)
		if(target.parents(".filter-item").length == 0){
			item.removeClass("open-sub")
			wrapper.removeClass("filter-open")
			$(document).off("click", clickBlank)
			$("body").removeClass("overflow-hidden")
		}
	}
	
	$(document).on("click",".filter-wrapper .filter-title", function(){
		let item = $(this).parents(".filter-item"),
				wrapper = $(this).parents(".filter-wrapper")
		if(item.hasClass("open-sub")){
			item.removeClass("open-sub")
			wrapper.removeClass("filter-open")
			$("body").removeClass("overflow-hidden")
			$(document).off("click", clickBlank)
		}else{
			$(".filter-item").removeClass("open-sub")
			item.addClass("open-sub")
			wrapper.addClass("filter-open")
			$(document).on("click", clickBlank)
			if($(window).width() > 575){
				$("html,body").animate({
					scrollTop : $(".filter-wrapper").offset().top
				}, 500)
				if($(window).width() < 1200){
					$("body").addClass("overflow-hidden")
				}
			}
		}
	})
	
	$(document).on("click", ".filter-wrapper .subgroup-header", function(){
		let parent = $(this).parents(".filter-item"),
				wrapper = $(this).parents(".filter-wrapper")
		parent.removeClass("open-sub")
		wrapper.removeClass("filter-open")
		$("body").removeClass("overflow-hidden")
	})
	
	$(document).on("click", ".filter-wrapper .filter-search-btn", function(){
		//目前點選項會直接搜尋
		$(".filter-wrapper").removeClass("filter-open")
		$(".filter-item").removeClass("open-sub")
		$("body").removeClass("overflow-hidden")
	})
	
	//篩選後重載篩選器
	const search_ids = {}
	$(document).on("click", ".filter-wrapper .search_item,.cleanButton,.subCleanButton", function(){
		const _this = $(this)
		let last_item_id = ''
		let keysArray = Object.keys(search_ids)

		if(_this.hasClass("search_item")){
			// 開關篩選項目
			const groupID = String(_this.parents(".filter-item").data("id"))
			last_item_id = groupID
			const itemID = _this.attr('search_id')
			search_ids[groupID] = (search_ids[groupID])? search_ids[groupID]: []
			const searchIndex = search_ids[groupID].findIndex(element => element === itemID)
			keysArray = Object.keys(search_ids)

			if(searchIndex !== -1) {
				search_ids[groupID].splice(searchIndex, 1)
			} else {
				search_ids[groupID].push(itemID)
			}
		} else if(_this.hasClass('subCleanButton')) {
			// 清除該分類篩選項目
			const groupID = String(_this.parents(".filter-item").data("id"))
			search_ids[groupID].length = 0
		} else if(_this.hasClass('cleanButton')) {
			// 清除所有篩選器
			keysArray.forEach(element => {
				search_ids[element].length = 0
			})
		}

		// 建立POST用陣列
		const postArray = []
		if(keysArray.length) {
			keysArray.forEach(element => {
				postArray.push(...search_ids[element])
			})
		}
		// console.log(search_ids)
		// console.log(postArray)

		$.ajax({
			url: Project_Country + "/products/ajax/list/ajax_get_top_filter.php",
			type:"POST",
			async: true,
			data:{
				Type: 'search',
				Sub_Pattern_IDs: postArray,
				Last_Item_ID: last_item_id,
			},
			error:function(d){
				alert(d.responseText);
			},
			success:function(d){
				// console.log(search_ids, last_item_id)
				$('#filter-content').html(d)
			}
		});
	})
})($)