${function() {
var thumbSwitchName = '';
return (data.product.options || []).map((option, index) => {
const optionName = option.name || '';
const position = `option${index + 1}`;
var isThumbImage = false;
if (data.product.need_variant_image && thumbSwitchName === '') {
const variantNames = ["color"] || [];
for (let i = 0, len = variantNames.length; i < len; i++) {
const name = variantNames[i];
if (name === optionName) {
isThumbImage = true;
thumbSwitchName = name;
}
}
}
const variantType = "button";
const thumbStyle = "image_with_text";
const mouseEvent = isThumbImage ? ('quick-view-variant-template-' + optionName + '.rerender(data=event);') : '';
return (variantType == 'dropdown' && !isThumbImage) ? `
${optionName.toLowerCase()}
` : `
${optionName.toLowerCase()}
${option.values.map(value => {
const selected = data.selectedValues[optionName] == value ? 'selected' : '';
let thumbImage = null;
if (isThumbImage) {
const variants = data.product.variants;
for (let i = 0, len = variants.length; i < len; i++) {
const variant = variants[i];
if (variant[position] == value && thumbImage == null) {
thumbImage = variant.image;
break;
}
}
}
return `
${value}
`;
}).join('')}
`;
}).join('')
}()}