- \n
{this.props.section.Title.Value}
\n {this.props.section.AnswersQuestions.map((AnswersQuestions) => {\n return\n {
\n )\n }\n}\n\nexport default FAQPageContent;\n","import React, { Component } from 'react';\n\nclass Breadcrumbs extends Component {\n constructor(props) {\n super(props);\n }\n render() {\n return (\n \n
\n \n {this.props.faqJson.Sections.map((section) => {\n return
\n \n {this.props.faqJson.ArticleBoxes ? this.props.faqJson.ArticleBoxes.map((box) => {\n return
\n {\n
\n ) : null}\n - \n {this.props.breadcrumbProps.map((breadcrumb, index) => {\n return (\n
- \n {(index === this.props.breadcrumbProps.length - 1) ? (\n {breadcrumb.Name}\n ) : (\n {breadcrumb.Name}\n )}\n \n )\n })}\n
\n
;\n }\n}\nexport default DocumentOverlay;\n","\"use strict\";\n\nimport PropTypes from 'prop-types';\n\nexport default PropTypes.shape({\n \"Left\": PropTypes.number.isRequired,\n \"Top\": PropTypes.number.isRequired\n});\n","\"use strict\";\n\nimport React, {Component} from \"react\";\nimport PropTypes from \"prop-types\";\n\nclass Line extends Component {\n getLineStyle() {\n return {\n \"borderBottom\": \"none\",\n \"borderLeft\": \"none\",\n \"borderRight\": \"none\",\n \"borderTop\": \"1px solid rgba(11,98,120,0.9)\",\n \"height\": 0,\n \"left\": 0,\n \"margin\": 0,\n \"padding\": 0,\n \"pointerEvents\": \"none\",\n \"position\": \"absolute\",\n \"top\": 0,\n \"transform\": \"rotate(\" + this.getLineAngle() + \"deg)\",\n \"transformOrigin\": \"0 0\",\n \"width\": this.getLineLength()\n };\n }\n getLineAngle() {\n return Math.atan2(this.props.EndY - this.props.StartY, this.props.EndX - this.props.StartX) * 180 / Math.PI;\n }\n getLineLength() {\n var xLength = this.props.EndX - this.props.StartX,\n yLength = this.props.EndY - this.props.StartY;\n\n return Math.sqrt(Math.pow(xLength, 2) + Math.pow(yLength, 2));\n }\n propTypes = {\n \"EndX\": PropTypes.number.isRequired,\n \"EndY\": PropTypes.number.isRequired,\n \"StartX\": PropTypes.number.isRequired,\n \"StartY\": PropTypes.number.isRequired\n }\n render() {\n return \n
\n \n \n
\n \n {this.props.children}\n
\n ;\n }\n};\nexport default Line;\n","\"use strict\";\n\nimport PropTypes from 'prop-types';\n\nexport default PropTypes.shape({\n \"FieldEditor\": PropTypes.shape({\n \"Class\": PropTypes.string,\n \"Display\": PropTypes.string,\n \"Id\": PropTypes.string,\n \"IsActive\": PropTypes.bool.isRequired,\n \"IsRoot\": PropTypes.bool,\n \"Type\": PropTypes.string,\n \"TypeName\": PropTypes.string\n }).isRequired,\n \"Value\": PropTypes.any.isRequired\n});\n","\"use strict\";\n\n/* eslint new-cap: 0 */\n\n//import Draggabilly from \"imports?define=>false!draggabilly\";\nimport ElementOffset from \"./ElementOffsetPropTypes\";\nimport Line from \"./Line\";\nimport NowellonEditableFieldPropType from \"./NowellonEditableFieldPropType\";\nimport React, {Component} from \"react\";\nimport shouldComponentUpdate from \"omniscient/shouldupdate\";\nimport PropTypes from \"prop-types\";\n\nclass NowellonFieldEditor extends Component {\n draggabilly = null;\n minZIndex = 501;\n\n getEditButtonStyle() {\n return {\n \"color\": \"rgb(245,230,60)\",\n \"cursor\": \"pointer\",\n \"fontSize\": \"12px\",\n \"lineHeight\": \"18px\",\n \"textDecoration\": \"none\"\n };\n }\n getFirstEditButtonStyle() {\n return {\n \"color\": \"rgb(245,230,60)\",\n \"cursor\": \"pointer\",\n \"fontSize\": \"12px\",\n \"lineHeight\": \"18px\",\n \"textDecoration\": \"none\",\n \"margin\": \"0 20px 0 0\"\n };\n }\n getEditorStyle() {\n return {\n \"backgroundColor\": \"rgba(11,98,120,0.9)\",\n \"borderRadius\": \"0px 5px 5px 5px\",\n \"cursor\": \"move\",\n \"padding\": 5,\n \"position\": \"relative\",\n \"pointerEvents\": \"auto\"\n };\n }\n getEditorWrapperStyle() {\n return {\n \"display\": \"block\",\n \"left\": Math.round(this.props.Dimensions.Offset.Left),\n \"position\": \"absolute\",\n \"top\": Math.round(this.props.Dimensions.Offset.Top),\n \"zIndex\": Math.max(this.minZIndex, this.props.Dimensions.ZIndex + 1),\n \"pointerEvents\": \"none\"\n };\n }\n getInitialState() {\n return {\n \"DragOffsetLeft\": 0,\n \"DragOffsetTop\": 0\n };\n }\n onClick(EditableField, evt) {\n evt.preventDefault();\n\n this.props.OnClick(EditableField);\n }\n onDrag() {\n this.setState({\n \"DragOffsetLeft\": this.draggabilly.position.x,\n \"DragOffsetTop\": this.draggabilly.position.y\n });\n }\n getComponentInfo() {\n let childName = \"\";\n let parentName = \"\";\n let divider = \"\";\n if (this.props.info.child) {\n childName = this.props.info.child.name || (\"<\" + this.props.info.child + \">\");\n }\n if (this.props.info.parent !== \"CMS\") {\n parentName = this.props.info.parent;\n }\n if (childName && parentName) {\n divider = \" in \";\n }\n return childName + divider + parentName;\n\n }\n propTypes = {\n \"Dimensions\": PropTypes.shape({\n \"Height\": PropTypes.number.isRequired,\n \"Offset\": ElementOffset.isRequired,\n \"Width\": PropTypes.number.isRequired,\n \"ZIndex\": PropTypes.number.isRequired\n }),\n \"FieldList\": PropTypes.arrayOf(NowellonEditableFieldPropType).isRequired,\n \"OnClick\": PropTypes.func.isRequired\n }\n render() {\n return
\n \n
;\n }\n shouldComponentUpdate = shouldComponentUpdate\n}\nexport default NowellonFieldEditor;\n","// import $ from \"jquery\";\nimport DocumentOverlay from \"./DocumentOverlay\";\nimport NowellonEditableFieldPropType from \"./NowellonEditableFieldPropType\";\nimport React, { Component } from \"react\";\n\n// todo: this doesnt work, restore and FIX later\n\nclass NowellonFieldEditorDocumentOverlay extends Component {\n componentDidMount() {\n // iframe onLoad is not enough for some reason\n // $(this.refs.frame).on(\"load\", this.onFrameLoad);\n }\n getFrameUrl() {\n return nv.url(\"admin/pagecontent/edit/\" + this.props.Editor.FieldEditor.Id + \"?field=\" + this.props.Editor.FieldEditor.TypeName + \"&isroot=\" + this.props.Editor.FieldEditor.IsRoot);\n }\n onFrameCloseClick(evt) {\n evt.preventDefault();\n\n this.props.OnClose();\n }\n onFrameLoad() {\n // var $frameDocument,\n // angularScope,\n // contentWindow = this.refs.frame.contentWindow;\n\n // $frameDocument = $(contentWindow.document);\n // angularScope = contentWindow.angular.element($frameDocument.find(\".container\").get(0)).scope();\n\n // angularScope.$on(\"saved\", () => {\n // if (window.location.hash) {\n // window.location.reload(true);\n // } else {\n // window.location.href = window.location.href;\n // }\n\n // this.onFrameCloseClick();\n // });\n\n // $frameDocument.on(\"click\", \"#nowellon-pagecontent-popup-cancel\", this.onFrameCloseClick);\n // $frameDocument.on(\"click\", \"#nowellon-pagecontent-popup-close\", this.onFrameCloseClick);\n }\n propTypes = {\n \"Editor\": NowellonEditableFieldPropType.isRequired,\n \"OnClose\": React.PropTypes.func.isRequired\n }\n render() {\n return - \n
- {this.getComponentInfo()} {// eslint-disable-line no-nested-ternary\n }{this.props.FieldList.map((EditableField, fieldIndex) =>
- \n \n {EditableField.FieldEditor.Display}\n \n )}\n
\n
\n );\n }\n}\nexport default BottonPusheSalonFinder;\n","import React, { Component } from 'react';\nimport BottonPusheSalonFinder from './BottonPusheSalonFinder';\nimport PushInstagram from '../Shared/PushInstagram';\nimport Push from 'Shared/Push';\n\nclass BottonPushes extends Component {\n constructor(props) {\n super(props);\n }\n\n render() {\n const {salonCountries,\n countryCode,\n bottonPushes,\n instagram,\n buttonPusheClass,\n salonFinder\n } = this.props;\n const noSF = salonCountries && salonFinder.SalonFinderTile.length ? \"\" : \"no-SF\";\n return (\n \n
\n {this.props.salonFinderTile.Title.Value}
\n \n\n \n \n
\n \n \n \n
\n \n {this.props.salonFinderTile.ButtonText.Value}\n \n
\n \n {this.props.salonCountries && this.props.salonFinder.SalonFinderTile.length && this.props.countryCode !== \"ru-RU\" ? (\n
\n );\n }\n}\nBottonPushes.defaultProps = {\n countryCode: 'en-EN'\n};\nexport default BottonPushes;\n","import React, { Component } from \"react\";\nimport Picture from \"../Shared/Picture\";\nimport Breadcrumbs from \"Header/Breadcrumbs\";\nimport isBreadcrumb from \"Shared/isBreadcrumb\";\n\nclass Header extends Component {\n onHeaderClick = () => {\n let isProductPage =\n window.location.href.indexOf(\"hair-loss-products\") > 0;\n // let productHeader = document.getElementsByClassName(\"main-visual\");\n if (isProductPage) {\n let url = this.props.topHeader.SliderButtons[0].ButtonTarget.Value;\n window.location.href = url;\n }\n };\n\n render() {\n let isProductPage = window.location.href.indexOf(\"hair-loss-products\") > 0;\n\n const {\n SliderImage,\n SliderImageAlt,\n Title,\n Subtitle,\n SliderButtons,\n VisualHeader,\n VisualParagraph,\n } = this.props.topHeader;\n\n return VisualHeader.Value !== \"\" ? (\n \n \n \n {VisualParagraph.Value !== \"\" ? (\n \n ) : null}\n
\n ) : null}\n \n ) : (\n \n {SliderImage.Value[0] != null ? (\n
\n {VisualHeader.Value !== \"\" ? (\n \n \n \n \n {Title.Value}\n \n {Subtitle.Value != \"\" && (\n
\n {SliderButtons.length > 0 ? (\n \n {SliderButtons[0].ButtonText.Value}\n \n ) : null}\n \n
\n ) : null}\n \n \n {Title.Value}\n \n {Subtitle.Value != \"\" && (\n \n )}\n
\n {SliderButtons.length > 0 ? (\n \n \n \n
\n {SliderButtons.length > 0 ? (\n \n {SliderButtons[0].ButtonText.Value}\n \n ) : null}\n \n
\n )}\n \n );\n }\n}\nexport default Header;\n","import React from 'react';\nimport { LazyLoadComponent } from 'react-lazy-load-image-component';\nimport useMatchMedia from \"hooks/useMatchMedia\";\n\nconst Picture = (props) => {\n const {\n src,\n className,\n alt,\n visibleByDefault,\n mobileWidth,\n mobileHeight\n } = props;\n\n const getImageType = (image) => {\n if (/(\\.|\\,)png(--resize\\,\\d{2,}\\,\\d{2,})*$/i.test(image)) {\n return \"image/png\";\n }\n if (/(\\.|\\,)gif(--resize\\,\\d{2,}\\,\\d{2,})*$/i.test(image)) {\n return \"image/gif\";\n }\n if (/(\\.|\\,)jpg(--resize\\,\\d{2,}\\,\\d{2,})*$/i.test(image)) {\n return \"image/jpeg\";\n }\n if (/(\\.|\\,)webp(--resize\\,\\d{2,}\\,\\d{2,})*$/i.test(image)) {\n return \"image/webp\";\n }\n return \"\";\n }\n const isMobile = useMatchMedia('(max-width: 768px)');\n\n if (src.length > 0) {\n const mobileImage = src[1].Url;\n const tabletImage = src[2].Url;\n const desktopImage = src[0].Url;\n const mobileWebpImage = src[1].WebpUrl;\n const tabletWebpImage = src[2].WebpUrl;\n const desktopWebpImage = src[0].WebpUrl;\n\n return (\n \n \n )}\n
\n {SliderButtons.length > 0 ? (\n \n
\n )\n }\n}\n\nexport default Push;\n","import React, {Component} from 'react';\n\nclass PushInstagram extends Component {\n constructor(props) {\n super(props);\n this.state = {\n instagramImages: this.props.instagram,\n instagramLength: this.props.instagram.length,\n instagramId: this.props.instagram[(this.props.instagram.length - 1)].Id,\n instagramNextId: this.props.instagram[(this.props.instagram.length - 2)].Id,\n pos : 1,\n intervalId: null,\n instagramCurrent: this.props.instagram.length - 1,\n instagramNext: this.props.instagram.length - 2\n };\n }\n componentDidMount() {\n var iCurrent = document.getElementById(this.props.instagram[(this.props.instagram.length - 1)].Id);\n iCurrent.className += \" active\";\n this.start();\n }\n start() {\n setTimeout(() => this.startInterval(), 10000);\n }\n nextImage() {\n this.setState({\n instagramNext: this.state.instagramNext - 1,\n instagramCurrent: this.state.instagramCurrent - 1,\n }, () => this.changeElem(this.state.instagramNext))\n setTimeout(() => this.startInterval(), 5000);\n }\n changeElem(elemid) {\n clearInterval(this.state.intervalId);\n }\n chengeOpacity(instagramCurrent, instagramNext) {\n var iCurrent = document.getElementById(instagramCurrent);\n var iNext = document.getElementById(instagramNext);\n if(iCurrent.style.opacity < 0){\n clearInterval(this.state.intervalId);\n }else{\n iCurrent.className = \"push-instagram-item\";\n iNext.className += \" active\";\n // iCurrent.style.opacity = 0;\n // iNext.className = 1;\n this.nextImage();\n }\n }\n startInterval = () => {\n if(this.state.instagramNext >= 0) {\n var instagramCurrent = this.props.instagram[this.state.instagramCurrent].Id;\n var instagramNext = this.props.instagram[this.state.instagramNext].Id;\n var intervalId = setInterval(() => {\n this.chengeOpacity(instagramCurrent, instagramNext);\n }, 1000);\n this.setState({ // eslint-disable-line\n intervalId: intervalId,\n });\n }else{\n clearInterval(this.state.intervalId);\n }\n }\n\n componentWillUnmount() {\n // use intervalId from the state to clear the interval\n clearInterval(this.state.intervalId);\n }\n render() {\n return (\n \n {this.props.tile.Title.Value !== \"\" ?\n
\n {this.props.tile.Image.Value !== \"\" ? (\n {this.props.tile.Title.Value}
\n :null}\n {this.props.tile.Subtitle.Value !== \"\" ?\n \n :null}\n {this.props.tile.ButtonUrl.Value !== \"\" ?\n {this.props.tile.ButtonText.Value}\n :null}\n\n
\n )\n }\n}\n\nexport default PushInstagram;\n","const isBreadcrumb = breadcrumbs => {\n if (breadcrumbs === undefined) {\n return undefined;\n }\n else {\n return breadcrumbs.Breadcrumb;\n }\n}\n\nexport default isBreadcrumb;\n","import React from 'react';\r\nimport ReactDOM from 'react-dom';\r\nimport FAQPageContent from './FAQPageContent';\r\n\r\nif (document.getElementById(\"faqPageIndexJson\") !== null) {\r\n var faqPageIndexJson = JSON.parse(document.getElementById(\"faqPageIndexJson\").textContent); // eslint-disable-next-line\r\n var instagram = JSON.parse(document.getElementById(\"instagram\").textContent); // eslint-disable-next-line\r\n var salonCountries = JSON.parse(document.getElementById(\"salonCountries\").textContent); // eslint-disable-next-line\r\n var layout = JSON.parse(document.getElementById(\"Layout\").textContent); // eslint-disable-next-line\r\n var breadcrumbs = JSON.parse(document.getElementById(\"breadcrumbJson\").textContent); // eslint-disable-next-line\r\n ReactDOM.render(\n ![\"nioxin\"](\"/m/homepage/nioxin-logo.png\")
\n
\n \n - \n {this.state.instagramImages.map((insta) => {\n return
- \n \n
\n
{insta.Likes}
\n \n \n })}\n