🎁 5% Off First Order Code：NEW

🎁 5% Off First Order Code：NEW

🎁 5% Off First Order Code：NEW

🎁 5% Off First Order Code：NEW

const marketSlot = document.querySelector(".plugin_c_market"); if(marketSlot) { marketSlot.remove(); }

const SITE = (window.C_SETTINGS || window[atob('U0hPUExBWlpB')])?.routes?.root || ''; const MARKET_THEME_SETTINGS = `${SITE}/api/markets/theme_setting`; const MARKET_COUNTRIES = `${SITE}/api/markets/countries`; const IP_MATCHING_MARKET = `${SITE}/api/front/station`; const MARKET_LANGUAGES = `${SITE}/api/markets/:id/active_languages`; const URL_REDIRECT = '_market_redirected'; const COOKIE_TIPS_NAME = 'market_no_tips'; const COOKIE_TIPS_EXPIRES = 1000 * 60 * 60 * 24 * 14; const MARKET_COUNTRY_COOKIE = '_shoplazza_market_country'; const MARKET_MODAL_LOADED = '__market_modal_loaded__'; const PROPERTY_SELECTED = 'selected'; const MARKET_PC_HEADER_TRIGGER = 'market-pc-header-trigger'; const MARKET_PC_HEADER_COUNTRY_SELECT_TITLE = 'market-pc-header-country-select-title'; const MARKET_PC_HEADER_LANGUAGE_SELECT_TITLE = 'market-pc-header-language-select-title'; const MARKET_PC_HEADER_LANGUAGE_SELECT_SUB_TITLE = 'market-pc-header-language-select-sub-title'; const MARKET_PC_HEADER_COUNTRY_SELECT_SUB_TITLE = 'market-pc-header-country-select-sub-title'; const MARKET_FLAG = 'market-flag'; const MARKET_SELECT_VALUE = 'market-select-value'; const MARKET_CURRENCY = 'market-currency'; const MARKET_CURRENCY_SYMBOL = 'market-currency-symbol'; const MARKET_SELECT_ITEM = 'market-select-item'; const MARKET_SELECT_ITEM_ID = 'market-select-item-id'; const MARKET_SELECT_LIST = 'market-select-list'; const MARKET_LANGUAGE_SELECT = 'market-language-select'; const MARKET_COUNTRY_SELECT = 'market-country-select'; const MARKET_MODAL = 'market-modal'; const MARKET_GATEWAY_REDIRECT_MODAL = 'market-gateway-redirect-modal'; const MARKET_RESELECT_MODAL = 'market-reselect-modal'; const MARKET_MODAL_FLAG = 'market-modal-flag'; const MARKET_MODAL_COUNTRY_CODE = 'market-modal-country-code'; const MARKET_MODAL_CURRENCY_SYMBOL = 'market-modal-currency-symbol'; const MARKET_MODAL_CLOSE = 'market-modal-close'; const MARKET_MODAL_CONFIRM = 'market-modal-confirm'; const MARKET_MODAL_RESELECT = 'market-modal-reselect'; const MARKET_MODAL_RESELECT_COUNTRY_SELECT = 'market-modal-reselect-country-select'; const DATA_SECTION_TYPE = 'data-section-type'; const SECTION_TYPE_HEADER = 'header'; const SECTION_TYPE_FOOTER = 'footer'; class SpzCustomMarket extends SPZ.BaseElement { constructor(element) { super(element); this.global = null; this.useCountrySelect_ = false; this.useLanguageSelect_ = false; this.useModal_ = false; this.isSingleSelectMode_ = false; this.blockSectionPosition_ = ''; this.isEditMode = false; this.ipMatchingMarket = null; this.marketCountryList = []; this.marketLanguages = []; this.toast = null; } static deferredMount() { return false; } isLayoutSupported(layout) { return layout == SPZCore.Layout.LOGIC; } buildCallback() { console.debug('Geolocation'); this.xhr_ = SPZServices.xhrFor(this.win); const platform = SPZServices.platformFor(this.win); this.isIOS_ = platform.isIos(); this.action_ = SPZServices.actionServiceForDoc(this.element); this.global = this.win.C_SETTINGS || this.win[atob('U0hPUExBWlpB')]; this.isEditMode = new URLSearchParams(this.win.location.search).get('preview_theme_id') && new URLSearchParams(this.win.location.search).get('oseid'); this.init_(); } showToast_(content) { if (!this.toast) { this.toast = self.document.createElement('ljs-toast'); this.toast.setAttribute('layout', 'nodisplay'); this.toast.setAttribute('hidden', ''); this.toast.setAttribute('duration', '2000'); this.element.appendChild(this.toast); } SPZ.whenApiDefined(this.toast).then((apis) => { apis.showToast(content); }); } triggerEvent_(name, data) { const event = SPZUtils.Event.create(this.win, `${TAG}.${name}`, data); this.action_.trigger(this.element, name, event); } findBlockSectionPosition() { let current = this.element; while (current) { const dataSectionType = current.getAttribute(DATA_SECTION_TYPE); if ( dataSectionType === SECTION_TYPE_HEADER || dataSectionType === SECTION_TYPE_FOOTER ) { return dataSectionType; } current = current.parentElement; } return ''; } async initSettings_() { await this.getMarketThemeSettings_(); if (this.useCountrySelect_) { this.element.setAttribute('use-country-select', true); } if (this.useLanguageSelect_) { this.element.setAttribute('use-language-select', true); } if (this.useModal_) { this.element.setAttribute('use-modal', true); } if ( (this.useCountrySelect_ && !this.useLanguageSelect_) || (!this.useCountrySelect_ && this.useLanguageSelect_) ) { this.isSingleSelectMode_ = true; } this.blockSectionPosition_ = this.findBlockSectionPosition(); this.isPCLayout_ = this.win.matchMedia('(min-width: 960px)').matches; } renderMarketSelectTemplateNode_(clonedTemplate, data) { this.renderTemplateImg_(clonedTemplate, MARKET_FLAG, { src: data?.flag, width: '24', height: '24', }); this.renderTemplateElement_( clonedTemplate, MARKET_SELECT_VALUE, data.value ); this.renderTemplateElement_( clonedTemplate, MARKET_CURRENCY, data?.currency ); this.renderTemplateElement_( clonedTemplate, MARKET_CURRENCY_SYMBOL, data?.currencySymbol ); } bindDropdownOpenClickEvent_(triggerElement, dropdown) { if (!triggerElement) return; const triggerOpen = () => { SPZ.whenApiDefined(dropdown).then((apis) => { if (!dropdown.hasAttribute('open')) { apis.open(triggerElement); } }); }; if (this.isIOS_) { triggerElement.addEventListener('touchstart', triggerOpen); } else { triggerElement.addEventListener('click', triggerOpen); } } createDropdown_() { const dropdown = self.document.createElement('ljs-dropdown'); dropdown.setAttribute('layout', 'nodisplay'); if (this.blockSectionPosition_ === 'header') { dropdown.setAttribute('overlay-style', 'top: 4px;'); dropdown.setAttribute('placement', 'bottomRight'); } else if (this.blockSectionPosition_ === 'footer') { dropdown.setAttribute('overlay-style', 'top: -4px;'); dropdown.setAttribute('placement', 'top'); } return dropdown; } createDropdownIcon_() { const svgElement = document.createElementNS("http://www.w3.org/2000/svg", "svg"); svgElement.setAttribute("class", "market-rotate-180"); svgElement.setAttribute("width", "16"); svgElement.setAttribute("height", "16"); const path1 = document.createElementNS("http://www.w3.org/2000/svg", "path"); path1.setAttribute("d", "M7.47 5.172a.75.75 0 0 1 1.06 0l4.596 4.596a.75.75 0 1 1-1.06 1.06L7.468 6.232a.75.75 0 0 1 0-1.06Z"); path1.setAttribute("fill", "currentColor"); const path2 = document.createElementNS("http://www.w3.org/2000/svg", "path"); path2.setAttribute("d", "M8.533 5.172a.75.75 0 0 1 0 1.06l-4.596 4.596a.75.75 0 1 1-1.061-1.06l4.596-4.596a.75.75 0 0 1 1.06 0Z"); path2.setAttribute("fill", "currentColor"); svgElement.appendChild(path1); svgElement.appendChild(path2); return svgElement; } renderDropdownListWithClickEvent_({ triggerElement, dataList, subTitleRole, listElementWithTemplate, defaultValue, itemHandler, shouldUpdateSelectedItem = false, }) { const dropdown = this.createDropdown_(); const itemTemplate = SPZCore.Dom.scopedQuerySelector( listElementWithTemplate, 'template' ); const clonedItemTemplate = itemTemplate.cloneNode(true); const fragment = self.document.createDocumentFragment(); dataList.forEach((data) => { const tempParentNode = self.document.createElement('div'); const clonedTemplate = self.document.importNode( clonedItemTemplate.content, true ); tempParentNode.appendChild(clonedTemplate); tempParentNode.firstElementChild.classList.add( 'market-select-item' ); this.renderMarketSelectTemplateNode_(tempParentNode, data); const selectItemElement = SPZCore.Dom.scopedQuerySelector( tempParentNode, `[role="${MARKET_SELECT_ITEM}"]` ); if (!selectItemElement) { return; } if (defaultValue === data.value) { if (shouldUpdateSelectedItem) { const clonedSelectItemElement = selectItemElement.cloneNode(true); triggerElement.replaceChild( clonedSelectItemElement, triggerElement.firstElementChild ); } selectItemElement.setAttribute(PROPERTY_SELECTED, ''); } selectItemElement.setAttribute(MARKET_SELECT_ITEM_ID, data.value); fragment.appendChild(tempParentNode.firstElementChild); }); let value = defaultValue; listElementWithTemplate.addEventListener( 'click', (e) => { if (this.isEditMode) { this.showToast_('编辑器下不支持切换国家'); SPZ.whenApiDefined(dropdown).then((apis) => { apis.close(); }); return; } let targetElement = e.target; while (targetElement) { if ( !targetElement || targetElement.getAttribute(MARKET_SELECT_ITEM_ID) ) { break; } targetElement = targetElement.parentNode; } if ( !targetElement || !targetElement.hasAttribute(MARKET_SELECT_ITEM_ID) ) { return; } const selectValue = targetElement.getAttribute(MARKET_SELECT_ITEM_ID); if (value === selectValue) { SPZ.whenApiDefined(dropdown).then((apis) => { apis.close(); }); return; } const selectedData = dataList.find((c) => c.value === selectValue); if (shouldUpdateSelectedItem) { const tempParentNode = self.document.createElement('div'); const clonedTemplate = self.document.importNode( clonedItemTemplate.content, true ); tempParentNode.appendChild(clonedTemplate); this.renderMarketSelectTemplateNode_(tempParentNode, selectedData); tempParentNode.firstElementChild.classList.add( 'market-select-item' ); triggerElement.replaceChild( tempParentNode.firstElementChild, triggerElement.firstElementChild ); } value = selectValue; itemHandler?.(selectedData); SPZ.whenApiDefined(dropdown).then((apis) => { apis.close(); }); }, false ); listElementWithTemplate.removeChild(itemTemplate); listElementWithTemplate.appendChild(fragment); listElementWithTemplate.classList.add('market-select-list'); dropdown.appendChild(listElementWithTemplate); if (subTitleRole) { this.renderSelectTitle_(dropdown, subTitleRole); } return dropdown; } createSelect_({ parent, defaultValue, dataList, listElementWithTemplate, itemHandler, titleRole, }) { const triggerElement = self.document.createElement('div'); triggerElement.classList.add('market-select'); const displayElement = self.document.createElement('div'); triggerElement.appendChild(displayElement); triggerElement.appendChild(this.createDropdownIcon_()); const dropdown = this.renderDropdownListWithClickEvent_({ triggerElement, dataList, listElementWithTemplate, defaultValue, itemHandler, shouldUpdateSelectedItem: true, }); this.bindDropdownOpenClickEvent_(triggerElement, dropdown); const dropdownContainer = self.document.createElement('div'); dropdownContainer.appendChild(triggerElement); dropdownContainer.appendChild(dropdown); dropdownContainer.classList.add('market-select-container'); this.renderSelectTitle_(dropdownContainer, titleRole); parent.appendChild(dropdownContainer); } getListElementWithTemplate_(role) { const template = SPZCore.Dom.scopedQuerySelector( this.element, `[role="${role}"]` ); if (template) { const clonedTemplate = template.cloneNode(true); const tempParent = self.document.createElement("div"); tempParent.appendChild(clonedTemplate.content); const listElementWithTemplate = SPZCore.Dom.scopedQuerySelector( tempParent, `[role="${MARKET_SELECT_LIST}"]` ); return listElementWithTemplate; } return null; } renderSelectTitle_(parent, role) { if (!parent || !role) { return; } const template = SPZCore.Dom.scopedQuerySelector( this.element, `[role="${role}"]` ); const content = self.document.importNode(template.content, true); parent.insertBefore(content, parent.firstElementChild); parent.firstElementChild.classList.add( role.includes('sub') ? 'market-pc-header-select-sub-title' : 'market-pc-header-select-title' ); } initSelect_(rootNode, options) { const parent = rootNode || this.element; if (this.useCountrySelect_) { this.createSelect_({ parent, titleRole: options?.shouldRenderSelectTitle ? MARKET_PC_HEADER_COUNTRY_SELECT_TITLE : undefined, defaultValue: this.getDefaultCountryValue_(), dataList: this.marketCountryList.map(this.mapCountryRenderData_), listElementWithTemplate: this.getListElementWithTemplate_( MARKET_COUNTRY_SELECT ), itemHandler: this.handleCountrySelectChange_.bind(this), }); } if (this.useLanguageSelect_) { this.createSelect_({ parent, titleRole: options?.shouldRenderSelectTitle ? MARKET_PC_HEADER_LANGUAGE_SELECT_TITLE : undefined, defaultValue: this.getDefaultLanguageValue_(), dataList: this.marketLanguages.map(this.mapLanguageRenderData_), listElementWithTemplate: this.getListElementWithTemplate_( MARKET_LANGUAGE_SELECT ), itemHandler: this.handleLanguageSelectChange_.bind(this), }); } } initPcHeaderTriggerElement() { const headerTriggerElementTemplate = SPZCore.Dom.scopedQuerySelector( this.element, `[role="${MARKET_PC_HEADER_TRIGGER}"]` ); const headerTriggerElement = self.document.importNode( headerTriggerElementTemplate.content, true ); const parentDivElement = self.document.createElement('div'); parentDivElement.setAttribute('role', MARKET_PC_HEADER_TRIGGER); parentDivElement.appendChild(headerTriggerElement); this.element.removeChild(headerTriggerElementTemplate); return parentDivElement; } initPanelWithSelect_() { const triggerElement = this.initPcHeaderTriggerElement(); const dropdown = this.createDropdown_(); const panelElement = self.document.createElement('div'); panelElement.classList.add('market-panel'); this.initSelect_(panelElement, {shouldRenderSelectTitle: true}); dropdown.appendChild(panelElement); this.bindDropdownOpenClickEvent_(triggerElement, dropdown); this.element.appendChild(triggerElement); this.element.insertBefore(dropdown, triggerElement); } initSingleSelectDropdown_() { const triggerElement = this.initPcHeaderTriggerElement(); let dropdown; if (this.useCountrySelect_) { dropdown = this.renderDropdownListWithClickEvent_({ triggerElement, subTitleRole: MARKET_PC_HEADER_COUNTRY_SELECT_SUB_TITLE, dataList: this.marketCountryList.map(this.mapCountryRenderData_), listElementWithTemplate: this.getListElementWithTemplate_( MARKET_COUNTRY_SELECT ), defaultValue: this.getDefaultCountryValue_(), itemHandler: this.handleCountrySelectChange_.bind(this), }); } else if (this.useLanguageSelect_) { dropdown = this.renderDropdownListWithClickEvent_({ triggerElement, subTitleRole: MARKET_PC_HEADER_LANGUAGE_SELECT_SUB_TITLE, dataList: this.marketLanguages.map(this.mapLanguageRenderData_), listElementWithTemplate: this.getListElementWithTemplate_( MARKET_LANGUAGE_SELECT ), defaultValue: this.getDefaultLanguageValue_(), itemHandler: this.handleLanguageSelectChange_.bind(this), }); } if (dropdown) { this.bindDropdownOpenClickEvent_(triggerElement, dropdown); this.element.appendChild(triggerElement); this.element.appendChild(dropdown); } } initEntry_() { if (this.blockSectionPosition_ === SECTION_TYPE_HEADER) { if (this.isSingleSelectMode_) { this.initSingleSelectDropdown_(); } else if (this.useCountrySelect_ && this.useLanguageSelect_) { this.initPanelWithSelect_(); } } this.initSelect_(this.element); } async initData_() { const promises = []; if (this.useCountrySelect_ || this.useModal_) { promises.push(this.getCountryList_(), this.getIpMatchingMarket_()); } if (this.useLanguageSelect_) { promises.push(this.getMarketLanguages_(this.global.market.market_id)); } return Promise.all(promises).then((results) => { const ipMatchingMarket = results.find((result) => result.hasOwnProperty('matching_station') ); const marketCountryList = results.find((result) => result.hasOwnProperty('data') ); if (ipMatchingMarket && marketCountryList) { this.ipMatchingMarket = ipMatchingMarket?.matching_station?.find?.( (item) => item.type === 'multiple_market' ) || { img: marketCountryList.length ? marketCountryList?.[0]?.detail && marketCountryList[0].detail?.flag : '', }; } }); } initModal_() { if ( this.isEditMode || !this.ipMatchingMarket?.market_id || !this.useModal_ || this.hasCookie_(COOKIE_TIPS_NAME) || this.win[MARKET_MODAL_LOADED] ) { return; } this.win[MARKET_MODAL_LOADED] = true; const redirectParam = new URLSearchParams(this.win.location.search).get( URL_REDIRECT ); if (redirectParam) { this.initModalEntry_(MARKET_GATEWAY_REDIRECT_MODAL); } else if ( this.ipMatchingMarket.market_id !== this.global?.market?.market_id ) { this.initModalEntry_(MARKET_MODAL); } } async init_() { await this.initSettings_(); await this.initData_(); this.initEntry_(); this.initModal_(); } getDefaultCountryValue_() { return this.getCookie_(MARKET_COUNTRY_COOKIE) || this.marketCountryList[0]?.country_code; } mapCountryRenderData_(country) { return { flag: country?.detail?.flag || '', value: country?.country_code, currency: country?.currency, currencySymbol: country?.symbol?.val || '', url: country?.url, }; } handleCountrySelectChange_(selectedData) { this.setCookie_(MARKET_COUNTRY_COOKIE, selectedData.value); this.handleChangeURL_(selectedData.url); } getDefaultLanguageValue_() { return this.marketLanguages?.find?.( (lang) => lang.code === this.global?.market?.market_lang )?.name; } mapLanguageRenderData_(language) { return { value: language.name, url: language.url, }; } handleLanguageSelectChange_(selectedData) { this.handleChangeURL_(selectedData.url); } renderTemplateElement_(parent, role, value) { const elements = SPZCore.Dom.scopedQuerySelectorAll( parent, `[role="${role}"]` ); elements.forEach((element) => { if (element && value) { element.innerHTML = value; } }); } renderTemplateImg_(parent, role, options) { const flagElement = SPZCore.Dom.scopedQuerySelector( parent, `[role="${role}"]` ); if (flagElement && options?.src && options?.height && options?.width) { const spzImg = self.document.createElement('ljs-img'); spzImg.setAttribute('src', options.src); spzImg.setAttribute('layout', 'responsive'); spzImg.setAttribute('width', options.width); spzImg.setAttribute('height', options.height); spzImg.setAttribute( 'style', `width: ${options.width}px; height: ${options.height}px;` ); flagElement.appendChild(spzImg); } } handleChangeURL_(url) { if (!!url) { let {origin, pathname, search} = this.win.location; pathname = pathname.replace(SITE, url != '/' ? url : ''); this.win.location.href = `${origin}${pathname}${search}`; } else { this.win.location.reload(true); } } initModalEntry_(role) { const marketModalTemplate = SPZCore.Dom.scopedQuerySelector( this.element, `[role="${role}"]` ); if (marketModalTemplate) { const tempParentNode = self.document.createElement('div'); const clonedTemplate = self.document.importNode( marketModalTemplate.content, true ); tempParentNode.appendChild(clonedTemplate); this.renderTemplateImg_(tempParentNode, MARKET_MODAL_FLAG, { src: this.ipMatchingMarket?.img, width: '80', height: '80', }); this.renderTemplateElement_( tempParentNode, MARKET_MODAL_COUNTRY_CODE, this.ipMatchingMarket?.name ); this.renderTemplateElement_( tempParentNode, MARKET_MODAL_CURRENCY_SYMBOL, this.ipMatchingMarket?.currency_with_symbol ); const lightbox = self.document.createElement('ljs-lightbox'); lightbox.setAttribute('layout', 'nodisplay'); lightbox.appendChild(tempParentNode.firstElementChild); self.document.body.appendChild(lightbox); SPZ.whenApiDefined(lightbox).then((apis) => { SPZCore.Dom.scopedQuerySelectorAll( lightbox, `[role="${MARKET_MODAL_CLOSE}"]` ).forEach((ele) => { ele.addEventListener('click', () => { this.setCookie_(COOKIE_TIPS_NAME, 1, COOKIE_TIPS_EXPIRES); apis.close(); }); }); const marketModalConfirmElement = SPZCore.Dom.scopedQuerySelector( lightbox, `[role="${MARKET_MODAL_CONFIRM}"]` ); if (marketModalConfirmElement && this.ipMatchingMarket?.url) { marketModalConfirmElement.addEventListener('click', () => { this.setCookie_(COOKIE_TIPS_NAME, 1, COOKIE_TIPS_EXPIRES); this.setCookie_(MARKET_COUNTRY_COOKIE, this.ipMatchingMarket?.name); this.handleChangeURL_(this.ipMatchingMarket?.url); }); } const marketModalReselectElement = SPZCore.Dom.scopedQuerySelector( lightbox, `[role="${MARKET_MODAL_RESELECT}"]` ); if (marketModalReselectElement) { marketModalReselectElement.addEventListener('click', () => { this.setCookie_(COOKIE_TIPS_NAME, 1, COOKIE_TIPS_EXPIRES); const marketReselectTemplate = SPZCore.Dom.scopedQuerySelector( this.element, `[role="${MARKET_RESELECT_MODAL}"]` ); if (marketReselectTemplate && lightbox.firstElementChild) { const clonedTemplate = self.document.importNode( marketReselectTemplate.content, true ); const selectParent = SPZCore.Dom.scopedQuerySelector( clonedTemplate, `[role="${MARKET_MODAL_RESELECT_COUNTRY_SELECT}"]` ); if (selectParent) { this.createSelect_({ parent: selectParent, defaultValue: this.getDefaultCountryValue_(), dataList: this.marketCountryList.map( this.mapCountryRenderData_ ), listElementWithTemplate: this.getListElementWithTemplate_( MARKET_COUNTRY_SELECT ), itemHandler: this.handleCountrySelectChange_.bind(this), }); } lightbox.replaceChild(clonedTemplate, lightbox.firstElementChild); SPZCore.Dom.scopedQuerySelectorAll( lightbox, `[role="${MARKET_MODAL_CLOSE}"]` ).forEach((ele) => { ele.addEventListener('click', () => { this.setCookie_(COOKIE_TIPS_NAME, 1, COOKIE_TIPS_EXPIRES); apis.close(); }); }); } }); } apis.open(); }); } } async getMarketThemeSettings_() { return this.xhr_.fetchJson(MARKET_THEME_SETTINGS).then((res) => { this.useCountrySelect_ = !!res.country_selector_enabled; this.useLanguageSelect_ = !!res.language_selector_enabled && this.global?.market?.market_id; this.useModal_ = !!res.redirect_pop_enabled; return res; }); } async getCountryList_() { return this.xhr_.fetchJson(MARKET_COUNTRIES).then((res) => { this.marketCountryList = res.data.length ? res.data : []; return res; }); } async getIpMatchingMarket_() { return this.xhr_.fetchJson(IP_MATCHING_MARKET, { method: 'POST', body: { stations: [], }, }); } async getMarketLanguages_(marketId) { return this.xhr_ .fetchJson(MARKET_LANGUAGES.replace(/:id/gim, marketId)) .then((res) => { this.marketLanguages = res?.languages?.length ? res.languages : []; return res; }); } hasCookie_(name) { const m = self.document.cookie .split(';') .filter((pair) => pair.trim().startsWith(name + '=')); return !!(m && m[0]); } getCookie_(name) { const m = self.document.cookie .split(';') .filter((pair) => pair.trim().startsWith(name + '=')); return m && m[0] ? m[0].split('=')[1] : null; } setCookie_(name, value, expires) { const expiresDate = new Date(Date.now() + expires).toGMTString(); self.document.cookie = `${name}=${encodeURIComponent( value )};expires=${expiresDate};path=/`; } } SPZ.defineElement('spz-custom-market', SpzCustomMarket);

