{"version":3,"sources":["webpack:///./src/templates/shop/main/filterSelect.tsx","webpack:///./src/templates/shop/main/customSizeInput.tsx","webpack:///./src/templates/shop/main/formatSelect.tsx","webpack:///./src/templates/shop/main/effectSelect.tsx","webpack:///./src/templates/shop/main/imageEditor.tsx","webpack:///./src/templates/shop/main/imageUploader.tsx","webpack:///./src/templates/shop/main/priceView.tsx","webpack:///./src/templates/shop/main/materialSelect.tsx","webpack:///./src/templates/shop/main/optionSelect.tsx","webpack:///./src/templates/shop/main/optionGroups.tsx","webpack:///./src/templates/shop/index.tsx"],"names":["FilterSelect","inject","observer","handleChange","t","store","_this","props","orderStore","currentItem","filter","value","format","material","formats","f","houding","onChange","translate","data","squidexTexts","txtPortrait","txtLandscape","txtSquare","componentWillMount","this","render","_this2","isCustomSize","react","gatsby_browser_entry","query","filters","Array","from","Set","map","label","defaultValue","find","id","className","txtOrientation","selectList","items","_2558520525","React","CustomSizeInput","handleHeightChange","height","parseInt","getPriceInfo","handleWidthChange","width","uiStore","texts","visitorStore","logEvent","INPUT_CUSTOM_FORMAT_EVENT","isNaN","getCustomPrice","then","result","showModal","txtGenericErrorHeader","txtGenericErrorBody","input","txtLength","initialValue","txtWidth","_938410506","FormatSelect","handleFormatChange","rawPrice","price","SELECT_FORMAT_EVENT","name","txtFormat","_1548830740","EffectSelect","handleEffectChange","SELECT_EFFECT_EVENT","effect","effects","squidexConfig","_ref","camanMethod","placeholderText","txtChooseEffect","e","txtEffect","placeholder","_1794775503","ImageEditor","_React$Component","call","renderCropper","index_module","dist_default","a","image","thumb","crop","state","cropLoc","aspect","aspectRatio","zoom","onCropChange","handleCropChange","onZoomChange","handleZoomChange","onCropComplete","handleCropComplete","showGrid","style","containerStyle","position","setState","area","pixels","x","y","onEffectChange","handleClearImage","onImageReset","setTimeout","_this3","txtEditPicture","txtEditPictureInstructions","effectSelect_EffectSelect","components_button","size","color","inversed","btnChangePicture","onClick","_3899787757","ImageUploader","dropZone","maxSize","handleUploadClick","open","handleFileUpload","acceptedFiles","rejectFiles","file","reader","FileReader","onload","onImageUploaded","readAsDataURL","hasFileSizeError","hasFileTypeError","config","uploadLimit","iv","getLanguageValue","txtUploadInstructions","es","accept","ref","d","onDrop","txtFileTooLargeError","txtFileIncorrectTypeError","components","btnShopUpload","_4173677658","PriceView","txtYourPrice","toFixed","_99051849","MaterialSelect","handleMaterialChange","SELECT_MATERIAL_EVENT","options","length","materials","shopStore","current","m","undefined","txtMaterial","txtChooseMaterial","_2875427546","OptionSelect","handleOptionChange","SELECT_OPTION_EVENT","opt","optionGroups","some","og","o","indexOf","txtOption","_3082900281","OptionGroups","handleChooseOneChange","groupIndex","group","currentSelectedOption","findIndex","push","splice","handleChooseAnyChange","option","checked","i","groups","type","key","defaultItem","choiceRequired","txtChooseOneNoOptionSelected","selectedIndex","_35123109","ShopPage","initializerDefineProperty_default","_descriptor","assertThisInitialized_default","camanApi","maybeRenderLoader","fetching","imgLoading","loader","handleUploadStart","UPLOAD_IMAGE_EVENT","createThumb","createThumbAsync","component","Promise","res","renderInCaman","img","resize","naturalWidth","naturalHeight","THUMBNAIL_MAX","toBase64","appendImagePreview","Image","w","Math","round","h","canvas","document","getElementById","context","getContext","clearRect","save","drawImage","restore","src","handleShowPreview","previewOpen","handleHidePreview","handleItemSubmit","validate","submitItemAsync","asyncToGenerator_default","regenerator_default","mark","_callee","wrap","_context","prev","next","submitItem","ADD_IMAGE_TO_CART_EVENT","Object","assign","NAVIGATE_EVENT","location","href","pageCartSlug","toLowerCase","navigate","stop","camanFn","fn","finishInit","handleImageReset","CHANGE_IMAGE_EVENT","allowImageUpload","squidexGalleryOverviewPage","slug","txtValidationErrorHeader","txtNoMaterialError","customSizes","txtNoHeightError","txtNoWidthError","txtNoFormatError","txtNoImageError","createElement","Caman","PAGE_VIEW_EVENT","pageType","componentDidMount","hasImage","window","aspectSelectRow","customSizeInput_CustomSizeInput","filterSelect_FilterSelect","formatSelect_FormatSelect","seo","subTitle","pageShopIndex","display","txtChooseProduct","materialSelect_MaterialSelect","optionSelect_OptionSelect","optionGroups_OptionGroups","priceView_PriceView","txtChoosePicture","hasThumb","imageEditor_ImageEditor","imageUploader_ImageUploader","onStartUploading","btnAddToCart","txtImagePreview","btnBackToEditImage","observable","pageQuery"],"mappings":"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","file":"component---src-templates-shop-index-tsx-bafda2193ce22f59adff.js","sourcesContent":["\r\nimport * as React from \"react\";\r\nimport { StaticQuery, graphql } from \"gatsby\"\r\nimport { inject, observer } from \"mobx-react\";\r\n\r\nimport { OrderStore, VisitorStore } from \"stores\";\r\nimport SelectList, { SelectListItem } from \"../../../components/selectList\";\r\nimport { SELECT_FORMAT_FILTER_EVENT } from \"../../../utils/constants\";\r\n\r\nexport interface FilterSelectProps {\r\n onChange?: (filter: string) => void;\r\n orderStore?: OrderStore;\r\n visitorStore?: VisitorStore;\r\n}\r\n\r\n@inject(\"orderStore\", \"visitorStore\")\r\n@observer\r\nexport default class FilterSelect extends React.Component {\r\n componentWillMount() {\r\n const store: OrderStore = this.props.orderStore;\r\n if (store.currentItem.material) {\r\n const filter = store.currentItem.material.formats[0].houding;\r\n if (!store.currentItem.filter) {\r\n store.currentItem.filter = filter;\r\n }\r\n }\r\n }\r\n render() {\r\n const orderStore: OrderStore = this.props.orderStore;\r\n if (!orderStore.currentItem.material || orderStore.currentItem.isCustomSize) {\r\n return null;\r\n }\r\n return (\r\n {\r\n const filters = Array.from(new Set(orderStore.currentItem.material.formats.map(f => f.houding)))\r\n .map(f => ({ label: this.translate(f, data), value: f }))\r\n const defaultValue = filters.find(f => f.value === orderStore.currentItem.filter);\r\n \r\n return (\r\n
\r\n \r\n \r\n
\r\n )}\r\n } />\r\n )\r\n }\r\n handleChange = (t: SelectListItem) => {\r\n const store: OrderStore = this.props.orderStore;\r\n store.currentItem.filter = t.value;\r\n store.currentItem.format = store.currentItem.material.formats.filter(f => f.houding === t.value)[0];\r\n if (this.props.onChange) {\r\n this.props.onChange(t.value);\r\n }\r\n }\r\n translate = (filter: string, data: any) => {\r\n if (filter == \"Staand\") {\r\n return data.squidexTexts.txtPortrait[process.env.GATSBY_LANGUAGE];\r\n }\r\n if (filter == \"Liggend\") {\r\n return data.squidexTexts.txtLandscape[process.env.GATSBY_LANGUAGE];\r\n }\r\n if (filter == \"Vierkant\") {\r\n return data.squidexTexts.txtSquare[process.env.GATSBY_LANGUAGE];\r\n }\r\n return filter;\r\n }\r\n}\r\n\r\n\r\n","\r\nimport * as React from \"react\";\r\nimport { StaticQuery, graphql } from \"gatsby\"\r\nimport { inject, observer } from \"mobx-react\";\r\n\r\nimport { OrderStore, UIStore, VisitorStore } from \"stores\";\r\nimport Input from \"../../../components/input\";\r\nimport { INPUT_CUSTOM_FORMAT_EVENT } from \"../../../utils/constants\";\r\n\r\nexport interface CustomSizeInputProps {\r\n orderStore?: OrderStore;\r\n uiStore?: UIStore;\r\n visitorStore?: VisitorStore;\r\n}\r\n\r\n@inject(\"orderStore\", \"uiStore\", \"visitorStore\")\r\n@observer\r\nexport default class CustomSizeInput extends React.Component {\r\n data: any;\r\n render() {\r\n const orderStore: OrderStore = this.props.orderStore;\r\n if (!orderStore.currentItem.isCustomSize) {\r\n return null;\r\n }\r\n return (\r\n {\r\n this.data = data;\r\n return (\r\n
\r\n \r\n \r\n
\r\n )\r\n }\r\n } />\r\n )\r\n }\r\n handleHeightChange = (value: string) => {\r\n const store: OrderStore = this.props.orderStore;\r\n store.currentItem.height = parseInt(value);\r\n this.getPriceInfo();\r\n \r\n }\r\n handleWidthChange = (value: string) => {\r\n const store: OrderStore = this.props.orderStore;\r\n store.currentItem.width = parseInt(value);\r\n this.getPriceInfo();\r\n }\r\n getPriceInfo = () => {\r\n const store: OrderStore = this.props.orderStore;\r\n const uiStore: UIStore = this.props.uiStore;\r\n const texts = this.data.squidexTexts;\r\n\r\n const visitorStore: VisitorStore = this.props.visitorStore;\r\n visitorStore.logEvent(INPUT_CUSTOM_FORMAT_EVENT, {\r\n width: store.currentItem.width,\r\n height: store.currentItem.height\r\n });\r\n\r\n if (!isNaN(store.currentItem.height) && !isNaN(store.currentItem.width)) {\r\n store.getCustomPrice().then(result => {\r\n if (typeof(result) === \"undefined\") {\r\n uiStore.showModal(texts.txtGenericErrorHeader[process.env.GATSBY_LANGUAGE], texts.txtGenericErrorBody[process.env.GATSBY_LANGUAGE]);\r\n }\r\n });\r\n }\r\n }\r\n}\r\n\r\n\r\n","\r\nimport * as React from \"react\";\r\nimport { StaticQuery, graphql } from \"gatsby\"\r\nimport { inject, observer } from \"mobx-react\";\r\n\r\nimport { OrderStore, VisitorStore } from \"stores\";\r\nimport SelectList, { SelectListItem } from \"../../../components/selectList\";\r\nimport { SELECT_FORMAT_EVENT } from \"../../../utils/constants\";\r\n\r\nexport interface FormatSelectProps {\r\n orderStore?: OrderStore;\r\n visitorStore?: VisitorStore\r\n}\r\n\r\n@inject(\"orderStore\", \"visitorStore\")\r\n@observer\r\nexport default class FormatSelect extends React.Component {\r\n render() {\r\n const orderStore = this.props.orderStore;\r\n if (!orderStore.currentItem.material || orderStore.currentItem.isCustomSize) {\r\n return null;\r\n }\r\n const formats = orderStore.currentItem.material.formats\r\n .filter(f => f.houding === orderStore.currentItem.filter)\r\n .map(f => ({ label: f.name, value: f }));\r\n const defaultValue = formats.find(f => f.label === this.props.orderStore.currentItem.format.name);\r\n return (\r\n (\r\n
\r\n \r\n \r\n
\r\n )\r\n } />\r\n )\r\n }\r\n\r\n handleFormatChange = (t: SelectListItem) => {\r\n const store: OrderStore = this.props.orderStore;\r\n store.currentItem.format = t.value;\r\n store.currentItem.rawPrice = t.value.price;\r\n \r\n const visitorStore: VisitorStore = this.props.visitorStore;\r\n visitorStore.logEvent(SELECT_FORMAT_EVENT, t.value);\r\n }\r\n}\r\n\r\n\r\n","\r\nimport * as React from \"react\";\r\nimport { StaticQuery, graphql } from \"gatsby\"\r\nimport { inject, observer } from \"mobx-react\";\r\n\r\nimport { OrderStore, VisitorStore } from \"stores\";\r\nimport SelectList, { SelectListItem } from \"../../../components/selectList\";\r\nimport { SELECT_EFFECT_EVENT } from \"../../../utils/constants\";\r\n\r\nexport interface EffectSelectProps {\r\n orderStore?: OrderStore;\r\n visitorStore?: VisitorStore;\r\n onChange?: (effect: string) => void;\r\n}\r\n\r\n@inject(\"orderStore\", \"visitorStore\")\r\n@observer\r\nexport default class EffectSelect extends React.Component {\r\n render() {\r\n return (\r\n {\r\n const effects = data.squidexConfig.effects[process.env.GATSBY_LANGUAGE].map(({label, camanMethod}) => ({ label, value: camanMethod }));\r\n const placeholderText = data.squidexTexts.txtChooseEffect[process.env.GATSBY_LANGUAGE];\r\n let defaultValue = effects[0];\r\n if (this.props.orderStore.currentItem.effect) {\r\n defaultValue = effects.find(e => e.value === this.props.orderStore.currentItem.effect);\r\n }\r\n return (\r\n
\r\n \r\n \r\n
\r\n )\r\n }\r\n } />\r\n )\r\n }\r\n\r\n\r\n handleEffectChange = (t: SelectListItem) => {\r\n const store: OrderStore = this.props.orderStore;\r\n const visitorStore: VisitorStore = this.props.visitorStore;\r\n visitorStore.logEvent(SELECT_EFFECT_EVENT, t.value);\r\n // TODO: Should change this in backend\r\n if (t.value === \"none\") {\r\n store.currentItem.effect = \"geen\"; \r\n } else {\r\n store.currentItem.effect = t.value;\r\n }\r\n if (this.props.onChange) {\r\n this.props.onChange(t.value);\r\n }\r\n }\r\n}\r\n\r\n\r\n","\r\nimport * as React from \"react\";\r\nimport { StaticQuery, graphql } from \"gatsby\"\r\nimport { inject, observer, Observer } from \"mobx-react\";\r\n\r\nimport { OrderStore, UIStore } from \"stores\";\r\nimport Cropper, { ICropLocation, ICrop } from \"react-easy-crop\";\r\nimport Button from \"../../../components/button\";\r\nimport EffectSelect from \"./effectSelect\";\r\n\r\nexport interface ImageEditorProps {\r\n orderStore?: OrderStore;\r\n uiStore?: UIStore;\r\n onEffectChange?: (effect: string) => void;\r\n onImageReset?: () => void;\r\n}\r\nexport interface ImageEditorState {\r\n zoom: number;\r\n cropLoc: ICropLocation;\r\n}\r\n\r\n@inject(\"orderStore\", \"uiStore\")\r\n@observer\r\nexport default class ImageEditor extends React.Component {\r\n\r\n constructor(props: ImageEditorProps) {\r\n super(props);\r\n this.state = {\r\n zoom: 1,\r\n cropLoc: {\r\n x: 0,\r\n y: 0\r\n }\r\n }\r\n }\r\n componentWillMount() {\r\n // Update state to get cropper right\r\n setTimeout(() => {\r\n this.setState({});\r\n }, 0)\r\n }\r\n render() {\r\n return (\r\n (\r\n
\r\n

\r\n {data.squidexTexts.txtEditPicture[process.env.GATSBY_LANGUAGE]}\r\n

\r\n

\r\n {data.squidexTexts.txtEditPictureInstructions[process.env.GATSBY_LANGUAGE]}\r\n

\r\n
\r\n {this.renderCropper()}\r\n
\r\n \r\n
\r\n )\r\n } />\r\n )\r\n }\r\n renderCropper = () => {\r\n const orderStore: OrderStore = this.props.orderStore;\r\n return (\r\n {() => }\r\n )\r\n }\r\n handleCropChange = (cropLoc: ICropLocation) => {\r\n this.setState({ cropLoc })\r\n }\r\n handleZoomChange = (zoom: number) => {\r\n this.setState({ zoom });\r\n }\r\n handleCropComplete = (area: ICrop, pixels: ICrop) => {\r\n const store: OrderStore = this.props.orderStore;\r\n store.currentItem.crop.x = pixels.x;\r\n store.currentItem.crop.y = pixels.y;\r\n store.currentItem.crop.width = pixels.width;\r\n store.currentItem.crop.height = pixels.height;\r\n }\r\n handleEffectChange = (effect: string) => {\r\n if (this.props.onEffectChange) {\r\n this.props.onEffectChange(effect);\r\n }\r\n }\r\n handleClearImage = () => {\r\n if (this.props.onImageReset) {\r\n this.props.onImageReset();\r\n }\r\n }\r\n}\r\n\r\n\r\n\r\n\r\n","\r\nimport * as React from \"react\";\r\nimport { StaticQuery, graphql } from \"gatsby\"\r\nimport { inject, observer } from \"mobx-react\";\r\nimport Dropzone from \"react-dropzone\";\r\n\r\nimport { OrderStore } from \"stores\";\r\nimport { SquidexConfig, SquidexTexts } from \"generated/gatsbyApiTypes\";\r\nimport { Button } from \"components\";\r\nimport { getLanguageValue } from \"utils\";\r\n\r\nexport interface ImageUploaderProps {\r\n orderStore?: OrderStore;\r\n onStartUploading?: () => void;\r\n onImageUploaded?: (img: string) => void;\r\n}\r\n\r\nexport interface ImageUploaderState {\r\n hasFileSizeError: boolean;\r\n hasFileTypeError: boolean;\r\n}\r\n\r\n@inject(\"orderStore\")\r\n@observer\r\nexport default class ImageUploader extends React.Component {\r\n dropZone: Dropzone;\r\n maxSize: number;\r\n constructor(props: ImageUploaderProps) {\r\n super(props);\r\n this.state = {\r\n hasFileSizeError: false,\r\n hasFileTypeError: false\r\n }\r\n }\r\n render() {\r\n return (\r\n {\r\n const texts = data.squidexTexts as SquidexTexts;\r\n const config = data.config as SquidexConfig;\r\n this.maxSize = config.uploadLimit.iv;\r\n return (\r\n
\r\n

