🎁 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

Hippie Clothing

Filter

Clear all

size

2xl (285)
3xl (284)
4xl (255)
4xlt (163)
5xl (198)
5xlt (164)
6xl (38)
6xlt (18)
l (288)
m (242)
s (183)
xl (288)
xs (151)

303 Products

303 Products

Filter and sort

size

Sort by

size

2xl (285)
3xl (284)
4xl (255)
4xlt (163)
5xl (198)
5xlt (164)
6xl (38)
6xlt (18)
l (288)
m (242)
s (183)
xl (288)
xs (151)

Clear all

Eye-Catching Psychedelic Green Fire Flame Pattern Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Green Fire Flame Pattern Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Green Fire Flame Pattern Printing Cuban Collar Hawaiian Short Sleeve Shirt

$30.80 $47.50

-35%

Eye-Catching Rainbow Radiant Skull Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Rainbow Radiant Skull Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Rainbow Radiant Skull Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $47.50

-33%

Eye-Catching Psychedelic Hippie Funny Octopus Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Hippie Funny Octopus Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Hippie Funny Octopus Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $47.50

-33%

Eye-Catching Rainbow Painting Paint Splatter Sugar Skull Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Rainbow Painting Paint Splatter Sugar Skull Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Rainbow Painting Paint Splatter Sugar Skull Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Futuristic Abstract Neon Psychedelic Colorful Skulls Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Futuristic Abstract Neon Psychedelic Colorful Skulls Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Futuristic Abstract Neon Psychedelic Colorful Skulls Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Psychedelic Sci-Fi Crazy Adventure Team And Ferocious Ghosts Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Sci-Fi Crazy Adventure Team And Ferocious Ghosts Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Sci-Fi Crazy Adventure Team And Ferocious Ghosts Printing Cuban Collar Hawaiian Short Sleeve Shirt

$30.80 $35.00

-7%

Eye-Catching Psychedelic Beach Purple Hawaiian Coconut Tree Print Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Beach Purple Hawaiian Coconut Tree Print Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Beach Purple Hawaiian Coconut Tree Print Short Sleeve Shirt

$31.80 $47.50

-33%

Eye-Catching Psychedelic Neon Colorful Multi-Element Splicing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Neon Colorful Multi-Element Splicing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Neon Colorful Multi-Element Splicing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Psychedelic Moon Skull And Mutated Mushroom Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Moon Skull And Mutated Mushroom Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Moon Skull And Mutated Mushroom Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $47.50

-33%

Eye-Catching Psychedelic Stunning Hippie Magic Mushrooms Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Stunning Hippie Magic Mushrooms Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Stunning Hippie Magic Mushrooms Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $47.50

-33%

Eye-Catching Psychedelic Stunning Hippie Colored Octopus Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Stunning Hippie Colored Octopus Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Stunning Hippie Colored Octopus Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Psychedelic Green Fire Flame Pattern Printing Shorts BestDVibe

Eye-Catching Psychedelic Green Fire Flame Pattern Printing Shorts BestDVibe

Eye-Catching Psychedelic Green Fire Flame Pattern Printing Shorts

$27.00

Eye-Catching Thriller Style Horror Characters And Flaming Skulls Costumes Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Thriller Style Horror Characters And Flaming Skulls Costumes Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Thriller Style Horror Characters And Flaming Skulls Costumes Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Psychedelic Rainbow Grateful Dead Liquisyrgic Splatter Paint Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Rainbow Grateful Dead Liquisyrgic Splatter Paint Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Rainbow Grateful Dead Liquisyrgic Splatter Paint Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Rainbow Radiant Skull Printing Shorts BestDVibe

Eye-Catching Rainbow Radiant Skull Printing Shorts BestDVibe

Eye-Catching Rainbow Radiant Skull Printing Shorts

$27.00