BestDVibe

const marketSlot = document.querySelector(".plugin_c_market"); if(marketSlot) { marketSlot.remove(); }

const SITE = (window.C_SETTINGS || window[atob('U0hPUExBWlpB')])?.routes?.root || ''; const MARKET_THEME_SETTINGS = `${SITE}/api/markets/theme_setting`; const MARKET_COUNTRIES = `${SITE}/api/markets/countries`; const IP_MATCHING_MARKET = `${SITE}/api/front/station`; const MARKET_LANGUAGES = `${SITE}/api/markets/:id/active_languages`; const URL_REDIRECT = '_market_redirected'; const COOKIE_TIPS_NAME = 'market_no_tips'; const COOKIE_TIPS_EXPIRES = 1000 * 60 * 60 * 24 * 14; const MARKET_COUNTRY_COOKIE = '_shoplazza_market_country'; const MARKET_MODAL_LOADED = '__market_modal_loaded__'; const PROPERTY_SELECTED = 'selected'; const MARKET_PC_HEADER_TRIGGER = 'market-pc-header-trigger'; const MARKET_PC_HEADER_COUNTRY_SELECT_TITLE = 'market-pc-header-country-select-title'; const MARKET_PC_HEADER_LANGUAGE_SELECT_TITLE = 'market-pc-header-language-select-title'; const MARKET_PC_HEADER_LANGUAGE_SELECT_SUB_TITLE = 'market-pc-header-language-select-sub-title'; const MARKET_PC_HEADER_COUNTRY_SELECT_SUB_TITLE = 'market-pc-header-country-select-sub-title'; const MARKET_FLAG = 'market-flag'; const MARKET_SELECT_VALUE = 'market-select-value'; const MARKET_CURRENCY = 'market-currency'; const MARKET_CURRENCY_SYMBOL = 'market-currency-symbol'; const MARKET_SELECT_ITEM = 'market-select-item'; const MARKET_SELECT_ITEM_ID = 'market-select-item-id'; const MARKET_SELECT_LIST = 'market-select-list'; const MARKET_LANGUAGE_SELECT = 'market-language-select'; const MARKET_COUNTRY_SELECT = 'market-country-select'; const MARKET_MODAL = 'market-modal'; const MARKET_GATEWAY_REDIRECT_MODAL = 'market-gateway-redirect-modal'; const MARKET_RESELECT_MODAL = 'market-reselect-modal'; const MARKET_MODAL_FLAG = 'market-modal-flag'; const MARKET_MODAL_COUNTRY_CODE = 'market-modal-country-code'; const MARKET_MODAL_CURRENCY_SYMBOL = 'market-modal-currency-symbol'; const MARKET_MODAL_CLOSE = 'market-modal-close'; const MARKET_MODAL_CONFIRM = 'market-modal-confirm'; const MARKET_MODAL_RESELECT = 'market-modal-reselect'; const MARKET_MODAL_RESELECT_COUNTRY_SELECT = 'market-modal-reselect-country-select'; const DATA_SECTION_TYPE = 'data-section-type'; const SECTION_TYPE_HEADER = 'header'; const SECTION_TYPE_FOOTER = 'footer'; class SpzCustomMarket extends SPZ.BaseElement { constructor(element) { super(element); this.global = null; this.useCountrySelect_ = false; this.useLanguageSelect_ = false; this.useModal_ = false; this.isSingleSelectMode_ = false; this.blockSectionPosition_ = ''; this.isEditMode = false; this.ipMatchingMarket = null; this.marketCountryList = []; this.marketLanguages = []; this.toast = null; } static deferredMount() { return false; } isLayoutSupported(layout) { return layout == SPZCore.Layout.LOGIC; } buildCallback() { console.debug('Geolocation'); this.xhr_ = SPZServices.xhrFor(this.win); const platform = SPZServices.platformFor(this.win); this.isIOS_ = platform.isIos(); this.action_ = SPZServices.actionServiceForDoc(this.element); this.global = this.win.C_SETTINGS || this.win[atob('U0hPUExBWlpB')]; this.isEditMode = new URLSearchParams(this.win.location.search).get('preview_theme_id') && new URLSearchParams(this.win.location.search).get('oseid'); this.init_(); } showToast_(content) { if (!this.toast) { this.toast = self.document.createElement('ljs-toast'); this.toast.setAttribute('layout', 'nodisplay'); this.toast.setAttribute('hidden', ''); this.toast.setAttribute('duration', '2000'); this.element.appendChild(this.toast); } SPZ.whenApiDefined(this.toast).then((apis) => { apis.showToast(content); }); } triggerEvent_(name, data) { const event = SPZUtils.Event.create(this.win, `${TAG}.${name}`, data); this.action_.trigger(this.element, name, event); } findBlockSectionPosition() { let current = this.element; while (current) { const dataSectionType = current.getAttribute(DATA_SECTION_TYPE); if ( dataSectionType === SECTION_TYPE_HEADER || dataSectionType === SECTION_TYPE_FOOTER ) { return dataSectionType; } current = current.parentElement; } return ''; } async initSettings_() { await this.getMarketThemeSettings_(); if (this.useCountrySelect_) { this.element.setAttribute('use-country-select', true); } if (this.useLanguageSelect_) { this.element.setAttribute('use-language-select', true); } if (this.useModal_) { this.element.setAttribute('use-modal', true); } if ( (this.useCountrySelect_ && !this.useLanguageSelect_) || (!this.useCountrySelect_ && this.useLanguageSelect_) ) { this.isSingleSelectMode_ = true; } this.blockSectionPosition_ = this.findBlockSectionPosition(); this.isPCLayout_ = this.win.matchMedia('(min-width: 960px)').matches; } renderMarketSelectTemplateNode_(clonedTemplate, data) { this.renderTemplateImg_(clonedTemplate, MARKET_FLAG, { src: data?.flag, width: '24', height: '24', }); this.renderTemplateElement_( clonedTemplate, MARKET_SELECT_VALUE, data.value ); this.renderTemplateElement_( clonedTemplate, MARKET_CURRENCY, data?.currency ); this.renderTemplateElement_( clonedTemplate, MARKET_CURRENCY_SYMBOL, data?.currencySymbol ); } bindDropdownOpenClickEvent_(triggerElement, dropdown) { if (!triggerElement) return; const triggerOpen = () => { SPZ.whenApiDefined(dropdown).then((apis) => { if (!dropdown.hasAttribute('open')) { apis.open(triggerElement); } }); }; if (this.isIOS_) { triggerElement.addEventListener('touchstart', triggerOpen); } else { triggerElement.addEventListener('click', triggerOpen); } } createDropdown_() { const dropdown = self.document.createElement('ljs-dropdown'); dropdown.setAttribute('layout', 'nodisplay'); if (this.blockSectionPosition_ === 'header') { dropdown.setAttribute('overlay-style', 'top: 4px;'); dropdown.setAttribute('placement', 'bottomRight'); } else if (this.blockSectionPosition_ === 'footer') { dropdown.setAttribute('overlay-style', 'top: -4px;'); dropdown.setAttribute('placement', 'top'); } return dropdown; } createDropdownIcon_() { const svgElement = document.createElementNS("http://www.w3.org/2000/svg", "svg"); svgElement.setAttribute("class", "market-rotate-180"); svgElement.setAttribute("width", "16"); svgElement.setAttribute("height", "16"); const path1 = document.createElementNS("http://www.w3.org/2000/svg", "path"); path1.setAttribute("d", "M7.47 5.172a.75.75 0 0 1 1.06 0l4.596 4.596a.75.75 0 1 1-1.06 1.06L7.468 6.232a.75.75 0 0 1 0-1.06Z"); path1.setAttribute("fill", "currentColor"); const path2 = document.createElementNS("http://www.w3.org/2000/svg", "path"); path2.setAttribute("d", "M8.533 5.172a.75.75 0 0 1 0 1.06l-4.596 4.596a.75.75 0 1 1-1.061-1.06l4.596-4.596a.75.75 0 0 1 1.06 0Z"); path2.setAttribute("fill", "currentColor"); svgElement.appendChild(path1); svgElement.appendChild(path2); return svgElement; } renderDropdownListWithClickEvent_({ triggerElement, dataList, subTitleRole, listElementWithTemplate, defaultValue, itemHandler, shouldUpdateSelectedItem = false, }) { const dropdown = this.createDropdown_(); const itemTemplate = SPZCore.Dom.scopedQuerySelector( listElementWithTemplate, 'template' ); const clonedItemTemplate = itemTemplate.cloneNode(true); const fragment = self.document.createDocumentFragment(); dataList.forEach((data) => { const tempParentNode = self.document.createElement('div'); const clonedTemplate = self.document.importNode( clonedItemTemplate.content, true ); tempParentNode.appendChild(clonedTemplate); tempParentNode.firstElementChild.classList.add( 'market-select-item' ); this.renderMarketSelectTemplateNode_(tempParentNode, data); const selectItemElement = SPZCore.Dom.scopedQuerySelector( tempParentNode, `[role="${MARKET_SELECT_ITEM}"]` ); if (!selectItemElement) { return; } if (defaultValue === data.value) { if (shouldUpdateSelectedItem) { const clonedSelectItemElement = selectItemElement.cloneNode(true); triggerElement.replaceChild( clonedSelectItemElement, triggerElement.firstElementChild ); } selectItemElement.setAttribute(PROPERTY_SELECTED, ''); } selectItemElement.setAttribute(MARKET_SELECT_ITEM_ID, data.value); fragment.appendChild(tempParentNode.firstElementChild); }); let value = defaultValue; listElementWithTemplate.addEventListener( 'click', (e) => { if (this.isEditMode) { this.showToast_('编辑器下不支持切换国家'); SPZ.whenApiDefined(dropdown).then((apis) => { apis.close(); }); return; } let targetElement = e.target; while (targetElement) { if ( !targetElement || targetElement.getAttribute(MARKET_SELECT_ITEM_ID) ) { break; } targetElement = targetElement.parentNode; } if ( !targetElement || !targetElement.hasAttribute(MARKET_SELECT_ITEM_ID) ) { return; } const selectValue = targetElement.getAttribute(MARKET_SELECT_ITEM_ID); if (value === selectValue) { SPZ.whenApiDefined(dropdown).then((apis) => { apis.close(); }); return; } const selectedData = dataList.find((c) => c.value === selectValue); if (shouldUpdateSelectedItem) { const tempParentNode = self.document.createElement('div'); const clonedTemplate = self.document.importNode( clonedItemTemplate.content, true ); tempParentNode.appendChild(clonedTemplate); this.renderMarketSelectTemplateNode_(tempParentNode, selectedData); tempParentNode.firstElementChild.classList.add( 'market-select-item' ); triggerElement.replaceChild( tempParentNode.firstElementChild, triggerElement.firstElementChild ); } value = selectValue; itemHandler?.(selectedData); SPZ.whenApiDefined(dropdown).then((apis) => { apis.close(); }); }, false ); listElementWithTemplate.removeChild(itemTemplate); listElementWithTemplate.appendChild(fragment); listElementWithTemplate.classList.add('market-select-list'); dropdown.appendChild(listElementWithTemplate); if (subTitleRole) { this.renderSelectTitle_(dropdown, subTitleRole); } return dropdown; } createSelect_({ parent, defaultValue, dataList, listElementWithTemplate, itemHandler, titleRole, }) { const triggerElement = self.document.createElement('div'); triggerElement.classList.add('market-select'); const displayElement = self.document.createElement('div'); triggerElement.appendChild(displayElement); triggerElement.appendChild(this.createDropdownIcon_()); const dropdown = this.renderDropdownListWithClickEvent_({ triggerElement, dataList, listElementWithTemplate, defaultValue, itemHandler, shouldUpdateSelectedItem: true, }); this.bindDropdownOpenClickEvent_(triggerElement, dropdown); const dropdownContainer = self.document.createElement('div'); dropdownContainer.appendChild(triggerElement); dropdownContainer.appendChild(dropdown); dropdownContainer.classList.add('market-select-container'); this.renderSelectTitle_(dropdownContainer, titleRole); parent.appendChild(dropdownContainer); } getListElementWithTemplate_(role) { const template = SPZCore.Dom.scopedQuerySelector( this.element, `[role="${role}"]` ); if (template) { const clonedTemplate = template.cloneNode(true); const tempParent = self.document.createElement("div"); tempParent.appendChild(clonedTemplate.content); const listElementWithTemplate = SPZCore.Dom.scopedQuerySelector( tempParent, `[role="${MARKET_SELECT_LIST}"]` ); return listElementWithTemplate; } return null; } renderSelectTitle_(parent, role) { if (!parent || !role) { return; } const template = SPZCore.Dom.scopedQuerySelector( this.element, `[role="${role}"]` ); const content = self.document.importNode(template.content, true); parent.insertBefore(content, parent.firstElementChild); parent.firstElementChild.classList.add( role.includes('sub') ? 'market-pc-header-select-sub-title' : 'market-pc-header-select-title' ); } initSelect_(rootNode, options) { const parent = rootNode || this.element; if (this.useCountrySelect_) { this.createSelect_({ parent, titleRole: options?.shouldRenderSelectTitle ? MARKET_PC_HEADER_COUNTRY_SELECT_TITLE : undefined, defaultValue: this.getDefaultCountryValue_(), dataList: this.marketCountryList.map(this.mapCountryRenderData_), listElementWithTemplate: this.getListElementWithTemplate_( MARKET_COUNTRY_SELECT ), itemHandler: this.handleCountrySelectChange_.bind(this), }); } if (this.useLanguageSelect_) { this.createSelect_({ parent, titleRole: options?.shouldRenderSelectTitle ? MARKET_PC_HEADER_LANGUAGE_SELECT_TITLE : undefined, defaultValue: this.getDefaultLanguageValue_(), dataList: this.marketLanguages.map(this.mapLanguageRenderData_), listElementWithTemplate: this.getListElementWithTemplate_( MARKET_LANGUAGE_SELECT ), itemHandler: this.handleLanguageSelectChange_.bind(this), }); } } initPcHeaderTriggerElement() { const headerTriggerElementTemplate = SPZCore.Dom.scopedQuerySelector( this.element, `[role="${MARKET_PC_HEADER_TRIGGER}"]` ); const headerTriggerElement = self.document.importNode( headerTriggerElementTemplate.content, true ); const parentDivElement = self.document.createElement('div'); parentDivElement.setAttribute('role', MARKET_PC_HEADER_TRIGGER); parentDivElement.appendChild(headerTriggerElement); this.element.removeChild(headerTriggerElementTemplate); return parentDivElement; } initPanelWithSelect_() { const triggerElement = this.initPcHeaderTriggerElement(); const dropdown = this.createDropdown_(); const panelElement = self.document.createElement('div'); panelElement.classList.add('market-panel'); this.initSelect_(panelElement, {shouldRenderSelectTitle: true}); dropdown.appendChild(panelElement); this.bindDropdownOpenClickEvent_(triggerElement, dropdown); this.element.appendChild(triggerElement); this.element.insertBefore(dropdown, triggerElement); } initSingleSelectDropdown_() { const triggerElement = this.initPcHeaderTriggerElement(); let dropdown; if (this.useCountrySelect_) { dropdown = this.renderDropdownListWithClickEvent_({ triggerElement, subTitleRole: MARKET_PC_HEADER_COUNTRY_SELECT_SUB_TITLE, dataList: this.marketCountryList.map(this.mapCountryRenderData_), listElementWithTemplate: this.getListElementWithTemplate_( MARKET_COUNTRY_SELECT ), defaultValue: this.getDefaultCountryValue_(), itemHandler: this.handleCountrySelectChange_.bind(this), }); } else if (this.useLanguageSelect_) { dropdown = this.renderDropdownListWithClickEvent_({ triggerElement, subTitleRole: MARKET_PC_HEADER_LANGUAGE_SELECT_SUB_TITLE, dataList: this.marketLanguages.map(this.mapLanguageRenderData_), listElementWithTemplate: this.getListElementWithTemplate_( MARKET_LANGUAGE_SELECT ), defaultValue: this.getDefaultLanguageValue_(), itemHandler: this.handleLanguageSelectChange_.bind(this), }); } if (dropdown) { this.bindDropdownOpenClickEvent_(triggerElement, dropdown); this.element.appendChild(triggerElement); this.element.appendChild(dropdown); } } initEntry_() { if (this.blockSectionPosition_ === SECTION_TYPE_HEADER) { if (this.isSingleSelectMode_) { this.initSingleSelectDropdown_(); } else if (this.useCountrySelect_ && this.useLanguageSelect_) { this.initPanelWithSelect_(); } } this.initSelect_(this.element); } async initData_() { const promises = []; if (this.useCountrySelect_ || this.useModal_) { promises.push(this.getCountryList_(), this.getIpMatchingMarket_()); } if (this.useLanguageSelect_) { promises.push(this.getMarketLanguages_(this.global.market.market_id)); } return Promise.all(promises).then((results) => { const ipMatchingMarket = results.find((result) => result.hasOwnProperty('matching_station') ); const marketCountryList = results.find((result) => result.hasOwnProperty('data') ); if (ipMatchingMarket && marketCountryList) { this.ipMatchingMarket = ipMatchingMarket?.matching_station?.find?.( (item) => item.type === 'multiple_market' ) || { img: marketCountryList.length ? marketCountryList?.[0]?.detail && marketCountryList[0].detail?.flag : '', }; } }); } initModal_() { if ( this.isEditMode || !this.ipMatchingMarket?.market_id || !this.useModal_ || this.hasCookie_(COOKIE_TIPS_NAME) || this.win[MARKET_MODAL_LOADED] ) { return; } this.win[MARKET_MODAL_LOADED] = true; const redirectParam = new URLSearchParams(this.win.location.search).get( URL_REDIRECT ); if (redirectParam) { this.initModalEntry_(MARKET_GATEWAY_REDIRECT_MODAL); } else if ( this.ipMatchingMarket.market_id !== this.global?.market?.market_id ) { this.initModalEntry_(MARKET_MODAL); } } async init_() { await this.initSettings_(); await this.initData_(); this.initEntry_(); this.initModal_(); } getDefaultCountryValue_() { return this.getCookie_(MARKET_COUNTRY_COOKIE) || this.marketCountryList[0]?.country_code; } mapCountryRenderData_(country) { return { flag: country?.detail?.flag || '', value: country?.country_code, currency: country?.currency, currencySymbol: country?.symbol?.val || '', url: country?.url, }; } handleCountrySelectChange_(selectedData) { this.setCookie_(MARKET_COUNTRY_COOKIE, selectedData.value); this.handleChangeURL_(selectedData.url); } getDefaultLanguageValue_() { return this.marketLanguages?.find?.( (lang) => lang.code === this.global?.market?.market_lang )?.name; } mapLanguageRenderData_(language) { return { value: language.name, url: language.url, }; } handleLanguageSelectChange_(selectedData) { this.handleChangeURL_(selectedData.url); } renderTemplateElement_(parent, role, value) { const elements = SPZCore.Dom.scopedQuerySelectorAll( parent, `[role="${role}"]` ); elements.forEach((element) => { if (element && value) { element.innerHTML = value; } }); } renderTemplateImg_(parent, role, options) { const flagElement = SPZCore.Dom.scopedQuerySelector( parent, `[role="${role}"]` ); if (flagElement && options?.src && options?.height && options?.width) { const spzImg = self.document.createElement('ljs-img'); spzImg.setAttribute('src', options.src); spzImg.setAttribute('layout', 'responsive'); spzImg.setAttribute('width', options.width); spzImg.setAttribute('height', options.height); spzImg.setAttribute( 'style', `width: ${options.width}px; height: ${options.height}px;` ); flagElement.appendChild(spzImg); } } handleChangeURL_(url) { if (!!url) { let {origin, pathname, search} = this.win.location; pathname = pathname.replace(SITE, url != '/' ? url : ''); this.win.location.href = `${origin}${pathname}${search}`; } else { this.win.location.reload(true); } } initModalEntry_(role) { const marketModalTemplate = SPZCore.Dom.scopedQuerySelector( this.element, `[role="${role}"]` ); if (marketModalTemplate) { const tempParentNode = self.document.createElement('div'); const clonedTemplate = self.document.importNode( marketModalTemplate.content, true ); tempParentNode.appendChild(clonedTemplate); this.renderTemplateImg_(tempParentNode, MARKET_MODAL_FLAG, { src: this.ipMatchingMarket?.img, width: '80', height: '80', }); this.renderTemplateElement_( tempParentNode, MARKET_MODAL_COUNTRY_CODE, this.ipMatchingMarket?.name ); this.renderTemplateElement_( tempParentNode, MARKET_MODAL_CURRENCY_SYMBOL, this.ipMatchingMarket?.currency_with_symbol ); const lightbox = self.document.createElement('ljs-lightbox'); lightbox.setAttribute('layout', 'nodisplay'); lightbox.appendChild(tempParentNode.firstElementChild); self.document.body.appendChild(lightbox); SPZ.whenApiDefined(lightbox).then((apis) => { SPZCore.Dom.scopedQuerySelectorAll( lightbox, `[role="${MARKET_MODAL_CLOSE}"]` ).forEach((ele) => { ele.addEventListener('click', () => { this.setCookie_(COOKIE_TIPS_NAME, 1, COOKIE_TIPS_EXPIRES); apis.close(); }); }); const marketModalConfirmElement = SPZCore.Dom.scopedQuerySelector( lightbox, `[role="${MARKET_MODAL_CONFIRM}"]` ); if (marketModalConfirmElement && this.ipMatchingMarket?.url) { marketModalConfirmElement.addEventListener('click', () => { this.setCookie_(COOKIE_TIPS_NAME, 1, COOKIE_TIPS_EXPIRES); this.setCookie_(MARKET_COUNTRY_COOKIE, this.ipMatchingMarket?.name); this.handleChangeURL_(this.ipMatchingMarket?.url); }); } const marketModalReselectElement = SPZCore.Dom.scopedQuerySelector( lightbox, `[role="${MARKET_MODAL_RESELECT}"]` ); if (marketModalReselectElement) { marketModalReselectElement.addEventListener('click', () => { this.setCookie_(COOKIE_TIPS_NAME, 1, COOKIE_TIPS_EXPIRES); const marketReselectTemplate = SPZCore.Dom.scopedQuerySelector( this.element, `[role="${MARKET_RESELECT_MODAL}"]` ); if (marketReselectTemplate && lightbox.firstElementChild) { const clonedTemplate = self.document.importNode( marketReselectTemplate.content, true ); const selectParent = SPZCore.Dom.scopedQuerySelector( clonedTemplate, `[role="${MARKET_MODAL_RESELECT_COUNTRY_SELECT}"]` ); if (selectParent) { this.createSelect_({ parent: selectParent, defaultValue: this.getDefaultCountryValue_(), dataList: this.marketCountryList.map( this.mapCountryRenderData_ ), listElementWithTemplate: this.getListElementWithTemplate_( MARKET_COUNTRY_SELECT ), itemHandler: this.handleCountrySelectChange_.bind(this), }); } lightbox.replaceChild(clonedTemplate, lightbox.firstElementChild); SPZCore.Dom.scopedQuerySelectorAll( lightbox, `[role="${MARKET_MODAL_CLOSE}"]` ).forEach((ele) => { ele.addEventListener('click', () => { this.setCookie_(COOKIE_TIPS_NAME, 1, COOKIE_TIPS_EXPIRES); apis.close(); }); }); } }); } apis.open(); }); } } async getMarketThemeSettings_() { return this.xhr_.fetchJson(MARKET_THEME_SETTINGS).then((res) => { this.useCountrySelect_ = !!res.country_selector_enabled; this.useLanguageSelect_ = !!res.language_selector_enabled && this.global?.market?.market_id; this.useModal_ = !!res.redirect_pop_enabled; return res; }); } async getCountryList_() { return this.xhr_.fetchJson(MARKET_COUNTRIES).then((res) => { this.marketCountryList = res.data.length ? res.data : []; return res; }); } async getIpMatchingMarket_() { return this.xhr_.fetchJson(IP_MATCHING_MARKET, { method: 'POST', body: { stations: [], }, }); } async getMarketLanguages_(marketId) { return this.xhr_ .fetchJson(MARKET_LANGUAGES.replace(/:id/gim, marketId)) .then((res) => { this.marketLanguages = res?.languages?.length ? res.languages : []; return res; }); } hasCookie_(name) { const m = self.document.cookie .split(';') .filter((pair) => pair.trim().startsWith(name + '=')); return !!(m && m[0]); } getCookie_(name) { const m = self.document.cookie .split(';') .filter((pair) => pair.trim().startsWith(name + '=')); return m && m[0] ? m[0].split('=')[1] : null; } setCookie_(name, value, expires) { const expiresDate = new Date(Date.now() + expires).toGMTString(); self.document.cookie = `${name}=${encodeURIComponent( value )};expires=${expiresDate};path=/`; } } SPZ.defineElement('spz-custom-market', SpzCustomMarket);

