{
$event.stopPropagation();
jeanSizes = [];
selectedSize = null;
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.option_index] == $event.detail.option_value){
selectedVariant = productVariants[variant]
break
}
}
for(option in productOptions){
if(productOptions[option].name.toLowerCase() != 'color'){
selectedColorOptions = productOptions[option].values
break
}
}
for(variant in productVariants){
if(productVariants[variant].option1 == selectedVariant.option1){
let size = productVariants[variant].option2.split('-')[0];
let length = productVariants[variant].option2.split('-')[1];
// console.log(productVariants[variant])
jeanSizes.push({size: size, length: length, variant: productVariants[variant]})
}
}
// New image logic (same as pdp but choosing the first image that matches the current variant's color code)
let jsonVariants = JSON.parse(document.querySelector('#card-product-variants-10664864678161').innerText);
let jsonImages = JSON.parse(document.querySelector('#card-product-images-10664864678161').innerText);
let jsonSelectedVariant = jsonVariants.find(variant => variant.id == selectedVariant.id);
let selectedVariantColorCode = jsonSelectedVariant.color_code;
let selectedVariantImage = jsonImages.find(image => image.color_code == selectedVariantColorCode);
if(selectedVariantImage){
document.querySelector('.variant-img-container-10664864678161-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariantImage.src;
document.querySelector('.variant-img-container-10664864678161-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariantImage.src;
document.querySelector('.variant-img-container-10664864678161-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
} else {
if(selectedVariant.featured_image){
document.querySelector('.variant-img-container-10664864678161-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10664864678161-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10664864678161-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
}
}
})
"
@option-updated="
$nextTick(() => {
$event.stopPropagation();
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.index - 1] == $event.detail.option && productVariants[variant].options[$event.detail.colorIndex - 1] == selectedVariant.options[$event.detail.colorIndex - 1]){
if(productVariants[variant].available) {
selectedVariant = productVariants[variant];
if(hasJeansLogic){
document.querySelectorAll('.jeans-length-swatch-13232511_4570414').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
} else {
document.querySelectorAll('.size-swatch-13232511_4570414').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
};
}
break
}
}
})
"
>
{
$event.stopPropagation();
jeanSizes = [];
selectedSize = null;
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.option_index] == $event.detail.option_value){
selectedVariant = productVariants[variant]
break
}
}
for(option in productOptions){
if(productOptions[option].name.toLowerCase() != 'color'){
selectedColorOptions = productOptions[option].values
break
}
}
for(variant in productVariants){
if(productVariants[variant].option1 == selectedVariant.option1){
let size = productVariants[variant].option2.split('-')[0];
let length = productVariants[variant].option2.split('-')[1];
// console.log(productVariants[variant])
jeanSizes.push({size: size, length: length, variant: productVariants[variant]})
}
}
// New image logic (same as pdp but choosing the first image that matches the current variant's color code)
let jsonVariants = JSON.parse(document.querySelector('#card-product-variants-10664864514321').innerText);
let jsonImages = JSON.parse(document.querySelector('#card-product-images-10664864514321').innerText);
let jsonSelectedVariant = jsonVariants.find(variant => variant.id == selectedVariant.id);
let selectedVariantColorCode = jsonSelectedVariant.color_code;
let selectedVariantImage = jsonImages.find(image => image.color_code == selectedVariantColorCode);
if(selectedVariantImage){
document.querySelector('.variant-img-container-10664864514321-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariantImage.src;
document.querySelector('.variant-img-container-10664864514321-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariantImage.src;
document.querySelector('.variant-img-container-10664864514321-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
} else {
if(selectedVariant.featured_image){
document.querySelector('.variant-img-container-10664864514321-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10664864514321-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10664864514321-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
}
}
})
"
@option-updated="
$nextTick(() => {
$event.stopPropagation();
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.index - 1] == $event.detail.option && productVariants[variant].options[$event.detail.colorIndex - 1] == selectedVariant.options[$event.detail.colorIndex - 1]){
if(productVariants[variant].available) {
selectedVariant = productVariants[variant];
if(hasJeansLogic){
document.querySelectorAll('.jeans-length-swatch-13232511_4539802').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
} else {
document.querySelectorAll('.size-swatch-13232511_4539802').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
};
}
break
}
}
})
"
>
{
$event.stopPropagation();
jeanSizes = [];
selectedSize = null;
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.option_index] == $event.detail.option_value){
selectedVariant = productVariants[variant]
break
}
}
for(option in productOptions){
if(productOptions[option].name.toLowerCase() != 'color'){
selectedColorOptions = productOptions[option].values
break
}
}
for(variant in productVariants){
if(productVariants[variant].option1 == selectedVariant.option1){
let size = productVariants[variant].option2.split('-')[0];
let length = productVariants[variant].option2.split('-')[1];
// console.log(productVariants[variant])
jeanSizes.push({size: size, length: length, variant: productVariants[variant]})
}
}
// New image logic (same as pdp but choosing the first image that matches the current variant's color code)
let jsonVariants = JSON.parse(document.querySelector('#card-product-variants-10614558753041').innerText);
let jsonImages = JSON.parse(document.querySelector('#card-product-images-10614558753041').innerText);
let jsonSelectedVariant = jsonVariants.find(variant => variant.id == selectedVariant.id);
let selectedVariantColorCode = jsonSelectedVariant.color_code;
let selectedVariantImage = jsonImages.find(image => image.color_code == selectedVariantColorCode);
if(selectedVariantImage){
document.querySelector('.variant-img-container-10614558753041-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariantImage.src;
document.querySelector('.variant-img-container-10614558753041-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariantImage.src;
document.querySelector('.variant-img-container-10614558753041-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
} else {
if(selectedVariant.featured_image){
document.querySelector('.variant-img-container-10614558753041-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10614558753041-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10614558753041-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
}
}
})
"
@option-updated="
$nextTick(() => {
$event.stopPropagation();
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.index - 1] == $event.detail.option && productVariants[variant].options[$event.detail.colorIndex - 1] == selectedVariant.options[$event.detail.colorIndex - 1]){
if(productVariants[variant].available) {
selectedVariant = productVariants[variant];
if(hasJeansLogic){
document.querySelectorAll('.jeans-length-swatch-13227571_4438350').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
} else {
document.querySelectorAll('.size-swatch-13227571_4438350').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
};
}
break
}
}
})
"
>
{
$event.stopPropagation();
jeanSizes = [];
selectedSize = null;
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.option_index] == $event.detail.option_value){
selectedVariant = productVariants[variant]
break
}
}
for(option in productOptions){
if(productOptions[option].name.toLowerCase() != 'color'){
selectedColorOptions = productOptions[option].values
break
}
}
for(variant in productVariants){
if(productVariants[variant].option1 == selectedVariant.option1){
let size = productVariants[variant].option2.split('-')[0];
let length = productVariants[variant].option2.split('-')[1];
// console.log(productVariants[variant])
jeanSizes.push({size: size, length: length, variant: productVariants[variant]})
}
}
// New image logic (same as pdp but choosing the first image that matches the current variant's color code)
let jsonVariants = JSON.parse(document.querySelector('#card-product-variants-10568414527761').innerText);
let jsonImages = JSON.parse(document.querySelector('#card-product-images-10568414527761').innerText);
let jsonSelectedVariant = jsonVariants.find(variant => variant.id == selectedVariant.id);
let selectedVariantColorCode = jsonSelectedVariant.color_code;
let selectedVariantImage = jsonImages.find(image => image.color_code == selectedVariantColorCode);
if(selectedVariantImage){
document.querySelector('.variant-img-container-10568414527761-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariantImage.src;
document.querySelector('.variant-img-container-10568414527761-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariantImage.src;
document.querySelector('.variant-img-container-10568414527761-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
} else {
if(selectedVariant.featured_image){
document.querySelector('.variant-img-container-10568414527761-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10568414527761-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10568414527761-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
}
}
})
"
@option-updated="
$nextTick(() => {
$event.stopPropagation();
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.index - 1] == $event.detail.option && productVariants[variant].options[$event.detail.colorIndex - 1] == selectedVariant.options[$event.detail.colorIndex - 1]){
if(productVariants[variant].available) {
selectedVariant = productVariants[variant];
if(hasJeansLogic){
document.querySelectorAll('.jeans-length-swatch-13233509_4750017').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
} else {
document.querySelectorAll('.size-swatch-13233509_4750017').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
};
}
break
}
}
})
"
>
{
$event.stopPropagation();
jeanSizes = [];
selectedSize = null;
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.option_index] == $event.detail.option_value){
selectedVariant = productVariants[variant]
break
}
}
for(option in productOptions){
if(productOptions[option].name.toLowerCase() != 'color'){
selectedColorOptions = productOptions[option].values
break
}
}
for(variant in productVariants){
if(productVariants[variant].option1 == selectedVariant.option1){
let size = productVariants[variant].option2.split('-')[0];
let length = productVariants[variant].option2.split('-')[1];
// console.log(productVariants[variant])
jeanSizes.push({size: size, length: length, variant: productVariants[variant]})
}
}
// New image logic (same as pdp but choosing the first image that matches the current variant's color code)
let jsonVariants = JSON.parse(document.querySelector('#card-product-variants-10568414494993').innerText);
let jsonImages = JSON.parse(document.querySelector('#card-product-images-10568414494993').innerText);
let jsonSelectedVariant = jsonVariants.find(variant => variant.id == selectedVariant.id);
let selectedVariantColorCode = jsonSelectedVariant.color_code;
let selectedVariantImage = jsonImages.find(image => image.color_code == selectedVariantColorCode);
if(selectedVariantImage){
document.querySelector('.variant-img-container-10568414494993-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariantImage.src;
document.querySelector('.variant-img-container-10568414494993-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariantImage.src;
document.querySelector('.variant-img-container-10568414494993-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
} else {
if(selectedVariant.featured_image){
document.querySelector('.variant-img-container-10568414494993-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10568414494993-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10568414494993-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
}
}
})
"
@option-updated="
$nextTick(() => {
$event.stopPropagation();
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.index - 1] == $event.detail.option && productVariants[variant].options[$event.detail.colorIndex - 1] == selectedVariant.options[$event.detail.colorIndex - 1]){
if(productVariants[variant].available) {
selectedVariant = productVariants[variant];
if(hasJeansLogic){
document.querySelectorAll('.jeans-length-swatch-13233509_4750016').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
} else {
document.querySelectorAll('.size-swatch-13233509_4750016').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
};
}
break
}
}
})
"
>
{
$event.stopPropagation();
jeanSizes = [];
selectedSize = null;
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.option_index] == $event.detail.option_value){
selectedVariant = productVariants[variant]
break
}
}
for(option in productOptions){
if(productOptions[option].name.toLowerCase() != 'color'){
selectedColorOptions = productOptions[option].values
break
}
}
for(variant in productVariants){
if(productVariants[variant].option1 == selectedVariant.option1){
let size = productVariants[variant].option2.split('-')[0];
let length = productVariants[variant].option2.split('-')[1];
// console.log(productVariants[variant])
jeanSizes.push({size: size, length: length, variant: productVariants[variant]})
}
}
// New image logic (same as pdp but choosing the first image that matches the current variant's color code)
let jsonVariants = JSON.parse(document.querySelector('#card-product-variants-10507566448913').innerText);
let jsonImages = JSON.parse(document.querySelector('#card-product-images-10507566448913').innerText);
let jsonSelectedVariant = jsonVariants.find(variant => variant.id == selectedVariant.id);
let selectedVariantColorCode = jsonSelectedVariant.color_code;
let selectedVariantImage = jsonImages.find(image => image.color_code == selectedVariantColorCode);
if(selectedVariantImage){
document.querySelector('.variant-img-container-10507566448913-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariantImage.src;
document.querySelector('.variant-img-container-10507566448913-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariantImage.src;
document.querySelector('.variant-img-container-10507566448913-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
} else {
if(selectedVariant.featured_image){
document.querySelector('.variant-img-container-10507566448913-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10507566448913-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10507566448913-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
}
}
})
"
@option-updated="
$nextTick(() => {
$event.stopPropagation();
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.index - 1] == $event.detail.option && productVariants[variant].options[$event.detail.colorIndex - 1] == selectedVariant.options[$event.detail.colorIndex - 1]){
if(productVariants[variant].available) {
selectedVariant = productVariants[variant];
if(hasJeansLogic){
document.querySelectorAll('.jeans-length-swatch-13229160_4704181').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
} else {
document.querySelectorAll('.size-swatch-13229160_4704181').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
};
}
break
}
}
})
"
>
{
$event.stopPropagation();
jeanSizes = [];
selectedSize = null;
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.option_index] == $event.detail.option_value){
selectedVariant = productVariants[variant]
break
}
}
for(option in productOptions){
if(productOptions[option].name.toLowerCase() != 'color'){
selectedColorOptions = productOptions[option].values
break
}
}
for(variant in productVariants){
if(productVariants[variant].option1 == selectedVariant.option1){
let size = productVariants[variant].option2.split('-')[0];
let length = productVariants[variant].option2.split('-')[1];
// console.log(productVariants[variant])
jeanSizes.push({size: size, length: length, variant: productVariants[variant]})
}
}
// New image logic (same as pdp but choosing the first image that matches the current variant's color code)
let jsonVariants = JSON.parse(document.querySelector('#card-product-variants-10500064477457').innerText);
let jsonImages = JSON.parse(document.querySelector('#card-product-images-10500064477457').innerText);
let jsonSelectedVariant = jsonVariants.find(variant => variant.id == selectedVariant.id);
let selectedVariantColorCode = jsonSelectedVariant.color_code;
let selectedVariantImage = jsonImages.find(image => image.color_code == selectedVariantColorCode);
if(selectedVariantImage){
document.querySelector('.variant-img-container-10500064477457-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariantImage.src;
document.querySelector('.variant-img-container-10500064477457-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariantImage.src;
document.querySelector('.variant-img-container-10500064477457-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
} else {
if(selectedVariant.featured_image){
document.querySelector('.variant-img-container-10500064477457-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10500064477457-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10500064477457-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
}
}
})
"
@option-updated="
$nextTick(() => {
$event.stopPropagation();
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.index - 1] == $event.detail.option && productVariants[variant].options[$event.detail.colorIndex - 1] == selectedVariant.options[$event.detail.colorIndex - 1]){
if(productVariants[variant].available) {
selectedVariant = productVariants[variant];
if(hasJeansLogic){
document.querySelectorAll('.jeans-length-swatch-13232837_4542764').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
} else {
document.querySelectorAll('.size-swatch-13232837_4542764').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
};
}
break
}
}
})
"
>
{
$event.stopPropagation();
jeanSizes = [];
selectedSize = null;
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.option_index] == $event.detail.option_value){
selectedVariant = productVariants[variant]
break
}
}
for(option in productOptions){
if(productOptions[option].name.toLowerCase() != 'color'){
selectedColorOptions = productOptions[option].values
break
}
}
for(variant in productVariants){
if(productVariants[variant].option1 == selectedVariant.option1){
let size = productVariants[variant].option2.split('-')[0];
let length = productVariants[variant].option2.split('-')[1];
// console.log(productVariants[variant])
jeanSizes.push({size: size, length: length, variant: productVariants[variant]})
}
}
// New image logic (same as pdp but choosing the first image that matches the current variant's color code)
let jsonVariants = JSON.parse(document.querySelector('#card-product-variants-10229260026129').innerText);
let jsonImages = JSON.parse(document.querySelector('#card-product-images-10229260026129').innerText);
let jsonSelectedVariant = jsonVariants.find(variant => variant.id == selectedVariant.id);
let selectedVariantColorCode = jsonSelectedVariant.color_code;
let selectedVariantImage = jsonImages.find(image => image.color_code == selectedVariantColorCode);
if(selectedVariantImage){
document.querySelector('.variant-img-container-10229260026129-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariantImage.src;
document.querySelector('.variant-img-container-10229260026129-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariantImage.src;
document.querySelector('.variant-img-container-10229260026129-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
} else {
if(selectedVariant.featured_image){
document.querySelector('.variant-img-container-10229260026129-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10229260026129-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10229260026129-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
}
}
})
"
@option-updated="
$nextTick(() => {
$event.stopPropagation();
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.index - 1] == $event.detail.option && productVariants[variant].options[$event.detail.colorIndex - 1] == selectedVariant.options[$event.detail.colorIndex - 1]){
if(productVariants[variant].available) {
selectedVariant = productVariants[variant];
if(hasJeansLogic){
document.querySelectorAll('.jeans-length-swatch-13227070_4467020').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
} else {
document.querySelectorAll('.size-swatch-13227070_4467020').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
};
}
break
}
}
})
"
>
{
$event.stopPropagation();
jeanSizes = [];
selectedSize = null;
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.option_index] == $event.detail.option_value){
selectedVariant = productVariants[variant]
break
}
}
for(option in productOptions){
if(productOptions[option].name.toLowerCase() != 'color'){
selectedColorOptions = productOptions[option].values
break
}
}
for(variant in productVariants){
if(productVariants[variant].option1 == selectedVariant.option1){
let size = productVariants[variant].option2.split('-')[0];
let length = productVariants[variant].option2.split('-')[1];
// console.log(productVariants[variant])
jeanSizes.push({size: size, length: length, variant: productVariants[variant]})
}
}
// New image logic (same as pdp but choosing the first image that matches the current variant's color code)
let jsonVariants = JSON.parse(document.querySelector('#card-product-variants-10229258060049').innerText);
let jsonImages = JSON.parse(document.querySelector('#card-product-images-10229258060049').innerText);
let jsonSelectedVariant = jsonVariants.find(variant => variant.id == selectedVariant.id);
let selectedVariantColorCode = jsonSelectedVariant.color_code;
let selectedVariantImage = jsonImages.find(image => image.color_code == selectedVariantColorCode);
if(selectedVariantImage){
document.querySelector('.variant-img-container-10229258060049-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariantImage.src;
document.querySelector('.variant-img-container-10229258060049-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariantImage.src;
document.querySelector('.variant-img-container-10229258060049-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
} else {
if(selectedVariant.featured_image){
document.querySelector('.variant-img-container-10229258060049-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10229258060049-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10229258060049-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
}
}
})
"
@option-updated="
$nextTick(() => {
$event.stopPropagation();
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.index - 1] == $event.detail.option && productVariants[variant].options[$event.detail.colorIndex - 1] == selectedVariant.options[$event.detail.colorIndex - 1]){
if(productVariants[variant].available) {
selectedVariant = productVariants[variant];
if(hasJeansLogic){
document.querySelectorAll('.jeans-length-swatch-13229160_4461085').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
} else {
document.querySelectorAll('.size-swatch-13229160_4461085').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
};
}
break
}
}
})
"
>
{
$event.stopPropagation();
jeanSizes = [];
selectedSize = null;
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.option_index] == $event.detail.option_value){
selectedVariant = productVariants[variant]
break
}
}
for(option in productOptions){
if(productOptions[option].name.toLowerCase() != 'color'){
selectedColorOptions = productOptions[option].values
break
}
}
for(variant in productVariants){
if(productVariants[variant].option1 == selectedVariant.option1){
let size = productVariants[variant].option2.split('-')[0];
let length = productVariants[variant].option2.split('-')[1];
// console.log(productVariants[variant])
jeanSizes.push({size: size, length: length, variant: productVariants[variant]})
}
}
// New image logic (same as pdp but choosing the first image that matches the current variant's color code)
let jsonVariants = JSON.parse(document.querySelector('#card-product-variants-10229257961745').innerText);
let jsonImages = JSON.parse(document.querySelector('#card-product-images-10229257961745').innerText);
let jsonSelectedVariant = jsonVariants.find(variant => variant.id == selectedVariant.id);
let selectedVariantColorCode = jsonSelectedVariant.color_code;
let selectedVariantImage = jsonImages.find(image => image.color_code == selectedVariantColorCode);
if(selectedVariantImage){
document.querySelector('.variant-img-container-10229257961745-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariantImage.src;
document.querySelector('.variant-img-container-10229257961745-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariantImage.src;
document.querySelector('.variant-img-container-10229257961745-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
} else {
if(selectedVariant.featured_image){
document.querySelector('.variant-img-container-10229257961745-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10229257961745-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10229257961745-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
}
}
})
"
@option-updated="
$nextTick(() => {
$event.stopPropagation();
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.index - 1] == $event.detail.option && productVariants[variant].options[$event.detail.colorIndex - 1] == selectedVariant.options[$event.detail.colorIndex - 1]){
if(productVariants[variant].available) {
selectedVariant = productVariants[variant];
if(hasJeansLogic){
document.querySelectorAll('.jeans-length-swatch-13229161_4461084').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
} else {
document.querySelectorAll('.size-swatch-13229161_4461084').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
};
}
break
}
}
})
"
>
{
$event.stopPropagation();
jeanSizes = [];
selectedSize = null;
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.option_index] == $event.detail.option_value){
selectedVariant = productVariants[variant]
break
}
}
for(option in productOptions){
if(productOptions[option].name.toLowerCase() != 'color'){
selectedColorOptions = productOptions[option].values
break
}
}
for(variant in productVariants){
if(productVariants[variant].option1 == selectedVariant.option1){
let size = productVariants[variant].option2.split('-')[0];
let length = productVariants[variant].option2.split('-')[1];
// console.log(productVariants[variant])
jeanSizes.push({size: size, length: length, variant: productVariants[variant]})
}
}
// New image logic (same as pdp but choosing the first image that matches the current variant's color code)
let jsonVariants = JSON.parse(document.querySelector('#card-product-variants-10229251047697').innerText);
let jsonImages = JSON.parse(document.querySelector('#card-product-images-10229251047697').innerText);
let jsonSelectedVariant = jsonVariants.find(variant => variant.id == selectedVariant.id);
let selectedVariantColorCode = jsonSelectedVariant.color_code;
let selectedVariantImage = jsonImages.find(image => image.color_code == selectedVariantColorCode);
if(selectedVariantImage){
document.querySelector('.variant-img-container-10229251047697-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariantImage.src;
document.querySelector('.variant-img-container-10229251047697-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariantImage.src;
document.querySelector('.variant-img-container-10229251047697-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
} else {
if(selectedVariant.featured_image){
document.querySelector('.variant-img-container-10229251047697-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10229251047697-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10229251047697-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
}
}
})
"
@option-updated="
$nextTick(() => {
$event.stopPropagation();
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.index - 1] == $event.detail.option && productVariants[variant].options[$event.detail.colorIndex - 1] == selectedVariant.options[$event.detail.colorIndex - 1]){
if(productVariants[variant].available) {
selectedVariant = productVariants[variant];
if(hasJeansLogic){
document.querySelectorAll('.jeans-length-swatch-13224091_4442562').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
} else {
document.querySelectorAll('.size-swatch-13224091_4442562').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
};
}
break
}
}
})
"
>
{
$event.stopPropagation();
jeanSizes = [];
selectedSize = null;
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.option_index] == $event.detail.option_value){
selectedVariant = productVariants[variant]
break
}
}
for(option in productOptions){
if(productOptions[option].name.toLowerCase() != 'color'){
selectedColorOptions = productOptions[option].values
break
}
}
for(variant in productVariants){
if(productVariants[variant].option1 == selectedVariant.option1){
let size = productVariants[variant].option2.split('-')[0];
let length = productVariants[variant].option2.split('-')[1];
// console.log(productVariants[variant])
jeanSizes.push({size: size, length: length, variant: productVariants[variant]})
}
}
// New image logic (same as pdp but choosing the first image that matches the current variant's color code)
let jsonVariants = JSON.parse(document.querySelector('#card-product-variants-10229249310993').innerText);
let jsonImages = JSON.parse(document.querySelector('#card-product-images-10229249310993').innerText);
let jsonSelectedVariant = jsonVariants.find(variant => variant.id == selectedVariant.id);
let selectedVariantColorCode = jsonSelectedVariant.color_code;
let selectedVariantImage = jsonImages.find(image => image.color_code == selectedVariantColorCode);
if(selectedVariantImage){
document.querySelector('.variant-img-container-10229249310993-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariantImage.src;
document.querySelector('.variant-img-container-10229249310993-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariantImage.src;
document.querySelector('.variant-img-container-10229249310993-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
} else {
if(selectedVariant.featured_image){
document.querySelector('.variant-img-container-10229249310993-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10229249310993-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10229249310993-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
}
}
})
"
@option-updated="
$nextTick(() => {
$event.stopPropagation();
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.index - 1] == $event.detail.option && productVariants[variant].options[$event.detail.colorIndex - 1] == selectedVariant.options[$event.detail.colorIndex - 1]){
if(productVariants[variant].available) {
selectedVariant = productVariants[variant];
if(hasJeansLogic){
document.querySelectorAll('.jeans-length-swatch-13227100_4424709').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
} else {
document.querySelectorAll('.size-swatch-13227100_4424709').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
};
}
break
}
}
})
"
>
{
$event.stopPropagation();
jeanSizes = [];
selectedSize = null;
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.option_index] == $event.detail.option_value){
selectedVariant = productVariants[variant]
break
}
}
for(option in productOptions){
if(productOptions[option].name.toLowerCase() != 'color'){
selectedColorOptions = productOptions[option].values
break
}
}
for(variant in productVariants){
if(productVariants[variant].option1 == selectedVariant.option1){
let size = productVariants[variant].option2.split('-')[0];
let length = productVariants[variant].option2.split('-')[1];
// console.log(productVariants[variant])
jeanSizes.push({size: size, length: length, variant: productVariants[variant]})
}
}
// New image logic (same as pdp but choosing the first image that matches the current variant's color code)
let jsonVariants = JSON.parse(document.querySelector('#card-product-variants-10229236859153').innerText);
let jsonImages = JSON.parse(document.querySelector('#card-product-images-10229236859153').innerText);
let jsonSelectedVariant = jsonVariants.find(variant => variant.id == selectedVariant.id);
let selectedVariantColorCode = jsonSelectedVariant.color_code;
let selectedVariantImage = jsonImages.find(image => image.color_code == selectedVariantColorCode);
if(selectedVariantImage){
document.querySelector('.variant-img-container-10229236859153-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariantImage.src;
document.querySelector('.variant-img-container-10229236859153-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariantImage.src;
document.querySelector('.variant-img-container-10229236859153-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
} else {
if(selectedVariant.featured_image){
document.querySelector('.variant-img-container-10229236859153-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10229236859153-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10229236859153-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
}
}
})
"
@option-updated="
$nextTick(() => {
$event.stopPropagation();
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.index - 1] == $event.detail.option && productVariants[variant].options[$event.detail.colorIndex - 1] == selectedVariant.options[$event.detail.colorIndex - 1]){
if(productVariants[variant].available) {
selectedVariant = productVariants[variant];
if(hasJeansLogic){
document.querySelectorAll('.jeans-length-swatch-13224253_4354588').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
} else {
document.querySelectorAll('.size-swatch-13224253_4354588').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
};
}
break
}
}
})
"
>
{
$event.stopPropagation();
jeanSizes = [];
selectedSize = null;
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.option_index] == $event.detail.option_value){
selectedVariant = productVariants[variant]
break
}
}
for(option in productOptions){
if(productOptions[option].name.toLowerCase() != 'color'){
selectedColorOptions = productOptions[option].values
break
}
}
for(variant in productVariants){
if(productVariants[variant].option1 == selectedVariant.option1){
let size = productVariants[variant].option2.split('-')[0];
let length = productVariants[variant].option2.split('-')[1];
// console.log(productVariants[variant])
jeanSizes.push({size: size, length: length, variant: productVariants[variant]})
}
}
// New image logic (same as pdp but choosing the first image that matches the current variant's color code)
let jsonVariants = JSON.parse(document.querySelector('#card-product-variants-10229236728081').innerText);
let jsonImages = JSON.parse(document.querySelector('#card-product-images-10229236728081').innerText);
let jsonSelectedVariant = jsonVariants.find(variant => variant.id == selectedVariant.id);
let selectedVariantColorCode = jsonSelectedVariant.color_code;
let selectedVariantImage = jsonImages.find(image => image.color_code == selectedVariantColorCode);
if(selectedVariantImage){
document.querySelector('.variant-img-container-10229236728081-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariantImage.src;
document.querySelector('.variant-img-container-10229236728081-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariantImage.src;
document.querySelector('.variant-img-container-10229236728081-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
} else {
if(selectedVariant.featured_image){
document.querySelector('.variant-img-container-10229236728081-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10229236728081-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10229236728081-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
}
}
})
"
@option-updated="
$nextTick(() => {
$event.stopPropagation();
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.index - 1] == $event.detail.option && productVariants[variant].options[$event.detail.colorIndex - 1] == selectedVariant.options[$event.detail.colorIndex - 1]){
if(productVariants[variant].available) {
selectedVariant = productVariants[variant];
if(hasJeansLogic){
document.querySelectorAll('.jeans-length-swatch-13224253_4354587').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
} else {
document.querySelectorAll('.size-swatch-13224253_4354587').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
};
}
break
}
}
})
"
>
{
$event.stopPropagation();
jeanSizes = [];
selectedSize = null;
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.option_index] == $event.detail.option_value){
selectedVariant = productVariants[variant]
break
}
}
for(option in productOptions){
if(productOptions[option].name.toLowerCase() != 'color'){
selectedColorOptions = productOptions[option].values
break
}
}
for(variant in productVariants){
if(productVariants[variant].option1 == selectedVariant.option1){
let size = productVariants[variant].option2.split('-')[0];
let length = productVariants[variant].option2.split('-')[1];
// console.log(productVariants[variant])
jeanSizes.push({size: size, length: length, variant: productVariants[variant]})
}
}
// New image logic (same as pdp but choosing the first image that matches the current variant's color code)
let jsonVariants = JSON.parse(document.querySelector('#card-product-variants-10229236629777').innerText);
let jsonImages = JSON.parse(document.querySelector('#card-product-images-10229236629777').innerText);
let jsonSelectedVariant = jsonVariants.find(variant => variant.id == selectedVariant.id);
let selectedVariantColorCode = jsonSelectedVariant.color_code;
let selectedVariantImage = jsonImages.find(image => image.color_code == selectedVariantColorCode);
if(selectedVariantImage){
document.querySelector('.variant-img-container-10229236629777-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariantImage.src;
document.querySelector('.variant-img-container-10229236629777-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariantImage.src;
document.querySelector('.variant-img-container-10229236629777-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
} else {
if(selectedVariant.featured_image){
document.querySelector('.variant-img-container-10229236629777-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10229236629777-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10229236629777-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
}
}
})
"
@option-updated="
$nextTick(() => {
$event.stopPropagation();
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.index - 1] == $event.detail.option && productVariants[variant].options[$event.detail.colorIndex - 1] == selectedVariant.options[$event.detail.colorIndex - 1]){
if(productVariants[variant].available) {
selectedVariant = productVariants[variant];
if(hasJeansLogic){
document.querySelectorAll('.jeans-length-swatch-13224253_4354586').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
} else {
document.querySelectorAll('.size-swatch-13224253_4354586').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
};
}
break
}
}
})
"
>
{
$event.stopPropagation();
jeanSizes = [];
selectedSize = null;
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.option_index] == $event.detail.option_value){
selectedVariant = productVariants[variant]
break
}
}
for(option in productOptions){
if(productOptions[option].name.toLowerCase() != 'color'){
selectedColorOptions = productOptions[option].values
break
}
}
for(variant in productVariants){
if(productVariants[variant].option1 == selectedVariant.option1){
let size = productVariants[variant].option2.split('-')[0];
let length = productVariants[variant].option2.split('-')[1];
// console.log(productVariants[variant])
jeanSizes.push({size: size, length: length, variant: productVariants[variant]})
}
}
// New image logic (same as pdp but choosing the first image that matches the current variant's color code)
let jsonVariants = JSON.parse(document.querySelector('#card-product-variants-10229236302097').innerText);
let jsonImages = JSON.parse(document.querySelector('#card-product-images-10229236302097').innerText);
let jsonSelectedVariant = jsonVariants.find(variant => variant.id == selectedVariant.id);
let selectedVariantColorCode = jsonSelectedVariant.color_code;
let selectedVariantImage = jsonImages.find(image => image.color_code == selectedVariantColorCode);
if(selectedVariantImage){
document.querySelector('.variant-img-container-10229236302097-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariantImage.src;
document.querySelector('.variant-img-container-10229236302097-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariantImage.src;
document.querySelector('.variant-img-container-10229236302097-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
} else {
if(selectedVariant.featured_image){
document.querySelector('.variant-img-container-10229236302097-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10229236302097-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10229236302097-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
}
}
})
"
@option-updated="
$nextTick(() => {
$event.stopPropagation();
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.index - 1] == $event.detail.option && productVariants[variant].options[$event.detail.colorIndex - 1] == selectedVariant.options[$event.detail.colorIndex - 1]){
if(productVariants[variant].available) {
selectedVariant = productVariants[variant];
if(hasJeansLogic){
document.querySelectorAll('.jeans-length-swatch-13224232_4354152').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
} else {
document.querySelectorAll('.size-swatch-13224232_4354152').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
};
}
break
}
}
})
"
>
{
$event.stopPropagation();
jeanSizes = [];
selectedSize = null;
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.option_index] == $event.detail.option_value){
selectedVariant = productVariants[variant]
break
}
}
for(option in productOptions){
if(productOptions[option].name.toLowerCase() != 'color'){
selectedColorOptions = productOptions[option].values
break
}
}
for(variant in productVariants){
if(productVariants[variant].option1 == selectedVariant.option1){
let size = productVariants[variant].option2.split('-')[0];
let length = productVariants[variant].option2.split('-')[1];
// console.log(productVariants[variant])
jeanSizes.push({size: size, length: length, variant: productVariants[variant]})
}
}
// New image logic (same as pdp but choosing the first image that matches the current variant's color code)
let jsonVariants = JSON.parse(document.querySelector('#card-product-variants-10229230272785').innerText);
let jsonImages = JSON.parse(document.querySelector('#card-product-images-10229230272785').innerText);
let jsonSelectedVariant = jsonVariants.find(variant => variant.id == selectedVariant.id);
let selectedVariantColorCode = jsonSelectedVariant.color_code;
let selectedVariantImage = jsonImages.find(image => image.color_code == selectedVariantColorCode);
if(selectedVariantImage){
document.querySelector('.variant-img-container-10229230272785-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariantImage.src;
document.querySelector('.variant-img-container-10229230272785-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariantImage.src;
document.querySelector('.variant-img-container-10229230272785-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
} else {
if(selectedVariant.featured_image){
document.querySelector('.variant-img-container-10229230272785-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10229230272785-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10229230272785-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
}
}
})
"
@option-updated="
$nextTick(() => {
$event.stopPropagation();
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.index - 1] == $event.detail.option && productVariants[variant].options[$event.detail.colorIndex - 1] == selectedVariant.options[$event.detail.colorIndex - 1]){
if(productVariants[variant].available) {
selectedVariant = productVariants[variant];
if(hasJeansLogic){
document.querySelectorAll('.jeans-length-swatch-13193143_4296062').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
} else {
document.querySelectorAll('.size-swatch-13193143_4296062').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
};
}
break
}
}
})
"
>
{
$event.stopPropagation();
jeanSizes = [];
selectedSize = null;
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.option_index] == $event.detail.option_value){
selectedVariant = productVariants[variant]
break
}
}
for(option in productOptions){
if(productOptions[option].name.toLowerCase() != 'color'){
selectedColorOptions = productOptions[option].values
break
}
}
for(variant in productVariants){
if(productVariants[variant].option1 == selectedVariant.option1){
let size = productVariants[variant].option2.split('-')[0];
let length = productVariants[variant].option2.split('-')[1];
// console.log(productVariants[variant])
jeanSizes.push({size: size, length: length, variant: productVariants[variant]})
}
}
// New image logic (same as pdp but choosing the first image that matches the current variant's color code)
let jsonVariants = JSON.parse(document.querySelector('#card-product-variants-10229229814033').innerText);
let jsonImages = JSON.parse(document.querySelector('#card-product-images-10229229814033').innerText);
let jsonSelectedVariant = jsonVariants.find(variant => variant.id == selectedVariant.id);
let selectedVariantColorCode = jsonSelectedVariant.color_code;
let selectedVariantImage = jsonImages.find(image => image.color_code == selectedVariantColorCode);
if(selectedVariantImage){
document.querySelector('.variant-img-container-10229229814033-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariantImage.src;
document.querySelector('.variant-img-container-10229229814033-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariantImage.src;
document.querySelector('.variant-img-container-10229229814033-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
} else {
if(selectedVariant.featured_image){
document.querySelector('.variant-img-container-10229229814033-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10229229814033-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10229229814033-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
}
}
})
"
@option-updated="
$nextTick(() => {
$event.stopPropagation();
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.index - 1] == $event.detail.option && productVariants[variant].options[$event.detail.colorIndex - 1] == selectedVariant.options[$event.detail.colorIndex - 1]){
if(productVariants[variant].available) {
selectedVariant = productVariants[variant];
if(hasJeansLogic){
document.querySelectorAll('.jeans-length-swatch-13207483_4294449').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
} else {
document.querySelectorAll('.size-swatch-13207483_4294449').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
};
}
break
}
}
})
"
>
{
$event.stopPropagation();
jeanSizes = [];
selectedSize = null;
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.option_index] == $event.detail.option_value){
selectedVariant = productVariants[variant]
break
}
}
for(option in productOptions){
if(productOptions[option].name.toLowerCase() != 'color'){
selectedColorOptions = productOptions[option].values
break
}
}
for(variant in productVariants){
if(productVariants[variant].option1 == selectedVariant.option1){
let size = productVariants[variant].option2.split('-')[0];
let length = productVariants[variant].option2.split('-')[1];
// console.log(productVariants[variant])
jeanSizes.push({size: size, length: length, variant: productVariants[variant]})
}
}
// New image logic (same as pdp but choosing the first image that matches the current variant's color code)
let jsonVariants = JSON.parse(document.querySelector('#card-product-variants-10629215682833').innerText);
let jsonImages = JSON.parse(document.querySelector('#card-product-images-10629215682833').innerText);
let jsonSelectedVariant = jsonVariants.find(variant => variant.id == selectedVariant.id);
let selectedVariantColorCode = jsonSelectedVariant.color_code;
let selectedVariantImage = jsonImages.find(image => image.color_code == selectedVariantColorCode);
if(selectedVariantImage){
document.querySelector('.variant-img-container-10629215682833-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariantImage.src;
document.querySelector('.variant-img-container-10629215682833-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariantImage.src;
document.querySelector('.variant-img-container-10629215682833-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
} else {
if(selectedVariant.featured_image){
document.querySelector('.variant-img-container-10629215682833-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10629215682833-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10629215682833-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
}
}
})
"
@option-updated="
$nextTick(() => {
$event.stopPropagation();
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.index - 1] == $event.detail.option && productVariants[variant].options[$event.detail.colorIndex - 1] == selectedVariant.options[$event.detail.colorIndex - 1]){
if(productVariants[variant].available) {
selectedVariant = productVariants[variant];
if(hasJeansLogic){
document.querySelectorAll('.jeans-length-swatch-13238061_4660565').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
} else {
document.querySelectorAll('.size-swatch-13238061_4660565').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
};
}
break
}
}
})
"
>
{
$event.stopPropagation();
jeanSizes = [];
selectedSize = null;
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.option_index] == $event.detail.option_value){
selectedVariant = productVariants[variant]
break
}
}
for(option in productOptions){
if(productOptions[option].name.toLowerCase() != 'color'){
selectedColorOptions = productOptions[option].values
break
}
}
for(variant in productVariants){
if(productVariants[variant].option1 == selectedVariant.option1){
let size = productVariants[variant].option2.split('-')[0];
let length = productVariants[variant].option2.split('-')[1];
// console.log(productVariants[variant])
jeanSizes.push({size: size, length: length, variant: productVariants[variant]})
}
}
// New image logic (same as pdp but choosing the first image that matches the current variant's color code)
let jsonVariants = JSON.parse(document.querySelector('#card-product-variants-10717720969489').innerText);
let jsonImages = JSON.parse(document.querySelector('#card-product-images-10717720969489').innerText);
let jsonSelectedVariant = jsonVariants.find(variant => variant.id == selectedVariant.id);
let selectedVariantColorCode = jsonSelectedVariant.color_code;
let selectedVariantImage = jsonImages.find(image => image.color_code == selectedVariantColorCode);
if(selectedVariantImage){
document.querySelector('.variant-img-container-10717720969489-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariantImage.src;
document.querySelector('.variant-img-container-10717720969489-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariantImage.src;
document.querySelector('.variant-img-container-10717720969489-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
} else {
if(selectedVariant.featured_image){
document.querySelector('.variant-img-container-10717720969489-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10717720969489-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10717720969489-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
}
}
})
"
@option-updated="
$nextTick(() => {
$event.stopPropagation();
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.index - 1] == $event.detail.option && productVariants[variant].options[$event.detail.colorIndex - 1] == selectedVariant.options[$event.detail.colorIndex - 1]){
if(productVariants[variant].available) {
selectedVariant = productVariants[variant];
if(hasJeansLogic){
document.querySelectorAll('.jeans-length-swatch-13238069_4660660').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
} else {
document.querySelectorAll('.size-swatch-13238069_4660660').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
};
}
break
}
}
})
"
>
{
$event.stopPropagation();
jeanSizes = [];
selectedSize = null;
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.option_index] == $event.detail.option_value){
selectedVariant = productVariants[variant]
break
}
}
for(option in productOptions){
if(productOptions[option].name.toLowerCase() != 'color'){
selectedColorOptions = productOptions[option].values
break
}
}
for(variant in productVariants){
if(productVariants[variant].option1 == selectedVariant.option1){
let size = productVariants[variant].option2.split('-')[0];
let length = productVariants[variant].option2.split('-')[1];
// console.log(productVariants[variant])
jeanSizes.push({size: size, length: length, variant: productVariants[variant]})
}
}
// New image logic (same as pdp but choosing the first image that matches the current variant's color code)
let jsonVariants = JSON.parse(document.querySelector('#card-product-variants-10664864317713').innerText);
let jsonImages = JSON.parse(document.querySelector('#card-product-images-10664864317713').innerText);
let jsonSelectedVariant = jsonVariants.find(variant => variant.id == selectedVariant.id);
let selectedVariantColorCode = jsonSelectedVariant.color_code;
let selectedVariantImage = jsonImages.find(image => image.color_code == selectedVariantColorCode);
if(selectedVariantImage){
document.querySelector('.variant-img-container-10664864317713-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariantImage.src;
document.querySelector('.variant-img-container-10664864317713-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariantImage.src;
document.querySelector('.variant-img-container-10664864317713-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
} else {
if(selectedVariant.featured_image){
document.querySelector('.variant-img-container-10664864317713-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10664864317713-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10664864317713-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
}
}
})
"
@option-updated="
$nextTick(() => {
$event.stopPropagation();
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.index - 1] == $event.detail.option && productVariants[variant].options[$event.detail.colorIndex - 1] == selectedVariant.options[$event.detail.colorIndex - 1]){
if(productVariants[variant].available) {
selectedVariant = productVariants[variant];
if(hasJeansLogic){
document.querySelectorAll('.jeans-length-swatch-13202504_3998491').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
} else {
document.querySelectorAll('.size-swatch-13202504_3998491').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
};
}
break
}
}
})
"
>
{
$event.stopPropagation();
jeanSizes = [];
selectedSize = null;
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.option_index] == $event.detail.option_value){
selectedVariant = productVariants[variant]
break
}
}
for(option in productOptions){
if(productOptions[option].name.toLowerCase() != 'color'){
selectedColorOptions = productOptions[option].values
break
}
}
for(variant in productVariants){
if(productVariants[variant].option1 == selectedVariant.option1){
let size = productVariants[variant].option2.split('-')[0];
let length = productVariants[variant].option2.split('-')[1];
// console.log(productVariants[variant])
jeanSizes.push({size: size, length: length, variant: productVariants[variant]})
}
}
// New image logic (same as pdp but choosing the first image that matches the current variant's color code)
let jsonVariants = JSON.parse(document.querySelector('#card-product-variants-10664864153873').innerText);
let jsonImages = JSON.parse(document.querySelector('#card-product-images-10664864153873').innerText);
let jsonSelectedVariant = jsonVariants.find(variant => variant.id == selectedVariant.id);
let selectedVariantColorCode = jsonSelectedVariant.color_code;
let selectedVariantImage = jsonImages.find(image => image.color_code == selectedVariantColorCode);
if(selectedVariantImage){
document.querySelector('.variant-img-container-10664864153873-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariantImage.src;
document.querySelector('.variant-img-container-10664864153873-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariantImage.src;
document.querySelector('.variant-img-container-10664864153873-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
} else {
if(selectedVariant.featured_image){
document.querySelector('.variant-img-container-10664864153873-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10664864153873-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10664864153873-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
}
}
})
"
@option-updated="
$nextTick(() => {
$event.stopPropagation();
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.index - 1] == $event.detail.option && productVariants[variant].options[$event.detail.colorIndex - 1] == selectedVariant.options[$event.detail.colorIndex - 1]){
if(productVariants[variant].available) {
selectedVariant = productVariants[variant];
if(hasJeansLogic){
document.querySelectorAll('.jeans-length-swatch-13202504_3855693').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
} else {
document.querySelectorAll('.size-swatch-13202504_3855693').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
};
}
break
}
}
})
"
>
{
$event.stopPropagation();
jeanSizes = [];
selectedSize = null;
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.option_index] == $event.detail.option_value){
selectedVariant = productVariants[variant]
break
}
}
for(option in productOptions){
if(productOptions[option].name.toLowerCase() != 'color'){
selectedColorOptions = productOptions[option].values
break
}
}
for(variant in productVariants){
if(productVariants[variant].option1 == selectedVariant.option1){
let size = productVariants[variant].option2.split('-')[0];
let length = productVariants[variant].option2.split('-')[1];
// console.log(productVariants[variant])
jeanSizes.push({size: size, length: length, variant: productVariants[variant]})
}
}
// New image logic (same as pdp but choosing the first image that matches the current variant's color code)
let jsonVariants = JSON.parse(document.querySelector('#card-product-variants-10664863858961').innerText);
let jsonImages = JSON.parse(document.querySelector('#card-product-images-10664863858961').innerText);
let jsonSelectedVariant = jsonVariants.find(variant => variant.id == selectedVariant.id);
let selectedVariantColorCode = jsonSelectedVariant.color_code;
let selectedVariantImage = jsonImages.find(image => image.color_code == selectedVariantColorCode);
if(selectedVariantImage){
document.querySelector('.variant-img-container-10664863858961-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariantImage.src;
document.querySelector('.variant-img-container-10664863858961-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariantImage.src;
document.querySelector('.variant-img-container-10664863858961-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
} else {
if(selectedVariant.featured_image){
document.querySelector('.variant-img-container-10664863858961-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10664863858961-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10664863858961-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
}
}
})
"
@option-updated="
$nextTick(() => {
$event.stopPropagation();
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.index - 1] == $event.detail.option && productVariants[variant].options[$event.detail.colorIndex - 1] == selectedVariant.options[$event.detail.colorIndex - 1]){
if(productVariants[variant].available) {
selectedVariant = productVariants[variant];
if(hasJeansLogic){
document.querySelectorAll('.jeans-length-swatch-13202504_3855692').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
} else {
document.querySelectorAll('.size-swatch-13202504_3855692').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
};
}
break
}
}
})
"
>
{
$event.stopPropagation();
jeanSizes = [];
selectedSize = null;
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.option_index] == $event.detail.option_value){
selectedVariant = productVariants[variant]
break
}
}
for(option in productOptions){
if(productOptions[option].name.toLowerCase() != 'color'){
selectedColorOptions = productOptions[option].values
break
}
}
for(variant in productVariants){
if(productVariants[variant].option1 == selectedVariant.option1){
let size = productVariants[variant].option2.split('-')[0];
let length = productVariants[variant].option2.split('-')[1];
// console.log(productVariants[variant])
jeanSizes.push({size: size, length: length, variant: productVariants[variant]})
}
}
// New image logic (same as pdp but choosing the first image that matches the current variant's color code)
let jsonVariants = JSON.parse(document.querySelector('#card-product-variants-10664863826193').innerText);
let jsonImages = JSON.parse(document.querySelector('#card-product-images-10664863826193').innerText);
let jsonSelectedVariant = jsonVariants.find(variant => variant.id == selectedVariant.id);
let selectedVariantColorCode = jsonSelectedVariant.color_code;
let selectedVariantImage = jsonImages.find(image => image.color_code == selectedVariantColorCode);
if(selectedVariantImage){
document.querySelector('.variant-img-container-10664863826193-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariantImage.src;
document.querySelector('.variant-img-container-10664863826193-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariantImage.src;
document.querySelector('.variant-img-container-10664863826193-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
} else {
if(selectedVariant.featured_image){
document.querySelector('.variant-img-container-10664863826193-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10664863826193-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10664863826193-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
}
}
})
"
@option-updated="
$nextTick(() => {
$event.stopPropagation();
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.index - 1] == $event.detail.option && productVariants[variant].options[$event.detail.colorIndex - 1] == selectedVariant.options[$event.detail.colorIndex - 1]){
if(productVariants[variant].available) {
selectedVariant = productVariants[variant];
if(hasJeansLogic){
document.querySelectorAll('.jeans-length-swatch-13202504_3855689').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
} else {
document.querySelectorAll('.size-swatch-13202504_3855689').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
};
}
break
}
}
})
"
>
{
$event.stopPropagation();
jeanSizes = [];
selectedSize = null;
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.option_index] == $event.detail.option_value){
selectedVariant = productVariants[variant]
break
}
}
for(option in productOptions){
if(productOptions[option].name.toLowerCase() != 'color'){
selectedColorOptions = productOptions[option].values
break
}
}
for(variant in productVariants){
if(productVariants[variant].option1 == selectedVariant.option1){
let size = productVariants[variant].option2.split('-')[0];
let length = productVariants[variant].option2.split('-')[1];
// console.log(productVariants[variant])
jeanSizes.push({size: size, length: length, variant: productVariants[variant]})
}
}
// New image logic (same as pdp but choosing the first image that matches the current variant's color code)
let jsonVariants = JSON.parse(document.querySelector('#card-product-variants-10229186330897').innerText);
let jsonImages = JSON.parse(document.querySelector('#card-product-images-10229186330897').innerText);
let jsonSelectedVariant = jsonVariants.find(variant => variant.id == selectedVariant.id);
let selectedVariantColorCode = jsonSelectedVariant.color_code;
let selectedVariantImage = jsonImages.find(image => image.color_code == selectedVariantColorCode);
if(selectedVariantImage){
document.querySelector('.variant-img-container-10229186330897-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariantImage.src;
document.querySelector('.variant-img-container-10229186330897-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariantImage.src;
document.querySelector('.variant-img-container-10229186330897-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
} else {
if(selectedVariant.featured_image){
document.querySelector('.variant-img-container-10229186330897-template--25209509380369__multi_collection_slider_E4krUm img').src = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10229186330897-template--25209509380369__multi_collection_slider_E4krUm img').srcset = selectedVariant.featured_image.src;
document.querySelector('.variant-img-container-10229186330897-template--25209509380369__multi_collection_slider_E4krUm .secondary-image-hover').classList.add('hidden');
}
}
})
"
@option-updated="
$nextTick(() => {
$event.stopPropagation();
for(variant in productVariants){
if(productVariants[variant].options[$event.detail.index - 1] == $event.detail.option && productVariants[variant].options[$event.detail.colorIndex - 1] == selectedVariant.options[$event.detail.colorIndex - 1]){
if(productVariants[variant].available) {
selectedVariant = productVariants[variant];
if(hasJeansLogic){
document.querySelectorAll('.jeans-length-swatch-13151735_3223117').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
} else {
document.querySelectorAll('.size-swatch-13151735_3223117').forEach((swatch) => {
swatch.classList.remove('border-black')
});
$event.target.classList.add('border-black');
};
}
break
}
}
})
"
>