Eye-Catching Psychedelic Mysterious Seabed Mutant Mushrooms And Jellyfish Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Mysterious Seabed Mutant Mushrooms And Jellyfish Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Mysterious Seabed Mutant Mushrooms And Jellyfish Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $52.00

-39%

Eye-Catching Psychedelic Colorful Wicked Skulls Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Colorful Wicked Skulls Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Colorful Wicked Skulls Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

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

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

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

$31.80 $47.50

-33%

Eye-Catching Psychedelic Colorful Hippie Mushroom Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Colorful Hippie Mushroom Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Colorful Hippie Mushroom Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $47.50

-33%

Eye-Catching Psychedelic Cartoon Horror Weirdo Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Cartoon Horror Weirdo Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Cartoon Horror Weirdo Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Psychedelic Cartoon Witch Characters Poster Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Cartoon Witch Characters Poster Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Cartoon Witch Characters Poster Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Psychedelic Neon Colorful Tropical Foliage And Parrots Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Neon Colorful Tropical Foliage And Parrots Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Neon Colorful Tropical Foliage And Parrots Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Amazing Style Hippie Bus Hawaiian Cuban Collar Short Sleeve Shirt BestDVibe

Eye-Catching Amazing Style Hippie Bus Hawaiian Cuban Collar Short Sleeve Shirt BestDVibe

Eye-Catching Amazing Style Hippie Bus Hawaiian Cuban Collar Short Sleeve Shirt

$31.80 $47.50

-33%

Eye-Catching Psychedelic Blue Comic Art Classic Horror Characters Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Blue Comic Art Classic Horror Characters Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Blue Comic Art Classic Horror Characters Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Psychedelic Colorful Pop Art Artist Jimi Hendrix Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Colorful Pop Art Artist Jimi Hendrix Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Colorful Pop Art Artist Jimi Hendrix Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $47.50

-33%

Eye-Catching Psychedelic Colorful Hippie Funny Octopus Printing Hawaiian Shorts BestDVibe

Eye-Catching Psychedelic Colorful Hippie Funny Octopus Printing Hawaiian Shorts BestDVibe

Eye-Catching Psychedelic Colorful Hippie Funny Octopus Printing Hawaiian Shorts

$27.00

Eye-Catching Psychedelic Amazing Style Hippie Skull Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Amazing Style Hippie Skull Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Amazing Style Hippie Skull Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $47.50

-33%

Eye-Catching Psychedelic Spooky Green Slime And Rainbow Skull Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Spooky Green Slime And Rainbow Skull Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Spooky Green Slime And Rainbow Skull Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Psychedelic Colorful Fire Flame And Fire Phoenix Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Colorful Fire Flame And Fire Phoenix Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Colorful Fire Flame And Fire Phoenix Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Psychedelic Moto Skeleton Monster Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Moto Skeleton Monster Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Moto Skeleton Monster Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Psychedelic Horror Characters Poster Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Horror Characters Poster Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Horror Characters Poster Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Halloween Psychedelic Evil Horror Movie Characters Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Halloween Psychedelic Evil Horror Movie Characters Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Halloween Psychedelic Evil Horror Movie Characters Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Psychedelic Futuristic Tech Eyes Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Futuristic Tech Eyes Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Futuristic Tech Eyes Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Psychedelic Colorful Tie-Dye Ink Splashing Spiral Bear Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Colorful Tie-Dye Ink Splashing Spiral Bear Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Colorful Tie-Dye Ink Splashing Spiral Bear Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Psychedelic Different Dimension Twisted Monsters Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Different Dimension Twisted Monsters Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Different Dimension Twisted Monsters Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.50 $47.00

-33%

Eye-Catching Halloween Psychedelic Roaring Colorful Ghosts Printing Breast Pocket Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Halloween Psychedelic Roaring Colorful Ghosts Printing Breast Pocket Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Halloween Psychedelic Roaring Colorful Ghosts Printing Breast Pocket Cuban Collar Hawaiian Short Sleeve Shirt

$33.99 $35.00

-0%

