$(document).ready(function () {
$('.filterbox').ontouchmove = function(event){
event.preventDefault();
}
var _window = $(window);
var _body = $('body');
var change_1023 = 0;
var productSlidebox = $(".productSlidebox");
//rosetta
$("#Main_Content").on('click','.rosetta_mark', function() {
const Pos_No = $(this).attr("rosetta-id");
const queryID = $(this).attr("rosetta-query-id") || '';
const param = {
type: 'click',
target: Pos_No,
};
if(queryID)
{
param.provider = 'rosetta';
param.source = queryID;
}
if(Pos_No && typeof rosetta == 'function')
{
rosetta('event',param);
console.log('rosetta.event.click');
console.log(param);
}
});
var clickbutton=0;
$('.filter-button,.filterbox .close').on('click',function(){
clickbutton++;
if(clickbutton==1){
$('.filterbox').addClass('open');
}
if(clickbutton==2){
$('.filterbox').removeClass('open');
clickbutton=0;
}
});
//====================================
// intro start
//====================================
function introBox(e){
if(!$(e.target).hasClass("product-intro-box") && !$(e.target).hasClass("product-intro-btn")){
$(".productBox").removeClass("open-intro")
$(".footer-main").css({"z-index":""})
$(document).off("click", introBox)
}
}
$(document).on("click", ".product-intro-btn", function(){
let _this = $(this),
box = _this.parents(".productBox")
if(!box.hasClass("open-intro")){
$(".productBox").removeClass("open-intro")
box.addClass("open-intro")
$(".footer-main").css({"z-index":"-1"})
$(document).on("click", introBox)
}else{
box.removeClass("open-intro")
$(".footer-main").css({"z-index":""})
$(document).off("click", introBox)
}
})
$(document).on("mouseenter", ".product-intro-btn", function(){
$(".productBox").removeClass("open-intro")
$(document).off("click", introBox)
$(this).parents(".productBox").addClass("hover-intro")
})
$(document).on("mouseout", ".product-intro-btn", function(){
$(this).parents(".productBox").removeClass("hover-intro")
})
//====================================
// intro end
//====================================
});
// ==========================================================
// 商品列表樣式切換
// ==========================================================
;(function($, jQuery, window, document) {
const themeTarget = $('article > .content, .inner > .content')
let wrapperStep = ''
$(window).on('resize', function(e) {
e.preventDefault()
if($(this).width() >= 768 && wrapperStep !== 'desktop') {
wrapperStep = 'desktop'
} else if($(this).width() < 768 && wrapperStep !== 'mobile') {
wrapperStep = 'mobile'
}
}).trigger('resize')
$('#viewMode').on('click', '.btn-theme', function(e) {
$(this).addClass('now').siblings('.btn-theme').removeClass('now')
themeTarget.removeAttr('class').addClass('content').addClass($(this).data('theme'))
setTimeout(function(){
window.dispatchEvent(new Event('resize'))
}, 100)
})
})($, jQuery, window, document)
var _window = $(window);
var change = 0;
var change_1023 = 0;
var moreview = false;
var imgviewbox = $('.imgviewbox');
if(_window.width() > 769 && change != 960 ){
change = 960;
moreview = true;
videoBox();
}else if(_window.width() <= 768 && change!= 768){
change = 768;
$('.item-1').on('click','img', function(event) {
var html ='.attr('src')+')
' ;
imgviewbox.append(html).css('display','block');
});
imgviewbox.on('click','.close', function(event) {
imgviewbox.css('display','none').find('img').remove();
});
};
/*影片效果*/
function videoBox(){
//影片控制
$(".moreview").on('click','.video_control',function(){
var video = document.getElementById("Video");
if(video.paused){
$(this).addClass('fa-pause').removeClass('fa-play');
video.play();
}else{
$(this).addClass('fa-play').removeClass('fa-pause');
video.pause();
}
});
//影片預覽圖
if(document.getElementById("Video")){
document.getElementById("Video").oncanplay=function(){
var video = $("#Video").get(0);
var canvas = document.getElementById("video_review");
canvas.getContext('2d').drawImage(video, 0, 0, 66, 92);
};
}
}
// ==========================================================
// KOL 分類小圖示
// ==========================================================
$(function() {
const swiper = new Swiper('.swiper-container', {
slidesPerView: 'auto',
slidesPerColumn: 1,
loop: true,
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
},
breakpoints: {
0: {
direction: 'horizontal',
spaceBetween: 15,
},
660: {
direction: 'horizontal',
spaceBetween: 25,
},
1025: {
direction: 'horizontal',
spaceBetween: 30,
},
1420: {
direction: 'vertical',
spaceBetween: 10,
},
}
});
})
// ==========================================================
// 手機tag展開
// ==========================================================
$(function() {
$(document).on("click", ".tag-btn", function(e){
let wrapper = $(this).parents(".tag-wrapper")
wrapper.toggleClass("open")
})
})
// ==========================================================
// 商品description開合
// ==========================================================
$(function() {
$(document).on("click", ".products-top-title.theme-fold", function(e){
$(this).toggleClass("in-open")
})
})