151 lines
4.3 KiB
JavaScript
151 lines
4.3 KiB
JavaScript
$(function () {
|
|
if ($('.illustration_product_slider').length) {
|
|
var swiperProductSlider = new Swiper('.illustration_product_slider', {
|
|
pagination: {
|
|
el: '.swiper-pagination',
|
|
type: 'progressbar',
|
|
},
|
|
navigation: {
|
|
nextEl: '.swiper-slide-next',
|
|
prevEl: '.swiper-slide-prev',
|
|
},
|
|
})
|
|
}
|
|
})
|
|
|
|
$(function () {
|
|
$('#nav_tabs li').first().addClass('active')
|
|
var productList = $('#product-preview-box .scontainer-content')
|
|
$('.product-preview', productList).first().addClass('active')
|
|
activateProductColors()
|
|
activateProductDrafts()
|
|
activateProductBanner()
|
|
activateProductCustomBox()
|
|
|
|
$('#nav_tabs li a').on('click', function (event) {
|
|
event.preventDefault()
|
|
var boxHref = $(this).attr('href').substring(1)
|
|
$(this).parent().parent().find('li').removeClass('active')
|
|
$(this).parent().addClass('active')
|
|
|
|
activateProductBox(boxHref)
|
|
activateProductColors(boxHref)
|
|
activateProductDrafts(boxHref)
|
|
activateProductBanner(boxHref)
|
|
activateProductCustomBox(boxHref)
|
|
|
|
if ($(this).attr('colors')) {
|
|
$('#product-colors-preview-box').show()
|
|
let colorsArr = $(this).attr('colors').split(' ')
|
|
activateProductColorsTabs(colorsArr)
|
|
} else {
|
|
$('#product-colors-preview-box').hide()
|
|
}
|
|
})
|
|
|
|
function activateProductBox(boxHref) {
|
|
$('.product-preview', productList).removeClass('active')
|
|
$(productList).find(`#${boxHref}`).addClass('active')
|
|
}
|
|
|
|
function activateProductCustomBox(boxHref = '') {
|
|
if (boxHref === '') {
|
|
$('.c-boxes .c-box').first().addClass('active')
|
|
} else {
|
|
$('.c-box', '.c-boxes').removeClass('active')
|
|
$('.c-box[product=' + boxHref + ']', '.c-boxes').addClass('active')
|
|
}
|
|
}
|
|
|
|
function activateProductColors(boxHref = '') {
|
|
if (boxHref === '') {
|
|
$('#product-colors-box .product-colors').first().addClass('active')
|
|
} else if ($('#product-colors-box .product-colors').length > 1) {
|
|
$('#product-colors-box .product-colors').removeClass('active')
|
|
$('#product-colors-box .product-colors').each(function () {
|
|
if ($(this).attr('model') === boxHref) {
|
|
$(this).addClass('active')
|
|
}
|
|
})
|
|
}
|
|
}
|
|
function activateProductDrafts(boxHref = '') {
|
|
if (boxHref === '') {
|
|
$('#product-drafts-box .product-drafts').first().addClass('active')
|
|
} else if ($('#product-drafts-box .product-drafts').length > 1) {
|
|
$('#product-drafts-box .product-drafts').removeClass('active')
|
|
$('#product-drafts-box .product-drafts').each(function () {
|
|
if ($(this).attr('model') === boxHref) {
|
|
$(this).addClass('active')
|
|
}
|
|
})
|
|
}
|
|
}
|
|
function activateProductBanner(boxHref = '') {
|
|
if (boxHref === '') {
|
|
$('#product-banners-box .product-banner').first().addClass('active')
|
|
} else if ($('#product-banners-box .product-banner').length > 1) {
|
|
$('#product-banners-box .product-banner').removeClass('active')
|
|
$('#product-banners-box .product-banner').each(function () {
|
|
if ($(this).attr('model') === boxHref) {
|
|
$(this).addClass('active')
|
|
}
|
|
})
|
|
}
|
|
}
|
|
|
|
function activateProductColorsTabs(colors) {
|
|
console.log(colors)
|
|
|
|
if (colors && typeof colors === 'object') {
|
|
$('#nav_tabs_colors li').each(function () {
|
|
var href = $(this).find('a').attr('href').substring(1)
|
|
if (!colors.includes(href)) {
|
|
$(this).hide()
|
|
} else {
|
|
$(this).show()
|
|
}
|
|
})
|
|
|
|
let firstVisible = $('#nav_tabs_colors li:visible').first()
|
|
if (firstVisible.length > 0) {
|
|
firstVisible.find('a').trigger('click')
|
|
}
|
|
}
|
|
}
|
|
|
|
// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
|
|
|
|
var productColorsList = $('#product-colors-preview-box .scontainer-content')
|
|
|
|
$('#nav_tabs_colors li a').on('click', function (e) {
|
|
e.preventDefault()
|
|
|
|
var boxColorHref = $(this).attr('href').substring(1)
|
|
$(this).parent().parent().find('li').removeClass('active')
|
|
$(this).parent().addClass('active')
|
|
|
|
activateProductColorsBox(boxColorHref)
|
|
})
|
|
|
|
$('#nav_tabs_colors li').first().addClass('active')
|
|
$('.colors-preview', productColorsList).first().addClass('active')
|
|
|
|
function activateProductColorsBox(boxColorHref) {
|
|
$('.colors-preview', productColorsList).removeClass('active')
|
|
$(productColorsList).find(`#${boxColorHref}`).addClass('active')
|
|
}
|
|
})
|
|
|
|
// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
|
|
|
|
$(document).ready(function () {
|
|
$('#product-colors-box img').each(function () {
|
|
var img = $(this)
|
|
var src = img.attr('data-src')
|
|
img.wrap('<a href="' + src + '" data-fancybox></a>')
|
|
})
|
|
|
|
Fancybox.bind('[data-fancybox]', {})
|
|
})
|