{getLanguageValue(texts.txtUploadInstructions)}

\r\n { this.dropZone = d }}\r\n onDrop={this.handleFileUpload}\r\n />\r\n\r\n {this.state.hasFileSizeError ?

{getLanguageValue(texts.txtFileTooLargeError)}

: null}\r\n {this.state.hasFileTypeError ?

{getLanguageValue(texts.txtFileIncorrectTypeError)}

: null}\r\n
\r\n )\r\n }\r\n } />\r\n )\r\n }\r\n handleUploadClick = () => {\r\n this.dropZone.open();\r\n }\r\n handleFileUpload = (acceptedFiles: File[], rejectFiles: File[]) => {\r\n const store: OrderStore = this.props.orderStore;\r\n const file = acceptedFiles[0];\r\n if (!file) {\r\n const rejected = rejectFiles[0];\r\n if (rejected.size > this.maxSize * 1024 * 1024) {\r\n this.setState({ hasFileSizeError: true, hasFileTypeError: false });\r\n } else {\r\n this.setState({ hasFileSizeError: false, hasFileTypeError: true });\r\n }\r\n return;\r\n }\r\n store.currentItem.effect = \"geen\";\r\n const reader = new FileReader();\r\n reader.onload = () => {\r\n store.currentItem.image = reader.result as string;\r\n if (this.props.onImageUploaded) {\r\n this.props.onImageUploaded(reader.result as string);\r\n }\r\n }\r\n reader.readAsDataURL(file);\r\n this.setState({ hasFileSizeError: false, hasFileTypeError: false });\r\n }\r\n}\r\n\r\n","\r\nimport * as React from \"react\";\r\nimport { StaticQuery, graphql } from \"gatsby\"\r\nimport { inject, observer } from \"mobx-react\";\r\n\r\nimport { OrderStore } from \"stores\";\r\nimport SelectList, { SelectListItem } from \"../../../components/selectList\";\r\n\r\nexport interface PriceViewProps {\r\n orderStore?: OrderStore;\r\n}\r\n\r\n@inject(\"orderStore\")\r\n@observer\r\nexport default class PriceView extends React.Component {\r\n render() {\r\n const orderStore = this.props.orderStore;\r\n if (isNaN(orderStore.currentItem.price) || orderStore.currentItem.price <= 0) {\r\n return null;\r\n }\r\n return (\r\n (\r\n
\r\n

{data.squidexTexts.txtYourPrice[process.env.GATSBY_LANGUAGE]}

\r\n

€ {orderStore.currentItem.price.toFixed(2)}

\r\n
\r\n )\r\n } />\r\n )\r\n }\r\n}\r\n\r\n\r\n","\r\nimport * as React from \"react\";\r\nimport { StaticQuery, graphql } from \"gatsby\"\r\nimport { inject, observer } from \"mobx-react\";\r\n\r\nimport { OrderStore, ShopStore, VisitorStore, Material } from \"stores\";\r\nimport SelectList, { SelectListItem } from \"../../../components/selectList\";\r\nimport { SELECT_MATERIAL_EVENT } from \"../../../utils/constants\";\r\n\r\nexport interface MaterialSelectProps {\r\n orderStore?: OrderStore;\r\n shopStore?: ShopStore;\r\n visitorStore?: VisitorStore;\r\n}\r\n\r\n@inject(\"orderStore\", \"shopStore\", \"visitorStore\")\r\n@observer\r\nexport default class MaterialSelect extends React.Component {\r\n render() {\r\n const store: ShopStore = this.props.shopStore;\r\n const materials = store.current.materials.map(m => ({ label: m.name, value: m }));\r\n let defaultValue: SelectListItem = undefined;\r\n if (this.props.orderStore.currentItem.material) {\r\n defaultValue = materials.find(m => m.label === this.props.orderStore.currentItem.material.name);\r\n }\r\n return (\r\n (\r\n
\r\n \r\n \r\n
\r\n )\r\n } />\r\n )\r\n }\r\n\r\n\r\n handleMaterialChange = (t: SelectListItem) => {\r\n const store: OrderStore = this.props.orderStore;\r\n const visitorStore: VisitorStore = this.props.visitorStore;\r\n const material: Material = t.value;\r\n visitorStore.logEvent(SELECT_MATERIAL_EVENT, {\r\n id: material.id,\r\n name: name\r\n });\r\n store.currentItem.material = t.value;\r\n if (!store.currentItem.isCustomSize) {\r\n store.currentItem.filter = store.currentItem.material.formats[0].houding;\r\n store.currentItem.format = t.value.formats[0];\r\n store.currentItem.rawPrice = t.value.formats[0].price;\r\n } else {\r\n store.getCustomPrice();\r\n }\r\n if (t.value.options && t.value.options.length > 0) {\r\n store.currentItem.options = [t.value.options[0]];\r\n } else {\r\n store.currentItem.options = [];\r\n }\r\n }\r\n}\r\n\r\n\r\n","\r\nimport * as React from \"react\";\r\nimport { StaticQuery, graphql } from \"gatsby\"\r\nimport { inject, observer } from \"mobx-react\";\r\n\r\nimport { OrderStore, VisitorStore } from \"stores\";\r\nimport SelectList, { SelectListItem } from \"../../../components/selectList\";\r\nimport { SELECT_OPTION_EVENT } from \"../../../utils/constants\";\r\n\r\nexport interface OptionSelectProps {\r\n orderStore?: OrderStore;\r\n visitorStore?: VisitorStore;\r\n}\r\n\r\n@inject(\"orderStore\", \"visitorStore\")\r\n@observer\r\nexport default class OptionSelect extends React.Component {\r\n render() {\r\n const orderStore = this.props.orderStore;\r\n if (!orderStore.currentItem.material || !orderStore.currentItem.material.options || orderStore.currentItem.material.options.length === 0) {\r\n return null;\r\n }\r\n const options = orderStore.currentItem.material.options\r\n .filter(opt => !orderStore.currentItem.material.optionGroups.some(\r\n og => og.options.map(o => o.id).indexOf(opt.id) !== -1\r\n ))\r\n .map(opt => ({ label: opt.name, value: opt }));\r\n const defaultValue = options.find(f => f.label === this.props.orderStore.currentItem.options[0].name);\r\n return (\r\n (\r\n
\r\n \r\n \r\n
\r\n )\r\n } />\r\n )\r\n }\r\n\r\n handleOptionChange = (t: SelectListItem) => {\r\n const store: OrderStore = this.props.orderStore;\r\n store.currentItem.options[0] = t.value;\r\n \r\n const visitorStore: VisitorStore = this.props.visitorStore;\r\n visitorStore.logEvent(SELECT_OPTION_EVENT, t.value);\r\n }\r\n}\r\n\r\n\r\n","\r\nimport * as React from \"react\";\r\nimport { StaticQuery, graphql } from \"gatsby\"\r\nimport { inject, observer } from \"mobx-react\";\r\n\r\nimport { Order, Option, OrderStore, VisitorStore } from \"stores\";\r\nimport SelectList, { SelectListItem } from \"../../../components/selectList\";\r\nimport { SELECT_OPTION_EVENT } from \"../../../utils/constants\";\r\nimport { Checkbox } from 'components';\r\nimport { getLanguageValue } from 'utils';\r\nimport { SquidexTexts } from 'generated/gatsbyApiTypes';\r\nimport { optionCSS } from 'react-select/lib/components/Option';\r\n\r\nexport interface OptionGroupProps {\r\n orderStore?: OrderStore;\r\n visitorStore?: VisitorStore;\r\n}\r\n\r\n@inject(\"orderStore\", \"visitorStore\")\r\n@observer\r\nexport default class OptionGroups extends React.Component {\r\n render() {\r\n const orderStore = this.props.orderStore;\r\n if (!orderStore.currentItem.material || !orderStore.currentItem.material.optionGroups || orderStore.currentItem.material.optionGroups.length === 0) {\r\n return null;\r\n }\r\n const groups = orderStore.currentItem.material.optionGroups;\r\n return (\r\n <>\r\n {\r\n groups.map((group, i) => {\r\n if (group.type === 'ChooseOne') {\r\n return (\r\n {\r\n const items = group.options\r\n .map(opt => ({ label: opt.name, value: opt }));\r\n\r\n let defaultItem: SelectListItem;\r\n if (!group.choiceRequired) {\r\n defaultItem = { label: getLanguageValue(data.squidexTexts.txtChooseOneNoOptionSelected), value: null };\r\n items.push(defaultItem);\r\n } else {\r\n defaultItem = items[0];\r\n }\r\n const selectedIndex = orderStore.currentItem.options.findIndex((opt) => {\r\n return group.options.map(o => o.id).indexOf(opt.id) !== -1\r\n });\r\n if (selectedIndex !== -1) {\r\n const opt = orderStore.currentItem.options[selectedIndex];\r\n defaultItem = { label: opt.name, value: opt }\r\n };\r\n return (\r\n
\r\n \r\n \r\n
\r\n )\r\n }} />\r\n )\r\n } else {\r\n return (\r\n
\r\n \r\n {group.options.map(opt => (\r\n o.id === opt.id)}\r\n onChange={this.handleChooseAnyChange(opt)}\r\n label={opt.name}\r\n />\r\n ))}\r\n
\r\n )\r\n }\r\n }\r\n )\r\n }\r\n \r\n )\r\n }\r\n\r\n handleChooseOneChange = (groupIndex: number) => (t: SelectListItem) => {\r\n const orderStore: OrderStore = this.props.orderStore;\r\n const group = orderStore.currentItem.material.optionGroups[groupIndex];\r\n const currentSelectedOption = orderStore.currentItem.options.findIndex((opt) => {\r\n return group.options.map(o => o.id).indexOf(opt.id) !== -1\r\n });\r\n if (t.value !== null) {\r\n if (currentSelectedOption !== -1) {\r\n orderStore.currentItem.options[currentSelectedOption] = t.value;\r\n } else {\r\n orderStore.currentItem.options.push(t.value);\r\n }\r\n\r\n const visitorStore: VisitorStore = this.props.visitorStore;\r\n visitorStore.logEvent(SELECT_OPTION_EVENT, t.value);\r\n } else {\r\n if (currentSelectedOption !== -1) {\r\n orderStore.currentItem.options.splice(currentSelectedOption, 1);\r\n }\r\n }\r\n }\r\n\r\n handleChooseAnyChange = (option: Option) => (checked: boolean) => {\r\n const orderStore: OrderStore = this.props.orderStore;\r\n if (checked) {\r\n orderStore.currentItem.options.push(option);\r\n } else {\r\n orderStore.currentItem.options = orderStore.currentItem.options.filter(i => i.id !== option.id);\r\n }\r\n }\r\n}\r\n\r\n\r\n","\r\nimport { observable } from \"mobx\";\r\nimport { inject, observer } from \"mobx-react\";\r\nimport * as React from \"react\";\r\nimport { navigate, graphql } from \"gatsby\";\r\n\r\nimport { ShopStore, OrderStore, UIStore, VisitorStore } from \"stores\";\r\nimport { SquidexTexts } from \"generated/gatsbyApiTypes\";\r\nimport {\r\n PAGE_VIEW_EVENT, NAVIGATE_EVENT, ADD_IMAGE_TO_CART_EVENT,\r\n CHANGE_IMAGE_EVENT, UPLOAD_IMAGE_EVENT, THUMBNAIL_MAX, getLanguageValue\r\n} from \"utils\";\r\n\r\n\r\nimport Loader from \"../../components/loader\";\r\nimport Button from \"../../components/button\";\r\nimport FilterSelect from \"./main/filterSelect\";\r\nimport CustomSizeInput from \"./main/customSizeInput\";\r\nimport FormatSelect from \"./main/formatSelect\";\r\nimport ImageEditor from \"./main/imageEditor\";\r\nimport ImageUploader from \"./main/imageUploader\";\r\nimport PriceView from \"./main/priceView\";\r\nimport MaterialSelect from \"./main/materialSelect\";\r\nimport OptionSelect from \"./main/optionSelect\";\r\nimport SEO from \"../../components/seo\";\r\nimport OptionGroups from './main/optionGroups';\r\n\r\ninterface ShopPageState {\r\n previewOpen: boolean;\r\n}\r\n\r\n@inject(\"shopStore\", \"orderStore\", \"uiStore\", \"visitorStore\")\r\n@observer\r\nclass ShopPage extends React.Component {\r\n @observable imgLoading: boolean;\r\n camanApi: any;\r\n constructor(props: any) {\r\n super(props);\r\n this.state = {\r\n previewOpen: false\r\n };\r\n }\r\n componentWillMount() {\r\n const store: OrderStore = this.props.orderStore;\r\n const uiStore: UIStore = this.props.uiStore;\r\n const shopStore: ShopStore = this.props.shopStore;\r\n const texts = this.props.data.squidexTexts;\r\n if (!shopStore.current) {\r\n uiStore.showModal(texts.txtGenericErrorHeader[process.env.GATSBY_LANGUAGE], texts.txtGenericErrorBody[process.env.GATSBY_LANGUAGE]);\r\n }\r\n if (typeof (document) !== \"undefined\") {\r\n const canvas = document.createElement(\"canvas\");\r\n this.camanApi = Caman(canvas);\r\n }\r\n const visitorStore: VisitorStore = this.props.visitorStore;\r\n visitorStore.logEvent(PAGE_VIEW_EVENT, {\r\n location: this.props.location,\r\n pageType: \"shop-index\",\r\n });\r\n }\r\n componentDidMount() {\r\n const store: OrderStore = this.props.orderStore;\r\n const config = this.props.data.squidexConfig;\r\n if (!config.allowImageUpload.iv && !store.currentItem.hasImage) {\r\n if (typeof (window) !== \"undefined\") {\r\n const visitorStore: VisitorStore = this.props.visitorStore;\r\n visitorStore.logEvent(NAVIGATE_EVENT, {\r\n location: this.props.location,\r\n href: this.props.data.squidexGalleryOverviewPage.slug.iv.toLowerCase()\r\n });\r\n navigate(this.props.data.squidexGalleryOverviewPage.slug.iv.toLowerCase());\r\n }\r\n }\r\n if (!!store.currentItem.image) {\r\n this.imgLoading = true;\r\n this.createThumb();\r\n } else {\r\n this.imgLoading = false;\r\n }\r\n }\r\n render() {\r\n const store: OrderStore = this.props.orderStore;\r\n const config = this.props.data.squidexConfig;\r\n if (typeof (window) === \"undefined\" || (!config.allowImageUpload.iv && !store.currentItem.hasImage)) {\r\n return \r\n }\r\n const texts = this.props.data.squidexTexts as SquidexTexts;\r\n const aspectSelectRow = (store.currentItem.isCustomSize) ? : <>\r\n return (\r\n <>\r\n \r\n {this.maybeRenderLoader()}\r\n