Account

Log in
Create an account

Close

ALL CATEGORIES
- ALL CATEGORIES
- SHOP ALL TOPS
  - SHOP ALL TOPS
  - HOODIES & SWEATSHIRTS
  - SHORT SLEEVE SHIRTS
  - COTTON LINEN SHIRTS
  - SHORT SLEEVE TEES
  - LONG SLEEVE SHIRTS
  - POLO SHIRTS
  - SHIRTS WITH BREAST POCKET
- POLOS
  - POLOS
  - SHORT SLEEVE POLOS
  - LONG SLEEVE POLOS
- BOTTOMS
  - BOTTOMS
  - SHOP ALL BOTTOMS
  - SHORTS
  - PANTS
- ACCESSORIES🧣
  - ACCESSORIES🧣
  - SHOP ALL ACC
  - SUSPENDERS
  - SOCKS 🧦
  - CAP 🧢
BEST SELLER HOT
NEW
FALL & WINTER APPREAL ❄️
- FALL & WINTER APPREAL ❄️
- SHOP ALL
  - SHOP ALL
  - HOODIES & SWEATSHIRTS
  - LONG SLEEVE POLOS
  - LONG SLEEVE SHIRTS
  - COATS & JACKETS
  - LONG SLEEVE T-SHIRT
HOODIES & SWEATSHIRTS
SHORT SLEEVE SHIRTS
- SHORT SLEEVE SHIRTS
- BY CATEGORY
  - BY CATEGORY
  - SHOP ALL
  - SHIRTS WITH BREAST POCKET
  - TEES
  - POLOS
