/**
 * 更新佔位符顯示狀態
 * 1. 計算最大組數：取各組 ceil(selected / fullB) 的最大值，最小為 1
 * 2. 每組目標數量 = 最大組數 * fullB
 * 3. 每組佔位符數量 = 目標數量 - 已選數量
 *
 * 範例：狗組需1件，貓組需3件
 * - 狗0件、貓0件 → maxGroups=1 → 狗目標1(佔位1)、貓目標3(佔位3)
 * - 狗2件、貓2件 → maxGroups=2 → 狗目標2(佔位0)、貓目標6(佔位4)
 * - 狗0件、貓8件 → maxGroups=3 → 狗目標3(佔位3)、貓目標9(佔位1)
 *
 * @param {Array} groupSettings - 組別設定陣列，每項包含 {index, fullA, fullB, selected, AS}
 */
function updatePlaceholderVisibility(groupSettings) {
	if (!groupSettings || groupSettings.length === 0) return;

	// 計算每組可湊成的組數，取最大值為最大組數
	var maxGroups = 0;
	groupSettings.forEach(function(group) {
		if (group.fullB > 0) {
			var groupCount = Math.ceil(group.selected / group.fullB);
			if (groupCount > maxGroups) {
				maxGroups = groupCount;
			}
		}
	});

	// 若所有組都沒有選購，至少顯示一組的佔位符
	if (maxGroups === 0) {
		maxGroups = 1;
	}

	var carousel = $(".user-list6 .orderSlide");

	// 先按 index 排序 groupSettings，確保處理順序正確
	groupSettings.sort(function(a, b) {
		return a.index - b.index;
	});

	// 第一步：移除所有現有的佔位符（每組可能有多個）
	groupSettings.forEach(function(group) {
		var placeItems = carousel.find('.pic-bg.num_' + group.index);
		placeItems.each(function() {
			var owlItem = $(this).parents(".owl-item").not(".cloned");
			if (owlItem.length > 0) {
				carousel.trigger('remove.owl.carousel', [owlItem.index()]).trigger('refresh.owl.carousel');
			}
		});
	});

	// 第二步：計算每組需要的佔位符數量並加入
	groupSettings.forEach(function(group) {
		// 目標數量 = 最大組數 * 該組每組需求量
		var targetCount = maxGroups * group.fullB;
		// 佔位符數量 = 目標數量 - 已選數量
		var placeholderCount = targetCount - group.selected;
		if (placeholderCount < 0) placeholderCount = 0;

		for (var i = 0; i < placeholderCount; i++) {
			var groupName = group['AS'];
			var placeholderHtml = '<div class="pic-bg num_' + group.index + '">' +
				'<p>' + groupName + _jsLang.組 + '</p>' +
				'<p>' + _jsLang.商品尚未選購 + '</p>' +
			'</div>';

			// 加到最後
			carousel.trigger('add.owl.carousel', [$(placeholderHtml)]).trigger('refresh.owl.carousel');
		}
	});
}

$(document).ready(function(){
	//增加
	$('.combosBox').on('click','.button1',function(e){
		var _this = $(this),
			id  = _this.attr("sid"),
			group = _this.attr("group"),
			num = _this.parents(".productBox").find(".select-num-input").val(),
			parent = _this.attr("parent");

		if(id && num){
			$.ajax({
				url:Project_Country+'activities/ajax/act8/ajax_set_cart.php',
				type:"POST",
				cache:false,
				async:true,
				data:{type:'add',group:group,id:id,Amount:num,parent:parent},
				error:function(d){
					alert('網路連線過慢，網頁請重新整理');
				},
				success:function(d){
					$("#Act_Title_Box").html(d);
					$(".product-detail").find(".amountBox").val($("#Fit_Amount").val())
					if($("#Alert_Msg").val()){
						alert($("#Alert_Msg").val());
					}else{
						order_add(_this);
					}
				}
			});
		}else{
			if(!id){
				alert(_jsLang.請選擇尺寸與規格);
			}else if(!num){
				alert(_jsLang.請選擇數量);
			}
			return false;
		}
	});
	//減少
    $(".user-orderBox").on('click','.delete',function(){
		const del = $(this).parents('.orderProduct');
		const carousel = del.parents(".owl-carousel");

		// 動畫後移除商品元素，佔位符由 updatePlaceholderVisibility 處理
		del.find('.title').remove();
		del.find('img').animate(
			{ opacity: 0 },
			300,
			function(){
				carousel.trigger('remove.owl.carousel', del.parents('.owl-item').index()).trigger('refresh.owl.carousel');
			}
		);

		var id  = $(this).attr("sid"),
			group = $(this).attr("group"),
			parent = $(this).attr("parent");

		$.ajax({
			url:Project_Country+'activities/ajax/act8/ajax_set_cart.php',
			type:"POST",
			cache:false,
			async:true,
			data:{type:'del',group:group,id:id,parent:parent},
			error:function(d){
				alert('網路連線過慢，網頁請重新整理');
			},
			success:function(d){
				$("#Act_Title_Box").html(d);
				$(".product-detail").find(".amountBox").val($("#Fit_Amount").val());
				// updatePlaceholderVisibility 會在 ajax_set_cart.php 返回的 script 中被呼叫
			}
		});
    });

	//加入購物車
	$(document).on('click','.Add_Tmp_To_Cart',function(){
		//固定模式
		if($(this).attr("type") == "Stable"){
			var Prod = "";
			$(".orderProduct .button1").each(function(){
				Prod += $(this).attr("group")+"="+$(this).attr("sid")+",";
			});
		}

		$.ajax({
			url:Project_Country+'activities/ajax/ajax_add_to_cart.php',
			type:"POST",
			cache:false,
			async:true,
			data:{Act_Type:$(this).attr("act_type"),ID:$(this).attr("prod_id"),Prod:Prod},
			dataType: 'json',
			error:function(d){
				alert('網路連線過慢，網頁請重新整理');
			},
			success:function(d){
				if(d.Msg)
				{
					alert(d.Msg);
				}
				else
				{
					switch(d.Status){
						case "RET_SUCCESS":
							if(d.DataLayer){eval(d.DataLayer)}

							AlertPop({
								icon: '<i class="icon icon-cart-check"></i>',
								string: _jsLang.加入購物車成功,
							})
							window.location.reload();
							break;
						case "RET_NO_MEMBER_NO":
							alert(_jsLang.欲購買紅利兌換商品請先登入會員並完成會員認證);
							break;
						case "RET_RBONUS_OUT":
							alert(_jsLang.紅利不足);
							break;
						case "RET_ERROR":
							alert(_jsLang.資料庫忙線中);
							break;
						case "RET_PROD_ERROR":
							alert(_jsLang.商品已下架);
							break;
						case "RET_PROD_ERROR2":
							alert(_jsLang.商品尚未開賣);
							break;
						case "RET_NO_PROD":
							alert(_jsLang.請選擇商品);
							break;
						case "RET_STOCK_ERROR":
							alert(_jsLang.商品庫存不足);
							break;
						case "RET_LIMIT_ERROR":
							alert(_jsLang.數量超過限購量)
							break;
						case "RET_DAILY_LIMIT_ERROR":
							alert(_jsLang.數量超過每日限購量 || '數量超過每日限購量')
							break;
						case "RET_MAX_SALE_QTY_ERROR":
							alert(_jsLang.此商品已達銷售上限 || '此商品已達銷售上限')
							break;
						case "RET_OVER_SIT_MAX":
							alert(_jsLang.數量超過定期購限購量);
							break;
						case "RET_PROD_IN_ONESHOPPAGE_ERROR":
							alert(_jsLang.此商品於一頁式購物推廣中+'，'+_jsLang.暫無法加入購物車);
							break;
						case "RET_NO_MEMBER":
							alert(_jsLang.欲購買會員等級限制商品請先登入會員 || '欲購買會員等級限制商品請先登入會員');
							break;
						case "RET_ERROR_LEVEL":
							alert(_jsLang.此會員等級暫無法加入購物車 || '此會員等級暫無法加入購物車');
							break;
						case "GAME_PLAYED":
							alert(_jsLang.購物車內有遊戲未結商品無法修改購物車);
							break;
						default:
							alert(_jsLang.資料庫忙線中);
							break;
					};
				}
			}
		});
	});
});

