handleClick(e)}\n >\n \n\n \n \n );\n}\n\nfunction restructureButton(el) {\n if (!el.querySelector(\"span\")) {\n const span = document.createElement(\"span\");\n span.innerHTML = el.innerHTML;\n el.innerHTML = \"\";\n el.appendChild(span);\n }\n}\n","import React from 'react';\nimport cmsUtils from '../../utils/cmsUtils';\nimport utils from '../../../utils';\n\nimport env from '../../../env';\nimport { useGet } from '../../../components';\nimport { ErrorPopup, Loading } from '../../../components';\n\nimport { Tile } from '../../../site/product/productTile';\n\nexport function ProductTiles(props) {\n const item = props.item;\n //const cmsOption = props.cmsOption || {};\n\n //console.log('item', item);\n const productCodes = getProductCodes(cmsUtils.payload(item, 'ProductList'))\n //console.log(productCodes)\n const cssClass = utils.classNames('cms_item', 'productListByCodes', item.cssClass || item.anchorName || '');\n\n return \n {productCodes && productCodes.length > 0 && }\n
\n}\n\nfunction getProductCodes(str){\n const list = (str || '').replace(/\\r\\n/g, '\\n').split('\\n');\n return list.filter(x => !!x)\n}\n\nexport function TilesFromCodes({productCodes}) {\n const get = useGet();\n React.useEffect(() => {\n get.send(env.apiBase + '/api/product/getProductByCodes?productCodes=' + productCodes.join(','));\n // eslint-disable-next-line\n }, []);\n\n if (get.loading()) {\n return
\n return (\n \n {data.map((product, index) =>\n
\n );\n}","import React from 'react';\nimport { Item } from '../../items/item';\nimport cmsUtils from '../../utils/cmsUtils';\nimport utils from '../../../utils';\nimport './style.scss';\nimport Slider from \"react-slick\";\n\nexport function LinkTiles(props) {\n const item = props.item;\n const subItems = item.items || [];\n const maxItemsNumber = subItems.length;\n const cmsOption = props.cmsOption || {};\n const useSlider = cmsUtils.payload(item, 'UseSlider') || \"no\";\n const sliderContainer = React.useRef(null);\n const tiles = subItems.map((subItem, index) =>\n \n {\n useSlider && useSlider === 'yes' ?\n \n {tiles}\n : tiles\n }\n
\n );\n}","import React from 'react';\nimport cmsUtils from '../../utils/cmsUtils';\nimport utils from '../../../utils';\nimport { SiteLink } from '../../../components';\n\nexport function LinkTileItem(props) {\n const item = props.item;\n const cmsOption = props.cmsOption || {};\n const index = props.index;\n const bgUrl = utils.site.resourcePath(cmsUtils.payload(item, 'ImageUrl'));\n //const bgUrl = \"https://conairman.stg5.jaba.com.au/sites/conairman/media/miscellaneous/conairman/model-tile-24.jpg\";\n\n const captionTitle = cmsUtils.payload(item, 'CaptionTitle');\n const captionButton = cmsUtils.payload(item, 'CaptionButton');\n const linkUrl = cmsUtils.payload(item, 'LinkUrl');\n\n //console.log('item', linkUrl);\n const titlePanel = captionTitle ? (\n linkUrl ? (\n \n
\n \n {\n (captionButton && captionButton !== '') &&\n
{captionButton} \n }\n\n
)\n ) : null;\n\n const cssClass = utils.classNames('cms_item', 'linkTile', `index__${index}`, `linkTile--${linkUrl ? 'link' : ''}`, item.cssClass || item.anchorName || '', titlePanel && 'bannerHasTitlePanel');\n\n return (\n \n {linkUrl ?\n
\n {titlePanel}
}\n :\n
\n {titlePanel}
}\n }\n
\r\n
\r\n \r\n {subItemsElts}\r\n
\r\n \r\n )\r\n}","import React from \"react\";\nimport { BannerPanel } from \"./bannerPanel/view\";\nimport { BannerItem } from \"./bannerItem/view\";\nimport { Panel } from \"./panel/view\";\nimport { Html } from \"./html/view\";\nimport { TestimonialPanel } from \"./testimonialPanel/view\";\nimport { TestimonialItem } from \"./testimonialItem/view\";\nimport { ImagePanel } from \"./imagePanel/view\";\nimport { PageTiles } from \"./pageTiles/view\";\nimport { SingleBanner } from \"./singleBanner/view\";\nimport { ContactForm } from \"./contactForm/view\";\nimport { YoutubeBannerPanel } from \"./youtubeBannerPanel/view\";\nimport { Code } from \"./code/view\";\nimport { BlogPosts } from \"./blogPosts/view\";\nimport { BlogPostTitle } from \"./blogPostTitle/view\";\nimport { VideoHolder } from \"./videoHolder/view\";\nimport { VideoItem } from \"./videoItem/view\";\nimport { MultiColumnPanel } from \"./multiColumnPanel/view\";\nimport { ExpandableHtml } from \"./expandableHtml/view\";\nimport { ProductTiles } from \"./productTiles/view\";\nimport { LinkTiles } from \"./linkTiles/view\";\nimport { LinkTileItem } from \"./linkTileItem/view\";\nimport { ExpandablePanel } from \"../../components/expandablePanel/view\";\n\nexport function Item(props) {\n const item = props.item;\n //const subItems = item.items || [];\n const cmsOption = props.cmsOption || {};\n const index = props.index;\n\n //console.log('item', item, subItems, cmsOption);\n\n let itemElt = <>;\n if (item.itemTypeCode === \"Panel\") {\n itemElt = ;\n } else if (item.itemTypeCode === \"BannerPanel\") {\n itemElt = {item.itemTypeCode}
;\n }\n\n // const subItemsElts = subItems.map((subItem, index) =>\n // {sectionItems}
\n \n );\n}\n\n// function getEmbedTypes(pageData) {\n// const embedTypes = { tiktok: false };\n// const embedDataList = pageData?.embedDataList;\n// embedTypes.tiktok = utils.array.find(embedDataList, (x) => (x.code || \"\").indexOf(\"tiktok.com\") >= 0);\n\n// return embedTypes;\n// }\n\nfunction Section(props) {\n log(\"5. section rendering\");\n const item = props.item;\n //const sectionName = item.sectionName;\n const subItems = item.items || [];\n const cmsOption = props.cmsOption || {};\n if (!subItems || subItems.length === 0) return <>;\n\n const subItemsElts = subItems.map((subItem, index) => <\\/p>/g, '');\n //editor.insertHtml(evt.data.dataValue); return false;\n setTimeout(function () {\n CKEDITOR.instances.cmsCurrentEditor.setData(CKEDITOR.instances.cmsCurrentEditor.getData());\n }, 100);\n }, null, null, 9);\n }\n\n close($editor = null) {\n const CKEDITOR = window['CKEDITOR'] || {};\n //console.log('ckeditor close');\n if (typeof CKEDITOR.instances.cmsCurrentEditor != \"undefined\")\n CKEDITOR.instances.cmsCurrentEditor.destroy();\n\n //for (var instance in CKEDITOR.instances) {\n // CKEDITOR.instances[instance].destroy();\n //}\n\n }\n}\n","import { CmsRadioSender } from './cms-radio-sender'\nimport { CmsRadioReceiver } from './cms-radio-receiver'\nimport { CmsHtmlEditor } from './cms-html-editor'\nimport env from '../../env';\n\n// declare var CKEDITOR: any;\n// import * as $ from 'jquery';\n\n\nexport class CmsPageController {\n settings;//: any;\n sender;//: CmsRadioSender;\n receiver;//: CmsRadioReceiver;\n htmlEditor;//: CmsHtmlEditor;\n\n constructor() {\n this.settings = { root: \"body\", viewOnly: false };\n this.sender = new CmsRadioSender(this);\n this.receiver = new CmsRadioReceiver(this);\n this.htmlEditor = new CmsHtmlEditor(env.cmsEndpoint, this.sender);\n }\n init(options) {\n const $ = window['jQuery'];\n this.settings = Object.assign({}, /*default*/{ root: \"body\", viewOnly: false }, options);\n this.initGlobalVars();\n\n var self = this;\n $(\"[onclick]\").prop(\"onclick\", null);\n $(\"[dblclick]\").prop(\"dblclick\", null);\n $(self.settings.root).off(\"click dblclick\", \"*\");\n $(self.settings.root).on(\"click dblclick\", \"*\", function (e) {\n //$(\".cms_html_editor_img_selected\").removeClass(\"cms_html_editor_img_selected\");\n // console.log($(e.target).hasClass(\"allowClick\"));\n // console.log(e.target);\n\n if (!$(e.target).hasClass(\"allowClick\")) {\n e.stopPropagation();\n e.preventDefault();\n }\n\n if ($(this).attr(\"contenteditable\") === \"true\" ||\n $(\"#cms_html_editor_source_id\").is(\":visible\")) {\n e.stopPropagation();\n return;\n }\n if (!self.settings.viewOnly)\n self.selectItem($(this), false, e.type === \"dblclick\");\n });\n\n if (self.settings.viewOnly) return; // stop the editing logic for viewonly mode.\n\n // ctrl + s for html block\n $(self.settings.root).on('keydown', \"#cmsCurrentEditor\", function (e) {\n if (e.ctrlKey && e.which === 83) {\n //var itemId = $(this).data(\"cms-item-id\");\n //if (!itemId)\n // itemId = $(this).closest(\"[data-cms-item-id]\").data(\"cms-item-id\");\n //window.parent.cms.site.saveHtml(itemId);\n //e.preventDefault();\n\n self.sender.saveAllDirtyHtml(self.getAllDirtyHtml());\n return false;\n }\n });\n }\n\n selectItemFromController(id) {\n const $ = window['jQuery'];\n var item = $(\".cms_item[data-cms-item-id='\" + id + \"']\");\n this.scrollTo(item);\n this.selectItem(item, true);\n }\n\n selectItem($item, fromController, doubleclicked = false) {\n //console.log(\"select item - \" + fromController + \" - \" + doubleclicked);\n //console.log($item);\n var editor = $item.closest(\"[contenteditable]\");\n if (editor.length > 0)\n return;\n var cke_top = $item.closest(\".cke_top\");\n if (cke_top.length > 0)\n return;\n\n this.closeEditingItem();\n //console.log($item);\n if (typeof $item === \"undefined\") return;\n if ($item.length === 0) return;\n this.findItem($item, fromController, 0, doubleclicked);\n }\n\n closeEditingItem() {\n const $ = window['jQuery'];\n //console.log(\"close editing item\");\n $(\"[contenteditable]\").removeAttr(\"contenteditable\");\n $(\"#cms_hovermenu\").remove();\n $(\".cms_editing_item\").removeClass(\"cms_editing_item\");\n\n }\n\n findItem($item, fromController, depth, doubleclicked) {\n if (depth > 100) return false;\n // console.log($item, fromController, depth, doubleclicked)\n if (typeof $item.attr(\"data-cms-html\") !== \"undefined\" && $item.attr(\"data-cms-html\") === \"true\") {\n $item.attr(\"contenteditable\", \"true\");\n this.showHtmlEditor($item);\n }\n if (typeof $item.attr(\"data-cms-item-id\") !== \"undefined\") {\n //$item.attr(\"contenteditable\", \"true\");\n $item.addClass(\"cms_editing_item\");\n if (!fromController) {\n //window.parent.cms.site.selectControllerItem($item.attr(\"data-cms-item-id\"),\n // typeof doubleclicked != \"undefined\" && doubleclicked == true\n //);\n this.sender.selectControllerItem({\n id: $item.attr(\"data-cms-item-id\"),\n openEdit: typeof doubleclicked !== \"undefined\" && doubleclicked === true\n });\n\n }\n\n //show_hovermenu($item);\n\n } else {\n var editableParent = $item.parents(\".cms_item[data-cms-item-id], [data-cms-html]\");\n if (editableParent.length > 0)\n this.findItem(editableParent.first(), fromController, depth + 1, doubleclicked);\n\n }\n }\n\n sameContent(a, b) {\n return a === b;\n }\n\n showHtmlEditor($item) {\n const $ = window['jQuery'];\n var editor = $item;\n //console.log(editor);\n //var $menu = $(\"#cms_html_editor_ctrl\");\n ////$menu.css(\"top\", $item.offset().top - 40);\n ////$menu.css(\"left\", $item.offset().left);\n //$menu.show();\n //initHtmlEditor($item);\n\n if (editor.attr(\"id\") === \"cmsCurrentEditor\") return;\n\n $(\"#cmsCurrentEditor\").attr(\"id\", \"\");\n this.htmlEditor.close(editor);\n\n editor.attr(\"id\", \"cmsCurrentEditor\");\n //editor.data(\"current-content\", editor.html());\n\n this.htmlEditor.show(editor);\n //setHandlers($item);\n\n }\n\n\n initGlobalVars() {\n const $ = window['jQuery'];\n window[\"cmsPage\"] = $.extend({}, window[\"cmsPage\"] || {}, {\n htmleditor: {\n // cmsPage.htmleditor.getAnchors();\n getAnchors: function (opt) {\n //var options = $.extend({}, opt);\n //console.log(options);\n var anchors = [];\n\n $(\"a[name]\").each(function (inx, obj) {\n anchors.push({ id: $(obj).attr(\"id\"), name: $(obj).attr(\"name\") });\n });\n\n $(\"[data-cms-item-name],[data-cms-anchor]\").each(function (inx, obj) {\n if (typeof $(obj).attr(\"data-cms-anchor\") !== \"undefined\" && $(obj).attr(\"data-cms-anchor\") !== \"\" && $(obj).parents(\".owl-item\").length === 0) {\n anchors.push({ id: null, name: $(obj).attr(\"data-cms-anchor\") });\n } else if ($(obj).attr(\"data-cms-item-name\") !== \"\" && $(obj).parents(\".owl-item\").length === 0) {\n anchors.push({ id: null, name: $(obj).attr(\"data-cms-item-name\") });\n }\n });\n\n return anchors;\n }\n }\n });\n }\n\n scrollTo(target) {\n const $ = window['jQuery'];\n if (typeof target === \"undefined\") return;\n if ($(target).length === 0) return;\n var htmlbody = $('html,body');\n var top = 0;\n if ($(target).height() > $(window).height())\n top = $(target).offset().top;\n else {\n top = $(target).offset().top - Math.floor(($(window).height() - $(target).height()) / 2);\n }\n //console.log(top);\n //htmlbody.animate({ scrollTop: top }, 500, 'easeInOutQuint');\n htmlbody.animate({ scrollTop: top }, 500);\n }\n\n getCurrentHtml() {\n const CKEDITOR = window['CKEDITOR'] || {};\n try {\n return CKEDITOR.instances.cmsCurrentEditor.getData();\n } catch (e) { return \"\"; }\n }\n\n getAllDirtyHtml() {\n const $ = window['jQuery'];\n var self = this;\n var htmlChanges = [];\n $(\".dirtyHtml\").each(function (inx, obj) {\n var $section = $(obj);\n var content = $section.is(\"#cmsCurrentEditor\") ? // if the html editor is active, it needs to get the html from the editor.\n self.getCurrentHtml() : $section.html();\n if ($section.is(\"[data-cms-section-id]\")) {\n // section level?\n let $item = $section.closest(\"[data-cms-item-id]\");\n htmlChanges.push({ ItemId: $item.data(\"cms-item-id\"), SectionId: $section.data(\"cms-section-id\"), Content: content });\n } else if ($section.is(\"[data-cms-item-id]\")) {\n // section level?\n let $item = $section;\n htmlChanges.push({ ItemId: $item.data(\"cms-item-id\"), SectionId: \"Content\", Content: content });\n }\n });\n return htmlChanges;\n }\n\n getHtml(itemid: any) {\n const $ = window['jQuery'];\n this.htmlEditor.close();\n var self = this;\n var item = $(\".cms_item[data-cms-item-id='\" + itemid + \"']\");\n\n var formvals = { Content: this.cms_replace_item_html(item) };\n\n //cms_msg_progressing(\"#save_message\", \"Saving...\");\n if ($(\"[data-cms-section-id]\", item).length > 0) {\n $(\"[data-cms-section-id]\", item).each(function (inx, section) {\n var closestItemId = $(section).closest(\".cms_item\").data(\"cms-item-id\");\n if (closestItemId === itemid) {\n var id = $(section).attr(\"data-cms-section-id\");\n formvals[id] = self.cms_replace_item_html($(section)); //.find(\">:first-child\")().html();\n\n }\n });\n }\n return formvals;\n }\n\n cms_replace_item_html(item) {\n return item.html();\n // var $tmp = $(\"
\").html(item.html());\n // if ($tmp.find('.cms-skeleton').length > 0)\n // return $tmp.find('.cms-skeleton').html();\n // else\n // return item.html();\n //tmp.find(\".cms_ctrl_in_editor\").each(function (inx, obj) {\n // var ctrlid = $(obj).attr(\"data-cms-ctrl-id\");\n // $(obj).replaceWith(\"__cms__ctrl:\" + ctrlid + \"__\");\n //});\n //return tmp.html();\n }\n\n}\n","import React, { useEffect } from 'react';\nimport { useRouter } from '../../../components';\nimport { useGet } from '../../../components';\nimport { Item } from '../../items/item';\nimport env from '../../../env';\nimport { loadJs } from '../../../lib/net-loader';\nimport { CmsPageController } from '../../services/cms-page-controller';\nimport { ErrorPopup, Loading } from '../../../components';\n\n// function useQuery() {\n// return new URLSearchParams(useLocation().search);\n// }\n\nexport function EditPage(props) {\n //const [page, setPage] = useState(null);\n\n //const pageId = props.pageId;\n const { query } = useRouter();\n const { cmsViewMode = 'edit', id, publishVer, editVer } = query;\n const pageId = id;\n\n //console.log(pageId, cmsViewMode, env.apiBase, env)\n\n const get = useGet();\n useEffect(() => {\n get.send(env.apiBase + '/api/cms/GetPage/' + pageId + '?cmsViewMode=' + cmsViewMode\n + (publishVer ? '&publishVer=' + publishVer : '')\n + (editVer ? '&editVer=' + editVer : '')\n );\n // eslint-disable-next-line\n }, [pageId]);\n\n if (get.loading()) {\n return \n {sectionItems}\n
\n );\n}\n\n\nfunction Section(props) {\n const item = props.item;\n //const sectionName = item.sectionName;\n const subItems = item.items || [];\n const cmsOption = props.cmsOption || {};\n\n if (!subItems || subItems.length === 0)\n return (<>);\n\n const subItemsElts = subItems.map((subItem, index) =>\n \n closeMenu()}>\n {item.title} \n {subItemsElts && toggleSubmenu(e)}> }\n \n {subItemsElts &&\n }\n \n )\n}\n\nfunction SubMenuItem(props) {\n const item = props.item;\n function closeMenu() {\n props.onCloseMenu();\n }\n\n return (\n \n closeMenu()}>\n {item.title} \n \n \n )\n}","import React, { useState, useEffect } from \"react\";\nimport { useRouter } from \"../../components\";\n//import { navigate, usePath, useLocationChange } from 'raviger';\nimport { SiteLink } from \"../../components\";\nimport { NavBar } from \"./navBar\";\nimport { FaAngleLeft } from \"react-icons/fa\";\nimport { useHistory } from \"../../components\";\nimport utils from \"../../utils\";\n//import env from '../../env';\n//import {LandingTopNav} from './landingTopNav';\n\nexport function TopHeader(props) {\n const { pathname } = useRouter();\n //const path = usePath();\n const [menuOpened, setMenuOpened] = useState(false);\n const [currentLocation, setCurrentLocation] = useState(pathname);\n\n //const [scrolled, setScrolled] = useState(false)\n // const history = useHistory();\n // console.log(history.length, history)\n\n const history = useHistory(pathname);\n\n const routeChanged = (path, history) => {\n //console.log(path, history);\n //console.log(window.location.hash)\n if (typeof window !== `undefined`) {\n const hash = window.location.hash;\n const search = window.location.search;\n history.push(path + hash + search);\n\n if (hash) {\n scrollTo();\n }\n }\n };\n\n useEffect(() => {\n scrollTo();\n }, []);\n\n //const pageChanged = useCallback(path => routeChanged(path, history), [history])\n // useLocationChange(path => {\n // routeChanged(path, history);\n // setCurrentLocation(path);\n // })\n\n useEffect(() => {\n routeChanged(pathname, history);\n setCurrentLocation(pathname);\n // eslint-disable-next-line\n }, [pathname]);\n\n function scrollTo() {\n const hash = window.location.hash;\n if (hash) {\n //console.log(hash)\n setTimeout(() => {\n const anchor = utils.ui.findElement(hash);\n if (anchor) utils.ui.scrollTo(anchor, 500);\n }, 500);\n }\n }\n\n function toggleMenu(e) {\n setMenuOpened(!menuOpened);\n }\n\n function onCloseMenu() {\n setMenuOpened(false);\n }\n\n function goBack(e) {\n //e.preventDefault();\n history.getPrevious();\n //console.log(previousLink)\n }\n\n function backTop() {\n window.scrollTo({ top: 0, behavior: \"smooth\" });\n }\n\n // useEffect(() => {\n // console.log('use history')\n // }, []);\n\n //const womenSite = env.country === 'au' ? 'https://www.vssassoon.com.au' : 'https://www.vssassoon.co.nz'\n\n return (\n <>\n \n {history.history.length > 1 && (\n \n goBack(e)}>\n \n } */}\n\n {/* */}\n\n
\n \n
\n \n
\n \n );\n}\n","import { css } from '@emotion/core';\nimport { mq } from '../../cssInJs'\n\nconst padding = [20, null, null, 30];\nconst paddingHalf = padding.map(x => x ? x / 2 : null);\n\nexport const topNav = {\n nav: css(mq({\n position: 'absolute',\n right: [44, null, null, 56],\n zIndex: '1000',\n overflow: 'hidden',\n display:'none',\n '&.show' : {\n display:'block'\n }\n })),\n skew: css(mq({\n background: 'rgba(255,255,255,0.15)',\n transform: 'skewX(-12deg) translateX(15px)',\n transformOrigin: 'top left',\n paddingRight: padding,\n paddingLeft: paddingHalf,\n })),\n unskew: css(mq({\n transform: 'skewX(12deg)',\n transformOrigin: 'top left',\n height: [24, 44, null, 56],\n display: 'flex',\n alignItems: 'center',\n })),\n link: css(mq({\n paddingLeft: paddingHalf,\n paddingRight: paddingHalf,\n display: 'inline-block',\n fontSize: [12, 16, 16, 18],\n fontWeight: 'bold',\n textTransform: 'uppercase',\n color: 'white'\n }))\n}","/** @jsx jsx */\nimport { jsx } from '@emotion/core'\nimport { topNav } from './LandingTopNavStyle';\nimport { SiteLink } from '../../components';\n\nexport function LandingTopNav({style})\n{\n return \n \n
\n Buy Now \n {/* Contact Us */}\n
\n
\n}","import Hammer from '@egjs/hammerjs'\nimport { gsap } from 'gsap';\n\nexport default class BottomDrawer {\n constructor(el, options = {}) {\n const defaults = {};\n this.settings = Object.assign({}, defaults, options);\n this.slider = el;\n\n // location\n this.currentTranslateY = 0;\n this.size = null;\n this.status = 'expanded';\n this.inititialised = false;\n this.tsEventHandled = new Date();\n }\n\n init() {\n this.size = this.getSize(this.slider);\n //console.log(this.size)\n //this.close()\n this.open()\n\n //\n const hammer = new Hammer.Manager(this.slider);\n hammer.add(new Hammer.Pan({ direction: Hammer.DIRECTION_VERTICAL, threshold: 0 }));\n\n hammer.on('panstart pan panend', e => {\n //console.log(e.type, e)\n if (e.type === 'panend') {\n this.switch(e.deltaY);\n } else if (e.type === 'pan') {\n this.moveDeltaTmp(e.deltaY)\n }\n });\n\n this.initEvent();\n }\n\n initEvent() {\n const bar = this.slider.querySelector('.bottomMenu__bar');\n if (this.inititialised) {\n bar.removeEventListener('click', (e) => this.handleClick(e, this))\n }\n bar.addEventListener('click', (e) => this.handleClick(e, this))\n this.inititialised = true;\n }\n\n handleClick(e, self) {\n e.preventDefault();\n e.stopPropagation();\n const dt = (new Date()) - this.tsEventHandled;\n //console.log('handleClick', dt);\n\n if (dt < 100) return;\n self.switch();\n }\n\n moveDeltaTmp(delta){\n const y = this.getBaseY() + delta;\n //console.log(y,delta)\n\n this.currentTranslateY = y < 0? 0 : (y > this.size.max ? this.size.max : y);\n this.move(this.currentTranslateY);\n }\n\n switch(delta){\n this.tsEventHandled = new Date();\n if ((delta < 0 && this.status === 'expanded') || (delta > 0 && this.status === 'collapsed')) return;\n const targetY = this.getTargetY();\n //console.log('return', this.currentTranslateY, targetY)\n \n gsap.fromTo(this.slider, {y: this.currentTranslateY}, {duration: 0.3, y: targetY, ease: 'power1'});\n this.status = this.status === 'collapsed'? 'expanded' : 'collapsed';\n this.currentTranslateY = targetY;\n }\n\n getBaseY() {\n return this.status === 'collapsed'? this.size.max : this.size.min;\n }\n\n getTargetY() {\n return this.status === 'collapsed'? this.size.min : this.size.max;\n }\n\n getSize(el) {\n const links = el.querySelector('.bottomMenu__links');\n const bar = el.querySelector('.bottomMenu__bar');\n return { min: 0, max: links.offsetHeight, barHeight: bar.offsetHeight };\n }\n\n move(dy) {\n this.slider.style.transform = `translate3d(0, ${dy}px, 0)`;\n }\n\n close() {\n this.status = 'collapsed';\n this.currentTranslateY = this.size.max;\n this.move(this.currentTranslateY);\n }\n\n open() {\n this.status = 'expanded';\n this.currentTranslateY = this.size.min;\n this.move(this.currentTranslateY);\n }\n}","import React, { useLayoutEffect, useRef } from 'react';\nimport { useRouter } from '../../components';\nimport { SiteLink } from '../../components';\nimport BottomDrawer from '../../components/bottomDrawer'\n\nexport function BottomDock(props) {\n const links = [\n { url: '/products', title: 'PRODUCTS' },\n { url: '/warranty', title: 'WARRANTY' },\n { url: '/show-me-how', title: 'SHOW ME HOW' },\n { url: '/contact', title: 'CONTACT' },\n { url: '/where-to-buy', title: 'STOCKISTS' }\n ];\n\n //const path = usePath();\n const { pathname } = useRouter();\n\n const isCurrent = (link) => {\n return pathname && pathname.toLowerCase() === link.toLowerCase();\n }\n\n const linkElts = links.map((link, index) =>\n \n \n
\n {link.title}
\n \n \n );\n\n const bottomMenu = useRef(null);\n useLayoutEffect(() => {\n //console.log('useLayoutEffect');\n const slider = new BottomDrawer(bottomMenu.current);\n setTimeout(() => slider.init(), 1000)\n }, [])\n\n return (\n <>\n \n
\n {/*
*/}\n \n \n
\n \n );\n}\n","import { css } from '@emotion/core';\nimport { mq } from '../../cssInJs'\n\nexport default {\n instagrams: css({\n marginLeft: '-10px',\n marginRight: '-10px',\n display: 'flex',\n justifyContent: 'flex-start',\n flexWrap: 'wrap',\n }),\n singBanner : css(mq({\n backgroundPosition: ['50% 50%',null, null, null, null, '50% 46%']\n }))\n}","import React from 'react';\nimport { SiteLink } from '../../components';\n\nexport function Breadcrumb({ breadcrumb }) {\n\n return (\n \n {breadcrumb.items.map((item, index) => Item(item, index))}\n \n );\n}\n\nfunction Item(item, index) {\n if (item.link) {\n return (\n {item.title} {item.title} \n )\n }\n}","import React, { useState, useEffect } from 'react';\nimport { useGet } from '../../../components';\nimport { Item } from '../../items/item';\nimport { NotFound } from '../../../components';\nimport env from '../../../env';\nimport { useStore } from '../../../store';\nimport { ErrorPopup, Loading } from '../../../components';\n\nconst log = (...args) => {\n //console.log(args);\n}\nconst areEqual = (prevProps, nextProps) => {\n return (prevProps.pageData === nextProps.pageData)\n};\nconst PageMemo = React.memo(Page, areEqual)\n\nexport function ViewPartial({pageOptions = null}) {\n const { dispatch } = useStore();\n const [pageLoaded, setPageLoaded] = useState(false);\n const [data, setData] = useState(null);\n //const path = usePath();\n //log('view page', path);\n const pathname = '/partials/common-footer';\n\n const get = useGet();\n log('0. viewpage ready');\n\n useEffect(() => {\n log('*. start loading')\n setPageLoaded(false);\n get.send(env.apiBase + \"/api/cms/GetPublishedPage?path=\" + pathname);\n // eslint-disable-next-line\n }, [pathname]);\n\n useEffect(() => {\n if (data){\n dispatch({ type: 'SET_PAGE', payload: data.data })\n dispatch({ type: 'SET_MENU', payload: data.menu })\n }\n // eslint-disable-next-line\n }, [data]);\n\n if (get.loading()) {\n return
\n } else if (get.hasErrors()) {\n return
)\n }\n\n return No product found.
;\n return (\n \n \n \n );\n}\n\nfunction Product({ product }) {\n const mainPhoto =\n product.productImages.length > 0\n ? product.productImages[0]\n : { imageUrl: \"/assets/product-empty.png\", alt: product.productName };\n const allPhotos = product.productImages || [];\n //const otherPhotos = product.productImages.length > 0 ? product.productImages.filter(x => !x.isPackage) : [];\n const packagePhotos =\n product.productImages.length > 0\n ? product.productImages.filter((x) => x.isPackage)\n : [];\n\n const popupImages = allPhotos.map((x) => x.imageUrl);\n\n const [isMobile, setIsMobile] = React.useState(utils.site.isMobile());\n\n const [currentTab, setCurrentTab] = React.useState(\n isMobile ? \"wheretobuy\" : \"wheretobuy\"\n );\n const [heroImage, setHeroImage] = React.useState(mainPhoto);\n\n const [toggler, setToggler] = React.useState(false);\n //const [popupImages, setPopupImages] = React.useState();\n const [popupIndex, setPopupIndex] = React.useState(0);\n const country = utils.site.isNZ ? \"New Zealand\" : \"Australia\";\n const schemaImages = product.productImages.map(\n (x) =>\n (country === \"New Zealand\"\n ? \"https://www.conairman.com.au\"\n : \"https://www.conairman.co.nz\") + x.imageUrl\n );\n\n React.useEffect(() => {\n const resized = debounce(() => {\n setIsMobile(utils.site.isMobile());\n }, 1000);\n if (typeof window !== `undefined`) {\n window.addEventListener(\"resize\", resized);\n }\n\n const settingSchemaInterval = setInterval(() => {\n const bvRatingSchema = document.getElementById(\n \"bv-jsonld-bvloader-summary\"\n );\n\n if (bvRatingSchema) {\n const bvRatingSchemaData = JSON.parse(bvRatingSchema.innerHTML);\n const productStructuredData = {\n \"@context\": \"https://schema.org/\",\n \"@type\": \"Product\",\n name: product.productName,\n url:\n (country === \"New Zealand\"\n ? \"https://www.conairman.co.nz\"\n : \"https://www.conairman.com.au\") + product.productUrl,\n description: product.intro,\n sku: product.productCode,\n brand: {\n \"@type\": \"Brand\",\n name: \"ConairMan\",\n },\n gtin13:\n product.barcode && product.barcode !== \"\" ? product.barcode : \"\",\n category: product.category,\n image: schemaImages,\n aggregateRating: bvRatingSchemaData.aggregateRating,\n offers: {\n \"@type\": \"Offer\",\n url:\n (country === \"New Zealand\"\n ? \"https://www.conairman.co.nz\"\n : \"https://www.conairman.com.au\") + product.productUrl,\n priceCurrency: country === \"New Zealand\" ? \"NZD\" : \"AUD\",\n price: product.price + \"\",\n availability: \"https://schema.org/InStock\",\n itemCondition: \"https://schema.org/NewCondition\",\n },\n };\n\n const productSchemaScript = document.createElement(\"script\");\n productSchemaScript.id = \"productSchemaScript\";\n productSchemaScript.type = \"application/ld+json\";\n productSchemaScript.innerHTML = JSON.stringify(productStructuredData);\n\n document.head.removeChild(bvRatingSchema);\n document.body.appendChild(productSchemaScript);\n clearInterval(settingSchemaInterval);\n } else {\n const productStructuredData = {\n \"@context\": \"https://schema.org/\",\n \"@type\": \"Product\",\n name: product.productName,\n url:\n (country === \"New Zealand\"\n ? \"https://www.conairman.co.nz\"\n : \"https://www.conairman.com.au\") + product.productUrl,\n description: product.intro,\n sku: product.productCode,\n brand: {\n \"@type\": \"Brand\",\n name: \"ConairMan\",\n },\n gtin13:\n product.barcode && product.barcode !== \"\" ? product.barcode : \"\",\n category: product.category,\n image: schemaImages,\n offers: {\n \"@type\": \"Offer\",\n url:\n (country === \"New Zealand\"\n ? \"https://www.conairman.co.nz\"\n : \"https://www.conairman.com.au\") + product.productUrl,\n priceCurrency: country === \"New Zealand\" ? \"NZD\" : \"AUD\",\n price: product.price + \"\",\n availability: \"https://schema.org/InStock\",\n itemCondition: \"https://schema.org/NewCondition\",\n },\n };\n\n const productSchemaScript = document.createElement(\"script\");\n productSchemaScript.id = \"productSchemaScript\";\n productSchemaScript.type = \"application/ld+json\";\n productSchemaScript.innerHTML = JSON.stringify(productStructuredData);\n\n document.body.appendChild(productSchemaScript);\n clearInterval(settingSchemaInterval);\n }\n }, 100);\n\n const checkBvReviewSchemaSI = setInterval(() => {\n const bvReviewSchemaScript = document.getElementById(\n \"bv-jsonld-reviews-data\"\n );\n if (bvReviewSchemaScript) {\n document.head.removeChild(bvReviewSchemaScript);\n clearInterval(checkBvReviewSchemaSI);\n }\n }, 100);\n\n return () => {\n if (typeof window !== `undefined`) {\n window.removeEventListener(\"resize\", resized);\n }\n clearInterval(settingSchemaInterval);\n clearInterval(checkBvReviewSchemaSI);\n };\n\n // eslint-disable-next-line\n }, []);\n\n React.useLayoutEffect(() => {\n setTimeout(() => {\n bv.sendEvent(\n \"WhereToBuy\",\n \"WhereToBuyTab_ProductPage\",\n product.productCode\n );\n }, 1500);\n\n // eslint-disable-next-line\n }, []);\n\n // BV\n const onShowReview = React.useCallback((e) => {\n //e.stopPropagation();\n showTab(\"reviews\", true);\n // eslint-disable-next-line\n }, []);\n\n const bv = useBV(product, {\n showReview: onShowReview,\n });\n\n function openPopupImage(imageUrl) {\n const inx = utils.array.findIndex(popupImages, (x) => x === imageUrl);\n setPopupIndex(inx >= 0 ? inx : 0);\n setToggler(!toggler);\n }\n\n function showTab(tab, forceToScroll = false) {\n if (tab === currentTab && isMobile) {\n setCurrentTab(\"\");\n return;\n }\n if (tab === \"wheretobuy\") {\n //bv.sendEvent(\"WhereToBuy\", \"WhereToBuyTab_ProductPage\", product.productCode);\n }\n\n if (tab !== currentTab) {\n gtm.sendGAEvent(\"Product Tab\", \"Select\", tab);\n }\n setCurrentTab(tab);\n scrollTo(\"tab-\" + tab, forceToScroll);\n }\n\n function scrollTo(selector, forceToScroll = false) {\n if (!forceToScroll && !isMobile) return;\n setTimeout(() => {\n const anchor = utils.ui.findElement(selector);\n if (anchor) utils.ui.scrollTo(anchor, 300);\n }, 200);\n }\n\n const slides = allPhotos.map((photo, index) => (\n \n setHeroImage(photo)}\n >\n {/* \n {visibleTabs.map((tab) => (\n
\n
showTab(tab.id)}\n >\n {tab.title}\n \n
\n \n
\n {visibleTabs.map((tab) => (\n
showTab(tab.id)}\n >\n {tab.title}\n \n ))}\n
\n {visibleTabs.map((tab) => (\n
\n \n
\n
\n\n
\n
\n
\n
\n
\n
\n
\n
\n\n {product.intro && (\n
\n )}\n {barcodeCleaned &&
}\n {barcodeCleaned && (\n
\n )}\n {heroImage && heroImage.imageUrl && (\n
\n )}\n\n
\n
\n\n
\n
\n {/*
*/}\n
openPopupImage(heroImage.imageUrl)}\n />\n {allPhotos.length > 1 && (\n \n {slides} \n
\n )}\n \n
\n {product.productName.indexOf(\"i-\") === 0 ? (\n
\n \n {product.productName.toUpperCase().replace(\"I-\", \"i-\")}\n \n \n ) : (\n
\n \n {product.productName}\n \n \n )}\n \n {product.priceText ? product.priceText : \"\"}\n
\n \n Product code: {product.productCode} \n
\n \n \n {product.productStatus === 98 /*Discontinued*/ && (\n
\n This product is now discontinued.\n
\n )}\n
{product.intro}
\n {discoverMoreLinks && (\n
\n {discoverMoreLinks.map((link, index) => (\n
\n \n {link.title} \n \n
\n ))}\n
\n )}\n\n
\n {packagePhotos.map((photo, index) => (\n
\n
openPopupImage(photo.imageUrl)}\n />\n \n ))}\n
\n
\n
\n\n {tabPanels}\n\n
\n
\n
\n
\n );\n}\n\nfunction WhereToBuyTab({ product }) {\n const section = product.whereToBuySection || [];\n return (\n \n {section.length > 0 &&
\n );\n}\n\nfunction RelatedProducts({ products }) {\n //console.log(products)\n if (products.length === 0) return null;\n return (\n \n
RELATED PRODUCTS \n
\n {products.map((product, index) => (\n
\n
\n {stores.map((store) => (\n \n \n {store.storeName} \n {store.buyOnline && (\n \n Buy online \n \n ))}\n \n );\n}\n\nfunction HowtoTab({ product }) {\n const section = product.howToSection || [];\n return \n \n
TECH TALK \n {techSpecs}\n \n )}\n {!hasWarranty && product.warranty && (\n \n
BARCODE \n
{product.barcode}
\n
\n );\n}\n\nfunction SparePart() {\n return (\n \n
SPARE PARTS \n
\n Lost a part to your favourite ConairMan tool? No problem, contact our{\" \"}\n Customer Service team & they’ll sort\n you out.\n
\n
\n
WARRANTY \n
Backed by a {warrantyYear} year warranty*
\n
* {warrantyDetails}
\n
\n
WARRANTY \n
Backed by a {warrantyYear} year warranty
\n
\n
\n {splitLefts.map((x, index) => (\n
\n {x.label} : {x.text}\n
\n ))}\n
\n
\n {splitRights.map((x, index) => (\n
\n {x.label} : {x.text}\n
\n ))}\n
\n
\n
\n {left.map((x, index) => (\n
\n {x.label} : {x.text}\n
\n ))}\n
\n
\n {right.map((x, index) => (\n
\n {x.label} : {x.text}\n
\n ))}\n
\n
\n \n
\n \n
\n \n
\n \n
\n \n );\n}\n\n// function ReviewTab({ product }) {\n// return Coming...
\n// }\n\nfunction ItemList({ section }) {\n //console.log(section)\n return (\n \n {section.map((item, index) => (\n \n );\n}\n\nfunction ItemView({ item }) {\n //console.log(item, item.itemTypeCode, item.itemTypeCode === 'html')\n if (item.itemTypeCode === \"html\") {\n return
;\n }\n if (item.itemTypeCode === \"video\") {\n const video = JSON.parse(item.itemValue);\n\n if (video.video) {\n return (\n \n );\n } else {\n return (\n \n );\n }\n }\n if (item.itemTypeCode === \"link\") {\n let link = JSON.parse(item.itemValue);\n let title = link.title;\n if (!link.title) {\n title = (link.url || \"\").split(\"/\").pop();\n }\n // console.log(link, env.instagramUseFirst);\n if (\n link.linkType === \"instagram\" ||\n (link.url && link.url.indexOf(\"instagram.com\") >= 0)\n ) {\n return (\n \n {env.instagramUseFirst === \"embed\" && link.instagramEmbed ? (\n
\n \n {title}\n \n
\n );\n }\n if (link.url && link.url.indexOf(\"http\") >= 0 && link.imageUrl) {\n return (\n \n {spec.label} : {spec.text}\n
\n );\n }\n return
;\n}\n\nfunction Empty() {\n return (\n \n );\n}\n\nfunction PageTile({ page }) {\n const imageUrl = utils.site.resourcePath(page.imageUrl);\n return (\n \n \n
\n
{page.title}
\n
{page.tileDesc}
\n
READ MORE
\n
\n
\n {\n }}\n />\n
\n\n );\n}","import React from \"react\";\nimport { useRouter } from \"./components\";\nimport { useHistoryStore } from \"./components\";\nimport { useParallax } from \"./components\";\nimport utils from \"./utils\";\n\nexport function AppRouteChanged() {\n const { path } = useRouter();\n const parallax = useParallax();\n const history = useHistoryStore();\n\n React.useLayoutEffect(() => {\n console.log(\"route changed\", path);\n if (typeof window !== `undefined`) {\n parallax.reset();\n const hash = window.location.hash;\n history.push({ path: path });\n\n if (hash) {\n setTimeout(() => {\n const anchor = utils.ui.findElement(hash);\n if (anchor) utils.ui.scrollTo(anchor, 500);\n }, 500);\n } else {\n window.scrollTo(0, 0);\n }\n }\n // eslint-disable-next-line\n }, [path]);\n\n return null;\n}\n","import React from 'react';\nimport { BrowserRouter as Router, Switch, Route, Redirect } from 'react-router-dom';\nimport { useRouter } from './components';\nimport { StoreProvider } from './store';\nimport { ViewPage } from './cms/pages/viewPage/viewPage';\nimport { EditPage } from './cms/pages/editPage/editPage';\nimport { TopHeader } from './layout/topHeader/topHeader';\nimport { LandingTopNav } from './layout/topHeader/landingTopNav';\n//import { Footer } from './layout/footer/footer';\nimport { BottomDock } from './layout/bottomDock/bottomDock';\nimport { ProductView } from './site/product/productView';\n// import { BlogView } from './site/blog/blogView';\nimport { useScrollPosition } from '@n8tb1t/use-scroll-position';\n//import { useParallax } from './components';\nimport { AppVersionPage } from './components';\nimport { MediaQueryStatus } from './components';\nimport { CommonVideoPopup } from \"./layout/popup/commonVideoPopup\";\nimport { HelmetProvider } from 'react-helmet-async';\nimport { AppRouteChanged } from './AppRouteChanged';\nimport { checkUpdate } from './lib/service-worker/swHelper';\nimport AOS from 'aos';\n\nfunction AppLayout(props) {\n const { pathname } = useRouter();\n\n React.useEffect(() => {\n const fetchData = async () => {\n await checkUpdate(); \n }\n fetchData();\n }, [pathname]);\n\n React.useEffect(() => {\n AOS.init({\n duration : 1200\n //delay:400,\n //once:true\n });\n\n }, []);\n\n //const [scrolled, setScrolled] = useState(false)\n //const path = usePath();\n //const routeResult = useRoutes(routes);\n\n // const parallax = useParallax();\n // //console.log(path, routeResult);\n // const routeChanged = (path) => {\n // //console.log(path);\n // parallax.reset();\n // }\n\n useScrollPosition(({ prevPos, currPos }) => {\n //console.log(currPos.x)\n //console.log(currPos.y);\n if (currPos.y > 90) {\n document.querySelector('body').classList.add('scrolled')\n } else {\n document.querySelector('body').classList.remove('scrolled')\n }\n //setScrolled(currPos.y > 90)\n }, [], null, true)\n\n //const pageChanged = useCallback(path => routeChanged(path), [])\n //useLocationChange((path) => { routeChanged(path, history)})\n //useLocationChange(path => routeChanged(path))\n\n return (\n \n
\n
\n
\n
\n\n \n \n \n \n \n \n
\n {/*
*/}\n
\n {/*
*/}\n
\n
\n
\n
\n \n \n \n \n \n );\n}\n\nexport default App;\n","// This optional code is used to register a service worker.\n// register() is not called by default.\n\n// This lets the app load faster on subsequent visits in production, and gives\n// it offline capabilities. However, it also means that developers (and users)\n// will only see deployed updates on subsequent visits to a page, after all the\n// existing tabs open on the page have been closed, since previously cached\n// resources are updated in the background.\n\n// To learn more about the benefits of this model and instructions on how to\n// opt-in, read https://bit.ly/CRA-PWA\n\nconst isLocalhost = Boolean(\n window.location.hostname === 'localhost' ||\n // [::1] is the IPv6 localhost address.\n window.location.hostname === '[::1]' ||\n // 127.0.0.0/8 are considered localhost for IPv4.\n window.location.hostname.match(\n /^127(?:\\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/\n )\n);\n\nlet serviceUpdateCheckerInterval = null;\n\nexport function register(config) {\n if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {\n // The URL constructor is available in all browsers that support SW.\n const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);\n if (publicUrl.origin !== window.location.origin) {\n // Our service worker won't work if PUBLIC_URL is on a different origin\n // from what our page is served on. This might happen if a CDN is used to\n // serve assets; see https://github.com/facebook/create-react-app/issues/2374\n return;\n }\n\n window.addEventListener('load', () => {\n const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;\n\n if (isLocalhost) {\n // This is running on localhost. Let's check if a service worker still exists or not.\n checkValidServiceWorker(swUrl, config);\n\n // Add some additional logging to localhost, pointing developers to the\n // service worker/PWA documentation.\n navigator.serviceWorker.ready.then(() => {\n console.log(\n 'This web app is being served cache-first by a service ' +\n 'worker. To learn more, visit https://bit.ly/CRA-PWA'\n );\n });\n } else {\n // Is not localhost. Just register service worker\n registerValidSW(swUrl, config);\n }\n });\n }\n}\n\nfunction registerValidSW(swUrl, config) {\n navigator.serviceWorker\n .register(swUrl, {updateViaCache: 'none'})\n .then(async registration => {\n // https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerRegistration\n console.log('Service Worker registration successful with scope: ', registration.scope);\n if (registration && registration.waiting) {\n registration.waiting.postMessage({ type: 'SKIP_WAITING' });\n }\n \n // Regular checking service worker\n if (serviceUpdateCheckerInterval) { try { clearInterval(serviceUpdateCheckerInterval) } catch (e) { } }\n serviceUpdateCheckerInterval = setInterval(() => {\n console.log('Checking SW updates...')\n registration.update();\n }, 1/*hour(s)*/ * 10/*minutes*/ * 60 * 1000);\n\n window.updateSW = function() {\n console.log('Checking SW updates... (force)')\n return registration.update();\n }\n \n // When the user asks to refresh the UI, we'll need to reload the window\n var preventDevToolsReloadLoop = false;\n \n const oldSw = (await navigator.serviceWorker.getRegistration())?.active?.state;\n console.log(oldSw, registration)\n navigator.serviceWorker.addEventListener('controllerchange', async function (ev) {\n const newSw = (await navigator.serviceWorker.getRegistration())?.active?.state;\n console.log('Service Worker controller change', ev)\n console.log(oldSw, newSw)\n // Ensure refresh is only called once.\n // This works around a bug in \"force update on reload\".\n if (preventDevToolsReloadLoop) return;\n \n\n if(oldSw === 'activated' && newSw === 'activating') {\n preventDevToolsReloadLoop = true;\n console.log('Reloading...')\n window.location.reload();\n }\n\n //window.location.reload();\n });\n\n registration.onupdatefound = () => {\n console.log('registration.onupdatefound', registration.installing)\n const installingWorker = registration.installing;\n if (installingWorker == null) {\n return;\n }\n installingWorker.onstatechange = () => {\n if (installingWorker.state === 'installed') {\n if (navigator.serviceWorker.controller) {\n // At this point, the updated precached content has been fetched,\n // but the previous service worker will still serve the older\n // content until all client tabs are closed.\n console.log(\n 'New content is available and will be used when all ' +\n 'tabs for this page are closed. See https://bit.ly/CRA-PWA.'\n );\n\n // Execute callback\n if (config && config.onUpdate) {\n config.onUpdate(registration);\n }\n } else {\n // At this point, everything has been precached.\n // It's the perfect time to display a\n // \"Content is cached for offline use.\" message.\n console.log('Content is cached for offline use.');\n\n // Execute callback\n if (config && config.onSuccess) {\n config.onSuccess(registration);\n }\n }\n }\n };\n };\n })\n .catch(error => {\n console.error('Error during service worker registration:', error);\n });\n}\n\n\nfunction checkValidServiceWorker(swUrl, config) {\n // Check if the service worker can be found. If it can't reload the page.\n fetch(swUrl, {\n headers: { 'Service-Worker': 'script' }\n })\n .then(response => {\n // Ensure service worker exists, and that we really are getting a JS file.\n const contentType = response.headers.get('content-type');\n if (\n response.status === 404 ||\n (contentType != null && contentType.indexOf('javascript') === -1)\n ) {\n // No service worker found. Probably a different app. Reload the page.\n navigator.serviceWorker.ready.then(registration => {\n registration.unregister().then(() => {\n console.log('Reloading... No SW found')\n window.location.reload();\n });\n });\n } else {\n // Service worker found. Proceed as normal.\n registerValidSW(swUrl, config);\n }\n })\n .catch(() => {\n console.log(\n 'No internet connection found. App is running in offline mode.'\n );\n });\n}\n\nexport function unregister() {\n if ('serviceWorker' in navigator) {\n navigator.serviceWorker.ready.then(registration => {\n registration.unregister();\n });\n }\n}\n","import 'react-app-polyfill/ie11';\nimport 'react-app-polyfill/stable';\nimport './polyfill';\n\nimport React from 'react';\nimport ReactDOM from 'react-dom';\nimport './_scss/index.scss';\nimport App from './App';\nimport * as serviceWorker from './serviceWorker';\nimport { forceUpdateFlagged, markUpdate } from './lib/service-worker/swHelper';\n\nReactDOM.render(\n {/*
\n
\n
\n
\n\n {product.intro &&
}\n {barcodeCleaned &&
}\n {barcodeCleaned &&
}\n {imageUrl &&
}\n
\n
*/}\n\n
\n
\n \n {product.productName}\n
\n
\n {product.priceText ? product.priceText : ''}\n
\n \n {/*
*/}\n
![\"Loading](\"/assets/loading.svg\")
\r\n {/* 
\n 
\n 
\n ![\"\"](\"/assets/social/instagram.png\")
\n\n and view our latest videos ![\"\"](\"/assets/social/youtube.png\")
\n