- BY STYLE
  - BY STYLE
  - HAWAIIAN SHIRTS 🌊
  - MUSICAL STYLE 🎸
  - FLAME🔥
  - SPACE SERIES☁️
  - SKULL STYLE☠️
  - SUMMER🏖️
  - COLORFUL🌈
  - COSTUME SHIRTS
  - CREATURE PRINT🐲
SALE⚡️
Log in
Create an account

const marketSlot = document.querySelector(".plugin_c_market"); if(marketSlot) { marketSlot.remove(); }

const SITE = (window.C_SETTINGS || window[atob('U0hPUExBWlpB')])?.routes?.root || ''; const MARKET_THEME_SETTINGS = `${SITE}/api/markets/theme_setting`; const MARKET_COUNTRIES = `${SITE}/api/markets/countries`; const IP_MATCHING_MARKET = `${SITE}/api/front/station`; const MARKET_LANGUAGES = `${SITE}/api/markets/:id/active_languages`; const URL_REDIRECT = '_market_redirected'; const COOKIE_TIPS_NAME = 'market_no_tips'; const COOKIE_TIPS_EXPIRES = 1000 * 60 * 60 * 24 * 14; const MARKET_COUNTRY_COOKIE = '_shoplazza_market_country'; const MARKET_MODAL_LOADED = '__market_modal_loaded__'; const PROPERTY_SELECTED = 'selected'; const MARKET_PC_HEADER_TRIGGER = 'market-pc-header-trigger'; const MARKET_PC_HEADER_COUNTRY_SELECT_TITLE = 'market-pc-header-country-select-title'; const MARKET_PC_HEADER_LANGUAGE_SELECT_TITLE = 'market-pc-header-language-select-title'; const MARKET_PC_HEADER_LANGUAGE_SELECT_SUB_TITLE = 'market-pc-header-language-select-sub-title'; const MARKET_PC_HEADER_COUNTRY_SELECT_SUB_TITLE = 'market-pc-header-country-select-sub-title'; const MARKET_FLAG = 'market-flag'; const MARKET_SELECT_VALUE = 'market-select-value'; const MARKET_CURRENCY = 'market-currency'; const MARKET_CURRENCY_SYMBOL = 'market-currency-symbol'; const MARKET_SELECT_ITEM = 'market-select-item'; const MARKET_SELECT_ITEM_ID = 'market-select-item-id'; const MARKET_SELECT_LIST = 'market-select-list'; const MARKET_LANGUAGE_SELECT = 'market-language-select'; const MARKET_COUNTRY_SELECT = 'market-country-select'; const MARKET_MODAL = 'market-modal'; const MARKET_GATEWAY_REDIRECT_MODAL = 'market-gateway-redirect-modal'; const MARKET_RESELECT_MODAL = 'market-reselect-modal'; const MARKET_MODAL_FLAG = 'market-modal-flag'; const MARKET_MODAL_COUNTRY_CODE = 'market-modal-country-code'; const MARKET_MODAL_CURRENCY_SYMBOL = 'market-modal-currency-symbol'; const MARKET_MODAL_CLOSE = 'market-modal-close'; const MARKET_MODAL_CONFIRM = 'market-modal-confirm'; const MARKET_MODAL_RESELECT = 'market-modal-reselect'; const MARKET_MODAL_RESELECT_COUNTRY_SELECT = 'market-modal-reselect-country-select'; const DATA_SECTION_TYPE = 'data-section-type'; const SECTION_TYPE_HEADER = 'header'; const SECTION_TYPE_FOOTER = 'footer'; class SpzCustomMarket extends SPZ.BaseElement { constructor(element) { super(element); this.global = null; this.useCountrySelect_ = false; this.useLanguageSelect_ = false; this.useModal_ = false; this.isSingleSelectMode_ = false; this.blockSectionPosition_ = ''; this.isEditMode = false; this.ipMatchingMarket = null; this.marketCountryList = []; this.marketLanguages = []; this.toast = null; } static deferredMount() { return false; } isLayoutSupported(layout) { return layout == SPZCore.Layout.LOGIC; } buildCallback() { console.debug('Geolocation'); this.xhr_ = SPZServices.xhrFor(this.win); const platform = SPZServices.platformFor(this.win); this.isIOS_ = platform.isIos(); this.action_ = SPZServices.actionServiceForDoc(this.element); this.global = this.win.C_SETTINGS || this.win[atob('U0hPUExBWlpB')]; this.isEditMode = new URLSearchParams(this.win.location.search).get('preview_theme_id') && new URLSearchParams(this.win.location.search).get('oseid'); this.init_(); } showToast_(content) { if (!this.toast) { this.toast = self.document.createElement('ljs-toast'); this.toast.setAttribute('layout', 'nodisplay'); this.toast.setAttribute('hidden', ''); this.toast.setAttribute('duration', '2000'); this.element.appendChild(this.toast); } SPZ.whenApiDefined(this.toast).then((apis) => { apis.showToast(content); }); } triggerEvent_(name, data) { const event = SPZUtils.Event.create(this.win, `${TAG}.${name}`, data); this.action_.trigger(this.element, name, event); } findBlockSectionPosition() { let current = this.element; while (current) { const dataSectionType = current.getAttribute(DATA_SECTION_TYPE); if ( dataSectionType === SECTION_TYPE_HEADER || dataSectionType === SECTION_TYPE_FOOTER ) { return dataSectionType; } current = current.parentElement; } return ''; } async initSettings_() { await this.getMarketThemeSettings_(); if (this.useCountrySelect_) { this.element.setAttribute('use-country-select', true); } if (this.useLanguageSelect_) { this.element.setAttribute('use-language-select', true); } if (this.useModal_) { this.element.setAttribute('use-modal', true); } if ( (this.useCountrySelect_ && !this.useLanguageSelect_) || (!this.useCountrySelect_ && this.useLanguageSelect_) ) { this.isSingleSelectMode_ = true; } this.blockSectionPosition_ = this.findBlockSectionPosition(); this.isPCLayout_ = this.win.matchMedia('(min-width: 960px)').matches; } renderMarketSelectTemplateNode_(clonedTemplate, data) { this.renderTemplateImg_(clonedTemplate, MARKET_FLAG, { src: data?.flag, width: '24', height: '24', }); this.renderTemplateElement_( clonedTemplate, MARKET_SELECT_VALUE, data.value ); this.renderTemplateElement_( clonedTemplate, MARKET_CURRENCY, data?.currency ); this.renderTemplateElement_( clonedTemplate, MARKET_CURRENCY_SYMBOL, data?.currencySymbol ); } bindDropdownOpenClickEvent_(triggerElement, dropdown) { if (!triggerElement) return; const triggerOpen = () => { SPZ.whenApiDefined(dropdown).then((apis) => { if (!dropdown.hasAttribute('open')) { apis.open(triggerElement); } }); }; if (this.isIOS_) { triggerElement.addEventListener('touchstart', triggerOpen); } else { triggerElement.addEventListener('click', triggerOpen); } } createDropdown_() { const dropdown = self.document.createElement('ljs-dropdown'); dropdown.setAttribute('layout', 'nodisplay'); if (this.blockSectionPosition_ === 'header') { dropdown.setAttribute('overlay-style', 'top: 4px;'); dropdown.setAttribute('placement', 'bottomRight'); } else if (this.blockSectionPosition_ === 'footer') { dropdown.setAttribute('overlay-style', 'top: -4px;'); dropdown.setAttribute('placement', 'top'); } return dropdown; } createDropdownIcon_() { const svgElement = document.createElementNS("http://www.w3.org/2000/svg", "svg"); svgElement.setAttribute("class", "market-rotate-180"); svgElement.setAttribute("width", "16"); svgElement.setAttribute("height", "16"); const path1 = document.createElementNS("http://www.w3.org/2000/svg", "path"); path1.setAttribute("d", "M7.47 5.172a.75.75 0 0 1 1.06 0l4.596 4.596a.75.75 0 1 1-1.06 1.06L7.468 6.232a.75.75 0 0 1 0-1.06Z"); path1.setAttribute("fill", "currentColor"); const path2 = document.createElementNS("http://www.w3.org/2000/svg", "path"); path2.setAttribute("d", "M8.533 5.172a.75.75 0 0 1 0 1.06l-4.596 4.596a.75.75 0 1 1-1.061-1.06l4.596-4.596a.75.75 0 0 1 1.06 0Z"); path2.setAttribute("fill", "currentColor"); svgElement.appendChild(path1); svgElement.appendChild(path2); return svgElement; } renderDropdownListWithClickEvent_({ triggerElement, dataList, subTitleRole, listElementWithTemplate, defaultValue, itemHandler, shouldUpdateSelectedItem = false, }) { const dropdown = this.createDropdown_(); const itemTemplate = SPZCore.Dom.scopedQuerySelector( listElementWithTemplate, 'template' ); const clonedItemTemplate = itemTemplate.cloneNode(true); const fragment = self.document.createDocumentFragment(); dataList.forEach((data) => { const tempParentNode = self.document.createElement('div'); const clonedTemplate = self.document.importNode( clonedItemTemplate.content, true ); tempParentNode.appendChild(clonedTemplate); tempParentNode.firstElementChild.classList.add( 'market-select-item' ); this.renderMarketSelectTemplateNode_(tempParentNode, data); const selectItemElement = SPZCore.Dom.scopedQuerySelector( tempParentNode, `[role="${MARKET_SELECT_ITEM}"]` ); if (!selectItemElement) { return; } if (defaultValue === data.value) { if (shouldUpdateSelectedItem) { const clonedSelectItemElement = selectItemElement.cloneNode(true); triggerElement.replaceChild( clonedSelectItemElement, triggerElement.firstElementChild ); } selectItemElement.setAttribute(PROPERTY_SELECTED, ''); } selectItemElement.setAttribute(MARKET_SELECT_ITEM_ID, data.value); fragment.appendChild(tempParentNode.firstElementChild); }); let value = defaultValue; listElementWithTemplate.addEventListener( 'click', (e) => { if (this.isEditMode) { this.showToast_('编辑器下不支持切换国家'); SPZ.whenApiDefined(dropdown).then((apis) => { apis.close(); }); return; } let targetElement = e.target; while (targetElement) { if ( !targetElement || targetElement.getAttribute(MARKET_SELECT_ITEM_ID) ) { break; } targetElement = targetElement.parentNode; } if ( !targetElement || !targetElement.hasAttribute(MARKET_SELECT_ITEM_ID) ) { return; } const selectValue = targetElement.getAttribute(MARKET_SELECT_ITEM_ID); if (value === selectValue) { SPZ.whenApiDefined(dropdown).then((apis) => { apis.close(); }); return; } const selectedData = dataList.find((c) => c.value === selectValue); if (shouldUpdateSelectedItem) { const tempParentNode = self.document.createElement('div'); const clonedTemplate = self.document.importNode( clonedItemTemplate.content, true ); tempParentNode.appendChild(clonedTemplate); this.renderMarketSelectTemplateNode_(tempParentNode, selectedData); tempParentNode.firstElementChild.classList.add( 'market-select-item' ); triggerElement.replaceChild( tempParentNode.firstElementChild, triggerElement.firstElementChild ); } value = selectValue; itemHandler?.(selectedData); SPZ.whenApiDefined(dropdown).then((apis) => { apis.close(); }); }, false ); listElementWithTemplate.removeChild(itemTemplate); listElementWithTemplate.appendChild(fragment); listElementWithTemplate.classList.add('market-select-list'); dropdown.appendChild(listElementWithTemplate); if (subTitleRole) { this.renderSelectTitle_(dropdown, subTitleRole); } return dropdown; } createSelect_({ parent, defaultValue, dataList, listElementWithTemplate, itemHandler, titleRole, }) { const triggerElement = self.document.createElement('div'); triggerElement.classList.add('market-select'); const displayElement = self.document.createElement('div'); triggerElement.appendChild(displayElement); triggerElement.appendChild(this.createDropdownIcon_()); const dropdown = this.renderDropdownListWithClickEvent_({ triggerElement, dataList, listElementWithTemplate, defaultValue, itemHandler, shouldUpdateSelectedItem: true, }); this.bindDropdownOpenClickEvent_(triggerElement, dropdown); const dropdownContainer = self.document.createElement('div'); dropdownContainer.appendChild(triggerElement); dropdownContainer.appendChild(dropdown); dropdownContainer.classList.add('market-select-container'); this.renderSelectTitle_(dropdownContainer, titleRole); parent.appendChild(dropdownContainer); } getListElementWithTemplate_(role) { const template = SPZCore.Dom.scopedQuerySelector( this.element, `[role="${role}"]` ); if (template) { const clonedTemplate = template.cloneNode(true); const tempParent = self.document.createElement("div"); tempParent.appendChild(clonedTemplate.content); const listElementWithTemplate = SPZCore.Dom.scopedQuerySelector( tempParent, `[role="${MARKET_SELECT_LIST}"]` ); return listElementWithTemplate; } return null; } renderSelectTitle_(parent, role) { if (!parent || !role) { return; } const template = SPZCore.Dom.scopedQuerySelector( this.element, `[role="${role}"]` ); const content = self.document.importNode(template.content, true); parent.insertBefore(content, parent.firstElementChild); parent.firstElementChild.classList.add( role.includes('sub') ? 'market-pc-header-select-sub-title' : 'market-pc-header-select-title' ); } initSelect_(rootNode, options) { const parent = rootNode || this.element; if (this.useCountrySelect_) { this.createSelect_({ parent, titleRole: options?.shouldRenderSelectTitle ? MARKET_PC_HEADER_COUNTRY_SELECT_TITLE : undefined, defaultValue: this.getDefaultCountryValue_(), dataList: this.marketCountryList.map(this.mapCountryRenderData_), listElementWithTemplate: this.getListElementWithTemplate_( MARKET_COUNTRY_SELECT ), itemHandler: this.handleCountrySelectChange_.bind(this), }); } if (this.useLanguageSelect_) { this.createSelect_({ parent, titleRole: options?.shouldRenderSelectTitle ? MARKET_PC_HEADER_LANGUAGE_SELECT_TITLE : undefined, defaultValue: this.getDefaultLanguageValue_(), dataList: this.marketLanguages.map(this.mapLanguageRenderData_), listElementWithTemplate: this.getListElementWithTemplate_( MARKET_LANGUAGE_SELECT ), itemHandler: this.handleLanguageSelectChange_.bind(this), }); } } initPcHeaderTriggerElement() { const headerTriggerElementTemplate = SPZCore.Dom.scopedQuerySelector( this.element, `[role="${MARKET_PC_HEADER_TRIGGER}"]` ); const headerTriggerElement = self.document.importNode( headerTriggerElementTemplate.content, true ); const parentDivElement = self.document.createElement('div'); parentDivElement.setAttribute('role', MARKET_PC_HEADER_TRIGGER); parentDivElement.appendChild(headerTriggerElement); this.element.removeChild(headerTriggerElementTemplate); return parentDivElement; } initPanelWithSelect_() { const triggerElement = this.initPcHeaderTriggerElement(); const dropdown = this.createDropdown_(); const panelElement = self.document.createElement('div'); panelElement.classList.add('market-panel'); this.initSelect_(panelElement, {shouldRenderSelectTitle: true}); dropdown.appendChild(panelElement); this.bindDropdownOpenClickEvent_(triggerElement, dropdown); this.element.appendChild(triggerElement); this.element.insertBefore(dropdown, triggerElement); } initSingleSelectDropdown_() { const triggerElement = this.initPcHeaderTriggerElement(); let dropdown; if (this.useCountrySelect_) { dropdown = this.renderDropdownListWithClickEvent_({ triggerElement, subTitleRole: MARKET_PC_HEADER_COUNTRY_SELECT_SUB_TITLE, dataList: this.marketCountryList.map(this.mapCountryRenderData_), listElementWithTemplate: this.getListElementWithTemplate_( MARKET_COUNTRY_SELECT ), defaultValue: this.getDefaultCountryValue_(), itemHandler: this.handleCountrySelectChange_.bind(this), }); } else if (this.useLanguageSelect_) { dropdown = this.renderDropdownListWithClickEvent_({ triggerElement, subTitleRole: MARKET_PC_HEADER_LANGUAGE_SELECT_SUB_TITLE, dataList: this.marketLanguages.map(this.mapLanguageRenderData_), listElementWithTemplate: this.getListElementWithTemplate_( MARKET_LANGUAGE_SELECT ), defaultValue: this.getDefaultLanguageValue_(), itemHandler: this.handleLanguageSelectChange_.bind(this), }); } if (dropdown) { this.bindDropdownOpenClickEvent_(triggerElement, dropdown); this.element.appendChild(triggerElement); this.element.appendChild(dropdown); } } initEntry_() { if (this.blockSectionPosition_ === SECTION_TYPE_HEADER) { if (this.isSingleSelectMode_) { this.initSingleSelectDropdown_(); } else if (this.useCountrySelect_ && this.useLanguageSelect_) { this.initPanelWithSelect_(); } } this.initSelect_(this.element); } async initData_() { const promises = []; if (this.useCountrySelect_ || this.useModal_) { promises.push(this.getCountryList_(), this.getIpMatchingMarket_()); } if (this.useLanguageSelect_) { promises.push(this.getMarketLanguages_(this.global.market.market_id)); } return Promise.all(promises).then((results) => { const ipMatchingMarket = results.find((result) => result.hasOwnProperty('matching_station') ); const marketCountryList = results.find((result) => result.hasOwnProperty('data') ); if (ipMatchingMarket && marketCountryList) { this.ipMatchingMarket = ipMatchingMarket?.matching_station?.find?.( (item) => item.type === 'multiple_market' ) || { img: marketCountryList.length ? marketCountryList?.[0]?.detail && marketCountryList[0].detail?.flag : '', }; } }); } initModal_() { if ( this.isEditMode || !this.ipMatchingMarket?.market_id || !this.useModal_ || this.hasCookie_(COOKIE_TIPS_NAME) || this.win[MARKET_MODAL_LOADED] ) { return; } this.win[MARKET_MODAL_LOADED] = true; const redirectParam = new URLSearchParams(this.win.location.search).get( URL_REDIRECT ); if (redirectParam) { this.initModalEntry_(MARKET_GATEWAY_REDIRECT_MODAL); } else if ( this.ipMatchingMarket.market_id !== this.global?.market?.market_id ) { this.initModalEntry_(MARKET_MODAL); } } async init_() { await this.initSettings_(); await this.initData_(); this.initEntry_(); this.initModal_(); } getDefaultCountryValue_() { return this.getCookie_(MARKET_COUNTRY_COOKIE) || this.marketCountryList[0]?.country_code; } mapCountryRenderData_(country) { return { flag: country?.detail?.flag || '', value: country?.country_code, currency: country?.currency, currencySymbol: country?.symbol?.val || '', url: country?.url, }; } handleCountrySelectChange_(selectedData) { this.setCookie_(MARKET_COUNTRY_COOKIE, selectedData.value); this.handleChangeURL_(selectedData.url); } getDefaultLanguageValue_() { return this.marketLanguages?.find?.( (lang) => lang.code === this.global?.market?.market_lang )?.name; } mapLanguageRenderData_(language) { return { value: language.name, url: language.url, }; } handleLanguageSelectChange_(selectedData) { this.handleChangeURL_(selectedData.url); } renderTemplateElement_(parent, role, value) { const elements = SPZCore.Dom.scopedQuerySelectorAll( parent, `[role="${role}"]` ); elements.forEach((element) => { if (element && value) { element.innerHTML = value; } }); } renderTemplateImg_(parent, role, options) { const flagElement = SPZCore.Dom.scopedQuerySelector( parent, `[role="${role}"]` ); if (flagElement && options?.src && options?.height && options?.width) { const spzImg = self.document.createElement('ljs-img'); spzImg.setAttribute('src', options.src); spzImg.setAttribute('layout', 'responsive'); spzImg.setAttribute('width', options.width); spzImg.setAttribute('height', options.height); spzImg.setAttribute( 'style', `width: ${options.width}px; height: ${options.height}px;` ); flagElement.appendChild(spzImg); } } handleChangeURL_(url) { if (!!url) { let {origin, pathname, search} = this.win.location; pathname = pathname.replace(SITE, url != '/' ? url : ''); this.win.location.href = `${origin}${pathname}${search}`; } else { this.win.location.reload(true); } } initModalEntry_(role) { const marketModalTemplate = SPZCore.Dom.scopedQuerySelector( this.element, `[role="${role}"]` ); if (marketModalTemplate) { const tempParentNode = self.document.createElement('div'); const clonedTemplate = self.document.importNode( marketModalTemplate.content, true ); tempParentNode.appendChild(clonedTemplate); this.renderTemplateImg_(tempParentNode, MARKET_MODAL_FLAG, { src: this.ipMatchingMarket?.img, width: '80', height: '80', }); this.renderTemplateElement_( tempParentNode, MARKET_MODAL_COUNTRY_CODE, this.ipMatchingMarket?.name ); this.renderTemplateElement_( tempParentNode, MARKET_MODAL_CURRENCY_SYMBOL, this.ipMatchingMarket?.currency_with_symbol ); const lightbox = self.document.createElement('ljs-lightbox'); lightbox.setAttribute('layout', 'nodisplay'); lightbox.appendChild(tempParentNode.firstElementChild); self.document.body.appendChild(lightbox); SPZ.whenApiDefined(lightbox).then((apis) => { SPZCore.Dom.scopedQuerySelectorAll( lightbox, `[role="${MARKET_MODAL_CLOSE}"]` ).forEach((ele) => { ele.addEventListener('click', () => { this.setCookie_(COOKIE_TIPS_NAME, 1, COOKIE_TIPS_EXPIRES); apis.close(); }); }); const marketModalConfirmElement = SPZCore.Dom.scopedQuerySelector( lightbox, `[role="${MARKET_MODAL_CONFIRM}"]` ); if (marketModalConfirmElement && this.ipMatchingMarket?.url) { marketModalConfirmElement.addEventListener('click', () => { this.setCookie_(COOKIE_TIPS_NAME, 1, COOKIE_TIPS_EXPIRES); this.setCookie_(MARKET_COUNTRY_COOKIE, this.ipMatchingMarket?.name); this.handleChangeURL_(this.ipMatchingMarket?.url); }); } const marketModalReselectElement = SPZCore.Dom.scopedQuerySelector( lightbox, `[role="${MARKET_MODAL_RESELECT}"]` ); if (marketModalReselectElement) { marketModalReselectElement.addEventListener('click', () => { this.setCookie_(COOKIE_TIPS_NAME, 1, COOKIE_TIPS_EXPIRES); const marketReselectTemplate = SPZCore.Dom.scopedQuerySelector( this.element, `[role="${MARKET_RESELECT_MODAL}"]` ); if (marketReselectTemplate && lightbox.firstElementChild) { const clonedTemplate = self.document.importNode( marketReselectTemplate.content, true ); const selectParent = SPZCore.Dom.scopedQuerySelector( clonedTemplate, `[role="${MARKET_MODAL_RESELECT_COUNTRY_SELECT}"]` ); if (selectParent) { this.createSelect_({ parent: selectParent, defaultValue: this.getDefaultCountryValue_(), dataList: this.marketCountryList.map( this.mapCountryRenderData_ ), listElementWithTemplate: this.getListElementWithTemplate_( MARKET_COUNTRY_SELECT ), itemHandler: this.handleCountrySelectChange_.bind(this), }); } lightbox.replaceChild(clonedTemplate, lightbox.firstElementChild); SPZCore.Dom.scopedQuerySelectorAll( lightbox, `[role="${MARKET_MODAL_CLOSE}"]` ).forEach((ele) => { ele.addEventListener('click', () => { this.setCookie_(COOKIE_TIPS_NAME, 1, COOKIE_TIPS_EXPIRES); apis.close(); }); }); } }); } apis.open(); }); } } async getMarketThemeSettings_() { return this.xhr_.fetchJson(MARKET_THEME_SETTINGS).then((res) => { this.useCountrySelect_ = !!res.country_selector_enabled; this.useLanguageSelect_ = !!res.language_selector_enabled && this.global?.market?.market_id; this.useModal_ = !!res.redirect_pop_enabled; return res; }); } async getCountryList_() { return this.xhr_.fetchJson(MARKET_COUNTRIES).then((res) => { this.marketCountryList = res.data.length ? res.data : []; return res; }); } async getIpMatchingMarket_() { return this.xhr_.fetchJson(IP_MATCHING_MARKET, { method: 'POST', body: { stations: [], }, }); } async getMarketLanguages_(marketId) { return this.xhr_ .fetchJson(MARKET_LANGUAGES.replace(/:id/gim, marketId)) .then((res) => { this.marketLanguages = res?.languages?.length ? res.languages : []; return res; }); } hasCookie_(name) { const m = self.document.cookie .split(';') .filter((pair) => pair.trim().startsWith(name + '=')); return !!(m && m[0]); } getCookie_(name) { const m = self.document.cookie .split(';') .filter((pair) => pair.trim().startsWith(name + '=')); return m && m[0] ? m[0].split('=')[1] : null; } setCookie_(name, value, expires) { const expiresDate = new Date(Date.now() + expires).toGMTString(); self.document.cookie = `${name}=${encodeURIComponent( value )};expires=${expiresDate};path=/`; } } SPZ.defineElement('spz-custom-market', SpzCustomMarket);