function order_add(_this){
	const product = _this.parents('.productBox')
	const product_title = product.find('.title').text()
	const product_img = product.find('img').attr('src')
	const product_price = product.find('.price-digit').text()
	const product_num = product.find('.select-num-input').val()
	const product_spec = product.find('.color-select').find('option:selected').text()
	const product_group = _this.attr("group")
	const product_id = _this.attr("sid")
	const product_parent = _this.attr("parent")
	const n = _this.parents('.combos').index();
	const html = `
		<div class="orderProduct" data-group="${n}">
			<img src="${product_img}">
			<div class="title">
				<div class="name">${product_title}</div>
				<div class="spec">${(product_spec? product_spec: _jsLang.單一規格)}</div>
				<div class="pricebox font-danger">${_jsLang.Language_Currency + product_price}</div>
			</div>
			<button type="button" class="delete" sid="${product_id}" group="${product_group}" parent="${product_parent}"><i class="fa fa-times"></i></button>
		</div>
	`
	const slideWrapper = $('.user-orderBox')
	slideWrapper.addClass('in-active')
	setTimeout(function() {
		slideWrapper.removeClass('in-active')
	}, 1000)
	order_animate(product,html,product_num);

}

function order_animate(product,html,num){
	var choseImg = product.find('.productImg img').eq(0),
		Img_html = choseImg.clone().addClass('moveImg'),
		choseImg_top = product.offset().top,
		choseImg_left = product.offset().left,
		choseImg_width = product.width(),
		choseImg_height = product.height();

	var origin_box = $('.user-orderBox .pic-bg').eq(0),
		orderBox_change = origin_box.length ? origin_box : $(".orderProduct").eq(0)
		changeBox_top = orderBox_change.offset().top,
		changeBox_left = orderBox_change.offset().left,
		changeBox_width = orderBox_change.width(),
		changeBox_height = orderBox_change.height();

	$('body').append(Img_html);
	$('.moveImg').css({
		'top':choseImg_top,
		'left':choseImg_left,
		'width':choseImg_width,
		'height':choseImg_height
	}).animate({
		'top':changeBox_top,
		'left':changeBox_left,
		'width':changeBox_width,
		'height':changeBox_height
	},300,function(){
		$(this).remove();
		// if(origin_box.length){
		// 	$(".user-list6 .orderSlide").trigger('remove.owl.carousel',origin_box.parents('.owl-item').index()).trigger('refresh.owl.carousel');
		// }
		$(".user-list6 .orderSlide").trigger('to.owl.carousel',[0,0,true]).trigger('add.owl.carousel',[$(html),0]).trigger('refresh.owl.carousel');
		num = num-1;
		if(num >0){
			order_animate(product,html,num);
		}
	});


	//$(".user-list6 .orderSlide").trigger('to.owl.carousel',[0,0,true]).trigger('add.owl.carousel',[$(html),0]).trigger('refresh.owl.carousel');
}

// ==========================================================
//  複製連結
// ==========================================================
$(function(){
	$(document).on("click", ".copy-btn", function(e){
		e.preventDefault()
		navigator.clipboard.writeText($(this).data("link"))
		alert("複製連結成功")
	})
})