Eye-Catching Psychedelic Rainbow Palm Tree Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Rainbow Palm Tree Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Rainbow Palm Tree Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $47.50

-33%

Eye-Catching Psychedelic Gradient Purple Magic Butterfly Flowers And Skull Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Gradient Purple Magic Butterfly Flowers And Skull Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Gradient Purple Magic Butterfly Flowers And Skull Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Iridescent Psychedelic Swirl Trippy Artwork Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Iridescent Psychedelic Swirl Trippy Artwork Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Iridescent Psychedelic Swirl Trippy Artwork Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.60 $35.00

-4%

Eye-Catching Psychedelic Blue Purple Comic Art Classic Horror Characters Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Blue Purple Comic Art Classic Horror Characters Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Blue Purple Comic Art Classic Horror Characters Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Psychedelic Colored Spiral Twisted Skulls Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Colored Spiral Twisted Skulls Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Colored Spiral Twisted Skulls Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $47.50

-33%

Eye-Catching Psychedelic Radiation Skulls Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Radiation Skulls Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Radiation Skulls Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Psychedelic Pink Fire Flame With Skulls Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Pink Fire Flame With Skulls Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Pink Fire Flame With Skulls Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Psychedelic Seaside City Cyan Gradient Sky And Sunset Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Seaside City Cyan Gradient Sky And Sunset Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Seaside City Cyan Gradient Sky And Sunset Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Psychedelic Colorful Mutant Mushrooms Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Colorful Mutant Mushrooms Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Colorful Mutant Mushrooms Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.50 $51.00

-38%

Eye-Catching Psychedelic Lover Hippie Style Hippie Sign Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Lover Hippie Style Hippie Sign Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Lover Hippie Style Hippie Sign Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.50 $47.00

-33%

Eye-Catching Psychedelic Neon Colorful Multi-Element Splicing Printing Shorts BestDVibe

Eye-Catching Psychedelic Neon Colorful Multi-Element Splicing Printing Shorts BestDVibe

Eye-Catching Psychedelic Neon Colorful Multi-Element Splicing Printing Shorts

$27.00

Eye-Catching Psychedelic Colorful Burst Mutation Skull Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Colorful Burst Mutation Skull Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Colorful Burst Mutation Skull Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Crazy Art Stream Psychedelic Dimensions Skull Tropical Hawaiian Cuban Collar Short Sleeve Shirt BestDVibe

Eye-Catching Crazy Art Stream Psychedelic Dimensions Skull Tropical Hawaiian Cuban Collar Short Sleeve Shirt BestDVibe

Eye-Catching Crazy Art Stream Psychedelic Dimensions Skull Tropical Hawaiian Cuban Collar Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Psychedelic Sci-Fi Monsters Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Sci-Fi Monsters Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Sci-Fi Monsters Printing Cuban Collar Hawaiian Short Sleeve Shirt

$32.99 $35.00

-0%

Eye-Catching Psychedelic Cyan Background Horror Ghosts And Dolls Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Cyan Background Horror Ghosts And Dolls Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Cyan Background Horror Ghosts And Dolls Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Psychedelic Stunning Hippie Colored Octopus Printing Shorts BestDVibe

Eye-Catching Psychedelic Stunning Hippie Colored Octopus Printing Shorts BestDVibe

Eye-Catching Psychedelic Stunning Hippie Colored Octopus Printing Shorts

$27.00

Eye-Catching Psychedelic Colorful Love And Peace Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Colorful Love And Peace Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Colorful Love And Peace Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Psychedelic Beach Skull Pineapple Printing Carnival Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Beach Skull Pineapple Printing Carnival Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Beach Skull Pineapple Printing Carnival Hawaiian Short Sleeve Shirt

$31.80 $47.50

-33%