ALL CATEGORIES
BEST SELLER
HOT
NEW
FALL & WINTER APPREAL ❄️
- SHOP ALL HOODIES & SWEATSHIRTS LONG SLEEVE POLOS LONG SLEEVE SHIRTS COATS & JACKETS LONG SLEEVE T-SHIRT
HOODIES & SWEATSHIRTS
SHORT SLEEVE SHIRTS
- BY CATEGORY SHOP ALL SHIRTS WITH BREAST POCKET TEES POLOS
- BY STYLE HAWAIIAN SHIRTS 🌊 MUSICAL STYLE 🎸 FLAME🔥 SPACE SERIES☁️ SKULL STYLE☠️ SUMMER🏖️ COLORFUL🌈 COSTUME SHIRTS CREATURE PRINT🐲
SALE⚡️
More links

New arrivals

Filter

Clear all

size

2xl (2378)
3xl (2499)
4xl (2269)
4xlt (807)
5xl (1805)
5xlt (814)
6xl (608)
6xlt (79)
l (2529)
m (2147)
one size (39)
s (1721)
xl (2506)
xs (863)
xxl (116)

2775 Products

2775 Products

Filter and sort

size

Sort by

size

2xl (2378)
3xl (2499)
4xl (2269)
4xlt (807)
5xl (1805)
5xlt (814)
6xl (608)
6xlt (79)
l (2529)
m (2147)
one size (39)
s (1721)
xl (2506)
xs (863)
xxl (116)

