{logoSVG}
\r\n\t\t)\r\n\t}\r\n};\r\n\r\nexport default Logo;\r\n\r\n\r\n\r\n\r\n","import React, { Component } from 'react';\r\nimport { connect } from 'react-redux';\r\nimport { Link } from 'react-router-dom';\r\n\r\nimport * as util from '../../utils/general';\r\n\r\nimport Logo from '../Brand/Logo';\r\n\r\nimport './UserMenu.scss';\r\n\r\nclass UserMenu extends Component {\r\n\trender () {\r\n\t\tconst {\r\n\t\t\tuserMenuActive,\r\n\t\t\tonSignOut,\r\n\t\t\tonCloseHandler,\r\n\t\t\taudience,\r\n\t\t\tglobal,\r\n\t\t} = this.props;\r\n\r\n\t\tif (!userMenuActive) {\r\n\t\t\treturn null;\r\n\t\t}\r\n\r\n\t\tconst isResponsive = global.breakpoint.level <= util.breakpoints['tablet'];\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t
\r\n\t\t);\r\n\t}\r\n}\r\n\r\nconst mapStateToProps = (state) => {\r\n\treturn {\r\n\t\taudience: state.audience,\r\n\t\tglobal: state.global,\r\n\t};\r\n}\r\n\r\nconst mapDispatchToProps = (dispatch, ownProps) => {\r\n\treturn {\r\n\t\tonSignOut: () => {\r\n\t\t\tdispatch({ type: 'SIGN_OUT' });\r\n\t\t}\r\n\t}\r\n}\r\n\r\n\r\nexport default connect(\r\n\tmapStateToProps,\r\n\tmapDispatchToProps,\r\n)(UserMenu);\r\n","import React, { Component } from 'react';\r\n\r\nimport './TextInput.scss';\r\n\r\nexport default class TextInput extends Component {\r\n\tinput = null;\r\n\r\n\tstate = {\r\n\t\tshowErrors: false,\r\n\t};\r\n\r\n\tfocus = () => this.input.focus();\r\n\r\n\trenderIcon = (icon) => {\r\n\t\tif (!icon || !icon.length) {\r\n\t\t\treturn null;\r\n\t\t}\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t\t{isResponsive &&\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\tShopping Cart\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t}\r\n\t\t\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\tAccount\r\n\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\tLifeTimeLines\r\n\t\t\t\t\t\r\n\t\t\t\t\t{isResponsive &&\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\tSearch\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t}\r\n\t\t\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\tSign Out\r\n\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\tHelp\r\n\t\t\t\t\t\r\n\t\t\t\t
\r\n\t\t\t\r\n\t\t\t\t\r\n\t\t\t
\r\n\t\t);\r\n\t};\r\n\r\n\trenderValidationMessages = (validationMessages) => {\r\n\t\tif (!validationMessages || !validationMessages.length) {\r\n\t\t\treturn null;\r\n\t\t}\r\n\r\n\t\tconst messages = React.Children.map(\r\n\t\t\tvalidationMessages,\r\n\t\t\tmessage => - \r\n\t\t\t\t\r\n\t\t\t\t{messages}\r\n\t\t\t
\r\n\t\t\t\t{this.renderIcon(icon)}\r\n\t\t\t\t this.input = input}\r\n\t\t\t\t\tclassName={inputClasses.join(' ')}\r\n\t\t\t\t\t{...otherProps}\r\n\t\t\t\t\tonFocus={this.onFocus}\r\n\t\t\t\t\tonBlur={this.onBlur}\r\n\t\t\t\t/>\r\n\t\t\t\t{this.renderValidationMessages(validationMessages)}\r\n\t\t\t
\r\n\t\t);\r\n\t}\r\n}","import React from 'react';\r\n\r\nimport './Spinner.scss';\r\n\r\nconst Spinner = ({ className, active, color = '#FFF', ...otherProps } ) => {\r\n\tif (!active) {\r\n\t\treturn null;\r\n\t}\r\n\r\n\tconst classes = [ 'spinner' ];\r\n\r\n\tif (className) {\r\n\t\tclasses.push(className);\r\n\t}\r\n\r\n\treturn (\r\n\t\t\r\n\t);\r\n};\r\n\r\nexport default Spinner;","import Spinner from './Spinner';\r\n\r\n// Makes Spinner the default import for this folder\r\nexport default Spinner;\r\n","import { sendFetchRequest, getApiContext } from './api_utils';\r\n\r\nconst fileURL = `${getApiContext()}/api/file`;\r\n\r\n// The type argument is image, document, etc.\r\nconst upload = (type, file) => {\r\n\tconst data = new FormData();\r\n\r\n\t// TASK: Tripple check FormData append is supported in IE10\r\n\tdata.append('uploadedFile', file);\r\n\r\n\tconst options = {\r\n\t\tmethod: 'POST',\r\n\t\tbody: data,\r\n\t};\r\n\r\n\treturn sendFetchRequest(`${fileURL}/${type}`, options);\r\n};\r\n\r\nexport { upload };\r\n","import React, { Component, Fragment } from 'react';\r\n\r\nimport Spinner from '../../Spinner';\r\n\r\nimport * as fileAPI from '../../../api/fileAPI';\r\n\r\nimport './Image.scss';\r\n\r\nconst ORIENT_TRANSFORMS = {\r\n\t1: '',\r\n\t2: 'rotateY(180deg)',\r\n\t3: 'rotate(180deg)',\r\n\t4: 'rotate(180deg) rotateY(180deg)',\r\n\t5: 'rotate(270deg) rotateY(180deg)',\r\n\t6: 'rotate(90deg)',\r\n\t7: 'rotate(90deg) rotateY(180deg)',\r\n\t8: 'rotate(270deg)',\r\n};\r\n\r\nclass FormImage extends Component {\r\n\tstatic fieldType = 'FormImage';\r\n\r\n\tconstructor(props) {\r\n\t\tsuper(props);\r\n\r\n\t\tthis.input = null;\r\n\t\tthis.image = null;\r\n\t\tthis.thumbnails = false;\r\n\t\tthis.component = null;\r\n\r\n\t\tthis.state = this.getNewState(\r\n\t\t\tprops,\r\n\t\t\t{\r\n\t\t\t\tURL: '',\r\n\t\t\t\twidth: 0,\r\n\t\t\t\theight: 0,\r\n\t\t\t\tthumbnailURL: '',\r\n\t\t\t\torientation: 1,\r\n\t\t\t\terror: null,\r\n\t\t\t\tisVisible: !props.lazyLoading,\r\n\t\t\t\tloading: false,\r\n\t\t\t},\r\n\t\t);\r\n\t}\r\n\r\n\tcomponentDidMount() {\r\n\t\tif (!this.props.isVisible) {\r\n\t\t\tthis.checkIsVisible();\r\n\t\t\twindow.addEventListener('RESIZE', this.checkIsVisible);\r\n\t\t\twindow.addEventListener('SCROLL_EVENT', this.checkIsVisible);\r\n\t\t}\r\n\t}\r\n\r\n\tcomponentWillUnmount() {\r\n\t\tif (!this.props.isVisible) {\r\n\t\t\tthis.unbindListener();\r\n\t\t}\r\n\t}\r\n\r\n\tcomponentWillReceiveProps(nextProps) {\r\n\t\tconst hasURIChanged = nextProps.image && this.state.URL !== nextProps.image.uri;\r\n\r\n\t\tif (!nextProps.image || hasURIChanged) {\r\n\t\t\tconst newState = this.getNewState(\r\n\t\t\t\tnextProps,\r\n\t\t\t\t{\r\n\t\t\t\t\tURL: '',\r\n\t\t\t\t\twidth: 0,\r\n\t\t\t\t\theight: 0,\r\n\t\t\t\t\tthumbnailURL: '',\r\n\t\t\t\t\torientation: 1,\r\n\t\t\t\t\tloading: hasURIChanged,\r\n\t\t\t\t},\r\n\t\t\t);\r\n\r\n\t\t\tthis.setState(newState);\r\n\t\t}\r\n\t}\r\n\r\n\tunbindListener = () => window.removeEventListener('SCROLL_EVENT', this.checkIsVisible);\r\n\r\n\tgetNewState = (props, defaults) => {\r\n\t\tconst state = Object.assign({}, defaults);\r\n\r\n\t\tif (props.image) {\r\n\t\t\tstate.URL = props.image.uri;\r\n\t\t\tstate.width = props.image.width;\r\n\t\t\tstate.height = props.image.height;\r\n\t\t\tstate.thumbnailURL = props.image.thumbnailUri;\r\n\t\t\tif (props.image.exifDataProfile) {\r\n\t\t\t\tstate.orientation = props.image.exifDataProfile.orientation;\r\n\t\t\t} else {\r\n\t\t\t\tstate.orientation = 1;\r\n\t\t\t}\r\n\t\t}\r\n\r\n\t\treturn state;\r\n\t}\r\n\r\n\tfixOrientation = (file, image, event) => {\r\n\t\tconst reader = new FileReader();\r\n\t\treader.onload = (e) => {\r\n\t\t\tconst view = new DataView(e.target.result);\r\n\t\t\tif (view.getUint16(0, false) !== 0xFFD8) {\r\n\t\t\t\tthis.setState({\r\n\t\t\t\t\torientation: 1,\r\n\t\t\t\t\tURL: image.src,\r\n\t\t\t\t\twidth: image.width,\r\n\t\t\t\t\theight: image.height,\r\n\t\t\t\t});\r\n\r\n\t\t\t\tif (this.props.onChange) {\r\n\t\t\t\t\tthis.props.onChange(event, image, 1);\r\n\t\t\t\t}\r\n\t\t\t\treturn;\r\n\t\t\t}\r\n\r\n\t\t\tconst length = view.byteLength;\r\n\t\t\tlet offset = 2;\r\n\t\t\twhile (offset < length) {\r\n\t\t\t\tconst marker = view.getUint16(offset, false);\r\n\t\t\t\toffset += 2;\r\n\t\t\t\tif (marker === 0xFFE1) {\r\n\t\t\t\t\toffset += 2\r\n\t\t\t\t\tif (view.getUint32(offset, false) !== 0x45786966) {\r\n\t\t\t\t\t\tthis.setState({\r\n\t\t\t\t\t\t\torientation: 1,\r\n\t\t\t\t\t\t\tURL: image.src,\r\n\t\t\t\t\t\t\twidth: image.width,\r\n\t\t\t\t\t\t\theight: image.height,\r\n\t\t\t\t\t\t});\r\n\r\n\t\t\t\t\t\tif (this.props.onChange) {\r\n\t\t\t\t\t\t\tthis.props.onChange(event, image, 1);\r\n\t\t\t\t\t\t}\r\n\r\n\t\t\t\t\t\treturn;\r\n\t\t\t\t\t}\r\n\r\n\t\t\t\t\tconst little = view.getUint16(offset += 6, false) === 0x4949;\r\n\t\t\t\t\toffset += view.getUint32(offset + 4, little);\r\n\t\t\t\t\tconst tags = view.getUint16(offset, little);\r\n\t\t\t\t\toffset += 2;\r\n\t\t\t\t\tfor (let i = 0; i < tags; i++) {\r\n\t\t\t\t\t\tif (view.getUint16(offset + (i * 12), little) === 0x0112) {\r\n\t\t\t\t\t\t\tconst orientation = view.getUint16(offset + (i * 12) + 8, little);\r\n\r\n\t\t\t\t\t\t\tif (this.props.onChange) {\r\n\t\t\t\t\t\t\t\tthis.props.onChange(event, image, orientation);\r\n\t\t\t\t\t\t\t}\r\n\r\n\t\t\t\t\t\t\tthis.setState({\r\n\t\t\t\t\t\t\t\torientation,\r\n\t\t\t\t\t\t\t\tURL: image.src,\r\n\t\t\t\t\t\t\t\twidth: image.width,\r\n\t\t\t\t\t\t\t\theight: image.height,\r\n\t\t\t\t\t\t\t});\r\n\t\t\t\t\t\t\treturn;\r\n\t\t\t\t\t\t}\r\n\t\t\t\t\t}\r\n\t\t\t\t} else if ((marker & 0xFF00) !== 0xFF00) {\r\n\t\t\t\t\tbreak;\r\n\t\t\t\t} else {\r\n\t\t\t\t\toffset += view.getUint16(offset, false);\r\n\t\t\t\t}\r\n\t\t\t}\r\n\r\n\t\t\tif (this.props.onChange) {\r\n\t\t\t\tthis.props.onChange(event, image, 1);\r\n\t\t\t}\r\n\r\n\t\t\tthis.setState({\r\n\t\t\t\torientation: 1,\r\n\t\t\t\tURL: image.src,\r\n\t\t\t\twidth: image.width,\r\n\t\t\t\theight: image.height,\r\n\t\t\t});\r\n\t\t};\r\n\r\n\t\treader.readAsArrayBuffer(file);\r\n\t};\r\n\r\n\tcheckIsVisible = () => {\r\n\t\tif (!this.component || this.props.isVisible) {\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tconst bounding = this.component.getBoundingClientRect();\r\n\t\tif (bounding.top >= -133 && bounding.top <= (window.innerHeight || document.documentElement.clientHeight)) {\r\n\t\t\tthis.setState({ isVisible: true });\r\n\t\t\tthis.unbindListener();\r\n\t\t}\r\n\t};\r\n\r\n\thandleClick = (event) => {\r\n\t\tif (this.input) {\r\n\t\t\tthis.input.click();\r\n\t\t}\r\n\t};\r\n\r\n\thandleImageChange = (event) => {\r\n\t\tconst file = event.target.files[0];\r\n\r\n\t\tif (!file) {\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\t// File size must be 25mb or smaller 25,000,000\r\n\t\tif (file.size > 25000000) {\r\n\t\t\tif (this.props.onImageUpload) {\r\n\t\t\t\tthis.props.onImageUpload({\r\n\t\t\t\t\tsuccess: false,\r\n\t\t\t\t\tdata: {\r\n\t\t\t\t\t\ttitle: 'Image too big!',\r\n\t\t\t\t\t\tmessage: 'Please upload an image under 25mb.',\r\n\t\t\t\t\t},\r\n\t\t\t\t});\r\n\t\t\t}\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tconst reader = new FileReader();\r\n\t\tconst i = new Image();\r\n\r\n\t\treader.onload = (e) => {\r\n\t\t\ti.src = e.target.result;\r\n\r\n\t\t\tfileAPI.upload('image', file)\r\n\t\t\t\t.then(resp => {\r\n\t\t\t\t\tif (this.props.onImageUpload) {\r\n\t\t\t\t\t\tthis.props.onImageUpload(resp);\r\n\t\t\t\t\t}\r\n\t\t\t\t});\r\n\t\t};\r\n\r\n\t\ti.onload = () => this.fixOrientation(file, i, event);\r\n\r\n\t\treader.readAsDataURL(file);\r\n\t};\r\n\r\n\trenderEditHover = (URL, editable) => {\r\n\t\tif (!editable) {\r\n\t\t\treturn null;\r\n\t\t}\r\n\r\n\t\tconst hoverClasses = [ 'formImage__hover' ];\r\n\r\n\t\tif (!URL) {\r\n\t\t\thoverClasses.push('formImage__hover--default');\r\n\t\t}\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t
\r\n\t\t\t);\r\n\t\t}\r\n\r\n\t\tconst classes = [ 'formImage' ];\r\n\r\n\t\t// standard 4 x 3 is 0.75 in this context. h/w was chosen over w/h as it provides a clean number instead of\r\n\t\t// 1.333333333* but, really, it's not important.\r\n\t\t// THUMBNAILS; We can ignore thumbnail width and height as calcs here will be same as thumbnails are created in same ratio.\r\n\t\tconst imgRatio = height / width;\r\n\r\n\t\tif (imgRatio < 0.75) {\r\n\t\t\tclasses.push('formImage--push-to-height');\r\n\t\t} else {\r\n\t\t\tclasses.push('formImage--push-to-width');\r\n\t\t}\r\n\r\n\t\tconst isPortrait = (orientation >= 5 && height < width) || (orientation <= 4 && height > width);\r\n\r\n\t\tif (isPortrait) {\r\n\t\t\tclasses.push('formImage--portrait');\r\n\t\t}\r\n\r\n\t\tif (this.state.loading) {\r\n\t\t\tclasses.push('formImage--loading');\r\n\t\t}\r\n\r\n\t\tlet styles = { transform: ORIENT_TRANSFORMS[orientation] };\r\n\r\n\t\tif (orientation >= 5) {\r\n\t\t\tclasses.push('formImage--rotated');\r\n\t\t}\r\n\r\n\t\tif (forceHeight) {\r\n\t\t\tstyles = {\r\n\t\t\t\theight: forceHeight,\r\n\t\t\t\t...styles,\r\n\t\t\t }\r\n\t\t}\r\n\t\tif (forceWidth) {\r\n\t\t\tstyles = {\r\n\t\t\t\twidth: forceWidth,\r\n\t\t\t\t...styles,\r\n\t\t\t}\r\n\t\t}\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t
\r\n\t\t);\r\n\t}\r\n\r\n\trender() {\r\n\t\tconst {\r\n\t\t\tclassName,\r\n\t\t\teditable,\r\n\t\t\tforceWidth,\r\n\t\t\tforceHeight,\r\n\t\t} = this.props;\r\n\r\n\t\tconst {\r\n\t\t\tURL,\r\n\t\t\terror,\r\n\t\t} = this.state;\r\n\r\n\t\tconst wrapperClasses = [ 'formImage__wrapper' ];\r\n\r\n\t\tif (className) {\r\n\t\t\twrapperClasses.push(className);\r\n\t\t}\r\n\r\n\t\tlet styles = {};\r\n\r\n\t\tif (forceHeight) {\r\n\t\t\tstyles = {\r\n\t\t\t\theight: forceHeight,\r\n\t\t\t };\r\n\t\t}\r\n\t\tif (forceWidth) {\r\n\t\t\tstyles = {\r\n\t\t\t\twidth: forceWidth,\r\n\t\t\t\t...styles,\r\n\t\t\t};\r\n\t\t}\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t\t{error}\r\n\t\t\t\t
\r\n\t\t\t this.component = ref} style={styles}>\r\n\t\t\t\t{this.renderEditHover(URL, editable)}\r\n\t\t\t\t{this.renderError(error)}\r\n\t\t\t\t{this.renderImage()}\r\n\t\t\t
\r\n\t\t);\r\n\t}\r\n}\r\n\r\nexport default FormImage;\r\n","import Image from './Image';\r\n\r\n// Makes Image the default import for this folder\r\nexport default Image;\r\n","import Backdrop from './Backdrop';\r\n\r\n// Makes Backdrop the default import for this folder\r\nexport default Backdrop;\r\n","import React from 'react';\r\n\r\nimport './Backdrop.scss';\r\n\r\nconst Backdrop = ({ isOpen, onClose, className, children }) => {\r\n\tif (!isOpen) {\r\n\t\treturn null;\r\n\t}\r\n\r\n\tconst classes = [ 'backdrop' ];\r\n\tif (className) {\r\n\t\tclasses.push(className);\r\n\t}\r\n\r\n\treturn (\r\n\t\t\r\n\t\t\t{children}\r\n\t\t
\r\n\t);\r\n}\r\n\r\nexport default Backdrop;\r\n","import { sendFetchRequest,getApiContext } from './api_utils';\r\n\r\nconst timeLineURL = `${getApiContext()}/api/timeline`;\r\n\r\nconst get = (lifeTimeLineID) => {\r\n\tconst options = {\r\n\t\tmethod: 'GET',\r\n\t};\r\n\r\n\treturn sendFetchRequest(`${timeLineURL}/${lifeTimeLineID}`, options);\r\n};\r\n\r\nconst getAll = (ownerId) => {\r\n\tconst options = {\r\n\t\tmethod: 'GET',\r\n\t};\r\n\r\n\treturn sendFetchRequest(`${timeLineURL}/owner/${ownerId}`, options);\r\n};\r\n\r\nconst getPublic = (lifeTimeLineID) => {\r\n\tconst options = {\r\n\t\tmethod: 'GET',\r\n\t};\r\n\r\n\treturn sendFetchRequest(`${timeLineURL}/public/${lifeTimeLineID}`, options);\r\n};\r\n\r\nconst getAllPublic = () => {\r\n\tconst options = {\r\n\t\tmethod: 'GET',\r\n\t};\r\n\r\n\treturn sendFetchRequest(`${timeLineURL}/public`, options);\r\n};\r\n\r\nconst create = (timeLine) => {\r\n\tconst options = {\r\n\t\tmethod: 'POST',\r\n\t\theaders: {\r\n\t\t\t'Content-Type': 'application/json',\r\n\t\t},\r\n\t\tbody: JSON.stringify(timeLine),\r\n\t};\r\n\r\n\treturn sendFetchRequest(timeLineURL, options);\r\n};\r\n\r\nconst update = (timeLine) => {\r\n\tconst options = {\r\n\t\tmethod: 'PUT',\r\n\t\theaders: {\r\n\t\t\t'Content-Type': 'application/json',\r\n\t\t},\r\n\t\tbody: JSON.stringify(timeLine),\r\n\t};\r\n\r\n\treturn sendFetchRequest(`${timeLineURL}/${timeLine.timelineId}`, options);\r\n};\r\n\r\n\r\nconst search = (title) => {\r\n\tconst options = {\r\n\t\tmethod: 'POST',\r\n\t\theaders: {\r\n\t\t\t'Content-Type': 'application/json',\r\n\t\t},\r\n\t\tbody: JSON.stringify({ title }),\r\n\t};\r\n\r\n\treturn sendFetchRequest(`${timeLineURL}/search`, options);\r\n};\r\n\r\n\r\nexport { get, getAll, getPublic, getAllPublic, create, update, search };\r\n","const formatTimespan = (from, to) => {\r\n\tif (!from) {\r\n\t\treturn null\r\n\t}\r\n\r\n\tif (!to) {\r\n\t\tto = \"present\";\r\n\t}\r\n\r\n\treturn `${from} to ${to}`;\r\n};\r\n\r\nexport { formatTimespan }","import Search from './Search';\r\n\r\n// Makes Search the default import for this folder\r\nexport default Search;\r\n","import React, { Component } from 'react';\r\n\r\nimport { Link } from 'react-router-dom';\r\n\r\nimport TextInput from '../FocusBox/Inputs/TextInput';\r\nimport Image from '../Form/Image';\r\nimport Backdrop from '../Backdrop';\r\nimport Spinner from '../Spinner';\r\n\r\nimport * as timeLineAPI from '../../api/timeLineAPI';\r\n\r\nimport { formatTimespan } from '../../utils/text';\r\nimport { debounce } from '../../utils/general';\r\n\r\nimport './Search.scss';\r\n\r\nclass Search extends Component {\r\n\tconstructor(props) {\r\n\t\tsuper(props);\r\n\t\tthis.state = {\r\n\t\t\ttitle: '',\r\n\t\t\tresults: null,\r\n\t\t};\r\n\t}\r\n\r\n\tgetSearchResults = (e) => this.setState(\r\n\t\t{ title: e.target.value },\r\n\t\t// setState callback\r\n\t\tthis.callSearchAPI,\r\n\t);\r\n\r\n\tcallSearchAPI = debounce(() => {\r\n\t\tconst title = this.state.title;\r\n\r\n\t\tif (title.length < 3) {\r\n\t\t\tthis.setState(() => ({ results: null }));\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\ttimeLineAPI.search(title)\r\n\t\t\t.then(resp => {\r\n\t\t\t\tif (!resp.success) {\r\n\t\t\t\t\t// TASK: Handle error\r\n\t\t\t\t\treturn;\r\n\t\t\t\t}\r\n\r\n\t\t\t\tthis.setState(() => ({\r\n\t\t\t\t\tresults: resp.data\r\n\t\t\t\t}));\r\n\t\t\t});\r\n\t}, 300);\r\n\r\n\tclearSearch = () => this.setState(() => ({ title: '', results: null }));\r\n\r\n\trenderResults = (title, results) => {\r\n\t\tif (results === null && title.length > 0) {\r\n\t\t\treturn (\r\n\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t);\r\n\t\t} else if (results === null) {\r\n\t\t\treturn null;\r\n\t\t} else if (results && results.length === 0) {\r\n\t\t\treturn (\r\n\t\t\t\tNo results
\r\n\t\t\t);\r\n\t\t}\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t{results.map(result => (\r\n\t\t\t\t\t\r\n\t\t\t\t\t\t
\r\n\t\t);\r\n\t};\r\n\r\n\trender() {\r\n\t\tconst {\r\n\t\t\ttitle,\r\n\t\t\tresults,\r\n\t\t} = this.state;\r\n\r\n\t\tconst isResultsOpen = title.length > 0;\r\n\r\n\t\tconst classes = [ 'search' ];\r\n\t\tif (this.props.className) {\r\n\t\t\tclasses.push(this.props.className);\r\n\t\t}\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t\t\t\t{result.title}\r\n\t\t\t\t\t\t\t{result.numberOfMoments > 0 && {result.numberOfMoments} moments}\r\n\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\r\n\t\t\t\t))}\r\n\t\t\t\r\n\t\t\t\t\t\t\t\t{formatTimespan(result.fromYear, result.toYear)}\r\n\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\r\n\t\t\t\t\r\n\t\t\t\t\r\n\t\t\t\t\tSearch\r\n\t\t\t\t\r\n\t\t\t
\r\n\t\t);\r\n\t}\r\n};\r\n\r\nexport default Search;\r\n","import React, { Component } from 'react';\r\nimport { connect } from 'react-redux';\r\nimport { Link } from 'react-router-dom';\r\n\r\nimport * as util from '../../utils/general';\r\n\r\nimport UserMenu from '../UserMenu/UserMenu';\r\nimport Logo from '../Brand/Logo';\r\nimport Search from '../Search';\r\n\r\nimport './Header.scss';\r\n\r\nclass Header extends Component {\r\n\tconstructor(props) {\r\n\t\tsuper(props);\r\n\r\n\t\tthis.state = {\r\n\t\t\tuserMenuActive: false,\r\n\t\t};\r\n\t}\r\n\r\n\ttoggleUserMenu = () => {\r\n\t\tthis.setState({\r\n\t\t\tuserMenuActive: !this.state.userMenuActive,\r\n\t\t});\r\n\t};\r\n\r\n\trenderRightMenu = (isResponsive, isSignedIn, cartItems) => {\r\n\t\tconst notifyCount = cartItems.length;\r\n\t\tlet notifyCountDisplay = notifyCount;\r\n\t\tlet notifyClassName = 'badge';\r\n\t\tif (notifyCount > 99) {\r\n\t\t\tnotifyCountDisplay = '99+';\r\n\t\t\tnotifyClassName += ' badge-lg';\r\n\t\t}\r\n\r\n\t\tif (isSignedIn) {\r\n\t\t\treturn (\r\n\t\t\t\t\r\n\t\t\t\t\t{!isResponsive &&\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t{notifyCount > 0\r\n\t\t\t\t\t\t\t\t\t? {notifyCountDisplay}\r\n\t\t\t\t\t\t\t\t\t: ''\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t}\r\n\t\t\t\t
\r\n\t\t\t);\r\n\t\t}\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t{isResponsive &&\r\n\t\t\t\t\t\r\n\t\t\t\t\t\tSearch\r\n\t\t\t\t\t\r\n\t\t\t\t}\r\n\t\t\t\t\r\n\t\t\t\t\tSign in\r\n\t\t\t\t\r\n\t\t\t\t\r\n\t\t\t\t\tRegister\r\n\t\t\t\t\r\n\t\t\t
\r\n\t\t);\r\n\t};\r\n\r\n\trenderLeftUserMenu(isResponsive, isSignedIn) {\r\n\t\tif (!isSignedIn) {\r\n\t\t\tif (isResponsive) {\r\n\t\t\t\treturn null;\r\n\t\t\t} else {\r\n\t\t\t\treturn ;\r\n\t\t\t}\r\n\t\t}\r\n\r\n\t\tvar notifyCount = 0;\r\n\t\tvar notifyCountDisplay = notifyCount;\r\n\t\tvar notifyClassName = 'badge';\r\n\t\tif (notifyCount > 99) {\r\n\t\t\tnotifyCountDisplay = '99+';\r\n\t\t\tnotifyClassName += ' badge-lg';\r\n\t\t}\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t\r\n\t\t\t\t\t{notifyCount > 0\r\n\t\t\t\t\t\t? {notifyCountDisplay}\r\n\t\t\t\t\t\t: ''\r\n\t\t\t\t\t}\r\n\t\t\t\t\r\n\t\t\t\t
\r\n\t\t);\r\n\t}\r\n\r\n\trender () {\r\n\t\tvar {\r\n\t\t\tprofile,\r\n\t\t\taudience,\r\n\t\t\tglobal,\r\n\t\t\tcart,\r\n\t\t} = this.props;\r\n\r\n\t\tconst isResponsive = global.breakpoint.level <= util.breakpoints['tablet'];\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t
\r\n\t\t);\r\n\t}\r\n}\r\n\r\n// make the sign in: key's data (within the global state), prop(s) to this component\r\nconst mapStateToProps = (state) => {\r\n\treturn {\r\n\t\taudience: state.audience,\r\n\t\tprofile: state.profile,\r\n\t\tglobal: state.global,\r\n\t\tcart: state.cart,\r\n\t};\r\n}\r\n\r\nexport default connect(\r\n\tmapStateToProps,\r\n)(Header);\r\n","import React, { Component } from 'react';\r\nimport { connect } from 'react-redux';\r\n\r\nimport './Message.scss';\r\n\r\nclass Message extends Component {\r\n\tonClose = () => {\r\n\t\tthis.props.onSetMessage({message: undefined});\r\n\t\t// TODO: implement better solution to turning off spinners when alert terminates.\r\n\t\tif(document.body.contains(document.getElementById('theSpin'))){\r\n\t\t\tdocument.getElementById('theSpin').className = '';\t\t// spin the icon in the right box\r\n\t\t\tdocument.getElementById('theSocial').className = '';\t// hide the social sign in options\r\n\t\t}\r\n\t}\r\n\r\n\trenderEmailLink = () => {\r\n\t\tconst { title, actionEmail, message, description, detail, id, } = this.props.global;\r\n\t\tif(actionEmail) {\r\n\t\t\tlet theHref = `mailto:${this.props.audience.supportEmail}?subject=${title}&body=${message}%0D%0A\r\n\t\t\t${description}%0D%0A\r\n\t\t\t${detail}%0D%0A\r\n\t\t\tAlertID: ${id}%0D%0A\r\n\t\t\t%0D%0A`;\r\n\t\t\treturn (\r\n\t\t\t\t\r\n\t\t\t\t\t{this.renderLeftUserMenu(isResponsive, profile.isSignedIn)}\r\n\r\n\t\t\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t{audience.brand.displayName &&
\r\n\t\t\t\t{!isResponsive && {audience.brand.name}
}\r\n\t\t\t\t\t\r\n\t\t\t\t\r\n\t\t\t\t
\r\n\t\t);\r\n\t}\r\n};\r\n\r\nconst mapStateToProps = (state) => {\r\n\treturn {\r\n\t\tglobal: state.global,\r\n\t\taudience: state.audience,\r\n\t};\r\n};\r\n\r\n// maps dispatch action creator to be a prop of this component\r\nconst mapDispatchToProps = (dispatch, ownProps) => {\r\n\treturn {\r\n\t\tonSetMessage: (data) => {\r\n\t\t\tdispatch({\r\n\t\t\t\ttype: 'SET_MESSAGE',\r\n\t\t\t\tdata,\r\n\t\t\t});\r\n\t\t},\r\n\t};\r\n};\r\n\r\nexport default connect(\r\n\tmapStateToProps,\r\n\tmapDispatchToProps,\r\n)(Message);","import React, { Component } from 'react';\r\n\r\nimport Spinner from '../../Spinner/Spinner';\r\n\r\nimport './Button.scss';\r\n\r\n\r\nclass Button extends Component {\r\n\tstatic fieldType = 'Button';\r\n\r\n\trender() {\r\n\t\tconst {\r\n\t\t\tclassName,\r\n\t\t\tcolor,\r\n\t\t\tloading,\r\n\t\t\tonClick,\r\n\t\t\tdisabled,\r\n\t\t\tchildren,\r\n\t\t\t...otherProps\r\n\t\t} = this.props;\r\n\r\n\t\tconst classes = [ 'formButton' ];\r\n\r\n\t\tif (className) {\r\n\t\t\tclasses.push(className);\r\n\t\t}\r\n\r\n\t\tif (color) {\r\n\t\t\tclasses.push(`formButton--${color}`);\r\n\t\t}\r\n\r\n\t\tif (disabled || loading) {\r\n\t\t\tclasses.push('formButton--disabled');\r\n\t\t}\r\n\r\n\t\tdelete(otherProps.isSubmit);\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\r\n\t\t\t\t\t\t{title}\r\n\t\t\t\t\t
\r\n\t\t\t\t\t\r\n\t\t\t\t\t\t{description}\r\n\t\t\t\t\t
\r\n\t\t\t\t\t\r\n\t\t\t\t\t\t{message}
\r\n\t\t\t\t\t\t{detail}
\r\n\t\t\t\t\t\t{alertID}
\r\n\t\t\t\t\t\t{this.renderEmailLink()}\r\n\t\t\t\t\t
\r\n\t\t\t\t\t\r\n\t\t\t\t\t\t{detail}
\r\n\t\t\t\t\t\t{alertID}
\r\n\t\t\t\t\t\t{this.renderEmailLink()}\r\n\t\t\t\t\t
\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t{actionLabel}\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\t e.stopPropagation()}>\r\n\t\t\t\t
\r\n\t\t);\r\n\t}\r\n}\r\n\r\nconst mapStateToProps = (state, props) => {\r\n\tconst lifeTimeLine = state.lifeTimeLines[props.lifeTimeLineID];\r\n\r\n\tif (!lifeTimeLine) {\r\n\t\treturn {};\r\n\t}\r\n\r\n\tlet moment = lifeTimeLine.moments.find(m => m.momentId === props.momentID);\r\n\r\n\treturn {\r\n\t\tmoment,\r\n\t};\r\n};\r\n\r\n// maps dispatch action creator to be a prop of this component\r\nconst mapDispatchToProps = (dispatch, ownProps) => {\r\n\treturn {\r\n\t\tonDeleteMoment: (data) => {\r\n\t\t\tdispatch({\r\n\t\t\t\ttype: 'DELETE_LIFETIMELINE_MOMENT',\r\n\t\t\t\tdata,\r\n\t\t\t});\r\n\t\t},\r\n\t};\r\n};\r\n\r\nexport default connect(\r\n\tmapStateToProps,\r\n\tmapDispatchToProps,\r\n)(DeleteMoment);\r\n","import DeleteMoment from './DeleteMoment';\r\n\r\n// Makes DeleteMoment the default import for this folder\r\nexport default DeleteMoment;\r\n","import React, { Component } from 'react';\r\nimport { connect } from 'react-redux';\r\n\r\nimport Button from '../../../Form/Button';\r\n\r\nimport { dispatchError } from '../../../../utils/general';\r\n\r\nimport * as cartAPI from '../../../../api/cartAPI';\r\n\r\nimport './ClearCart.scss';\r\n\r\nclass ClearCart extends Component {\r\n\thandleClearCart = () => {\r\n\t\tconst {\r\n\t\t\tcart,\r\n\t\t} = this.props;\r\n\r\n\t\tif (!cart || !cart.items) {\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tnew Promise((resolve, reject) => {\r\n\t\t\tcart.items.map(item => this.removeItem(item.cartItemId, reject));\r\n\t\t\tresolve();\r\n\t\t})\r\n\t\t.then(this.props.onClose());\r\n\t};\r\n\r\n\tremoveItem = (cartItemId, reject) => {\r\n\t\tcartAPI.deleteCartItem(cartItemId)\r\n\t\t\t.then((resp) => {\r\n\t\t\t\tif (resp.success) {\r\n\t\t\t\t\tthis.props.removeItem(cartItemId);\r\n\t\t\t\t} else {\r\n\t\t\t\t\treject();\r\n\t\t\t\t}\r\n\t\t\t})\r\n\t\t\t.catch(err => {\r\n\t\t\t\tdispatchError(err);\r\n\t\t\t\treject(err);\r\n\t\t\t});\r\n\t};\r\n\r\n\trender() {\r\n\t\tconst {\r\n\t\t\tcart,\r\n\t\t\tonClose,\r\n\t\t} = this.props;\r\n\r\n\t\tif (!cart || !cart.items) {\r\n\t\t\treturn null;\r\n\t\t}\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\tConfirm Delete\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\tAre you sure you want to delete this Moment?\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\tPermanently Delete Now\r\n\t\t\t\t\t\r\n\t\t\t\t
\r\n\t\t\t e.stopPropagation()}>\r\n\t\t\t\t
\r\n\t\t);\r\n\t}\r\n}\r\n\r\nconst mapStateToProps = (state, props) => ({\r\n\tcart: state.cart,\r\n});\r\n\r\n// maps dispatch action creator to be a prop of this component\r\nconst mapDispatchToProps = (dispatch, ownProps) => {\r\n\treturn {\r\n\t\tremoveItem: (cartItemId) => {\r\n\t\t\tdispatch({\r\n\t\t\t\ttype: 'REMOVE_CART_ITEM',\r\n\t\t\t\tdata: {\r\n\t\t\t\t\tcartItemId,\r\n\t\t\t\t},\r\n\t\t\t});\r\n\t\t},\r\n\t};\r\n};\r\n\r\nexport default connect(\r\n\tmapStateToProps,\r\n\tmapDispatchToProps,\r\n)(ClearCart);\r\n","import ClearCart from './ClearCart';\r\n\r\n// Makes ClearCart the default import for this folder\r\nexport default ClearCart;\r\n","import Modal from './Modal';\r\n\r\n// Makes Modal the default import for this folder\r\nexport default Modal;\r\n","import React from 'react';\r\nimport { connect } from 'react-redux';\r\n\r\nimport Backdrop from '../Backdrop';\r\n\r\nimport { DeleteMoment, ClearCart } from './Modals';\r\n\r\nimport './Modal.scss';\r\n\r\nconst Modal = ({ type, data, onClose }) => {\r\n\r\n\tlet content = null;\r\n\r\n\tswitch (type) {\r\n\t\tcase 'delete-moment':\r\n\t\t\tcontent = \r\n\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\tWarning\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\tAre you sure you want to clear your cart?\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\tYes, Remove all items from my cart\r\n\t\t\t\t\t\r\n\t\t\t\t
\r\n\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\r\n\t);\r\n};\r\n\r\nexport default RecordBox;\r\n","import Footer from './Footer';\r\n\r\n// Makes Footer the default import for this folder\r\nexport default Footer;\r\n","import React from 'react';\r\nimport Logo from '../../components/Brand/Logo';\r\nimport { brandConfig } from '../../api/brandConfig';\r\n\r\nimport './Footer.scss';\r\n\r\nconst Footer = () => (\r\n\t\r\n\t\t\t\t\t\t{title}\r\n\t\t\t\t\t
\r\n\t\t\t\t\t{timespan &&\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t{timespan}\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\t}\r\n\t\t\t\t\r\n\t\t
\r\n);\r\n\r\nexport default Footer;","import React, { Component } from 'react';\r\nimport { connect } from 'react-redux';\r\nimport { Link } from 'react-router-dom';\r\nimport * as timeLineAPI from '../../api/timeLineAPI';\r\n//import { brandConfig } from '../../api/brandConfig';\r\n\r\nimport RecordBox from '../../components/RecordBox/RecordBox';\r\nimport Spinner from '../../components/Spinner';\r\nimport Logo from '../../components/Brand/Logo';\r\nimport Footer from '../../components/Footer';\r\n\r\nimport './Home.scss';\r\n\r\nclass Home extends Component {\r\n\tconstructor(props) {\r\n\t\tsuper(props);\r\n\r\n\t\tthis.state = {\r\n\t\t\tlifeTimeLines: [],\r\n\t\t\tloading: true,\r\n\t\t};\r\n\r\n\t\ttimeLineAPI.getAllPublic()\r\n\t\t\t.then(resp => {\r\n\t\t\t\tif (resp.success) {\r\n\t\t\t\t\tthis.setState({\r\n\t\t\t\t\t\tlifeTimeLines: resp.data,\r\n\t\t\t\t\t\tloading: false,\r\n\t\t\t\t\t});\r\n\t\t\t\t} else {\r\n\t\t\t\t\tthis.setState({ loading: false });\r\n\t\t\t\t}\r\n\t\t\t});\r\n\t}\r\n\r\n\trenderLifeTimelines = (lifeTimeLines) => {\r\n\t\tif (!lifeTimeLines) {\r\n\t\t\treturn null;\r\n\t\t}\r\n\t\tconst recordBoxesAcross = Math.floor(window.innerWidth/306.66);\r\n\t\tconst getToRecordPosition = recordBoxesAcross === 3 ? 5 : 7; // this gets 6 records if width = 3 across and 8 in all other cases.\r\n\t\treturn Object.keys(lifeTimeLines).map((lifeTimeLineID, i) => {\r\n\t\t\tif (i > getToRecordPosition) {\r\n\t\t\t\treturn null;\r\n\t\t\t}\r\n\r\n\t\t\t//console.log('ownerEntityId',lifeTimeLines[lifeTimeLineID].ownerEntityId,'entityId',this.props.profile.entityId)\r\n\t\t\treturn (\r\n\t\t\t\t\r\n\r\n\t\t\t
\r\n\t\r\n\r\n\r\n\t\t\t\t\r\n\t\t\t\t
\r\n\r\n\t\t\tYou can also connect with us on social media.
\r\n\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t
\r\n\r\n\r\n\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\r\n\t\t\t\t\t\t
\r\n\t\t\t\tSydney - Head Office
\r\n\t\t\t\t\t\tSuite 206, Level 2, 74 Pitt Street
\r\n\t\t\t\t\t\tSydney NSW 2000
\r\n\t\t\t\t\t\tAustralia
\r\n\t\t\t\t\t\r\n\t\t\t\t
\r\n\r\n\t\t\tTrust Matters
\r\n\t\t\t\tWe are passionate about the service we provide and a very large part of that is\r\n\t\t\t\t\tgiving our users the confidence of knowing we do not on-sell, or even share, their private data with anyone.
\r\n\t\t\t\tWe do not sell or host any advertising so our users know when someone is looking at their LifeTimeLine, that is all they will see. No ads.
\r\n\r\n\t\t\t\tPrivacy Policy
\r\n\t\t\t\tWe are very serious about keeping your private data safe. You can view our full Privacy Policy, Terms and Conditions and Copyright Notice here.
\r\n\t\t\t\r\n\t\t\t\t
\r\n\r\n\t\tLifeTimeLine® is an ad-free, community-centric and permanent online space. It provides a safe and respectful place to create memorials and lasting life stories. It's a way to share your story around the world and across generations.
\r\n\r\n\t\t\t\tThe In Memoriam logo and LifeTimeLine are Registered Trademarks of In Memoriam Group Pty. Ltd. ACN: 613 859 484 corporate@inmemoriam.com
\r\n\t\t\t\tAll content is protected under copyright © 2016 In Memoriam Group Pty Ltd.
\r\n\t\t\t\tNo content appearing on this website may be used without express written permission.
\r\n\t\t\t\r\n\t\t\t\t
\r\n\t\t);\r\n\t}\r\n};\r\n\r\nconst mapStateToProps = (state) => {\r\n\treturn {\r\n\t\taudience: state.audience,\r\n\t\tprofile: state.profile,\r\n\t};\r\n}\r\n\r\n\r\nexport default connect(\r\n\tmapStateToProps,\r\n)(Home);\r\n","import React, { Component } from 'react';\r\nimport { connect } from 'react-redux';\r\n//import { Link } from 'react-router-dom';\r\nimport * as timeLineAPI from '../../api/timeLineAPI';\r\n//import { brandConfig } from '../../api/brandConfig';\r\n\r\nimport RecordBox from '../../components/RecordBox/RecordBox';\r\nimport Spinner from '../../components/Spinner';\r\nimport Logo from '../../components/Brand/Logo';\r\nimport Footer from '../../components/Footer';\r\n\r\nimport './HomePartner.scss';\r\n\r\nclass HomePartner extends Component {\r\n\t_isMounted = false;\r\n\tconstructor(props) {\r\n\t\tsuper(props);\r\n\t\tthis.state = {\r\n\t\t\tlifeTimeLines: [],\r\n\t\t\tloading: true\r\n\t\t};\r\n\r\n\t}\r\n\r\n\tcomponentDidMount = () => {\r\n\t\tthis._isMounted = true;\r\n\r\n\t\ttimeLineAPI.getAllPublic()\r\n\t\t\t.then(resp => {\r\n\t\t\t\tconsole.log('HP.26 _isMounted = ', this._isMounted );\r\n\t\t\t\tif (!this._isMounted) {\r\n\t\t\t\t\tconsole.log('HP.27 Canceled the subscription as the component has been un-mounted.');\r\n\t\t\t\t\treturn null;\r\n\t\t\t\t}\r\n\t\t\t\tif (resp.success) {\r\n\t\t\t\t\tthis.setState({\r\n\t\t\t\t\t\tlifeTimeLines: resp.data,\r\n\t\t\t\t\t\tloading: false,\r\n\t\t\t\t\t});\r\n\t\t\t\t} else {\r\n\t\t\t\t\tthis.setState({ loading: false });\r\n\t\t\t\t}\r\n\t\t\t});\r\n\t}\r\n\r\n\tcomponentWillUnmount = () => {\r\n\t\tthis._isMounted = false;\r\n\t\tconsole.log('HP.48 _isMounted = ', this._isMounted );\r\n\t}\r\n\r\n\trenderLifeTimelines = (lifeTimeLines) => {\r\n\t\tif (!lifeTimeLines) {\r\n\t\t\treturn null;\r\n\t\t}\r\n\t\tconst recordBoxesAcross = Math.floor(window.innerWidth/306.66);\r\n\t\tconst getToRecordPosition = recordBoxesAcross === 3 ? 17 : 19; // this gets 18 records if width = 3 across and 20 in all other cases.\r\n\t\treturn Object.keys(lifeTimeLines).map((lifeTimeLineID, i) => {\r\n\t\t\tif (i > getToRecordPosition) {\r\n\t\t\t\treturn null;\r\n\t\t\t}\r\n\t\t\t//console.log('ownerEntityId',lifeTimeLines[lifeTimeLineID].ownerEntityId,'entityId',this.props.profile.entityId)\r\n\t\t\treturn (\r\n\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\tBeautiful and enduring life stories.
\r\n\t\t\t\t\t\t\tLifeTimeLine® is an ad-free, community-centric
\r\n\t\t\t\t\t\t\tand permanent online space. It provides a
\r\n\t\t\t\t\t\t\tsafe and respectful place to create lasting
\r\n\t\t\t\t\t\t\tlife stories. It’s a way to share your story
\r\n\t\t\t\t\t\t\taround the world and across generations.
\r\n\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\tCompare our Products
\r\n\t\t\t\t\t\t\t\tTry it out for free or jump in with both feet. Compare our product offerings in detail.
\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\tWhat is LifeTimeLine?
\r\n\t\t\t\t\t\t\t\tTake a look at what LifeTimeLine does for you and we'll tell you a little bit about us too.
\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\r\n\t\t\t\t\tQuick Start Guide
\r\n\t\t\t\t\t\t\t\tQuickly and easily publish a LifeTimeLine for free in just a few minutes from any device.
\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\r\n\t\t\t\t\t\t{lifeTimeLines}\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t
\r\n\t\t);\r\n\t}\r\n};\r\n\r\nconst mapStateToProps = (state) => {\r\n\treturn {\r\n\t\taudience: state.audience,\r\n\t\tprofile: state.profile,\r\n\t};\r\n}\r\n\r\n\r\nexport default connect(\r\n\tmapStateToProps,\r\n)(HomePartner);\r\n","import React, { Component } from 'react';\r\n//import { Link } from 'react-router-dom';\r\nimport { brandConfig } from '../../api/brandConfig';\r\n\r\nimport Logo from '../../components/Brand/Logo';\r\nimport Footer from '../../components/Footer';\r\n\r\nimport './PrivacyPolicy.scss';\r\n\r\nclass PrivacyPolicy extends Component {\r\n\tconstructor(props) {\r\n\t\tsuper(props);\r\n\r\n\t\tthis.state = {\r\n\t\t\tlifeTimeLines: [],\r\n\t\t\tloading: true,\r\n\t\t};\r\n\r\n\r\n\t}\r\n\r\n\r\n\r\n\trender() {\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t{audience.strip.managerName}
\r\n\t\t\t\t\t\t\t{audience.strip.managerRole}
\r\n\t\t\t\t\t\t\t{audience.strip.homePitch}
\r\n\t\t\t\t\t\t\r\n\r\n\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\tBeautiful and enduring life stories.
\r\n\t\t\t\t\t\t\tLifeTimeLine® is an ad-free, community-centric
\r\n\t\t\t\t\t\t\tand permanent online space. It provides a
\r\n\t\t\t\t\t\t\tsafe and respectful place to create lasting
\r\n\t\t\t\t\t\t\tlife stories. It’s a way to share your story
\r\n\t\t\t\t\t\t\taround the world and across generations.
\r\n\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\r\n\t\t\t\t\t\t{lifeTimeLines}\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t
\r\n\t\t);\r\n\t}\r\n};\r\n\r\nexport default PrivacyPolicy;\r\n","import React, { Component } from 'react';\r\n//import { Link } from 'react-router-dom';\r\nimport { brandConfig } from '../../api/brandConfig';\r\n\r\nimport Logo from '../../components/Brand/Logo';\r\nimport Footer from '../../components/Footer';\r\n\r\nimport './Help.scss';\r\n\r\nclass Help extends Component {\r\n\tconstructor(props) {\r\n\t\tsuper(props);\r\n\r\n\t\tthis.state = {\r\n\t\t\toneRevealActive: false,\r\n\t\t\ttwoRevealActive: false,\r\n\t\t\tthreeRevealActive: false,\r\n\t\t\tfourRevealActive: false,\r\n\r\n\t\t};\r\n\r\n\r\n\t}\r\n\r\n\ttoggleReveal = (revealContext) => {\r\n\t\tthis.setState({\r\n\t\t\t[revealContext]: !this.state[revealContext],\r\n\t\t});\r\n\t}\r\n\r\n\trender() {\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\tPrivacy Policy
\r\n\t\t\t\t\t\t\tTerms & Conditions
\r\n\t\t\t\t\t\t\tCopyright Notice
\r\n\t\t\t\t\t\t\tWe'll protect your private data and
only contact you when we need to.
\r\n\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\t\r\n\t\t\t\t\t\t\t
\r\n\t\t\t\t\tWhen you use our services, you trust us with your information. The Privacy Policy, the Terms and Conditions and the\r\n\t\t\t\t\t\t\t\tCopyright Notice help you understand what data we collect, why we collect it, and what we do with it\r\n\t\t\t\t\t\t\t\tas well as your obligations and expectations when using our service. We’ve tried to keep it as simple as possible,\r\n\t\t\t\t\t\t\t\tbut if you have any questions contact us.\r\n\t\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\r\n\r\n\r\n
\r\n\r\nPrivacy Policy
\r\nVersion 0.0.2
\r\n\r\n\tInformation we collect
\r\n\tWe collect information in the following ways:
\r\n\r\n\tInformation you give us.
\r\n\tSuch as when you to register or purchase something through our system.
\r\n\tWhen you do, we’ll ask for personal information, like your name, email address, telephone number or credit card to store with your account.
\r\n\r\n\tInformation we get from your use of our services.
\r\n\tWe collect information about the services that you use and how you use them, like when you upload an image, or view and interact with our users and content.
\r\n\tThis information includes:
\r\n\r\n\tDevice information
\r\n\tWe collect device-specific information (such as your hardware model, operating system version, unique device identifiers,and mobile network information including phone number).
\r\n\r\n\tLog information
\r\n\tWhen you use our services or view content provided by us, we automatically collect and store certain information in server logs.
\r\n\r\n\tLocal storage
\r\n\tWe may collect and store information (including personal information) locally on your device using mechanisms such as browser web storage (including HTML 5) and application data caches.
\r\n\r\n\tCookies and similar technologies
\r\n\tWe may use various technologies to collect, store and protect your information. This may include using cookies or similar technologies to identify your browser or device.
\r\n\r\n\tHow we use information we collect
\r\n\tWe use the information we collect to provide, maintain, protect and improve them, to develop new ones, and to protect us and our users. We may also use this information to offer you tailored content – like giving you more relevant search results.
\r\n\tIf you have an Account, we may display your Profile name, Profile photo, and actions you take on our service, such as 'likes' etc., and comments you post and content you author.
\r\n\tWhen you contact us, we keep a record of your communication to help solve any issues you might be facing. We may use your email address to inform you about our services, such as letting you know about upcoming changes or improvements.
\r\n\tWe use information collected from cookies and other technologies, like pixel tags, to improve your user experience and the overall quality of our services.
\r\n\tWe will ask for your consent before using information for a purpose other than those that are set out in this Privacy Policy.
\r\n\tWe process personal information on our servers in many countries around the world. We may process your personal information on a server located outside the country where you live.
\r\n\r\n\tInformation you share
\r\n\tMany of our services let you share information with others. Remember that when you share information publicly, it may be indexable by search engines, including Google.
\r\n\r\n\r\n\r\n\t
\r\n\r\nPrivacy Policy continued
\r\n\r\n\tAccessing and updating your personal information
\r\n\tWhenever you use our services, we aim to provide you with access to your personal information. If that information is wrong, we strive to give you ways to update it quickly or to delete it – unless we have to keep that information for legitimate business or legal purposes.
\r\n\tWe aim to maintain our services in a manner that protects information from accidental or malicious destruction. Because of this, after you delete information from our services, we may not immediately delete residual copies from our active servers and may not remove information from our backup systems.
\r\n\r\n\tInformation we share
\r\n\tWe do not share personal information with companies, organizations and individuals unless one of the following circumstances applies:
\r\n\tBy your explicit instruction
\r\n\tWe may share personal information with companies, organizations or individuals when you explicitly instruct us to do so.
\r\n\tFor legal reasons
\r\n\tWe will share personal information with companies, organizations or individuals if we have a good-faith belief that access, use, preservation or\tdisclosure of the information is reasonably necessary to:
\r\n\tmeet any applicable law, regulation, legal process or enforceable governmental request.
\r\n\tenforce applicable Terms of Service, including investigation of potential violations.
\r\n\tdetect, prevent, or otherwise address fraud, security or technical issues.
\r\n\tprotect against harm to the rights, property or safety of us, our users or the public as required or permitted by law.
\r\n\tIf we are involved in a merger, acquisition or asset sale, we will continue to ensure the confidentiality of any personal information and give affected users notice before personal information is transferred or becomes subject to a different privacy policy.
\r\n\r\n\tInformation security
\r\n\tWe work hard to protect our systems and users from unauthorized access to or unauthorized alteration, disclosure or destruction of information we hold. In particular:
\r\n\r\n\tWe encrypt many of our services using SSL.
\r\n\tWe review our information collection, storage and processing practices, including physical security measures, to guard against unauthorized access to systems.
\r\n\r\n\tWhen this Privacy Policy applies
\r\n\tOur Privacy Policy applies to all of the services offered by In Memoriam Group Pty Ltd.
\r\n\r\n\tCompliance and cooperation with regulatory authorities
\r\n\tWe regularly review our compliance with our Privacy Policy. When we receive formal written complaints, we will contact the person who made the complaint to follow up.
\r\n\tWe work with the appropriate regulatory authorities, including local data protection authorities, to resolve any complaints regarding the transfer of personal data that
\r\n\twe cannot resolve with our users directly.
\r\n\r\n\tChanges
\r\n\tOur Privacy Policy will change from time to time. We will post any privacy policy changes on this page and, if the changes are significant, we will provide a more prominent notice \t(including, for certain services, email notification of privacy policy changes).
\r\n\r\n\r\n\r\n\t
\r\n\r\n\r\n\t\t\t\t\tTerms and Conditions
\r\n\tVersion 0.0.1
\r\n\r\n\t\tGeneral
\r\n\t\tBy accessing or using the Service you agree to be bound by these Terms. If you disagree with any part of the terms then you may not access the Service.
\r\n\t\tWe reserve the right to change these terms and conditions without notice by posting the changes to our Web site.
\r\n\t\tWe or you may terminate your account and remove your data from our database at any time for any reason.
\r\n\r\n\t\tSubscriptions
\r\n\t\tSome parts of the Service may be billed on a subscription basis (\"Subscription(s)\"). If you choose a subscription, you will be billed in advance on a recurring basis and may cancel at any time.
\r\n\r\n\t\tAcceptable Use
\r\n\t\tYou will not use the system for any activity other than its intended design or any activity a reasonable person might describe as inappropriate.\r\n\t\t\tThis includes (but is not limited to);\r\n\t\t\t
\r\n\t\t\t- \r\n\t\t\t\t
- Stalking, harrassing or abusing other users \r\n\t\t\t\t
- Making false or malicious claims \r\n\t\t\t\t
- Uploading content you do not have the rights to share \r\n\t\t\t\t
- Conduct or promote illeagal activities or activities not in keeping with our Modus Operandi (safe, respectful) \r\n\t\t\t\t
- Make any attemtps to circumvent security (including attempts to upload executabel code) \r\n\t\t\t\t
- or any other activity we deem to be inappropriate. \r\n\t\t\t
Your Claims
\r\n\t\t- \r\n\t\t\t\t
- You understand and agree that you have appropriate rights all content you upload or enter into the system \r\n\t\t\t\t
- You grant us non-exclusive rights to display that content on your behalf at your request \r\n\t\t\t\t
- You have read and agree to all Terms and Conditions \r\n\t\t\t\t
- You have read, undeerstood and accept the Privacy Policy \r\n\t\t\t\t
- You have read, undeerstood and accept the Copyright Notice \r\n\t\t\t
Copyright Notice
\r\n\tVersion 0.0.1
\r\n\tThe LifeTimeLine Slide-bubble, LifeTimeLine name and the In Memoriam logo and other intellectual property remain the property of In Memoriam Group or their original owner.
\r\n\tAll content is protected under copyright law and may not be used for any purpose without express written permission.
\r\n\r\n\r\n\r\n\t\t\t\t
\r\n\t\t\t\t\t\t{this.state.threeRevealActive &&\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\t\t\t{this.state.twoRevealActive &&\r\n\t\t\t\t\t\t\t\r\n\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\t\t{this.state.oneRevealActive &&\r\n\t\t\t\t\t\t\tQuick Start Guide
\r\n\t\t\t\t\t\tBefore you begin - have one or two photos of your subject ready.
\r\n\t\t\t\t\t\tBuild over time - don't feel you need to add dozens of Moments straight away.
\r\n\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t this.toggleReveal('oneRevealActive')}>\r\n\t\t\t\t\t\t\t\t{this.state.oneRevealActive ? \"less\" : \"more\"}\r\n\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t1. Register
\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t}\r\n\r\n\t\t\t\t\t\tRegister here for free.
\r\n\t\t\t\t\t\t\t\tYou can enter as little as your email and password.
\r\n\t\t\t\t\t\t\t\tWe'll send you an email to confirm your address is correct.
\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t this.toggleReveal('twoRevealActive')}>\r\n\t\t\t\t\t\t\t\t{this.state.twoRevealActive ? \"less\" : \"more\"}\r\n\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t2. Create a LifeTimeLine
\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t}\r\n\r\n\t\t\t\t\t\tSign in to arrive at your LifeTimeLines screen.
\r\n\t\t\t\t\t\t\t\tThis is also accessible via the User Menu ( icon ) then click\r\n\t\t\t\t\t\t\t\t\t
If it is for yourself, click the link \"Add my own LifeTimeLine\"
\r\n\t\t\t\t\t\t\t\tLocated at the bottom of the blue box.
\r\n\t\t\t\t\t\t\t\tIf it's for someone else, enter the first and last name and click 'Add a New Record'
\r\n\t\t\t\t\t\t\t\tYou'll be taken to the new LifeTimeLine screen.
\r\n\t\t\t\t\t\t\t\tClick on the person sihlouette and choose the image from your computer or device
\r\n\t\t\t\t\t\t\t\tEnter a 'From year' (usually the year of birth) and a short description then click 'Save'
\r\n\t\t\t\t\t\t\t\tYou can update this record at any time.
\r\n\t\t\t\t\t\t\t\tYou are now ready to add Moments.
\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t this.toggleReveal('threeRevealActive')}>\r\n\t\t\t\t\t\t\t\t{this.state.threeRevealActive ? \"less\" : \"more\"}\r\n\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t3. Add Moments
\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t}\r\n\r\n\t\t\t\t\t\tAssumes you are signed in and looking at a LifeTimeLine for which you are an author.
\r\n\t\t\t\t\t\t\t\tClick the 'Add a Moment' button.
\r\n\t\t\t\t\t\t\t\tClick the image icon and choose an image from your computer.
\r\n\t\t\t\t\t\t\t\tEnter a date (at least the year) and a Description then click 'Save'.
\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t this.toggleReveal('fourRevealActive')}>\r\n\t\t\t\t\t\t\t\t{this.state.fourRevealActive ? \"less\" : \"more\"}\r\n\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t{this.state.fourRevealActive &&\r\n\t\t\t\t\t\t\t4. Publish your LifeTimeLine
\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t}\r\n\r\n\t\t\t\t\t\tWhen you are happy with your content, you can click the 'Publish' icon.
\r\n\t\t\t\t\t\t\t\tYou can continue adding moments.
\r\n\t\t\t\t\t\t\tPhotos
\r\n\t\t\t\t\t\tThere are several good apps you can use to scan photos with your phone.
\r\n\t\t\t\t\t\tWe recommend Google Photos Scan.
\r\n\r\n\t\t\t\t\t\tNeed More Help?
\r\n\t\t\t\t\t\tWe understand, everyone is different and sees things from a unique perspective.\r\n\t\t\t\t\t\t\t
If you are having trouble using the system we really want to know.\r\n\t\t\t\t\t\t\t
It's the best way we can build a better system so contact us.
\r\n\t\t\t\t
\r\n\t\t);\r\n\t}\r\n};\r\n\r\nexport default About;\r\n","import React from 'react';\r\n\r\nimport Logo from '../../components/Brand/Logo';\r\n\r\nimport './FocusBox.scss';\r\n\r\nconst FocusBox = ({ className, brand, children }) => {\r\n\tif (!children || children.length === 0) {\r\n\t\treturn null;\r\n\t}\r\n\r\n\tlet leftContent = children;\r\n\tif (Array.isArray(children)) {\r\n\t\tleftContent = children[0];\r\n\t}\r\n\r\n\tconst isTwin = children && children.length === 2;\r\n\r\n\tconst focusBoxClasses = ['focusBox'];\r\n\r\n\tif (className) {\r\n\t\tfocusBoxClasses.push(className);\r\n\t}\r\n\r\n\tlet rightContent = null;\r\n\tif (isTwin) {\r\n\t\tfocusBoxClasses.push('focusBox--twin');\r\n\r\n\t\trightContent = (\r\n\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\r\n\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t\t\t
\r\n\r\n\t\t\t\t\t\tWhat is a LifeTimeLine?
\r\n\t\t\t\t\t\t\tA LifeTimeLine is an organised collection of Moments and information about a person.
\r\n\t\t\t\t\t\t\tMoments are bits of content (initially just photos, but we are working on other content like videos too) that you can upload, document and share.\r\n\t\t\t\t\t\t\t\tBeing able to describe the details of a Moment, who is involved, where and why it was taken, can add an important dimension to each Moment and\r\n\t\t\t\t\t\t\t\tyour story as a whole.\r\n\t\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\tWhat should I put in a Moment?
\r\n\t\t\t\t\t\t\tA Moment can be about anything. It might be an important event such as when you started a new job or moved into your first house.\r\n\t\t\t\t\t\t\t\tIt might also be an everyday Moment such as you enjoying a ritual morning coffee in your kitchen.\r\n\t\t\t\t\t\t\t\tIt's these Moments, anecdotal or defining, that so often get lost to time but can be a fascinating insight into your life.\r\n\t\t\t\t\t\t\t\t{/* If you are stuck for something to say, just say whatever you would to someone you are sharing the photo with in person.\r\n\t\t\t\t\t\t\t\tYou can always come back and update it. */}\r\n\t\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\tWho would be interested in my life?
\r\n\t\t\t\t\t\t\tPrimarily, friends and family, as well as descendants - even ones you may never meet.\r\n\t\t\t\t\t\t\t\tImagine being able to open a detailed pictorial account of the life of one of your great, great grandparents.\r\n\t\t\t\t\t\t\t\tBut even if you have no family, we are all connected and everyone's story is important.\r\n\t\t\t\t\t\t\t\tThink of where you live or work.\r\n\t\t\t\t\t\t\t\tWas there someone there 50 or even 100 years ago?\r\n\t\t\t\t\t\t\t\tWhat was their life like?\r\n\t\t\t\t\t\t\t\tWho will be there 100 years from now?\r\n\t\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\tDoes it take long to build?
\r\n\t\t\t\t\t\t\tYou can build your story over time.\r\n\t\t\t\t\t\t\t\tSet a goal of uploading a moment, say, every week or so.\r\n\t\t\t\t\t\t\t\tYou'll be surprised how quickly you build up a meaningful archive.\r\n\t\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\tHow does it work?
\r\n\t\t\t\t\t\t\t{/*You can tell your story now
and for generations to come.
The LifeTimeLine.com platform allows you to upload and document a pictorial story of the Moments that make up your life experience,\r\n\t\t\t\t\t\t\t\tor that of someone close to you.\r\n\t\t\t\t\t\t\t\tIt will publish your LifeTimeLine forever in a moderated, safe and importantly ad free environment.\r\n\t\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t![\"Chester](\"https://cdn.inmemoriam.com/images/about-chester-nutting-facebook-share-preview-V03.png\")
\r\n\t\t\t\t\t\t
\r\n\r\n\t\t\t\t\t\tWhy we built it.
\r\n\t\t\t\t\t\t\tRawdyn Nutting - Co-Founder & CPO
\r\n\t\t\t\t\t\t\tAs my father aged and communication became more difficult, members of the family gradually took over various tasks for him.\r\n\t\t\t\t\t\t\t\tOne of my roles was keeping him in touch with his old classmates from Royal Military College Duntroon from which he graduated in 1955.\r\n\t\t\t\t\t\t\t\tDuntroon was an incredibly important part of Dad's life.\r\n\t\t\t\t\t\t\t\tI noticed a very close camaraderie between the graduates that has lasted over 60 years and continues today.\r\n\t\t\t\t\t\t\t\tAs part of my communications with the class, I have been privileged to hear many great stories.\r\n\t\t\t\t\t\t\t\tAlong the way I was also saddened to see a few names disappear from the active registry.\r\n\t\t\t\t\t\t\t\tIt struck me these stories are being lost forever and I was filled with a sense of urgency that we need a way to capture and share them.\r\n\t\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\tThat is exactly what LifeTimeLine does.
\r\n\t\t\t\t\t\t\tYou can check out my Dad's LifeTimeLine here where I hope you will get a good idea of what this system can do.
\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t
\r\n\r\n\t\t\t\t\tIs it really online forever?
\r\n\t\t\t\t\t\t\tOur technical team are very experienced in delivering stable online software specifically designed to survive long periods of time\r\n\t\t\t\t\t\t\t\twith minimal intervention.\r\n\t\t\t\t\t\t\t\tWe also have in place a proprietary business model with multiple levels of redundancy to ensure,\r\n\t\t\t\t\t\t\t\tas much as is possible, your data will be visible into the future - even if we go out of business.\r\n\t\t\t\t\t\t\t\tWe have even gone so far as to making contingency plans should the internet ever stop existing. It sounds crazy, but we have planned for it.\r\n\t\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\tHow is it different?
\r\n\t\t\t\t\t\t\tWe are a service provider to our end customer, you. Many other systems treat the user as an\r\n\t\t\t\t\t\t\t\tasset to sell by way of selling advertising or selling user data to business. We don't do any of that.\r\n\t\t\t\t\t\t\t\tWe don't share your personal data with anyone.\r\n\t\t\t\t\t\t\t\tWe have no ads anywhere. We exist to provide you a platform to tell your story and that's it.
\r\n\r\n\t\t\t\t\t\t\tWhat about pricing?
\r\n\t\t\t\t\t\t\tWe work hard to run efficiently and deliver value to our users.\r\n\t\t\t\t\t\t\t\tWe offer a range of payment options including a free one to get you started so you can be sure this is the right home for your story.\r\n\t\t\t\t\t\t\t\tWe don't sell your private data or sell ad-space so all of our revenue is derived from our end user purchases.\r\n\t\t\t\t\t\t\t\tA large part of our model is to take a part of any profit and re-invest it into covering on-going hosting.\r\n\t\t\t\t\t\t\t\tRemember, when you buy outright we have to host it forever and that's a rather long time.\r\n\t\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\tProduct Roadmap
\r\n\t\t\t\t\t\t\tWe have a vast feature roadmap which will keep us very busy for years to come.\r\n\t\t\t\t\t\t\t\tWithout giving away too much, we can mention some of the items on our 'to-do' list.\r\n\t\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\tGenealogy Tool, Tagging, Collaboration, Gift Certificates, Video Moments, Messaging, Granular Privacy Controls, Moderation (internal and community),\r\n\t\t\t\t\t\t\t\tAlerts, Saved Searches, Watch for Changes to a LifeTimeLine, Image tools (crop, rotate etc.), print a book from a LifeTimeLine ... the list goes on.\r\n\t\t\t\t\t\t\t\t
\r\n\r\n\r\n\t\t\t\t\t\t\t{/*Broad Goals
\r\n\t\t\t\t\t\t\tAll of the work we do is with some important goals in mind. The system must be Simple to Use.\r\n\t\t\t\t\t\t\t\tIt must show Continued Improvements and remain as Affordable as Possible.\r\n\t\t\t\t\t\t\t\tAs a product and business we must protect and further our market Integrity meaning no ads or data mining.\r\n\t\t\t\t\t\t\t\tWe will strive to Continually improve security - such as proprietary copyright watermarking (in development).\r\n\t\t\t\t\t\t\t\t
\r\n\r\n\t\t\t\t\t\t\tGenealogy
\r\n\t\t\t\t\t\t\tAdding the ability to build a dynamic family tree and collaborate with others across branches and time.
\r\n\r\n\t\t\t\t\t\t\tTagging
\r\n\t\t\t\t\t\t\tWhen mentioning people in your LifeTimeLine, we will be able to build a private reference list allowing you to easily flag people in your Moments.
\r\n\r\n\t\t\t\t\t\t\tSpans™
\r\n\t\t\t\t\t\t\tThis will allow you to describe sections of your LifeTimeLine based on custom crtieria. For example, you might create Spans for the houses you lived in.
\r\n\r\n\t\t\t\t\t\t\tCollaboration
\r\n\t\t\t\t\t\t\tAdding the tools to allow multiple people to author and manage a LifeTimeLine including showing authors relationship to the subject so viewers\r\n\t\t\t\t\t\t\t\tunderstand the context of the information. Other tools allowing collaboration from family and friends will include advanced moderation\r\n\t\t\t\t\t\t\t\ttools to ensure LifeTimeLine remains a safe place to share memories.
\r\n\r\n\t\t\t\t\t\t\tCustom Domains and Custom URLs
\r\n\t\t\t\t\t\t\tWhen you create a LifeTimeLine you will be able to choose a permanent URL or domain for a small extra cost.\r\n\t\t\t\t\t\t\t\tThis means that instead of sharing (say) lifetimeline.com/1 you could hsare lifetimeline.com/chester or even a\r\n\t\t\t\t\t\t\t\tdomain of your own choice such as chester-nutting.com.
\r\n\r\n\t\t\t\t\t\t\tGift Certificates
\r\n\t\t\t\t\t\t\tAdding the ability for you to buy a LifeTimeLine for a friend or family member.
\r\n\r\n\t\t\t\t\t\t\tInteractions
\r\n\t\t\t\t\t\t\tWill allow you to interact with LifeTimeLines and Moments to Like, bookmark, report, share, and comment.
\r\n\r\n\t\t\t\t\t\t\tVideo
\r\n\t\t\t\t\t\t\tBeing able to add Moments other than images. This will include video, documents and possible other content types.
\r\n\r\n\t\t\t\t\t\t\tPrivacy Controls
\r\n\t\t\t\t\t\t\tThis is a high priority item. Our design will allow you to control at a granular level who has access to\r\n\t\t\t\t\t\t\t\tview your LifeTimeLine record and when. For example, you may set it to (say) Friends and Family now and anyone in 100 years.
\r\n\r\n\t\t\t\t\t\t\tMessaging
\r\n\t\t\t\t\t\t\tBeing able to send and receive messages about a LifeTimeLine in a secure and safe environment where you remain protected\r\n\t\t\t\t\t\t\t\tbehind the LifeTimeLine system.
\r\n\r\n\t\t\t\t\t\t\tModeration
\r\n\t\t\t\t\t\t\tAdvanced moderation tools will allow trusted users to add content quickly and at the same time protect viewers from inappropriate content.
\r\n\r\n\t\t\t\t\t\t\tAlerts
\r\n\t\t\t\t\t\t\tCreate alerts so when records matcing criteria you set are created or editied, we can notify you.
\r\n\r\n\t\t\t\t\t\t\tSaved Searches
\r\n\t\t\t\t\t\t\tAllows you to save searches you want to regularly run.
\r\n\r\n\t\t\t\t\t\t\tSubscribe to changes
\r\n\t\t\t\t\t\t\tMany LifeTimeLines are built over time. You can subscribe to a LifeTimeLine and be notified when changes are made.
\r\n\r\n\t\t\t\t\t\t\tImage Tools (rotate, crop etc)
\r\n\t\t\t\t\t\t\tWill allow you to make simple edits to images such as cropping, rotating etc.
\r\n\r\n\t\t\t\t\t\t\tLinks
\r\n\t\t\t\t\t\t\tLinking LifeTimeLines such as when a person appears in a Moment in someone elses LifeTimeLine,\r\n\t\t\t\t\t\t\t\ta subtle link to that person's own LifeTimeLine is visible.
\r\n*/}\r\n\t\t\t\t\t\t\r\n\t\t\t\t{children[1]}\r\n\t\t\t
\r\n\t\t);\r\n\t}\r\n\r\n\treturn (\r\n\t\t\r\n\t\t\t
\r\n\t);\r\n}\r\n\r\nexport default FocusBox;","import React from 'react';\r\n\r\nimport './InputGroup.scss';\r\n\r\nconst InputGroup = ({ className, children, ...otherProps }) => {\r\n\tconst classes = [ 'inputGroup' ];\r\n\r\n\tif (className) {\r\n\t\tclasses.push(className);\r\n\t}\r\n\r\n\treturn (\r\n\t\t\r\n\t\t\t\t\r\n\t\t\t\t{leftContent}\r\n\t\t\t
\r\n\t\t\t{rightContent}\r\n\t\t\r\n\t\t\t{children}\r\n\t\t
\r\n\t);\r\n}\r\n\r\nexport default InputGroup;","import { sendFetchRequest, getApiContext } from './api_utils';\r\n\r\nconst personURL = `${getApiContext()}/api/person`;\r\n\r\nconst register = (primaryEmailAddress, password, firstName, lastName) => {\r\n\tconst formData = {\r\n\t\tprimaryEmailAddress,\r\n\t\tpassword,\r\n\t\tfirstName,\r\n\t\tlastName,\r\n\t};\r\n\r\n\tconst options = {\r\n\t\tmethod: 'POST',\r\n\t\theaders: {\r\n\t\t\t'Content-Type': 'application/json',\r\n\t\t},\r\n\t\tbody: JSON.stringify(formData),\r\n\t};\r\n\r\n\treturn sendFetchRequest(personURL, options);\r\n};\r\n\r\nconst get = (entityId) => {\r\n\tconst options = {\r\n\t\tmethod: 'GET',\r\n\t};\r\n\r\n\treturn sendFetchRequest(`${personURL}/${entityId}`, options);\r\n};\r\n\r\nconst requestPasswordReset = (emailAddress) => {\r\n\tconst formData = {\r\n\t\temailAddress,\r\n\t};\r\n\r\n\tconst options = {\r\n\t\tmethod: 'POST',\r\n\t\theaders: {\r\n\t\t\t'Content-Type': 'application/json',\r\n\t\t},\r\n\t\tbody: JSON.stringify(formData),\r\n\t};\r\n\r\n\treturn sendFetchRequest(`${personURL}/password-reset`, options);\r\n};\r\n\r\nconst actionPasswordReset = (passwordResetTokenId, password) => {\r\n\tconst formData = {\r\n\t\tpasswordResetTokenId,\r\n\t\tpassword,\r\n\t};\r\n\r\n\tconst options = {\r\n\t\tmethod: 'POST',\r\n\t\theaders: {\r\n\t\t\t'Content-Type': 'application/json',\r\n\t\t},\r\n\t\tbody: JSON.stringify(formData),\r\n\t};\r\n\r\n\treturn sendFetchRequest(`${personURL}/password-reset/action`, options);\r\n};\r\n\r\nconst requestEmailVerify = (entityId) => {\r\n\tconst formData = {\r\n\t\tentityId,\r\n\t};\r\n\r\n\tconst options = {\r\n\t\tmethod: 'POST',\r\n\t\theaders: {\r\n\t\t\t'Content-Type': 'application/json',\r\n\t\t},\r\n\t\tbody: JSON.stringify(formData),\r\n\t};\r\n\r\n\treturn sendFetchRequest(`${personURL}/email-verify`, options);\r\n};\r\n\r\nconst actionEmailVerify = (emailVerificationTokenId) => {\r\n\tconst formData = {\r\n\t\temailVerificationTokenId,\r\n\t};\r\n\r\n\tconst options = {\r\n\t\tmethod: 'POST',\r\n\t\theaders: {\r\n\t\t\t'Content-Type': 'application/json',\r\n\t\t},\r\n\t\tbody: JSON.stringify(formData),\r\n\t};\r\n\r\n\treturn sendFetchRequest(`${personURL}/email-verify/action`, options);\r\n};\r\n\r\nconst update = (formData) => {\r\n\tconst entityId = formData.entityId\r\n\tconst options = {\r\n\t\tmethod: 'PUT',\r\n\t\theaders: {\r\n\t\t\t'Content-Type': 'application/json',\r\n\t\t},\r\n\t\tbody: JSON.stringify(formData),\r\n\t};\r\n\r\n\treturn sendFetchRequest(`${personURL}/${entityId}`, options);\r\n};\r\n\r\nexport {\r\n\tregister,\r\n\tget,\r\n\trequestPasswordReset,\r\n\tactionPasswordReset,\r\n\trequestEmailVerify,\r\n\tactionEmailVerify,\r\n\tupdate,\r\n};\r\n","import * as signInAPI from '../../api/loginAPI';\r\nimport * as personAPI from '../../api/personAPI';\r\n\r\nimport { dispatchError } from '../../utils/general';\r\n\r\nconst loadProfile = (signInData, onSuccess, onError) => {\r\n\tpersonAPI.get(signInData.entityId)\r\n\t\t.then(resp => {\r\n\t\t\tif (!resp.success) {\r\n\t\t\t\tonError('Something went wrong. Please try again.');\r\n\t\t\t\treturn;\r\n\t\t\t}\r\n\r\n\t\t\tonSuccess({\r\n\t\t\t\tisSignedIn: true,\r\n\t\t\t\t...signInData,\r\n\t\t\t\t...resp.data,\r\n\t\t\t});\r\n\t\t})\r\n\t\t.catch(err => {\r\n\t\t\tdispatchError(err);\r\n\t\t\tonError('Something went wrong. Please try again.');\r\n\t\t});\r\n};\r\n\r\nconst signIn = (email, password, onSuccess, onError) => {\r\n\tif (email.length === 0 || password.length === 0) {\r\n\t\tonError('Please enter your Email and Password.');\r\n\t\treturn;\r\n\t}\r\n\r\n\tsignInAPI.signIn(email, password)\r\n\t\t.then(resp => {\r\n\t\t\tif (!resp.success) {\r\n\t\t\t\tonError('The sign in details you provided were not valid.');\r\n\t\t\t\treturn;\r\n\t\t\t}\r\n\r\n\t\t\tloadProfile(resp.data, onSuccess, onError);\r\n\t\t})\r\n\t\t.catch(err => {\r\n\t\t\tdispatchError(err);\r\n\t\t\tonError('Something went wrong. Please try again.');\r\n\t\t});\r\n};\r\n\r\nexport default signIn;\r\n","import React, { Component } from 'react';\r\nimport { connect } from 'react-redux';\r\nimport { Link } from 'react-router-dom';\r\n\r\nimport FocusBox from '../../components/FocusBox/FocusBox';\r\nimport TextInput from '../../components/FocusBox/Inputs/TextInput';\r\nimport InputGroup from '../../components/FocusBox/Inputs/InputGroup';\r\nimport Button from '../../components/Form/Button/Button';\r\n\r\nimport * as cartAPI from '../../api/cartAPI';\r\n\r\nimport signIn from './user_utils';\r\nimport * as defer from '../../utils/defer';\r\n\r\nclass SignIn extends Component {\r\n\tstate = {\r\n\t\temail: '',\r\n\t\tpassword: '',\r\n\t\terrorMessage: '',\r\n\t\tloading: false,\r\n\t};\r\n\r\n\tcomponentDidMount() {\r\n\t\tif (this.props.profile.isSignedIn) {\r\n\t\t\tthis.props.history.push('/lifetimelines');\r\n\t\t}\r\n\t}\r\n\r\n\tonInputChange = (input) => {\r\n\t\tconst name = input.target.name;\r\n\t\tconst value = input.target.value;\r\n\r\n\t\tthis.setState({\r\n\t\t\t[name]: value,\r\n\t\t\terrorMessage: '',\r\n\t\t});\r\n\t};\r\n\r\n\thandleSignIn = () => {\r\n\t\tthis.setState({ loading: true });\r\n\r\n\t\tsignIn(\r\n\t\t\tthis.state.email,\r\n\t\t\tthis.state.password,\r\n\t\t\tthis.onSuccess,\r\n\t\t\tthis.onError,\r\n\t\t);\r\n\t};\r\n\r\n\tonSuccess = (data) => {\r\n\t\tthis.setState({ loading: false });\r\n\r\n\t\tthis.props.onSetProfile(data);\r\n\r\n\t\tcartAPI.getByPartnerID(this.props.audience.partnerID)\r\n\t\t\t.then(resp => {\r\n\t\t\t\tif (!resp.success) {\r\n\t\t\t\t\treturn;\r\n\t\t\t\t}\r\n\r\n\t\t\t\tthis.props.setCartItems(resp.data.cartId, resp.data.cartItems);\r\n\r\n\t\t\t\tconst cartItem = defer.get('ADD_PRODUCT_TO_CART_ON_SIGN_IN');\r\n\t\t\t\tif (cartItem.length > 0) {\r\n\t\t\t\t\tdefer.clear('ADD_PRODUCT_TO_CART_ON_SIGN_IN');\r\n\r\n\t\t\t\t\tconst productId = cartItem[0];\r\n\r\n\t\t\t\t\tif (productId === 'new') {\r\n\t\t\t\t\t\tthis.props.history.push('/author/new');\r\n\t\t\t\t\t\treturn;\r\n\t\t\t\t\t}\r\n\r\n\t\t\t\t\tcartAPI.addCartItem({\r\n\t\t\t\t\t\tcartId: resp.data.cartId,\r\n\t\t\t\t\t\tproductId: productId,\r\n\t\t\t\t\t\tquantity: 1,\r\n\t\t\t\t\t})\r\n\t\t\t\t\t.then(resp => {\r\n\t\t\t\t\t\tif (resp.success) {\r\n\t\t\t\t\t\t\tthis.props.addCartItem(resp.data);\r\n\t\t\t\t\t\t\tthis.props.history.push('/cart');\r\n\t\t\t\t\t\t}\r\n\t\t\t\t\t});\r\n\t\t\t\t} else {\r\n\t\t\t\t\tthis.props.history.push('/lifetimelines');\r\n\t\t\t\t}\r\n\t\t\t});\r\n\t};\r\n\r\n\tonError = (errorMessage) => {\r\n\t\tthis.setState({\r\n\t\t\terrorMessage,\r\n\t\t\tloading: false,\r\n\t\t});\r\n\r\n\t\tthis.props.onSignOut();\r\n\t};\r\n\r\n\tonHandleEnter = (event) => {\r\n\t\tif (event.key === 'Enter') {\r\n\t\t\tthis.handleSignIn();\r\n\t\t}\r\n\t};\r\n\r\n\trenderErrorMessage = (errorMessage) => {\r\n\t\tif (!errorMessage) {\r\n\t\t\treturn null;\r\n\t\t}\r\n\r\n\t\treturn {errorMessage}
\r\n\t};\r\n\r\n\trender() {\r\n\t\tconst errorMessage = this.state.errorMessage;\r\n\r\n\t\tconst spinnerClass = [ 'focusBox__spinner' ];\r\n\t\tif (this.state.loading) {\r\n\t\t\tspinnerClass.push('focusBox__spinner--active')\r\n\t\t}\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\t 0}\r\n\t\t\t\t\t\t/>\r\n\t\t\t\t\t\t 0}\r\n\t\t\t\t\t\t/>\r\n\t\t\t\t\t \r\n\r\n\t\t\t\t\t{this.renderErrorMessage(errorMessage)}\r\n\r\n\t\t\t\t\t\r\n\t\t\t\t\t\tSign in\r\n\t\t\t\t\t\r\n\r\n\t\t\t\t\t\r\n\t\t\t\t\t\tForgotten your details?\r\n\t\t\t\t\t\r\n\t\t\t\t
\r\n\t\t\t{errorMessage}
;\r\n\t};\r\n\r\n\trender() {\r\n\t\tconst errorMessage = this.state.errorMessage;\r\n\r\n\t\tconst spinnerClass = [ 'focusBox__spinner' ];\r\n\t\tif (this.state.loading) {\r\n\t\t\tspinnerClass.push('focusBox__spinner--active')\r\n\t\t}\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t\t 0}\r\n\t\t\t\t\t\trequired\r\n\t\t\t\t\t/>\r\n\r\n\t\t\t\t\t{this.renderErrorMessage(errorMessage)}\r\n\r\n\t\t\t\t\t\r\n\t\t\t\t\t\tSend Reset Link\r\n\t\t\t\t\t\r\n\r\n\t\t\t\t\t\r\n\t\t\t\t\t\tReturn to Sign In\r\n\t\t\t\t\t\r\n\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\tPassword Reset
\r\n\t\t\t\t\t\r\n\t\t\t\t\t\tEnter the email address you signed up with and click the 'Send Reset Link' button.\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\t\tAn email will be sent containing a link allowing you to reset your password.\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\t\tReset links are sent straight away so if you don't see it after a few minutes, check your spam folder.\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\t\tReset links expire after three hours.\r\n\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t\tAn email will be sent containing a link allowing you to reset your password.\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\t\tReset links are sent straight away so if you don't see it after a few minutes, check your spam folder.\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\t\tReset links expire after three hours.\r\n\t\t\t\t\t
{errorMessage}
;\r\n\t};\r\n\r\n\trender() {\r\n\t\tconst errorMessage = this.state.errorMessage;\r\n\r\n\t\tconst spinnerClass = [ 'focusBox__spinner' ];\r\n\t\tif (this.state.loading) {\r\n\t\t\tspinnerClass.push('focusBox__spinner--active')\r\n\t\t}\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\t 0}\r\n\t\t\t\t\t\t/>\r\n\t\t\t\t\t\t 0}\r\n\t\t\t\t\t\t/>\r\n\t\t\t\t\t \r\n\r\n\t\t\t\t\t{this.renderErrorMessage(errorMessage)}\r\n\r\n\t\t\t\t\t\r\n\t\t\t\t\t\tSave New Password\r\n\t\t\t\t\t\r\n\r\n\t\t\t\t\t\r\n\t\t\t\t\t\tCancel and Return to Sign In\r\n\t\t\t\t\t\r\n\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\tSet Password
\r\n\t\t\t\t\t\r\n\t\t\t\t\t\tEnter a new password and retytpe it to confirm.\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\t\tAn email will be sent containing a link allowing you to reset your password.\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\t\tThen click 'Save New Password' to complete the process.\r\n\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t\tAn email will be sent containing a link allowing you to reset your password.\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\t\tThen click 'Save New Password' to complete the process.\r\n\t\t\t\t\t
\r\n\t\t\t\t{this.state.message}\r\n\t\t\t
\r\n\t\t);\r\n\t};\r\n\r\n\trender() {\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\r\n\t\t\t\t\t\t
\r\n\t\t\t\tVerification Email Sent!
\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\tYou're almost done. Check your email for a link we have sent you. Click the link to verify you own the email address then you'll be logged in and ready to go.\r\n\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\tIf you don't see the email we sent you in a minute or so, check it has not ended up in your spam folder. If you still can't find it, click here to re-send or contact-us for help.\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\t\t{this.renderMessage(this.state.isSuccess, this.state.message)}\r\n\t\t\t\t\t\r\n\t\t\t\t\t\t\tIf you don't see the email we sent you in a minute or so, check it has not ended up in your spam folder. If you still can't find it, click here to re-send or contact-us for help.\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\t
\r\n\t\t\t\r\n\t\t\t\t\t\t
\r\n\t\t\t\t{this.state.resultHeading}
\r\n\t\t\t\t\t\t{this.state.resultMessage}
\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\tOk\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\t{errorMessage}
\r\n\t};\r\n\r\n\trender() {\r\n\t\tconst spinnerClass = [ 'focusBox__spinner' ];\r\n\t\tif (this.state.loading) {\r\n\t\t\tspinnerClass.push('focusBox__spinner--active')\r\n\t\t}\r\n\r\n\t\tconst errorMessage = this.state.errorMessage;\r\n\r\n\t\tconst emailMessages = this.getValidationMessages('PrimaryEmailAddress');\r\n\t\tconst passwordMessages = this.getValidationMessages('Password');\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\t this.emailInput = input}\r\n\t\t\t\t\t\t\tonChange={this.onInputChange}\r\n\t\t\t\t\t\t\tonBlur={e => this.validateEmail(e.target.value)}\r\n\t\t\t\t\t\t\tonKeyPress={this.onHandleEnter}\r\n\t\t\t\t\t\t\tvalidationMessages={emailMessages}\r\n\t\t\t\t\t\t\tforceShowErrors={emailMessages.length > 0 && passwordMessages.length === 0}\r\n\t\t\t\t\t\t\tforceInvalid={errorMessage.length > 0}\r\n\t\t\t\t\t\t/>\r\n\t\t\t\t\t\t this.passwordInput = input}\r\n\t\t\t\t\t\t\tonChange={this.onInputChange}\r\n\t\t\t\t\t\t\tonBlur={e => this.validatePassword(e.target.value)}\r\n\t\t\t\t\t\t\tonKeyPress={this.onHandleEnter}\r\n\t\t\t\t\t\t\tvalidationMessages={passwordMessages}\r\n\t\t\t\t\t\t\tforceShowErrors={passwordMessages.length > 0 && emailMessages.length === 0}\r\n\t\t\t\t\t\t\tforceInvalid={errorMessage.length > 0}\r\n\t\t\t\t\t\t/>\r\n\t\t\t\t\t\t 0}\r\n\t\t\t\t\t\t/>\r\n\t\t\t\t\t\t 0}\r\n\t\t\t\t\t\t/>\r\n\t\t\t\t\t \r\n\r\n\t\t\t\t\t{this.renderErrorMessage(errorMessage)}\r\n\r\n\t\t\t\t\t\r\n\t\t\t\t\t\tRegister\r\n\t\t\t\t\t\r\n\r\n\t\t\t\t\t\r\n\t\t\t\t\tUse of this system indicates you
agree to our Privacy Policy.\r\n\t\t\t\t\t\r\n\t\t\t\t
\r\n\t\t\tagree to our Privacy Policy.\r\n\t\t\t\t\t\r\n\t\t\t\t
\r\n\t\t\t\t{error}\r\n\t\t\t
\r\n\t\t);\r\n\t};\r\n\r\n\trender() {\r\n\t\tconst {\r\n\t\t\tlabel,\r\n\t\t\tclassName,\r\n\t\t\teditable,\r\n\t\t\teditMode,\r\n\t\t\tchildren,\r\n\t\t\t...otherProps\r\n\t\t} = this.props;\r\n\r\n\t\tconst {\r\n\t\t\tvalue,\r\n\t\t\terror,\r\n\t\t} = this.state;\r\n\r\n\t\tconst classes = [ 'select-wrapper' ];\r\n\r\n\t\tif (error && error.length) {\r\n\t\t\tclasses.push('select-wrapper--error');\r\n\t\t}\r\n\r\n\t\tif (className) {\r\n\t\t\tclasses.push(className);\r\n\t\t}\r\n\r\n\t\tif (!editable || !editMode) {\r\n\t\t\tconst isZeroValue = !value || value === '0';\r\n\r\n\t\t\treturn (\r\n\t\t\t\t\r\n\t\t\t\t\t{isZeroValue ? this.props.placeholder || label : value}\r\n\t\t\t\t
\r\n\t\t\t);\r\n\t\t}\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t{this.renderLabel(label)}\r\n\t\t\t\t
\r\n\t\t);\r\n\t}\r\n}\r\n\r\nexport default Select;\r\n","import React, { Component } from 'react';\r\nimport { Link } from 'react-router-dom';\r\n\r\nimport * as personAPI from '../../api/personAPI';\r\n\r\nimport TextInput from '../../components/FocusBox/Inputs/TextInput';\r\nimport Select from '../../components/FocusBox/Inputs/Select';\r\nimport InputGroup from '../../components/FocusBox/Inputs/InputGroup';\r\nimport Button from '../../components/Form/Button/Button';\r\n\r\nimport './NewLifeTimeLine.scss';\r\n\r\nclass NewLifeTimeLine extends Component {\r\n\tstate = {\r\n\t\tfirstName: '',\r\n\t\tlastName: '',\r\n\t\tentityType: 'Person',\r\n\t\terrorMessage: '',\r\n\t};\r\n\r\n\tonInputChange = (input) => {\r\n\t\tconst name = input.target.name;\r\n\t\tconst value = input.target.value;\r\n\r\n\t\tthis.setState({\r\n\t\t\t[name]: value,\r\n\t\t\terrorMessage: '',\r\n\t\t});\r\n\t};\r\n\r\n\tonAddNewLifeTimeLine = (e) => {\r\n\t\te.preventDefault();\r\n\r\n\t\tconst {\r\n\t\t\tfirstName,\r\n\t\t\tlastName,\r\n\t\t\tentityType,\r\n\t\t} = this.state;\r\n\r\n\t\tif (!firstName && !lastName) {\r\n\t\t\tthis.setState({ errorMessage: 'Please enter a First Name or Surname.' });\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tpersonAPI.register(undefined, undefined, firstName, lastName)\r\n\t\t\t.then(resp => {\r\n\t\t\t\tif (resp.success) {\r\n\t\t\t\t\tthis.props.onAddLifeTimeLine({\r\n\t\t\t\t\t\ttimelineId: 'new',\r\n\t\t\t\t\t\townerEntityId: this.props.ownerEntityID,\r\n\t\t\t\t\t\tsubjectEntityId: resp.data.entityId,\r\n\t\t\t\t\t\tsubjectEntityType: entityType,\r\n\t\t\t\t\t\ttitle: `${firstName || ''} ${lastName || ''}`.trim(),\r\n\t\t\t\t\t\tfromYear: 0,\r\n\t\t\t\t\t\ttoYear: 0,\r\n\t\t\t\t\t});\r\n\t\t\t\t} else {\r\n\t\t\t\t\t// TASK: Handle error\r\n\t\t\t\t}\r\n\t\t\t});\r\n\t};\r\n\r\n\tonAddOwnLifeTimeLine = (e) => {\r\n\t\te.preventDefault();\r\n\r\n\t\tthis.props.onAddLifeTimeLine({\r\n\t\t\ttimelineId: 'new',\r\n\t\t\townerEntityId: this.props.ownerEntityID,\r\n\t\t\tsubjectEntityId: this.props.ownerEntityID,\r\n\t\t\tsubjectEntityType: this.state.entityType,\r\n\t\t\ttitle: this.props.title,\r\n\t\t\tfromYear: 0,\r\n\t\t\ttoYear: 0,\r\n\t\t});\r\n\t};\r\n\r\n \trender() {\r\n\t\tconst {\r\n\t\t\tisCancelable,\r\n\t\t} = this.props;\r\n\r\n\t\tconst buttonsClasses = [ 'focusBox__buttons' ];\r\n\t\tif (isCancelable) {\r\n\t\t\tbuttonsClasses.push('focusBox__buttons--cancelable');\r\n\t\t}\r\n\r\n\t\tconst errors = [];\r\n\t\tif (this.state.errorMessage.length > 0) {\r\n\t\t\terrors.push(this.state.errorMessage);\r\n\t\t}\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t{this.renderError(error)}\r\n\t\t\t e.stopPropagation()}>\r\n\t\t\t\t\r\n\t\t\t\t\tor, Add my own LifeTimeLine\r\n\t\t\t\t\r\n\t\t\t
\r\n\t\t);\r\n\t}\r\n};\r\n\r\nexport default NewLifeTimeLine;\r\n","import React, { Component } from 'react';\r\n\r\nclass Form extends Component {\r\n\telements = [];\r\n\r\n\tregisterChild = (child) => {\r\n\t\tif (child === null) {\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tconst fieldType = child.type && child.type.fieldType;\r\n\r\n\t\tswitch (fieldType) {\r\n\t\t\tcase 'Switch':\r\n\t\t\tcase 'FormImage':\r\n\t\t\tcase 'Input':\r\n\t\t\t\treturn React.cloneElement(\r\n\t\t\t\t\tchild,\r\n\t\t\t\t\t{ ref: input => input && this.elements.push(input) },\r\n\t\t\t\t\tReact.Children.map(child.props.children, this.registerChild),\r\n\t\t\t\t);\r\n\t\t\tcase 'Button':\r\n\t\t\t\tif (child.props.isSubmit) {\r\n\t\t\t\t\treturn React.cloneElement(\r\n\t\t\t\t\t\tchild,\r\n\t\t\t\t\t\t{ onClick: () => this.onSubmit(child.props.onClick) },\r\n\t\t\t\t\t\tReact.Children.map(child.props.children, this.registerChild),\r\n\t\t\t\t\t);\r\n\t\t\t\t}\r\n\t\t\t\tbreak;\r\n\t\t\tdefault:\r\n\t\t}\r\n\r\n\t\tif (child.props && child.props.children) {\r\n\t\t\treturn React.cloneElement(\r\n\t\t\t\tchild,\r\n\t\t\t\tnull,\r\n\t\t\t\tReact.Children.map(child.props.children, this.registerChild),\r\n\t\t\t);\r\n\t\t}\r\n\r\n\t\treturn child;\r\n\t};\r\n\r\n\tonSubmit = (submitFunc) => {\r\n\t\tlet data = {};\r\n\t\tlet valid = true;\r\n\r\n\t\tthis.elements.forEach(element => {\r\n\t\t\tconst value = element.state.value;\r\n\r\n\t\t\tdata = {\r\n\t\t\t\t...data,\r\n\t\t\t\t[element.props.name]: value,\r\n\t\t\t};\r\n\r\n\t\t\tif (!element.validate) {\r\n\t\t\t\treturn;\r\n\t\t\t}\r\n\r\n\t\t\tif (element.validate(value) !== null) {\r\n\t\t\t\tvalid = false;\r\n\t\t\t}\r\n\t\t});\r\n\r\n\t\tif (valid && submitFunc) {\r\n\t\t\tsubmitFunc(data);\r\n\t\t}\r\n\t};\r\n\r\n\trender() {\r\n\t\tthis.elements = [];\r\n\r\n\t\treturn React.Children.map(this.props.children, this.registerChild);\r\n\t}\r\n}\r\n\r\nexport default Form;\r\n","const censorCreditCardNumber = (number) => {\r\n\tif (number.length === 16) {\r\n\t\treturn \"**** **** **** \" + number.substr(12, 4); // VISA / Mastercard\r\n\t} else if (number.length === 15) {\r\n\t\treturn \"**** ****** *\" + number.substr(11, 4); // AMEX\r\n\t}\r\n\r\n\treturn number;\r\n};\r\n\r\nconst getCardType = (number) => {\r\n\tif (number.match(/^4/) != null) {\r\n\t\treturn \"Visa\";\r\n\t}\r\n\r\n\tif (number.match(/^5[1-5]/) != null) {\r\n\t\treturn \"MasterCard\";\r\n\t}\r\n\r\n\tif (number.match(/^(34|37)/) != null) {\r\n\t\treturn \"American Express\";\r\n\t}\r\n\r\n\treturn \"\";\r\n}\r\n\r\nexport { censorCreditCardNumber, getCardType };\r\n","import React, { Component } from 'react';\r\n\r\nimport * as validation from '../../Form/Validation.js';\r\n\r\nimport { getCardType } from '../../../utils/card';\r\n\r\nimport './Input.scss';\r\n\r\nclass Input extends Component {\r\n\tstatic fieldType = 'Input';\r\n\r\n\tconstructor(props) {\r\n\t\tsuper(props);\r\n\r\n\t\tthis.state = {\r\n\t\t\tvalue: props.value,\r\n\t\t\terror: props.error,\r\n\t\t};\r\n\t}\r\n\r\n\tcomponentWillReceiveProps(nextProps) {\r\n\t\tconst data = {};\r\n\t\tif (nextProps.value !== undefined) {\r\n\t\t\tdata.value = nextProps.value;\r\n\t\t}\r\n\t\tif (nextProps.error !== undefined) {\r\n\t\t\tdata.error = nextProps.error;\r\n\t\t}\r\n\t\tif (Object.keys(data).length > 0) {\r\n\t\t\tthis.setState(data);\r\n\t\t}\r\n\t}\r\n\r\n\thandleOnChange = (event) => {\r\n\t\tif (this.props.onChange) {\r\n\t\t\tthis.props.onChange(event);\r\n\t\t}\r\n\r\n\t\tconst value = event.target.value;\r\n\r\n\t\tthis.validate(value);\r\n\r\n\t\tthis.setState({\r\n\t\t\tvalue,\r\n\t\t});\r\n\t}\r\n\r\n\thandleOnFocus = (event) => {\r\n\t\tif (this.props.onFocus) {\r\n\t\t\tthis.props.onFocus(event);\r\n\t\t}\r\n\r\n\t\t// Fixes an issue where the cursor would be at the start of the value on focus.\r\n\t\tif (event.target.selectionStart) {\r\n\t\t\tconst length = event.target.value.length;\r\n\t\t\tevent.target.selectionStart = length;\r\n\t\t\tevent.target.selectionEnd = length;\r\n\t\t}\r\n\t}\r\n\r\n\tvalidate = (value) => {\r\n\t\tconst error = this.getError(value);\r\n\r\n\t\tthis.setState({ error });\r\n\r\n\t\tif (this.props.onValidate) {\r\n\t\t\tconst displayName = this.getDisplayName();\r\n\r\n\t\t\tthis.props.onValidate(displayName, value, error);\r\n\t\t}\r\n\r\n\t\treturn error && error.length > 0;\r\n\t};\r\n\r\n\tgetError = (value) => {\r\n\t\tconst {\r\n\t\t\ttype,\r\n\t\t\trequired,\r\n\t\t\treqlength,\r\n\t\t\tminlength,\r\n\t\t\tmaxlength,\r\n\t\t} = this.props;\r\n\r\n\t\tconst displayName = this.getDisplayName();\r\n\r\n\t\tif (required && !value) {\r\n\t\t\treturn displayName ?\r\n\t\t\t\t`${displayName} is a required field.` :\r\n\t\t\t\t'Required field.';\r\n\t\t}\r\n\r\n\t\tconst valueLength = !!value ? value.length : 0;\r\n\r\n\t\tif (reqlength && valueLength < reqlength) {\r\n\t\t\treturn displayName ?\r\n\t\t\t\t`${displayName} must be ${reqlength} characters.` :\r\n\t\t\t\t`Must be ${reqlength} characters.`;\r\n\t\t}\r\n\r\n\t\tif (minlength && valueLength < minlength) {\r\n\t\t\treturn displayName ?\r\n\t\t\t\t`${displayName} must be at least ${minlength} characters.` :\r\n\t\t\t\t`Must be at least ${minlength} characters.`;\r\n\t\t}\r\n\r\n\t\tif (maxlength && valueLength > maxlength) {\r\n\t\t\treturn displayName ?\r\n\t\t\t\t`${displayName} must be less than ${maxlength} characters.` :\r\n\t\t\t\t`Must be less than ${maxlength} characters.`;\r\n\t\t}\r\n\r\n\t\tlet error = null;\r\n\r\n\t\tswitch (type) {\r\n\t\t\tcase 'email':\r\n\t\t\t\tconst emailError = validation.email(value);\r\n\t\t\t\tif (emailError.length > 0) {\r\n\t\t\t\t\terror = emailError[0];\r\n\t\t\t\t}\r\n\t\t\t\tbreak;\r\n\t\t\tcase 'password':\r\n\t\t\t\tconst passwordError = validation.password(value);\r\n\t\t\t\tif (passwordError.length > 0) {\r\n\t\t\t\t\terror = passwordError[0];\r\n\t\t\t\t}\r\n\t\t\t\tbreak;\r\n\t\t\tcase 'cardNumber':\r\n\t\t\t\tconst cardNumberError = validation.cardNumber(value);\r\n\t\t\t\tif (cardNumberError.length > 0) {\r\n\t\t\t\t\terror = cardNumberError[0];\r\n\t\t\t\t}\r\n\t\t\t\tbreak;\r\n\t\t\tdefault:\r\n\t\t}\r\n\r\n\t\treturn error;\r\n\t};\r\n\r\n\ttitleCase = (str) => {\r\n\t\tconst spacedOut = str.replace(/([A-Z])/g, ' $1').trim();\r\n\t\treturn spacedOut.toLowerCase().split(' ').map(function(word) {\r\n\t\t\treturn (word.charAt(0).toUpperCase() + word.slice(1));\r\n\t\t}).join(' ');\r\n\t}\r\n\r\n\tgetDisplayName = () => {\r\n\t\tconst {\r\n\t\t\tname,\r\n\t\t\tlabel,\r\n\t\t} = this.props;\r\n\r\n\t\t// Use label by default\r\n\t\tlet displayName = label;\r\n\r\n\t\tif (!displayName) {\r\n\t\t\tdisplayName = this.titleCase(name);\r\n\t\t}\r\n\r\n\t\treturn displayName;\r\n\t};\r\n\r\n\trenderLabel = (label,required) => {\r\n\t\tif (!label) {\r\n\t\t\treturn null;\r\n\t\t}\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t);\r\n\t};\r\n\r\n\trenderInput = (props, value) => {\r\n\t\tif (value === undefined || value === null) {\r\n\t\t\tvalue = '';\r\n\t\t}\r\n\r\n\t\tswitch (props.type) {\r\n\t\t\tcase 'textarea':\r\n\t\t\t\treturn (\r\n\t\t\t\t\tAdd a New LifeTimeLine
\r\n\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t 0}\r\n\t\t\t\t\t\t/>\r\n\t\t\t\t\t \r\n\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t\t{isCancelable &&\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\tCancel\r\n\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\tAdd a New Record\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t\t
\r\n\t\t\t\t);\r\n\t\t\tcase 'text':\r\n\t\t\tdefault:\r\n\t\t\t\treturn (\r\n\t\t\t\t\t\r\n\t\t\t\t{error}\r\n\t\t\t
\r\n\t\t);\r\n\t};\r\n\r\n\trenderFlag(flag) {\r\n\t\t// Flag Object can contain an icon, text, suffix icon and className.\r\n\t\tif (!flag) {\r\n\t\t\treturn null;\r\n\t\t}\r\n\t\tlet flagIcon = null;\r\n\t\tif (flag.icon) {\r\n\t\t\tflagIcon = \r\n\t\t}\r\n\t\tlet flagSuffixIcon = null;\r\n\t\tif (flag.suffixIcon) {\r\n\t\t\tflagSuffixIcon = \r\n\t\t}\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t{flagIcon}{flag.text}{flagSuffixIcon}\r\n\t\t\t
\r\n\t\t);\r\n\t};\r\n\r\n\trender() {\r\n\t\tconst {\r\n\t\t\tlabel,\r\n\t\t\tclassName,\r\n\t\t\teditable,\r\n\t\t\teditMode,\r\n\t\t\trequired,\r\n\t\t\tflag,\r\n\t\t\t...otherProps\r\n\t\t} = this.props;\r\n\r\n\t\tdelete(otherProps.reqlength);\r\n\t\tdelete(otherProps.minlength);\r\n\t\tdelete(otherProps.maxlength);\r\n\t\tdelete(otherProps.onValidate);\r\n\r\n\t\tconst {\r\n\t\t\tvalue,\r\n\t\t\terror,\r\n\t\t} = this.state;\r\n\r\n\t\tconst classes = [ 'input-wrapper' ];\r\n\r\n\t\tif (error && error.length) {\r\n\t\t\tclasses.push('input-wrapper--error');\r\n\t\t}\r\n\r\n\t\tif (className) {\r\n\t\t\tclasses.push(className);\r\n\t\t}\r\n\r\n\t\tif (!editable || !editMode) {\r\n\t\t\tconst isZeroValue = !value || value === '0';\r\n\r\n\t\t\treturn (\r\n\t\t\t\t\r\n\t\t\t\t\t{isZeroValue ? this.props.placeholder || label : value}\r\n\t\t\t\t
\r\n\t\t\t);\r\n\t\t}\r\n\r\n\t\tdelete(otherProps.error);\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t{this.renderLabel(label, required)}\r\n\t\t\t\t{this.renderInput(otherProps, value)}\r\n\t\t\t\t{this.renderError(error)}\r\n\t\t\t\t{this.renderFlag(flag)}\r\n\t\t\t
\r\n\t\t);\r\n\t}\r\n}\r\n\r\nexport default Input;\r\n","import Input from './Input';\r\n\r\n// Makes Input the default import for this folder\r\nexport default Input;\r\n","import React, { Component } from 'react';\r\n\r\nimport './Switch.scss';\r\n\r\nclass Switch extends Component {\r\n\tstatic fieldType = 'Switch';\r\n\r\n\tconstructor(props) {\r\n\t\tsuper(props);\r\n\r\n\t\tthis.state = {\r\n\t\t\tvalue: props.value || false,\r\n\t\t\tisLockedMessageOpen: false,\r\n\t\t};\r\n\t}\r\n\r\n\tcomponentWillReceiveProps({ value }) {\r\n\t\tif (value === undefined) {\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tif (value !== this.state.value) {\r\n\t\t\tthis.setState({ value });\r\n\t\t}\r\n\t}\r\n\r\n\ttoggleSwitch = (e) => {\r\n\t\tif (this.props.locked) {\r\n\t\t\tthis.setState({ isLockedMessageOpen: true });\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tthis.setState((state) => ({ value: !state.value }));\r\n\r\n\t\tif (this.props.onClick) {\r\n\t\t\tthis.props.onClick(e);\r\n\t\t}\r\n\t};\r\n\r\n\thandleKeyPress = (e) => {\r\n\t\tif (e.key === 'Enter' || e.key === ' ') {\r\n\t\t\tthis.toggleSwitch(e);\r\n\t\t}\r\n\t};\r\n\r\n\thandleCloseTooltip = (locked, isLockedMessageOpen) => {\r\n\t\tif (!locked || !isLockedMessageOpen) {\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tthis.setState({ isLockedMessageOpen: false });\r\n\t};\r\n\r\n\trenderLabel = (label) => {\r\n\t\tif (!label) {\r\n\t\t\treturn null;\r\n\t\t}\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t);\r\n\t};\r\n\r\n\trenderTooltip = (lockedMessage, isLockedMessageOpen) => {\r\n\t\tif (!isLockedMessageOpen || !lockedMessage) {\r\n\t\t\treturn null;\r\n\t\t}\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t{this.renderTooltip(lockedMessage, isLockedMessageOpen)}\r\n\t\t\t\r\n\t\t);\r\n\t}\r\n}\r\n\r\nexport default Switch;\r\n","import Switch from './Switch';\r\n\r\n// Makes Switch the default import for this folder\r\nexport default Switch;\r\n","import Payment from './Payment';\r\n\r\n// Makes Payment the default import for this folder\r\nexport default Payment;\r\n","import React, { Component } from 'react';\r\n\r\nimport Form from '../Form/Form';\r\nimport Input from '../Form/Input';\r\nimport Switch from '../Form/Switch';\r\nimport Button from '../Form/Button';\r\n\r\nimport { formatMoney } from '../../utils/general';\r\n\r\nimport * as cartAPI from '../../api/cartAPI';\r\n\r\nimport './Payment.scss';\r\n\r\nclass Payment extends Component {\r\n\tstate = {\r\n\t\tisLoading: false,\r\n\t\tcustomExpiryError: null,\r\n\t};\r\n\r\n\tonSubmit = (payload) => {\r\n\t\tthis.setState({ isLoading: true });\r\n\r\n\t\tpayload.PartnerId = this.props.partnerID;\r\n\t\tpayload.CreditCardNumber = payload.CreditCardNumber.replace(/ /g, '');\r\n\r\n\t\tconst expiry = payload.Expiry.split('/');\r\n\t\tdelete(payload.Expiry);\r\n\r\n\t\tif (expiry.length === 2) {\r\n\t\t\tpayload.ExpiryMonth = expiry[0];\r\n\t\t\tpayload.ExpiryYear = `${new Date().getFullYear().toString().substr(0, 2)}${expiry[1]}`;\r\n\t\t}\r\n\r\n\t\tcartAPI.submitCartPayment(payload)\r\n\t\t\t.then(resp => {\r\n\t\t\t\tif (resp.success && resp.data.paymentSucceeded) {\r\n\t\t\t\t\tif (this.props.onSubmit) {\r\n\t\t\t\t\t\tthis.props.onSubmit(resp, payload);\r\n\t\t\t\t\t} else {\r\n\t\t\t\t\t\tthis.setState({ isLoading: false });\r\n\t\t\t\t\t}\r\n\t\t\t\t} else {\r\n\t\t\t\t\tthis.setState({\r\n\t\t\t\t\t\terrorMessage: resp.data.statusMessage,\r\n\t\t\t\t\t\tisLoading: false,\r\n\t\t\t\t\t});\r\n\t\t\t\t}\r\n\t\t\t});\r\n\t};\r\n\r\n\tonValidateExpiry = (name, value) => {\r\n\t\tconst regex = /^(0?[1-9]|1[0-2])\\/[0-9]{2}$/;\r\n\r\n\t\tlet customExpiryError = null;\r\n\t\tif (!regex.test(value)) {\r\n\t\t\tcustomExpiryError = 'Expiry must be in the format MM/YY.';\r\n\t\t}\r\n\r\n\t\tthis.setState({ customExpiryError });\r\n\t};\r\n\r\n\trenderErrorMessage = (message) => {\r\n\t\tif (!message) {\r\n\t\t\treturn null;\r\n\t\t}\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t\t\t\t{locked && }\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\t\r\n\t\t\t\t{message}\r\n\t\t\t
\r\n\t\t);\r\n\t};\r\n\r\n\trender() {\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t\r\n\t\t\t
\r\n\t\t);\r\n\t}\r\n};\r\n\r\nexport default Payment;\r\n","import React, { Component, Fragment } from 'react';\r\nimport { connect } from 'react-redux';\r\n\r\nimport Image from '../../components/Form/Image';\r\nimport Button from '../../components/Form/Button';\r\nimport Backdrop from '../../components/Backdrop';\r\nimport NewLifeTimeLine from '../../components/NewLifeTimeLine/NewLifeTimeLine';\r\nimport Payment from '../../components/Payment';\r\n\r\nimport * as cartAPI from '../../api/cartAPI';\r\nimport * as timeLineAPI from '../../api/timeLineAPI';\r\n\r\nimport { formatMoney, breakpoints } from '../../utils/general';\r\nimport { censorCreditCardNumber } from '../../utils/card';\r\nimport * as defer from '../../utils/defer';\r\n\r\nimport './Cart.scss';\r\n\r\nclass Cart extends Component {\r\n\tconstructor(props) {\r\n\t\tsuper(props);\r\n\r\n\t\tthis.state = {\r\n\t\t\ttotal: this.calculateTotal(props.cart.items),\r\n\t\t\tactiveDetailIndex: null,\r\n\t\t\topenOptions: [],\r\n\t\t\tnewLifeTimeLineModal: null,\r\n\t\t\tisPaymentFormOpen: false,\r\n\t\t\tinvoice: null,\r\n\t\t};\r\n\r\n\t\tif (Object.keys(this.props.lifeTimeLines).length === 0) {\r\n\t\t\ttimeLineAPI.getAll(props.profile.entityId)\r\n\t\t\t\t.then(resp => {\r\n\t\t\t\t\tif (resp.success) {\r\n\t\t\t\t\t\tthis.props.onSetLifeTimeLines(resp.data);\r\n\t\t\t\t\t}\r\n\t\t\t\t});\r\n\t\t}\r\n\t}\r\n\r\n\tclearCart = this.props.onSetConfirm;\r\n\r\n\tcomponentWillReceiveProps(nextProps) {\r\n\t\tconst total = this.calculateTotal(nextProps.cart.items);\r\n\t\tif (this.state.total !== total) {\r\n\t\t\tthis.setState({\r\n\t\t\t\ttotal,\r\n\t\t\t\tisPaymentFormOpen: this.state.isPaymentFormOpen && total !== 0,\r\n\t\t\t});\r\n\t\t}\r\n\t\t/* checkChangedOption Part 1 of 2 :: This was set up to check when the option selected in an open options panel was changed to change teh colour of the 'Done' button to blue.\r\n\t\tif (this.state.openOptions[0]) {\r\n\t\t\tconsole.log('GET PROP', this.getCartItemSelected(this.state.openOptions[0], this.props.cart.items));\r\n\t\t\tconsole.log('GET NEXT', this.getCartItemSelected(this.state.openOptions[0], nextProps.cart.items));\r\n\t\t}\r\n\t\t*/\r\n\t}\r\n\t/* checkChangedOption Part 2 of 2 :: This was set up to check when the option selected in an open options panel was changed to change teh colour of the 'Done' button to blue.\r\n\tgetCartItemSelected = (targetCartItemId, cart) => {\r\n\t\treturn cart.filter(obj => obj.cartItemId === targetCartItemId)[0].optionResponses[0].data;\r\n\t}\r\n\t*/\r\n\r\n\tcalculateTotal = (items) => items.reduce((total, item) => (total + item.price), 0);\r\n\r\n\tremoveItem = (cartItemId) => {\r\n\t\tcartAPI.deleteCartItem(cartItemId)\r\n\t\t\t.then((resp) => {\r\n\t\t\t\tif (resp.success) {\r\n\t\t\t\t\tthis.props.removeItem(cartItemId);\r\n\t\t\t\t}\r\n\t\t\t});\r\n\t};\r\n\r\n\trenderIconOrImage = (item) => {\r\n\t\t// baseProductTypes = [\r\n\t\t// \tLTL,\r\n\t\t// \tIM,\r\n\t\t// \tURL,\r\n\t\t// \tSDOM,\r\n\t\t// \tDOM,\r\n\t\t// \tRES,\r\n\t\t// \tBK,\r\n\t\t// \tDVD,\r\n\t\t// \tPCRD\r\n\t\t// ];\r\n\t\tconst productIcons = {\r\n\t\t\tLTLFREE: \t'fa-clock-o',\r\n\t\t\tLTLSUBM: \t'fa-clock-o',\r\n\t\t\tLTLSUBA: \t'fa-clock-o',\r\n\t\t\tLTLSUBMLTD: 'fa-clock-o',\r\n\t\t\tLTLSUBALTD: 'fa-clock-o',\r\n\t\t\tLTLSUBUG: \t'fa-clock-o',\r\n\t\t\tLTLFULL: \t'fa-clock-o',\r\n\t\t\tLTLFULL5: \t'fa-clock-o',\r\n\r\n\t\t\tIM1: \t\t'fa-id-badge',\r\n\t\t\tIM5: \t\t'fa-id-badge',\r\n\r\n\t\t\tLTLURL: \t'fa-map-marker',\r\n\t\t\tIMURL:\t \t'fa-map-marker',\r\n\r\n\t\t\tLTLSDOM: \t'fa-map-marker',\r\n\t\t\tIMSDOM: \t'fa-map-marker',\r\n\r\n\t\t\tLTLDOM: \t'fa-map-marker',\r\n\t\t\tIMDOM: \t\t'fa-map-marker',\r\n\r\n\t\t\tLTLRES: \t'fa-thumb-tack',\r\n\t\t\tIMRES: \t\t'fa-thumb-tack',\r\n\r\n\t\t\tLTLBK: \t\t'fa-book',\r\n\r\n\t\t\tIMDVDOFF: \t'fa-video',\r\n\t\t\tIMDVDON: \t'fa-video',\r\n\r\n\t\t\tIMPCRD50: \t'fa-envelope-o',\r\n\t\t};\r\n\r\n\t\tconst lifeTimeLine = item.optionResponses && item.optionResponses.length > 0 ? this.props.lifeTimeLines[parseInt(item.optionResponses[0].data, 10)] : null;\r\n\r\n\t\tif (lifeTimeLine && lifeTimeLine.image) {\r\n\t\t\treturn (\r\n\t\t\t\t this.onToggleDescription(index)}>\r\n\t\t\t\tDetails \r\n\t\t\t\t
\r\n\t\t);\r\n\t};\r\n\r\n\tonToggleDescription = (index) => this.setState({\r\n\t\tactiveDetailIndex : this.state.activeDetailIndex === null ? index : null,\r\n\t});\r\n\r\n\tonToggleOption = (cartItemId) => {\r\n\t\tif (!cartItemId) {\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tconst openOptions = this.state.openOptions.slice();\r\n\t\tconst index = openOptions.findIndex(option => option === cartItemId);\r\n\r\n\t\tif (index === -1) {\r\n\t\t\topenOptions.push(cartItemId);\r\n\t\t} else {\r\n\t\t\topenOptions.splice(index, 1);\r\n\t\t}\r\n\r\n\t\tthis.setState({ openOptions });\r\n\t};\r\n\r\n\trenderItems = (items, isInvoiceMode) => {\r\n\t\tif (!items) {\r\n\t\t\treturn null;\r\n\t\t}\r\n\r\n\t\tconst isMobile_L = this.props.global.breakpoint.level <= breakpoints['mobile-l'];\r\n\t\tconst content = items.map((item, i) => {\r\n\t\t\tconst taxRate = 0.1;\r\n\t\t\tconst itemPrice = (item.price/ (100 * (taxRate+1) ) );\r\n\t\t\tconst itemTax \t= (item.price - (item.price/(taxRate+1))) /100;\r\n\t\t\tconst itemTotal = (item.price/100);\r\n\r\n\t\t\t// TASK: In the future there may be multiple responses, so we will need to find a better solution than 0 index\r\n\t\t\tconst selectedResponse = item.optionResponses && item.optionResponses.length > 0 ? item.optionResponses[0] : [];\r\n\r\n\t\t\tconst selectedChoice = item.optionChoices && item.optionChoices.length > 0 ? item.optionChoices.find(choice => choice.baseProductOptionId === selectedResponse.baseProductOptionId && choice.value === selectedResponse.data) : \"\";\r\n\r\n\t\t\treturn (\r\n\t\t\t\t\r\n\t\t\t\t\t{description}\r\n\t\t\t\t\t
\r\n\t\t\t\r\n\t\t\t\t\t\tClose \r\n\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t\t this.removeItem(item.cartItemId)}\r\n\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t{isMobile_L ? : 'remove item'}\r\n\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t}\r\n\t\t\t\t\t\r\n\t\t\t\t\t{this.renderItemOptions(item, selectedResponse, isInvoiceMode)}\r\n\t\t\t\t\r\n\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t{this.renderIconOrImage(item)}\r\n\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t{item.product.name} {selectedChoice && `for ${selectedChoice.displayText}`} {this.renderOptionsLink(item, isInvoiceMode)}\r\n\r\n\t\t\t\t\t\t\t\t{this.renderDescription(\r\n\t\t\t\t\t\t\t\t\ti,\r\n\t\t\t\t\t\t\t\t\titem.product.description,\r\n\t\t\t\t\t\t\t\t\tisMobile_L,\r\n\t\t\t\t\t\t\t\t\tisInvoiceMode,\r\n\t\t\t\t\t\t\t\t)}\r\n\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t{formatMoney(itemPrice)}
\r\n\t\t\t\t\t\t{formatMoney(itemTax)}
\r\n\t\t\t\t\t\t{formatMoney(itemTotal,0)}
\r\n\t\t\t\t\t\t{isInvoiceMode ? null :\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t{optionChoices.map((choice, i) => {\r\n\t\t\t\t\tconst choiceClasses = [ 'choice' ];\r\n\t\t\t\t\tconst isActive = choice.baseProductOptionId === selectedResponse.baseProductOptionId && choice.value === selectedResponse.data;\r\n\t\t\t\t\tif (isActive) {\r\n\t\t\t\t\t\tchoiceClasses.push('choice--active');\r\n\t\t\t\t\t}\r\n\r\n\t\t\t\t\tconst isInactive = selectedChoices.findIndex(selectedChoice => selectedChoice === choice.value) !== -1;\r\n\t\t\t\t\tif (isInactive) {\r\n\t\t\t\t\t\tchoiceClasses.push('choice--inactive');\r\n\t\t\t\t\t}\r\n\r\n\t\t\t\t\tconst lifeTimeLine = this.props.lifeTimeLines[parseInt(choice.value, 10)];\r\n\r\n\t\t\t\t\treturn (\r\n\t\t\t\t\t\t
\r\n\t\t);\r\n\t};\r\n\r\n\tonAddLifeTimeLine = (data) => {\r\n\t\tconst {\r\n\t\t\tcartItemId,\r\n\t\t\tbaseProductOptionId,\r\n\t\t} = this.state.newLifeTimeLineModal;\r\n\r\n\t\tif (data) {\r\n\t\t\t// Delete the 'new' timelineId\r\n\t\t\tdelete(data.timelineId);\r\n\t\t\ttimeLineAPI.create(data)\r\n\t\t\t\t.then(resp => {\r\n\t\t\t\t\tif (resp.success) {\r\n\t\t\t\t\t\tthis.submitChoice(cartItemId, baseProductOptionId, resp.data.timelineId, resp.data.title, 0);\r\n\r\n\t\t\t\t\t\tthis.props.onSetLifeTimeLine(resp.data);\r\n\t\t\t\t\t} else {\r\n\t\t\t\t\t\t// TASK: Handle error\r\n\t\t\t\t\t}\r\n\t\t\t\t});\r\n\t\t}\r\n\t};\r\n\r\n\tsubmitChoice = (cartItemId, baseProductOptionId, lifeTimeLineID, displayText, displayOrder) => {\r\n\t\tcartAPI.submitChoice(\r\n\t\t\tcartItemId,\r\n\t\t\tbaseProductOptionId,\r\n\t\t\tlifeTimeLineID,\r\n\t\t)\r\n\t\t.then((resp) => {\r\n\t\t\tif (resp.success) {\r\n\t\t\t\tthis.props.setCartOptionChoice({\r\n\t\t\t\t\t...resp.data,\r\n\t\t\t\t\tdisplayText,\r\n\t\t\t\t\tdisplayOrder,\r\n\t\t\t\t});\r\n\t\t\t\tthis.setNewLifeTimeLineModal(null);\r\n\t\t\t} else {\r\n\t\t\t\t// TASK: Handle error\r\n\t\t\t}\r\n\t\t});\r\n\t};\r\n\r\n\trenderNewLifeTimeLineModal = () => {\r\n\t\treturn (\r\n\t\t\t this.submitChoice(\r\n\t\t\t\t\t\t\t\tcartItemId,\r\n\t\t\t\t\t\t\t\tbaseProductOptionId,\r\n\t\t\t\t\t\t\t\tchoice.value,\r\n\t\t\t\t\t\t\t\tchoice.displayText,\r\n\t\t\t\t\t\t\t\tchoice.displayOrder,\r\n\t\t\t\t\t\t\t): null}\r\n\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t
\r\n\t\t\t\t\t);\r\n\t\t\t\t})}\r\n\t\t\t\t\r\n\t\t\t\t\t\t\t\t{lifeTimeLine &&\r\n\t\t\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t{choice.displayText}\r\n\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\tThis has already been selected on another item in your cart.\r\n\t\t\t\t\t\t\t
}\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t this.setNewLifeTimeLineModal({ cartItemId, baseProductOptionId })}\r\n\t\t\t\t\t/>\r\n\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\t\t\r\n\t\t\t\t\t\tCreate a new LifeTimeLine.\r\n\t\t\t\t\t
\r\n\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\r\n\t\t\t\t\t\t this.onToggleOption(cartItemId)}\r\n\t\t\t\t\t\t\tcolor=\"midGrey\"\r\n\t\t\t\t\t\t\t>Done\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\r\n\t\t\t\t
\r\n\t\t);\r\n\t};\r\n\r\n\trender() {\r\n\t\tconst {\r\n\t\t\titems,\r\n\t\t} = this.props.cart;\r\n\r\n\t\tconst {\r\n\t\t\tisPaymentFormOpen,\r\n\t\t\tinvoice,\r\n\t\t} = this.state;\r\n\r\n\t\tconst isInvoiceMode = invoice !== null;\r\n\r\n\t\t// TASK: Hack to make the invoice view work without the API\r\n\t\tconst content = this.renderItems(isInvoiceMode ? invoice.items : items, isInvoiceMode);\r\n\r\n\t\tconst hasItems = items.length > 0;\r\n\t\tconst total = isInvoiceMode ? this.calculateTotal(invoice.items) : this.state.total;\r\n\t\tconst totalScale = total % 100 > 0 ? 2 : 0;\r\n\t\tconst totalDisplay = formatMoney(total/100,totalScale);\r\n\r\n\t\tconst isSubscriptionPayment = !!items.find(item => item.product.baseProductCode.substr(3, 3) === 'SUB');\r\n\r\n\t\treturn (\r\n\t\t\t Payment Successful
\r\n\t\t\t\tPayment Processed: {invoice.date}
\r\n\t\t\t\tPayment Method: {invoice.cardType}: {invoice.cardNumber}
\r\n\t\t\t\t\r\n\t\t\t\t\tImportant! This transaction will appear in your statement as InMemoriamGroup\r\n\t\t\t\t
\r\n\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\t{this.renderNewLifeTimeLineModal()}\r\n\t\t\t\r\n\t\t\t\t\t\t this.togglePaymentForm(false)}\r\n\t\t\t\t\t\t\t\tpartnerID={this.props.audience.partnerID}\r\n\t\t\t\t\t\t\t\tonSubmit={this.onSubmitPayment}\r\n\t\t\t\t\t\t\t/>\r\n\t\t\t\t\t\t}\r\n\t\t\t\t\t\t{this.renderInvoice(invoice)}\r\n\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t{hasItems && !isInvoiceMode &&\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\t{content}\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\t{isInvoiceMode ? 'Invoice' : 'Shopping Cart'}\r\n\t\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\tPrice\r\n\t\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\tTax\r\n\t\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\tTotal\r\n\t\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\t\t{!isInvoiceMode && }\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\tTotal
\r\n\t\t\t\t\t\t\t\t{totalDisplay}
\r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\tClear Cart\r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t}\r\n\t\t\t\t\t\t{isPaymentFormOpen && !isInvoiceMode &&\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\t{/* \r\n\t\t\t\t\t\t\t\t\t\tPay with PayPal\r\n\t\t\t\t\t\t\t\t\t */}\r\n\t\t\t\t\t\t\t\t\t this.togglePaymentForm(true)}\r\n\t\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t\tPay with Card\r\n\t\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t\tSign in or Register to add this to your cart.\r\n\t\t\t\t\t
\r\n\t\t\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\tRegister\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t{product && this.onBuyNow(product.productId)}\r\n\t\t\t\t>\r\n\t\t\t\t\t
\r\n\t\t);\r\n\t};\r\n\r\n\trender() {\r\n\t\tconst {\r\n\t\t\tproduct,\r\n\t\t\trelatedProducts,\r\n\t\t} = this.props;\r\n\r\n\t\tconst features = product.features.map((feature, i) =>\r\n\t\t\tOR
}\r\n\t\t\t\t{product && \r\n\t\t\t\t\t\t
\r\n\t\t\t\t}\r\n\t\t\t\tBUY NOW
\r\n\t\t\t\t\t {formatMoney(product.price/100, 0)}{timePeriod && /{timePeriod}}
\r\n\t\t\t\t\t{product ? product.description : description}
\r\n\t\t\t\r\n\t\t\t\t{feature}\r\n\t\t\t
\r\n\t\t);\r\n\r\n\t\tconst timeCode = product.baseProductCode.slice(-1);\r\n\t\tlet timePeriod = 'month';\r\n\t\tif (timeCode === 'A') {\r\n\t\t\ttimePeriod = 'year';\r\n\t\t} else if (timeCode !== 'M') {\r\n\t\t\ttimePeriod = '';\r\n\t\t}\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t
\r\n\t\t);\r\n\t}\r\n}\r\n\r\nconst mapStateToProps = (state) => ({\r\n\taudience: state.audience,\r\n\tprofile: state.profile,\r\n});\r\n\r\nexport default connect(\r\n\tmapStateToProps,\r\n)(ProductPanel);\r\n","import ProductPanel from './ProductPanel';\r\n\r\n// Makes ProductPanel the default import for this folder\r\nexport default ProductPanel;\r\n","import { sendFetchRequest, getApiContext } from './api_utils';\r\n\r\nconst productURL = `${getApiContext()}/api/product`;\r\n\r\nconst getByPartnerID = (partnerID) => {\r\n\tconst options = {\r\n\t\tmethod: 'GET',\r\n\t};\r\n\r\n\treturn sendFetchRequest(`${productURL}/partner/${partnerID}`, options);\r\n};\r\n\r\nexport { getByPartnerID };\r\n","import React, { Component } from 'react';\r\nimport { connect } from 'react-redux';\r\n\r\nimport Footer from '../../components/Footer';\r\nimport ProductPanel from '../../components/ProductPanel';\r\n\r\nimport * as productAPI from '../../api/productAPI';\r\n\r\nimport './Products.scss';\r\n\r\nclass Products extends Component {\r\n\tstate = {\r\n\t\tproducts: [\r\n\t\t\t{\r\n\t\t\t\tproductId: 'new',\r\n\t\t\t\tname: 'Try it for FREE!',\r\n\t\t\t\tbaseProductCode: 'NEW',\r\n\t\t\t\tdescription: 'Try LifeTimeLine for free! Publish up to five Moments but you can create as many as you like.',\r\n\t\t\t\tprice: 0,\r\n\t\t\t\tfeatures: [\r\n\t\t\t\t\t'Create Unlimited Moments',\r\n\t\t\t\t\t'Publish up to 5 Moments',\r\n\t\t\t\t\t'No Ads Ever',\r\n\t\t\t\t\t'Published Forever',\r\n\t\t\t\t\t'Upgrade at any time',\r\n\t\t\t\t],\r\n\t\t\t},\r\n\t\t],\r\n\t};\r\n\r\n\tconstructor(props) {\r\n\t\tsuper(props);\r\n\r\n\t\tproductAPI.getByPartnerID(props.audience.partnerID)\r\n\t\t\t.then(resp => {\r\n\t\t\t\tif (resp.success) {\r\n\t\t\t\t\tthis.setState({\r\n\t\t\t\t\t\tproducts: [\r\n\t\t\t\t\t\t\t...this.state.products,\r\n\t\t\t\t\t\t\t...resp.data,\r\n\t\t\t\t\t\t],\r\n\t\t\t\t\t});\r\n\t\t\t\t}\r\n\t\t\t});\r\n\t}\r\n\r\n\trender() {\r\n\t\tconst {\r\n\t\t\tproducts,\r\n\t\t} = this.state;\r\n\r\n\t\tif (products.length === 1) {\r\n\t\t\treturn null;\r\n\t\t}\r\n\r\n\t\tconst content = products.map((product, i) => {\r\n\t\t\tconst isSubProduct = products.some((p) => {\r\n\t\t\t\tif (p.baseProductCode === product.baseProductCode) {\r\n\t\t\t\t\treturn false;\r\n\t\t\t\t}\r\n\r\n\t\t\t\tconst timePeriod = p.baseProductCode.slice(-1);\r\n\r\n\t\t\t\treturn timePeriod !== 'A' && product.baseProductCode.lastIndexOf(p.baseProductCode.slice(0, -1), 0) === 0;\r\n\t\t\t});\r\n\r\n\t\t\tif (isSubProduct) {\r\n\t\t\t\treturn null;\r\n\t\t\t}\r\n\r\n\t\t\tconst relatedProducts = products.filter(p => {\r\n\t\t\t\tif (!p.baseProductCode || p.baseProductCode === product.baseProductCode) {\r\n\t\t\t\t\treturn false;\r\n\t\t\t\t}\r\n\r\n\t\t\t\treturn p.baseProductCode.lastIndexOf(product.baseProductCode.slice(0, -1), 0) === 0;\r\n\t\t\t});\r\n\r\n\t\t\treturn (\r\n\t\t\t\t{product.name}
\r\n\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\t{product.price ? formatMoney(product.price/100, 0) : 'FREE'}
\r\n\t\t\t\t\t{timePeriod && \"/\"+timePeriod}
\r\n\t\t\t\t\r\n\t\t\t\t\t{features}\r\n\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t this.onBuyNow(product.productId)}\r\n\t\t\t\t\t>\r\n\t\t\t\t\t\t{product.price ? : 'Try It for FREE!'}\r\n\t\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\t{this.renderRibbon(relatedProducts, product.description)}\r\n\t\t\tBUY NOW
{formatMoney(product.price/100, 0)}{timePeriod && /{timePeriod}}
\r\n\t\t\t\t
\r\n\t\t);\r\n\t}\r\n}\r\n\r\nconst mapStateToProps = (state) => ({\r\n\taudience: state.audience,\r\n});\r\n\r\nexport default connect(\r\n\tmapStateToProps,\r\n)(Products);\r\n","import Products from './Products';\r\n\r\n// Makes Products the default import for this folder\r\nexport default Products;\r\n","import React, { Component } from 'react';\r\n//import { Link } from 'react-router-dom';\r\nimport Search from '../../components/Search';\r\n\r\n\r\nimport './SearchPage.scss';\r\n\r\nclass SearchPage extends Component {\r\n\tconstructor(props) {\r\n\t\tsuper(props);\r\n\r\n\t\tthis.state = {\r\n\t\t};\r\n\r\n\t}\r\n\r\n\trender() {\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t\t{content}\r\n\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\r\n\t\t\t\t
\r\n\t\t);\r\n\t}\r\n};\r\n\r\nexport default SearchPage;\r\n","import React, { Component } from 'react';\r\n//import { Link } from 'react-router-dom';\r\nimport { brandConfig } from '../../api/brandConfig';\r\n\r\nimport Logo from '../../components/Brand/Logo';\r\nimport Footer from '../../components/Footer';\r\n\r\nimport './ContactUs.scss';\r\n\r\nclass PrivacyPolicy extends Component {\r\n\tconstructor(props) {\r\n\t\tsuper(props);\r\n\r\n\t\tthis.state = {\r\n\t\t};\r\n\r\n\t}\r\n\r\n\r\n\r\n\trender() {\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t
\r\n\t\t);\r\n\t}\r\n};\r\n\r\nexport default PrivacyPolicy;\r\n","import NewLifeTimeLine from './NewLifeTimeLine';\r\n\r\n// Makes NewLifeTimeLine the default import for this folder\r\nexport default NewLifeTimeLine;\r\n","import React, { Component } from 'react';\r\nimport { connect } from 'react-redux';\r\n\r\nimport * as timeLineAPI from '../../api/timeLineAPI';\r\n\r\nimport NewLifeTimeLine from '../../components/NewLifeTimeLine';\r\n\r\nimport RecordBox from '../../components/RecordBox/RecordBox';\r\nimport Spinner from '../../components/Spinner';\r\n\r\nimport { dispatchError } from '../../utils/general';\r\n\r\nimport './LifeTimeLines.scss';\r\n\r\nclass LifeTimeLines extends Component {\r\n\t_isMounted = false;\r\n\tconstructor(props) {\r\n\t\tsuper(props);\r\n\r\n\t\tthis.state = {\r\n\t\t\tloading: true,\r\n\t\t};\r\n\r\n\r\n\t}\r\n\r\n\tcomponentDidMount = () => {\r\n\t\tthis._isMounted = true;\r\n\r\n\t\ttimeLineAPI.getAll(this.props.profile.entityId)\r\n\t\t\t.then(resp => {\r\n\t\t\t\tconsole.log('HP.26 _isMounted = ', this._isMounted );\r\n\t\t\t\tif (!this._isMounted) {\r\n\t\t\t\t\tconsole.log('LTL.28 Canceled the subscription as the component has been un-mounted.');\r\n\t\t\t\t\treturn null;\r\n\t\t\t\t}\r\n\t\t\t\tif (resp.success) {\r\n\t\t\t\t\tthis.props.onSetLifeTimeLines(resp.data);\r\n\t\t\t\t}\r\n\r\n\t\t\t\tthis.setState({ loading: false });\r\n\t\t\t})\r\n\t\t\t.catch((err) => {\r\n\t\t\t\tdispatchError(err);\r\n\t\t\t\t// STANDARD FETCH CONNECTION ERROR\r\n\t\t\t\tthis.setState({ loading: false });\r\n\t\t\t\tthis.props.onSetMessage({\r\n\t\t\t\t\ttitle: \t\t\t'Ooops!',\r\n\t\t\t\t\tmessage: \t\t'Please check your internet connection and try again.',\r\n\t\t\t\t\tdescription: \t'We could not connect to the service.',\r\n\t\t\t\t\tdetail: \t\t'',\r\n\t\t\t\t\tactionEmail: \tfalse,\r\n\t\t\t\t\tid:\t\t\t\t'LTL41'\r\n\t\t\t\t});\r\n\t\t\t});\r\n\t}\r\n\r\n\tcomponentWillUnmount = () => {\r\n\t\tthis._isMounted = false;\r\n\t\tconsole.log('HP.48 _isMounted = ', this._isMounted );\r\n\t}\r\n\r\n\tonAddLifeTimeLine = (data) => {\r\n\t\tif (data.subjectEntityId) {\r\n\t\t\tthis.props.onSetLifeTimeLine(data);\r\n\t\t}\r\n\r\n\t\tthis.props.history.push('/author/new');\r\n\t};\r\n\r\n\trenderLoadingSpinner = (loading) => {\r\n\t\tif (!loading) {\r\n\t\t\treturn null;\r\n\t\t}\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\tWe are here to help.
\r\n\t\t\t\t\t\t\tWe love to get feedback from users.
\r\n\t\t\t\t\t\t\tWe usually get back to you
within 24 business hours.
\r\n\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\r\n\r\n\t\t\t\t\t
\r\n\t\t\t\tContact Us
\r\n\t\t\t\t\tWhile we are very busy getting our new product up and running, we are keen to hear from you.
\r\n\t\t\t\t\tIf you need help with any part of the system or have feedback for us, drop us an email.
\r\n\t\t\t\t\t\r\n\t\t\t\t\t\r\n\r\n\t\t\t\t\t
\r\n\t\t\t\t
\r\n\t\t);\r\n\t}\r\n}\r\n\r\nconst mapStateToProps = (state) => {\r\n\treturn {\r\n\t\tprofile: state.profile,\r\n\t\tlifeTimeLines: state.lifeTimeLines,\r\n\t};\r\n};\r\n\r\nconst mapDispatchToProps = (dispatch, ownProps) => ({\r\n\tonSetLifeTimeLines: (data) => {\r\n\t\tdispatch({\r\n\t\t\ttype: 'SET_LIFETIMELINES',\r\n\t\t\tdata,\r\n\t\t});\r\n\t},\r\n\tonSetLifeTimeLine: (data) => {\r\n\t\tdispatch({\r\n\t\t\ttype: 'SET_LIFETIMELINE',\r\n\t\t\tdata,\r\n\t\t});\r\n\t},\r\n\tonSetMessage: (data) => {\r\n\t\tdispatch({\r\n\t\t\ttype: 'SET_MESSAGE',\r\n\t\t\tdata,\r\n\t\t});\r\n\t},\r\n});\r\n\r\nexport default connect(\r\n\tmapStateToProps,\r\n\tmapDispatchToProps,\r\n)(LifeTimeLines);\r\n","import React from 'react';\r\n\r\nimport { getDateRange, smoothScroll } from '../../utils/general';\r\n\r\nimport './DateMenu.scss';\r\n\r\n// Accepts two strings representing the start and end year of the LifeTimeLine\r\n// Also optional fixed count used to control mobile devices that do not use the screen height to layout the date menu\r\n\r\nconst DateMenu = ({ fromYear, toYear, fixedMenuItemCount, handleDateMenuToggle }) => {\r\n\tconst years = getDateRange(fromYear, toYear, fixedMenuItemCount);\r\n\tconst content = years.length ? years.map(year =>\r\n\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\r\n\t\t\t{content}\r\n\t\t
\r\n\t);\r\n};\r\n\r\nexport default DateMenu;\r\n","import React from 'react';\r\n\r\n\r\nimport './FeedPanel.scss';\r\n\r\nconst renderFeedItemIcon = (itemType) => {\r\n\treturn (\r\n\t\t\r\n\t)\r\n}\r\n\r\nconst FeedPanel = ( {activityFeed} ) => {\r\n\t//console.log('FEED',activityFeed);\r\n\tconst content = activityFeed.feedItems.length ? activityFeed.feedItems.map(feedItem =>\r\n\t\t\r\n\t\t\t\t{renderFeedItemIcon(feedItem.itemType)}\r\n\t\t\t
\r\n\t\t\t\r\n\t\t\t\t
\r\n\t\t\r\n\t) : '...';\r\n\r\n\treturn (\r\n\t\t\r\n\t\t\t\t\t{feedItem.itemContent}\r\n\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t{feedItem.author.firstName} {feedItem.author.lastName}
\r\n\t\t\t\t\t{feedItem.itemDateTime}
\r\n\t\t\t\t\r\n\t\t\t{content}\r\n\t\t
\r\n\t);\r\n};\r\n\r\nexport default FeedPanel;","import SharePanel from './SharePanel';\r\n\r\n// Makes SharePanel the default import for this folder\r\nexport default SharePanel;\r\n","import React, { Component } from 'react';\r\n\r\nimport Button from '../Form/Button';\r\nimport Backdrop from '../Backdrop';\r\n\r\nimport './SharePanel.scss';\r\n\r\nclass SharePanel extends Component {\r\n\tcopyInput = null;\r\n\r\n\tstate = {\r\n\t\tisOpen: false,\r\n\t};\r\n\r\n\tsetIsOpen = isOpen => this.setState({ isOpen });\r\n\r\n\tonCopy = () => {\r\n\t\tthis.copyInput.select();\r\n\t\tdocument.execCommand('copy');\r\n\t};\r\n\r\n\tonFBShare = (url) => {\r\n\t\tconst width = 600;\r\n\t\tconst height = 400;\r\n\r\n\t\tconst left = (window.outerWidth / 2) + (window.screenX || window.screenLeft || 0) - (width / 2);\r\n\t\tconst top = (window.outerHeight / 2) + (window.screenY || window.screenTop || 0) - (height / 2);\r\n\r\n\t\tconst config = {\r\n\t\t\theight,\r\n\t\t\twidth,\r\n\t\t\tleft,\r\n\t\t\ttop,\r\n\t\t\tlocation: 'no',\r\n\t\t\ttoolbar: 'no',\r\n\t\t\tstatus: 'no',\r\n\t\t\tdirectories: 'no',\r\n\t\t\tmenubar: 'no',\r\n\t\t\tscrollbars: 'yes',\r\n\t\t\tresizable: 'no',\r\n\t\t\tcenterscreen: 'yes',\r\n\t\t\tchrome: 'yes',\r\n\t\t};\r\n\r\n\t\twindow.open(\r\n\t\t\t`https://www.facebook.com/sharer/sharer.php?u=${encodeURIComponent(url)}`,\r\n\t\t\t'Facebook',\r\n\t\t\tObject.keys(config).map(key => `${key}=${config[key]}`).join(', '),\r\n\t\t);\r\n\t};\r\n\r\n\trenderSharePanel = (isOpen) => {\r\n\t\tif (!isOpen) {\r\n\t\t\treturn null;\r\n\t\t}\r\n\r\n\t\tconst {\r\n\t\t\ttitle,\r\n\t\t\tlifeTimeLineID,\r\n\t\t\tmomentID,\r\n\t\t} = this.props;\r\n\r\n\t\tlet shareTypeLabel = 'LifeTimeLine';\r\n\t\tlet url = `https://${window.location.hostname}/${lifeTimeLineID}`;\r\n\t\tif (momentID) {\r\n\t\t\turl += `/m/${momentID}`\r\n\t\t\tshareTypeLabel = 'Moment';\r\n\t\t}\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t
\r\n\t\t);\r\n\t};\r\n\r\n\trender() {\r\n\t\tconst isOpen = this.state.isOpen;\r\n\r\n\t\tconst {\r\n\t\t\tclassName,\r\n\t\t\tposition,\r\n\t\t} = this.props;\r\n\r\n\t\tconst classes = [ 'share' ];\r\n\t\tif (className) {\r\n\t\t\tclasses.push(className);\r\n\t\t}\r\n\r\n\t\t// TODO: Implement share--left and share--right in the css\r\n\t\tif (position) {\r\n\t\t\tclasses.push(`share--${position}`)\r\n\t\t}\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t\tShare {title}'s {shareTypeLabel}\r\n\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t this.copyInput = ref}\r\n\t\t\t\t\t\tdefaultValue={url}\r\n\t\t\t\t\t\tonClick={this.onCopy}\r\n\t\t\t\t\t/>\r\n\t\t\t\t\t\r\n\t\t\t\t\t\t Copy Link\r\n\t\t\t\t\t\r\n\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\tShare to Facebook\r\n\t\t\t\t\t this.onFBShare(url)}\r\n\t\t\t\t\t>\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\tFacebook\r\n\t\t\t\t\t\r\n\t\t\t\t
\r\n\t\t\t\r\n\t\t\t\t this.setIsOpen(true)} />\r\n\t\t\t\t this.setIsOpen(false)} />\r\n\t\t\t\t{this.renderSharePanel(isOpen)}\r\n\t\t\t
\r\n\t\t);\r\n\t}\r\n}\r\n\r\nexport default SharePanel;\r\n","import React, { Component } from 'react';\r\nimport { connect } from 'react-redux';\r\n\r\nimport Input from '../Form/Input';\r\nimport Image from '../Form/Image';\r\nimport Button from '../Form/Button';\r\nimport DateMenu from '../../components/DateMenu/DateMenu';\r\nimport FeedPanel from '../../components/FeedPanel/FeedPanel';\r\nimport Form from '../Form/Form';\r\nimport SharePanel from '../SharePanel';\r\n\r\nimport * as util from '../../utils/general';\r\n//import * as timeLineAPI from '../../api/timeLineAPI';\r\n\r\nimport './SummaryPanel.scss';\r\n\r\nclass SummaryPanel extends Component {\r\n\tconstructor(props) {\r\n\t\tsuper(props);\r\n\r\n\t\tthis.state = {\r\n\t\t\tformLoading: false,\r\n\t\t\timageLoading: false,\r\n\t\t\tdateMenuActive: false,\r\n\t\t\tsummaryDescriptionActive: false,\r\n\t\t\tsummaryFeedActive: false,\r\n\t\t\tformErrors: {},\r\n\t\t\tisFormValid: true,\r\n\t\t};\r\n\t}\r\n\r\n\t//\tAdd and remove header shadow on scroll\r\n\tcomponentDidMount = () => {\r\n\t\twindow.addEventListener('scroll', this.handleScrollMoments);\r\n\t};\r\n\r\n\tcomponentWillUnmount = () => {\r\n\t\twindow.removeEventListener('scroll', this.handleScrollMoments);\r\n\t};\r\n\r\n\t// TODO - move this to react style solution - see app.js for similar\r\n\thandleScrollMoments = () => {\r\n\t\tif (window.pageYOffset > 0) {\r\n\t\t\tthis.handlePanelToggle('all');\r\n\t\t\t//this.onCancelEdit();\r\n\t\t}\r\n\t};\r\n\r\n\trenderDateMenuToggle(isMobile_L) {\r\n\t\tif (!isMobile_L) {\r\n\t\t\treturn null;\r\n\t\t} else {\r\n\t\t\treturn (\r\n\t\t\t\t this.handlePanelToggle('dateMenu')}>\r\n\t\t\t\t\t\r\n\t\t\t\t
\r\n\t\t\t)\r\n\t\t}\r\n\t};\r\n\r\n\trenderCommentsToggle(isTablet) {\r\n\t\tif (!isTablet) {\r\n\t\t\treturn null;\r\n\t\t} else {\r\n\t\t\treturn (\r\n\t\t\t\t this.handlePanelToggle('summaryFeed')}>\r\n\t\t\t\t\t\r\n\t\t\t\t
\r\n\t\t\t)\r\n\t\t}\r\n\t};\r\n\r\n\trenderSummaryDescriptionToggle(isTablet) {\r\n\t\tif (!isTablet) {\r\n\t\t\treturn null;\r\n\t\t} else {\r\n\t\t\treturn (\r\n\t\t\t\t this.handlePanelToggle('summaryDescription')}>\r\n\t\t\t\t\t\r\n\t\t\t\t
\r\n\t\t\t)\r\n\t\t}\r\n\t};\r\n\r\n\trenderSummaryDescription(isTablet, description, editAllowed) {\r\n\t\tif (!this.props.editMode && !this.state.summaryDescriptionActive && isTablet) {\r\n\t\t\treturn null;\r\n\t\t} else {\r\n\t\t\treturn (\r\n\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t
\r\n\t\t\t);\r\n\t\t}\r\n\t};\r\n\r\n\tcheckForm = (name, value, error) => {\r\n\t\tconst formErrors = Object.assign({}, this.state.formErrors);\r\n\t\tformErrors[name] = error;\r\n\r\n\t\tif (name === 'fromYear') {\r\n\t\t\tconst val = parseInt(value, 10)\r\n\r\n\t\t\tif (isNaN(val) || val <= 0) {\r\n\t\t\t\tformErrors.fromYear = 'The Start Year is required.';\r\n\t\t\t\tformErrors.toYear = null;\r\n\t\t\t} else if (\r\n\t\t\t\tval > parseInt(this.props.lifeTimeLineData.toYear, 10) &&\r\n\t\t\t\tparseInt(this.props.lifeTimeLineData.toYear, 10) !== 0\r\n\t\t\t) {\r\n\t\t\t\tformErrors.fromYear = 'The Start Year must be before the End Year.';\r\n\t\t\t\tformErrors.toYear = null;\r\n\t\t\t} else {\r\n\t\t\t\tformErrors.fromYear = null;\r\n\t\t\t\tformErrors.toYear = null;\r\n\t\t\t}\r\n\t\t} else if (name === 'toYear') {\r\n\t\t\tif (parseInt(value, 10) < parseInt(this.props.lifeTimeLineData.fromYear, 10)) {\r\n\t\t\t\tformErrors.toYear = 'The End Year must be later than the Start Year.';\r\n\t\t\t\tformErrors.fromYear = null;\r\n\t\t\t} else {\r\n\t\t\t\tformErrors.fromYear = null;\r\n\t\t\t\tformErrors.toYear = null;\r\n\t\t\t}\r\n\t\t}\r\n\r\n\t\tlet isFormValid = true;\r\n\r\n\t\tObject.keys(formErrors).forEach((key) => {\r\n\t\t\tif (formErrors[key]) {\r\n\t\t\t\tisFormValid = false;\r\n\t\t\t}\r\n\t\t});\r\n\r\n\t\tthis.setState({\r\n\t\t\tformErrors,\r\n\t\t\tisFormValid,\r\n\t\t});\r\n\t};\r\n\r\n\trenderSummaryFeed(isMobile_L, editAllowed) {\r\n\t\t// TASK: Update this mock up with the actual API.\r\n\t\tconst activityFeed = {\r\n\t\t\tfeedItems: [\r\n\t\t\t\t{\titemType: 'Comment',\r\n\t\t\t\t\titemID: 46,\r\n\t\t\t\t\titemDateTime: '2017-11-05 16:36',\r\n\t\t\t\t\titemContent: \"Thanks Peter. It's good to have you along for the journey!\",\r\n\t\t\t\t\tauthor: {\r\n\t\t\t\t\t\tentityID: 31,\r\n\t\t\t\t\t\tfirstName: 'Chester',\r\n\t\t\t\t\t\tlastName: 'Nutting',\r\n\t\t\t\t\t},\r\n\t\t\t\t},\r\n\t\t\t\t{\titemType: 'Comment',\r\n\t\t\t\t\titemID: 91,\r\n\t\t\t\t\titemDateTime: '2017-11-03 18:22',\r\n\t\t\t\t\titemContent: 'Fantastic record of such an interesting life Chester.',\r\n\t\t\t\t\tauthor: {\r\n\t\t\t\t\t\tentityID: 36,\r\n\t\t\t\t\t\tfirstName: 'Peter',\r\n\t\t\t\t\t\tlastName: 'Jennings',\r\n\t\t\t\t\t},\r\n\t\t\t\t},\r\n\t\t\t]\r\n\t\t}\r\n\t\tlet tempActivityFeed = { feedItems: [] };\r\n\t\tif (this.props.lifeTimeLineData.timelineId === 1) {\t\t// TEMP hack in some coments for Chester's LifeTimeLine\r\n\t\t\ttempActivityFeed = activityFeed;\r\n\t\t} else if (this.props.lifeTimeLineData.activityFeed) {\r\n\t\t\ttempActivityFeed = this.props.lifeTimeLineData.activityFeed;\r\n\t\t}\r\n\t\t// END TASK: Change to get feed from JSON package\r\n\r\n\t\tif (!this.state.summaryFeedActive && isMobile_L) {\r\n\t\t\treturn null;\r\n\t\t} else {\r\n\t\t\treturn (\r\n\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t)\r\n\t\t}\r\n\t};\r\n\r\n // onEdit = (isMobile_L) => {\r\n // if (isMobile_L && !this.state.summaryDescriptionActive) {\r\n // this.handlePanelToggle('summaryDescription'); // force open the descriptionPanel so the edit can take place\r\n // }\r\n // this.setState({ editMode: true });\r\n // }\r\n\r\n\thandlePanelToggle = (actionPanel) => {\r\n\t\t// Description Panel requires special treatment as when < Mobile-L, it will be open in edit mode and must remain so.\r\n\t\tconst newSummaryDescriptionPanelState = this.props.editMode \t\t\t\t\t? this.state.summaryDescriptionActive \t:\r\n\t\t\t\t\t\t\t\t\t\t\t\t actionPanel !== \"summaryDescription\" \t? false \t\t\t\t\t\t\t\t:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t !this.state.summaryDescriptionActive\t;\r\n\t\tthis.setState({\r\n\t\t\tdateMenuActive: actionPanel !== \"dateMenu\" ? false : !this.state.dateMenuActive,\r\n\t\t\tsummaryDescriptionActive: newSummaryDescriptionPanelState,\r\n\t\t\tsummaryFeedActive: actionPanel !== \"summaryFeed\" ? false : !this.state.summaryFeedActive,\r\n\t\t});\r\n\t};\r\n\r\n\trenderDateMenu = (isTabletAndBelow) => {\r\n\t\tconst fixedMenuItemCount = isTabletAndBelow ? 40 : null;\r\n\t\tif(isTabletAndBelow && !this.state.dateMenuActive) {\r\n\t\t\treturn null\r\n\t\t} else {\r\n\t\t\treturn (\r\n\t\t\t\t\r\n\t\t\t\t{/*
\r\n\t\t);\r\n\t};\r\n\r\n\r\n\trenderSaveCancel = (editMode, isMinimumSet, nestedInInteractions) => {\r\n\t\tif (!editMode) {\r\n\t\t\treturn null;\r\n\t\t}\r\n\t\t// Button location varies base don device. Desktop they're below summary and mobile devices in place of the interaction icons.\r\n\t\tconst isDesktop = this.props.global.breakpoint.level > util.breakpoints['tablet'];\r\n\t\tif (!editMode || (nestedInInteractions && isDesktop) || (!nestedInInteractions && !isDesktop) ) {\r\n\t\t\treturn null;\r\n\t\t} else {\r\n\t\t\treturn (\r\n\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t
*/}\r\n\t\t\t\t\r\n\t\t\t\t\t{isMinimumSet &&\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\tCancel\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t}\r\n\t\t\t\t\t\r\n\t\t\t\t\t\tSave\r\n\t\t\t\t\t\r\n\t\t\t\t
\r\n\t\t\t);\r\n\t\t}\r\n\t};\r\n\r\n\trender = () => {\r\n\t\tif (!this.props.lifeTimeLineData || Object.keys(this.props.lifeTimeLineData).length === 0) {\r\n\t\t\treturn Loading...
\r\n\t\t\t\t
\r\n\t\t);\r\n\t}\r\n};\r\n\r\nconst mapStateToProps = (state) => {\r\n\treturn {\r\n\t\taudience: state.audience,\r\n\t\tprofile: state.profile,\r\n\t\tglobal: state.global,\r\n\t};\r\n};\r\n\r\nexport default connect(\r\n\tmapStateToProps,\r\n)(SummaryPanel);\r\n","const monthNames = [\"January\", \"February\", \"March\", \"April\", \"May\", \"June\", \"July\", \"August\", \"September\", \"October\", \"November\", \"December\"];\r\n\r\nconst ordinalIndicator = n => (n%10===1 && n%100!==11?'st':n%10===2&&n%100!==12?'nd':n%10===3 && n%100!==13?'rd':'th'); // 1st, 2nd, 3rd, 4th, 111th etc\r\n\r\nconst formatDate = (dateString, dateMask = 'DD MMMM YYYY', timeMask = undefined) => {\r\n\r\n // Verify the specific format (contains a 'T') and TZD\r\n let tzd = 0;\r\n if (dateString.indexOf('T') > -1) {\r\n let dateTimeString = dateString.substring(dateString.indexOf('T')+1,dateString.length);\r\n if (dateTimeString.indexOf('Z') > -1) {\r\n console.log('ZULU (so use default of 0)');\r\n } else {\r\n let tzdPlus = dateTimeString.indexOf('+');\r\n let tzdMinus = dateTimeString.indexOf('-');\r\n if(tzdPlus > -1) {\r\n tzd = dateTimeString.substring(tzdPlus+1,dateTimeString.length);\r\n } else if(tzdMinus > -1) {\r\n tzd = dateTimeString.substring(tzdMinus+1,dateTimeString.length);\r\n }\r\n console.log('RESOLVED TZD (may be default of 0)',tzd);\r\n }\r\n } else {\r\n console.log('Invalid Date Format. Required YYYY-MM-DDThh:mm[:ss]+0000');\r\n }\r\n\r\n let dateObj = new Date(dateString);\r\n\r\n let d = dateObj.getUTCDate();\r\n let ord = ordinalIndicator(d);\r\n let dp = ('00' + d).slice(-2);\r\n let mi = dateObj.getUTCMonth();\r\n let m = dateObj.getUTCMonth()+1;\r\n let mp = ('00' + m).slice(-2);\r\n let y = ('00000' + dateObj.getUTCFullYear()).slice(-4);\r\n let h = dateObj.getUTCHours();\r\n let n = dateObj.getUTCMinutes();\r\n let timeStringOut = undefined;\r\n let dateStringOut = undefined;\r\n if(isNaN(d) || isNaN(m) || isNaN(y)){\r\n //console.log('ERROR====:', date, ' is NaN');\r\n return undefined;\r\n }\r\n if( h + n > 0 ){\r\n let hp = ('00' + h).slice(-2);\r\n let np = ('00' + n).slice(-2);\r\n // switch over timeMask to put time together\r\n switch(timeMask) {\r\n case 'h:nn':\t\t\t\t\t\t\t// e.g. 6:30\t\te.g. 19:25\r\n timeStringOut = h + ':' + np;\r\n break;\r\n case 'hh:nn':\t\t\t\t\t\t\t// e.g. 06:30\t\te.g. 19:25\r\n timeStringOut = hp + ':' + np;\r\n break;\r\n case 'h:nn A':\t\t\t\t\t\t\t// e.g. 6:30 am\te.g. 7:25 pm\r\n const ha = h > 12 ? h-12 : h;\r\n const ampm = h > 12 ? \"pm\" : \"am\";\r\n timeStringOut = ha + ':' + np + ' ' + ampm;\r\n break;\r\n default:\r\n timeStringOut = undefined;\r\n }\r\n }\r\n switch(dateMask) {\r\n case 'DD-MMM-YYYY':\t\t\t\t\t\t\t// 06-Mar-1971\r\n dateStringOut = dp + '-' + monthNames[mi].substring(0,3) + '-' + y;\r\n break;\r\n case 'DD-MM-YYYY':\t\t\t\t\t\t\t// 06-03-1971\r\n dateStringOut = dp + '-' + mp + '-' + y;\r\n break;\r\n case 'D MMMM YYYY':\t\t\t\t\t\t\t// 6 March 1971\r\n dateStringOut = d+ord + ' ' + monthNames[mi] + ' ' + y;\r\n break;\r\n default: \t\t\t\t\t\t\t\t\t// DD MMMM YYYY\r\n dateStringOut = dp + ' ' + monthNames[mi] + ' ' + y;\r\n }\r\n return dateStringOut + (timeStringOut ? ', '+timeStringOut : '');\r\n}\r\n\r\n\r\nexport const dateText = (dateString, estimated, year, month, day) => {\r\n let ds = undefined;\r\n if(day) {\r\n ds = day + ' ' + monthNames[month-1] + ' ' + year;\r\n } else if(month) {\r\n ds = monthNames[month-1] + ' ' + year;\r\n } else if (year) {\r\n ds = year;\r\n } else if(dateString){\r\n ds = formatDate(dateString,'D MMMM YYYY','h:nn A');\t\t\t\t//,'DD MMMM YYYY','hh:nn A'\r\n\t}\r\n return ds;\r\n}\r\n","import React, { Component } from 'react';\r\nimport { Link } from 'react-router-dom';\r\n\r\nimport Image from '../Form/Image';\r\n\r\nimport { dateText } from './util.js';\r\n\r\nimport './SmallMoment.scss';\r\n\r\n\r\n\r\nclass SmallMoment extends Component {\r\n\r\n\tshortDescription = null;\r\n\r\n\tconstructor(props) {\r\n\t\tsuper(props);\r\n\r\n\t\tthis.state = {\r\n\t\t\tshortDescriptionClipped: false,\r\n\t\t};\r\n\t}\r\n\r\n\tcomponentDidMount() {\r\n\t\tthis.setState({shortDescriptionClipped: this.shortDescription.clientHeight > 32 })\r\n\r\n\t}\r\n\r\n\trenderClippedLink(author, momentID) {\r\n\t\tif (this.state.shortDescriptionClipped) {\r\n\t\t\treturn (\r\n\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\t{this.renderDateMenu(isTablet)}\r\n\t\t\t\t\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\t\t{this.renderSummaryFeed(isTablet)}\r\n\t\t\t\t\tmore...
\r\n\t\t\t\t\r\n\t\t\t);\r\n\t\t} else {\r\n\t\t\treturn null;\r\n\t\t}\r\n\t}\r\n\r\n\trender() {\r\n\t\tconst {\r\n\t\t\tmomentID,\r\n\t\t\tdate,\r\n\t\t\tapproximate,\r\n\t\t\tyear,\r\n\t\t\tmonth,\r\n\t\t\tday,\r\n\t\t\timage,\r\n\t\t\tshortDescription,\r\n\t\t\teditAllowed,\r\n\t\t\tonDeleteMoment,\r\n\t\t\tauthor,\r\n\t\t} = this.props;\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t);\r\n\t};\r\n}\r\n\r\nexport default SmallMoment;","import React, { Component } from 'react';\r\n\r\nimport SmallMoment from '../Moment/SmallMoment';\r\n\r\nimport { getDateRange } from '../../utils/general';\r\n\r\nimport './Moments.scss';\r\n\r\nclass Moments extends Component {\r\n\trenderTutorial = (isImageSet, isYearSet, isDescriptionSet) => (\r\n\t\t\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\t\t\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\t {this.shortDescription = ref}} >\r\n\t\t\t\t\t\t\t{this.renderClippedLink(author, momentID)}\r\n\t\t\t\t\t\t\t{dateText(date, approximate, year, month, day)}\r\n\t\t\t\t\t\t\t{approximate ? : ''}\r\n\t\t\t\t\t\t\t{shortDescription}\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t\t\t{editAllowed &&\r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t{/* {editAllowed &&\r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t} */}\r\n\t\t\t\t\t\t\t{editAllowed && // See console log via LifeTimeLione.js\r\n\t\t\t\t\t\t\t\t {\r\n\t\t\t\t\t\t\t\t\t\te.preventDefault();\r\n\t\t\t\t\t\t\t\t\t\tonDeleteMoment(momentID)\r\n\t\t\t\t\t\t\t\t\t}}\r\n\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t}\r\n\r\n\t\t\t\t\t\t\t{/* */}\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\t\r\n\t\t\t{this.renderTutorialItem('fa-camera', '1. Upload An Image', isImageSet)}\r\n\t\t\t{this.renderTutorialItem('fa-calendar', '2. Enter the Years', isYearSet)}\r\n\t\t\t{this.renderTutorialItem('fa-pencil', '3. Write a Description', isDescriptionSet)}\r\n\t\t\t{this.renderTutorialItem('fa-clock-o', '4. Create Moments', false)}\r\n\t\t
\r\n\t);\r\n\r\n\trenderTutorialItem = (icon, text, isSet) => {\r\n\t\tconst iconClasses = [ 'fa' ];\r\n\t\tif (icon) {\r\n\t\t\ticonClasses.push(icon);\r\n\t\t}\r\n\r\n\t\tconst tickClasses = [ 'fa fa-check-circle tutorial__tick' ];\r\n\t\tif (isSet) {\r\n\t\t\ttickClasses.push('tutorial__tick--active');\r\n\t\t}\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t
\r\n\t\t);\r\n\t};\r\n\r\n\trender() {\r\n\t\tconst { lifeTimeLine, editAllowed, onDeleteMoment } = this.props;\r\n\t\tconst { lifeTimeLineID, moments, image, fromYear, toYear, description } = lifeTimeLine;\r\n\r\n\t\tif (!moments || moments.length === 0) {\r\n\t\t\tconst isImageSet = !!image;\r\n\t\t\tconst isYearSet = fromYear > 0;\r\n\t\t\tconst isDescriptionSet = !!description;\r\n\r\n\t\t\treturn this.renderTutorial(isImageSet, isYearSet, isDescriptionSet);\r\n\t\t}\r\n\r\n\t\t//TASK: fine tune this. Added extreme number of years to ensure every single year was returned, not just the calculated DateMenu items.\r\n\t\t// This is due to the mobile version not using view height to get set menu items. RN\r\n\t\tconst earliersMomentYear = moments[0].year;\r\n\t\tconst useThisFirstYear = earliersMomentYear < fromYear ? earliersMomentYear : fromYear;\r\n\r\n\t\tconst latestMomentYear = moments[moments.length-1].year;\r\n\t\tconst toYearChecked = (typeof toYear === 'number' && isFinite(toYear) && Math.floor(toYear) === toYear && toYear > 0) ? toYear : (new Date()).getFullYear();\r\n\t\tconst useThisLastYear = latestMomentYear > toYearChecked ? latestMomentYear : toYearChecked;\r\n\r\n\t\tconst years = getDateRange(useThisFirstYear, useThisLastYear, 10000);\r\n\r\n\t\tconst momentsContent = [];\r\n\r\n\t\tfor (let i = 0; i < years.length; i++) {\r\n\t\t\tconst year = years[i];\r\n\t\t\tconst nextYear = years[i+1] || years[i]+1;\r\n\r\n\t\t\tmomentsContent.push();\r\n\r\n\t\t\tmoments\r\n\t\t\t\t.filter(moment => moment.year >= year && moment.year < nextYear)\r\n\t\t\t\t.forEach((moment) => {\r\n\t\t\t\t\tmomentsContent.push(\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\t\t{text}\r\n\t\t\t\t\r\n\t\t\t\t\t{/* {!isSet &&
\r\n\t\t\tshow me
} */}\r\n\t\t\t\t\t\r\n\t\t\t\t\r\n\t\t\t\t{momentsContent}\r\n\t\t\t
\r\n\t\t);\r\n\t}\r\n};\r\n\r\nexport default Moments;","import Swiper from './Swiper';\r\n\r\n// Makes Swiper the default import for this folder\r\nexport default Swiper;\r\n","import React, { Component } from 'react';\r\n\r\nimport './Swiper.scss';\r\n\r\nclass Swiper extends Component {\r\n\tmargin = 10;\r\n\ttouchCount = 0;\r\n\r\n\tstate = {\r\n\t\tstartX: 0,\r\n\t\tstartY: 0,\r\n\t\tendX: 0,\r\n\t\tendY: 0,\r\n\t\tisGestureInProgress: false,\r\n\t};\r\n\r\n\thandleTouchStart = (e) => {\r\n\t\tthis.touchCount++;\r\n\r\n\t\t// If two or more touch events are happening at the same time, then this touch is considered a gesture and will\r\n\t\t// be ignored by handleSwipe\r\n\t\tif (this.touchCount > 1) {\r\n\t\t\tthis.setState({ isGestureInProgress: true });\r\n\t\t}\r\n\r\n\t\tif (this.props.onTouchStart) {\r\n\t\t\tthis.props.onTouchStart(e);\r\n\t\t}\r\n\r\n\t\tconst touch = e.changedTouches[0];\r\n\r\n\t\tif (touch) {\r\n\t\t\tthis.setState({\r\n\t\t\t\tstartX: touch.screenX,\r\n\t\t\t\tstartY: touch.screenY,\r\n\t\t\t});\r\n\t\t}\r\n\t};\r\n\r\n\thandleTouchEnd = (e) => {\r\n\t\tthis.touchCount--;\r\n\r\n\t\tif (this.props.onTouchEnd) {\r\n\t\t\tthis.props.onTouchEnd(e);\r\n\t\t}\r\n\r\n\t\tconst touch = e.changedTouches[0];\r\n\r\n\t\tif (touch) {\r\n\t\t\t// Fires handleSwipe after the gesture is complete and the state has been updated\r\n\t\t\tthis.setState({\r\n\t\t\t\t\tendX: touch.screenX,\r\n\t\t\t\t\tendY: touch.screenY,\r\n\t\t\t\t},\r\n\t\t\t\tthis.handleSwipe,\r\n\t\t\t);\r\n\t\t}\r\n\t};\r\n\r\n\thandleSwipe = () => {\r\n\t\tconst {\r\n\t\t\tstartX,\r\n\t\t\tstartY,\r\n\t\t\tendX,\r\n\t\t\tendY,\r\n\t\t\tisGestureInProgress,\r\n\t\t} = this.state;\r\n\r\n\t\t// If there is a gesture in progress then the last touch event to end will end the gesture\r\n\t\tif (isGestureInProgress) {\r\n\t\t\tif (this.touchCount === 0) {\r\n\t\t\t\tthis.setState({ isGestureInProgress: false });\r\n\t\t\t}\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tif (this.props.onSwipeRight && (endX + this.margin) < startX) {\r\n\t\t\tthis.props.onSwipeRight(startX, startY, endX, endY);\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tif (this.props.onSwipeLeft && (endX - this.margin) > startX) {\r\n\t\t\tthis.props.onSwipeLeft(startX, startY, endX, endY);\r\n\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tif (this.props.onSwipeUp && (endY + this.margin) < startY) {\r\n\t\t\tthis.props.onSwipeUp(startX, startY, endX, endY);\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tif (this.props.onSwipeDown && (endY + this.margin) > startY) {\r\n\t\t\tthis.props.onSwipeDown(startX, startY, endX, endY);\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tif (this.props.onTap && Math.abs(endY - startY) < this.margin) {\r\n\t\t\tthis.props.onTap(startX, startY, endX, endY);\r\n\t\t\treturn;\r\n\t\t}\r\n\t};\r\n\r\n\trender() {\r\n\t\tconst {\r\n\t\t\tclassName,\r\n\t\t\tchildren,\r\n\t\t\t...otherProps\r\n\t\t} = this.props;\r\n\r\n\t\tdelete(otherProps.onSwipeLeft);\r\n\t\tdelete(otherProps.onSwipeRight);\r\n\t\tdelete(otherProps.onSwipeUp);\r\n\t\tdelete(otherProps.onSwipeDown);\r\n\t\tdelete(otherProps.onTap);\r\n\r\n\t\tconst classes = [ 'swiper' ];\r\n\t\tif (className) {\r\n\t\t\tclasses.push(className);\r\n\t\t}\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t
\r\n\t\t);\r\n\t};\r\n\r\n\trender() {\r\n\t\tconst {\r\n\t\t\tmoment,\r\n\t\t\ttitle,\r\n\t\t\teditMode,\r\n\t\t\teditAllowed,\r\n\t\t\tisControlsOpen,\r\n\t\t\thandleScrollLeft,\r\n\t\t\thandleScrollRight,\r\n\t\t\thandleToggleControlls,\r\n\t\t\thandleDelete,\r\n\t\t} = this.props;\r\n\r\n\t\tconst image = moment.image;\r\n\r\n\t\tconst windowWidth = window.innerWidth;\r\n\t\tconst windowHeight = window.innerHeight;\r\n\r\n\t\tconst imageFullWidth = (image && image.width) ? image.width : 600;\r\n\t\tconst imageFullHeight = (image && image.height) ? image.height : 450;\r\n\r\n\t\tconst imageWidthScale = windowWidth / imageFullWidth;\r\n\t\tconst imageHeightScale = windowHeight / imageFullHeight;\r\n\r\n\t\tconst rawScaleFactor = imageWidthScale >= imageHeightScale ? imageHeightScale : imageWidthScale;\r\n\r\n\t\tconst scaleFactor = rawScaleFactor >= 1 ? 1 : rawScaleFactor;\r\n\r\n\t\tconst fullMomentDisplayW = Math.floor(imageFullWidth * scaleFactor);\r\n\t\tconst fullMomentDisplayH = Math.floor(imageFullHeight * scaleFactor);\r\n\r\n\t\tconst fullScreenMomentClasses = [ 'full-screen-moment' ];\r\n\t\tif (editMode) {\r\n\t\t\tfullScreenMomentClasses.push('full-screen-moment--edit');\r\n\t\t}\r\n\r\n\t\tconst descriptionClasses = [ 'full-screen-moment__description' ];\r\n\t\tif ((!this.state.isDescriptionOpen && !editMode) || !isControlsOpen) {\r\n\t\t\tdescriptionClasses.push('full-screen-moment__description--closed')\r\n\t\t}\r\n\t\tif (editMode) {\r\n\t\t\tdescriptionClasses.push('full-screen-moment__description--edit');\r\n\t\t}\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t
\r\n\t\t\t\t{editAllowed && \r\n\t\t\t\t\t\r\n\t\t\t\t
}\r\n\t\t\t\t{editAllowed && \r\n\t\t\t\t\t\r\n\t\t\t\t
}\r\n\t\t\t e.stopPropagation()}>\r\n\t\t\t\t{!this.props.editMode &&
\r\n\t\t);\r\n\t}\r\n}\r\n\r\nexport default FullScreenMoment;\r\n","\timport React, { Component } from 'react';\r\nimport { connect } from 'react-redux';\r\n//import { Link } from 'react-router-dom';\r\n\r\nimport * as util from '../../utils/general';\r\nimport { dateText } from './util.js';\r\nimport Input from '../Form/Input';\r\nimport Image from '../Form/Image';\r\nimport Button from '../Form/Button';\r\nimport Form from '../Form/Form';\r\nimport FullScreenMoment from './FullScreenMoment';\r\nimport SharePanel from '../SharePanel';\r\n\r\nimport * as momentAPI from '../../api/momentAPI';\r\n\r\nimport './FullMoment.scss';\r\n\r\nclass FullMoment extends Component {\r\n\tbaseURL = null;\r\n\r\n\tconstructor(props) {\r\n\t\tsuper(props);\r\n\r\n\t\tthis.state = {\r\n\t\t\tmoment: props.moment || {},\r\n\t\t\tchangesMade: false,\r\n\t\t\teditAllowed: props.editAllowed,\r\n\t\t\teditMode: props.editMode || props.moment.momentId === 'new',\r\n\t\t\tsaving: false,\r\n\t\t\tloadingImage: false,\r\n\t\t\tcommentsPanelActive: false,\r\n\t\t\tisFullScreen: props.global.breakpoint.level <= util.breakpoints['mobile-landscape'],\r\n\t\t\tisControlsOpen: true,\r\n\t\t};\r\n\t}\r\n\r\n\tcomponentWillReceiveProps(nextProps) {\r\n\t\tconst state = {};\r\n\r\n\t\tif (this.state.moment.momentId !== nextProps.moment.momentId) {\r\n\t\t\tstate.moment = nextProps.moment;\r\n\t\t}\r\n\r\n\t\tif (this.props.global.breakpoint.level !== nextProps.global.breakpoint.level) {\r\n\t\t\tstate.isFullScreen = nextProps.global.breakpoint.level <= util.breakpoints['mobile-landscape'];\r\n\t\t}\r\n\r\n\t\tif (Object.keys(state).length > 0) {\r\n\t\t\tthis.setState(state);\r\n\t\t}\r\n\t}\r\n\r\n\tcheckDiscardChanges = () => {\r\n\t\t// if No changes made OR changes made AND discard confirmed\r\n\t\treturn !this.state.changesMade || (this.state.changesMade && window.confirm('You have unsaved changes. Do you want to leave anyway?'));\r\n\t};\r\n\r\n\tonClickBackdrop = () => {\r\n\t\tconst discardChanges = this.checkDiscardChanges();\r\n\t\tif (discardChanges) {\r\n\t\t\tthis.props.redirect(this.props.author);\r\n\t\t}\r\n\t};\r\n\r\n\thandleEditSwitch = () => {\r\n\t\tconst discardChanges = this.state.editMode && this.checkDiscardChanges();\r\n\r\n\t\tif (discardChanges) {\r\n\t\t\tthis.setState({\r\n\t\t\t\tmoment: this.props.moment || {},\r\n\t\t\t\tchangesMade: false,\r\n\t\t\t\teditAllowed: this.props.editAllowed,\r\n\t\t\t\teditMode: false,\r\n\t\t\t});\r\n\r\n\t\t\tif (this.props.moment.momentId === \"new\") {\r\n\t\t\t\tthis.props.redirect(this.props.author);\r\n\t\t\t} else {\r\n\t\t\t\tthis.props.redirect(this.props.author, this.props.moment.momentId);\r\n\t\t\t}\r\n\t\t} else {\r\n\t\t\tthis.setState({ editMode: true });\r\n\t\t}\r\n\t};\r\n\r\n\tsaveMoment = () => {\r\n\t\tthis.setState({\r\n\t\t\tsaving: true,\r\n\t\t});\r\n\r\n\t\tif (this.state.loadingImage) {\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tconst payload = {\r\n\t\t\t...this.state.moment,\r\n\t\t\timage: this.state.moment.image && {\r\n\t\t\t\tpersistedFileId: this.state.moment.image.persistedFileId,\r\n\t\t\t},\r\n\t\t\ttimelineID: parseInt(this.props.lifeTimeLineID, 10) || 0,\r\n\t\t\tyear: parseInt(this.state.moment.year, 10) || 0,\r\n\t\t\tmonth: parseInt(this.state.moment.month, 10) || 0,\r\n\t\t\tday: parseInt(this.state.moment.day, 10) || 0,\r\n\t\t};\r\n\r\n\t\tif (this.state.moment.momentId !== 'new') {\r\n\t\t\tmomentAPI.update(payload)\r\n\t\t\t\t.then(resp => {\r\n\t\t\t\t\tif (resp.success) {\r\n\t\t\t\t\t\t// TASK: Animate success?\r\n\t\t\t\t\t\tthis.props.onSetMoment(resp.data);\r\n\t\t\t\t\t\tthis.setState({\r\n\t\t\t\t\t\t\teditMode: false,\r\n\t\t\t\t\t\t\tchangesMade: false,\r\n\t\t\t\t\t\t\tsaving: false,\r\n\t\t\t\t\t\t});\r\n\t\t\t\t\t\tthis.props.redirect(this.props.author, this.props.moment.momentId);\r\n\t\t\t\t\t} else {\r\n\t\t\t\t\t\t// TASK: Handle error\r\n\t\t\t\t\t\tthis.setState({ saving: false });\r\n\t\t\t\t\t\tthis.props.onSetMessage({\r\n\t\t\t\t\t\t\ttitle: \t\t\t'Ooops!',\r\n\t\t\t\t\t\t\tmessage: \t\t'Something went wrong, please try again later.',\r\n\t\t\t\t\t\t});\r\n\t\t\t\t\t}\r\n\t\t\t\t});\r\n\t\t} else {\r\n\t\t \t// Delete the 'new' momentId\r\n\t\t \tdelete(payload.momentId);\r\n\r\n\t\t\tmomentAPI.create(payload)\r\n\t\t\t\t.then(resp => {\r\n\t\t\t\t\tif (resp.success) {\r\n\t\t\t\t\t\t// TASK: Animate success?\r\n\t\t\t\t\t\tthis.props.onSetMoment(resp.data);\r\n\t\t\t\t\t\tthis.props.redirect(this.props.author);\r\n\t\t\t\t\t} else {\r\n\t\t\t\t\t\t// TASK: Handle error\r\n\t\t\t\t\t}\r\n\t\t\t\t});\r\n\t\t}\r\n\t};\r\n\r\n\timageMetaData = (event, image, orientation) => {\r\n\t\tthis.setState({\r\n\t\t\tloadingImage: true,\r\n\t\t\tmoment: {\r\n\t\t\t\t...this.state.moment,\r\n\t\t\t\timage: {\r\n\t\t\t\t\t...this.state.moment.image,\r\n\t\t\t\t\tpersistedFileId: 0,\r\n\t\t\t\t\t// Setting URI to be the image base64 so that the image is displayed on the screen while it is uploading,\r\n\t\t\t\t\t// once the upload is complete it will be set to a valid uri\r\n\t\t\t\t\turi: image.src,\r\n\t\t\t\t\twidth: image.width,\r\n\t\t\t\t\theight: image.height,\r\n\t\t\t\t\texifDataProfile: image.exifDataProfile,\r\n\t\t\t\t},\r\n\t\t\t},\r\n\t\t\tchangesMade: true,\r\n\t\t});\r\n\t};\r\n\r\n\thandleImageUploaded = (resp) => {\r\n\t\tif (resp.success) {\r\n\t\t\tthis.setState({\r\n\t\t\t\tloadingImage: false,\r\n\t\t\t\tmoment: {\r\n\t\t\t\t\t...this.state.moment,\r\n\t\t\t\t\timage: resp.data,\r\n\t\t\t\t},\r\n\t\t\t});\r\n\t\t} else {\r\n\t\t\tthis.props.onSetMessage(resp.data);\r\n\t\t}\r\n\r\n\t\t// TASK: Consider what should happen if the user is trying to save but the image upload failed\r\n\t\tif (this.state.saving) {\r\n\t\t\twindow.setTimeout(() => this.saveMoment(), 0);\r\n\t\t}\r\n\t};\r\n\r\n\thandleInputChange = (event) => {\r\n\t\tconst {\r\n\t\t\tname,\r\n\t\t\tvalue,\r\n\t\t\ttype,\r\n\t\t\tchecked,\r\n\t\t} = event.target;\r\n\r\n\t\t// TASK: Add radio buttons and maybe improve checkbox implementation (basic and array)\r\n\t\tthis.setState({\r\n\t\t\tmoment: {\r\n\t\t\t\t...this.state.moment,\r\n\t\t\t\t[name]: type === 'checkbox' ? checked : value,\r\n\t\t\t},\r\n\t\t\tchangesMade: true,\r\n\t\t});\r\n\t};\r\n\r\n\thandleDelete = (e) => {\r\n\t\te.preventDefault();\r\n\r\n\t\tthis.props.onDeleteMoment(this.props.moment.momentId);\r\n\t}\r\n\r\n\t// renderEditControls = (location, panelAspect, smallView) => {\r\n\t// \tif (!this.state.editAllowed || !this.state.editMode) {\r\n\t// \t\treturn null;\r\n\t// \t} else {\r\n\t// \t\treturn (\r\n\t// \t\t\t\r\n\t\t\t\t\t{this.props.renderMomentDescription('portrait', false, !editMode)}\r\n\t\t\t\t
\r\n\t\t\t\t{this.renderControlls(\r\n\t\t\t\t\tmoment.timelineId,\r\n\t\t\t\t\tmoment.momentId,\r\n\t\t\t\t\ttitle,\r\n\t\t\t\t\teditMode,\r\n\t\t\t\t\teditAllowed,\r\n\t\t\t\t\thandleDelete,\r\n\t\t\t\t)}\r\n\t\t\t\r\n\t// \t\t\t\t
\r\n\t// \t\t);\r\n\t// \t}\r\n\t// };\r\n\r\n\ttoggleCommentsPanel = () => {\r\n\t\talert( this.state.commentsPanelActive ? 'COMING SOON\\nComments\\n\\nc' :'COMING SOON\\nComments\\n\\no' );\r\n\t\tthis.setState({commentsPanelActive: !this.state.commentsPanelActive });\r\n\t}\r\n\r\n\r\n\trenderIcons = (narrowLandscape, panelAspect) => {\r\n\t\tif (this.state.editMode) {\r\n\t\t\treturn (\r\n\t\t\t\t\r\n\t// \t\t\t\t\t\r\n\t// \t\t\t\t\t\t{smallView ? : 'Cancel'}\r\n\t// \t\t\t\t\t\r\n\t// \t\t\t\t\t\r\n\t// \t\t\t\t\t\t{smallView ? : 'Save'}\r\n\t// \t\t\t\t\t\r\n\t// \t\t\t\t
\r\n\t// \t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\tCancel\r\n\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\tSave\r\n\t\t\t\t\t\r\n\t\t\t\t
\r\n\t\t\t)\r\n\t\t}\r\n\r\n\t\t// const momentID = this.props.moment.momentId;\r\n\t\t// const {\r\n\t\t// \tlifeTimeLineID,\r\n\t\t// } = this.props;\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t{/* {alert('COMING SOON\\nLike Moments.')}} >\r\n\t\t\t\t {alert('COMING SOON\\nSharing Moments across your social media.')}} >\r\n\r\n\t\t\t\t{narrowLandscape && // In narrowLandscape the comments section is a popup\r\n\t\t\t\t\t\r\n\t\t\t\t} */}\r\n\t\t\t\t{this.renderAuthorIcons()}\r\n\t\t\t
\r\n\t\t);\r\n\r\n\t};\r\n\r\n\trenderAuthorIcons = () => {\r\n\t\t//console.log(this.props.global.breakpoint.label);\r\n\r\n\t\t// if (this.props.global.breakpoint.level <= util.breakpoints['mobile-l']) {\r\n\t\t// \treturn (\r\n\t\t// \t\t\r\n\t\t// \t\t\t {alert('COMING SOON\\nLike Moments.')}} >\r\n\t\t// \t\t
\r\n\t\t// \t);\r\n\r\n\t\t// } else {\r\n\t\t\treturn (\r\n\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t);\r\n\t\t//}\r\n\t}\r\n\r\n\trenderPrivacyControls = () => {\r\n\t\tif (!this.state.editMode) {\r\n\t\t\treturn null;\r\n\t\t}\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t\r\n\t\t\t\t
\r\n\t\t);\r\n\t};\r\n\r\n\trenderDateSection = (date, approximate, year, month, day, panelAspect) => {\r\n\t\tif (!this.state.editMode) {\r\n\t\t\treturn (\r\n\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\tSame as LifeTimeLine\r\n\t\t\t\t\t
\r\n\t\t\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\tEdit\r\n\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t);\r\n\t\t}\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t\t\t{dateText(date, approximate, year, month, day)}\r\n\t\t\t\t\t
\r\n\t\t\t\t\t{approximate &&\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t}\r\n\t\t\t\t\r\n\t\t\t\t
\r\n\t\t);\r\n\t};\r\n\r\n\trenderFullMomentFeed = () => {\r\n\t\tif (this.state.editMode) {\r\n\t\t\treturn null;\r\n\t\t} else {\r\n\t\t\treturn (\r\n\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t
\r\n\t\t\t\r\n\t\t\t\t\tComments etc. coming soon.\r\n\t\t\t\t
\r\n\t\t\t);\r\n\t\t}\r\n\t};\r\n\r\n\trenderScroll = (direction, editMode, isControlsOpen) => {\r\n\t\tif (editMode || this.props.moments.length < 2) {\r\n\t\t\treturn null;\r\n\t\t}\r\n\r\n\t\tconst arrowClasses = [ 'rounded-arrow' ];\r\n\t\tconst chevronClasses = [ 'rounded-arrow__chevron', 'fa' ]\r\n\r\n\t\tif (!isControlsOpen) {\r\n\t\t\tarrowClasses.push('rounded-arrow--closed');\r\n\t\t}\r\n\r\n\t\tif (direction === 'right') {\r\n\t\t\tarrowClasses.push('rounded-arrow--right');\r\n\t\t\tchevronClasses.push('fa-chevron-right');\r\n\t\t} else {\r\n\t\t\tarrowClasses.push('rounded-arrow--left');\r\n\t\t\tchevronClasses.push('fa-chevron-left');\r\n\t\t}\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t
\r\n\t\t\t\r\n\t\t);\r\n\t};\r\n\r\n\trenderControls = (editMode, isControlsOpen) => {\r\n\t\tif (editMode) {\r\n\t\t\treturn null;\r\n\t\t}\r\n\r\n\t\tconst controllClassses = [ 'full-moment-controls' ];\r\n\t\tif (!isControlsOpen) {\r\n\t\t\tcontrollClassses.push('full-moment-controls--closed');\r\n\t\t}\r\n\r\n\t\tconst zoomClasses = [ 'fa' ];\r\n\t\tlet zoomTitle = 'Detail View';\r\n\t\tif (this.state.isFullScreen) {\r\n\t\t\tzoomClasses.push('fa-compress');\r\n\t\t} else {\r\n\t\t\tzoomClasses.push('fa-expand');\r\n\t\t\tzoomTitle = 'Full Screen';\r\n\t\t}\r\n\r\n\t\tconst isMobile = this.props.global.breakpoint.level <= util.breakpoints['mobile-landscape'];\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t{!isMobile && \r\n\t\t\t\t\t\r\n\t\t\t\t
}\r\n\t\t\t\t e.stopPropagation()} style={fullMomentStyles}>\r\n\t\t\t\t\r\n\t\t\t
\r\n\t\t);\r\n\t};\r\n\r\n\trenderImage = (image, fullMomentDisplayW, fullMomentDisplayH) => {\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t\r\n\t\t\t
\r\n\t\t);\r\n\t}\r\n\r\n\ttoggleControlls = () => this.setState({ isControlsOpen: !this.state.isControlsOpen });\r\n\r\n\trenderFullScreenMoment = () => {\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t\t{this.renderDateSection(date, approximate, year, month, day, panelAspect)}\r\n\t\t\t\t\t{!hideIcons && this.renderIcons(narrowLandscape, panelAspect)}\r\n\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t{children}\r\n\t\t
\r\n\t);\r\n}\r\n\r\nexport default PageMenu;\r\n","import React, { Fragment } from 'react';\r\nimport { Link } from 'react-router-dom';\r\n\r\n//import './PageMenuItem.css'; --- uses pageMenu to delcare its css\r\n\r\nconst renderClassName = (menuType, suffix='') => {\r\n\treturn (\r\n\t\t(menuType==='vertical'?'vertical':'page') + 'Menu__menu-item' + suffix\r\n\t)\r\n}\r\n\r\nconst PageMenuItem = ({\r\n\tonClick,\r\n\tlinkTo,\r\n\ticonClassName,\r\n\tlabel,\r\n\tdisabled,\r\n\tchildren,\r\n\tisHighlighted,\r\n\tisOn,\r\n\tisActive,\r\n\tisOpen,\r\n\tmenuType='horizontal',\r\n\t...otherProps,\r\n}) => {\r\n\tif ( !onClick && !linkTo ) {\r\n\t\treturn null;\r\n\t}\r\n\r\n\t// Clean up other props so they wont be passed to the outer div element\r\n\tdelete(otherProps.linkTo);\r\n\tdelete(otherProps.iconClassName);\r\n\tdelete(otherProps.label);\r\n\tdelete(otherProps.disabled);\r\n\tdelete(otherProps.children);\r\n\tdelete(otherProps.isHighlighted);\r\n\tdelete(otherProps.isOn);\r\n\tdelete(otherProps.isActive);\r\n\tdelete(otherProps.isOpen);\r\n\tdelete(otherProps.menuType);\r\n\r\n\tlet menuItemElement = \"\";\r\n\tif (linkTo) {;\r\n\t\tmenuItemElement = (\r\n\t\t\t\r\n\t\t\t\t
{label}
\r\n\t\t\t\r\n\t\t\t\t
\r\n\t\t);\r\n\t};\r\n\r\n\tonBuyNow = (productId) => {\r\n\t\tcartAPI.addCartItem({\r\n\t\t\tcartId: this.props.cartID,\r\n\t\t\tproductId: productId,\r\n\t\t\tquantity: 1,\r\n\t\t})\r\n\t\t.then(resp => {\r\n\t\t\tif (!resp.success) {\r\n\t\t\t\t// TASK: Handle error\r\n\t\t\t\treturn;\r\n\t\t\t}\r\n\r\n\t\t\tthis.props.addCartItem(resp.data);\r\n\r\n\t\t\tif (resp.data.options.length === 0) {\r\n\t\t\t\tdefer.put(\r\n\t\t\t\t\t'PUBLISH_TIMELINE_ON_PAYMENT',\r\n\t\t\t\t\tthis.props.lifeTimeLineID,\r\n\t\t\t\t);\r\n\t\t\t\tthis.props.history.push('/cart');\r\n\t\t\t\treturn;\r\n\t\t\t}\r\n\r\n\t\t\tcartAPI.submitChoice(\r\n\t\t\t\tresp.data.cartItemId,\r\n\t\t\t\tresp.data.options[0].baseProductOptionId,\r\n\t\t\t\tthis.props.lifeTimeLineID,\r\n\t\t\t)\r\n\t\t\t.then((resp) => {\r\n\t\t\t\tif (resp.success) {\r\n\t\t\t\t\tthis.props.setCartOptionChoice({\r\n\t\t\t\t\t\t...resp.data,\r\n\t\t\t\t\t\tdisplayText: this.props.lifeTimeLine.title,\r\n\t\t\t\t\t\tdisplayOrder: 0,\r\n\t\t\t\t\t});\r\n\r\n\t\t\t\t\tdefer.put(\r\n\t\t\t\t\t\t'PUBLISH_TIMELINE_ON_PAYMENT',\r\n\t\t\t\t\t\tthis.props.lifeTimeLineID,\r\n\t\t\t\t\t);\r\n\t\t\t\t\tthis.props.history.push('/cart');\r\n\t\t\t\t} else {\r\n\t\t\t\t\t// TASK: Handle error\r\n\t\t\t\t}\r\n\t\t\t});\r\n\t\t});\r\n\t};\r\n\r\n\trender () {\r\n\t\tif (this.props.lifeTimeLineID === 'new') {\r\n\t\t\treturn null;\r\n\t\t}\r\n\r\n\t\tconst {\r\n\t\t\tisPublishPanelOpen,\r\n\t\t\t// isPrivacyPanelOpen,\r\n\t\t} = this.state;\r\n\r\n\t\tlet publishIsActive = !!this.props.lifeTimeLine.published;\r\n\t\tlet publishLabel = 'Publish';\r\n\t\tlet onClickPublishHandler = () => this.setIsPublishPanelOpen(!isPublishPanelOpen);\r\n\r\n\t\tif (publishIsActive) {\r\n\t\t\tpublishLabel = 'Published';\r\n\t\t}\r\n\r\n\t\tif (publishIsActive || this.props.lifeTimeLine.orderItemId > 0) {\r\n\t\t\tonClickPublishHandler = this.togglePublish;\r\n\t\t}\r\n\r\n\t\tconst isTabletAndBelow = this.props.breakpoint.level <= util.breakpoints['tablet'];\r\n\t\t//const isMobileAndBelow = this.props.breakpoint.level <= util.breakpoints['mobile-l'];\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\r\n\t\t\t\t\t\tChoose a Product that Suits You\r\n\t\t\t\t\t
\r\n\t\t\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\tPublish Now\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\t\t{this.state.products.map(product => (\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\tTry it for FREE!
\r\n\t\t\t\t\t\t\t\tPublish 5 Moments for free!
\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t this.onBuyNow(product.productId)}\r\n\t\t\t\t\t\t\t\tcolor=\"blue\"\r\n\t\t\t\t\t\t\t\tclassName=\"panel__button\"\r\n\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t{formatMoney(product.price/100, 0)}{product.baseProductCode !== 'LTLFULL' && \"/m\"} Buy Now\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\t))}\r\n\t\t\t\t\t\r\n\t\t\t\t\t\tView and compare all product options here.\r\n\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\t
\r\n\t\t\t\t\t\t\t{product.name}
\r\n\t\t\t\t\t\t\t\t\t{product.features[3]}
\r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t this.setIsPublishPanelOpen(false)}\r\n\t\t\t\t\t\t\tclassName=\"panel__cancel-button\"\r\n\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\tCancel\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\t}\r\n\t\t\t\t\t{this.renderPublishPanel()}\r\n\t\t\t\t\r\n\t\t\t
\r\n\t\t\t\t{isEditAllowed &&\r\n\t\t\t\t isMinimumSet &&\r\n\t\t\t\t\t this.handleCancelEdit(editMode)}\r\n\t\t\t\t\t\tcartID={this.props.cart.cartID}\r\n\t\t\t\t\t\thistory={this.props.history}\r\n\t\t\t\t\t\taddCartItem={this.props.addCartItem}\r\n\t\t\t\t\t\tsetCartOptionChoice={this.props.setCartOptionChoice}\r\n\t\t\t\t\t/>\r\n\t\t\t\t}\r\n\t\t\t\t this.handleCancelEdit(editMode)}\r\n\t\t\t\t\thandleImageUploaded={this.handleImageUploaded}\r\n\t\t\t\t\thandleImageChange={this.handleImageChange}\r\n\t\t\t\t\tsaveLifeTimeLine={this.saveLifeTimeLine}\r\n\t\t\t\t\tsaving={this.state.saving}\r\n\t\t\t\t/>\r\n\t\t\t\t\r\n\t\t\t\t}\r\n\t\t\t
\r\n\t\t);\r\n\t}\r\n}\r\n\r\nconst mapStateToProps = (state, props) => {\r\n\tconst lifeTimeLine = state.lifeTimeLines[props.match.params.id];\r\n\r\n\tlet moment = null;\r\n\tif (lifeTimeLine) {\r\n\t\tif (props.match.params.momentID === 'new') {\r\n\t\t\tmoment = {\r\n\t\t\t\tmomentId: 'new',\r\n\t\t\t};\r\n\t\t} else {\r\n\t\t\tconst momentID = parseInt(props.match.params.momentID, 10);\r\n\t\t\tmoment = lifeTimeLine.moments ? lifeTimeLine.moments.find(moment => moment.momentId === momentID) : null;\r\n\t\t}\r\n\t}\r\n\r\n\treturn {\r\n\t\tprofile: state.profile,\r\n\t\tlifeTimeLine,\r\n\t\tmoment,\r\n\t\tglobal: state.global,\r\n\t\taudience: state.audience,\r\n\t\tcart: state.cart,\r\n\t};\r\n};\r\n\r\n// maps dispatch action creator to be a prop of this component\r\nconst mapDispatchToProps = (dispatch, ownProps) => {\r\n\treturn {\r\n\t\tonSetMessage: (data) => {\r\n\t\t\tdispatch({\r\n\t\t\t\ttype: 'SET_MESSAGE',\r\n\t\t\t\tdata,\r\n\t\t\t});\r\n\t\t},\r\n\t\tonSetConfirm: (data) => {\r\n\t\t\tdispatch({\r\n\t\t\t\ttype: 'SET_MODAL',\r\n\t\t\t\tdata: {\r\n\t\t\t\t\ttype: 'delete-moment',\r\n\t\t\t\t\tdata,\r\n\t\t\t\t},\r\n\t\t\t});\r\n\t\t},\r\n\t\tonSetLifeTimeLine: (data) => {\r\n\t\t\tdispatch({\r\n\t\t\t\ttype: 'SET_LIFETIMELINE',\r\n\t\t\t\tdata,\r\n\t\t\t});\r\n\t\t},\r\n\t\taddCartItem: (data) => {\r\n\t\t\tdispatch({\r\n\t\t\t\ttype: 'ADD_CART_ITEM',\r\n\t\t\t\tdata,\r\n\t\t\t});\r\n\t\t},\r\n\t\tsetCartOptionChoice: (data) => {\r\n\t\t\tdispatch({\r\n\t\t\t\ttype: 'SET_CART_OPTION_CHOICE',\r\n\t\t\t\tdata,\r\n\t\t\t});\r\n\t\t},\r\n\t};\r\n};\r\n\r\nexport default connect(\r\n\tmapStateToProps,\r\n\tmapDispatchToProps,\r\n)(LifeTimeLine);\r\n","import React from 'react';\r\nimport { Switch, Route } from 'react-router-dom';\r\n\r\nimport { AuthRoute } from '../../utils/routing';\r\n\r\nimport LifeTimeLine from './LifeTimeLine';\r\n\r\nconst LifeTimeLineRouter = ({ isSignedIn }) => (\r\n\t\r\n\t\t\t\t\t
\r\n\t\t\t\t{this.props.moment &&\r\n\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t
\r\n\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t\tSecurity Check: Changes to your Password or Email require you enter your Current Password.
\r\n\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t
\r\n\t\t\t\r\n\t\t\t\t\t\t
\r\n\t\t\t)\r\n\t\t}\r\n\t\t// return (\r\n\t\t// \t\tYou will be sent a verification code via email to the above address when you save this form.
\r\n\t\t\t\t\t\r\n\t\t// \t\t\t
\r\n\t\t// )\r\n\t\treturn (\r\n\t\t\tA verification email has been sent to {this.state.entityData.primaryEmailAddress}.
\r\n\t\t// \t\t\r\n\t\t\t\t\t{/*\r\n\t\t\t\t\tWHEN INTEGRATING MANUAL EMAIL VERIFICATION CODE\r\n\t\t\t\t\tUncomment this block and remove the div bloak immediately below it\r\n\t\t\t\t\t\r\n\t\t\t\t\tVerify\r\n\t\t\t\t\t\r\n\t\t\t\t\tResend\r\n\t\t\t\t\t */}\r\n\r\n\t\t\t\t\t
\r\n\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\tResend\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t
\r\n\r\n\r\n\r\n\t\t\t\t\r\n\t\t\t\t\r\n\t\t\t\t this.handleSaveAccountDetails(this.state.entityData)}\r\n\t\t\t\t\tcolor={saveButtonColor}\r\n\t\t\t\t\tloading={this.state.saveState==='processing'}\r\n\t\t\t\t\tisSubmit={true}\r\n\t\t\t\t\t>{saveButtonLabel}\r\n\t\t\t
\r\n\t\t);\r\n\t};\r\n\r\n\r\n\trender() {\r\n\r\n\t\tconst {\r\n\t\t\teditMode,\r\n\t\t\tentityData,\r\n\t\t\tpasswordEditActive,\r\n\t\t} = this.state;\r\n\r\n\t\t// const imageTemp = {\r\n\t\t// \theight: 1106,\r\n\t\t// \toriginalFilename: \"_chester-nutting-protrait.jpg\",\r\n\t\t// \townerEntityId: 31,\r\n\t\t// \tpersistedFileId: \"d6d30b94-4f73-4793-a732-70793e580bb3\",\r\n\t\t// \ttype: \"image\",\r\n\t\t// \turi: \"https://files.staging.inmemoriam.com/44e9cf63-4f11-40b1-b6df-3c21076ab589.jpg\",\r\n\t\t// \twidth: 776,\r\n\t\t// };\r\n\r\n\t\tlet imageTemp = {\r\n\t\t\theight: null,\r\n\t\t\toriginalFilename: null,\r\n\t\t\townerEntityId: null,\r\n\t\t\tpersistedFileId: null,\r\n\t\t\ttype: \"image\",\r\n\t\t\turi: null,\r\n\t\t\twidth: null,\r\n\t\t};\r\n\t\tif (entityData.image) {\r\n\t\t\timageTemp = entityData.image;\r\n\t\t}\r\n\r\n\t\tif (!entityData) {\r\n\t\t\treturn (\r\n\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t)\r\n\t\t}\r\n\t\treturn (\r\n\t\t\tCould not return the User Details
\r\n\t\t\t\t\r\n\t\t\t\t
\r\n\t\t);\r\n\t}\r\n}\r\n\r\nconst mapStateToProps = (state) => {\r\n\treturn {\r\n\t\tprofile: state.profile,\r\n\t\tglobal: state.global,\r\n\t};\r\n};\r\n\r\nconst mapDispatchToProps = (dispatch, ownProps) => ({\r\n\tonSetMessage: (data) => {\r\n\t\tdispatch({\r\n\t\t\ttype: 'SET_MESSAGE',\r\n\t\t\tdata,\r\n\t\t});\r\n\t},\r\n\tonSetProfile: (data) => {\r\n\t\tdispatch({\r\n\t\t\ttype: 'SET_PROFILE',\r\n\t\t\tdata,\r\n\t\t});\r\n\t},\r\n});\r\n\r\nexport default connect(\r\n\tmapStateToProps,\r\n\tmapDispatchToProps,\r\n)(Detail);\r\n","import React, { Component } from 'react';\r\nimport { connect } from 'react-redux';\r\n\r\n//import Button from '../../../components/Form/Button';\r\n//import Input from '../../../components/Form/Input';\r\n//import Image from '../../../components/Form/Image';\r\n//import Form from '../../../components/Form/Form';\r\n\r\n\r\nimport './Details.scss';\r\n\r\nclass Transactions extends Component {\r\n\tconstructor(props) {\r\n\t\tsuper(props);\r\n\r\n\t\tthis.state = {\r\n\t\t\tloading: true,\r\n\t\t\ttransactions: null,\r\n\t\t};\r\n\t}\r\n\r\n\tcomponentWillReceiveProps = (nextProps) => {\r\n\t\tthis.setState({ transactions: nextProps.transactions, });\r\n\t}\r\n\r\n\r\n\r\n\r\n\trender() {\r\n\r\n\t\tconst {\r\n\t\t\ttransactions\r\n\t\t} = this.state;\r\n\r\n\r\n\r\n\t\tif (!transactions) {\r\n\t\t\treturn (\r\n\t\t\t\t\r\n\t\t\t\t\tAccount Details\r\n\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t)\r\n\t\t}\r\n\t\treturn (\r\n\t\t\tCould not return the Transaction Data
\r\n\t\t\t\t\r\n\t\t\t\t
\r\n\t\t);\r\n\t}\r\n}\r\n\r\nconst mapStateToProps = (state) => {\r\n\treturn {\r\n\t\ttransactions: state.transactions,\r\n\t};\r\n};\r\n\r\nconst mapDispatchToProps = (dispatch, ownProps) => ({\r\n\tonSetMessage: (data) => {\r\n\t\tdispatch({\r\n\t\t\ttype: 'SET_MESSAGE',\r\n\t\t\tdata,\r\n\t\t});\r\n\t}\r\n});\r\n\r\nexport default connect(\r\n\tmapStateToProps,\r\n\tmapDispatchToProps,\r\n)(Transactions);\r\n","import React from 'react';\r\n\r\nimport './Messages.scss';\r\n\r\nconst Messages = (props) => {\r\n\r\n\treturn (\r\n\t\t\r\n\t\t\t\t\tTransactions\r\n\t\t\t\t
\r\n\t\t\t\t\r\n\r\n\t\t\t\t\t
\r\n\t\t\t\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\r\n\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\t\r\n\t\t\tMessages\r\n\t\t
\r\n\t);\r\n};\r\n\r\nexport default Messages;","import React from 'react';\r\n\r\nimport './Notificatons.scss';\r\n\r\nconst Notificatons = (props) => {\r\n\r\n\treturn (\r\n\t\t\r\n\t\t\tNotificatons\r\n\t\t
\r\n\t);\r\n};\r\n\r\nexport default Notificatons;","import React from 'react';\r\n\r\nimport './Settings.scss';\r\n\r\nconst Settings = (props) => {\r\n\r\n\treturn (\r\n\t\t\r\n\t\t\tSettings\r\n\t\t
\r\n\t);\r\n};\r\n\r\nexport default Settings;","import React from 'react';\r\n\r\nimport './Associations.scss';\r\n\r\nconst Associations = (props) => {\r\n\r\n\treturn (\r\n\t\t\r\n\t\t\tAssociations\r\n\t\t
\r\n\t);\r\n};\r\n\r\nexport default Associations;","import React from 'react';\r\n\r\nimport './VerticalMenu.scss';\r\n\r\nconst VerticalMenu = ({\r\n\tverticalMenuActive,\r\n\tonCloseHandler,\r\n\tchildren,\r\n\t...otherProps,\r\n}) => {\r\n\r\n\tif (!verticalMenuActive) {\r\n\t\treturn null;\r\n\t}\r\n\r\n\treturn (\r\n\t\t\r\n\t\t\t
\r\n\t);\r\n}\r\n\r\nexport default VerticalMenu","import React, { Component, Fragment } from 'react';\r\nimport { connect } from 'react-redux';\r\n\r\nimport PageMenu \t\tfrom '../../components/PageMenu/PageMenu';\r\nimport PageMenuItem \tfrom '../../components/PageMenu/PageMenuItem';\r\nimport VerticalMenu \t\tfrom '../../components/PageMenu/VerticalMenu';\r\n\r\n//import * as util from '../../utils/general';\r\n\r\nimport './AccountMenu.scss';\r\n\r\nclass AccountMenu extends Component {\r\n\tconstructor(props) {\r\n\t\tsuper(props);\r\n\r\n\t\tthis.state = {\r\n\t\t\tverticalMenuActive: false,\r\n\t\t};\r\n\t}\r\n\r\n\ttoggleVerticalMenu = () => {\r\n\t\tthis.setState(prevState => ({ verticalMenuActive: !prevState.verticalMenuActive }));\r\n\t};\r\n\r\n\t// TASK: (already begun) Look at how we can compbine the menu item calls\r\n\t// (PageMenuItem & PageSubMenuItem - & maybe UserMenu too)\r\n\t// into a common component. See CR-12\r\n\trenderMenuEnd = (isMobileLAndBelow) => {\r\n\t\tif (isMobileLAndBelow) {\r\n\t\t\treturn (\r\n\t\t\t\t\r\n\t\t\t\t{children}\r\n\t\t\t
\r\n\t\t\r\n\t\t\t\t\r\n\t\t\t\t\t \r\n\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t \r\n\t\t\t\t\r\n\t\t\t\t\t\t`It looks like you have unsaved changes on this page. Are you sure you want to go to ${location.pathname}`\r\n\t\t\t\t\t}\r\n\t\t\t\t\t/>\r\n\t\t\t
\r\n\t\t);\r\n\t}\r\n}\r\n//export default AccountRouter;\r\n\r\nconst mapStateToProps = (state) => {\r\n\treturn {\r\n\t\tprofile: state.profile,\r\n\t};\r\n};\r\n\r\nconst mapDispatchToProps = (dispatch, ownProps) => ({\r\n\tonSetMessage: (data) => {\r\n\t\tdispatch({\r\n\t\t\ttype: 'SET_MESSAGE',\r\n\t\t\tdata,\r\n\t\t});\r\n\t},\r\n\tonSetProfile: (data) => {\r\n\t\tdispatch({\r\n\t\t\ttype: 'SET_PROFILE',\r\n\t\t\tdata,\r\n\t\t});\r\n\t},\r\n});\r\n\r\nexport default connect(\r\n\tmapStateToProps,\r\n\tmapDispatchToProps,\r\n)(AccountRouter);\r\n","import React from 'react';\r\n\r\nconst Dashboard = (props) => {\r\n\treturn (\r\n\t\t}\r\n\t\t\t\t\t\tsignInRequired={true}\r\n\t\t\t\t\t\tisSignedIn={isSignedIn}\r\n\t\t\t\t\t/>\r\n\t\t\t\t\t
Dashboard page
\r\n\t);\r\n};\r\n\r\nexport default Dashboard;","import React, { Component } from 'react';\r\nimport { connect } from 'react-redux';\r\nimport { BrowserRouter, Switch, Route } from 'react-router-dom';\r\n\r\nimport * as utils from '../utils/general';\r\nimport { AuthRoute } from '../utils/routing';\r\nimport LocationListener from '../utils/listener';\r\n\r\nimport { brandConfig } from '../api/brandConfig';\r\nimport * as cartAPI from '../api/cartAPI';\r\nimport * as maintenanceAPI from '../api/maintenanceAPI';\r\n\r\nimport Header from '../components/Header/Header';\r\nimport Message from '../components/Message/Message';\r\nimport Modal from '../components/Modal';\r\n\r\nimport Spinner from '../components/Spinner';\r\nimport Home from './Home/Home';\r\nimport HomePartner from './HomePartner/HomePartner';\r\nimport PrivacyPolicy from './PrivacyPolicy/PrivacyPolicy';\r\nimport Help from './Help/Help';\r\nimport About from './About/About';\r\nimport SignIn from './User/SignIn';\r\nimport ResetPasswordRequest from './User/ResetPasswordRequest';\r\nimport ResetPasswordAction from './User/ResetPasswordAction';\r\nimport Welcome from './User/Verification/Welcome';\r\nimport Verify from './User/Verification/Verify';\r\nimport Register from './User/Register';\r\nimport Cart from './Cart';\r\nimport Products from './Products';\r\nimport SearchPage from './SearchPage/SearchPage';\r\nimport ContactUs from './ContactUs/ContactUs';\r\nimport LifeTimeLines from './LifeTimeLines/LifeTimeLines';\r\nimport LifeTimeLine from './LifeTimeLine';\r\nimport Account from './Account';\r\nimport Dashboard from './Dashboard/Dashboard';\r\n\r\nimport './App.scss';\r\n\r\nclass App extends Component {\r\n\tconstructor(props) {\r\n\t\tsuper(props);\r\n\t\tthis.state = {\r\n\t\t\tloading: false\r\n\t\t};\r\n\t}\r\n\r\n\tresizeHandler = utils.throttle(() => {\r\n\t\twindow.dispatchEvent(new CustomEvent('RESIZE'));\r\n\r\n\t\tconst label = utils.getBreakpoint();\r\n\t\tthis.props.onSetBreakpoint({\r\n\t\t\tlabel,\r\n\t\t\tlevel: utils.breakpoints[label],\r\n\t\t});\r\n\t});\r\n\r\n\tgetAudience() {\r\n\t\t//console.log('A.65 GETAUDIENCE', Date.now() );\r\n\t\tconst theHostName = window.location.hostname;\r\n\t\t// remove known decorators ('qa.', 'dev.', 'build.', 'demo.') and ancillory host details ('www.', '.com', '.au' etc).\r\n\t\t// Remember this is internal and just produces a key to retrieve branding from the config file\r\n\t\t// e.g. if a partner uses a full url such as inmemoriam.titreelodge.com.au\r\n\t\t// the resulting key would be inmemoriamtitreelodge\r\n\t\t// we could add this to remove inmemoriam and lifetimeline from a partners domains (e.g. inmemroriam.titreelodge.com.au) but not required yet\r\n\t\tconst regex = /((^din|(^|-)(dev|devqa|qa))\\.)|\\.(com|net|org|com\\.au)$|\\./gi;\r\n\t\tconst pureHostName = theHostName.replace(regex, '');\r\n\t\tconst forceHostName = 'lifetimeline';\t// lifetimeline\t\tinmemoriam\r\n\t\tconst resolvedHostName = (pureHostName === 'localhost') ? forceHostName : pureHostName;\r\n\t\tconst audience = brandConfig[resolvedHostName];\r\n\t\tif (audience) {\r\n\t\t\tthis.props.onGetAudience(audience);\r\n\r\n\t\t\tif (this.props.profile.isSignedIn) {\r\n\t\t\t\tcartAPI.getByPartnerID(audience.partnerID)\r\n\t\t\t\t\t.then(resp => {\r\n\t\t\t\t\t\tif (!resp.success) {\r\n\t\t\t\t\t\t\treturn;\r\n\t\t\t\t\t\t}\r\n\t\t\t\t\t\tthis.props.setCartItems(resp.data.cartId, resp.data.cartItems);\r\n\t\t\t\t\t});\r\n\t\t\t}\r\n\t\t} else {\r\n\t\t\tconsole.log('Error retrieving Brand >>', brandConfig)\r\n\t\t}\r\n\t}\r\n\r\n\tcomponentWillMount = () => {\r\n\t\t//console.log('A.90 Loading', Date.now() );\r\n\t\tthis.setState({loading: true});\r\n\t}\r\n\r\n\t//\tAdd and remove header shadow on scroll\r\n\tcomponentDidMount = () => {\r\n\t\tthis.getAudience();\r\n\t\tthis.resizeHandler();\r\n\t\twindow.addEventListener('scroll', this.handleScroll);\r\n\t\twindow.addEventListener('resize', this.resizeHandler);\r\n\t\twindow.addEventListener(\"error\", event => maintenanceAPI.logError(event.detail.stack));\r\n\t\twindow.addEventListener(\"unhandledrejection\", event => maintenanceAPI.logError(event.reason.stack));\r\n\t\tdocument.onscroll = utils.debounce(() => window.dispatchEvent(new CustomEvent('SCROLL_EVENT')));\r\n\t\t// Uncomment the setTimeout to test loading spinner\r\n\t\t//setTimeout(function() {\r\n\t\t\tthis.setState({loading: false})\r\n\t\t\t//console.log('A.105 Loaded', Date.now() );\r\n\t\t//}.bind(this), 2000)\r\n\t}\r\n\tcomponentWillUnmount = () => {\r\n\t\twindow.removeEventListener('scroll', this.handleScroll);\r\n\t\twindow.removeEventListener('resize', this.resizeHandler);\r\n\t\twindow.removeEventListener(\"error\", event => maintenanceAPI.logError(event.detail.stack));\r\n\t\twindow.removeEventListener(\"unhandledrejection\", event => maintenanceAPI.logError(event.reason.stack));\r\n\t}\r\n\r\n\t// TODO - move this to react style solution\r\n\thandleScroll = () => {\r\n\t\tif (window.pageYOffset > 5) {\r\n\t\t\tdocument.getElementById('header').classList.add('header--shadow');\r\n\t\t}\r\n\t\tif (window.pageYOffset < 5) {\r\n\t\t\tdocument.getElementById('header').classList.remove('header--shadow');\r\n\t\t}\r\n\t}\r\n\r\n\trender() {\r\n\r\n\t\tif (this.state.loading) {\r\n\t\t\t//console.log('A.125 Spin', Date.now() );\r\n\t\t\treturn (\r\n\t\t\t\t\r\n\t\t\t\t\t
\r\n\t\t\t);\r\n\t\t}\r\n\r\n\t\tconst isSignedIn = this.props.profile.isSignedIn;\r\n\t\tconst audience = this.props.audience;\r\n\t\tconst appClasses = [ 'app' ];\r\n\t\tif (isSignedIn) {\r\n\t\t\tappClasses.push('app--signed-in')\r\n\t\t}\r\n\r\n\t\t// ADD PARTNRER THEME CLASS - e.g. jbc-theme\r\n\t\tappClasses.push(`${audience.brand.code}-theme`.toLowerCase());\r\n\r\n\r\n\t\t//console.log('APP.125 Pre-Return', Date.now());\r\n\t\t//console.log('H.127', audience.brand.code, Date.now());\r\n\r\n\t\treturn (\r\n\t\t\t\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t{/* */}\r\n\t\t\t\t\t\t\t\t {\r\n\t\t\t\t\t\t\t\t\t\tif (!audience.brand.code || audience.brand.code === 'LTL' || audience.brand.code === 'IMG' ) {\r\n\t\t\t\t\t\t\t\t\t\t\t//console.log('APP.145 HOME',routeProps);\r\n\t\t\t\t\t\t\t\t\t\t\treturn ;\r\n\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\t//console.log('APP.148 HOMEPARTNER',routeProps);\r\n\t\t\t\t\t\t\t\t\t\treturn \r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t \r\n\t\t\t\t\t\t
\r\n\t\t\t\t\t\t