{getLanguageValue(texts.pageShopIndex)}

\r\n
\r\n
\r\n
\r\n
1
\r\n

{getLanguageValue(texts.txtChooseProduct)}

\r\n
\r\n \r\n
\r\n
\r\n
\r\n
2
\r\n

{getLanguageValue(texts.txtChoosePicture)}

\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
3
\r\n

{getLanguageValue(texts.txtImagePreview)}

\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n )\r\n }\r\n maybeRenderLoader = () => {\r\n const store: ShopStore = this.props.shopStore;\r\n if (store.fetching || this.imgLoading) {\r\n return ();\r\n }\r\n return null;\r\n }\r\n handleUploadStart = () => {\r\n this.imgLoading = true;\r\n const visitorStore: VisitorStore = this.props.visitorStore;\r\n visitorStore.logEvent(UPLOAD_IMAGE_EVENT);\r\n }\r\n createThumb = () => {\r\n this.createThumbAsync();\r\n }\r\n createThumbAsync = () => {\r\n const component = this;\r\n const store: OrderStore = this.props.orderStore;\r\n return new Promise((res) => {\r\n this.renderInCaman((img) => function () {\r\n this.resize({\r\n width: img.naturalWidth > img.naturalHeight ? THUMBNAIL_MAX : undefined,\r\n height: img.naturalHeight > img.naturalWidth ? THUMBNAIL_MAX : undefined,\r\n })\r\n if (store.currentItem.effect !== \"geen\") {\r\n this[store.currentItem.effect]();\r\n }\r\n this.render(function () {\r\n store.currentItem.thumb = this.toBase64();\r\n component.imgLoading = false;\r\n res(undefined);\r\n });\r\n });\r\n })\r\n }\r\n appendImagePreview = () => {\r\n const store: OrderStore = this.props.orderStore;\r\n var img = new Image();\r\n img.onload = function () {\r\n // const scale = store.currentItem.crop.originalWidth / store.currentItem.crop.width;\r\n const scale = 1;\r\n const w = Math.round((1 / scale) * store.currentItem.crop.width);\r\n const h = Math.round((1 / scale) * store.currentItem.crop.height);\r\n const x = Math.round((1 / scale) * store.currentItem.crop.x);\r\n const y = Math.round((1 / scale) * store.currentItem.crop.y);\r\n const canvas = document.getElementById(\"cnvImgFinal\") as HTMLCanvasElement;\r\n const context = canvas.getContext(\"2d\");\r\n canvas.width = w;\r\n canvas.height = h;\r\n context.clearRect(0, 0, canvas.width, canvas.height);\r\n context.save();\r\n context.translate(canvas.width / 2, canvas.height / 2);\r\n context.drawImage(img, x, y, w, h, -canvas.width / 2, -canvas.height / 2, canvas.width, canvas.height);\r\n context.restore();\r\n }\r\n img.src = store.currentItem.thumb;\r\n }\r\n handleShowPreview = () => {\r\n this.appendImagePreview();\r\n this.setState({ previewOpen: true });\r\n }\r\n handleHidePreview = () => {\r\n this.setState({ previewOpen: false });\r\n }\r\n handleItemSubmit = () => {\r\n if (!this.validate()) {\r\n return;\r\n }\r\n this.submitItemAsync();\r\n }\r\n submitItemAsync = async () => {\r\n await this.createThumbAsync();\r\n const store: OrderStore = this.props.orderStore;\r\n store.submitItem();\r\n const visitorStore: VisitorStore = this.props.visitorStore;\r\n visitorStore.logEvent(ADD_IMAGE_TO_CART_EVENT, {\r\n ...store.currentItem\r\n });\r\n\r\n setTimeout(() => {\r\n visitorStore.logEvent(NAVIGATE_EVENT, {\r\n location: this.props.location,\r\n href: this.props.data.squidexConfig.pageCartSlug.iv.toLowerCase()\r\n });\r\n\r\n navigate(this.props.data.squidexConfig.pageCartSlug.iv.toLowerCase())\r\n }, 200);\r\n }\r\n renderInCaman = (camanFn: (i: HTMLImageElement) => Function) => {\r\n const store: OrderStore = this.props.orderStore;\r\n this.imgLoading = true;\r\n const img = new Image();\r\n img.src = store.currentItem.image;\r\n img.onload = () => {\r\n const fn = () => {\r\n const canvas: HTMLCanvasElement = this.camanApi.canvas;\r\n if (!canvas) {\r\n setTimeout(fn, 0);\r\n return;\r\n }\r\n const context = canvas.getContext(\"2d\");\r\n context.clearRect(0, 0, canvas.width, canvas.height);\r\n canvas.width = img.naturalWidth;\r\n canvas.height = img.naturalHeight;\r\n context.drawImage(img, 0, 0, img.naturalWidth, img.naturalHeight);\r\n this.camanApi.finishInit();\r\n this.camanApi.render(camanFn(img));\r\n }\r\n fn();\r\n }\r\n }\r\n handleImageReset = () => {\r\n const config = this.props.data.squidexConfig;\r\n const visitorStore: VisitorStore = this.props.visitorStore;\r\n visitorStore.logEvent(CHANGE_IMAGE_EVENT);\r\n if (!config.allowImageUpload.iv) {\r\n visitorStore.logEvent(NAVIGATE_EVENT, {\r\n location: this.props.location,\r\n href: this.props.data.squidexGalleryOverviewPage.slug.iv.toLowerCase()\r\n });\r\n\r\n navigate(this.props.data.squidexGalleryOverviewPage.slug.iv.toLowerCase());\r\n } else {\r\n const store: OrderStore = this.props.orderStore;\r\n store.currentItem.thumb = undefined;\r\n store.currentItem.image = undefined;\r\n }\r\n }\r\n validate = () => {\r\n const store: OrderStore = this.props.orderStore;\r\n const uiStore: UIStore = this.props.uiStore;\r\n const texts = this.props.data.squidexTexts;\r\n if (!store.currentItem.material) {\r\n uiStore.showModal(texts.txtValidationErrorHeader[process.env.GATSBY_LANGUAGE], texts.txtNoMaterialError[process.env.GATSBY_LANGUAGE]);\r\n return false;\r\n }\r\n if (store.currentItem.material.customSizes) {\r\n if (!store.currentItem.height) {\r\n uiStore.showModal(texts.txtValidationErrorHeader[process.env.GATSBY_LANGUAGE], texts.txtNoHeightError[process.env.GATSBY_LANGUAGE]);\r\n return false;\r\n }\r\n if (!store.currentItem.width) {\r\n uiStore.showModal(texts.txtValidationErrorHeader[process.env.GATSBY_LANGUAGE], texts.txtNoWidthError[process.env.GATSBY_LANGUAGE]);\r\n return false;\r\n }\r\n } else if (!store.currentItem.format) {\r\n uiStore.showModal(texts.txtValidationErrorHeader[process.env.GATSBY_LANGUAGE], texts.txtNoFormatError[process.env.GATSBY_LANGUAGE]);\r\n return false;\r\n }\r\n if (!store.currentItem.image) {\r\n uiStore.showModal(texts.txtValidationErrorHeader[process.env.GATSBY_LANGUAGE], texts.txtNoImageError[process.env.GATSBY_LANGUAGE]);\r\n return false;\r\n }\r\n return true;\r\n }\r\n}\r\n\r\nexport default ShopPage;\r\nexport const pageQuery = graphql`\r\n{\r\n squidexConfig(identity: { eq: \"config\" }) {\r\n pageCartSlug {\r\n iv\r\n }\r\n allowImageUpload {\r\n iv\r\n }\r\n }\r\n squidexGalleryOverviewPage(identity: { eq: \"galleryOverview\"}) {\r\n slug {\r\n iv\r\n }\r\n }\r\n squidexTexts(identity:{eq: \"squidextexts\"}) {\r\n pageShopIndex {\r\n de\r\n nl\r\n en\r\n }\r\n txtChooseProduct {\r\n de\r\n nl\r\n en\r\n }\r\n txtChoosePicture {\r\n de\r\n nl\r\n en\r\n }\r\n btnAddToCart {\r\n de\r\n nl\r\n en\r\n }\r\n txtGenericErrorHeader {\r\n de\r\n nl\r\n en\r\n }\r\n txtGenericErrorBody {\r\n de\r\n nl\r\n en\r\n }\r\n txtValidationErrorHeader {\r\n de\r\n nl\r\n en\r\n }\r\n txtNoMaterialError {\r\n de\r\n nl\r\n en\r\n }\r\n txtNoWidthError {\r\n de\r\n nl\r\n en\r\n }\r\n txtNoHeightError {\r\n de\r\n nl\r\n en\r\n }\r\n txtNoFormatError {\r\n de\r\n nl\r\n en\r\n }\r\n txtNoImageError {\r\n de\r\n nl\r\n en\r\n }\r\n txtImagePreview {\r\n de\r\n nl\r\n en\r\n }\r\n btnToImagePreview {\r\n de\r\n nl\r\n en\r\n }\r\n btnBackToEditImage {\r\n de\r\n nl\r\n en\r\n }\r\n }\r\n } \r\n`\r\n\r\n"],"sourceRoot":""}