Clear all

White Chinese Dragon And Phoenix Printing Men's Long Sleeve Shirt BestDVibe

White Chinese Dragon And Phoenix Printing Men's Long Sleeve Shirt BestDVibe

White Chinese Dragon And Phoenix Printing Men's Long Sleeve Shirt

$18.95

HOO®Christmas Elements Cute Santa Claus Decorating The Christmas Tree Printing Men's Short Sleeve Shirt BestDVibe

HOO®Christmas Elements Cute Santa Claus Decorating The Christmas Tree Printing Men's Short Sleeve Shirt BestDVibe

HOO®Christmas Elements Cute Santa Claus Decorating The Christmas Tree Printing Men's Short Sleeve Shirt

$12.95

HOO® Blue Vantage Hawaii Tropical View Printing Short Sleeve Shirt BestDVibe

HOO® Blue Vantage Hawaii Tropical View Printing Short Sleeve Shirt BestDVibe

HOO® Blue Vantage Hawaii Tropical View Printing Short Sleeve Shirt

$15.95 $32.00

-50%

HOO® The Magic Garden Printing Sleeveless Camisole Dress BestDVibe

HOO® The Magic Garden Printing Sleeveless Camisole Dress BestDVibe

HOO® The Magic Garden Printing Sleeveless Camisole Dress

$19.95

HOO® Vintage Red And Black Matching Poker Cards Printing Short Sleeve Shirt BestDVibe

HOO® Vintage Red And Black Matching Poker Cards Printing Short Sleeve Shirt BestDVibe

HOO® Vintage Red And Black Matching Poker Cards Printing Short Sleeve Shirt

From $16.95 $32.00

-47%

HOO® Cute Pet Dog Party Printing Short Sleeve Shirt BestDVibe

HOO® Cute Pet Dog Party Printing Short Sleeve Shirt BestDVibe

HOO® Cute Pet Dog Party Printing Short Sleeve Shirt

From $17.95

HOO® Simple Line and Blue Block Printing Men's Short Sleeve Shirt BestDVibe

HOO® Simple Line and Blue Block Printing Men's Short Sleeve Shirt BestDVibe

HOO® Simple Line and Blue Block Printing Men's Short Sleeve Shirt

$9.95 $32.00

-69%

HOO® Tribal Pattern Stripe Printing Men's Short Sleeve Shirt BestDVibe

HOO® Tribal Pattern Stripe Printing Men's Short Sleeve Shirt BestDVibe

HOO® Tribal Pattern Stripe Printing Men's Short Sleeve Shirt

$9.95 $34.00

-69%

HOO® 50s LightSkyBlue & Navy Stitching Men's Short Sleeve Shirt BestDVibe

HOO® 50s LightSkyBlue & Navy Stitching Men's Short Sleeve Shirt BestDVibe

HOO® 50s LightSkyBlue & Navy Stitching Men's Short Sleeve Shirt

$9.95 $34.00

-71%

HOO® Full-Print Cute Teddy Bear Doll Printing Short Sleeve Shirt BestDVibe

HOO® Full-Print Cute Teddy Bear Doll Printing Short Sleeve Shirt BestDVibe

HOO® Full-Print Cute Teddy Bear Doll Printing Short Sleeve Shirt

$15.95

HOO® Mardi Gras Carnival Lilies And Flag Printing Short Sleeve Shirt BestDVibe

HOO® Mardi Gras Carnival Lilies And Flag Printing Short Sleeve Shirt BestDVibe

HOO® Mardi Gras Carnival Lilies And Flag Printing Short Sleeve Shirt

From $15.95

Vintage White Stripe Turndown Collar Men's Long Sleeve Shirt BestDVibe

Vintage White Stripe Turndown Collar Men's Long Sleeve Shirt BestDVibe

Vintage White Stripe Turndown Collar Men's Long Sleeve Shirt

$19.95

HOO® Vintage Gradient Cyan Stitching Simple Line Totem Printing Short Sleeve Shirt BestDVibe

HOO® Vintage Gradient Cyan Stitching Simple Line Totem Printing Short Sleeve Shirt BestDVibe

HOO® Vintage Gradient Cyan Stitching Simple Line Totem Printing Short Sleeve Shirt

$16.95

HOO® Halloween Pumpkin Farm And Scarecrow Boy Printing Short Sleeve Shirt BestDVibe

HOO® Halloween Pumpkin Farm And Scarecrow Boy Printing Short Sleeve Shirt BestDVibe

HOO® Halloween Pumpkin Farm And Scarecrow Boy Printing Short Sleeve Shirt

$19.95 $32.00

-38%

HOO® Eye-Catching Psychedelic Hippie Rainbow Flying Birds Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

HOO® Eye-Catching Psychedelic Hippie Rainbow Flying Birds Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

HOO® Eye-Catching Psychedelic Hippie Rainbow Flying Birds Printing Cuban Collar Hawaiian Short Sleeve Shirt

$15.95 $33.00

-52%

HOO® Green Vacation Sparkling Water Mug Beach Hawaiian Short Sleeve Shirt BestDVibe

HOO® Green Vacation Sparkling Water Mug Beach Hawaiian Short Sleeve Shirt BestDVibe

HOO® Green Vacation Sparkling Water Mug Beach Hawaiian Short Sleeve Shirt

$18.95 $32.00

-41%

Vintage White And Black Stitching Coconut Tree Gradients Casual Short Sleeve Shirt BestDVibe

Vintage White And Black Stitching Coconut Tree Gradients Casual Short Sleeve Shirt BestDVibe

Vintage White And Black Stitching Coconut Tree Gradients Casual Short Sleeve Shirt

$15.95 $34.00

-50%

HOO® Carnival Black Domino And Feather Printing Cuban Collar Short Sleeve Shirt BestDVibe

HOO® Carnival Black Domino And Feather Printing Cuban Collar Short Sleeve Shirt BestDVibe

HOO® Carnival Black Domino And Feather Printing Cuban Collar Short Sleeve Shirt

$12.95

HOO® Purple Floral Fantasia Painted Iris Printing Short Sleeve Shirt BestDVibe

HOO® Purple Floral Fantasia Painted Iris Printing Short Sleeve Shirt BestDVibe

HOO® Purple Floral Fantasia Painted Iris Printing Short Sleeve Shirt

$19.95 $34.00

-41%

Dark Street High-Tech Robots Printing Short Sleeve Shirt BestDVibe

Dark Street High-Tech Robots Printing Short Sleeve Shirt BestDVibe

Dark Street High-Tech Robots Printing Short Sleeve Shirt

$15.95 $34.00