Eye-Catching Psychedelic Horror Skull Art Mutated Organs and Skeletons Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Horror Skull Art Mutated Organs and Skeletons Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Horror Skull Art Mutated Organs and Skeletons Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Psychedelic Skull Art Fox Girl And Skull Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Skull Art Fox Girl And Skull Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Skull Art Fox Girl And Skull Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Party Thriller Character Costume Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Party Thriller Character Costume Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Party Thriller Character Costume Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Psychedelic Rainbow Tie-dye Ink Spill Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Rainbow Tie-dye Ink Spill Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Rainbow Tie-dye Ink Spill Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Psychedelic Twisted Screaming Skull Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Twisted Screaming Skull Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Twisted Screaming Skull Printing Cuban Collar Hawaiian Short Sleeve Shirt

$30.80 $48.00

-36%

Eye-Catching Psychedelic Colorful Cat Oil Painting Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Colorful Cat Oil Painting Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Colorful Cat Oil Painting Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $47.50

-33%

Eye-Catching Trippy Psychedelic Sea Monsters And Ghostboard Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Trippy Psychedelic Sea Monsters And Ghostboard Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Trippy Psychedelic Sea Monsters And Ghostboard Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.99

Eye-Catching Psychedelic Sci-Fi Space Warriors Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Sci-Fi Space Warriors Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Sci-Fi Space Warriors Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Psychedelic Colorful Graffiti Skull Printing Shorts BestDVibe

Eye-Catching Psychedelic Colorful Graffiti Skull Printing Shorts BestDVibe

Eye-Catching Psychedelic Colorful Graffiti Skull Printing Shorts

$27.00

Eye-Catching Psychedelic Colorful Hippie Jellyfish Printing Shorts BestDVibe

Eye-Catching Psychedelic Colorful Hippie Jellyfish Printing Shorts BestDVibe

Eye-Catching Psychedelic Colorful Hippie Jellyfish Printing Shorts

$27.00

Eye-Catching Psychedelic Colorful Tiny Skull Printing Shorts BestDVibe

Eye-Catching Psychedelic Colorful Tiny Skull Printing Shorts BestDVibe

Eye-Catching Psychedelic Colorful Tiny Skull Printing Shorts

$27.00

Eye-Catching Sci-Fi Space Cartoon Costumes Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Sci-Fi Space Cartoon Costumes Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Sci-Fi Space Cartoon Costumes Printing Cuban Collar Hawaiian Short Sleeve Shirt

$33.95 $35.00

-0%

Futuristic Abstract Neon psychedelic Colorful Skulls Printing Hooded Sweatshirt BestDVibe

Futuristic Abstract Neon psychedelic Colorful Skulls Printing Hooded Sweatshirt BestDVibe

Futuristic Abstract Neon psychedelic Colorful Skulls Printing Hooded Sweatshirt

$35.95 $40.00

-5%

Eye-Catching Psychedelic Eyes Mushroom Abstract Art Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Eyes Mushroom Abstract Art Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Eyes Mushroom Abstract Art Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.99 $35.00

-3%

Eye-Catching Psychedelic Jellyfish And Skull Lovers Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Jellyfish And Skull Lovers Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Jellyfish And Skull Lovers Printing Cuban Collar Hawaiian Short Sleeve Shirt

$32.99 $35.00

-0%

Eye-Catching Psychedelic Rainbow Lips Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Rainbow Lips Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Rainbow Lips Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Psychedelic Stunning Hippie Magic Mushrooms Printing Shorts BestDVibe

Eye-Catching Psychedelic Stunning Hippie Magic Mushrooms Printing Shorts BestDVibe

Eye-Catching Psychedelic Stunning Hippie Magic Mushrooms Printing Shorts

$28.80 $47.50

-39%

Eye-Catching Psychedelic Colorful Cute Mushroom Family Bonfire Party Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Colorful Cute Mushroom Family Bonfire Party Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Colorful Cute Mushroom Family Bonfire Party Printing Cuban Collar Hawaiian Short Sleeve Shirt

From $22.95 $33.00

-30%

Eye-Catching Classic Horror Characters Halloween Costumes Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Classic Horror Characters Halloween Costumes Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Classic Horror Characters Halloween Costumes Printing Cuban Collar Hawaiian Short Sleeve Shirt

