//下方推薦商品輪播
;(function($) {
	const block = $(".detail-panel-carousel")
	block.each(function(){
		const _this = $(this)

		updateSwiper(_this)
		$(window).on("resize", function(){
			updateSwiper(_this)
		})
	})

	function initSwiper(parent){
		let swiperEl = parent.find('.swiper')[0]
		if(!swiperEl){
			return
		}
		const swiper = new Swiper(swiperEl , {
			loop:false,
			centeredSlides: false,
			navigation: {
				nextEl: parent.find('.swiper-button-next')[0] || null,
				prevEl: parent.find('.swiper-button-prev')[0] || null,
			},
			pagination: {
				el: parent.find('.swiper-pagination')[0] || null,
				clickable: true
			},
			breakpoints: {
				0: {
					slidesPerView: 2.2,
					spaceBetween: 12
				},
				576: {
					slidesPerView: 3.2,
					spaceBetween: 16
				},
				768: {
					slidesPerView: 4.2,
					spaceBetween: 20
				},
				1200: {
					slidesPerView: 4,
					spaceBetween: 20,
					slidePerGrroup:4
				},
				1440: {
					slidesPerView: 5,
					spaceBetween: 20,
					slidePerGrroup:5
				}
			},
			on: {
				init: function(){
					updateToolbar(parent)
				},
				resize: function(){
					updateToolbar(parent)
				}
			}
		})
	}

	function updateToolbar(parent){
		let toolbar = parent.find(".swiper-toolbar")
		if(toolbar.length){
			if($(window).width() < 576){
				checkToolbar(parent, toolbar, Infinity)
			}else if($(window).width() >= 576 && $(window).width() < 768){
				checkToolbar(parent, toolbar, Infinity)
			}else if($(window).width() >= 768 && $(window).width() < 1200){
				checkToolbar(parent, toolbar, Infinity)
			}else if($(window).width() >= 1200 && $(window).width() < 1440){
				checkToolbar(parent, toolbar, 4)
			}else{
				checkToolbar(parent, toolbar, 5)
			}
		}
	}
	function updateSwiper(parent){
		let swiperTarget = parent.find(".swiper")
		let swiperFlag = false
		if($(window).width() >= 1200){
			//右方商品不輪播
			if(parent.hasClass("theme-bottom") || parent.hasClass("theme-common")){
				swiperFlag = true
			}
		}else{
			swiperFlag = true
		}
		if(swiperTarget.length && swiperTarget[0].swiper){
			swiperTarget[0].swiper.destroy(true, true)
		}
		updateToolbar(parent)
		if(swiperFlag){
			initSwiper(parent)
		}
	}
})($)