-53%

HOO® Ukiyo-E Giant Sea Animals Abstract Mountains And Seas Painting Printing Sleeveless Camisole Dress BestDVibe

HOO® Ukiyo-E Giant Sea Animals Abstract Mountains And Seas Painting Printing Sleeveless Camisole Dress BestDVibe

HOO® Ukiyo-E Giant Sea Animals Abstract Mountains And Seas Painting Printing Sleeveless Camisole Dress

$19.95 $41.90

-52%

HOO® Eye-Catching Underwater World Marine Life Dolphins And Tropical Fish Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

HOO® Eye-Catching Underwater World Marine Life Dolphins And Tropical Fish Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

HOO® Eye-Catching Underwater World Marine Life Dolphins And Tropical Fish Printing Cuban Collar Hawaiian Short Sleeve Shirt

$16.95

HOO® Vintage Abstract Bright Yellow Devil Skull Tattoos Printing Short Sleeve Shirt BestDVibe

HOO® Vintage Abstract Bright Yellow Devil Skull Tattoos Printing Short Sleeve Shirt BestDVibe

HOO® Vintage Abstract Bright Yellow Devil Skull Tattoos Printing Short Sleeve Shirt

$18.95

HOO® Brown Cartoon Space War Robots Printing Short Sleeve Shirt BestDVibe

HOO® Brown Cartoon Space War Robots Printing Short Sleeve Shirt BestDVibe

HOO® Brown Cartoon Space War Robots Printing Short Sleeve Shirt

$12.95

HOO® Football Fans Printing Men's Short Sleeve Shirt BestDVibe

HOO® Football Fans Printing Men's Short Sleeve Shirt BestDVibe

HOO® Football Fans Printing Men's Short Sleeve Shirt

$9.95 $32.00

-69%

HOO® HOO Sailing at Sunset Printing Hawaiian Men's Short Sleeve Shirt BestDVibe

HOO® HOO Sailing at Sunset Printing Hawaiian Men's Short Sleeve Shirt BestDVibe

HOO® HOO Sailing at Sunset Printing Hawaiian Men's Short Sleeve Shirt

$11.95 $34.00

-65%

HOO® Rockabilly style Vintage DarkPurple & White Stitching Rock Musician Printing Men's Short Sleeve Shirt BestDVibe

HOO® Rockabilly style Vintage DarkPurple & White Stitching Rock Musician Printing Men's Short Sleeve Shirt BestDVibe

HOO® Rockabilly style Vintage DarkPurple & White Stitching Rock Musician Printing Men's Short Sleeve Shirt

$16.95 $34.00

-50%

HOO® Black And White Line Satellite Technology Machine Printing Short Sleeve Shirt BestDVibe

HOO® Black And White Line Satellite Technology Machine Printing Short Sleeve Shirt BestDVibe

HOO® Black And White Line Satellite Technology Machine Printing Short Sleeve Shirt

$15.95

Simple Geometric Monogram Printing Men's Short Sleeve Shirt BestDVibe

Simple Geometric Monogram Printing Men's Short Sleeve Shirt BestDVibe

Simple Geometric Monogram Printing Men's Short Sleeve Shirt

$12.95 $32.00

-60%

HOO® Tiger In The Jungle Exotic Tropical Printing Hawaiian Short Sleeve Shirt BestDVibe

HOO® Tiger In The Jungle Exotic Tropical Printing Hawaiian Short Sleeve Shirt BestDVibe

HOO® Tiger In The Jungle Exotic Tropical Printing Hawaiian Short Sleeve Shirt

$15.95

HOO® Eye-Catching Sci-Fi Space Travel Fantasy Starship And Planet Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

HOO® Eye-Catching Sci-Fi Space Travel Fantasy Starship And Planet Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

HOO® Eye-Catching Sci-Fi Space Travel Fantasy Starship And Planet Printing Cuban Collar Hawaiian Short Sleeve Shirt

$17.95

HOO® Eye-Catching Blue Natural Shark And Mermaid Print Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

HOO® Eye-Catching Blue Natural Shark And Mermaid Print Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

HOO® Eye-Catching Blue Natural Shark And Mermaid Print Cuban Collar Hawaiian Short Sleeve Shirt

$18.95 $33.00

-43%

HOO® Abstract Beach View Men's Short Sleeve Shirt BestDVibe

HOO® Abstract Beach View Men's Short Sleeve Shirt BestDVibe

HOO® Abstract Beach View Men's Short Sleeve Shirt

$9.95 $32.00

-69%

HOO®Green And Black Stitching St Patrick’s Day Shamrock Printing Breast Pocket Men's Long Sleeve Shirt BestDVibe

HOO®Green And Black Stitching St Patrick’s Day Shamrock Printing Breast Pocket Men's Long Sleeve Shirt BestDVibe

HOO®Green And Black Stitching St Patrick’s Day Shamrock Printing Breast Pocket Men's Long Sleeve Shirt

$12.95

HOO® Tropical Hawaiian Intense Sunset And Ostrich Printing Short Sleeve Shirt BestDVibe

HOO® Tropical Hawaiian Intense Sunset And Ostrich Printing Short Sleeve Shirt BestDVibe

HOO® Tropical Hawaiian Intense Sunset And Ostrich Printing Short Sleeve Shirt

$15.95

HOO® Gradient Abstract Starry Button Men‘s Long Sleeve Polo BestDVibe

HOO® Gradient Abstract Starry Button Men‘s Long Sleeve Polo BestDVibe

HOO® Gradient Abstract Starry Button Men‘s Long Sleeve Polo

$20.95

HOO® Retro Vacation Ethnic Gradient Floral Printing Sleeveless Camisole Dress BestDVibe

HOO® Retro Vacation Ethnic Gradient Floral Printing Sleeveless Camisole Dress BestDVibe

HOO® Retro Vacation Ethnic Gradient Floral Printing Sleeveless Camisole Dress

$19.95

HOO® The Three Ostrich Brothers And Orange Sunshine Printing Short Sleeve Shirt BestDVibe

HOO® The Three Ostrich Brothers And Orange Sunshine Printing Short Sleeve Shirt BestDVibe

HOO® The Three Ostrich Brothers And Orange Sunshine Printing Short Sleeve Shirt

$18.95 $32.00

-41%

HOO® Summer Christmas Santa Claus and Dragon, Rocket, Angel Wings Printing Men's Short Sleeve Shirt BestDVibe

HOO® Summer Christmas Santa Claus and Dragon, Rocket, Angel Wings Printing Men's Short Sleeve Shirt BestDVibe

HOO® Summer Christmas Santa Claus and Dragon, Rocket, Angel Wings Printing Men's Short Sleeve Shirt

From $18.95 $32.00

-41%

HOO® Abstract Colorful Psychedelic Colorful Illustrations Hippie Music Print Short Sleeve Shirt BestDVibe

HOO® Abstract Colorful Psychedelic Colorful Illustrations Hippie Music Print Short Sleeve Shirt BestDVibe

HOO® Abstract Colorful Psychedelic Colorful Illustrations Hippie Music Print Short Sleeve Shirt

$17.95 $32.00

-44%

HOO® Mountaineering Printing Men's Short Sleeve Shirt BestDVibe

HOO® Mountaineering Printing Men's Short Sleeve Shirt BestDVibe

HOO® Mountaineering Printing Men's Short Sleeve Shirt

$9.95 $34.00

-69%

HOO® Vintage Black And Brown Stripe And Vintage Jeep Printing Breast Pocket Short Sleeve Shirt BestDVibe

HOO® Vintage Black And Brown Stripe And Vintage Jeep Printing Breast Pocket Short Sleeve Shirt BestDVibe

HOO® Vintage Black And Brown Stripe And Vintage Jeep Printing Breast Pocket Short Sleeve Shirt

$16.95

HOO® Eye-Catching Stunning Style Flame Metallic Skull Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

HOO® Eye-Catching Stunning Style Flame Metallic Skull Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

HOO® Eye-Catching Stunning Style Flame Metallic Skull Printing Cuban Collar Hawaiian Short Sleeve Shirt

From $17.95

HOO® Vintage Black And White Stitching Black Acoustic Guitar Printing Men's Short Sleeve Shirt BestDVibe

HOO® Vintage Black And White Stitching Black Acoustic Guitar Printing Men's Short Sleeve Shirt BestDVibe

HOO® Vintage Black And White Stitching Black Acoustic Guitar Printing Men's Short Sleeve Shirt

$19.95 $34.00

-41%

HOO® Graffiti 22 Printed Turndown Collar Button Down Men's Short Sleeve Shirt BestDVibe

HOO® Graffiti 22 Printed Turndown Collar Button Down Men's Short Sleeve Shirt BestDVibe

HOO® Graffiti 22 Printed Turndown Collar Button Down Men's Short Sleeve Shirt

$9.95 $32.00

-69%

HOO® Hippie Colorful Deep-Sea Creature Octopus Printing Sleeveless Camisole Dress BestDVibe

HOO® Hippie Colorful Deep-Sea Creature Octopus Printing Sleeveless Camisole Dress BestDVibe

HOO® Hippie Colorful Deep-Sea Creature Octopus Printing Sleeveless Camisole Dress

$19.95

HOO® Eye-Catching Psychedelic Colorful Hippie Jellyfish Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

HOO® Eye-Catching Psychedelic Colorful Hippie Jellyfish Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

HOO® Eye-Catching Psychedelic Colorful Hippie Jellyfish Printing Cuban Collar Hawaiian Short Sleeve Shirt

From $17.95

HOO® Black And White Contrasting Colors Stitching Electric Guitar Bass Printing Men's Short Sleeve Shirt BestDVibe

HOO® Black And White Contrasting Colors Stitching Electric Guitar Bass Printing Men's Short Sleeve Shirt BestDVibe

HOO® Black And White Contrasting Colors Stitching Electric Guitar Bass Printing Men's Short Sleeve Shirt

$16.95 $34.00

-50%

HOO® Merry Christmas Tropical Christmas Flamingo Printing Short Sleeve Shirt BestDVibe

HOO® Merry Christmas Tropical Christmas Flamingo Printing Short Sleeve Shirt BestDVibe

HOO® Merry Christmas Tropical Christmas Flamingo Printing Short Sleeve Shirt

$18.95 $32.00

-41%

HOO® Colorful Hand-Painted Art Palm Tree Painting Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

HOO® Colorful Hand-Painted Art Palm Tree Painting Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

HOO® Colorful Hand-Painted Art Palm Tree Painting Cuban Collar Hawaiian Short Sleeve Shirt

$18.95 $33.00

-43%

HOO® Green Elegant White Flower Branch Printing Short Sleeve Shirt BestDVibe

HOO® Green Elegant White Flower Branch Printing Short Sleeve Shirt BestDVibe

HOO® Green Elegant White Flower Branch Printing Short Sleeve Shirt

$15.95

HOO® Irregular Man Figure Printed Short Sleeve Shirt BestDVibe

HOO® Irregular Man Figure Printed Short Sleeve Shirt BestDVibe

HOO® Irregular Man Figure Printed Short Sleeve Shirt

$9.95 $34.00

-69%

HOO® Butterfly Gradient Lake Blue Casual Fashion Sleeveless Camisole Dress BestDVibe

HOO® Butterfly Gradient Lake Blue Casual Fashion Sleeveless Camisole Dress BestDVibe

HOO® Butterfly Gradient Lake Blue Casual Fashion Sleeveless Camisole Dress

$19.95

HOO® Eye-Catching Classic Famous Painting Starry Sky And Space War Starship Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

HOO® Eye-Catching Classic Famous Painting Starry Sky And Space War Starship Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

HOO® Eye-Catching Classic Famous Painting Starry Sky And Space War Starship Printing Cuban Collar Hawaiian Short Sleeve Shirt

From $16.95

HOO® Ink Splashing Clovers Falg And Gnome Printing Patricks Day Hawaiian Short Sleeve Shirt BestDVibe

HOO® Ink Splashing Clovers Falg And Gnome Printing Patricks Day Hawaiian Short Sleeve Shirt BestDVibe

HOO® Ink Splashing Clovers Falg And Gnome Printing Patricks Day Hawaiian Short Sleeve Shirt

$15.95 $32.00

-50%

HOO® Graffiti Stripes and Skeletons Printing Men's Short Sleeve Shirts BestDVibe

HOO® Graffiti Stripes and Skeletons Printing Men's Short Sleeve Shirts BestDVibe

HOO® Graffiti Stripes and Skeletons Printing Men's Short Sleeve Shirts

$9.95 $32.00

-69%

HOO® Bamboo Ink Painting Printing Hawaiian Short Sleeve Shirt BestDVibe

HOO® Bamboo Ink Painting Printing Hawaiian Short Sleeve Shirt BestDVibe

HOO® Bamboo Ink Painting Printing Hawaiian Short Sleeve Shirt

$19.95 $34.00

-41%

HOO® Trendy Daisy Printing Men's Short Sleeve Shirt BestDVibe

HOO® Trendy Daisy Printing Men's Short Sleeve Shirt BestDVibe

HOO® Trendy Daisy Printing Men's Short Sleeve Shirt

$15.95 $32.00

-50%

HOO® Psychedelic Neon Light Love and Peace Hippie Symbols Printing Short Sleeve Shirt BestDVibe

HOO® Psychedelic Neon Light Love and Peace Hippie Symbols Printing Short Sleeve Shirt BestDVibe

HOO® Psychedelic Neon Light Love and Peace Hippie Symbols Printing Short Sleeve Shirt

$14.95 $32.00

-53%

HOO® Eye-Catching Stunning Style Cool Sci-Fi Space War Samurais Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

HOO® Eye-Catching Stunning Style Cool Sci-Fi Space War Samurais Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

HOO® Eye-Catching Stunning Style Cool Sci-Fi Space War Samurais Printing Cuban Collar Hawaiian Short Sleeve Shirt

$17.95

HOO® Creative Wavy Color Block Musical Instruments And Scores Printing Cuban Collar Short Sleeve Shirt BestDVibe

HOO® Creative Wavy Color Block Musical Instruments And Scores Printing Cuban Collar Short Sleeve Shirt BestDVibe

HOO® Creative Wavy Color Block Musical Instruments And Scores Printing Cuban Collar Short Sleeve Shirt

$18.95 $33.00

-43%