$32.99 $35.00

-0%

Eye-Catching Psychedelic Hippie Funny Octopus Printing Hooded Sweatshirt BestDVibe

Eye-Catching Psychedelic Hippie Funny Octopus Printing Hooded Sweatshirt BestDVibe

Eye-Catching Psychedelic Hippie Funny Octopus Printing Hooded Sweatshirt

$35.95 $40.00

-5%

Eye-Catching Psychedelic Dark Art Experimented Orangutan Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Dark Art Experimented Orangutan Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Dark Art Experimented Orangutan Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.99 $35.00

-3%

Eye-Catching Fashion Hippie Psychedelic Art Colorful Octopus Monsters Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Fashion Hippie Psychedelic Art Colorful Octopus Monsters Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Fashion Hippie Psychedelic Art Colorful Octopus Monsters Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.99 $35.00

-3%

Eye-Catching Psychedelic Monster Party Graffiti Art Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Monster Party Graffiti Art Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Monster Party Graffiti Art Printing Cuban Collar Hawaiian Short Sleeve Shirt

$32.99 $35.00

-0%

Eye-Catching Neon Psychedelic Sci-Fi Alien World Alien Creatures And Characters Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Neon Psychedelic Sci-Fi Alien World Alien Creatures And Characters Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Neon Psychedelic Sci-Fi Alien World Alien Creatures And Characters Printing Cuban Collar Hawaiian Short Sleeve Shirt

$30.99 $35.00

-6%

Eye-Catching Hippie Brightly Colored Psychedelic Mushrooms Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Hippie Brightly Colored Psychedelic Mushrooms Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Hippie Brightly Colored Psychedelic Mushrooms Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.99 $35.00

-3%

Rainbow Colored Space Galaxy Clouds Printing Short Sleeve Polo BestDVibe

Rainbow Colored Space Galaxy Clouds Printing Short Sleeve Polo BestDVibe

Rainbow Colored Space Galaxy Clouds Printing Short Sleeve Polo

$30.95 $34.00

-9%

Eye-Catching Psychedelic Abstract Geometric Mutant Creatures Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Abstract Geometric Mutant Creatures Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Abstract Geometric Mutant Creatures Printing Cuban Collar Hawaiian Short Sleeve Shirt

$33.95 $35.00

-0%

Eye-Catching Psychedelic Colorful Hippie Flower Bus And Clouds Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Colorful Hippie Flower Bus And Clouds Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Colorful Hippie Flower Bus And Clouds Printing Cuban Collar Hawaiian Short Sleeve Shirt

$32.99 $35.00

-0%

Eye-Catching Psychedelic Rainbow Magic Tree Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Rainbow Magic Tree Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Rainbow Magic Tree Printing Cuban Collar Hawaiian Short Sleeve Shirt

$32.99 $35.00

-0%

Eye-Catching Colorful Psychedelic Mushrooms Forest Mushrooms Party Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Colorful Psychedelic Mushrooms Forest Mushrooms Party Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Colorful Psychedelic Mushrooms Forest Mushrooms Party Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Party Horror Character Costume Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Party Horror Character Costume Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Party Horror Character Costume Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Psychedelic Colorful Peace Pattern Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Colorful Peace Pattern Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Psychedelic Colorful Peace Pattern Printing Cuban Collar Hawaiian Short Sleeve Shirt

$30.80 $47.00

-34%

Eye-Catching Psychedelic Colorful Hippie Mushroom Printing Shorts BestDVibe

Eye-Catching Psychedelic Colorful Hippie Mushroom Printing Shorts BestDVibe

Eye-Catching Psychedelic Colorful Hippie Mushroom Printing Shorts

$27.00

Eye-Catching Psychedelic Rainbow Palm Tree Printing Shorts BestDVibe

