\r\n
\r\n}","export function isExternalLink(link){\r\n return link && (link.indexOf('https://') === 0 || link.indexOf('http://') === 0 || link.indexOf('://') === 0);\r\n}\r\n\r\nexport function getLinkFromElement(el){\r\n if (!el) return null;\r\n const linkEl = el.closest('a');\r\n //console.log(el, linkEl);\r\n if (linkEl){\r\n return linkEl.getAttribute('href');\r\n }\r\n return null;\r\n}\r\n\r\n\r\n// router utils\r\nexport function getLinkInfo(link) {\r\n if (!link) return null;\r\n\r\n const origin = typeof window !== `undefined` && window.location && window.location.origin;\r\n const currentPath = typeof window !== `undefined` && window.location && window.location.pathname;\r\n let linkFiltered = link.replace(origin, '').replace(currentPath + '#', '#');\r\n let linkLower = link.toLowerCase();\r\n\r\n //if (isStaticFile(linkLower)) return null;\r\n const isExternal = isExternalLink(linkFiltered);\r\n const isHash = linkFiltered.indexOf('#') === 0;\r\n const isTel = linkFiltered.indexOf('tel:') === 0;\r\n const isMailTo = linkFiltered.indexOf('mailto:') === 0;\r\n const type = (isHash && 'hash') || (isTel && 'tel') || (isMailTo && 'mailto') || \r\n (isStaticFile(linkLower) && 'static') || (isExternal && 'external') || 'internal';\r\n\r\n return { url: linkFiltered, type: type, ext: getExtension(link) };\r\n}\r\n\r\nvar exts = ['.pdf', '.jpg', '.png', '.gif', '.docx', '.doc']\r\nfunction isStaticFile(path) {\r\n for(let i = 0; i < exts.length; i++) {\r\n if (path.indexOf(exts[i]) >= 0) return true;\r\n }\r\n return false;\r\n}\r\n\r\nexport function getExtension(filename) {\r\n if (!filename || filename.indexOf('.') < 0) return null;\r\n return filename.split('.').pop().toLowerCase();\r\n}\r\n\r\nexport function getFilename(url) {\r\n return url.split('/').pop().split('?')[0];\r\n}\r\n\r\nexport function getFolderPath(url, parentDepth = -1) {\r\n return url.split('/').slice(0, parentDepth).join('/');\r\n}\r\n\r\n//\r\nexport function toQueryString(params) {\r\n var queryString = Object.keys(params).map((key) => {\r\n return encodeURIComponent(key) + '=' + encodeURIComponent(params[key])\r\n }).join('&');\r\n return queryString;\r\n}\r\n\r\nexport function getYoutubeId(url){\r\n url = url.split(/(vi\\/|v=|\\/v\\/|youtu\\.be\\/|\\/embed\\/)/);\r\n return (url[2] !== undefined) ? url[2].split(/[^0-9a-z_-]/i)[0] : url[0];\r\n}\r\n\r\nexport function getSlug(text){\r\n return text.toLowerCase().replace(/ /g,'-').replace(/[-]+/g, '-').replace(/[^\\w-]+/g,'');\r\n}\r\n\r\nexport function getWebUrl(url, schema = 'https://'){\r\n if (!url) return null;\r\n if (url.indexOf('https:') >= 0 || url.indexOf('http:') >= 0 || url.indexOf(':') >= 0) {\r\n return url;\r\n }\r\n return schema + url;\r\n}","//#region error json parsing\r\nexport const getErrors = (result) => {\r\n let errors = [];\r\n if (result && result.errors && result.errors.length > 0) {\r\n result.errors.forEach(err => {\r\n errors.push(err.errorMessage);\r\n });\r\n }\r\n return errors;\r\n}\r\n\r\nexport const getErrorMessage = (result) => {\r\n let errors = getErrors(result);\r\n return errors.join(\" \");\r\n}\r\n//#endregion","//#region conversion between array and object\r\nexport const convertToObject = (array, key) => {\r\n const initialValue = {};\r\n return array.reduce((obj, item) => {\r\n return {\r\n ...obj,\r\n [item[key]]: item,\r\n };\r\n }, initialValue);\r\n};\r\n\r\nexport const convertToKeyValues = (array, key, value) => {\r\n const initialValue = {};\r\n return array.reduce((obj, item) => {\r\n return {\r\n ...obj,\r\n [item[key]]: item[value],\r\n };\r\n }, initialValue);\r\n};\r\n//#endregion\r\n\r\n//#region array helper functions\r\nexport const moveItem = (list, fromIndex, toIndex) => {\r\n //const list = Array.from(array);\r\n const [removed] = list.splice(fromIndex, 1);\r\n list.splice(toIndex, 0, removed);\r\n\r\n return list;\r\n};\r\n\r\nexport const removeItem = (list, index) => {\r\n //const list = Array.from(array);\r\n list.splice(index, 1);\r\n\r\n return list;\r\n};\r\n\r\nexport const insertItem = (list, index, item) => {\r\n //const list = Array.from(array);\r\n list.splice(index, 0, item);\r\n\r\n return list;\r\n};\r\n\r\n\r\nexport const find = (list, fn) => {\r\n if (!list) return null;\r\n for (let i = 0; i < list.length; i++) {\r\n if (fn(list[i])) {\r\n return list[i];\r\n }\r\n }\r\n return null;\r\n};\r\n\r\nexport const findIndex = (list, fn) => {\r\n if (!list) return -1;\r\n for (let i = 0; i < list.length; i++) {\r\n if (fn(list[i])) {\r\n return i;\r\n }\r\n }\r\n return -1;\r\n};\r\n\r\nexport const contains = (list, fn) => {\r\n return findIndex(list, fn) >= 0;\r\n}\r\n\r\n// utils.array.distinct(images, (x, y) => x.imageUrl === y.imageUrl)\r\nexport const distinct = (list, comparer) => {\r\n const filtered = []\r\n for (let i = 0; i < list.length; i++) {\r\n if (!contains(filtered, (x) => comparer(x, list[i]))) {\r\n filtered.push(list[i])\r\n }\r\n }\r\n return filtered;\r\n}\r\n\r\nexport const sum = (list, fn) => {\r\n if (!list) return 0;\r\n let total = 0;\r\n for (let i = 0; i < list.length; i++) {\r\n total += fn(list[i]) || 0\r\n }\r\n return total\r\n}\r\n\r\nexport const equal = (list1, list2, fn) => {\r\n if (!list1 && !list2) return true;\r\n if (!list1 || !list2) return false;\r\n if (list1.length !== list2.length) return false;\r\n for (let i = 0; i < list1.length; i++) {\r\n let found = false;\r\n for (let j = 0; j < list2.length; j++) {\r\n if(fn(list1[i], list2[i])) {\r\n found = true;\r\n break;\r\n }\r\n }\r\n if (!found) return false;\r\n }\r\n return true;\r\n}\r\n//#endregion\r\n\r\n//#region sorting helpers\r\nexport const caseInsensitiveCompare = function (a, b) {\r\n return a.toLowerCase().localeCompare(b.toLowerCase());\r\n}\r\n\r\n// put the null items at the end.\r\nexport const compareIgnoreEmpty = function (asc) {\r\n return asc ?\r\n function (a, b) {\r\n return (a === null || isNaN(a)) - (b === null || isNaN(b)) || +(a > b) || -(a < b);\r\n }\r\n :\r\n function (a, b) {\r\n return (a === null || isNaN(a)) - (b === null || isNaN(b)) || -(a > b) || +(a < b);\r\n }\r\n}\r\n//#endregion","import parse from \"date-fns/parse\";\r\nimport parseISO from \"date-fns/parseISO\";\r\nimport format from \"date-fns/format\";\r\n\r\n//#region manipulation\r\nexport const addDays = (date, days) => {\r\n var result = new Date(date);\r\n result.setDate(result.getDate() + days);\r\n return result;\r\n};\r\n//#endregion\r\n\r\n//#region format\r\nexport function formatDate(dateObj, formatStr) {\r\n const date = toDate(dateObj);\r\n if (!date) return \"\";\r\n return format(date, formatStr);\r\n}\r\n\r\nexport function formatYYYYMMDD(dateObj) {\r\n const date = toDate(dateObj);\r\n //console.log(dateObj, date)\r\n if (!date) return \"\";\r\n var dd = date.getDate();\r\n var mm = date.getMonth() + 1; //January is 0!\r\n\r\n var yyyy = date.getFullYear();\r\n if (dd < 10) {\r\n dd = \"0\" + dd;\r\n }\r\n if (mm < 10) {\r\n mm = \"0\" + mm;\r\n }\r\n return `${yyyy}-${mm}-${dd}`;\r\n}\r\n\r\nexport function formatDDMMYYYY(dateObj) {\r\n const date = toDate(dateObj);\r\n //console.log(dateObj, date)\r\n if (!date) return \"\";\r\n var dd = date.getDate();\r\n var mm = date.getMonth() + 1; //January is 0!\r\n\r\n var yyyy = date.getFullYear();\r\n if (dd < 10) {\r\n dd = \"0\" + dd;\r\n }\r\n if (mm < 10) {\r\n mm = \"0\" + mm;\r\n }\r\n return `${dd}-${mm}-${yyyy}`;\r\n}\r\n//#endregion\r\n\r\n//#region parse\r\nexport function toDate(dateObj) {\r\n if (!dateObj) return null;\r\n if (typeof dateObj === \"string\") {\r\n return (\r\n parseDate(dateObj, \"yyyy-MM-dd\") ||\r\n parseDate(dateObj, \"yyyy-M-d\") ||\r\n parseDate(dateObj, \"dd/MM/yyyy\") ||\r\n parseDate(dateObj, \"d/M/yyyy\") ||\r\n parseISO(dateObj)\r\n );\r\n } else {\r\n return dateObj;\r\n }\r\n}\r\n\r\nexport function toDateTime(dateObj) {\r\n if (!dateObj) return null;\r\n if (typeof dateObj === \"string\") {\r\n return (\r\n parseDate(dateObj, \"yyyy-MM-dd'T'HH:mm:ss.SSSxxx\") ||\r\n parseDate(dateObj, \"yyyy-MM-dd HH:mm:ss.SSSxxx\") ||\r\n parseDate(dateObj, \"yyyy-M-d HH:mm:ss.SSSxxx\") ||\r\n parseDate(dateObj, \"dd/MM/yyyy HH:mm:ss.SSSxxx\") ||\r\n parseDate(dateObj, \"d/M/yyyy HH:mm:ss.SSSxxx\") ||\r\n parseISO(dateObj)\r\n );\r\n } else {\r\n return dateObj;\r\n }\r\n}\r\n\r\nexport function parseDate(dateStr, format) {\r\n const date = parse(dateStr, format, new Date());\r\n return date && isValidDate(date) ? date : null;\r\n}\r\n\r\nexport function isValidDate(d) {\r\n return d instanceof Date && !isNaN(d);\r\n}\r\n//#endregion\r\n","//#region background images\r\nexport const bgUrl = (imageUrl) => {\r\n return `background-image:url(\"` + encodeURI(decodeURI(imageUrl)) + `\")`\r\n}\r\n\r\nexport const bgUrlStyle = (imageUrl) => {\r\n return `url(\"` + encodeURI(decodeURI(imageUrl)) + `\")`\r\n}\r\n//#endregion\r\n\r\n//#region screen/element size\r\nexport const screenWidth = () => {\r\n if (typeof window !== `undefined`) { \r\n return window.innerWidth ||\r\n document.documentElement.clientWidth ||\r\n document.body.clientWidth\r\n } else {\r\n return 0;\r\n }\r\n}\r\n\r\nexport const screenHeight = () => {\r\n if (typeof window !== `undefined`) { \r\n return window.innerHeight ||\r\n document.documentElement.clientHeight ||\r\n document.body.clientHeight\r\n } else {\r\n return 0;\r\n }\r\n}\r\n\r\nexport const outerWidth = el => el.offsetWidth\r\nexport const outerHeight = el => el.offsetHeight\r\n//#endregion\r\n\r\n//#region css class\r\n/**\r\n * Check if element has the css class on it.\r\n */\r\nexport const hasClass = (el, className) => {\r\n if (el.classList) {\r\n return el.classList.contains(className)\r\n }\r\n\r\n return !!el.className.match(new RegExp(`(\\\\s|^)${className}(\\\\s|$)`))\r\n}\r\n\r\n/**\r\n * Adds the provided css className to the element.\r\n */\r\nexport const addClass = (el, className) => {\r\n if (el.classList) {\r\n el.classList.add(className)\r\n return\r\n }\r\n\r\n if (!hasClass(el, className)) {\r\n el.className += ` ${className}`\r\n }\r\n}\r\n\r\n/**\r\n * Remove the provided css className from the element.\r\n */\r\nexport const removeClass = (el, className) => {\r\n if (el.classList) {\r\n el.classList.remove(className)\r\n return\r\n }\r\n\r\n if (hasClass(el, className)) {\r\n const reg = new RegExp(`(\\\\s|^)${className}(\\\\s|$)`)\r\n el.className = el.className.replace(reg, ' ')\r\n }\r\n}\r\n\r\n/**\r\n * Adds or removes a class name on the input depending on the status flag.\r\n */\r\nexport const toggleClass = (el, className, status) => {\r\n if (!el || !className) return\r\n\r\n if (status) {\r\n return addClass(el, className)\r\n }\r\n\r\n removeClass(el, className)\r\n}\r\n//#endregion","import { gsap } from 'gsap';\r\nimport { ScrollToPlugin } from 'gsap/ScrollToPlugin';\r\n\r\ngsap.registerPlugin(ScrollToPlugin);\r\n\r\nexport function scrollTo(selector, duration = 750, delay = 0) {\r\n const el = findElement(selector);\r\n if (el) {\r\n setTimeout(() => {\r\n //console.log(element);\r\n const offset = elementOffset(el);\r\n //console.log(offset)\r\n //window.scrollTo(0, offset.top - 300);\r\n\r\n gsap.to(window, {duration: (duration/1000), scrollTo: offset.top - 100, ease: 'power1'});\r\n\r\n }, delay);\r\n //el.scrollIntoView({ block: 'start', inline: 'nearest', behavior: 'smooth' }); }, timeout);\r\n return true;\r\n }\r\n return false;\r\n}\r\n\r\nexport function findElement(selector) {\r\n if (typeof selector !== 'string') return selector;\r\n\r\n let found = querySelectorOrNull(selector)\r\n || querySelectorOrNull('#' + selector)\r\n || querySelectorOrNull('.' + selector)\r\n \r\n return found;\r\n}\r\n\r\nexport function querySelectorOrNull(selector) {\r\n try {\r\n return document.querySelector(selector);\r\n } catch(e){\r\n return null;\r\n };\r\n}\r\n\r\nexport function elementOffset(el) {\r\n var rect = el.getBoundingClientRect(),\r\n scrollLeft = typeof window !== `undefined` ? (window.pageXOffset || document.documentElement.scrollLeft) : 0,\r\n scrollTop = typeof window !== `undefined` ? (window.pageYOffset || document.documentElement.scrollTop) : 0;\r\n\r\n return { top: rect.top + scrollTop, left: rect.left + scrollLeft, width: el.offsetWidth, height: el.offsetHeight }\r\n}\r\n\r\nexport function isElementInViewport (el) {\r\n if (typeof window !== `undefined`) {\r\n var rect = el.getBoundingClientRect();\r\n\r\n return (\r\n rect.top >= 0 &&\r\n rect.left >= 0 &&\r\n rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) && /* or $(window).height() */\r\n rect.right <= (window.innerWidth || document.documentElement.clientWidth) /* or $(window).width() */\r\n );\r\n } else {\r\n return true;\r\n }\r\n}\r\n\r\nexport function getCurrentBreakpoint() {\r\n if (typeof window === `undefined`) return null;\r\n \r\n const bpHolder = document.querySelector('.devMediaQueryStatus__current');\r\n if (!bpHolder) return null;\r\n return window.getComputedStyle(bpHolder, ':before').getPropertyValue('content').replace(/[\"']/g, '');\r\n}\r\n\r\n","export function formatMoney(number, fraction = 0) {\r\n var formatter = new Intl.NumberFormat('en-AU', {\r\n style: 'currency',\r\n currency: 'AUD',\r\n minimumFractionDigits: fraction,\r\n });\r\n\r\n return formatter.format(number);\r\n}\r\n\r\nexport function toMonthlyCost(amount, frequency) {\r\n if (!amount) return 0;\r\n if (frequency === 'Week') {\r\n return amount * 52.1429 / 12.0;\r\n } else if (frequency === 'Fortnight') {\r\n return amount * 52.1429 / 2.0 / 12.0;\r\n } else if (frequency === 'Month') {\r\n return amount;\r\n } else if (frequency === 'Quarter') {\r\n return amount * 4.0 / 12.0;\r\n } else if (frequency === 'Year') {\r\n return amount / 12.0;\r\n } else {\r\n return amount;\r\n }\r\n}\r\n","export function isBlank(str) {\r\n return (!str || /^\\s*$/.test(str))\r\n}\r\n\r\nexport function isEmpty(str) {\r\n return (!str || str.length === 0)\r\n}\r\n\r\nexport function isNumeric(num){\r\n return !isNaN(num)\r\n}\r\n\r\nexport function capitalize(expression) {\r\n return expression.charAt(0).toUpperCase() + expression.slice(1);\r\n}\r\n\r\nexport function toFieldName(str) {\r\n if (!str) return null;\r\n return capitalize((str.replace(/([A-Z]+)/g, ' $1').replace(/([A-Z][a-z])/g, ' $1')).trim());\r\n}\r\n\r\nexport function toHtml(str) {\r\n if (!str) return null;\r\n return str.replace(/[\\n\\r]/g, '\r\n
\r\n ')\r\n}\r\n\r\n// Shorten a string to less than maxLen characters without truncating words.\r\nexport function truncateWords(str, maxLen, separator = ' ', ellipsis = '...') {\r\n if (str.length <= maxLen) return str\r\n var pos = str.lastIndexOf(separator, maxLen)\r\n return str.substr(0, pos) + ellipsis\r\n}\r\n\r\nexport function numberWithCommas(x) {\r\n var parts = x.toString().split(\".\");\r\n parts[0] = parts[0].replace(/\\B(?=(\\d{3})+(?!\\d))/g, \",\");\r\n return parts.join(\".\");\r\n}\r\n\r\nexport const formatNumber = (value) => {\r\n if (value === 0) return '0';\r\n if (!value) return '';\r\n return Math.round(value * 100) / 100\r\n}\r\n\r\nexport const toTelephoneNumber = (str) => {\r\n return (str || []).replace(/[^+\\d]+/g, \"\");\r\n\r\n}\r\n\r\n// utils.text.like('text here', '%keyword%')\r\nexport const like = (str, search) => {\r\n if (typeof search !== 'string' || str === null) { return false; }\r\n // Remove special chars\r\n search = search.replace(new RegExp(\"([\\\\.\\\\\\\\\\\\+\\\\*\\\\?\\\\[\\\\^\\\\]\\\\$\\\\(\\\\)\\\\{\\\\}\\\\=\\\\!\\\\<\\\\>\\\\|\\\\:\\\\-])\", \"g\"), \"\\\\$1\");\r\n // Replace % and _ with equivalent regex\r\n search = search.replace(/%/g, '.*').replace(/_/g, '.');\r\n // Check matches\r\n return RegExp('^' + search + '$', 'gi').test(str);\r\n\r\n}","import shortid from 'shortid';\r\nimport uuid from 'uuid/v4';\r\n\r\nexport function shortId() {\r\n return shortid();\r\n}\r\n\r\nexport function guid() {\r\n return uuid();\r\n}","export function toCamel(o) {\r\n var newO, origKey, newKey, value\r\n if (o instanceof Array) {\r\n return o.map(function(value) {\r\n if (typeof value === \"object\") {\r\n value = toCamel(value)\r\n }\r\n return value\r\n })\r\n } else {\r\n newO = {}\r\n for (origKey in o) {\r\n if (o.hasOwnProperty(origKey)) {\r\n newKey = (origKey.charAt(0).toLowerCase() + origKey.slice(1) || origKey).toString()\r\n value = o[origKey]\r\n if (value instanceof Array || (value !== null && value.constructor === Object)) {\r\n value = toCamel(value)\r\n }\r\n newO[newKey] = value\r\n }\r\n }\r\n }\r\n return newO\r\n}","import { getFilename } from './url';\r\nimport { contains } from './array';\r\nexport function getImageSetPath(url, setId) {\r\n const info = getPathDetails(url)\r\n if (!info) return url;\r\n //console.log(url, info);\r\n return info.baseFolder + \"/@\" + setId + '/' + info.filename\r\n}\r\n\r\nexport function getPathDetails(url, setIds) {\r\n if (!url) return null;\r\n const parts = url.split('/').slice(0, -1);\r\n if (parts.length <= 1) return { baseFolder: '/', setId: null, filename: getFilename(url) };\r\n\r\n const lastFolder = parts[parts.length - 1];\r\n const hasSet = setIds && setIds.length > 0 ? contains(setIds, x => x === lastFolder) : lastFolder.indexOf('@') === 0;\r\n\r\n return hasSet ?\r\n { baseFolder: parts.slice(0, -1).join('/'), setId: lastFolder, filename: getFilename(url) } :\r\n { baseFolder: parts.join('/'), setId: null, filename: getFilename(url) }\r\n}","import classNames from 'classnames';\r\nimport * as url from './url';\r\nimport * as form from './form';\r\nimport * as array from './array';\r\nimport * as date from './date';\r\nimport * as css from './css';\r\nimport * as ui from './ui';\r\nimport * as money from './money';\r\nimport * as text from './text';\r\nimport * as random from './random';\r\nimport * as object from './object';\r\nimport * as media from './media';\r\n\r\nexport default { classNames, url, form, array, date, css, ui, money, text, random, object, media};","import utils from \"utils\";\nimport env from 'env';\n\nexport const isMobile = () => {\n var width = utils.css.screenWidth()\n return width < 768\n}\n\nexport function resourcePath(url){\n return utils.url.isExternalLink(url)? url : env.resourceBase + url;\n}","import coreUtils from 'lib/utils-core';\nimport * as site from 'site/siteUtils';\n\nexport default { ...coreUtils, site };","import { useState, useEffect } from 'react';\r\nimport utils from '../../utils';\r\nimport siteConfig from '../../config';\r\n\r\nexport function useApi(fn) {\r\n //console.log('useApi')\r\n const [response, setResponse] = useState({});\r\n const [errors, setErrors] = useState([]);\r\n const [status, setStatus] = useState('ready');\r\n const [request, setRequest] = useState(null);\r\n\r\n useEffect(() => {\r\n if (!request) return;\r\n\r\n //console.log('fetch now')\r\n setResponse(null);\r\n setErrors([]);\r\n setStatus('ready');\r\n\r\n const fetchData = async () => {\r\n setStatus('pending');\r\n try {\r\n //console.log(request);\r\n const options = request.options || {}\r\n siteConfig.apiNetJwt && await siteConfig.apiNetJwt(options);\r\n\r\n const res = await fetch(request.url, options);\r\n //console.log(res);\r\n\r\n if (!res.ok) {\r\n try {\r\n const json = await res.json();\r\n console.log(json);\r\n\r\n if (json.message) {\r\n setErrors([json.message]);\r\n setStatus('error')\r\n return;\r\n }\r\n } catch (e) { }\r\n\r\n const statusText = res.status === 401 ? 'Permission denied. Please login first.' : res.statusText\r\n setErrors(['Error - [' + res.status + ']' + (statusText && (' - ' + statusText))]);\r\n setStatus('error')\r\n return;\r\n }\r\n\r\n //const json = await res.json();\r\n const text = await res.text();\r\n const json = text && text.length ? JSON.parse(text) : null;\r\n //console.log(json);\r\n\r\n // check if ajax result from c#\r\n if (json && json.errors && json.errors.length > 0) {\r\n setErrors(utils.form.getErrors(json));\r\n setStatus('error')\r\n return;\r\n }\r\n\r\n setResponse(json);\r\n setStatus('done')\r\n } catch (err) {\r\n //console.log(error, error.toString(), typeof error, JSON.stringify(error))\r\n setErrors([err.toString()]);\r\n setStatus('error')\r\n }\r\n };\r\n fetchData();\r\n }, [request]);\r\n\r\n const containsErrorMessage = (msg) => {\r\n const finding = (msg || '').toLowerCase()\r\n return errors.some(x => (x || '').toLowerCase().indexOf(finding) >= 0)\r\n }\r\n\r\n //return [ response, error, status, (...args) => setRequest(fn(...args)) ];\r\n return {\r\n request: request,\r\n response: response,\r\n errors: errors,\r\n status: status,\r\n hasErrors: () => status === 'error',\r\n containsErrorMessage: containsErrorMessage,\r\n addErrors: (errs) => {\r\n setErrors(...errors, ...errs)\r\n setStatus('error')\r\n },\r\n done: () => status === 'done',\r\n send: (...args) => { setStatus('ready'); setRequest(fn(...args)) },\r\n sendRaw: (httpOptionFn, ...args) => { setStatus('ready'); setRequest(httpOptionFn(...args)) },\r\n setResult: (json) => { setResponse(json); setStatus('done') },\r\n reset: () => {\r\n setStatus('ready');\r\n setErrors([]);\r\n }\r\n };\r\n}\r\n\r\nexport function usePost() {\r\n const formDataFn = (url, data, options = {}) =>\r\n ({\r\n url: url,\r\n options: {\r\n ...options,\r\n method: 'POST',\r\n body: data // FormData\r\n }\r\n });\r\n const post = useApi((url, data, options = {}) =>\r\n ({\r\n url: url,\r\n options: {\r\n ...options,\r\n method: 'POST',\r\n headers: { 'Content-Type': 'application/json' },\r\n body: JSON.stringify(data)\r\n }\r\n })\r\n );\r\n return {\r\n ...post,\r\n loading: () => post.status === 'ready' || post.status === 'pending',\r\n sending: () => post.status === 'pending',\r\n sendFormData: (...args) => post.sendRaw(formDataFn, ...args)\r\n }\r\n}\r\n\r\nexport function useGet() {\r\n const get = useApi((url, options = {}) =>\r\n ({\r\n url: url,\r\n options: {\r\n ...options,\r\n method: 'GET'\r\n }\r\n })\r\n );\r\n return {\r\n ...get,\r\n loading: () => get.status === 'ready' || get.status === 'pending'\r\n }\r\n}\r\n\r\n//https://medium.com/@jaryd_34198/seamless-api-requests-with-react-hooks-part-2-3ab42ba6ad5c","import React from 'react';\r\nimport env from '../../env';\r\n\r\nexport function MediaQueryStatus(props) {\r\n return (\r\n
\r\n \r\n
\r\n );\r\n}\r\n","import React from 'react';\r\nimport { Helmet } from 'react-helmet-async';\r\n\r\nexport function MetaTag({ data: seoData }) {\r\n //console.log(seoData)\r\n const data = Object.assign({}, {\r\n title: ''\r\n }, seoData)\r\n\r\n return (<>\r\n \r\n \r\n \r\n {canPlay && playerSize && }\r\n {canPlay && playerStatus === 'loaded' &&
\r\n \r\n {muted?
}\r\n \n \n {slides}\n \n
\n );\n}","import React from 'react';\nimport cmsUtils from 'cms/utils/cmsUtils';\nimport utils from 'utils';\nimport { SiteLink } from 'components';\n\nexport function BannerItem(props) {\n const item = props.item;\n const cmsOption = props.cmsOption || {};\n\n //console.log('item', item);\n\n const cssClass = utils.classNames('cms_item', 'banner-item', 'bannerSize', item.cssClass || item.anchorName || '');\n const bgUrl = utils.site.resourcePath(cmsUtils.payload(item, 'ImageUrl'));\n\n const captionTitle = cmsUtils.payload(item, 'CaptionTitle2') || cmsUtils.payload(item, 'CaptionTitle');\n const linkUrl = cmsUtils.payload(item, 'LinkUrl2') || cmsUtils.payload(item, 'LinkUrl');\n const captionbutton = cmsUtils.payload(item, 'CaptionButton');\n\n // const titlePanel = captionTitle ? (\n // linkUrl ? ( {captionbutton}
: null)\n\n const titlePanel = captionTitle ? () : (captionbutton ? {captionbutton}
: null);\n\n return (\n linkUrl ? (\n \n {titlePanel &&
\n {titlePanel}
}\n \n {titlePanel &&
)\n // {titlePanel}
}\n \n // {titlePanel &&
\n );\n \n}","import React from \"react\";\nimport cmsUtils from \"cms/utils/cmsUtils\";\nimport { Item } from \"cms/items/item\";\nimport utils from \"utils\";\n\nexport function Panel(props) {\n const item = props.item;\n const subItems = item.items || [];\n const cmsOption = props.cmsOption || {};\n\n //console.log('item', item, subItems);\n\n const bgColor = cmsUtils.payload(item, \"BgColor\");\n //const textColorTheme = cmsUtils.payload(item, 'TextColorTheme');\n const imageUrl = cmsUtils.payload(item, \"ImageUrl\");\n const backgroundTile = cmsUtils.payload(item, \"BackgroundTile\");\n const bgTheme = cmsUtils.payload(item, \"TextColorTheme\") || \"white\";\n //console.log(bgTheme)\n\n let bgUrl = null;\n if (imageUrl) bgUrl = utils.site.resourcePath(imageUrl);\n else if (backgroundTile)\n bgUrl = utils.site.resourcePath(\n `/dist/transparent-textures/textures/${backgroundTile}`\n );\n\n const cssClass = utils.classNames(\n \"cms_item\",\n \"contentPanel\",\n \"contentPanel--\" + bgTheme,\n item.cssClass || item.anchorName || \"\"\n );\n\n const subItemsElts = subItems.map((subItem, index) => (\n {titlePanel}
}\n // {subItemsElts}
\n \n );\n}\n","import React, { useLayoutEffect, useRef } from 'react';\nimport cmsUtils from 'cms/utils/cmsUtils';\nimport utils from 'utils';\nimport { useRouter } from 'components';\nimport { handleElementLink } from 'components';\nimport env from '../../../env';\nimport { useStore } from \"store/storeProvider\";\n\nexport function Html(props) {\n const ver = env.ver;\n const item = props.item;\n //const subItems = item.items || [];\n const cmsOption = props.cmsOption || {};\n const { history } = useRouter();\n const { dispatch } = useStore();\n //console.log('item', item, cmsOption);\n\n //const content = cmsUtils.payload(item, 'Content');\n const year = (new Date()).getFullYear();\n let content = cmsOption.isCmsEdit ?\n cmsUtils.payload(item, 'Content') :\n cmsUtils.payload(item, 'Content')\n .replace(/__year__/g, year)\n .replace(\"__version__\", \" PWA \" + ver + \"\");\n\n const cssClass = utils.classNames('cms_item', 'htmlPanel', cmsOption.isCmsEdit && 'html', item.cssClass || item.anchorName || '');\n //let itemElt = ();\n\n function handleClick(e) {\n\n let target = \"\";\n let hrefType = \"\";\n\n if (e.target.closest('a')) {\n target = e.target.closest('a').getAttribute('target');\n hrefType = e.target.closest('a').getAttribute('href');\n }\n\n //const processed = handleElementLink(e.target);\n const processed = (target === \"_blank\" || hrefType.includes('tel:') ? handleElementLink(e.target, null) : handleElementLink(e.target));\n if (processed.handled) {\n e.preventDefault();\n e.stopPropagation();\n } else if (processed.linkInfo && processed.linkInfo.type === 'internal') { \n e.preventDefault();\n e.stopPropagation();\n history.push(processed.linkInfo.url)\n }\n // else {\n // e.preventDefault();\n // e.stopPropagation();\n // }\n\n if(window.location.href.includes('/guide') && hrefType === '#contact'){\n e.preventDefault();\n e.stopPropagation();\n dispatch({type:'SET_STATE', payload : {enquiryType : \"orderCaravanCampingGuide\" }});\n }\n\n }\n\n const htmlBlock = useRef(null);\n // function iframeSizer() {\n // //console.log('iframesizer')\n // let iframesContainer = htmlBlock.current.querySelectorAll('iframe.youtube, .ytvideo iframe');\n // //console.log('iframesizer', iframesContainer)\n // if (iframesContainer && iframesContainer.length) {\n // iframesContainer.forEach(element => {\n // let height = (element.parentElement.offsetWidth * 9) / 16\n // //console.log(height, element.parentElement.offsetWidth)\n // element.style.height = height + 'px';\n // });\n // }\n // }\n\n\n useLayoutEffect(() => {\n const buttons = htmlBlock.current.querySelectorAll('.button');\n for (let i = 0; buttons && i < buttons.length; i++) {\n restructureButton(buttons[i])\n }\n\n // iframeSizer();\n // window.addEventListener('resize', iframeSizer)\n // return (): void => {\n // window.removeEventListener('resize', iframeSizer)\n // }\n\n }, [])\n\n return (\n handleClick(e)}>
\n )\n}\n\nfunction restructureButton(el) {\n if (!el.querySelector('span')) {\n const span = document.createElement('span');\n span.innerHTML = el.innerHTML;\n el.innerHTML = '';\n el.appendChild(span);\n }\n}","import React from 'react';\nimport { Item } from 'cms/items/item';\n\nexport function TestimonialPanel(props) {\n const item = props.item;\n const subItems = item.items || [];\n const cmsOption = props.cmsOption || {};\n\n //console.log('item', item, subItems);\n\n let itemElt = ({item.itemTypeCode}
);\n \n const subItemsElts = subItems.map((subItem, index) =>\n \n {itemElt}\n {subItemsElts}\n
\n );\n}\n","import React from 'react';\nimport cmsUtils from 'cms/utils/cmsUtils';\nimport { Item } from 'cms/items/item';\n\nexport function TestimonialItem(props) {\n const item = props.item;\n const subItems = item.items || [];\n const cmsOption = props.cmsOption || {};\n\n //console.log('item', item, subItems);\n\n //const imageUrl = cmsUtils.payload(item, 'ImageUrl');\n const title = cmsUtils.payload(item, 'Title');\n //const desc = cmsUtils.payload(item, 'Desc');\n const bottomText = cmsUtils.payload(item, 'BottomText');\n //const ratingStar = cmsUtils.payload(item, 'RatingStar');\n //const alt = cmsUtils.payload(item, 'Alt');\n\n let itemElt = ({item.itemTypeCode} {title} {bottomText}
);\n \n const subItemsElts = subItems.map((subItem, index) =>\n \n {itemElt}\n {subItemsElts}\n
\n );\n}\n\n","import React from 'react';\nimport cmsUtils from 'cms/utils/cmsUtils';\nimport utils from 'utils';\n\nexport function ImagePanel(props) {\n const item = props.item;\n const cmsOption = props.cmsOption || {};\n\n //console.log('item', item);\n const heightSet = cmsUtils.payload(item, 'HeightSet') || 'standard';\n \n const cssClass = utils.classNames('cms_item', 'imagePanel', 'parallax', `bannerSize--${heightSet}`, item.cssClass || item.anchorName || '');\n const bgUrl = utils.site.resourcePath(cmsUtils.payload(item, 'ImageUrl'));\n\n return (\n \n
\n );\n}","import { css } from '@emotion/core'\nimport { mq } from 'cssInJs'\n\nexport default {\n \n atdwTile : css(mq({\n flexGrow: '1',\n flexShrink: '0',\n flexBasis: ['260px', '260px', '334px', '299px', '267px'],\n maxWidth: ['100%', '100%', '334px', '299px', '267px'],\n margin: '10px 5px',\n backgroundColor : '#ebebeb',\n '& a' : {\n textDecoration : 'none',\n color : '#252525'\n },\n 'hr' : {\n height: '2px',\n border: '0px',\n backgroundImage: 'linear-gradient(90deg,#fe3a43,transparent)'\n }\n })),\n bg : css({\n paddingTop: '60%',\n backgroundSize: 'cover',\n backgroundPosition: 'center'\n }),\n town : css({\n padding : '0rem 0.5rem',\n backgroundColor : '#fe3a43',\n fontWeight : '700',\n color:'white'\n }),\n title : css({\n lineHeight:'1',\n fontWeight:'700',\n fontSize:'0.9rem',\n marginTop: '0.1rem'\n }),\n descContainer : css({\n padding : '0.2rem 0.5rem',\n paddingBottom : '0.5em',\n '& hr' :{\n margin : '0.3rem 0rem'\n }\n }),\n desc : css({\n fontSize : '0.8rem'\n }),\n shotDesc : css({\n fontSize : '0.8rem',\n marginTop: '0.2rem',\n textOverflow: 'ellipsis',\n display: '-webkit-box',\n WebkitLineClamp: '3',\n WebkitBoxOrient: 'vertical',\n overflow: 'hidden',\n })\n}","/** @jsx jsx */\nimport { jsx } from '@emotion/core';\nimport cmsUtils from 'cms/utils/cmsUtils';\nimport utils from 'utils';\nimport { SiteLink } from 'components';\nimport style from './style';\n\nexport function PageTiles(props) {\n const item = props.item;\n const cmsOption = props.cmsOption || {};\n \n const tileType = cmsUtils.payload(item, 'TileType') || 'main'; //none_atdw\n //console.log('item', item);\n const pages = getPages(cmsUtils.payload(item, 'PageObjects'))\n //console.log(pages);\n const pageTileElts = pages.map((page, index) =>\n\n tileType === 'none_atdw' ? \n {pageTileElts}\n
\n );\n}\n\nfunction getPages(pagesSerialized) {\n if (pagesSerialized) {\n return JSON.parse(pagesSerialized);\n }\n return [];\n}\n\nfunction Tile(props) {\n const page = props.page;\n const imageUrl = utils.site.resourcePath(page.imageUrl);\n const disableLink = props.disableLink;\n return (\n \n \n \n \n
\n )\n}\n\nfunction TileNoneAtdw(props) {\n const page = props.page;\n //console.log(\"page\", page);\n const imageUrl = utils.site.resourcePath(page.imageUrl);\n const disableLink = props.disableLink;\n return (\n \n
\n
\n \n
\n {page.pageTitle}\n
\n {/* \n {page.tileDesc || page.description}\n
*/}\n \n \n \n \n
\n )\n}","import React from 'react';\nimport cmsUtils from 'cms/utils/cmsUtils';\nimport utils from 'utils';\nimport { SiteLink } from 'components';\n\nexport function SingleBanner(props) {\n const item = props.item;\n const cmsOption = props.cmsOption || {};\n\n //console.log('item', item);\n const heightSet = cmsUtils.payload(item, 'HeightSet') || 'standard';\n\n const cssClass = utils.classNames('cms_item', 'single-banner', 'banner-item', `bannerSize--${heightSet}`, item.cssClass || item.anchorName || '');\n const bgUrl = utils.site.resourcePath(cmsUtils.payload(item, 'ImageUrl'));\n\n const captionTitle = cmsUtils.payload(item, 'CaptionTitle2') || cmsUtils.payload(item, 'CaptionTitle');\n const linkUrl = cmsUtils.payload(item, 'LinkUrl2') || cmsUtils.payload(item, 'LinkUrl');\n\n const titlePanel = captionTitle ? (\n linkUrl ? (\n {page.tileButtonText || \"SA PARK\"}\n
\n \n
\n
\n \n {page.pageTitle}\n
\n \n
\n {page.tileDesc || page.description}\n
\n \n {titlePanel &&
\n );\n\n\n}\n","export function findControl(controlNameOrIndex, root) {\r\n if (typeof controlNameOrIndex === 'number' && root && root.controls.length > controlNameOrIndex) return root.controls[controlNameOrIndex];\r\n return findControlTraverse(controlNameOrIndex, root);\r\n}\r\n\r\nfunction findControlTraverse(controlName, control) {\r\n if (!control) return null;\r\n if (control.name === controlName) return control;\r\n if (control.controls && control.controls.length > 0) {\r\n for (let i = 0; i < control.controls.length; i++) {\r\n const found = findControlTraverse(controlName, control.controls[i]);\r\n if (found) {\r\n return found;\r\n }\r\n }\r\n }\r\n return null;\r\n}\r\n\r\nexport function findControlById(id, root) {\r\n return findControlByIdTraverse(id, root);\r\n}\r\n\r\nfunction findControlByIdTraverse(id, control) {\r\n if (!control) return null;\r\n if (control.id === id) return control;\r\n if (control.controls && control.controls.length > 0) {\r\n for (let i = 0; i < control.controls.length; i++) {\r\n const found = findControlByIdTraverse(id, control.controls[i]);\r\n if (found) {\r\n return found;\r\n }\r\n }\r\n }\r\n return null;\r\n}\r\n\r\nexport function getValue(root) {\r\n //console.log(root)\r\n return getValueTraverse(root);\r\n}\r\n\r\nconst helperFns = {\r\n getValueTraverse: getValueTraverse,\r\n getFilesTraverse: getFilesTraverse\r\n}\r\n\r\nfunction getKeyValueTraverse(control) {\r\n let keyValue = {};\r\n keyValue[control.name] = getValueTraverse(control);\r\n return keyValue\r\n}\r\n\r\nfunction getValueTraverse(control) {\r\n //console.log(control);\r\n if (control.controlType === 'control') {\r\n if (control.customValueFn)\r\n return control.customValueFn(control, helperFns);\r\n\r\n return control.value;\r\n } else if (control.controlType === 'group') {\r\n if (control.customValueFn)\r\n return control.customValueFn(control, helperFns);\r\n\r\n let value = {};\r\n for (let i = 0; i < control.controls.length; i++) {\r\n value = { ...value, ...getKeyValueTraverse(control.controls[i]) };\r\n }\r\n return value;\r\n } else if (control.controlType === 'array') {\r\n if (control.customValueFn)\r\n return control.customValueFn(control, helperFns);\r\n\r\n const array = [];\r\n for (let i = 0; i < control.controls.length; i++) {\r\n array.push(getValueTraverse(control.controls[i]))\r\n }\r\n return array;\r\n }\r\n return null;\r\n}\r\n\r\nexport function getFiles(root) {\r\n //console.log(root)\r\n return getFilesTraverse(root);\r\n}\r\n\r\nfunction getFilesTraverse(control) {\r\n if (control.controlType === 'control') {\r\n return control.files ? [{ name: control.name, files: control.files }] : [];\r\n } else if (control.controlType === 'group') {\r\n let files = [];\r\n for (let i = 0; i < control.controls.length; i++) {\r\n files.push(...getFilesTraverse(control.controls[i]));\r\n }\r\n return files;\r\n } else if (control.controlType === 'array') {\r\n let files = [];\r\n for (let i = 0; i < control.controls.length; i++) {\r\n files.push(...getFilesTraverse(control.controls[i]));\r\n }\r\n return files;\r\n }\r\n return [];\r\n}","//import uuid from 'uuid/v4';\r\nimport shortid from 'shortid';\r\nimport * as formModelHelper from './formModelHelper';\r\n\r\n//#region helpers\r\nfunction findIndexById(id) {\r\n for (let i = 0; i < this.controls.length; i++) {\r\n if (this.controls[i].id === id) return i;\r\n }\r\n return -1;\r\n}\r\n//#endregion\r\n\r\nconst group = (controls) => {\r\n const controlArray = [];\r\n //console.log('group', controls, typeof controls);\r\n if (controls && typeof controls === 'object') {\r\n Object.keys(controls).forEach(key => {\r\n controlArray.push(abstractControl(key, controls[key]))\r\n })\r\n }\r\n\r\n const ctrl = {\r\n controlType: 'group',\r\n id: shortid(),\r\n controls: controlArray,\r\n find: (name) => controlArray.find((x) => x.name === name),\r\n customValueFn: null, // function\r\n disableValidators: false\r\n }\r\n ctrl.getValue = () => formModelHelper.getValue(ctrl)\r\n ctrl.controls.forEach(x => x.parent = ctrl)\r\n\r\n return ctrl\r\n}\r\n\r\nconst array = (controls) => {\r\n //console.log('array', controls);\r\n const ctrl = {\r\n controlType: 'array',\r\n id: shortid(),\r\n controls: controls,\r\n findIndexById: findIndexById\r\n }\r\n ctrl.getValue = () => formModelHelper.getValue(ctrl)\r\n ctrl.controls.forEach(x => x.parent = ctrl)\r\n\r\n return ctrl\r\n}\r\n\r\nconst abstractControl = (name, controlObject) => {\r\n //console.log('abstractControl', name, controlObject);\r\n if (!controlObject) return null;\r\n // array or group\r\n if (controlObject.controlType) {\r\n controlObject.name = name;\r\n return controlObject;\r\n } else {\r\n return control(name, controlObject)\r\n }\r\n}\r\n\r\nconst control = (name, [value, validators, controlOptions]) => {\r\n //const { label, type, options, style } = controlOptions || {};\r\n //console.log(value, validators, label, type, options)\r\n return {...{\r\n controlType: 'control',\r\n id: shortid(),\r\n name: name,\r\n value: value,\r\n validators: validators || [],\r\n touched: false,\r\n incomplete: false,\r\n findValidator: (type) => (validators || []).find((x) => x.type === type),\r\n // label: label,\r\n // type: type,\r\n // options: options,\r\n // style: style\r\n }, ...controlOptions};\r\n}\r\n\r\nexport default { group, array }","import utils from '../../utils';\r\n\r\nexport function hasRequiredValidator(control) {\r\n if (!control) return false;\r\n return !!control.findValidator('required')\r\n}\r\n\r\nexport function getNameForValidator(label, name) {\r\n return utils.text.toFieldName(label || name);\r\n}\r\n\r\nexport function getValidatorOptions(params) {\r\n const defaultOpt = { continueToValidate: false }\r\n return params ? { ...defaultOpt, ...params } : defaultOpt;\r\n}\r\n\r\nexport function createValidator(type, message, opt, validate) {\r\n const validator =\r\n {\r\n type: type,\r\n disabled: false,\r\n ...getValidatorOptions(opt),\r\n message: message,\r\n validate: validate\r\n }\r\n return validator;\r\n}","import { createValidator, getNameForValidator } from '../validatorHelper';\r\n\r\nexport function Required(message = null, opt = null) {\r\n return createValidator('required', message, opt, function(control, e, validateOpt) {\r\n if (validateOpt.triggeredByChange && control.incomplete) return null;\r\n return isEmpty(control.value) ? (message || (getNameForValidator(control.label, control.name) + ' is required.')) : null\r\n })\r\n}\r\n\r\nfunction isEmpty(val) {\r\n if (Array.isArray(val))\r\n return val.length === 0;\r\n return !val && val !== 0;\r\n}\r\n","import { createValidator, getNameForValidator } from '../validatorHelper';\r\n\r\nexport function Email(message = null, opt = null) {\r\n return createValidator('email', message, opt, function(control, e, validateOpt) {\r\n if (validateOpt.triggeredByChange && control.incomplete) return null;\r\n // only validate for blur keydown tab\r\n if (e && e.type === 'change') return null;\r\n return !isEmpty(control.value) && !isValidEmail(control.value) ? (message || (getNameForValidator(control.label, control.name) + ' - Invalid email.')) : null\r\n })\r\n}\r\n\r\n\r\nexport const isValidEmail = mail => {\r\n const regex = /^(([^<>()[\\]\\\\.,;:\\s@\"]+(\\.[^<>()[\\]\\\\.,;:\\s@\"]+)*)|(\".+\"))@((\\[[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}])|(([a-zA-Z\\-0-9]+\\.)+[a-zA-Z]{2,}))$/;\r\n return regex.test(mail);\r\n}\r\n\r\nfunction isEmpty(val) {\r\n if (Array.isArray(val))\r\n return val.length === 0;\r\n return !val && val !== 0;\r\n}\r\n","import { createValidator, getNameForValidator } from '../validatorHelper';\r\nimport utils from '../../../utils';\r\n\r\nexport function ValidateDate(message = null, opt = null) {\r\n return createValidator('date', message, opt, function (control, e, validateOpt) {\r\n if (validateOpt.triggeredByChange && control.incomplete) return null;\r\n return !isDate(control.value) ? message || getNameForValidator(control.label, control.name) + ' is invalid.' : null;\r\n });\r\n}\r\n\r\nexport function PastDate(message = null, opt = null) {\r\n return createValidator('past-date', message, opt, function (control, e, validateOpt) {\r\n if (validateOpt.triggeredByChange && control.incomplete) return null;\r\n return !isPast(control.value) ? message || getNameForValidator(control.label, control.name) + ' is invalid.' : null;\r\n });\r\n}\r\n\r\nexport function PastDateNullAllowed(message = null, opt = null) {\r\n return createValidator('past-date', message, opt, function (control, e, validateOpt) {\r\n if (validateOpt.triggeredByChange && control.incomplete) return null;\r\n return control.value && !isPast(control.value) ? message || getNameForValidator(control.label, control.name) + ' is invalid.' : null;\r\n });\r\n}\r\n\r\nfunction isDate(val) {\r\n if (val) {\r\n const date = utils.date.toDate(val);\r\n return !!date;\r\n }\r\n return false;\r\n}\r\n\r\nfunction isPast(val) {\r\n if (val) {\r\n const date = utils.date.toDate(val);\r\n //console.log(date, typeof date)\r\n if (date) {\r\n const now = new Date();\r\n return date.getTime() < now.getTime();\r\n }\r\n }\r\n return false;\r\n}\r\n","import { createValidator, getNameForValidator } from '../validatorHelper';\r\n\r\nexport function Length(message = null, opt = null) {\r\n return createValidator('email', message, opt, function(control, e, validateOpt, validator) {\r\n if (validateOpt.triggeredByChange && control.incomplete) return null;\r\n return !isValidLength(control.value, validator) ? (message || (getNameForValidator(control.label, control.name) + ' - Invalid length.')) : null\r\n })\r\n}\r\n\r\n\r\nexport const isValidLength = (text, validator) => {\r\n const length = (text || '').length;\r\n if (validator.min && length < validator.min) return false;\r\n if (validator.max && length > validator.max) return false;\r\n return true;\r\n}\r\n","import { Required } from './validators/required';\r\nimport { Email } from './validators/email';\r\nimport { ValidateDate, PastDate, PastDateNullAllowed } from './validators/date';\r\nimport { Length } from './validators/length';\r\n\r\nconst validateControl = (control, e, validateOpt) => {\r\n const errors = [];\r\n const validators = control.validators || [];\r\n for (let i = 0; i < validators.length; i++) {\r\n const validator = validators[i];\r\n if (!validator.disabled) {\r\n const error = validator.validate && validator.validate(control, e, validateOpt, validator);\r\n if (error) {\r\n errors.push(error);\r\n //console.log(error, control, validator, e)\r\n\r\n if (!validator.continueToValidate) break;\r\n }\r\n }\r\n }\r\n control.errors = errors;\r\n return errors;\r\n};\r\n\r\nexport default {\r\n Required,\r\n Email,\r\n Date: ValidateDate,\r\n PastDate,\r\n PastDateNullAllowed,\r\n Length,\r\n validateControl,\r\n};\r\n","import React from 'react';\r\n\r\nconst ValidationAlert = ({ errors }) => {\r\n if (!errors || errors.length === 0) return null;\r\n return ') }}>\r\n}\r\n\r\nexport default ValidationAlert;","import utils from '../../utils';\r\nimport React from 'react';\r\nimport { hasRequiredValidator } from './validatorHelper';\r\n\r\nexport function getLabel(control, formOption) {\r\n //console.log(label, label == null, label === null, name, label || name)\r\n const { label, name } = control\r\n const requiredMark = hasRequiredValidator(control) && (formOption.requiredMark || '*')\r\n if (label === null) return \"\";\r\n return <>\r\n \r\n {requiredMark && {requiredMark}}\r\n ;\r\n}\r\n\r\nexport function getLabelAsString(control, formOption) {\r\n //console.log(label, label == null, label === null, name, label || name)\r\n const { label, name } = control\r\n const requiredMark = hasRequiredValidator(control) && (formOption.requiredMark || '*')\r\n if (label === null) return \"\";\r\n \r\n return (label || utils.text.toFieldName(name)) + (requiredMark ? requiredMark : '');\r\n}","import * as React from 'react';\r\nimport ValidationAlert from '../components/ValidationAlert';\r\nimport utils from '../../../utils';\r\nimport { getLabel, getLabelAsString } from '../formRenderHelper';\r\n\r\nfunction TextInput({ control, handleChange, formOption }) {\r\n const { name, label, type, value, errors, style, helpText, attrs } = control;\r\n //const { template = 'bootstrap', usePlaceholder = false } = formOption;\r\n const fieldId = utils.random.shortId();\r\n const { usePlaceholder = false } = formOption;\r\n const fieldLabel = getLabel(control, formOption);\r\n //console.log(control, formOption)\r\n const placeHolder = usePlaceholder ? getLabelAsString(control, formOption) : null;\r\n let valueStr = value === 0 ? 0 : (value || \"\");\r\n if (type === 'date' && value) {\r\n valueStr = utils.date.formatYYYYMMDD(value);\r\n }\r\n\r\n let prependText = null;\r\n if (style && style.prependText) {\r\n prependText = style.prependText\r\n }\r\n //console.log(name, !!(style && style.autoFocus))\r\n //const autoFocus = !!(style && style.autoFocus)\r\n\r\n function keyDown(e) {\r\n //console.log(e.key)\r\n if (e.key === \"Enter\" || e.key === 'Tab') {\r\n handleChange(e, control)\r\n }\r\n }\r\n function changed(e) {\r\n //console.log('changed', name, e.target.value)\r\n handleChange(e, control)\r\n }\r\n function blur(e) {\r\n //console.log('blur', name, e.target.value)\r\n handleChange(e, control)\r\n }\r\n\r\n // function focus(e) {\r\n // console.log('focus', name, e.target.value)\r\n // }\r\n\r\n return (\r\n {titlePanel}
}\n \r\n {!usePlaceholder && fieldLabel && }\r\n
\r\n )\r\n}\r\n\r\nexport default TextInput;","import React from 'react';\r\nimport ValidationAlert from '../components/ValidationAlert';\r\nimport utils from '../../../utils';\r\nimport { getLabel } from '../formRenderHelper';\r\n\r\nfunction RadioListInput({ control, handleChange, formOption }) {\r\n const { name, label, value, errors, style, options, helpText, attrs } = control;\r\n const fieldId = utils.random.shortId();\r\n const fieldLabel = getLabel(control, formOption);\r\n return (\r\n \r\n {prependText &&
\r\n {helpText && }\r\n \r\n
\r\n }\r\n\r\n handleChange(e, control)} \r\n // onBlur={(e) => handleChange(e, control, true)}\r\n onChange={changed}\r\n onKeyDown={keyDown}\r\n onBlur={blur}\r\n autoComplete=\"new-password\"\r\n //onFocus={focus}\r\n //autoFocus={autoFocus}\r\n placeholder={placeHolder}\r\n className={\"form-control\" + (errors && errors.length > 0 ? ' is-invalid' : '')} {...attrs} />\r\n {prependText}
\r\n \r\n {fieldLabel && }\r\n
\r\n )\r\n}\r\n\r\nfunction checked(value, optionValue) {\r\n if (optionValue === null || typeof optionValue === 'undefined') return false;\r\n return value === optionValue;\r\n}\r\n\r\nexport default RadioListInput;","import React from 'react';\r\nimport ValidationAlert from '../components/ValidationAlert';\r\nimport utils from '../../../utils';\r\nimport { getLabel } from '../formRenderHelper';\r\n\r\nconst CheckboxListInput = ({ control, handleChange, formOption }) => {\r\n const { name, label, value, errors, style, options, helpText, attrs } = control;\r\n const fieldId = utils.random.shortId();\r\n const fieldLabel = getLabel(control, formOption);\r\n const values = value ? [...value] : [];\r\n return (\r\n \r\n {options && options.map((option, index) =>\r\n
\r\n {helpText && }\r\n \r\n handleChange(e, control)}\r\n value={option.value} id={fieldId + '_' + index} {...attrs} />\r\n \r\n {\r\n (option.helpText && option.helpText !== '') &&\r\n \r\n }\r\n
)}\r\n \r\n {fieldLabel && }\r\n
\r\n )\r\n}\r\n\r\nfunction checked(values, value) {\r\n if (value === null || typeof value === 'undefined') return false;\r\n return values.includes(value);\r\n}\r\n\r\nexport default CheckboxListInput;","import * as React from 'react';\r\nimport ValidationAlert from '../components/ValidationAlert';\r\nimport utils from '../../../utils';\r\nimport { getLabel } from '../formRenderHelper';\r\n\r\nfunction DateSeparateInput({ control, handleChange, formOption }) {\r\n //const { name, label, value, errors, style } = control;\r\n const { name, label, errors, style, helpText, attrs } = control;\r\n const thisYear = (new Date()).getFullYear();\r\n //console.log(name, value)\r\n const [year, setYear] = React.useState('')\r\n const [month, setMonth] = React.useState('')\r\n const [day, setDay] = React.useState('')\r\n\r\n //const { template = 'bootstrap', usePlaceholder = false } = formOption;\r\n const fieldId = utils.random.shortId();\r\n const { usePlaceholder = false } = formOption;\r\n const fieldLabel = getLabel(control, formOption);\r\n //console.log(label, name + '|'+ fieldLabel)\r\n //const placeHolder = usePlaceholder ? fieldLabel : null;\r\n // let valueStr = value === 0 ? 0 : (value || \"\");\r\n // if (type === 'date' && value) {\r\n // valueStr = utils.date.formatYYYYMMDD(value);\r\n // }\r\n\r\n function handleChangeDay(e) {\r\n setDay(e.target.value)\r\n handleChangeInner(year, month, e.target.value)\r\n }\r\n\r\n function handleChangeMonth(e) {\r\n setMonth(e.target.value)\r\n handleChangeInner(year, e.target.value, day)\r\n }\r\n\r\n function handleChangeYear(e) {\r\n setYear(e.target.value)\r\n handleChangeInner(e.target.value, month, day)\r\n }\r\n\r\n function handleChangeInner(yyyy, mm, dd) {\r\n control.incomplete = !(yyyy !== '' && mm !== '' && dd !== '')\r\n const newVal = yyyy + '-' + mm + '-' + dd;\r\n //console.log(newVal)\r\n //mimic event\r\n handleChange({\r\n persist: () => { },\r\n target: { name: name, value: newVal, checked: false }\r\n }, control)\r\n }\r\n\r\n //const monthsFull = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']\r\n const months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']\r\n const selectStyle = { width: 'auto', display: 'inline-block', marginRight: '0.5em' };\r\n\r\n const fromYear = style && style.recentYear ? thisYear : thisYear - 10;\r\n const recentYear = style && style.recentYear ? style.recentYear : 100;\r\n return (\r\n \r\n
\r\n {helpText && }\r\n \r\n {options && options.map((option, index) =>\r\n
\r\n \r\n handleChange(e, control)}\r\n value={option.value} id={fieldId + '_' + index} {...attrs}/>\r\n \r\n
)}\r\n\r\n \r\n {!usePlaceholder && fieldLabel && }\r\n
\r\n )\r\n}\r\n\r\nexport default DateSeparateInput;","import * as React from 'react';\r\nimport ValidationAlert from '../components/ValidationAlert';\r\nimport utils from '../../../utils';\r\nimport { getLabel } from '../formRenderHelper';\r\n\r\nfunction FileInput({ control, handleChange, formOption }) {\r\n const { name, label, type, value, errors, style, helpText, attrs } = control;\r\n //const { template = 'bootstrap', usePlaceholder = false } = formOption;\r\n const fieldId = utils.random.shortId();\r\n const { usePlaceholder = false } = formOption;\r\n const fieldLabel = getLabel(control, formOption);\r\n //console.log(label, control)\r\n const placeHolder = usePlaceholder ? fieldLabel : null;\r\n let valueStr = value === 0 ? 0 : (value || \"\");\r\n if (type === 'date' && value) {\r\n valueStr = utils.date.formatYYYYMMDD(value);\r\n }\r\n return (\r\n \r\n \r\n \r\n \r\n
\r\n {helpText && }\r\n \r\n {!usePlaceholder && fieldLabel && }\r\n
\r\n )\r\n}\r\n\r\nexport default FileInput;","import TextInput from './TextInput';\r\nimport RadioListInput from './RadioListInput';\r\nimport TextareaInput from './TextareaInput';\r\nimport CheckboxInput from './CheckboxInput';\r\nimport CheckboxListInput from './CheckboxListInput';\r\nimport SelectInput from './SelectInput';\r\nimport HiddenInput from './HiddenInput';\r\n//import HtmlInput from './HtmlInput';\r\nimport DateSeparateInput from './DateSeparateInput';\r\nimport FileInput from './FileInput';\r\n\r\nconst Components = { TextInput, RadioListInput, TextareaInput, CheckboxInput, CheckboxListInput, SelectInput, HiddenInput, DateSeparateInput, FileInput };\r\n\r\nconst capitalize = expression => expression.charAt(0).toUpperCase() + expression.slice(1);\r\n\r\nexport function getControl(control, formOption) {\r\n let Component = null;\r\n if (control.type === 'number' || control.type === 'email' || control.type === 'date' || control.type === 'password' || control.type === 'tel')\r\n Component = TextInput;\r\n else if (control.type === \"dob\")\r\n Component = DateSeparateInput;\r\n else\r\n Component = Components[capitalize(control.type || '') + 'Input'];\r\n\r\n return Component;\r\n}\r\n\r\n","import React from 'react';\r\nimport ValidationAlert from '../components/ValidationAlert';\r\nimport utils from '../../../utils';\r\nimport { getLabel, getLabelAsString } from '../formRenderHelper';\r\n\r\nfunction TextareaInput({ control, handleChange, formOption }) {\r\n const { name, label, type, value, errors, style, helpText, attrs } = control;\r\n const fieldId = utils.random.shortId();\r\n const fieldLabel = getLabel(control, formOption);\r\n //const { template = 'bootstrap', usePlaceholder = false } = formOption;\r\n const { usePlaceholder = false } = formOption;\r\n const placeHolder = usePlaceholder ? getLabelAsString(control, formOption) : null;\r\n const valueStr = value === 0 ? 0 : (value || \"\");\r\n\r\n\r\n const textAreaRef = React.useRef(null);\r\n const [textAreaHeight, setTextAreaHeight] = React.useState(\"auto\");\r\n const [parentHeight, setParentHeight] = React.useState(\"auto\");\r\n\r\n React.useEffect(() => {\r\n if (textAreaRef.current) {\r\n const h = textAreaRef.current.scrollHeight > 60? textAreaRef.current.scrollHeight : 60\r\n setParentHeight(`${h}px`);\r\n setTextAreaHeight(`${h}px`);\r\n }\r\n }, [valueStr]);\r\n\r\n function onChangeInternal(e) {\r\n setTextAreaHeight(\"auto\");\r\n if (textAreaRef.current) {\r\n const h = textAreaRef.current.scrollHeight > 60? textAreaRef.current.scrollHeight : 60\r\n setParentHeight(`${h}px`);\r\n }\r\n handleChange(e, control);\r\n }\r\n\r\n return (\r\n \r\n handleChange(e, control)} onBlur={(e) => handleChange(e, control)}\r\n placeholder={placeHolder}\r\n className={\"form-control-file\" + (errors && errors.length > 0 ? ' is-invalid' : '')} {...attrs}/>\r\n
\r\n {helpText && }\r\n \r\n \r\n
\r\n \r\n { valueStr === '' ? 'No File Chosen' : valueStr.replace(/^.*\\\\/, \"\")}\r\n
\r\n \r\n {!usePlaceholder && fieldLabel && }\r\n
\r\n )\r\n}\r\n\r\nexport default TextareaInput;","import React from 'react';\r\nimport ValidationAlert from '../components/ValidationAlert';\r\nimport utils from '../../../utils';\r\nimport { getLabel } from '../formRenderHelper';\r\n\r\nconst CheckboxInput = ({ control, handleChange, formOption }) => {\r\n const { name, label, type, value, errors, style, helpText, attrs } = control;\r\n const fieldId = utils.random.shortId();\r\n const fieldLabel = getLabel(control, formOption);\r\n return (\r\n \r\n \r\n
\r\n {helpText && }\r\n \r\n handleChange(e, control)} \r\n className={\"form-check-input\"} {...attrs}/>\r\n \r\n {helpText && }\r\n
\r\n )\r\n}\r\n\r\nexport default CheckboxInput;","import React from 'react';\r\nimport ValidationAlert from '../components/ValidationAlert';\r\nimport utils from '../../../utils';\r\nimport { getLabel } from '../formRenderHelper';\r\n\r\nfunction SelectInput({ control, handleChange, formOption }) {\r\n const { name, label, type, value, errors, style, options, helpText, attrs } = control;\r\n const fieldId = utils.random.shortId();\r\n const fieldLabel = getLabel(control, formOption);\r\n //console.log(value, typeof value)\r\n return (\r\n \r\n {fieldLabel && }\r\n
\r\n )\r\n}\r\n\r\nexport default SelectInput;\r\n\r\n","import * as React from 'react';\r\nimport utils from '../../../utils';\r\n\r\nfunction TextInput({ control, handleChange, formOption }) {\r\n const { name, value } = control;\r\n const fieldId = utils.random.shortId();\r\n let valueStr = value === 0 ? 0 : (value || \"\");\r\n\r\n\r\n return (\r\n \r\n )\r\n}\r\n\r\nexport default TextInput;","import React from 'react';\r\nimport * as formModelHelper from './formModelHelper';\r\nimport { getControl } from './controls';\r\nimport { getSiteControl } from '../../form';\r\n\r\nexport function renderControlDirect(control, handleChange, formOption) {\r\n if (control === null) return null;\r\n let Component = getSiteControl(control, formOption) || getControl(control, formOption);\r\n if (!Component) return control.value;\r\n return \r\n \r\n
\r\n {helpText && }\r\n \n\n
\n )\n}","import React from 'react';\n// import { Item } from 'cms/items/item';\n// import { SiteLink } from 'shared/link/siteLink';\nimport cmsUtils from 'cms/utils/cmsUtils';\nimport utils from 'utils';\nimport { YoutubeBanner } from 'components';\n//import env from 'env';\n//import Slider from 'modules/slider/slider';\nimport {BannerPanel} from '../bannerPanel/view';\n\nexport function YoutubeBannerPanel(props) {\n const item = props.item;\n const cmsOption = props.cmsOption || {};\n\n //console.log('item', item);\n\n const heightSet = cmsUtils.payload(item, 'HeightSet') || 'standard';\n const videoCode = cmsUtils.payload(item, 'YoutubeCode');\n const playerId = 'ytBanner-' + (item.itemId).substr(0, 8);\n\n const video = {\n heightSet: heightSet,\n videoLinkOrId: videoCode,\n playerId: playerId\n }\n\n //const enableYoutube = env.isProd;\n const canPlayVideo = () => window.innerWidth >= 1200\n\n const cssClass = utils.classNames('cms_item', 'youtubePanel', item.cssClass || item.anchorName || '');\n\n console.log(window.innerWidth, canPlayVideo())\n\n return (\n \n
\n\n \n {canPlayVideo() ?
\n );\n}\n\n// function MobileSlider(props) {\n// const item = props.item;\n// const subItems = item.items || [];\n \n// const slides = subItems.map((subItem, index) =>\n// \n// {slides}\n//
\n// );\n// }\n\n// function SlideItem(props){\n// const item = props.item;\n// const bgUrl = utils.site.resourcePath(cmsUtils.payload(item, 'ImageUrl'));\n\n// return (\n// \n// 
\n//
\n// );\n\n// }","import { css } from '@emotion/core'\n//import { mq } from 'cssInJs'\n\nexport default {\n atdwTiles : css({\n display: 'flex',\n alignItems: 'stretch',\n flexWrap: 'wrap',\n //justifyContent: 'space-between'\n justifyContent: 'start'\n })\n}","import { css } from '@emotion/core'\nimport { mq } from 'cssInJs'\n\nexport default {\n \n atdwTile : css(mq({\n flexGrow: '1',\n flexShrink: '0',\n flexBasis: ['260px', '260px', '334px', '299px', '267px'],\n maxWidth: ['100%', '100%', '334px', '299px', '267px'],\n margin: '10px 5px',\n backgroundColor : '#ebebeb',\n '& a' : {\n textDecoration : 'none',\n color : '#252525'\n },\n 'hr' : {\n height: '2px',\n border: '0px',\n backgroundImage: 'linear-gradient(90deg,#fe3a43,transparent)'\n }\n })),\n bg : css({\n paddingTop: '60%',\n backgroundSize: 'cover',\n backgroundPosition: 'center',\n position:'relative'\n }),\n petIcon : css({\n position:'absolute',\n top:'10px',\n left:'10px',\n width: '50px',\n zIndex:'1'\n }),\n petIconBg : css({\n width: '100%',\n height:'100%',\n position:'absolute',\n top:'0px',\n //backgroundColor:'rgba(0,0,0,0.3)'\n }),\n town : css({\n padding : '0rem 0.5rem',\n backgroundColor : '#fe3a43',\n fontWeight : '700',\n color:'white'\n }),\n title : css({\n lineHeight:'1',\n fontWeight:'700',\n fontSize:'0.9rem',\n marginTop: '0.1rem'\n }),\n descContainer : css({\n padding : '0.2rem 0.5rem',\n paddingBottom : '0.5em',\n '& hr' :{\n margin : '0.3rem 0rem'\n }\n }),\n desc : css({\n fontSize : '0.8rem'\n }),\n shotDesc : css({\n fontSize : '0.8rem',\n marginTop: '0.2rem',\n textOverflow: 'ellipsis',\n display: '-webkit-box',\n WebkitLineClamp: '3',\n WebkitBoxOrient: 'vertical',\n overflow: 'hidden',\n })\n}","//import { css, keyframes } from '@emotion/core'\n//import { variables, mq } from 'cssInJs'\n\nimport { css } from '@emotion/core'\nimport { mq } from 'cssInJs'\n\nexport default {\n atdwSearchOption : css({\n '& .form-group label' : {\n marginBottom : '0px'\n },\n '.form-control:focus' : {\n boxShadow : 'none'\n }\n }),\n search_btn : css(mq({\n //marginTop: ['auto', '17px']\n marginTop: ['auto']\n })),\n date_reset_btn : css({\n marginLeft: '1rem',\n fontSize: '0.8rem',\n padding: '0px 10px',\n //marginBottom: '5px',\n marginTop: '-10px',\n backgroundColor: 'gray',\n borderColor: 'gray',\n borderRadius: '10px'\n }),\n dumyLabel : css({\n color: 'transparent'\n }),\n pet : css({\n marginTop:'2.5rem',\n paddingLeft:'2rem',\n '.form-check-input' : css({\n width: '20px',\n height: '20px',\n marginTop:'0.3rem',\n marginLeft:'-2rem'\n }),\n // '.form-check-label' : css({\n // fontSize:'1.5rem',\n // fontWeight: '700'\n // })\n })\n}","/** @jsx jsx */\nimport { jsx } from '@emotion/core';\nimport style from './style';\n//import utils from 'utils';\nimport { useState } from 'react';\nimport Select from 'react-select';\n\nfunction dateFormat(date){\n var _date = date.getFullYear() + \"-\" +\n (('' + (date.getMonth() + 1)).length < 2 ? (\"0\" + (date.getMonth() + 1)) : (date.getMonth() + 1)) + \"-\" +\n (('' + (date.getDate())).length < 2 ? (\"0\" + (date.getDate())) : (date.getDate()));\n return _date;\n}\n\nfunction dateFormatPlus2(date){\n date.setDate(date.getDate() +2);\n var _date = date.getFullYear() + \"-\" +\n (('' + (date.getMonth() + 1)).length < 2 ? (\"0\" + (date.getMonth() + 1)) : (date.getMonth() + 1)) + \"-\" +\n (('' + (date.getDate())).length < 2 ? (\"0\" + (date.getDate())) : (date.getDate()));\n return _date;\n}\n\nexport function AtdwSearchOption(props){ \n const atdwType = props.atdwType;\n const _petFriendly = (props.petFriendly && props.petFriendly === 'on') ? true : false;\n const hidePetFriendly = (props.petFriendly && props.petFriendly === 'hide') ? true : false;\n\n console.log(\"props.petFriendly\", props.petFriendly);\n console.log(\"hidePetFriendly\", hidePetFriendly);\n\n const numOfAdultsOption = [\n { value: '1', label: '1' },\n { value: '2', label: '2' },\n { value: '3', label: '3' },\n { value: '4', label: '4' },\n { value: '5', label: '5' },\n { value: '6', label: '6' },\n { value: '7', label: '7' },\n { value: '8', label: '8' },\n { value: '9', label: '9' }\n ];\n\n const numOfKidsOption = [\n { value: '0', label: '0' },\n { value: '1', label: '1' },\n { value: '2', label: '2' },\n { value: '3', label: '3' },\n { value: '4', label: '4' },\n { value: '5', label: '5' },\n { value: '6', label: '6' },\n { value: '7', label: '7' },\n { value: '8', label: '8' },\n { value: '9', label: '9' }\n ];\n\n const [searchOptionValue, setSearchOptionValue] = useState({\n checkIn : '',\n checkOut : '',\n numOfAdults : numOfAdultsOption[1],\n numOfKids : numOfKidsOption[0],\n subType : [],\n town : '',\n name : '',\n petFriendly : _petFriendly\n });\n\n const today = new Date();\n const checkInMinDate = dateFormat(today);\n const [checkOutMinDate, setCheckOutMinDate] = useState(dateFormatPlus2(today));\n //const [triggerPetCheck, setTriggerPetCheck] = useState(0);\n const typeOptions = setTypeOptions();\n //console.log(\"1111\", typeOptions.items);\n function setTypeOptions(){\n if(atdwType === 'ACCOMM'){\n return {title : 'Accommodation Type',\n //bookingAble : false,\n bookingAble : true,\n items : [\n // { value: 'APARTMENT', label: 'Apartments' },\n // { value: 'BACKPACKER', label: 'Backpackers and Hostels' },\n // { value: 'BEDBREAKFA', label: 'Bed and Breakfasts' },\n // { value: 'CABCOTTAGE', label: 'Cabins and Cottages' },\n // { value: 'VANCAMP', label: 'Caravan and Camping' },\n // { value: 'FARMSTAY', label: 'Farm Stays' },\n // { value: 'HOLHOUSE', label: 'Holiday Houses' },\n // { value: 'HOTEL', label: 'Hotels' },\n // { value: 'MOTEL', label: 'Motels' },\n // { value: 'CABCOTTAGE', label: 'Cabins and Cottages' },\n // { value: 'RESORT', label: 'Resorts' },\n // { value: 'RETREAT', label: 'Retreats' }\n ]};\n }\n else if(atdwType === 'ATTRACTION'){\n return {title : 'Attraction Type', bookingAble : false,\n items : [\n { value: 'SHOPPING', label: 'Shopping and Markets' },\n { value: 'SPARETREAT', label: 'Spas and Retreats' },\n ]\n }\n }\n else if(atdwType === 'RESTAURANT'){\n return {title : 'Food & Drink Type', bookingAble : false,\n items : [\n { value: 'BAR', label: 'Bar' },\n { value: 'TAKEAWAY', label: 'Takeaway Available' },\n ]\n }\n }\n else if(atdwType === 'EVENT'){\n return {title : 'Event Type', bookingAble : false,\n items : [\n { value: 'EVTBUS', label: 'Business Event' },\n { value: 'EVTFOOD', label: 'Food and Wine' },\n ]\n }\n }\n else if(atdwType === 'HIRE'){\n return {title : 'Hire Type', bookingAble : false,\n items : [\n { value: 'BICYCLE', label: 'Bicycles' },\n { value: 'BOAT', label: 'Boats' },\n ]\n }\n }\n else if(atdwType === 'GENSERVICE'){\n return {title : 'Service Type', bookingAble : false,\n items : [\n { value: 'CARPARK', label: 'Carpark' },\n { value: 'FAMLYFREND', label: 'Family Friendly' },\n ]\n }\n }\n else if(atdwType === 'TOUR'){\n return {title : 'Tour Type', bookingAble : false,\n items : [\n { value: 'AOTOURS', label: 'Adventure and Outdoors Tours' },\n { value: 'AHBTOURS', label: 'Air, Helicopter and Balloon Tours' },\n ]\n }\n }\n else\n {\n return {title : '', bookingAble : false, items : []}\n }\n }\n\n function onSubmit(event){\n event.preventDefault();\n const value = searchOptionValue;\n props.onGetSearchOption(value);\n }\n \n // const onSubmit = useCallback((event) => {\n // console.log(\"absdfdfds\");\n // event.preventDefault();\n // setCount(count + 1);\n // }, [count2]);\n\n function handChange(el){\n const elName = el.target.name;\n const elValue = el.target.value;\n if(elName === \"checkIn\"){ \n const date = new Date(elValue);\n setCheckOutMinDate(dateFormatPlus2(date));\n setSearchOptionValue({...searchOptionValue, [elName] : elValue, \"checkOut\" : dateFormat(date)});\n }\n else if(elName === \"petFriendly\"){\n setSearchOptionValue({...searchOptionValue, petFriendly : el.target.checked});\n //setTriggerPetCheck(triggerPetCheck + 1);\n }\n else{\n setSearchOptionValue({...searchOptionValue, [elName] : elValue});\n }\n }\n\n // useEffect(() => {\n\n // if(triggerPetCheck === 0){\n // return;\n // }\n\n // const value = searchOptionValue;\n // props.onGetSearchOption(value);\n\n // // eslint-disable-next-line\n // }, [triggerPetCheck]);\n\n return(\n \n );\n}","/** @jsx jsx */\nimport { jsx } from \"@emotion/core\";\n//import style from './style';\nimport utils from \"utils\";\nimport { AtdwSearchOption } from \"../searchOption/view\";\nimport { AtdwSearchResult } from \"../searchResult/view\";\nimport cmsUtils from \"cms/utils/cmsUtils\";\nimport { useState, useEffect, useCallback, useContext } from \"react\";\nimport env from \"env\";\nimport { AtdwContext } from \"../index\";\n\nfunction AtdwSearchTitle(props) {\n const type = props.type;\n //console.log(\"type\",type);\n const title = { sTitle: \"\", title: \"\" };\n if (type === \"ACCOMM\") {\n title.sTitle = \"SEARCH & BOOK\";\n title.title = \"ACCOMMODATION\";\n } else if (type === \"ATTRACTION\") {\n title.sTitle = \"SEARCH\";\n title.title = \"ATTRACTIONS\";\n } else if (type === \"DESTINFO\") {\n title.sTitle = \"SEARCH\";\n title.title = \"TOWN\";\n } else if (type === \"RESTAURANT\") {\n title.sTitle = \"SEARCH\";\n title.title = \"RESTAURANT\";\n } else if (type === \"EVENT\") {\n title.sTitle = \"SEARCH\";\n title.title = \"EVENT\";\n } else if (type === \"INFO\") {\n title.sTitle = \"SEARCH\";\n title.title = \"INFO\";\n } else if (type === \"TOUR\") {\n title.sTitle = \"SEARCH\";\n title.title = \"TOUR\";\n } else if (type === \"GENSERVICE\") {\n title.sTitle = \"SEARCH\";\n title.title = \"GENSERVICE\";\n } else if (type === \"JOURNEY\") {\n title.sTitle = \"SEARCH\";\n title.title = \"JOURNEY\";\n }\n\n return (\n \n {title.sTitle} {title.title}\n
\n );\n}\n\nexport function AtdwSearch(props) {\n const item = props.item;\n const cmsOption = props.cmsOption || {};\n const cssClass = utils.classNames(\n \"cms_item\",\n \"atdwSearch\",\n item.cssClass || item.anchorName || \"\"\n );\n const bgColor = cmsUtils.payload(item, \"BgColor\");\n const imageUrl = cmsUtils.payload(item, \"ImageUrl\");\n const backgroundTile = cmsUtils.payload(item, \"BackgroundTile\");\n const petFriendly = cmsUtils.payload(item, \"PetFriendly\") || \"off\";\n const tilesSize = 12;\n const atdwArea = cmsUtils.payload(item, \"ProductArea\") || \"all\";\n const customCategories = cmsUtils.payload(item, \"CustomCategories\") || \"\";\n\n //const atdwArea = \"all\";\n\n let bgUrl = null;\n if (imageUrl) bgUrl = utils.site.resourcePath(imageUrl);\n else if (backgroundTile)\n bgUrl = utils.site.resourcePath(\n `/dist/transparent-textures/textures/${backgroundTile}`\n );\n\n const [atdwState, setAtdwState] = useState({\n atdwType: \"ACCOMM\",\n atdwArea: atdwArea,\n index: 1,\n atdwDataFromDB: [],\n reserveAtdwData: [],\n shuffledAtdwData: [],\n atdwData: [],\n trigger: 0,\n context: useContext(AtdwContext),\n });\n\n //const [atdwSearchText, setAtdwSearchText] = useState(\"Searching for ATDW\");\n const [atdwSearchText, setAtdwSearchText] = useState(\" \");\n\n //TXA\n const [trigger, setTrigger] = useState(0);\n const [checkIn, setCheckIn] = useState(\"\");\n const [checkOut, setCheckOut] = useState(\"\");\n const [numOfAdults, setNumOfAdults] = useState(\"\");\n const [numOfKids, setNumOfKids] = useState(\"\");\n\n //checkIn, checkOut, numOfAdults, numOfKids,\n function searechAtdwFilter({\n petFriendly,\n town,\n name,\n subType,\n atdwDataItem,\n customCategories,\n }) {\n //const _checkIn = checkIn || '';\n //const _checkOut = checkOut || '';\n //const _numOfAdults = numOfAdults || '2';\n //const _numOfKids = numOfKids || '0';\n const _petFriendly = petFriendly || false;\n const _customCategories = customCategories || \"\";\n\n const _town = town || \"\";\n const _name = name || \"\";\n const _subType = subType || [];\n\n const _filteredData = atdwDataItem.filter((data) => {\n let returnResult = false;\n //1\n if (_subType.length > 0) {\n //checkFilterDo = true\n for (var i in data.additionalData.PRODUCTTYPES) {\n returnResult = false;\n if (\n subType\n .toString()\n .includes(data.additionalData.PRODUCTTYPES[i].productTypeId)\n ) {\n returnResult = true;\n } else {\n returnResult = false;\n break;\n }\n }\n } else {\n returnResult = true;\n }\n\n //2\n if (returnResult === true && _town !== \"\" && _town !== null) {\n //checkFilterDo = true\n returnResult = false;\n if (data.town.toLowerCase().includes(_town.toLowerCase())) {\n returnResult = true;\n }\n }\n\n //3\n if (returnResult === true && _name !== \"\" && _name !== null) {\n //checkFilterDo = true\n returnResult = false;\n if (data.productName.toLowerCase().includes(_name.toLowerCase())) {\n returnResult = true;\n }\n }\n\n //4 pet\n if (returnResult === true && _petFriendly === true) {\n //checkFilterDo = true\n returnResult = false;\n const _checkPetFriendly = data.checkPetFriendly || false;\n if (_checkPetFriendly === true) {\n returnResult = true;\n }\n }\n\n //5 customCategories\n if (\n returnResult === true &&\n _customCategories !== null &&\n _customCategories !== \"\"\n ) {\n returnResult = false;\n if (data.customCategories && data.customCategories !== \"\") {\n const _customCategoryArray = _customCategories.split(\",\");\n for (let i in _customCategoryArray) {\n returnResult = false;\n if (\n data.customCategories\n .toLowerCase()\n .includes(_customCategoryArray[i].toLowerCase())\n ) {\n returnResult = true;\n break;\n }\n }\n }\n }\n return returnResult;\n });\n return _filteredData;\n }\n\n function onGetSearchOptionFun(value) {\n const _checkIn = value.checkIn ? value.checkIn : \"\";\n const _checkOut = value.checkOut ? value.checkOut : \"\";\n const _numOfAdults = value.numOfAdults.value\n ? value.numOfAdults.value\n : \"2\";\n const _numOfKids = value.numOfKids.value ? value.numOfKids.value : \"0\";\n const _petFriendly = value.petFriendly ? value.petFriendly : false;\n\n const subType = [];\n for (var i in value.subType) {\n subType.push(value.subType[i].value);\n }\n const town = value.town.trim();\n const name = value.name.trim();\n\n //let checkFilterDo = false\n\n const _filteredData = searechAtdwFilter({\n petFriendly: _petFriendly,\n town: town,\n name: name,\n subType: subType,\n atdwDataItem: atdwState.shuffledAtdwData,\n customCategories: customCategories,\n //checkFilterDo : checkFilterDo\n });\n\n const _data = [];\n\n if (_filteredData.length > 0) {\n for (let x = 0; x < tilesSize; x++) {\n _data.push(_filteredData[x]);\n if (x === _filteredData.length - 1) {\n break;\n }\n }\n }\n\n setAtdwState((pre) => {\n let _new = { ...pre };\n _new.context.setupAtdwTxaCheckInDate(null);\n _new.reserveAtdwData = _filteredData;\n\n if (_checkIn !== \"\") {\n _new.atdwData = [];\n setCheckIn(_checkIn);\n setCheckOut(_checkOut);\n setNumOfAdults(_numOfAdults);\n setNumOfKids(_numOfKids);\n setTrigger(trigger + 1);\n //setAtdwSearchText(\"Searching for ATDW\");\n setAtdwSearchText(\" \");\n _new.context.setupAtdwTxaCheckInDate(_checkIn);\n } else {\n _new.atdwData = _data;\n _new.index = 1;\n _new.context.setupAtdwDataHistory({\n atdwDataFromDB: _new.atdwDataFromDB,\n reserveAtdwData: _new.reserveAtdwData,\n atdwData: _new.atdwData,\n index: _new.index,\n });\n if (_data.length === 0) {\n setAtdwSearchText(\n \"Currently no match, please check in the Regions below to find more Park options for your preferred dates.\"\n );\n } else {\n setAtdwSearchText(\"\");\n }\n }\n return _new;\n });\n }\n\n // const onGetSearchOptionFun = ((value) => {\n\n // const _checkIn = value.checkIn ? value.checkIn : '';\n // const _checkOut = value.checkOut ? value.checkOut : '';\n // const _numOfAdults = value.numOfAdults.value ? value.numOfAdults.value : '2';\n // const _numOfKids = value.numOfKids.value ? value.numOfKids.value : '0';\n // const _petFriendly = value.petFriendly ? value.petFriendly : false;\n\n // const subType = [];\n // for(var i in value.subType){\n // subType.push(value.subType[i].value);\n // }\n // const town = value.town.trim();\n // const name = value.name.trim();\n\n // let checkFilterDo = false\n // const _filteredData = atdwState.atdwDataFromDB.filter((data) => {\n\n // //console.log(\"data\", data);\n\n // let returnResult = false;\n\n // //1\n // if(subType.length > 0){\n // checkFilterDo = true\n // for(var i in data.additionalData.PRODUCTTYPES){\n // returnResult = false;\n // if(subType.toString().includes(data.additionalData.PRODUCTTYPES[i].productTypeId)){\n // returnResult = true;\n // }\n // else{\n // returnResult = false;\n // break;\n // }\n // }\n // }\n // else{\n // returnResult = true;\n // }\n\n // //2\n // if(returnResult === true && (town !== \"\" && town !== null)){\n // checkFilterDo = true\n // returnResult = false;\n // if(data.town.toLowerCase().includes(town.toLowerCase())){\n // returnResult = true;\n // }\n // }\n\n // //3\n // if(returnResult === true && (name !== \"\" && name !== null)){\n // checkFilterDo = true\n // returnResult = false;\n // if(data.productName.toLowerCase().includes(name.toLowerCase())){\n // returnResult = true;\n // }\n // }\n\n // //4 pet\n // if(returnResult === true && (_petFriendly === true)){\n // checkFilterDo = true\n // returnResult = false;\n // const _checkPetFriendly = data.checkPetFriendly || false;\n // if(_checkPetFriendly === true){\n // returnResult = true;\n // }\n // }\n\n // return returnResult;\n // });\n\n // const _data = [];\n\n // if(checkFilterDo){\n // if(_filteredData.length > 0){\n // for(let x = 0; x < tilesSize; x++){\n // _data.push(_filteredData[x]);\n // if(x === (_filteredData.length -1)){\n // break;\n // }\n // }\n // }\n // }\n // else{\n // if(atdwState.shuffledAtdwData.length > 0){\n // for(let x = 0; x < tilesSize; x++){\n // _data.push(atdwState.shuffledAtdwData[x]);\n // if(x === (atdwState.shuffledAtdwData.length -1)){\n // break;\n // }\n // }\n // }\n // }\n\n // setAtdwState(pre => {\n // let _new = {...pre};\n // _new.context.setupAtdwTxaCheckInDate(null);\n\n // if(checkFilterDo){\n // _new.reserveAtdwData = _filteredData;\n // }\n // else{\n // _new.reserveAtdwData = atdwState.shuffledAtdwData;\n // }\n\n // if(_checkIn !== ''){\n // _new.atdwData = [];\n // setCheckIn(_checkIn);\n // setCheckOut(_checkOut);\n // setNumOfAdults(_numOfAdults);\n // setNumOfKids(_numOfKids);\n // setTrigger(trigger + 1);\n // //setAtdwSearchText(\"Searching for ATDW\");\n // setAtdwSearchText(\" \");\n // _new.context.setupAtdwTxaCheckInDate(_checkIn);\n // }\n // else{\n // _new.atdwData = _data;\n // _new.index = 1;\n // _new.context.setupAtdwDataHistory({\n // atdwDataFromDB : _new.atdwDataFromDB,\n // reserveAtdwData : _new.reserveAtdwData,\n // atdwData : _new.atdwData,\n // index : _new.index\n // });\n // if(_data.length === 0){\n // setAtdwSearchText(\"Sorry, there are no available results.\");\n // }\n // else{\n // setAtdwSearchText(\"\");\n // }\n // }\n // return _new;\n // });\n // });\n\n useEffect(() => {\n //console.log(\"useEffect_1\");\n if (atdwState.context.atdwDataHistory2 !== null) {\n setAtdwState((pre) => {\n let _new = { ...pre };\n _new.atdwDataFromDB = atdwState.context.atdwDataHistory.atdwDataFromDB;\n _new.reserveAtdwData =\n atdwState.context.atdwDataHistory.reserveAtdwData;\n _new.atdwData = atdwState.context.atdwDataHistory.atdwData;\n _new.index = atdwState.context.atdwDataHistory.index;\n return _new;\n });\n setTimeout(() => {\n document\n .getElementById(atdwState.context.atdwDataHistory2)\n .scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n atdwState.context.setupAtdwDataHistory2(null);\n atdwState.context.setupAtdwTxaCheckInDate(null);\n }, 500);\n\n return;\n }\n\n const fetchData = async () => {\n const res = await fetch(\n env.apiBase + \"/api/atdw/getproducts/\" + atdwState.atdwArea\n );\n const data = await res.json();\n\n const _data = [];\n\n data.products.forEach((el) => {\n const _attributes = el.additionalData.attributes || [];\n let checkPetFriendly = false;\n for (let _a in _attributes) {\n if (_attributes[_a].attributeId === \"PETALLOW\") {\n checkPetFriendly = true;\n break;\n }\n }\n el.checkPetFriendly = checkPetFriendly;\n });\n\n var shuffled = JSON.parse(JSON.stringify(data.products));\n var currentIndex = shuffled.length,\n temporaryValue,\n randomIndex;\n\n while (0 !== currentIndex) {\n // Pick a remaining element...\n randomIndex = Math.floor(Math.random() * currentIndex);\n currentIndex -= 1;\n\n // And swap it with the current element.\n temporaryValue = shuffled[currentIndex];\n shuffled[currentIndex] = shuffled[randomIndex];\n shuffled[randomIndex] = temporaryValue;\n }\n\n //backup\n // for(var i = 0; i < tilesSize; i++){\n // _data.push(data.products[i]);\n // if(i === (data.products.length -1)){\n // break;\n // }\n // }\n let _filteredData = shuffled;\n\n // if(petFriendly && petFriendly === 'on'){\n // _filteredData = searechAtdwFilter({petFriendly : true, atdwDataItem : _filteredData});\n // }\n\n _filteredData = searechAtdwFilter({\n petFriendly: petFriendly && petFriendly === \"on\" ? true : false,\n customCategories:\n customCategories && customCategories !== \"\" ? customCategories : \"\",\n atdwDataItem: _filteredData,\n });\n\n //shuffled\n if (_filteredData.length > 0) {\n for (var i = 0; i < tilesSize; i++) {\n _data.push(_filteredData[i]);\n if (i === _filteredData.length - 1) {\n break;\n }\n }\n }\n\n setAtdwState((pre) => {\n let _new = { ...pre };\n _new.atdwDataFromDB = data.products;\n _new.reserveAtdwData = _filteredData;\n _new.shuffledAtdwData = shuffled;\n _new.atdwData = _data;\n _new.context.setupAtdwDataHistory({\n atdwDataFromDB: _new.atdwDataFromDB,\n reserveAtdwData: _new.reserveAtdwData,\n atdwData: _new.atdwData,\n index: _new.index,\n });\n return _new;\n });\n\n if (_data.length > 0) {\n setAtdwSearchText(\"\");\n } else {\n setAtdwSearchText(\"Sorry, there are no available results.\");\n }\n };\n fetchData();\n\n // eslint-disable-next-line\n }, [atdwState.atdwType, atdwState.context, atdwState.atdwArea]);\n\n useEffect(() => {\n if (trigger === 0) {\n return;\n }\n\n const r_data = [];\n const _data = [];\n const fetchData = async () => {\n const sendData = {\n checkIn: checkIn,\n checkOut: checkOut,\n adults: numOfAdults,\n kids: numOfKids,\n txaList: [],\n };\n atdwState.reserveAtdwData.forEach((el) => {\n // if(el.additionalData.externalSystems.length > 0){\n // for(var i in el.additionalData.externalSystems){\n // if(el.additionalData.externalSystems[i].externalSystemCode === \"TXA_DEFAULT\"){\n // sendData.txaList.push(el.additionalData.externalSystems[i].externalSystemText);\n // break;\n // }\n // else if(el.additionalData.externalSystems[i].externalSystemCode === \"TXA_MULTI\" && env.MultiTxaCode.includes(el.additionalData.externalSystems[i].externalSystemText)){\n // sendData.txaList.push(el.additionalData.externalSystems[i].externalSystemText);\n // break;\n // }\n // else if(el.additionalData.externalSystems[i].externalSystemCode === \"TXA_CODE\" && env.MultiTxaCode.includes(el.additionalData.externalSystems[i].externalSystemText)){\n // sendData.txaList.push(el.additionalData.externalSystems[i].externalSystemText);\n // break;\n // }\n // }\n // }\n if (el.txaCode && el.txaCode !== \"\") {\n sendData.txaList.push(el.txaCode);\n }\n });\n\n //BelairNatParkCP\n // if(!sendData.txaList.toString().includes(\"BelairNatParkCP\")){\n // sendData.txaList.push(\"BelairNatParkCP\");\n // }\n\n //console.log('aaa', sendData);\n\n const res = await fetch(env.apiBase + \"/api/atdw/gettxaproducts\", {\n method: \"post\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify(sendData),\n });\n const data = await res.json();\n console.log(\"dddd ---- \", data);\n\n let _count = 0;\n for (var i = 0; i < atdwState.reserveAtdwData.length; i++) {\n // for(var n = 0; n < atdwState.reserveAtdwData[i].additionalData.externalSystems.length; n++){\n // if(atdwState.reserveAtdwData[i].additionalData.externalSystems[n].externalSystemCode === \"TXA_DEFAULT\"){\n // //console.log(atdwState.reserveAtdwData[i].additionalData.externalSystems[n].externalSystemText);\n // if(data.toString().includes(atdwState.reserveAtdwData[i].additionalData.externalSystems[n].externalSystemText)){\n // r_data.push(atdwState.reserveAtdwData[i]);\n // if(_count < tilesSize){\n // _data.push(atdwState.reserveAtdwData[i]);\n // }\n // _count++;\n // break;\n // }\n // }\n // else if(atdwState.reserveAtdwData[i].additionalData.externalSystems[n].externalSystemCode === \"TXA_MULTI\" &&\n // env.MultiTxaCode.includes(atdwState.reserveAtdwData[i].additionalData.externalSystems[n].externalSystemText)){\n\n // if(data.toString().includes(atdwState.reserveAtdwData[i].additionalData.externalSystems[n].externalSystemText)){\n // r_data.push(atdwState.reserveAtdwData[i]);\n // if(_count < tilesSize){\n // _data.push(atdwState.reserveAtdwData[i]);\n // }\n // _count++;\n // break;\n // }\n // }\n // else if(atdwState.reserveAtdwData[i].additionalData.externalSystems[n].externalSystemCode === \"TXA_CODE\" &&\n // env.MultiTxaCode.includes(atdwState.reserveAtdwData[i].additionalData.externalSystems[n].externalSystemText)){\n\n // if(data.toString().includes(atdwState.reserveAtdwData[i].additionalData.externalSystems[n].externalSystemText)){\n // r_data.push(atdwState.reserveAtdwData[i]);\n // if(_count < tilesSize){\n // _data.push(atdwState.reserveAtdwData[i]);\n // }\n // _count++;\n // break;\n // }\n // }\n // }\n ////BelairNatParkCP\n // if(data.toString().includes(\"BelairNatParkCP\") && atdwState.reserveAtdwData[i].productId === '56b2711faeeeaaf773d03794'){\n // r_data.push(atdwState.reserveAtdwData[i]);\n // if(_count < tilesSize){\n // _data.push(atdwState.reserveAtdwData[i]);\n // }\n // _count++;\n // }\n\n if (\n atdwState.reserveAtdwData[i].txaCode !== null &&\n atdwState.reserveAtdwData[i].txaCode !== \"\"\n ) {\n if (data.toString().includes(atdwState.reserveAtdwData[i].txaCode)) {\n r_data.push(atdwState.reserveAtdwData[i]);\n if (_count < tilesSize) {\n _data.push(atdwState.reserveAtdwData[i]);\n }\n _count++;\n }\n }\n }\n\n setAtdwState((pre) => {\n let _new = { ...pre };\n _new.reserveAtdwData = r_data;\n _new.atdwData = _data;\n _new.index = 1;\n return _new;\n });\n\n if (_data.length === 0) {\n setAtdwSearchText(\"Sorry, there are no available results.\");\n } else {\n setAtdwSearchText(\"\");\n }\n };\n\n fetchData();\n setTrigger(0);\n }, [\n trigger,\n checkIn,\n checkOut,\n numOfAdults,\n numOfKids,\n atdwState.reserveAtdwData,\n ]);\n\n const addAtdw = useCallback(\n (reserveAtdwData, _atdwContext) => {\n //console.log(\"addAtdw\", reserveAtdwData);\n const av = [];\n for (\n var i = atdwState.index * tilesSize;\n i < atdwState.index * tilesSize + tilesSize;\n i++\n ) {\n av.push(reserveAtdwData[i]);\n if (reserveAtdwData.length - 1 === i) {\n break;\n }\n }\n\n setAtdwState((pre) => {\n let _new = { ...pre };\n _new.atdwData = [..._new.atdwData, ...av];\n _new.index = _new.index + 1;\n _atdwContext.setupAtdwDataHistory({\n atdwDataFromDB: _new.atdwDataFromDB,\n reserveAtdwData: _new.reserveAtdwData,\n atdwData: _new.atdwData,\n index: _new.index,\n });\n return _new;\n });\n },\n [atdwState.index]\n );\n\n return (\n\n
\n \n );\n}\n","//import { css, keyframes } from '@emotion/core'\n//import { variables, mq } from 'cssInJs'\n\nimport { css } from '@emotion/core'\nimport { mq } from 'cssInJs'\n\nexport default {\n atdwSearchOption : mq({\n marginBottom : ['1rem',null,'0px'],\n '& .form-group label' : {\n marginBottom : '0px'\n },\n '.form-control:focus' : {\n boxShadow : 'none'\n }\n }),\n search_btn : css(mq({\n //marginTop: ['auto', '17px']\n marginTop: ['auto']\n })),\n date_reset_btn : css({\n marginLeft: '1rem',\n fontSize: '0.8rem',\n padding: '0px 10px',\n //marginBottom: '5px',\n marginTop: '-10px',\n backgroundColor: 'gray',\n borderColor: 'gray',\n borderRadius: '10px'\n }),\n dumyLabel : css({\n color: 'transparent'\n }),\n pet : css({\n marginTop:'2.5rem',\n paddingLeft:'2rem',\n '.form-check-input' : css({\n width: '20px',\n height: '20px',\n marginTop:'0.3rem',\n marginLeft:'-2rem'\n }),\n // '.form-check-label' : css({\n // fontSize:'1.5rem',\n // fontWeight: '700'\n // })\n })\n}","/** @jsx jsx */\nimport { jsx } from '@emotion/core';\nimport style from './style';\n//import utils from 'utils';\nimport { useState } from 'react';\nimport Select from 'react-select';\n\n// function dateFormat(date) {\n// var _date = date.getFullYear() + \"-\" +\n// (('' + (date.getMonth() + 1)).length < 2 ? (\"0\" + (date.getMonth() + 1)) : (date.getMonth() + 1)) + \"-\" +\n// (('' + (date.getDate())).length < 2 ? (\"0\" + (date.getDate())) : (date.getDate()));\n// return _date;\n// }\n\n// function dateFormatPlus2(date) {\n// date.setDate(date.getDate() + 2);\n// var _date = date.getFullYear() + \"-\" +\n// (('' + (date.getMonth() + 1)).length < 2 ? (\"0\" + (date.getMonth() + 1)) : (date.getMonth() + 1)) + \"-\" +\n// (('' + (date.getDate())).length < 2 ? (\"0\" + (date.getDate())) : (date.getDate()));\n// return _date;\n// }\n\nexport function AtdwSearchOptionV2(props) {\n const atdwType = props.atdwType;\n //const _petFriendly = (props.petFriendly && props.petFriendly === 'on') ? true : false;\n\n const numOfAdultsOption = [\n { value: '1', label: '1' },\n { value: '2', label: '2' },\n { value: '3', label: '3' },\n { value: '4', label: '4' },\n { value: '5', label: '5' },\n { value: '6', label: '6' },\n { value: '7', label: '7' },\n { value: '8', label: '8' },\n { value: '9', label: '9' }\n ];\n\n const numOfKidsOption = [\n { value: '0', label: '0' },\n { value: '1', label: '1' },\n { value: '2', label: '2' },\n { value: '3', label: '3' },\n { value: '4', label: '4' },\n { value: '5', label: '5' },\n { value: '6', label: '6' },\n { value: '7', label: '7' },\n { value: '8', label: '8' },\n { value: '9', label: '9' }\n ];\n\n const [searchOptionValue, setSearchOptionValue] = useState({\n checkIn: '',\n checkOut: '',\n numOfAdults: numOfAdultsOption[1],\n numOfKids: numOfKidsOption[0],\n subType: [],\n town: '',\n name: '',\n //petFriendly: _petFriendly\n });\n\n //const today = new Date();\n //const checkInMinDate = dateFormat(today);\n //const [checkOutMinDate, setCheckOutMinDate] = useState(dateFormatPlus2(today));\n //const [triggerPetCheck, setTriggerPetCheck] = useState(0);\n const typeOptions = setTypeOptions();\n //console.log(\"1111\", typeOptions.items);\n function setTypeOptions() {\n if (atdwType === 'ACCOMM') {\n return {\n title: 'Accommodation Type',\n //bookingAble : false,\n bookingAble: true,\n items: [\n // { value: 'APARTMENT', label: 'Apartments' },\n // { value: 'BACKPACKER', label: 'Backpackers and Hostels' },\n // { value: 'BEDBREAKFA', label: 'Bed and Breakfasts' },\n // { value: 'CABCOTTAGE', label: 'Cabins and Cottages' },\n // { value: 'VANCAMP', label: 'Caravan and Camping' },\n // { value: 'FARMSTAY', label: 'Farm Stays' },\n // { value: 'HOLHOUSE', label: 'Holiday Houses' },\n // { value: 'HOTEL', label: 'Hotels' },\n // { value: 'MOTEL', label: 'Motels' },\n // { value: 'CABCOTTAGE', label: 'Cabins and Cottages' },\n // { value: 'RESORT', label: 'Resorts' },\n // { value: 'RETREAT', label: 'Retreats' }\n ]\n };\n }\n else if (atdwType === 'ATTRACTION') {\n return {\n title: 'Attraction Type', bookingAble: false,\n items: [\n { value: 'SHOPPING', label: 'Shopping and Markets' },\n { value: 'SPARETREAT', label: 'Spas and Retreats' },\n ]\n }\n }\n else if (atdwType === 'RESTAURANT') {\n return {\n title: 'Food & Drink Type', bookingAble: false,\n items: [\n { value: 'BAR', label: 'Bar' },\n { value: 'TAKEAWAY', label: 'Takeaway Available' },\n ]\n }\n }\n else if (atdwType === 'EVENT') {\n return {\n title: 'Event Type', bookingAble: false,\n items: [\n { value: 'EVTBUS', label: 'Business Event' },\n { value: 'EVTFOOD', label: 'Food and Wine' },\n ]\n }\n }\n else if (atdwType === 'HIRE') {\n return {\n title: 'Hire Type', bookingAble: false,\n items: [\n { value: 'BICYCLE', label: 'Bicycles' },\n { value: 'BOAT', label: 'Boats' },\n ]\n }\n }\n else if (atdwType === 'GENSERVICE') {\n return {\n title: 'Service Type', bookingAble: false,\n items: [\n { value: 'CARPARK', label: 'Carpark' },\n { value: 'FAMLYFREND', label: 'Family Friendly' },\n ]\n }\n }\n else if (atdwType === 'TOUR') {\n return {\n title: 'Tour Type', bookingAble: false,\n items: [\n { value: 'AOTOURS', label: 'Adventure and Outdoors Tours' },\n { value: 'AHBTOURS', label: 'Air, Helicopter and Balloon Tours' },\n ]\n }\n }\n else {\n return { title: '', bookingAble: false, items: [] }\n }\n }\n\n function onSubmit(event) {\n event.preventDefault();\n const value = searchOptionValue;\n props.onGetSearchOption(value);\n }\n\n function handChange(el) {\n const elName = el.target.name;\n const elValue = el.target.value;\n if (elName === \"checkIn\") {\n //const date = new Date(elValue);\n //setCheckOutMinDate(dateFormatPlus2(date));\n //setSearchOptionValue({ ...searchOptionValue, [elName]: elValue, \"checkOut\": dateFormat(date) });\n }\n // else if(elName === \"petFriendly\"){\n // setSearchOptionValue({...searchOptionValue, petFriendly : el.target.checked});\n // //setTriggerPetCheck(triggerPetCheck + 1);\n // }\n else {\n setSearchOptionValue({ ...searchOptionValue, [elName]: elValue });\n }\n }\n\n return (\n \n );\n}","import { mq } from 'cssInJs';\n\nexport default {\n portal__background: {\n backgroundColor: 'rgba(0,0,0,0.3)',\n position: 'fixed',\n top: '0px',\n left: '0px',\n width: '100%',\n height: '100%',\n zIndex: '9998'\n },\n portal__popupcontainer: mq({\n position: 'fixed',\n top: '2%',\n left: '50%',\n width: '100%',\n zIndex: '9999',\n margin: '0px',\n transform: 'translateX(-50%)',\n maxWidth: ['95%', null, '800px', null, '1200px'],\n }),\n select__attribute__outer: {\n backgroundColor: 'white',\n maxWidth: '1200px',\n margin: 'auto',\n padding: '1rem',\n borderRadius: '10px',\n },\n select__attribute: {\n\n //textAlign:'center',\n //maxWidth: ['320px', null, '820px'],\n\n maxHeight: '700px',\n overflow: 'auto'\n },\n no__filter__selected__text: {\n position: 'absolute',\n top: '50%',\n transform: 'translateY(-50%)',\n left: '50%',\n fontSize: '1.2rem',\n fontWeight: 700\n },\n category__button__container: mq({\n //display: 'flex',\n marginTop: '1rem',\n display: ['none', null, 'block'],\n position: 'relative'\n //flexDirection: 'column'\n }),\n category__select__container: mq({\n //display: 'flex',\n marginTop: '1rem',\n display: ['block', null, 'none'],\n 'select': {\n fontWeight: 700,\n fontSize: '1.1rem',\n //background: 'red !important',\n // 'option:checked' : {\n // backgroundColor : '#fe3a43',\n // color: 'white'\n // },\n // 'option:hover' : {\n // //box-shadow: 0 0 10px 100px #1882A8 inset\n // boxShadow: '0 0 10px 100px #1882A8 inset !important',\n // background : 'red !important',\n // outline: 'none !important'\n // }\n }\n // 'select : hover' : {\n // background: 'red !important',\n // outline: 'none !important'\n // },\n // '::selection' : {\n // color :'red',\n // backgroundColor : 'red !important'\n // }\n }),\n\n category__button__item__wrapper: {\n flex: '1 0 100%',\n maxWidth: '100%',\n '&.additional__filter__text': {\n color: '#fe3a43',\n marginTop: '3rem',\n marginBottom: '1rem',\n fontSize: '0.8rem',\n fontWeight: '700'\n },\n '&.additional__filter__item': {\n marginTop: '1rem',\n //marginBottom : '1rem',\n },\n },\n\n show__result: {\n textAlign: 'right',\n '&.show__result__top': {\n position: 'absolute',\n right: '0px'\n },\n 'div': {\n paddingLeft: '1rem',\n paddingRight: '1rem',\n textAlign: 'center',\n cursor: 'pointer',\n fontWeight: 600,\n lineHeight: 2,\n borderRadius: '10px',\n backgroundColor: \"#fe3a43\",\n color: 'white',\n display: 'inline-block',\n }\n },\n\n category__button__item: {\n // flex: '1 0 20%',\n // maxWidth : '20%',\n paddingLeft: '1.5rem',\n paddingRight: '1.5rem',\n textAlign: 'center',\n cursor: 'pointer',\n fontWeight: 600,\n lineHeight: 2,\n borderRadius: '10px',\n backgroundColor: \"#333333\",\n color: 'white',\n display: 'inline-block',\n maxWidth: '200px',\n width: '100%',\n '&.seleted': {\n backgroundColor: \"#fe3a43\",\n color: 'white',\n //pointerEvents: 'none'\n }\n },\n category__button__item__inner: {\n '&.seleted': {\n backgroundColor: 'red'\n }\n },\n hr__style: {\n borderTop: '2px solid rgba(0,0,0,0.1)',\n marginTop: '0.7rem',\n marginBottom: '0.7rem'\n },\n\n check__box__group: {\n display: 'flex',\n flexWrap: 'wrap',\n marginBottom: '1.5rem',\n maxHeight: '500px',\n overflow: 'auto'\n },\n\n pet__container: mq({\n flex: ['1 0 100%', null, '1 0 33.3%'],\n maxWidth: ['100%', null, '33.3%'],\n paddingTop: ['0.3rem', null, '0px'],\n paddingBottom: ['0.3rem', null, '0px'],\n paddingLeft: ['3px', null, '0px'],\n paddingRight: ['3px', null, '0px']\n }),\n\n pet: {\n //marginTop:'2.5rem',\n paddingLeft: '2rem',\n 'input': {\n accentColor: \"#fe3a43\"\n },\n '.form-check-input': mq({\n width: '20px',\n height: '20px',\n marginTop: ['3px', null, '0.3rem'],\n marginLeft: '-2rem'\n }),\n // '.form-check-label' : css({\n // fontSize:'1.5rem',\n // fontWeight: '700'\n // })\n },\n\n search__text: {\n fontWeight: 700,\n color: \"#fe3a43\",\n fontSize: '1.2rem',\n marginTop: '0.2rem',\n position: 'relative',\n },\n\n close__btn: {\n textAlign: 'right',\n cursor: 'pointer',\n 'svg': {\n width: '35px',\n height: '35px'\n }\n },\n s__filter__container: {\n marginTop: '0.5rem',\n marginBottom: '0px',\n backgroundColor: '#ebebeb',\n padding: '0.5rem 1rem',\n borderRadius: '5px'\n },\n applied__filters: {\n display: 'flex',\n flexWrap: 'wrap',\n padding: '1rem 0.5rem',\n backgroundColor: '#ebebeb',\n marginBottom: '1rem',\n borderRadius: '10px'\n },\n applied__filter__item: {\n marginLeft: '0.5rem',\n marginRight: '0.5rem',\n marginTop: '0.3rem',\n marginBottom: '0.3rem',\n backgroundColor: '#fe3a43',\n color: 'white',\n padding: '0.1rem 0.5rem',\n paddingTop: '0px',\n borderRadius: '5px',\n 'svg': {\n marginLeft: '0.5rem',\n marginBottom: '2px',\n cursor: 'pointer'\n }\n },\n no__filter__text: {\n marginBottom: '1rem'\n }\n}","/** @jsx jsx */\nimport { jsx } from '@emotion/core';\n//import style from './style';\nimport utils from 'utils';\nimport { AtdwSearchOptionV2 } from '../searchOptionV2/view';\nimport { AtdwSearchResult } from '../searchResult/view';\nimport style from './style';\nimport cmsUtils from 'cms/utils/cmsUtils';\nimport { useState, useEffect, useCallback, useContext, Fragment } from 'react';\nimport env from 'env';\nimport { AtdwContext } from '../index';\nimport { createPortal } from \"react-dom\";\nimport { MdClose } from \"react-icons/md\";\n\nfunction Portal({ children }) {\n const [el] = useState(document.createElement('div'));\n useEffect(() => {\n let mount = document.getElementById(\"portal-root\");\n mount.appendChild(el);\n return () => mount.removeChild(el);\n }, [el]);\n return createPortal(children, el);\n}\n\n// function AtdwSearchTitle(props) {\n// const type = props.type;\n// //console.log(\"type\",type);\n// const title = { sTitle: '', title: '' };\n// if (type === 'ACCOMM') {\n// title.sTitle = \"SEARCH & BOOK\";\n// title.title = \"ACCOMMODATION\";\n// }\n// else if (type === 'ATTRACTION') {\n// title.sTitle = \"SEARCH\";\n// title.title = \"ATTRACTIONS\";\n// }\n// else if (type === 'DESTINFO') {\n// title.sTitle = \"SEARCH\";\n// title.title = \"TOWN\";\n// }\n// else if (type === 'RESTAURANT') {\n// title.sTitle = \"SEARCH\";\n// title.title = \"RESTAURANT\";\n// }\n// else if (type === 'EVENT') {\n// title.sTitle = \"SEARCH\";\n// title.title = \"EVENT\";\n// }\n// else if (type === 'INFO') {\n// title.sTitle = \"SEARCH\";\n// title.title = \"INFO\";\n// }\n// else if (type === 'TOUR') {\n// title.sTitle = \"SEARCH\";\n// title.title = \"TOUR\";\n// }\n// else if (type === 'GENSERVICE') {\n// title.sTitle = \"SEARCH\";\n// title.title = \"GENSERVICE\";\n// }\n// else if (type === 'JOURNEY') {\n// title.sTitle = \"SEARCH\";\n// title.title = \"JOURNEY\";\n// }\n\n// return (\n// \n
\n )}\n\n {atdwState.atdwData ? (\n \n You’re in luck! The following Parks have availability for your\n dates.\n
\n 1 to {atdwState.atdwData.length} of{\" \"}\n {atdwState.reserveAtdwData.length}\n\n 1 to {atdwState.atdwData.length} of{\" \"}\n {atdwState.reserveAtdwData.length}\n
\n ) : null}\n\n {atdwState.atdwData.length !== atdwState.reserveAtdwData.length &&\n atdwState.atdwData.length > 0 ? (\n \n {\n addAtdw(atdwState.reserveAtdwData, atdwState.context);\n }}\n >\n MORE\n \n
\n ) : null}\n\n {atdwSearchText !== \"\" && (\n \n {atdwSearchText}\n
\n )}\n {title.sTitle} {title.title}
\n// )\n// }\n\nexport function AtdwSearchV2(props) {\n\n const item = props.item;\n const cmsOption = props.cmsOption || {};\n const cssClass = utils.classNames('cms_item', 'atdwSearchV2', item.cssClass || item.anchorName || '');\n const bgColor = cmsUtils.payload(item, 'BgColor');\n const imageUrl = cmsUtils.payload(item, 'ImageUrl');\n const backgroundTile = cmsUtils.payload(item, 'BackgroundTile');\n\n const petFriendly = cmsUtils.payload(item, 'PetFriendly') || 'off';\n const tilesSize = 12;\n\n const atdwArea = cmsUtils.payload(item, 'ProductArea') || \"all\";\n const customCategories = cmsUtils.payload(item, 'CustomCategories') || \"\";\n const filter = cmsUtils.payload(item, 'Filter') || \"all\";\n //const filter = cmsUtils.payload(item, 'Filter') || \"category_1\";\n\n let bgUrl = null;\n if (imageUrl)\n bgUrl = utils.site.resourcePath(imageUrl);\n else if (backgroundTile)\n bgUrl = utils.site.resourcePath(`/dist/transparent-textures/textures/${backgroundTile}`);\n\n const [atdwState, setAtdwState] = useState({\n atdwType: 'ACCOMM',\n atdwArea: atdwArea,\n index: 1,\n atdwDataFromDB: [],\n reserveAtdwData: [],\n shuffledAtdwData: [],\n filteredAtdwData: [],\n atdwData: [],\n trigger: 0,\n context: useContext(AtdwContext),\n //atdwFilters: null\n });\n\n //const [atdwSearchText, setAtdwSearchText] = useState(\"Searching for ATDW\");\n const [atdwSearchText, setAtdwSearchText] = useState(\" \");\n const [openPopup, setOpenPopup] = useState(false);\n const [filterData, setFilterData] = useState();\n\n //TXA\n const [trigger, setTrigger] = useState(0);\n const [checkIn, setCheckIn] = useState('');\n const [checkOut, setCheckOut] = useState('');\n const [numOfAdults, setNumOfAdults] = useState('');\n const [numOfKids, setNumOfKids] = useState('');\n\n //checkIn, checkOut, numOfAdults, numOfKids,\n function searechAtdwFilter({ petFriendly, town, name, subType, atdwDataItem, customCategories }) {\n\n //const _petFriendly = petFriendly || false;\n //const _customCategories = customCategories || '';\n\n const _town = town || '';\n const _name = name || '';\n const _subType = subType || [];\n\n const _filteredData = atdwDataItem.filter((data) => {\n let returnResult = false;\n //1\n if (_subType.length > 0) {\n //checkFilterDo = true\n for (var i in data.additionalData.PRODUCTTYPES) {\n returnResult = false;\n if (subType.toString().includes(data.additionalData.PRODUCTTYPES[i].productTypeId)) {\n returnResult = true;\n }\n else {\n returnResult = false;\n break;\n }\n }\n }\n else {\n returnResult = true;\n }\n\n //2\n if (returnResult === true && (_town !== \"\" && _town !== null)) {\n //checkFilterDo = true\n returnResult = false;\n if (data.town.toLowerCase().includes(_town.toLowerCase())) {\n returnResult = true;\n }\n }\n\n //3\n if (returnResult === true && (_name !== \"\" && _name !== null)) {\n //checkFilterDo = true\n returnResult = false;\n if (data.productName.toLowerCase().includes(_name.toLowerCase())) {\n returnResult = true;\n }\n }\n\n //4 pet\n // if (returnResult === true && (_petFriendly === true)) {\n // //checkFilterDo = true\n // returnResult = false;\n // const _checkPetFriendly = data.checkPetFriendly || false;\n // if (_checkPetFriendly === true) {\n // returnResult = true;\n // }\n // }\n\n //5 customCategories\n // if (returnResult === true && _customCategories !== null && _customCategories !== \"\") {\n // returnResult = false;\n // if (data.customCategories && data.customCategories !== '') {\n // const _customCategoryArray = _customCategories.split(\",\");\n // for (let i in _customCategoryArray) {\n // returnResult = false;\n // if (data.customCategories.toLowerCase().includes(_customCategoryArray[i].toLowerCase())) {\n // returnResult = true;\n // break;\n // }\n // }\n // }\n // }\n return returnResult;\n });\n\n return _filteredData;\n }\n\n function categoryFilter({ atdwDataItem }) {\n const _filteredData = atdwDataItem.filter((data) => {\n let returnResult = false;\n let bypass = false;\n if (filterData.filteredData.length > 0) {\n if (data.productFilters && data.productFilters.length > 0) {\n for (let i in filterData.filteredData) {\n if (filterData.filteredData[i].categoryCode !== 'category_area') {\n returnResult = false;\n const _filterCheckItem = data.productFilters.find(el => el.filterId === filterData.filteredData[i].filterId);\n if (!_filterCheckItem || _filterCheckItem === null) {\n returnResult = false;\n break;\n }\n else {\n returnResult = true;\n }\n }\n else {\n // if(bypass === false && filterData.filteredData[i].filterName === data.area){\n // returnResult = true;\n // bypass = true;\n // }\n if (filterData.filteredData[i].filterName === data.area) {\n returnResult = true;\n bypass = true;\n }\n else {\n if (bypass === false) {\n returnResult = false;\n }\n }\n }\n\n // returnResult = false;\n // const _filterCheckItem = data.productFilters.find(el => el.filterId === filterData.filteredData[i].filterId);\n // console.log(\"_filterCheckItem\", _filterCheckItem);\n\n // if (!_filterCheckItem || _filterCheckItem === null) {\n // returnResult = false;\n // break;\n // }\n // else {\n // returnResult = true;\n // }\n }\n\n }\n }\n else {\n returnResult = true;\n }\n\n if (filterData.petFriendly === true && returnResult === true) {\n if (data.checkPetFriendly !== true) {\n returnResult = false;\n }\n }\n return returnResult;\n });\n\n return _filteredData;\n }\n\n function onGetSearchOptionFun(value) {\n\n const _checkIn = value.checkIn ? value.checkIn : '';\n const _checkOut = value.checkOut ? value.checkOut : '';\n const _numOfAdults = value.numOfAdults.value ? value.numOfAdults.value : '2';\n const _numOfKids = value.numOfKids.value ? value.numOfKids.value : '0';\n //const _petFriendly = value.petFriendly ? value.petFriendly : false;\n\n const subType = [];\n for (var i in value.subType) {\n subType.push(value.subType[i].value);\n }\n const town = value.town.trim();\n const name = value.name.trim();\n\n //let checkFilterDo = false\n\n const _filteredData = searechAtdwFilter({\n //petFriendly: _petFriendly,\n town: town,\n name: name,\n subType: subType,\n atdwDataItem: atdwState.shuffledAtdwData,\n //customCategories: customCategories\n //checkFilterDo : checkFilterDo\n });\n\n // const _data = [];\n\n // if (_filteredData.length > 0) {\n // for (let x = 0; x < tilesSize; x++) {\n // _data.push(_filteredData[x]);\n // if (x === (_filteredData.length - 1)) {\n // break;\n // }\n // }\n // }\n\n setAtdwState(pre => {\n let _new = { ...pre };\n _new.context.setupAtdwTxaCheckInDate(null);\n _new.reserveAtdwData = _filteredData;\n\n if (_checkIn !== '') {\n _new.atdwData = [];\n setCheckIn(_checkIn);\n setCheckOut(_checkOut);\n setNumOfAdults(_numOfAdults);\n setNumOfKids(_numOfKids);\n setTrigger(trigger + 1);\n //setAtdwSearchText(\"Searching for ATDW\");\n setAtdwSearchText(\" \");\n _new.context.setupAtdwTxaCheckInDate(_checkIn);\n }\n else {\n\n const filteredDataResult = categoryFilter({ atdwDataItem: _new.reserveAtdwData });\n const _data = [];\n if (filteredDataResult.length > 0) {\n for (let x = 0; x < tilesSize; x++) {\n _data.push(filteredDataResult[x]);\n if (x === (filteredDataResult.length - 1)) {\n break;\n }\n }\n }\n _new.atdwData = _data;\n _new.filteredAtdwData = filteredDataResult;\n _new.index = 1;\n _new.context.setupAtdwDataHistory({\n atdwDataFromDB: _new.atdwDataFromDB,\n reserveAtdwData: _new.reserveAtdwData,\n atdwData: _new.atdwData,\n index: _new.index\n });\n if (_data.length === 0) {\n setAtdwSearchText(\"Sorry, there are no available results.\");\n }\n else {\n setAtdwSearchText(\"\");\n }\n }\n return _new;\n });\n }\n\n function openPopupFun() {\n setOpenPopup(true);\n document.body.style.overflow = \"hidden\";\n }\n\n function closePopupFun() {\n setOpenPopup(false);\n document.body.style.overflow = \"unset\";\n }\n\n function changeCurrentFilter(_filter, _filterData) {\n filterData.currentFilter = _filter;\n filterData.currentFilterData = JSON.parse(JSON.stringify(_filterData));\n setFilterData({ ...filterData });\n }\n\n function changeFilter(_filter) {\n // filterData.currentFilter = _filter;\n // filterData.currentFilterData = JSON.parse(JSON.stringify(_filterData));\n\n switch (_filter) {\n case 'select__filter':\n filterData.selectedFilter.categoryOpenCheck = !filterData.selectedFilter.categoryOpenCheck;\n break;\n case 'category_1':\n filterData.filters.category_1.categoryOpenCheck = !filterData.filters.category_1.categoryOpenCheck;\n break;\n case 'category_2':\n filterData.filters.category_2.categoryOpenCheck = !filterData.filters.category_2.categoryOpenCheck;\n break;\n case 'category_3':\n filterData.filters.category_3.categoryOpenCheck = !filterData.filters.category_3.categoryOpenCheck;\n break;\n case 'category_4':\n filterData.filters.category_4.categoryOpenCheck = !filterData.filters.category_4.categoryOpenCheck;\n break;\n case 'category_5':\n filterData.filters.category_5.categoryOpenCheck = !filterData.filters.category_5.categoryOpenCheck;\n break;\n case 'category_6':\n filterData.filters.category_6.categoryOpenCheck = !filterData.filters.category_6.categoryOpenCheck;\n break;\n case 'category_area':\n filterData.filters.category_area.categoryOpenCheck = !filterData.filters.category_area.categoryOpenCheck;\n break;\n default:\n break;\n }\n\n setFilterData({ ...filterData });\n }\n\n function handChange(el) {\n const elName = el.target.name;\n const elValue = el.target.value;\n if (elName === 'filter__select') {\n switch (elValue) {\n case 'category_1':\n changeCurrentFilter('category_1', filterData.filters.category_1);\n break;\n case 'category_2':\n changeCurrentFilter('category_2', filterData.filters.category_2);\n break;\n case 'category_3':\n changeCurrentFilter('category_3', filterData.filters.category_3);\n break;\n case 'category_4':\n changeCurrentFilter('category_4', filterData.filters.category_4);\n break;\n case 'category_5':\n changeCurrentFilter('category_5', filterData.filters.category_5);\n break;\n default:\n break;\n }\n }\n }\n\n function handChangeForFilter(el) {\n\n const value = el.value;\n const categoryCode = el.categoryCode;\n const filterId = el.filterId;\n\n switch (categoryCode) {\n case 'category_1':\n let _filter1 = filterData.filters.category_1.filters.find(el => el.filterId === filterId);\n _filter1.checkAtdwProductFilter = value;\n filterData.currentFilterData = filterData.filters.category_1;\n\n let _count1 = 0;\n filterData.filters.category_1.filters.forEach(el => {\n if (el.checkAtdwProductFilter === true) {\n _count1++;\n }\n });\n filterData.filters.category_1.categoryCheckedNum = _count1;\n break;\n case 'category_2':\n let _filter2 = filterData.filters.category_2.filters.find(el => el.filterId === filterId);\n _filter2.checkAtdwProductFilter = value;\n filterData.currentFilterData = filterData.filters.category_2;\n\n let _count2 = 0;\n filterData.filters.category_2.filters.forEach(el => {\n if (el.checkAtdwProductFilter === true) {\n _count2++;\n }\n });\n filterData.filters.category_2.categoryCheckedNum = _count2;\n\n break;\n case 'category_3':\n let _filter3 = filterData.filters.category_3.filters.find(el => el.filterId === filterId);\n _filter3.checkAtdwProductFilter = value;\n filterData.currentFilterData = filterData.filters.category_3;\n\n let _count3 = 0;\n filterData.filters.category_3.filters.forEach(el => {\n if (el.checkAtdwProductFilter === true) {\n _count3++;\n }\n });\n filterData.filters.category_3.categoryCheckedNum = _count3;\n\n break;\n case 'category_4':\n let _filter4 = filterData.filters.category_4.filters.find(el => el.filterId === filterId);\n _filter4.checkAtdwProductFilter = value;\n filterData.currentFilterData = filterData.filters.category_4;\n\n let _count4 = 0;\n filterData.filters.category_4.filters.forEach(el => {\n if (el.checkAtdwProductFilter === true) {\n _count4++;\n }\n });\n filterData.filters.category_4.categoryCheckedNum = _count4;\n\n break;\n case 'category_5':\n let _filter5 = filterData.filters.category_5.filters.find(el => el.filterId === filterId);\n _filter5.checkAtdwProductFilter = value;\n filterData.currentFilterData = filterData.filters.category_5;\n\n let _count5 = 0;\n filterData.filters.category_5.filters.forEach(el => {\n if (el.checkAtdwProductFilter === true) {\n _count5++;\n }\n });\n filterData.filters.category_5.categoryCheckedNum = _count5;\n\n break;\n case 'category_6':\n let _filter6 = filterData.filters.category_6.filters.find(el => el.filterId === filterId);\n _filter6.checkAtdwProductFilter = value;\n filterData.currentFilterData = filterData.filters.category_6;\n\n let _count6 = 0;\n filterData.filters.category_6.filters.forEach(el => {\n if (el.checkAtdwProductFilter === true) {\n _count6++;\n }\n });\n filterData.filters.category_6.categoryCheckedNum = _count6;\n break;\n\n case 'category_area':\n let _filterArea = filterData.filters.category_area.filters.find(el => el.filterId === filterId);\n _filterArea.checkAtdwProductFilter = value;\n filterData.currentFilterData = filterData.filters.category_area;\n\n let _countArea = 0;\n filterData.filters.category_area.filters.forEach(el => {\n if (el.checkAtdwProductFilter === true) {\n _countArea++;\n }\n });\n filterData.filters.category_area.categoryCheckedNum = _countArea;\n break;\n case 'pet_friendly':\n filterData.petFriendly = value;\n break;\n default:\n break;\n }\n\n const _filteredData = [];\n let _filteredIdsString = \"\";\n\n filterData.filters.category_1.filters.forEach(el => {\n if (el.checkAtdwProductFilter === true) {\n _filteredData.push(el);\n _filteredIdsString = _filteredIdsString + el.filterId + \",\";\n }\n });\n\n filterData.filters.category_2.filters.forEach(el => {\n if (el.checkAtdwProductFilter === true) {\n _filteredData.push(el);\n _filteredIdsString = _filteredIdsString + el.filterId + \",\";\n }\n });\n\n filterData.filters.category_3.filters.forEach(el => {\n if (el.checkAtdwProductFilter === true) {\n _filteredData.push(el);\n _filteredIdsString = _filteredIdsString + el.filterId + \",\";\n }\n });\n\n filterData.filters.category_4.filters.forEach(el => {\n if (el.checkAtdwProductFilter === true) {\n _filteredData.push(el);\n _filteredIdsString = _filteredIdsString + el.filterId + \",\";\n }\n });\n\n filterData.filters.category_5.filters.forEach(el => {\n if (el.checkAtdwProductFilter === true) {\n _filteredData.push(el);\n _filteredIdsString = _filteredIdsString + el.filterId + \",\";\n }\n });\n\n filterData.filters.category_6.filters.forEach(el => {\n if (el.checkAtdwProductFilter === true) {\n _filteredData.push(el);\n _filteredIdsString = _filteredIdsString + el.filterId + \",\";\n }\n });\n\n filterData.filters.category_area.filters.forEach(el => {\n if (el.checkAtdwProductFilter === true) {\n _filteredData.push(el);\n _filteredIdsString = _filteredIdsString + el.filterId + \",\";\n }\n });\n\n filterData.filteredData = _filteredData;\n filterData.filteredIdsString = _filteredIdsString;\n\n setFilterData({ ...filterData });\n const filteredDataResult = categoryFilter({ atdwDataItem: atdwState.reserveAtdwData });\n\n const _data = [];\n if (filteredDataResult.length > 0) {\n for (let x = 0; x < tilesSize; x++) {\n _data.push(filteredDataResult[x]);\n if (x === (filteredDataResult.length - 1)) {\n break;\n }\n }\n }\n\n setAtdwState(pre => {\n let _new = { ...pre };\n _new.context.setupAtdwTxaCheckInDate(null);\n _new.filteredAtdwData = filteredDataResult;\n _new.atdwData = _data;\n _new.index = 1;\n _new.context.setupAtdwDataHistory({\n atdwDataFromDB: _new.atdwDataFromDB,\n reserveAtdwData: _new.reserveAtdwData,\n atdwData: _new.atdwData,\n index: _new.index\n });\n if (_data.length === 0) {\n setAtdwSearchText(\"Sorry, there are no available results.\");\n }\n else {\n setAtdwSearchText(\"\");\n }\n return _new;\n });\n }\n\n useEffect(() => {\n //console.log(\"useEffect_1\");\n if (atdwState.context.atdwDataHistory2 !== null) {\n setAtdwState(pre => {\n let _new = { ...pre };\n _new.atdwDataFromDB = atdwState.context.atdwDataHistory.atdwDataFromDB;\n _new.reserveAtdwData = atdwState.context.atdwDataHistory.reserveAtdwData;\n _new.atdwData = atdwState.context.atdwDataHistory.atdwData;\n _new.index = atdwState.context.atdwDataHistory.index;\n return _new;\n });\n setTimeout(() => {\n document.getElementById(atdwState.context.atdwDataHistory2).scrollIntoView({ behavior: 'smooth', block: 'center' });\n atdwState.context.setupAtdwDataHistory2(null);\n atdwState.context.setupAtdwTxaCheckInDate(null);\n }, 500);\n\n return;\n }\n\n const fetchData = async () => {\n const res = await fetch(env.apiBase + \"/api/atdw/getproductsv2post\", {\n method: 'post',\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify({\n area: atdwState.atdwArea,\n customFilter: filter\n })\n });\n\n const data = await res.json();\n const _data = [];\n\n data.products.forEach(el => {\n const _attributes = el.additionalData.attributes || [];\n let checkPetFriendly = false;\n for (let _a in _attributes) {\n if (_attributes[_a].attributeId === 'PETALLOW') {\n checkPetFriendly = true;\n break;\n }\n }\n el.checkPetFriendly = checkPetFriendly;\n });\n\n var shuffled = JSON.parse(JSON.stringify(data.products));\n var currentIndex = shuffled.length, temporaryValue, randomIndex;\n\n while (0 !== currentIndex) {\n\n // Pick a remaining element...\n randomIndex = Math.floor(Math.random() * currentIndex);\n currentIndex -= 1;\n\n // And swap it with the current element.\n temporaryValue = shuffled[currentIndex];\n shuffled[currentIndex] = shuffled[randomIndex];\n shuffled[randomIndex] = temporaryValue;\n }\n\n let _filteredData = shuffled;\n\n _filteredData = searechAtdwFilter({\n petFriendly: (petFriendly && petFriendly === 'on') ? true : false,\n customCategories: (customCategories && customCategories !== '') ? customCategories : '',\n atdwDataItem: _filteredData\n });\n\n //shuffled\n if (_filteredData.length > 0) {\n for (var i = 0; i < tilesSize; i++) {\n _data.push(_filteredData[i]);\n if (i === (_filteredData.length - 1)) {\n break;\n }\n }\n }\n\n let _selectedFilter = null;\n let _currentFilter = \"category_1\";\n let _currentFilterData = data.atdwFilters.category_1;\n\n switch (filter) {\n case \"category_1\":\n //filters: data.atdwFilters.category_1.\n data.atdwFilters.category_1.categoryOpenCheck = true;\n _selectedFilter = data.atdwFilters.category_1;\n _currentFilter = \"category_2\";\n _currentFilterData = data.atdwFilters.category_2;\n break;\n case \"category_2\":\n data.atdwFilters.category_2.categoryOpenCheck = true;\n _selectedFilter = data.atdwFilters.category_2;\n _currentFilter = \"category_3\";\n _currentFilterData = data.atdwFilters.category_3;\n break;\n case \"category_3\":\n data.atdwFilters.category_3.categoryOpenCheck = true;\n _selectedFilter = data.atdwFilters.category_3;\n _currentFilter = \"category_4\";\n _currentFilterData = data.atdwFilters.category_4;\n break;\n case \"category_4\":\n data.atdwFilters.category_4.categoryOpenCheck = true;\n _selectedFilter = data.atdwFilters.category_4;\n _currentFilter = \"category_5\";\n _currentFilterData = data.atdwFilters.category_5;\n break;\n case \"category_5\":\n data.atdwFilters.category_5.categoryOpenCheck = true;\n _selectedFilter = data.atdwFilters.category_5;\n _currentFilter = \"category_6\";\n _currentFilterData = data.atdwFilters.category_6;\n break;\n case \"category_6\":\n data.atdwFilters.category_6.categoryOpenCheck = true;\n _selectedFilter = data.atdwFilters.category_6;\n //_currentFilter = \"category_6\";\n break;\n default:\n break; //CategoryCheck\n }\n \n setFilterData({\n currentFilter: _currentFilter,\n currentFilterData: _currentFilterData,\n filters: data.atdwFilters,\n petFriendly: false,\n filteredIdsString: '',\n filteredData: [],\n selectedFilter: _selectedFilter\n });\n\n setAtdwState(pre => {\n let _new = { ...pre };\n _new.atdwDataFromDB = data.products;\n _new.reserveAtdwData = _filteredData;\n _new.shuffledAtdwData = shuffled;\n _new.filteredAtdwData = _new.reserveAtdwData;\n _new.atdwData = _data;\n\n _new.context.setupAtdwDataHistory({\n atdwDataFromDB: _new.atdwDataFromDB,\n reserveAtdwData: _new.reserveAtdwData,\n atdwData: _new.atdwData,\n index: _new.index\n });\n\n return _new;\n });\n\n if (_data.length > 0) {\n setAtdwSearchText(\"\");\n }\n else {\n setAtdwSearchText(\"Sorry, there are no available results.\");\n }\n }\n fetchData();\n\n // eslint-disable-next-line\n }, [atdwState.atdwType, atdwState.context, atdwState.atdwArea]);\n\n useEffect(() => {\n if (trigger === 0) {\n return\n }\n const r_data = [];\n const _data = [];\n const fetchData = async () => {\n const sendData = {\n checkIn: checkIn,\n checkOut: checkOut,\n adults: numOfAdults,\n kids: numOfKids,\n txaList: []\n };\n\n atdwState.reserveAtdwData.forEach(el => {\n\n if (el.txaCode && el.txaCode !== '') {\n sendData.txaList.push(el.txaCode);\n }\n });\n\n const res = await fetch(env.apiBase + \"/api/atdw/gettxaproducts\", {\n method: 'post',\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify(sendData)\n });\n\n const data = await res.json();\n\n //let _count = 0;\n for (var i = 0; i < atdwState.reserveAtdwData.length; i++) {\n if (atdwState.reserveAtdwData[i].txaCode !== null && atdwState.reserveAtdwData[i].txaCode !== '') {\n if (data.toString().includes(atdwState.reserveAtdwData[i].txaCode)) {\n r_data.push(atdwState.reserveAtdwData[i]);\n // if (_count < tilesSize) {\n // _data.push(atdwState.reserveAtdwData[i]);\n // }\n // _count++;\n }\n }\n }\n\n setAtdwState(pre => {\n let _new = { ...pre };\n _new.reserveAtdwData = r_data;\n const filteredDataResult = categoryFilter({ atdwDataItem: _new.reserveAtdwData });\n\n if (filteredDataResult.length > 0) {\n for (let x = 0; x < tilesSize; x++) {\n _data.push(filteredDataResult[x]);\n if (x === (filteredDataResult.length - 1)) {\n break;\n }\n }\n }\n\n _new.atdwData = _data;\n _new.index = 1;\n _new.filteredAtdwData = filteredDataResult;\n\n return _new;\n });\n\n if (_data.length === 0) {\n setAtdwSearchText(\"Sorry, there are no available results.\");\n }\n else {\n setAtdwSearchText(\"\");\n }\n };\n\n fetchData();\n setTrigger(0);\n\n // eslint-disable-next-line\n }, [trigger, checkIn, checkOut, numOfAdults, numOfKids, atdwState.reserveAtdwData]);\n\n const addAtdw = useCallback((reserveAtdwData, _atdwContext) => {\n //console.log(\"addAtdw\", reserveAtdwData);\n const av = [];\n for (var i = (atdwState.index * tilesSize); i < ((atdwState.index * tilesSize) + tilesSize); i++) {\n av.push(reserveAtdwData[i]);\n if (reserveAtdwData.length - 1 === i) {\n break;\n }\n }\n\n setAtdwState(pre => {\n let _new = { ...pre };\n _new.atdwData = [..._new.atdwData, ...av];\n _new.index = _new.index + 1;\n _atdwContext.setupAtdwDataHistory({\n atdwDataFromDB: _new.atdwDataFromDB,\n reserveAtdwData: _new.reserveAtdwData,\n atdwData: _new.atdwData,\n index: _new.index\n });\n return _new;\n });\n }, [atdwState.index]);\n\n return (\n\n
\n \n
\n \n\n \n \n }\n
\n \n
\n\n \n {'Search filters - showing ' + atdwState.filteredAtdwData.length + ' of ' + atdwState.atdwDataFromDB.length + ((filterData.selectedFilter && filterData.selectedFilter !== null) ? \" - \" + filterData.selectedFilter.categoryName : '')}\n
\n\n {\n filterData &&\n \n {\n filterData.filters.category_1.categoryOpenCheck === false &&\n filterData.filters.category_2.categoryOpenCheck === false &&\n filterData.filters.category_3.categoryOpenCheck === false &&\n filterData.filters.category_4.categoryOpenCheck === false &&\n filterData.filters.category_5.categoryOpenCheck === false &&\n filterData.filters.category_6.categoryOpenCheck === false &&\n
\n\n \n (No filters selected)\n
\n }\n\n \n
\n\n {\n filterData.selectedFilter && filterData.selectedFilter !== null &&\n \n {'Show ' + atdwState.filteredAtdwData.length + ' results'}\n
\n \n \n
\n {\n filterData.selectedFilter.filters.length > 0 ?\n \n }\n
\n }\n\n {\n filterData.selectedFilter && filterData.selectedFilter !== null &&\n {\n changeFilter('select__filter');\n }}>\n {filterData.selectedFilter.categoryName + (filterData.selectedFilter.categoryCheckedNum > 0 ? ` (${filterData.selectedFilter.categoryCheckedNum})` : '')}\n {/* {filterData.filters.category_1.categoryName + (filterData.filters.category_1.CategoryCheckedNum > 0 ? `(${filterData.filters.category_1.CategoryCheckedNum})` : '')} */}\n
\n\n {\n filterData.selectedFilter.categoryOpenCheck === true &&\n \n {\n filterData.selectedFilter.filters.length > 0 ?\n
\n {\n filterData.selectedFilter.filters.map((item, index) =>\n
: No Filters
\n }\n \n Additional Filters\n
\n }\n\n {\n (!filterData.selectedFilter || (filterData.selectedFilter && filterData.selectedFilter.categoryCode !== 'category_1')) &&\n \n \n
\n {\n filterData.filters.category_1.filters.length > 0 ?\n \n }\n
\n }\n\n {\n (!filterData.selectedFilter || (filterData.selectedFilter && filterData.selectedFilter.categoryCode !== 'category_2')) &&\n {\n changeFilter('category_1');\n }}>\n {filterData.filters.category_1.categoryName + (filterData.filters.category_1.categoryCheckedNum > 0 ? ` (${filterData.filters.category_1.categoryCheckedNum})` : '')}\n
\n {\n filterData.filters.category_1.categoryOpenCheck === true &&\n \n {\n filterData.filters.category_1.filters.length > 0 ?\n
\n {\n filterData.filters.category_1.filters.map((item, index) =>\n
: No Filters
\n }\n \n \n
\n {\n filterData.filters.category_2.filters.length > 0 ?\n \n }\n
\n }\n\n {\n (!filterData.selectedFilter || (filterData.selectedFilter && filterData.selectedFilter.categoryCode !== 'category_3')) &&\n {\n changeFilter('category_2');\n }}>\n {filterData.filters.category_2.categoryName + (filterData.filters.category_2.categoryCheckedNum > 0 ? ` (${filterData.filters.category_2.categoryCheckedNum})` : '')}\n
\n {\n filterData.filters.category_2.categoryOpenCheck === true &&\n \n {\n filterData.filters.category_2.filters.length > 0 ?\n
\n {\n filterData.filters.category_2.filters.map((item, index) =>\n
: No Filters
\n }\n \n \n
\n {\n filterData.filters.category_3.filters.length > 0 ?\n \n }\n
\n }\n\n {\n (!filterData.selectedFilter || (filterData.selectedFilter && filterData.selectedFilter.categoryCode !== 'category_4')) &&\n {\n changeFilter('category_3');\n }}>\n {filterData.filters.category_3.categoryName + (filterData.filters.category_3.categoryCheckedNum > 0 ? ` (${filterData.filters.category_3.categoryCheckedNum})` : '')}\n
\n {\n filterData.filters.category_3.categoryOpenCheck === true &&\n \n {\n filterData.filters.category_3.filters.length > 0 ?\n
\n {\n filterData.filters.category_3.filters.map((item, index) =>\n
: No Filters
\n }\n \n \n
\n {\n filterData.filters.category_4.filters.length > 0 ?\n \n }\n
\n }\n\n {\n (!filterData.selectedFilter || (filterData.selectedFilter && filterData.selectedFilter.categoryCode !== 'category_5')) &&\n {\n changeFilter('category_4');\n }}>\n {filterData.filters.category_4.categoryName + (filterData.filters.category_4.categoryCheckedNum > 0 ? ` (${filterData.filters.category_4.categoryCheckedNum})` : '')}\n
\n {\n filterData.filters.category_4.categoryOpenCheck === true &&\n \n {\n filterData.filters.category_4.filters.length > 0 ?\n
\n {\n filterData.filters.category_4.filters.map((item, index) =>\n
: No Filters
\n }\n \n \n
\n {\n filterData.filters.category_5.filters.length > 0 ?\n \n }\n
\n }\n\n {\n (!filterData.selectedFilter || (filterData.selectedFilter && filterData.selectedFilter.categoryCode !== 'category_6')) &&\n {\n changeFilter('category_5');\n }}>\n {filterData.filters.category_5.categoryName + (filterData.filters.category_5.categoryCheckedNum > 0 ? ` (${filterData.filters.category_5.categoryCheckedNum})` : '')}\n
\n {\n filterData.filters.category_5.categoryOpenCheck === true &&\n \n {\n filterData.filters.category_5.filters.length > 0 ?\n
\n {\n filterData.filters.category_5.filters.map((item, index) =>\n
: No Filters
\n }\n \n \n
\n {\n filterData.filters.category_6.filters.length > 0 ?\n \n }\n
\n }\n\n {\n atdwState.atdwArea === 'all' &&\n {\n changeFilter('category_6');\n }}>\n {filterData.filters.category_6.categoryName + (filterData.filters.category_6.categoryCheckedNum > 0 ? ` (${filterData.filters.category_6.categoryCheckedNum})` : '')}\n
\n {\n filterData.filters.category_6.categoryOpenCheck === true &&\n \n {\n filterData.filters.category_6.filters.length > 0 ?\n
\n {\n filterData.filters.category_6.filters.map((item, index) =>\n
: No Filters
\n }\n \n \n
\n {\n filterData.filters.category_area.filters.length > 0 ?\n \n }\n
\n }\n\n {\n changeFilter('category_area');\n }}>\n {filterData.filters.category_area.categoryName + (filterData.filters.category_area.categoryCheckedNum > 0 ? ` (${filterData.filters.category_area.categoryCheckedNum})` : '')}\n
\n {\n filterData.filters.category_area.categoryOpenCheck === true &&\n \n {\n filterData.filters.category_area.filters.length > 0 ?\n
\n {\n filterData.filters.category_area.filters.map((item, index) =>\n
: No Filters
\n }\n \n\n {\n filterData.selectedFilter && filterData.selectedFilter !== null &&\n \n \n
\n {\n filterData.selectedFilter.filters.length > 0 ?\n \n }\n \n }\n\n {\n filterData.selectedFilter && filterData.selectedFilter !== null &&\n
\n\n {\n changeFilter('select__filter');\n }}>\n {filterData.selectedFilter.categoryName + (filterData.selectedFilter.categoryCheckedNum > 0 ? `(${filterData.selectedFilter.categoryCheckedNum})` : '')}\n
\n {\n filterData.selectedFilter.categoryOpenCheck === true &&\n \n {\n filterData.selectedFilter.filters.length > 0 ?\n
\n {\n filterData.selectedFilter.filters.map((item, index) =>\n
: No Filters
\n }\n \n Additional Filters\n
\n }\n\n \n\n {\n filterData.currentFilterData.filters.length > 0 ?\n \n {\n filterData.currentFilterData.filters.map((item, index) =>
: No Filters
\n }\n\n \n
\n\n \n {'Show ' + atdwState.filteredAtdwData.length + ' results'}\n
\n \n\n {/*
\n \n 1 to {atdwState.atdwData.length} of {atdwState.filteredAtdwData.length}\n
\n }\n\n {atdwState.atdwData ? (\n \n 1 to {atdwState.atdwData.length} of {atdwState.filteredAtdwData.length}\n
\n ) : null}\n\n {\n atdwState.atdwData.length !== atdwState.filteredAtdwData.length && atdwState.atdwData.length > 0 ? (\n \n \n
\n ) : null}\n\n {\n atdwSearchText !== \"\" &&\n \n {atdwSearchText}\n
\n }\n\n \n
\n )\n}\n\nfunction AppliedSearchFilters({ filteredData, petFriendly, handChangeForFilter }) {\n return (\n \n {\n handChangeForFilter({\n filterId: filter.filterId,\n value: e.target.checked,\n categoryCode: categoryCode\n });\n }} />\n \n
\n \n {/* {\n petFriendly === true &&\n
\n )\n}","import { css } from '@emotion/core'\nimport { mq } from 'cssInJs'\n\nexport default {\n tileSize : css(mq({\n //border : '1px solid red',\n position : 'relative',\n height : ['300px', '450px'],\n backgroundImage:'url(\"/assets/logos/logo.png\")',\n backgroundPosition:'center',\n backgroundSize:'contain',\n backgroundRepeat: 'no-repeat',\n 'img' : {\n //border : '1px solid red'\n position : 'absolute',\n top: '50%',\n left: '50%',\n transform: 'translate(-50%, -50%)',\n width: '100%',\n '@media(max-width:600px)' : {\n height : '100%',\n width: 'auto'\n }\n }\n })),\n\n banerIconsBar : css({\n textAlign : 'center',\n backgroundColor : '#fe3a43',\n padding : '0.3rem 0',\n display : 'flex',\n flexDirection : 'row',\n flexWrap : 'wrap',\n justifyContent : 'center',\n 'svg' : {\n width : '32px',\n height : '32px',\n color : 'white'\n },\n // '.bar__item' : {\n // margin : '0px 20px',\n // cursor : 'pointer',\n // '&:hover' : {\n // textDecoration : 'unset'\n // }\n // },\n '.bar__item' : mq({\n margin : ['0px 15px', null, '0px 20px'],\n cursor : 'pointer',\n '&:hover' : {\n textDecoration : 'unset'\n }\n }),\n '.bar__item.booking__button' :mq({\n margin : ['0px 10px', null, '0px 15px'],\n }),\n '.icon__text' : {\n fontSize : '.6rem',\n color : '#fff'\n },\n '@media(max-width:600px)' : {\n marginTop:'-7px'\n }\n // '&.dock' : mq({\n // position:'fixed',\n // top:['50px', '44px', '56px'],\n // width: '100%',\n // zIndex:'9'\n // })\n }),\n\n cityName : css(mq({\n //textAlign : 'center',\n margin : '0px',\n fontSize : ['1.6rem', '1.8rem'],\n marginTop: '0.5rem',\n marginBottom: '0.5rem'\n })),\n\n productName : css(mq({\n //textAlign : 'center',\n margin : '0px'\n //fontSize : ['2rem']\n })),\n\n detailContainer : css({\n // '.Collapsible' : {\n // //backgroundColor : 'grey'\n // },\n // '.Collapsible__contentInner' : {\n // padding: '10px',\n // //border: '1px solid red',\n // borderTop: '0',\n // fontSize : '14px',\n // 'p' : {\n // marginBottom: '10px',\n // fontSize: '14px',\n // lineHeight: '20px',\n // '&:last-child' : {\n // marginBottom: '0'\n // }\n // }\n // },\n // '.Collapsible__trigger' : {\n // display: 'block',\n // fontWeight: '400',\n // textDecoration: 'none',\n // position: 'relative',\n // //border: '1px solid white',\n // borderBottom: '1px solid #252525',\n // padding: '10px',\n // background: 'transparent',\n // color: '#252525',\n // cursor : 'pointer',\n // '&:after' : {\n // content: '\"\"',\n // position: 'absolute',\n // right: '10px',\n // top: '10px',\n // display: 'block',\n // transition: 'transform 300ms',\n // backgroundImage : 'url(\"/assets/icons/arrow.svg\")',\n // padding : '15px',\n // backgroundSize: 'contain',\n // backgroundPosition: 'center'\n // },\n // '&.is-open' : {\n // '&:after' : {\n // transform: 'rotateZ(180deg)'\n // }\n // },\n // '&.is-disabled' : {\n // opacity: '0.5',\n // backgroundColor: 'grey'\n // },\n // 'CustomTriggerCSS' : {\n // backgroundColor: 'lightcoral',\n // transition: 'background-color 200ms ease'\n // },\n // '.CustomTriggerCSS--open' : {\n // backgroundColor: 'darkslateblue'\n // },\n // '.Collapsible__Custom-sibling' : {\n // padding: '5px',\n // fontSize: '12px',\n // backgroundColor: '#CBB700',\n // color: 'black'\n // }\n // }\n marginTop: '2rem'\n }),\n atdwLoaction__click : css({\n position : 'absolute',\n width : '100%',\n height:'48px',\n zIndex: '99999',\n cursor: 'pointer'\n }),\n atdwDes : css({\n 'p' : {\n marginBottom : '1rem'\n },\n 'p:last-child' : {\n marginBottom : '0px'\n }\n }),\n serviceTiles : css({\n display: 'flex',\n alignItems: 'stretch',\n flexWrap: 'wrap',\n //justifyContent: 'space-between'\n justifyContent: 'start'\n }),\n\n info : css({\n 'ul, li' : {\n listStyle: 'none',\n margin: '0',\n padding: '0',\n display: 'inline-block',\n 'li' : {\n margin: '0 .7rem 0 0',\n padding: '0 .7rem 0 0',\n listStyle: 'none',\n borderRight: '1px solid black',\n lineHeight: '1',\n '&:last-of-type' : {\n borderRight: '0'\n }\n }\n },\n marginBottom:'0.5rem'\n }),\n\n flag : css({\n marginTop:'1rem',\n marginBottom:'0.5rem',\n 'ul, li' : {\n listStyle: 'none',\n margin: '0',\n padding: '0',\n display: 'inline-block',\n 'li' : {\n margin: '0 .7rem 0 0',\n padding: '0 .7rem 0 0',\n listStyle: 'none',\n //borderRight: '1px solid black',\n lineHeight: '1',\n // '&:last-of-type' : {\n // borderRight: '0'\n // }\n '&:last-child' : {\n marginRight: '0px',\n paddingRight:'0px'\n }\n }\n }\n }),\n contact_text : css(mq({\n fontSize: ['1.6rem', '1.8rem']\n })),\n gps_text : css(mq({\n display: ['inline-block', 'inline']\n })),\n\n booking__button : {\n svg : {\n transition: 'all 0.5s ease-in-out'\n },\n '&:hover' : {\n svg:{\n transform:'translateY(-3px)'\n },\n img : {\n transform:'scale(1.2)'\n }\n }\n },\n booking_button_image : {\n height: '32px',\n transition: 'all 0.5s ease-in-out',\n //margin : ['0px 10px', null, '0px 15px'],\n }\n}","import React, { useState, useEffect } from 'react';\nimport { useGet } from 'components';\nimport { Item } from 'cms/items/item';\nimport { NotFound } from 'components';\nimport env from 'env';\nimport { useStore } from \"store/storeProvider\";\nimport { ErrorPopup } from 'components';\n\nconst log = (...args) => {\n //console.log(args);\n}\nconst areEqual = (prevProps, nextProps) => {\n return (prevProps.pageData === nextProps.pageData)\n};\nconst PageMemo = React.memo(Page, areEqual)\n\nexport function ViewPartial() {\n const { dispatch } = useStore();\n const [pageLoaded, setPageLoaded] = useState(false);\n //const [page, setPage] = useState(null);\n //const path = usePath();\n //log('view page', path);\n const pathname = '/partials/common-footer';\n\n const get = useGet();\n log('0. viewpage ready');\n\n useEffect(() => {\n log('*. start loading')\n setPageLoaded(false);\n get.send(env.apiBase + \"/api/cms/GetPublishedPage?path=\" + pathname);\n // eslint-disable-next-line\n }, [pathname]);\n\n if (get.loading()) {\n return \n } else if (get.hasErrors()) {\n return \n Pet Friendly\n {\n handChangeForFilter({\n value: false,\n categoryCode: \"pet_friendly\"\n });\n }} />\n
\n } */}\n {\n filteredData.map((item, index) =>\n \n {item.filterName}\n {\n handChangeForFilter({\n filterId: item.filterId,\n value: false,\n categoryCode: item.categoryCode\n });\n }} />\n
\n )\n }\n \n \n \n
\n ); \n}","import { css } from '@emotion/core'\nimport { mq } from 'cssInJs'\n\nexport default {\n \n serviceTile : css(mq({\n flexGrow: '1',\n flexShrink: '0',\n \n // flexBasis: ['260px', '260px', '334px', '299px', '267px'],\n // maxWidth: ['100%', '100%', '334px', '299px', '267px'],\n flexBasis: ['100%', '48%', null, '32%', '32.3%'],\n maxWidth: ['100%', '49%', null, '33%', '32.3%'],\n\n margin: '10px 5px',\n backgroundColor : '#ebebeb',\n '& a' : {\n textDecoration : 'none',\n color : '#252525'\n },\n 'hr' : {\n height: '2px',\n border: '0px',\n backgroundImage: 'linear-gradient(90deg,#fe3a43,transparent)'\n },\n '&:hover' : {\n '.viewMore' : {\n display: 'block'\n },\n '.bg::after' : {\n content: '\"\"',\n backgroundColor: 'rgba(0,0,0,0.3)',\n position: 'absolute',\n width: '100%',\n height: '100%',\n top: '50%',\n transform: 'translateY(-50%)',\n }\n }\n })),\n bgContainer :css({\n paddingTop: '60%',\n position:'relative'\n }),\n bg : css({\n //paddingTop: '60%',\n backgroundSize: 'cover',\n backgroundPosition: 'center',\n width: '100%',\n height:'100%',\n position:'absolute',\n top:'0px'\n //position:'relative'\n }),\n town : css({\n padding : '0rem 0.5rem',\n backgroundColor : '#fe3a43',\n fontWeight : '700',\n color:'white',\n lineHeight: '1.1',\n paddingBottom:'3px',\n paddingTop:'2px'\n }),\n title : css({\n lineHeight:'1',\n fontWeight:'700',\n fontSize:'0.9rem',\n marginTop: '0.1rem'\n }),\n descContainer : css({\n padding : '0.2rem 0.5rem',\n paddingBottom : '0.5em',\n '& hr' :{\n margin : '0.3rem 0rem'\n }\n }),\n desc : css({\n fontSize : '0.8rem'\n }),\n shotDesc : css({\n fontSize : '0.8rem',\n marginTop: '0.2rem',\n textOverflow: 'ellipsis',\n display: '-webkit-box',\n WebkitLineClamp: '5',\n WebkitBoxOrient: 'vertical',\n overflow: 'hidden',\n minHeight: '6rem'\n }),\n viewMore : css({\n border: '3px solid white',\n position:'absolute',\n top:'50%',\n left:'50%',\n transform:'translate(-50%, -50%)',\n color:'white',\n padding:'0.5rem 1rem 7px',\n fontWeight:'700',\n display:'none',\n zIndex:'9',\n width: '150px'\n })\n}","/** @jsx jsx */\nimport { jsx } from '@emotion/core';\n//import { SiteLink } from 'components';\n//import cmsUtils from 'cms/utils/cmsUtils';\nimport utils from 'utils';\nimport style from './style';\nimport { Link } from 'react-router-dom';\n\nexport function ServiceTile(props){\n const service = props.service;\n const atdwName = props.atdwName;\n const slug = props.slug;\n const txacheckindate = props.txacheckindate;\n \n const getImageUrl = (() => {\n let imgUrl = '/assets/logos/logo.png';\n for(var i in service.serviceMultimedia){\n if(service.serviceMultimedia[i].attributeIdSizeOrientation === '4X3' && parseInt(service.serviceMultimedia[i].width) <= 800){\n imgUrl = service.serviceMultimedia[i].serverPath;\n break;\n }\n }\n return imgUrl;\n });\n \n return(\n //id={product.productId}\n //+ product.slug\n slug ?\n Gallery :
\n \n \n {/* \n
\n \n ![\"Caption\"](\"https://dummyimage.com/2560x800/333333/fff\")
\n
\n \n \n
*/}\n { \n multimedia2.map((item, index) => {\n return(\n \n ![{item[0].altText}/]({item[0].serverPath})
\n
\n )\n })\n }\n \n \n \n \n \n \n \n \n \n
: null\n )\n}","/** @jsx jsx */\nimport { jsx } from '@emotion/core';\nimport { useState, useEffect, Fragment, useRef } from 'react';\nimport env from 'env';\nimport { useRouter, NotFound } from 'components';\nimport Slider from \"react-slick\";\nimport style from './style';\nimport { MdDirections, MdCall, MdWeb } from \"react-icons/md\";\nimport { FaCircle } from \"react-icons/fa\";\n//import { SiteLink } from 'components';\n//import Collapsible from 'react-collapsible';\nimport { ViewPartial } from 'cms/pages/partials/viewPartial';\n//import { MetaTag } from 'components';\n//import utils from 'utils';\nimport { PhotoGallery } from '../photoGallery/view';\nimport { ServiceTile } from '../serviceTile/view';\nimport { Loading, MetaTag } from 'components';\nimport { gtm } from '../../../lib/tracking';\nimport utils from '../../../utils';\nimport { useStore } from '../../../store';\n\nfunction AtdwService(props){\n const services = props.services;\n const atdwName = props.atdwName;\n const slugs = props.slugs;\n const txacheckindate = props.txacheckindate;\n\n const getSlugName = ((serviceName)=>{\n for(var i in slugs){\n if(slugs[i].serviceName === serviceName){\n return slugs[i];\n }\n }\n });\n\n return (\n \n \n
\n\n \n
\n \n VIEW MORE\n
\n \n { atdwName }\n
\n \n
\n
\n \n \n { service.serviceName }\n
\n \n
\n { service.serviceDescription }\n
\n \n
\n )\n}\n\nfunction AtdwPageBaner(props){\n const multimedia = props.multimedia;\n const primaryPhone = props.primaryPhone;\n const siteUrl = props.siteUrl;\n const bookingUrl = props.bookingUrl;\n\n const settings = {\n dots: false,\n infinite: true,\n speed: 1500,\n autoplaySpeed: 3000,\n fade: true,\n autoplay: true,\n slidesToShow: 1,\n slidesToScroll: 1\n };\n //media={'(min-width:' + _item.width + 'px)'}\n return(\n \n {services.map((item, index) =>
\n \n \n {\n item.map((_item, _index) => {\n return(\n ![\"image2\"/](\"/assets/logos/logo2.png\")
\n \n
\n )\n })\n }\n \n \n {\n primaryPhone === '' ? null : (\n \n ![\"booking_icon\"](\"/assets/book-now-icon.png\")
\n
\n PHONE
\n \n )\n }\n\n {\n document.getElementById('atdwPageLocation').scrollIntoView({behavior:'smooth', block:'center'});\n }}>\n
\n\n {\n siteUrl === '' ? null : (\n \n LOCATION
\n WEBSITE
\n \n )\n }\n\n {\n bookingUrl === '' ? null : (\n \n {/* \n BOOKINGS
\n \n )\n }\n \n// {item.attributeIdCommunicationDescription + ' : ' + item.communicationDetail}\n//
\n// )\n// })\n// }\n//\n// {\n// dates.map((item, index) => {\n// var pDate = new Date(item.frequencyStartDate);\n// if( pDate >= todayDate){\n// return(\n//
\n// \n// { \n// ((''+ pDate.getDate()).length < 2 ? '0' + pDate.getDate() : ''+pDate.getDate()) + '-' +\n// ((''+(pDate.getMonth() + 1)).length < 2 ? '0' + (pDate.getMonth() + 1) : ''+(pDate.getMonth() + 1)) + '-' +\n// pDate.getFullYear() + ' : ' +\n// item.frequencyStartTime\n// }\n//
\n// )\n// }\n// return null;\n// })\n// }\n// Features
\n\n {\n features.map((item, index) =>{\n return(\n
\n \n
\n )\n })\n }\n ![\"image2\"/](\"/assets/icons/big4.jpg\"){kind=icon}
\n \n
: null\n )\n });\n\n return(\n\n - \n {result}\n
{ 'Contact ' + productName }
\n{ address + ' SA ' + postCode}
\n\n {/* {'GPS: South ' + geoCode.lat + ' East ' + geoCode.lng} */}\n { 'GPS: South ' + geoCode.lat } \n { 'East ' + geoCode.lng } \n
\n \n
\n {\n getFlag()\n }\n\n {\n bookingUrl === '' ? null : (\n - \n
- \n \n { primaryPhone }\n \n \n
- \n \n Email Us\n \n \n
- \n \n {'Visit The ' + productName + ' Website' }\n \n \n
\n \n BOOK NOW \n \n
\n )\n }\n\n \n \n {/* \n */}\n
\n\n {text}
)\n )\n }\n \n return( \n\n \n \n
: (atdwProduct.error === \"error\" ? \n \n
\n \n \n \n }\n\n {\n atdwProduct.multimedia.length > 0 &&\n
\n { atdwProduct.product.productName}
\n{ atdwProduct.product.cityName}
\n\n
\n\n {\n atdwProduct.bookingUrl !== '' &&\n \n \n BOOK NOW \n \n
\n }\n\n \n
\n {\n atdwProduct.product.services.length > 0 &&\n Room Type :
\n\n
\n ' +\n '
'\n // contet : \"' + _el.productName + '
' + \n '' + _el.town + '
' + \n '' + _el.address + ' ' + _el.town + '
' + \n '' + _el.shortDesc + '
' + \n '\n //
\";\n });\n // marker.addListener('click', function(){\n // infowindow.open(map, marker);\n // });\n \n var isMobile = false;\n //var isMobile = true;\n if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) {\n isMobile = true;\n }\n \n marker.addListener('mouseover', function(){\n if(!isMobile) {\n infowindow.open(map, marker);\n }\n });\n marker.addListener('mouseout', function(){ \n if(!isMobile) {\n infowindow.close();\n }\n });\n marker.addListener('click', function(){\n if(isMobile) {\n setPopupData({\n productName : _el.productName,\n address : _el.address,\n town : _el.town,\n desc : _el.shortDesc,\n slug : _el.slug\n });\n setOpenPopup(true); \n }\n else{\n history.push('/atdwproduct/' + _el.slug);\n }\n });\n });\n } \n return _new;\n });\n }\n fetchData();\n }, [mapSate, history]);\n\n const switchMap = useCallback((value)=>{\n setMapSate(pre=>{\n let _new = {...pre};\n _new.fetchAble = true;\n //_new.currentFilterType = value;\n _new.currentFilterArea = value;\n return _new;\n });\n }, []);\n\n const Filters = (() => {\n return(\n {{ model.productName }}
\n // {{ model.address + ' '+ model.town }}
\n // {{ model.shortDesc }}
\n //\n \n \n \n \n \n \n \n\n \n\n \n\n \n\n \n\n \n \n \n \n \n
\n )\n });\n \n return(\n \n \n {\n openPopup && \n \n \n \n }\n \n
\n )\n}","import { css } from '@emotion/core'\nimport { mq } from 'cssInJs'\n\nexport default {\n tileSize : css(mq({\n //border : '1px solid red',\n position : 'relative',\n height : ['300px', '450px'],\n backgroundImage:'url(\"/assets/logos/logo.png\")',\n backgroundPosition:'center',\n backgroundSize:'contain',\n backgroundRepeat: 'no-repeat',\n 'img' : {\n //border : '1px solid red'\n position : 'absolute',\n top: '50%',\n left: '50%',\n transform: 'translate(-50%, -50%)',\n width: '100%',\n '@media(max-width:600px)' : {\n height : '100%',\n width: 'auto'\n }\n }\n })),\n productName : css({\n //textAlign : 'center',\n margin : '0px'\n }),\n serviceName : css({\n //textAlign : 'center',\n margin : '0px'\n }),\n serviceDes : css({\n marginTop:'1rem',\n marginBottom:'1rem'\n }),\n banerIconsBar : css({\n textAlign : 'center',\n backgroundColor : '#fe3a43',\n padding : '0.3rem 0',\n display : 'flex',\n flexDirection : 'row',\n flexWrap : 'wrap',\n justifyContent : 'center',\n 'svg' : {\n width : '32px',\n height : '32px',\n color : 'white'\n },\n // '.bar__item' : {\n // margin : '0px 20px',\n // cursor : 'pointer',\n // '&:hover' : {\n // textDecoration : 'unset'\n // }\n // },\n '.bar__item' : mq({\n margin : ['0px 15px', null, '0px 20px'],\n cursor : 'pointer',\n '&:hover' : {\n textDecoration : 'unset'\n }\n }),\n '.bar__item.booking__button' :mq({\n margin : ['0px 10px', null, '0px 15px'],\n }),\n '.icon__text' : {\n fontSize : '.6rem',\n color : '#fff'\n },\n '@media(max-width:600px)' : {\n marginTop:'-7px'\n }\n // '&.dock' : mq({\n // position:'fixed',\n // top:['50px', '44px', '56px'],\n // width: '100%',\n // zIndex:'9'\n // })\n }),\n contact_text : css(mq({\n fontSize: ['1.6rem', '1.8rem']\n })),\n gps_text : css(mq({\n display: ['inline-block', 'inline']\n })),\n info : css({\n 'ul, li' : {\n listStyle: 'none',\n margin: '0',\n padding: '0',\n display: 'inline-block',\n 'li' : {\n margin: '0 .7rem 0 0',\n padding: '0 .7rem 0 0',\n listStyle: 'none',\n borderRight: '1px solid black',\n lineHeight: '1',\n '&:last-of-type' : {\n borderRight: '0'\n }\n }\n },\n marginBottom:'0.5rem'\n }),\n flag : css({\n marginTop:'1rem',\n marginBottom:'0.5rem',\n 'ul, li' : {\n listStyle: 'none',\n margin: '0',\n padding: '0',\n display: 'inline-block',\n 'li' : {\n margin: '0 .7rem 0 0',\n padding: '0 .7rem 0 0',\n listStyle: 'none',\n //borderRight: '1px solid black',\n lineHeight: '1',\n // '&:last-of-type' : {\n // borderRight: '0'\n // }\n '&:last-child' : {\n marginRight: '0px',\n paddingRight:'0px'\n }\n }\n }\n }),\n\n booking__button : {\n svg : {\n transition: 'all 0.5s ease-in-out'\n },\n '&:hover' : {\n svg:{\n transform:'translateY(-3px)'\n },\n img : {\n transform:'scale(1.2)'\n }\n }\n },\n booking_button_image : mq({\n height: '32px',\n transition: 'all 0.5s ease-in-out',\n //margin : ['0px 10px', null, '0px 15px'],\n })\n}","/** @jsx jsx */\nimport { jsx } from '@emotion/core';\nimport { useState, useEffect, Fragment, useRef } from 'react';\nimport env from 'env';\nimport { useRouter } from 'components';\nimport Slider from \"react-slick\";\nimport style from './style';\nimport { FaCircle } from \"react-icons/fa\";\nimport { ViewPartial } from 'cms/pages/partials/viewPartial';\nimport { MdDirections, MdCall, MdWeb } from \"react-icons/md\";\nimport { useStore } from '../../../store';\n\nfunction ServicePageBanner(props){\n //console.log(\"props11111111\", props);\n const multimedia = props.multimedia;\n const settings = {\n dots: false,\n infinite: true,\n speed: 1500,\n autoplaySpeed: 3000,\n fade: true,\n autoplay: true,\n slidesToShow: 1,\n slidesToScroll: 1\n };\n\n const primaryPhone = props.primaryPhone || '';\n const siteUrl = props.siteUrl || '';\n const bookingUrl = props.bookingUrl || '';\n\n return(\n \n \n
\n \n
\n { popupData.productName }
\n { popupData.town }
\n { popupData.address + ' ' + popupData.town }
\n { popupData.desc }
\n\n \n \n
\n \n \n {\n item.map((_item, _index) => {\n return(\n \n
\n )\n })\n ) : \n \n \n {/* */}\n
\n }\n */}\n \n {\n primaryPhone === '' ? null : (\n \n
\n PHONE
\n \n )\n }\n {\n document.getElementById('atdwPageLocation').scrollIntoView({behavior:'smooth', block:'center'});\n }}>\n
\n\n {\n siteUrl === '' ? null : (\n \n LOCATION
\n WEBSITE
\n \n )\n }\n {\n (bookingUrl && bookingUrl !== '') &&\n \n \n BOOKINGS
\n \n }\n Features
\n\n {\n features.map((item, index) =>{\n return(\n
\n \n
\n )\n })\n }\n \n \n
: null\n )\n});\n\n return(\n - \n {result}\n
\n\n
\n )\n}\n\nexport function ServicePage(){\n const { dispatch } = useStore();\n const slug = useRouter().query.slug;\n const [atdwService, setAtdwService] = useState({\n service : null,\n product : null,\n multimedia : [],\n features : [],\n flag : [],\n bookingUrl : ''\n });\n\n const txacheckindate = new URLSearchParams(window.location.search).get(\"txacheckindate\");\n console.log(\"txacheckindate\", txacheckindate);\n console.log(\"new URLSearchParams(window.location.search)\", new URLSearchParams(window.location.search));\n\n useEffect(()=>{\n const fetchData = async () => {\n const res = await fetch(env.apiBase + \"/api/atdw/getservice/\" + slug);\n const data = await res.json();\n\n if(data !== 'error'){\n setAtdwService(pre=>{\n let _new = {...pre};\n _new.service = data.service;\n _new.product = data.product;\n\n let va = [];\n for(var i = 0; i < _new.service.multimedia.length; i++){\n if(i === 0){\n va.push(_new.service.multimedia[i]);\n }\n\n if(_new.service.multimedia[i].attributeIdMultimediaContent === 'IMAGE' &&\n _new.service.multimedia[i].attributeIdSizeOrientation === '4X3' &&\n parseInt(_new.service.multimedia[i].width) >= 800 ){\n va.push(_new.service.multimedia[i]);\n }\n\n if(_new.service.multimedia[i].attributeIdMultimediaContent === 'IMAGE' &&\n _new.service.multimedia[i].attributeIdSizeOrientation === '4X3' &&\n parseInt(_new.service.multimedia[i].width) >= 800 ){\n va.push(_new.service.multimedia[i]);\n }\n\n if(i === (_new.service.multimedia.length - 1) && va.length > 0){\n let _images = va;\n va = [];\n _new.multimedia.push(_images);\n }\n }\n\n _new.service.attributes.forEach(el => {\n if(el.attributeTypeId === \"SVC FAC\"){\n _new.features.push(el);\n }\n });\n\n _new.product.additionalData.attributes.forEach(el => {\n if(el.attributeTypeId === \"MEMBERSHIP\"){\n _new.flag.push(el);\n }\n });\n\n if(_new.product.additionalData.bookingUrl && _new.product.additionalData.bookingUrl !== ''){\n _new.bookingUrl = _new.product.additionalData.bookingUrl.includes(\"http\") ? _new.product.additionalData.bookingUrl : 'https://' + _new.product.additionalData.bookingUrl; \n if(_new.bookingUrl.includes(\"//book.txa.com.au/v4/Pages/\")){\n _new.bookingUrl = _new.bookingUrl + ((txacheckindate && txacheckindate !== \"\") ? txacheckindate : '');\n } \n }\n\n if(_new.product.txaCode && _new.product.txaCode !== ''){\n _new.bookingUrl = \"https://book.txa.com.au/v4/Pages/Availability.aspx?exl_dn=SAParks_web&exl_psn=\" + _new.product.txaCode + \"&exl_ad=2&exl_ch=0&exl_dte=\" + ((txacheckindate && txacheckindate !== \"\") ? txacheckindate : '');\n }\n\n dispatch({type:'SET_STATE', payload : {preParkName : _new.product.productName }});\n\n return _new;\n });\n }\n };\n fetchData();\n\n // eslint-disable-next-line\n }, [slug]);\n\n return(\n { 'Contact ' + productName }
\n{ address + ' SA ' + postCode}
\n\n {/* {'GPS: South ' + geoCode.lat + ' East ' + geoCode.lng} */}\n { 'GPS: South ' + geoCode.geocodeGdaLatitude } \n { 'East ' + geoCode.geocodeGdaLongitude } \n
\n \n
\n {\n getFlag()\n }\n {\n bookingUrl === '' ? null : (\n - \n
- \n \n { primaryPhone }\n \n \n
- \n \n Email Us\n \n \n
- \n \n {'Visit The ' + productName + ' Website' }\n \n \n
\n \n BOOK NOW \n \n
\n )\n }\n\n\n \n {/* \n */}\n
\n \n \n \n \n
: null\n }\n \n
\n \n
\n { atdwService.product.productName}
\n{ atdwService.service.serviceName}
\n\n {atdwService.service.serviceDescription}\n
\n\n {\n atdwService.bookingUrl !== '' &&\n //\n // \n // BOOK NOW \n // \n //
\n \n \n BOOK NOW \n \n
\n }\n\n \n {\n atdwData &&
\n )\n}","/** @jsx jsx */\nimport { jsx } from '@emotion/core';\nimport { Fragment, useContext } from 'react';\n//import { SiteLink } from 'components';\n//import cmsUtils from 'cms/utils/cmsUtils';\nimport utils from 'utils';\nimport style from './style';\nimport { Link } from 'react-router-dom';\nimport { AtdwContext } from '../index';\n\nexport function AtdwTile(props){\n\n const product = props;\n const fromCalled = props.fromCalled || \"\";\n const _atdwContext = useContext(AtdwContext);\n const checkPetFriendly = product.checkPetFriendly || false;\n\n //console.log(\"product ---\", product);\n \n const changeUpperCases = ((str) => {\n return str.replace(/\\w\\S*/g, function(txt){return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();});\n });\n\n return(\n \n {\n if(fromCalled !== \"search\"){\n //_atdwContext.setupAtdwDataHistory2(product.productId);\n }\n else{\n //console.log(\"ASFDsdfsdfsfdkj\");\n }\n }}>\n
\n )\n}","/** @jsx jsx */\nimport { jsx } from '@emotion/core';\n//import { useState, useEffect } from 'react';\nimport style from './style';\nimport { AtdwTile } from '../tile/view';\n\nexport function AtdwSearchResult(props){\n\n const atdwDatas = props.atdwData || [];\n const fromCalled = props.fromCalled || \"\";\n \n return(\n \n {\n (checkPetFriendly && checkPetFriendly === true) &&\n \n \n }\n
\n \n 
\n
\n \n \n \n {product.town === product.town.toUpperCase() ? changeUpperCases(product.town) : product.town }\n
\n \n
\n {/*
\n \n \n { product.productName === product.productName.toUpperCase() ? changeUpperCases(product.productName) : product.productName }\n
\n \n {/*
\n {\n product.additionalData.PRODUCTTYPES.map((item, index)=> {\n if(product.additionalData.PRODUCTTYPES.length === (index + 1)){\n return(\n {item.productTypeDescription}\n )\n }\n else{\n return (\n {item.productTypeDescription} | \n )\n }\n })\n }\n
*/}\n \n {product.shortDesc}\n
\n \n
\n )\n}","/** @jsx jsx */\nimport { jsx } from '@emotion/core';\nimport { useEffect, Fragment } from 'react';\nimport env from 'env';\nimport { SiteLink} from 'components';\nimport { usePost } from 'components';\nimport { ErrorPopup, Loading } from 'components';\nimport { useRouter } from 'components';\nimport { AtdwSearchResult } from '../atdw/searchResult/view';\n\nexport function SearchResult(props) {\n \n const { query } = useRouter();\n const post = usePost();\n const keyword = query.q;\n //const keyword = query.search;\n //console.log(keyword);\n\n useEffect(() => {\n \n console.log('keyword', keyword);\n \n post.send(env.apiBase + '/api/search/search', { keyword: keyword });\n \n \n \n // eslint-disable-next-line\n }, [keyword]);\n\n if (post.loading()) {\n return \n { atdwDatas.map((item, index) =>
\n \n // No result found.\n //
\n // )\n return (\n \n
\n } \n {\n pages.length > 0 &&\n ATDW
\n\n
\n }\n Pages
\n\n No results\n
\n }\n \n {pages.map((page, index) =>\n
\n );\n}","import React from 'react';\nimport cmsUtils from 'cms/utils/cmsUtils';\nimport utils from 'utils';\nimport { SearchResult } from 'site/searchResult/searchResult';\nimport { AppVersion } from '../../../components';\n\nexport function Code(props) {\n const item = props.item;\n //const subItems = item.items || [];\n const cmsOption = props.cmsOption || {};\n\n //console.log('item', item, cmsOption);\n\n const code = cmsUtils.payload(item, 'Code');\n const codeType = cmsUtils.payload(item, 'CodeType');\n let controls = null;\n if (codeType === 'Json') {\n const codeJson = JSON.parse(code);\n if (codeJson.control === 'search-results'){\n controls = \n
\n )}\n \n {page.pageTitle} \n \n
\n \n
\n )\n else if (codeType === 'Text')\n return (\n \n )\n else\n return (\n \nCode Type: {codeType}\n{code}} \n {controls}
\n )\n}\n","import React from 'react';\nimport cmsUtils from 'cms/utils/cmsUtils';\nimport utils from 'utils';\nimport { SiteLink } from 'components';\n\nexport function BlogPosts(props) {\n const item = props.item;\n const cmsOption = props.cmsOption || {};\n\n //console.log('item', item);\n\n const posts = getPages(cmsUtils.payload(item, 'BlogPosts'));\n const numOfTileLines = parseInt(cmsUtils.payload(item, 'NumOfTileLines', '2'));\n //console.log(numOfPost, parseInt(numOfPost));\n //console.log(posts);\n const bp = utils.ui.getCurrentBreakpoint();\n const tilesPerLine = {xs:1, sm:1, md:2, lg:2, xl:3, xxl:4}\n const numOfPost = numOfTileLines * (tilesPerLine[bp] || 3);\n const step = numOfPost;\n console.log(bp, numOfTileLines, tilesPerLine, numOfPost)\n\n const [tilesToShow, setTilesToShow] = React.useState(numOfPost);\n\n const displayingPosts = posts.length > tilesToShow ? posts.slice(0, tilesToShow) : posts;\n const showMore = posts.length > displayingPosts.length;\n\n const pageTileElts = displayingPosts.map((page, index) =>\n \n {pageTileElts}\n
\n {showMore && (\n { setTilesToShow(tilesToShow + step) }}>LOAD MORE
)}\n \n );\n}\n\nfunction getPages(pagesSerialized) {\n if (pagesSerialized) {\n return JSON.parse(pagesSerialized);\n }\n return [];\n}\n\nfunction Tile(props) {\n const page = props.page;\n const imageUrl = utils.site.resourcePath(page.imageUrl);\n const disableLink = props.disableLink;\n return (\n \n \n \n \n
\n )\n}","import React from 'react';\nimport cmsUtils from 'cms/utils/cmsUtils';\nimport utils from 'utils';\n\nexport function BlogPostTitle(props) {\n const item = props.item;\n const cmsOption = props.cmsOption || {};\n\n //console.log('item', item);\n\n const title = cmsUtils.payload(item, 'PageTitle');\n\n const cssClass = utils.classNames('cms_item', item.cssClass || item.anchorName || '');\n\n return (\n \n
\n \n
\n \n {page.pageTitle}\n
\n \n {page.tileDesc || page.description}\n
\n READ MORE
\n \n
\n );\n}\n","//import { css, keyframes } from '@emotion/core'\n//import { variables, mq } from 'cssInJs'\n\nimport { css } from '@emotion/core'\nimport { mq } from 'cssInJs'\n\nexport default {\n multiColumnPanelMain : css({\n maxWidth : '960px',\n margin : 'auto',\n '& .container' : mq({\n marginLeft: ['auto',null,null,null,'-15px'],\n marginRight: ['auto',null,null,null,'-15px']\n })\n })\n}","//import React from 'react';\nimport cmsUtils from 'cms/utils/cmsUtils';\nimport { Item } from 'cms/items/item';\nimport utils from 'utils';\n\n/** @jsx jsx */\nimport { jsx } from '@emotion/core'\nimport style from './style';\n\nexport function MultiColumnPanel(props){\n const item = props.item;\n const mobileReverse = cmsUtils.payload(item, 'MobileReverse', 'no');\n //const subItems = item.items || [];\n const subItems = (mobileReverse === \"yes\" && window.innerWidth <= 550) ? item.items.reverse() || [] : item.items || [];\n const cmsOption = props.cmsOption || {};\n const columnWidths = cmsUtils.payload(item, 'ColumnWidths').split(\",\");\n const mobileColumnWidths = cmsUtils.payload(item, 'MobileColumnWidths').split(\",\");\n const countItem = {countD : 0, countM : 0, col : \"\"};\n\n const bgColor = cmsUtils.payload(item, 'BgColor');\n //const textColorTheme = cmsUtils.payload(item, 'TextColorTheme');\n const imageUrl = cmsUtils.payload(item, 'ImageUrl');\n const backgroundTile = cmsUtils.payload(item, 'BackgroundTile');\n const bgTheme = cmsUtils.payload(item, 'TextColorTheme') || 'white';\n \n let bgUrl = null;\n if (imageUrl)\n bgUrl = utils.site.resourcePath(imageUrl);\n else if (backgroundTile)\n bgUrl = utils.site.resourcePath(`/dist/transparent-textures/textures/${backgroundTile}`);\n\n const cssClass = utils.classNames('cms_item', 'contentPanel', 'multiColumnPanel', 'contentPanel--' + bgTheme, item.cssClass || item.anchorName || ''); \n\n function setupClass(index){ \n countItem.col = \"\";\n if(columnWidths.length === countItem.countD){\n countItem.countD = 0;\n }\n\n if(mobileColumnWidths.length === countItem.countM){\n countItem.countM = 0;\n }\n \n countItem.col = \"col-sm-\" + columnWidths[countItem.countD] + \" col-\" + mobileColumnWidths[countItem.countM];\n countItem.countD ++;\n countItem.countM ++;\n };\n\n const subItemsElts = subItems.map((subItem, index) => {\n setupClass();\n return {title}
\n\n
\n } \n );\n return (\n \n
\n \n {subItemsElts}\n
\n \n
\n )\n}","import React, { useState, useEffect, useContext, createContext } from \"react\";\nimport * as firebase from \"firebase/app\";\nimport \"firebase/auth\";\nimport config from '../../../config';\n\n// Add your Firebase credentials\nfirebase.initializeApp(config.firebaseSettings);\n\nconst authContext = createContext();\n\n// Provider component that wraps your app and makes auth object ...\n// ... available to any child component that calls useAuth().\nexport function ProvideAuth({ children }) {\n const auth = useProvideAuth();\n return \n \n
\n PHONE
\n \n\n {\n if(document.getElementById('atdwpagelocation')){\n document.getElementById('atdwpagelocation').scrollIntoView({behavior:'smooth', block:'center'});\n }\n }}>\n
\n\n \n LOCATION
\n WEBSITE
\n \n\n \n BOOKINGS
\n \n \n
)\n}","/** @jsx jsx */\nimport { jsx } from '@emotion/core'\n//import cmsUtils from '../../cms/utils/cmsUtils';\nimport utils from '../../utils';\n//import style from './style';\nimport { Login as LoginA, useAuth } from '../../auth/index'\nimport { useRouter, SiteLink } from 'components';\n\nexport function Login(props){\n const item = props.item;\n const cmsOption = props.cmsOption || {};\n const cssClass = utils.classNames('cms_item', 'login', item.cssClass || item.anchorName || '');\n const _useAusth = useAuth();\n const router = useRouter();\n \n return(\n Log In
\n\n {/*
\n \n \n\n {/*
\n \n Or Log in with \n
\n\n \n \n
\n \n \n Forgot Password?\n \n
\n \n Don't have an account? Sign Up\n
*/}\n \n {\n cmsOption.isCmsEdit ?\n
\n )\n}","import { css } from '@emotion/core'\n//import { mq } from 'cssInJs'\n\nexport default {\n formContainer : css({\n maxWidth:'550px',\n margin: 'auto',\n padding: '1rem 0px'\n })\n}","/** @jsx jsx */\nimport { jsx } from '@emotion/core'\n//import cmsUtils from '../../cms/utils/cmsUtils';\nimport utils from '../../utils';\nimport style from './style';\nimport { useAuth } from '../../auth/index'\n//import { useRouter } from 'components';\nimport { useState, useEffect } from 'react';\nimport env from 'env';\nimport { Loading } from 'components';\nimport { Redirect } from 'react-router-dom';\n\nexport function ChangeDetails(props){\n \n const item = props.item;\n const cmsOption = props.cmsOption || {};\n const cssClass = utils.classNames('cms_item', 'login', item.cssClass || item.anchorName || '');\n \n const _auth = useAuth();\n const [info, setInfo] = useState();\n const [buttonTrigger, setButtonTrigger] = useState(0);\n const [pageLoading, setPageLoading] = useState(true);\n const [redirect, setRedirect] = useState(false);\n const [msg, setMsg] = useState();\n \n const handChange = (el => {\n const elName = el.target.name;\n const elValue =el.target.value;\n setInfo({...info, [elName] : elValue});\n });\n\n function onSubmit(e) {\n e.preventDefault(); \n e.stopPropagation();\n setPageLoading(true);\n setMsg(null);\n setButtonTrigger(buttonTrigger + 1);\n }\n\n useEffect(() => { \n if(_auth.session && !_auth.session.expired() && !cmsOption.isCmsEdit){\n const fetchData = async () => {\n const res = await fetch(env.apiBase + '/api/profile/getuserprofile/' + _auth.session.uid, {\n method : 'get',\n headers: { 'Authorization': `Bearer ${_auth.session.token}` }\n });\n const data = await res.json();\n if(data.errors.length === 0){\n setInfo({\n organisation : data.results.userInfo.organisation || '',\n name : data.results.userInfo.name || '',\n password : '',\n checkPassword : false,\n passwordClue : data.results.userInfo.passwordClue || '',\n email : data.results.userInfo.email || '',\n token : _auth.session.token\n });\n setPageLoading(false);\n }\n }\n fetchData();\n }\n else{\n return;\n }\n }, [ _auth.session, cmsOption.isCmsEdit ]);\n\n useEffect(() => {\n if(buttonTrigger === 0){\n return;\n }\n const fetchData = async () => {\n const res = await fetch(env.apiBase + '/api/profile/updateinfo', {\n method : 'post',\n headers: { \n 'Content-Type': 'application/json',\n 'Authorization': `Bearer ${_auth.session.token}`\n },\n body: JSON.stringify(info)\n });\n const data = await res.json();\n console.log(data);\n if(data.errors.length === 0){\n setInfo({\n organisation : data.results.userInfo.organisation || '',\n name : data.results.userInfo.name || '',\n password : '',\n checkPassword : false,\n passwordClue : data.results.userInfo.passwordClue || '',\n email : data.results.userInfo.email || '',\n token : _auth.session.token\n });\n setTimeout(() => {\n setPageLoading(false);\n if(data.results.resetPassword === true){\n _auth.signout().then(user => {\n setRedirect(true);\n }); \n }\n }, 2000);\n }\n else{\n setMsg(data.errors[0].errorMessage);\n setPageLoading(false);\n }\n }\n fetchData();\n setButtonTrigger(0);\n }, [buttonTrigger, info, _auth]);\n\n return(\n\n \n Login Item \n:\n (_useAusth.session && !_useAusth.session.expired() ?\n
\n \n
:\n // \n \n
\n )\n }\n \n \n Forgot Password?\n \n \n About SA Parks\n \n
\n \n {\n cmsOption.isCmsEdit ?\n
\n )\n}","//import { css, keyframes } from '@emotion/core'\n//import { variables, mq } from 'cssInJs'\n\nimport { css } from '@emotion/core'\nimport { mq } from '../../cssInJs'\n\nexport default {\n \n photoGallery : css({\n maxWidth : '960px',\n margin: 'auto'\n }),\n \n photos : css({\n marginLeft: '-5px',\n marginRight: '-5px',\n '& > div' : {\n display: 'flex',\n flexWrap: 'wrap'\n }\n // display: 'flex',\n // flexWrap: 'wrap',\n // marginLeft: '-5px',\n // marginRight: '-5px',\n // '& img' : {\n // flex: '1 1 150px',\n // margin: '5px',\n // paddingTop : '60%',\n // width : '150px',\n // border: '1px solid red'\n // }\n }),\n // photoContainer : css({\n // //color : 'red',\n // flex: '1 1 150px',\n // margin : '5px',\n // height : '150px',\n // display: 'flex',\n // overflow: 'hidden',\n // cursor:'pointer'\n // }),\n photoContainer : css(mq({\n //color : 'red',\n flexGrow: '1',\n flexShrink: '1',\n flexBasis: ['160px', '150px'],\n //flexBasis: ['145px', '150px'],\n maxWidth:['167px', '150px'],\n margin : '5px',\n height : '150px',\n display: 'flex',\n overflow: 'hidden',\n cursor:'pointer'\n })),\n photo : css({\n margin : 'auto',\n transform: 'scale(3)'\n }),\n photoEmpty : css({\n flex: '1 1 150px',\n height : '0px'\n })\n}","/** @jsx jsx */\nimport { jsx } from '@emotion/core'\nimport style from './style';\n\nimport SimpleReactLightbox, {SRLWrapper} from 'simple-react-lightbox'\nimport utils from 'utils';\nimport cmsUtils from 'cms/utils/cmsUtils';\n\nconst options = {\n enablePanzoom : false,\n showCaption : false\n};\n\nexport function PhotoGallery(props){\n const item = props.item;\n const cmsOption = props.cmsOption || {};\n const cssClass = utils.classNames('cms_item', 'photoGallery', item.cssClass || item.anchorName || '');\n const _images = cmsUtils.payload(item, 'ImageUrl') ? cmsUtils.payload(item, 'ImageUrl').split(\"|\") : [];\n \n const imageElts = _images.map((im, index) =>\n \n Change Details \n: (\n pageLoading ?
\n 
\n
\n );\n \n return(\n \n \n \n
\n ); \n}","import { css } from '@emotion/core'\nimport { mq } from 'cssInJs'\n\nexport default {\n sliderAdPanel: css({\n marginTop: '20px',\n marginBottom: '20px',\n backgroundColor: 'transparent',\n overflow:'hidden',\n '& .slick-prev:before, .slick-next:before': {\n color: 'black',\n display:'none'\n },\n '& .slick-next': {\n right: '-2%'\n },\n '& .slick-prev': {\n left: '-2%'\n }\n }),\n sliderImageWrapper: {\n height: '100%'\n },\n sliderImageWrapper2: {\n height: '100%',\n display: 'flex',\n alignItems: 'center',\n padding: '0 5px',\n flexDirection: 'column',\n //margin: 'auto',\n //maxWidth: '500px'\n },\n // sliderImage: css({\n // //width: 'auto !important',\n // //height:'100% !important',\n // //display: 'block !important',\n // margin: 'auto',\n // //maxHeight: '180px'\n // })\n sliderImage : mq({\n margin: 'auto',\n width: ['100%','unset']\n })\n}","/** @jsx jsx */\nimport { jsx } from '@emotion/core';\nimport style from './style';\nimport Slider from \"react-slick\";\nimport utils from '../../../utils';\nimport cmsUtils from '../../../cms/utils/cmsUtils';\nimport { SiteLink } from '../../../components';\nimport { useMemo } from 'react';\n\nexport function SliderAdPanel(props) {\n const item = props.item;\n //console.log('item', item);\n //const defaultDesH = 220;\n const subItems = item.items || [];\n //console.log(subItems.length);\n\n const shuffledSubItems = useMemo(() => {\n const shuffled = JSON.parse(JSON.stringify(subItems));\n var currentIndex = shuffled.length, temporaryValue, randomIndex;\n while(0 !== currentIndex){\n randomIndex = Math.floor(Math.random() * currentIndex);\n currentIndex -= 1;\n\n temporaryValue = shuffled[currentIndex];\n shuffled[currentIndex] = shuffled[randomIndex];\n shuffled[randomIndex] = temporaryValue;\n }\n\n //console.log(\"1\", shuffled);\n return shuffled;\n\n // eslint-disable-next-line\n }, []);\n \n const cmsOption = props.cmsOption || {};\n const cssClass = utils.classNames('cms_item', 'sliderAdPanel', item.cssClass || item.anchorName || '');\n\n function sendEventToGa(item){\n window.dataLayer.push(Object.assign({ event: 'AdEvent' }, {\n 'eventCategory' : item.eCategory,\n 'eventAction' : item.eAction,\n 'eventLabel' : item.eLabel,\n 'eventValue' : item.eValue,\n }));\n }\n \n const sliderAdItems = shuffledSubItems.map((subItem, index) => {\n\n const imageUrl = cmsUtils.payload(subItem, 'ImageUrl');\n const imageUrl2 = cmsUtils.payload(subItem, 'ImageUrl2');\n const bottomText = cmsUtils.payload(subItem, 'BottomText');\n const linkUrl = cmsUtils.payload(subItem, 'LinkUrl');\n const currentImageUrl = window.innerWidth <= 600 ? imageUrl2 : imageUrl;\n const eTracking = cmsUtils.payload(subItem, 'Event_tracking');\n\n return (\n \n \n {/* \n
\n \n \n
\n \n \n
*/}\n { imageElts }\n \n \n \n \n \n \n \n \n {\n (linkUrl && linkUrl !== '') ? \n \n : \n \n
\n )\n }\n );\n\n var numOfSlides = (maxNum) => subItems.length >= maxNum ? maxNum : subItems.length\n\n var settings = {\n dots: false,\n infinite: true,\n speed: 1500,\n autoplaySpeed: 3000,\n ////fade: true,\n autoplay: true,\n slidesToShow: numOfSlides(1),\n //slidesToShow: 3,\n slidesToScroll: numOfSlides(1),\n // responsive: [\n // { breakpoint: 1024, settings: { slidesToShow: numOfSlides(5), slidesToScroll: numOfSlides(1) } },\n // { breakpoint: 992, settings: { slidesToShow: numOfSlides(4), slidesToScroll: numOfSlides(1) } },\n // { breakpoint: 768, settings: { slidesToShow: numOfSlides(3), slidesToScroll: numOfSlides(1) } },\n // { breakpoint: 576, settings: { slidesToShow: numOfSlides(2), slidesToScroll: numOfSlides(1)} }\n // ]\n };\n\n return (\n {\n\n const data = { \n eCategory : cmsUtils.payload(subItem, 'Event_category'),\n eAction : cmsUtils.payload(subItem, 'Event_action'),\n eLabel : cmsUtils.payload(subItem, 'Event_label'),\n eValue : cmsUtils.payload(subItem, 'Event_value')\n }\n sendEventToGa(data);\n } : null}> \n 
\n
\n {bottomText}
\n \n \n
\n }\n {bottomText}
\n \n \n {sliderAdItems}\n \n
\n );\n}","/** @jsx jsx */\nimport { jsx } from \"@emotion/core\";\nimport React from \"react\";\nimport env from \"../../../../env\";\nimport { usePost, Button, ErrorMessage } from \"../../../../components\";\nimport { useForm } from \"../../../../form\";\nimport { getSignupFormModel } from \"./signupFormModel\";\nimport cmsUtils from \"cms/utils/cmsUtils\";\nimport utils from \"utils\";\nimport { useState, useEffect } from \"react\";\nimport { createPortal } from \"react-dom\";\n\nfunction Portal({ children }) {\n const [el] = useState(document.createElement(\"div\"));\n useEffect(() => {\n let mount = document.getElementById(\"portal-root\");\n mount.appendChild(el);\n return () => mount.removeChild(el);\n }, [el]);\n return createPortal(children, el);\n}\n\nexport function SignupForm(props) {\n const item = props.item;\n // const emailReceiver = cmsUtils.payload(item, \"EmailReceiver\");\n const emailReceiver = props.emailReceiver;\n\n const boxTitle = cmsUtils.payload(item, \"Title\");\n const boxSubTitle = cmsUtils.payload(item, \"SubTitle\");\n const backgroundImg = cmsUtils.payload(item, \"ImageUrl\");\n const [modalOpen, setModalOpen] = useState(false);\n useEffect(() => {\n const timer = setTimeout(() => {\n setModalOpen(true);\n }, 3000);\n return () => clearTimeout(timer);\n }, []);\n const model = getSignupFormModel({});\n const form = useForm(model, { usePlaceholder: true });\n const [sendingStatus, setSendingStatus] = React.useState(null);\n const post = usePost();\n\n function onSubmit(e) {\n form.validateForm(e, () => {\n const value = { ...form.getValue(), emailReceiver: emailReceiver };\n // var files = form.getFiles();\n // var formData = new FormData();\n // formData.append(\"jsonData\", JSON.stringify(value));\n // files.forEach((file) => {\n // (file.files || []).forEach((uploadFile) => {\n // formData.append(file.name, uploadFile);\n // });\n // });\n // post.sendFormData(env.apiBase + \"/api/signup/send\", formData);\n post.send(env.apiBase + \"/api/signup/send\", value);\n setSendingStatus(\"pending\");\n });\n\n // console.log(\"submitting\");\n }\n\n if (post.done() && sendingStatus === \"pending\") {\n form.reset(model);\n setSendingStatus(null);\n }\n\n const render = (name) => form.renderControl(name, null);\n\n return (\n \n {modalOpen && (\n \n {modalOpen && (\n
\n )}\n \n )}\n \n );\n}\n","import { fb, validators } from \"../../../../lib/form\";\n\nexport function getSignupFormModel(data) {\n const model = fb.group({\n name: [\n data.name || \"\",\n [validators.Required()],\n { label: \"Full Name\", type: \"text\" },\n ],\n email: [\n data.email || \"\",\n [validators.Required(), validators.Email()],\n { label: \"Email\", type: \"email\" },\n ],\n });\n\n return model;\n}\n","import React from \"react\";\nimport { BannerPanel } from \"cms/items/bannerPanel/view\";\nimport { BannerItem } from \"cms/items/bannerItem/view\";\nimport { Panel } from \"cms/items/panel/view\";\nimport { Html } from \"cms/items/html/view\";\nimport { TestimonialPanel } from \"cms/items/testimonialPanel/view\";\nimport { TestimonialItem } from \"cms/items/testimonialItem/view\";\nimport { ImagePanel } from \"cms/items/imagePanel/view\";\nimport { PageTiles } from \"cms/items/pageTiles/view\";\nimport { SingleBanner } from \"cms/items/singleBanner/view\";\nimport { ContactForm } from \"cms/items/contactForm/view\";\nimport { YoutubeBannerPanel } from \"cms/items/youtubeBannerPanel/view\";\nimport { Code } from \"cms/items/code/view\";\nimport { BlogPosts } from \"cms/items/blogPosts/view\";\nimport { BlogPostTitle } from \"cms/items/blogPostTitle/view\";\nimport { MultiColumnPanel } from \"components/multiColumnPanel/view\";\nimport { NonAtdwPageInfoBar } from \"components/NonAtdwPageInfoBar/view\";\nimport { Login } from \"components/login/view\";\nimport { ChangeDetails } from \"components/changeDetails/view\";\nimport { PhotoGallery } from \"components/photoGallery/view\";\nimport { SliderAdPanel } from \"components/SliderAd/index\";\nimport { SignupForm } from \"cms/items/signupForm/view/signupForm\";\nimport {\n AtdwSearch,\n AtdwSearchV2,\n AtdwMap,\n MixedListings,\n} from \"site/atdw/index\";\n\nexport function Item(props) {\n const item = props.item;\n //const subItems = item.items || [];\n const cmsOption = props.cmsOption || {};\n //console.log('item', item, subItems, cmsOption);\n let itemElt = <>;\n if (item.itemTypeCode === \"Panel\") {\n itemElt = \n \n
\n \n \n setModalOpen(false)}\n >\n \n
\n \n 
\n
\n \n {boxTitle}
\n{boxSubTitle}
\n\n
\n {render(\"name\")}
\n \n
\n {render(\"email\")}
\n \n
\n \n
\n \n \n \n Successfully sent!\n \n )}\n
\n *Unsubscribe anytime.
\n\n By continuing, I agree to SA-Parks's{\" \"}\n Privacy Policy\n
\n{item.itemTypeCode}
;\n }\n // const subItemsElts = subItems.map((subItem, index) =>\n // \n {sectionItems}\n
\n )\n );\n}\n\nfunction Section(props) {\n log('5. section rendering')\n const item = props.item;\n //const sectionName = item.sectionName;\n const subItems = item.items || [];\n const cmsOption = props.cmsOption || {};\n if (!subItems || subItems.length === 0)\n return (<>);\n const subItemsElts = subItems.map((subItem, index) =>\n <\\/p>/g, '');\n //editor.insertHtml(evt.data.dataValue); return false;\n setTimeout(function () {\n CKEDITOR.instances.cmsCurrentEditor.setData(CKEDITOR.instances.cmsCurrentEditor.getData());\n }, 100);\n }, null, null, 9);\n }\n\n close($editor = null) {\n const CKEDITOR = window['CKEDITOR'] || {};\n //console.log('ckeditor close');\n if (typeof CKEDITOR.instances.cmsCurrentEditor != \"undefined\")\n CKEDITOR.instances.cmsCurrentEditor.destroy();\n\n //for (var instance in CKEDITOR.instances) {\n // CKEDITOR.instances[instance].destroy();\n //}\n\n }\n}\n","import { CmsRadioSender } from './cms-radio-sender'\nimport { CmsRadioReceiver } from './cms-radio-receiver'\nimport { CmsHtmlEditor } from './cms-html-editor'\nimport env from 'env';\n\n// declare var CKEDITOR: any;\n// import * as $ from 'jquery';\n\n\nexport class CmsPageController {\n settings;//: any;\n sender;//: CmsRadioSender;\n receiver;//: CmsRadioReceiver;\n htmlEditor;//: CmsHtmlEditor;\n\n constructor() {\n this.settings = { root: \"body\", viewOnly: false };\n this.sender = new CmsRadioSender(this);\n this.receiver = new CmsRadioReceiver(this);\n this.htmlEditor = new CmsHtmlEditor(env.cmsEndpoint, this.sender);\n }\n init(options) {\n const $ = window['jQuery'];\n this.settings = Object.assign({}, /*default*/{ root: \"body\", viewOnly: false }, options);\n this.initGlobalVars();\n\n var self = this;\n $(\"[onclick]\").prop(\"onclick\", null);\n $(\"[dblclick]\").prop(\"dblclick\", null);\n $(self.settings.root).off(\"click dblclick\", \"*\");\n $(self.settings.root).on(\"click dblclick\", \"*\", function (e) {\n //$(\".cms_html_editor_img_selected\").removeClass(\"cms_html_editor_img_selected\");\n // console.log($(e.target).hasClass(\"allowClick\"));\n // console.log(e.target);\n\n if (!$(e.target).hasClass(\"allowClick\")) {\n e.stopPropagation();\n e.preventDefault();\n }\n\n if ($(this).attr(\"contenteditable\") === \"true\" ||\n $(\"#cms_html_editor_source_id\").is(\":visible\")) {\n e.stopPropagation();\n return;\n }\n if (!self.settings.viewOnly)\n self.selectItem($(this), false, e.type === \"dblclick\");\n });\n\n if (self.settings.viewOnly) return; // stop the editing logic for viewonly mode.\n\n // ctrl + s for html block\n $(self.settings.root).on('keydown', \"#cmsCurrentEditor\", function (e) {\n if (e.ctrlKey && e.which === 83) {\n //var itemId = $(this).data(\"cms-item-id\");\n //if (!itemId)\n // itemId = $(this).closest(\"[data-cms-item-id]\").data(\"cms-item-id\");\n //window.parent.cms.site.saveHtml(itemId);\n //e.preventDefault();\n\n self.sender.saveAllDirtyHtml(self.getAllDirtyHtml());\n return false;\n }\n });\n }\n\n selectItemFromController(id) {\n const $ = window['jQuery'];\n var item = $(\".cms_item[data-cms-item-id='\" + id + \"']\");\n this.scrollTo(item);\n this.selectItem(item, true);\n }\n\n selectItem($item, fromController, doubleclicked = false) {\n //console.log(\"select item - \" + fromController + \" - \" + doubleclicked);\n //console.log($item);\n var editor = $item.closest(\"[contenteditable]\");\n if (editor.length > 0)\n return;\n var cke_top = $item.closest(\".cke_top\");\n if (cke_top.length > 0)\n return;\n\n this.closeEditingItem();\n //console.log($item);\n if (typeof $item === \"undefined\") return;\n if ($item.length === 0) return;\n this.findItem($item, fromController, 0, doubleclicked);\n }\n\n closeEditingItem() {\n const $ = window['jQuery'];\n //console.log(\"close editing item\");\n $(\"[contenteditable]\").removeAttr(\"contenteditable\");\n $(\"#cms_hovermenu\").remove();\n $(\".cms_editing_item\").removeClass(\"cms_editing_item\");\n\n }\n\n findItem($item, fromController, depth, doubleclicked) {\n if (depth > 100) return false;\n // console.log($item, fromController, depth, doubleclicked)\n if (typeof $item.attr(\"data-cms-html\") !== \"undefined\" && $item.attr(\"data-cms-html\") === \"true\") {\n $item.attr(\"contenteditable\", \"true\");\n this.showHtmlEditor($item);\n }\n if (typeof $item.attr(\"data-cms-item-id\") !== \"undefined\") {\n //$item.attr(\"contenteditable\", \"true\");\n $item.addClass(\"cms_editing_item\");\n if (!fromController) {\n //window.parent.cms.site.selectControllerItem($item.attr(\"data-cms-item-id\"),\n // typeof doubleclicked != \"undefined\" && doubleclicked == true\n //);\n this.sender.selectControllerItem({\n id: $item.attr(\"data-cms-item-id\"),\n openEdit: typeof doubleclicked !== \"undefined\" && doubleclicked === true\n });\n\n }\n\n //show_hovermenu($item);\n\n } else {\n var editableParent = $item.parents(\".cms_item[data-cms-item-id], [data-cms-html]\");\n if (editableParent.length > 0)\n this.findItem(editableParent.first(), fromController, depth + 1, doubleclicked);\n\n }\n }\n\n sameContent(a, b) {\n return a === b;\n }\n\n showHtmlEditor($item) {\n const $ = window['jQuery'];\n var editor = $item;\n //console.log(editor);\n //var $menu = $(\"#cms_html_editor_ctrl\");\n ////$menu.css(\"top\", $item.offset().top - 40);\n ////$menu.css(\"left\", $item.offset().left);\n //$menu.show();\n //initHtmlEditor($item);\n\n if (editor.attr(\"id\") === \"cmsCurrentEditor\") return;\n\n $(\"#cmsCurrentEditor\").attr(\"id\", \"\");\n this.htmlEditor.close(editor);\n\n editor.attr(\"id\", \"cmsCurrentEditor\");\n //editor.data(\"current-content\", editor.html());\n\n this.htmlEditor.show(editor);\n //setHandlers($item);\n\n }\n\n\n initGlobalVars() {\n const $ = window['jQuery'];\n window[\"cmsPage\"] = $.extend({}, window[\"cmsPage\"] || {}, {\n htmleditor: {\n // cmsPage.htmleditor.getAnchors();\n getAnchors: function (opt) {\n //var options = $.extend({}, opt);\n //console.log(options);\n var anchors = [];\n\n $(\"a[name]\").each(function (inx, obj) {\n anchors.push({ id: $(obj).attr(\"id\"), name: $(obj).attr(\"name\") });\n });\n\n $(\"[data-cms-item-name],[data-cms-anchor]\").each(function (inx, obj) {\n if (typeof $(obj).attr(\"data-cms-anchor\") !== \"undefined\" && $(obj).attr(\"data-cms-anchor\") !== \"\" && $(obj).parents(\".owl-item\").length === 0) {\n anchors.push({ id: null, name: $(obj).attr(\"data-cms-anchor\") });\n } else if ($(obj).attr(\"data-cms-item-name\") !== \"\" && $(obj).parents(\".owl-item\").length === 0) {\n anchors.push({ id: null, name: $(obj).attr(\"data-cms-item-name\") });\n }\n });\n\n return anchors;\n }\n }\n });\n }\n\n scrollTo(target) {\n const $ = window['jQuery'];\n if (typeof target === \"undefined\") return;\n if ($(target).length === 0) return;\n var htmlbody = $('html,body');\n var top = 0;\n if ($(target).height() > $(window).height())\n top = $(target).offset().top;\n else {\n top = $(target).offset().top - Math.floor(($(window).height() - $(target).height()) / 2);\n }\n //console.log(top);\n //htmlbody.animate({ scrollTop: top }, 500, 'easeInOutQuint');\n htmlbody.animate({ scrollTop: top }, 500);\n }\n\n getCurrentHtml() {\n const CKEDITOR = window['CKEDITOR'] || {};\n try {\n return CKEDITOR.instances.cmsCurrentEditor.getData();\n } catch (e) { return \"\"; }\n }\n\n getAllDirtyHtml() {\n const $ = window['jQuery'];\n var self = this;\n var htmlChanges = [];\n $(\".dirtyHtml\").each(function (inx, obj) {\n var $section = $(obj);\n var content = $section.is(\"#cmsCurrentEditor\") ? // if the html editor is active, it needs to get the html from the editor.\n self.getCurrentHtml() : $section.html();\n if ($section.is(\"[data-cms-section-id]\")) {\n // section level?\n let $item = $section.closest(\"[data-cms-item-id]\");\n htmlChanges.push({ ItemId: $item.data(\"cms-item-id\"), SectionId: $section.data(\"cms-section-id\"), Content: content });\n } else if ($section.is(\"[data-cms-item-id]\")) {\n // section level?\n let $item = $section;\n htmlChanges.push({ ItemId: $item.data(\"cms-item-id\"), SectionId: \"Content\", Content: content });\n }\n });\n return htmlChanges;\n }\n\n getHtml(itemid: any) {\n const $ = window['jQuery'];\n this.htmlEditor.close();\n var self = this;\n var item = $(\".cms_item[data-cms-item-id='\" + itemid + \"']\");\n\n var formvals = { Content: this.cms_replace_item_html(item) };\n\n //cms_msg_progressing(\"#save_message\", \"Saving...\");\n if ($(\"[data-cms-section-id]\", item).length > 0) {\n $(\"[data-cms-section-id]\", item).each(function (inx, section) {\n var closestItemId = $(section).closest(\".cms_item\").data(\"cms-item-id\");\n if (closestItemId === itemid) {\n var id = $(section).attr(\"data-cms-section-id\");\n formvals[id] = self.cms_replace_item_html($(section)); //.find(\">:first-child\")().html();\n\n }\n });\n }\n return formvals;\n }\n\n cms_replace_item_html(item) {\n return item.html();\n // var $tmp = $(\"
\").html(item.html());\n // if ($tmp.find('.cms-skeleton').length > 0)\n // return $tmp.find('.cms-skeleton').html();\n // else\n // return item.html();\n //tmp.find(\".cms_ctrl_in_editor\").each(function (inx, obj) {\n // var ctrlid = $(obj).attr(\"data-cms-ctrl-id\");\n // $(obj).replaceWith(\"__cms__ctrl:\" + ctrlid + \"__\");\n //});\n //return tmp.html();\n }\n\n}\n","import React, { useEffect } from 'react';\nimport { useRouter } from 'components';\nimport { useGet } from 'components';\nimport { Item } from 'cms/items/item';\nimport env from 'env';\nimport { loadJs } from 'lib/net-loader';\nimport { CmsPageController } from 'cms/services/cms-page-controller';\nimport { ErrorPopup } from 'components';\n\n// function useQuery() {\n// return new URLSearchParams(useLocation().search);\n// }\n\nexport function EditPage(props) {\n //const [page, setPage] = useState(null);\n\n //const pageId = props.pageId;\n const { query } = useRouter();\n const { cmsViewMode = 'edit', id } = query;\n const pageId = id;\n\n //console.log(pageId, cmsViewMode, env.apiBase, env)\n\n const get = useGet();\n useEffect(() => {\n get.send(env.apiBase + '/api/cms/GetPage/' + pageId + '?cmsViewMode=' + cmsViewMode);\n // eslint-disable-next-line\n }, [pageId]);\n\n if (get.loading()) {\n returnLoading...
\n } else if (get.hasErrors()) {\n return \n {sectionItems}\n
\n );\n}\n\n\nfunction Section(props) {\n const item = props.item;\n //const sectionName = item.sectionName;\n const subItems = item.items || [];\n const cmsOption = props.cmsOption || {};\n\n if (!subItems || subItems.length === 0)\n return (<>);\n\n const subItemsElts = subItems.map((subItem, index) =>\n \n \n \n
);\n}\n\nfunction MenuItem(props) {\n const [subMenuOpened, setSubMenuOpened] = useState(false);\n const item = props.item;\n const subItems = item.items || [];\n const currentLocation = props.currentLocation;\n\n const _useAusth = props._useAusth;\n\n const subItemsElts = subItems.length > 0? subItems.map((subItem, index) =>\n \n 
\n
\n \n - \n {subItemsElts}\n
- \n {subItemsElts}\n
![\"logo\"](\"/assets/logos/logo.png\"){kind=logo}
*/}\n {link.title}
\n Register now to access the Members area
\n \n\n \n \n \n \n \n \n \n \n \n \n
\n \n
\n );\n}\n\nfunction App() {\n \n const [atdwDataHistory, setAtdwDataHistory] = useState(null);\n const [atdwDataHistory2, setAtdwDataHistory2] = useState(null);\n const [atdwTxaCheckInDate, setAtdwTxaCheckInDate] = useState(null);\n\n function setupAtdwDataHistory(value){\n console.log(\"setupAtdwDataHistory\");\n setAtdwDataHistory(value);\n }\n\n function setupAtdwDataHistory2(value){\n console.log(\"setupAtdwDataHistory2\");\n setAtdwDataHistory2(value);\n }\n\n function setupAtdwTxaCheckInDate(value){\n console.log(\"atdwTxaCheckInDate\");\n setAtdwTxaCheckInDate(value);\n }\n \n return (\n \n \n
\n {/* */}\n \n \n \n \n \n \n \n \n\n \n
\n {/*