HOO® Blue Striped Polka Dot Printing Short Sleeve Shirt BestDVibe

HOO® Blue Striped Polka Dot Printing Short Sleeve Shirt BestDVibe

HOO® Blue Striped Polka Dot Printing Short Sleeve Shirt

$15.95 $32.00

-50%

HOO® Vintage Blue-White Horizontal Stripe Turndown Collar Button Down Men's Short Sleeve Shirt BestDVibe

HOO® Vintage Blue-White Horizontal Stripe Turndown Collar Button Down Men's Short Sleeve Shirt BestDVibe

HOO® Vintage Blue-White Horizontal Stripe Turndown Collar Button Down Men's Short Sleeve Shirt

$9.95 $32.00

-69%

Red And Black Matching Gradient Check Printing Lapel Long Sleeve Polo BestDVibe

Red And Black Matching Gradient Check Printing Lapel Long Sleeve Polo BestDVibe

Red And Black Matching Gradient Check Printing Lapel Long Sleeve Polo

$19.95 $36.00

-45%

HOO® Abstract Tree Trunk and Butterfly Printed Men's Short Sleeve Shirt BestDVibe

HOO® Abstract Tree Trunk and Butterfly Printed Men's Short Sleeve Shirt BestDVibe

HOO® Abstract Tree Trunk and Butterfly Printed Men's Short Sleeve Shirt

$9.95 $34.00

-69%

HOO® Blue Coconut Tree Printing Polyester Casual Short Sleeve Shirt BestDVibe

HOO® Blue Coconut Tree Printing Polyester Casual Short Sleeve Shirt BestDVibe

HOO® Blue Coconut Tree Printing Polyester Casual Short Sleeve Shirt

$14.95 $32.00

-53%

HOO® Stylish Vintage Silver Mosaic Disco Balls Printing Short Sleeve Shirt BestDVibe

HOO® Stylish Vintage Silver Mosaic Disco Balls Printing Short Sleeve Shirt BestDVibe

HOO® Stylish Vintage Silver Mosaic Disco Balls Printing Short Sleeve Shirt

From $16.95

HOO® Ancient Handwriting Script Xi'an and God of Wealth Graphics Short Sleeve Shirt BestDVibe

HOO® Ancient Handwriting Script Xi'an and God of Wealth Graphics Short Sleeve Shirt BestDVibe

HOO® Ancient Handwriting Script Xi'an and God of Wealth Graphics Short Sleeve Shirt

$9.95 $32.00

-69%

HOO® Full-View Painting Vintage Automobile Printing Men's Short Sleeve Shirt BestDVibe

HOO® Full-View Painting Vintage Automobile Printing Men's Short Sleeve Shirt BestDVibe

HOO® Full-View Painting Vintage Automobile Printing Men's Short Sleeve Shirt

$9.95 $34.00

-71%

HOO® Modern Art Ukiyo-E Grim Reaper Fighting Black Dragon Printing Short Sleeve Shirt BestDVibe

HOO® Modern Art Ukiyo-E Grim Reaper Fighting Black Dragon Printing Short Sleeve Shirt BestDVibe

HOO® Modern Art Ukiyo-E Grim Reaper Fighting Black Dragon Printing Short Sleeve Shirt

$19.95 $34.00

-41%

HOO® Camp Retro Black & Yellow & White Stitching Men's Short Sleeve Shirt BestDVibe

HOO® Camp Retro Black & Yellow & White Stitching Men's Short Sleeve Shirt BestDVibe

HOO® Camp Retro Black & Yellow & White Stitching Men's Short Sleeve Shirt

$9.95 $32.00

-69%

HOO® Black Funny Paint Splatter Rainbow Hawaiian Short Sleeve Shirt BestDVibe

HOO® Black Funny Paint Splatter Rainbow Hawaiian Short Sleeve Shirt BestDVibe

HOO® Black Funny Paint Splatter Rainbow Hawaiian Short Sleeve Shirt

$18.95 $32.00

-41%

HOO® Ukiyoe Metal Violent Roar Dragon Printing Short Sleeve Shirt BestDVibe

HOO® Ukiyoe Metal Violent Roar Dragon Printing Short Sleeve Shirt BestDVibe

HOO® Ukiyoe Metal Violent Roar Dragon Printing Short Sleeve Shirt

$15.95

HOO® Geometric Art Colorblock Tropical Plant And Moon Printing Hawaiian Vacation Men's Short Sleeve Shirt BestDVibe

HOO® Geometric Art Colorblock Tropical Plant And Moon Printing Hawaiian Vacation Men's Short Sleeve Shirt BestDVibe

HOO® Geometric Art Colorblock Tropical Plant And Moon Printing Hawaiian Vacation Men's Short Sleeve Shirt

$9.95 $32.00

-69%

HOO® Chinese Red Lantern and Bamboo Building Printing Men's Short Sleeve Shirt BestDVibe

HOO® Chinese Red Lantern and Bamboo Building Printing Men's Short Sleeve Shirt BestDVibe

HOO® Chinese Red Lantern and Bamboo Building Printing Men's Short Sleeve Shirt

$9.95 $34.00

-69%

HOO® Colorful Abstract Psychedelic Flower Doodles Printing Short Sleeve Shirt BestDVibe

HOO® Colorful Abstract Psychedelic Flower Doodles Printing Short Sleeve Shirt BestDVibe

HOO® Colorful Abstract Psychedelic Flower Doodles Printing Short Sleeve Shirt

$15.95 $32.00

-50%

HOO® Gradient Art Black And Blue Gradient Zipper Spread Collar Long Sleeve Polo BestDVibe

HOO® Gradient Art Black And Blue Gradient Zipper Spread Collar Long Sleeve Polo BestDVibe

HOO® Gradient Art Black And Blue Gradient Zipper Spread Collar Long Sleeve Polo

$19.95 $36.00

-45%

HOO® Art Bright Rainbow Skull Blacklight Hippie Printing Short Sleeve Shirt BestDVibe

HOO® Art Bright Rainbow Skull Blacklight Hippie Printing Short Sleeve Shirt BestDVibe

HOO® Art Bright Rainbow Skull Blacklight Hippie Printing Short Sleeve Shirt

$15.00

HOO® Cyan-Blue Check Printing Men's Short Sleeve Shirt BestDVibe

HOO® Cyan-Blue Check Printing Men's Short Sleeve Shirt BestDVibe

HOO® Cyan-Blue Check Printing Men's Short Sleeve Shirt

$9.95 $32.00

-69%

HOO® Sunset over the Plain Scenery Printing Men's Short Sleeve Shirt BestDVibe

HOO® Sunset over the Plain Scenery Printing Men's Short Sleeve Shirt BestDVibe

HOO® Sunset over the Plain Scenery Printing Men's Short Sleeve Shirt

$9.95 $34.00

-69%

HOO® Basic Floral-Print Sleeveless Camisole Dress BestDVibe

HOO® Basic Floral-Print Sleeveless Camisole Dress BestDVibe

HOO® Basic Floral-Print Sleeveless Camisole Dress

$19.95

HOO® Pinstripe Blue & Pink & Black Stitching Button Down Men's Short Sleeve Shirt BestDVibe

HOO® Pinstripe Blue & Pink & Black Stitching Button Down Men's Short Sleeve Shirt BestDVibe

HOO® Pinstripe Blue & Pink & Black Stitching Button Down Men's Short Sleeve Shirt

$9.95 $34.00

-69%

HOO® Blue Starry Sky Vincent Oil Painting Printing Short Sleeve Shirt BestDVibe

HOO® Blue Starry Sky Vincent Oil Painting Printing Short Sleeve Shirt BestDVibe

HOO® Blue Starry Sky Vincent Oil Painting Printing Short Sleeve Shirt

$15.95 $32.00

-50%

HOO® Fashion Vintage Art Casual Octopus War Printing Short Sleeve Shirt BestDVibe

HOO® Fashion Vintage Art Casual Octopus War Printing Short Sleeve Shirt BestDVibe

HOO® Fashion Vintage Art Casual Octopus War Printing Short Sleeve Shirt

From $16.95

HOO® Grey Flower Printing Men's Short Sleeve Shirt BestDVibe

HOO® Grey Flower Printing Men's Short Sleeve Shirt BestDVibe

HOO® Grey Flower Printing Men's Short Sleeve Shirt

$9.95 $34.00

-69%

HOO®Auspicious Clouds & Waves & Sun Printing Men's Long Sleeve Shirt BestDVibe

HOO®Auspicious Clouds & Waves & Sun Printing Men's Long Sleeve Shirt BestDVibe

HOO®Auspicious Clouds & Waves & Sun Printing Men's Long Sleeve Shirt

$19.95

HOO® Technological Psychedelic Outer Space Ship Printing Short Sleeve Shirt BestDVibe

HOO® Technological Psychedelic Outer Space Ship Printing Short Sleeve Shirt BestDVibe

HOO® Technological Psychedelic Outer Space Ship Printing Short Sleeve Shirt

$15.00 $32.00

-53%

HOO® Ink Splashing Falg And Clover Printing Patricks Day Hawaiian Cuban Collar Men's Short Sleeve Shirt BestDVibe

HOO® Ink Splashing Falg And Clover Printing Patricks Day Hawaiian Cuban Collar Men's Short Sleeve Shirt BestDVibe

HOO® Ink Splashing Falg And Clover Printing Patricks Day Hawaiian Cuban Collar Men's Short Sleeve Shirt

$18.95 $33.00

-43%

Vintage LightBlue And White Stitching Cats Printing Men's Short Sleeve Shirt BestDVibe

Vintage LightBlue And White Stitching Cats Printing Men's Short Sleeve Shirt BestDVibe

Vintage LightBlue And White Stitching Cats Printing Men's Short Sleeve Shirt

$12.95 $30.00

-57%

HOO® Christmas Elements Santa Claus Crystal Ball And Musical Notes Printing V-Neck Suit Vest/Tuxedo Waistcoat And Tie, Can be Worn on Both Sides BestDVibe

HOO® Christmas Elements Santa Claus Crystal Ball And Musical Notes Printing V-Neck Suit Vest/Tuxedo Waistcoat And Tie, Can be Worn on Both Sides BestDVibe

HOO® Christmas Elements Santa Claus Crystal Ball And Musical Notes Printing V-Neck Suit Vest/Tuxedo Waistcoat And Tie, Can be Worn on Both Sides

$15.95 $34.00

-53%

HOO® Delightful Red And White Stitching Whistlin P-Chef BBQ Printing Short Sleeve Shirt BestDVibe

HOO® Delightful Red And White Stitching Whistlin P-Chef BBQ Printing Short Sleeve Shirt BestDVibe

HOO® Delightful Red And White Stitching Whistlin P-Chef BBQ Printing Short Sleeve Shirt

$15.95 $32.00

-50%

HOO® Shanghai City & River View Printing Men's Short Sleeve Shirt BestDVibe

HOO® Shanghai City & River View Printing Men's Short Sleeve Shirt BestDVibe

HOO® Shanghai City & River View Printing Men's Short Sleeve Shirt

$9.95 $34.00

-69%

HOO® Vintage Black & Khaki Stitching Lunar Eclipse Printing Men's Short Sleeve Shirt BestDVibe

HOO® Vintage Black & Khaki Stitching Lunar Eclipse Printing Men's Short Sleeve Shirt BestDVibe

HOO® Vintage Black & Khaki Stitching Lunar Eclipse Printing Men's Short Sleeve Shirt

$15.00 $32.00

-53%

HOO® Carnival Masquerade Domino Party Printing Short Sleeve Shirt BestDVibe

HOO® Carnival Masquerade Domino Party Printing Short Sleeve Shirt BestDVibe

HOO® Carnival Masquerade Domino Party Printing Short Sleeve Shirt

$15.95 $34.00

-53%

HOO® Eye-Catching Gothic Classic Skull And Wings Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

HOO® Eye-Catching Gothic Classic Skull And Wings Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

HOO® Eye-Catching Gothic Classic Skull And Wings Printing Cuban Collar Hawaiian Short Sleeve Shirt

$17.95

HOO® HOO 1960s Orange Paper Cut Painting Printed & Red Stitching Men's Short Sleeve Shirt BestDVibe

HOO® HOO 1960s Orange Paper Cut Painting Printed & Red Stitching Men's Short Sleeve Shirt BestDVibe

HOO® HOO 1960s Orange Paper Cut Painting Printed & Red Stitching Men's Short Sleeve Shirt

$9.95 $34.00

-69%

HOO® Wheat & Brown Stitching Musical Score Printing Men's Short Sleeve Shirt BestDVibe

HOO® Wheat & Brown Stitching Musical Score Printing Men's Short Sleeve Shirt BestDVibe

HOO® Wheat & Brown Stitching Musical Score Printing Men's Short Sleeve Shirt

$16.95 $34.00

-50%

HOO® Vintage Irregular Horizontal Lines Short Sleeve Shirt BestDVibe

HOO® Vintage Irregular Horizontal Lines Short Sleeve Shirt BestDVibe

HOO® Vintage Irregular Horizontal Lines Short Sleeve Shirt

$9.95 $34.00

-69%

HOO® Eye-Catching Space War Star Universe Spaceship And Sci-Fi Planet Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

HOO® Eye-Catching Space War Star Universe Spaceship And Sci-Fi Planet Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

HOO® Eye-Catching Space War Star Universe Spaceship And Sci-Fi Planet Printing Cuban Collar Hawaiian Short Sleeve Shirt

$15.95

HOO® Beach Style Cock In Shorts With A Surfboard Printing Short Sleeve Shirt BestDVibe

HOO® Beach Style Cock In Shorts With A Surfboard Printing Short Sleeve Shirt BestDVibe

HOO® Beach Style Cock In Shorts With A Surfboard Printing Short Sleeve Shirt

$15.95

Sorry, there are no products in this collection.

Customer Services

Our Story
Contact Us
Fit Guide
Payment Methods
Shipping Policy
Return/ Exchange & Refund
Order Tracking
Terms of Service
Privacy Policy

Get in touch

Email us Track your order

Follow us

We accept

© 2025 BestDVibe

Sign up and save

Entice customers to sign up for your mailing list with discounts or exclusive offers. Include an image for extra impact.

Thanks for subscribing

Optional button

Cart