Eye-Catching Psychedelic Rainbow Palm Tree Printing Shorts BestDVibe

Eye-Catching Psychedelic Rainbow Palm Tree Printing Shorts

$28.80 $47.50

-39%

Eye-Catching Amazing Style Psychedelic Tropical Skull And Roses Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Amazing Style Psychedelic Tropical Skull And Roses Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Amazing Style Psychedelic Tropical Skull And Roses Printing Cuban Collar Hawaiian Short Sleeve Shirt

From $18.95 $31.00

-39%

Eye-Catching Colored Psychedelic Distressed Alien Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Colored Psychedelic Distressed Alien Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Colored Psychedelic Distressed Alien Printing Cuban Collar Hawaiian Short Sleeve Shirt

From $22.95 $33.00

-30%

Eye-Catching Halloween Cartoon Costumes Witch Party And Ghosts Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Halloween Cartoon Costumes Witch Party And Ghosts Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Halloween Cartoon Costumes Witch Party And Ghosts Printing Cuban Collar Hawaiian Short Sleeve Shirt

$33.95 $35.00

-0%

Eye-Catching Halloween Costumes Classic Horror Characters Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Halloween Costumes Classic Horror Characters Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Halloween Costumes Classic Horror Characters Printing Cuban Collar Hawaiian Short Sleeve Shirt

$33.95 $35.00

-0%

Eye-Catching Halloween Night Psychedelic Evil Pumpkin Forest Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Halloween Night Psychedelic Evil Pumpkin Forest Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Halloween Night Psychedelic Evil Pumpkin Forest Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.80 $35.00

-4%

Eye-Catching Sci-Fi Elements Rocket And Space Psychedelic Poster Printing Breast Pocket Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Sci-Fi Elements Rocket And Space Psychedelic Poster Printing Breast Pocket Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Sci-Fi Elements Rocket And Space Psychedelic Poster Printing Breast Pocket Cuban Collar Hawaiian Short Sleeve Shirt

$32.99 $35.00

-0%

Halloween Ink Splatter Rainbow Magic Skull Printing Hooded Sweatshirt BestDVibe

Halloween Ink Splatter Rainbow Magic Skull Printing Hooded Sweatshirt BestDVibe

Halloween Ink Splatter Rainbow Magic Skull Printing Hooded Sweatshirt

$35.95 $40.00

-5%

Black And White Skull Skeleton Costume Printing Hooded Sweatshirt BestDVibe

Black And White Skull Skeleton Costume Printing Hooded Sweatshirt BestDVibe

Black And White Skull Skeleton Costume Printing Hooded Sweatshirt

$35.95 $40.00

-5%

Eye-Catching Hippie Psychedelic Mutant Skull And Neon Night Sky Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Hippie Psychedelic Mutant Skull And Neon Night Sky Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Hippie Psychedelic Mutant Skull And Neon Night Sky Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.99 $35.00

-3%

Eye-Catching Skulls With Rainbow Wings And Red Roses Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Skulls With Rainbow Wings And Red Roses Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Skulls With Rainbow Wings And Red Roses Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.99 $35.00

-3%

Eye-Catching Sci-Fi Psychedelic Space Elements Astronaut Riding A Motorcycle Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Sci-Fi Psychedelic Space Elements Astronaut Riding A Motorcycle Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Sci-Fi Psychedelic Space Elements Astronaut Riding A Motorcycle Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.99 $35.00

-3%

Eye-Catching Abstract Psychedelic Hippie Art Abstract Eyes And Facial Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Abstract Psychedelic Hippie Art Abstract Eyes And Facial Printing Cuban Collar Hawaiian Short Sleeve Shirt BestDVibe

Eye-Catching Abstract Psychedelic Hippie Art Abstract Eyes And Facial Printing Cuban Collar Hawaiian Short Sleeve Shirt

$31.99 $35.00

-3%

Sorry, there are no products in this collection.

Hippie clothing, hippie costume for male

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