\n \n {experiences.map(experience => (\n (isUnfolded && experience.showInMenu) ? (\n experienceHanler(experience)}\n >{getExperienceIcon(experience)}\n \n ) : null\n ))}\n
\n );\n};\n\nexport default Menu;\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport { isMobile, isSafari } from 'react-device-detect';\nimport { useStoreActions } from 'easy-peasy';\nimport { MaximizeButton, MinimizeButton } from '../../../shared/svg/components';\n\nconst FooterCreditsFullScreen = ({ isMaximized, onMaximize, onMinimize }) => {\n const setLegalNoteOpened = useStoreActions(actions => actions.setLegalNoteOpened);\n const onLegalNoteHandler = () => {\n setLegalNoteOpened(true);\n };\n\n return (\n \n {/* \n Aviso Legal\n \n 
\n {(isMobile && isSafari) ? null : (\n \n )}\n
\n );\n};\n\nFooterCreditsFullScreen.propTypes = {\n isMaximized: PropTypes.bool.isRequired,\n onMaximize: PropTypes.func.isRequired,\n onMinimize: PropTypes.func.isRequired,\n};\n\nexport default FooterCreditsFullScreen;\n","import React, { useEffect } from 'react';\nimport { useStoreActions, useStoreState } from 'easy-peasy';\nimport PropTypes from 'prop-types';\nimport FooterCreditsFullScreen from './Component/FooterCreditsFullScreen';\nimport {\n BizLogo,\n FreeNavigation,\n OrbitPointSelectionLeftArrow,\n OrbitPointSelectionRightArrow,\n} from '../../shared/svg/components';\nimport freeNavigation from '../../shared/svg/components/FreeNavigation';\n\nconst Footer = ({ isMaximized, onMaximize, onMinimize }) => {\n const settings = useStoreState(state => state.settings);\n const orbitPoints = useStoreState(state => state.orbitPoints);\n const currentOrbitPoint = useStoreState(state => state.currentOrbitPoint);\n const isFreeNavigationEnabled = useStoreState(state => state.isFreeNavigationEnabled);\n const setCurrentOrbitPoint = useStoreActions(actions => actions.setCurrentOrbitPoint);\n const enableFreeNavigation = useStoreActions(actions => actions.enableFreeNavigation);\n const sendMessageToIframe = useStoreActions(actions => actions.sendMessageToIframe);\n\n useEffect(() => {\n setCurrentOrbitPoint(0);\n }, []);\n\n const orbitPointHandler = (column) => {\n setCurrentOrbitPoint(column);\n sendMessageToIframe({ type: 'keypoint', value: column });\n };\n\n const freeNavigationHandler = () => {\n if (!isFreeNavigationEnabled) {\n enableFreeNavigation();\n sendMessageToIframe({ type: 'free-navigation', value: '' });\n }\n };\n\n return (\n |
\n |
*/}\n by
\n \n
\n);\n};\n\nFooter.propTypes = {\n isMaximized: PropTypes.bool.isRequired,\n onMaximize: PropTypes.func.isRequired,\n onMinimize: PropTypes.func.isRequired,\n};\n\nexport default Footer;\n","import React, { useRef } from 'react';\nimport { useStoreActions, useStoreState } from 'easy-peasy';\n\nconst IframePlayer = () => {\n const currentExperience = useStoreState(state => state.currentExperience);\n const ref = useRef();\n\n return (\n \n 
\n {/*
\n \n
*/}\n {settings.client}
\n {settings.promotion}
\n \n \n {orbitPoints.map((orbitPoint) => {\n const isPointSelected = currentOrbitPoint !== null && orbitPoint.id === currentOrbitPoint.id;\n return (\n orbitPointHandler(orbitPoint.column)}\n className=\"orbit-point\"\n >\n
\n {orbitPoint.name}
\n \n
\n\n );\n};\n\nexport default IframePlayer;\n","import React from 'react';\nimport { useStoreActions, useStoreState } from 'easy-peasy';\nimport PropTypes from 'prop-types';\nimport FooterCreditsFullScreen from './Component/FooterCreditsFullScreen';\nimport {\n AerialIcon, BackFromExperienceArrow, ConfiguratorIcon, MultimediaIcon, SolarSimulationIcon, TourIcon, VistasIcon,\n} from '../../shared/svg/components';\nimport { ExperienceType } from '../../model/constants';\nimport Footer from './Footer';\n\nconst FooterExperience = ({ isMaximized, onMaximize, onMinimize }) => {\n const currentExperience = useStoreState(state => state.currentExperience);\n const closeExperience = useStoreActions(actions => actions.closeExperience);\n\n const closeHandler = () => {\n closeExperience();\n };\n\n const getExperienceIcon = () => {\n if (currentExperience === null) return '';\n switch (currentExperience.type) {\n case ExperienceType.Aerial:\n return \n
\n );\n};\n\nFooterExperience.propTypes = {\n isMaximized: PropTypes.bool.isRequired,\n onMaximize: PropTypes.func.isRequired,\n onMinimize: PropTypes.func.isRequired,\n};\n\nexport default FooterExperience;\n","import React from 'react';\n\n// project imports\nimport { useStoreActions, useStoreState } from 'easy-peasy';\nimport { CloseButton } from '../../shared/svg/components';\n\nconst LegalNote = () => {\n const settings = useStoreState(state => state.settings);\n const isLegalNoteOpened = useStoreState(state => state.isLegalNoteOpened);\n const setLegalNoteOpened = useStoreActions(actions => actions.setLegalNoteOpened);\n\n return (isLegalNoteOpened\n && (\n \n \n
\n \n {getExperienceIcon()}\n
\n {getExperienceTitleFirstPart()}
\n {getExperienceTitleSecondPart()}
\n \n \n
\n ));\n};\nexport default LegalNote;\n","import React from 'react';\nimport PropTypes from 'prop-types';\n\nconst VideoItem = ({ src }) => (\n \n setLegalNoteOpened(false)}\n >\n
\n \n
\n Aviso Legal
\n \n \n
\n);\n\nVideoItem.propTypes = {\n src: PropTypes.string.isRequired,\n};\n\nexport default VideoItem;\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport Iframe from 'react-iframe';\n\nconst TourItem = ({ src }) => (\n \n
\n );\n\nTourItem.propTypes = {\n src: PropTypes.string.isRequired,\n};\n\nexport default TourItem;\n","import React from 'react';\nimport PropTypes from 'prop-types';\n\nconst RenderItem = ({ src }) => (\n \n
\n);\nRenderItem.propTypes = {\n src: PropTypes.string.isRequired,\n};\n\nexport default RenderItem;\n","import React from 'react';\nimport Slider from 'react-slick';\nimport PropTypes from 'prop-types';\nimport VideoItem from './Items/VideoItem';\nimport TourItem from './Items/TourItem';\nimport RenderItem from './Items/RenderItem';\n\nconst Carousel = ({ items, settings }) => {\n const drawContent = (content) => {\n console.log(`drawContent called, content: ${ content}`);\n switch (content.type) {\n case 'video':\n return (\n
\n );\n};\n\nexport default GalleryPlayer;\n","import React from 'react';\nimport { useStoreState } from 'easy-peasy';\nimport { BizionarLogoFull, ExperiencePreloader } from '../../shared/svg/components';\n\nconst Loader = () => {\n const loadingProgress = useStoreState(state => state.loadingProgress);\n return (loadingProgress < 100) ? (\n \n
\n ) : null;\n};\n\nexport default Loader;\n","import React from 'react';\nimport { useStoreState } from 'easy-peasy';\nimport { FullScreen, useFullScreenHandle } from 'react-full-screen';\nimport { Modal } from 'reactstrap';\nimport OrbitPlayer from '../Player/OrbitPlayer';\nimport Menu from '../Layout/Menu';\nimport Footer from '../Layout/Footer';\nimport IframePlayer from '../Player/IframePlayer';\nimport FooterExperience from '../Layout/FooterExperience';\nimport LegalNote from '../LegalNote/LegalNote';\nimport ShowContentTypeGallery from '../Show-ToDelete/ContentGallery/ShowContentTypeGallery';\nimport GalleryPlayer from '../Player/GalleryPlayer';\nimport Loader from '../Loader/Loader';\n\nconst ShowRoom = () => {\n const isIFrameExperienceOpened = useStoreState(state => state.isIFrameExperienceOpened);\n const isGalleryExperienceOpened = useStoreState(state => state.isGalleryExperienceOpened);\n const handle = useFullScreenHandle();\n return (\n \n \n
\n \n \n
\n {loadingProgress !== 0 ? {loadingProgress}%
: null}\n \n
\n Las viviendas mostradas se tratan de viviendas tipo que pueden variar en función de la tipología. Asimismo, el mobiliario, electrodomésticos, la decoración y los elementos de ambientación, tales como espejos, mamparas, luminarias y otros que aparecen en el contenido, son de carácter meramente ornamental y para fines estrictamente comerciales, no siendo objeto de contratación.\"\n },\n orbitPoints: [\n {\n id: \"framePoint01\",\n name: \"SECTOR ESTE\",\n column: 0\n },\n {\n id: \"navPoint02\",\n name: \"SECTOR NORTE\",\n column: 109\n },\n {\n id: \"navPoint03\",\n name: \"SECTOR OESTE\",\n column: 143\n },\n {\n id: \"navPoint04\",\n name: \"SECTOR SUR\",\n column: 237\n }\n ],\n experiences: [\n {\n id: ExperienceType.Aerial,\n type: ExperienceType.Aerial,\n url: \"https://media.bizionar.digital/retamar/tour-aerea/index.html\",\n showInMenu: true,\n },\n {\n id: ExperienceType.TourParqueLineal,\n type: ExperienceType.TourParqueLineal,\n url: \"https://media.bizionar.digital/retamar/tour-parque-lineal/index.html\",\n showInMenu: true,\n },\n {\n id: ExperienceType.Gallery,\n type: ExperienceType.Gallery,\n showInMenu: true,\n },\n {\n id: ExperienceType.SolarSimulation,\n type: ExperienceType.SolarSimulation,\n url: \"https://solar-simulation-showroom.bizionar.digital/bizionar/showroom-demo/live\",\n showInMenu: false,\n },\n {\n id: ExperienceType.Configurator,\n type: ExperienceType.Configurator,\n url: \"https://configurator-metaverse-presentation-hte3filkt5u1bli1.bizionar.digital/promotora/urban-residential/\",\n showInMenu: false,\n },\n {\n id: ExperienceType.PisoPiloto,\n type: ExperienceType.PisoPiloto,\n url: \"https://media.bizionar.digital/bizionar/showroom-demo/tour-interior/index.html\",\n showInMenu: false,\n },\n {\n id: ExperienceType.VistasReales,\n type: ExperienceType.VistasReales,\n url: \"https://media.bizionar.digital/bizionar/showroom-demo/tour-vistas-reales/index.html\",\n showInMenu: false,\n },\n {\n id: ExperienceType.ZonasComunes,\n type: ExperienceType.ZonasComunes,\n url: \"https://media.bizionar.digital/bizionar/showroom-demo/tour-zonas-comunes/index.html\",\n showInMenu: false,\n },\n ],\n iframe: null,\n isIFrameExperienceOpened: false,\n isGalleryExperienceOpened: false,\n currentExperience: null,\n currentOrbitPoint: null,\n isFreeNavigationEnabled: false,\n isLegalNoteOpened: false,\n loadingProgress: 0,\n\n // TODO: currentContent WIP\n currentContent: [\n {\n name: 'Render 01',\n src: 'https://media.bizionar.digital/retamar/render/retamar_Camera_1.jpg',\n type: 'render'\n },\n {\n name: 'Render 01',\n src: 'https://media.bizionar.digital/retamar/render/retamar_Camera_2.jpg',\n type: 'render'\n },\n {\n name: 'Render 01',\n src: 'https://media.bizionar.digital/retamar/render/retamar_Camera_3.jpg',\n type: 'render'\n },\n {\n name: 'Render 01',\n src: 'https://media.bizionar.digital/retamar/render/retamar_Camera_4.jpg',\n type: 'render'\n },\n {\n name: 'Render 01',\n src: 'https://media.bizionar.digital/retamar/render/retamar_Camera_5.jpg',\n type: 'render'\n },\n {\n name: 'Render 01',\n src: 'https://media.bizionar.digital/retamar/render/retamar_Camera_6.jpg',\n type: 'render'\n },\n {\n name: 'Render 01',\n src: 'https://media.bizionar.digital/retamar/render/retamar_Camera_7.jpg',\n type: 'render'\n },\n {\n name: 'Render 01',\n src: 'https://media.bizionar.digital/retamar/render/retamar_Camera_8.jpg',\n type: 'render'\n },\n {\n name: 'Render 01',\n src: 'https://media.bizionar.digital/retamar/render/retamar_Camera_9.jpg',\n type: 'render'\n },\n {\n name: 'Render 01',\n src: 'https://media.bizionar.digital/retamar/render/retamar_Camera_10.jpg',\n type: 'render'\n },\n {\n name: 'Render 01',\n src: 'https://media.bizionar.digital/retamar/render/retamar_Camera_11.jpg',\n type: 'render'\n },\n {\n name: 'Render 01',\n src: 'https://media.bizionar.digital/retamar/render/retamar_Camera_12.jpg',\n type: 'render'\n },\n {\n name: 'Render 01',\n src: 'https://media.bizionar.digital/retamar/render/retamar_Camera_13.jpg',\n type: 'render'\n },\n {\n name: 'Render 01',\n src: 'https://media.bizionar.digital/retamar/render/retamar_Camera_14.jpg',\n type: 'render'\n },\n {\n name: 'Render 01',\n src: 'https://media.bizionar.digital/retamar/render/retamar_Camera_15.jpg',\n type: 'render'\n },\n {\n name: 'Render 01',\n src: 'https://media.bizionar.digital/retamar/render/retamar_Camera_16.jpg',\n type: 'render'\n },\n {\n name: 'Render 01',\n src: 'https://media.bizionar.digital/retamar/render/retamar_Camera_17.jpg',\n type: 'render'\n },\n {\n name: 'Render 01',\n src: 'https://media.bizionar.digital/retamar/render/street/cam01.jpg',\n type: 'render'\n },\n {\n name: 'Render 02',\n src: 'https://media.bizionar.digital/retamar/render/street/cam02.jpg',\n type: 'render'\n },\n {\n name: 'Render 03',\n src: 'https://media.bizionar.digital/retamar/render/street/cam03.jpg',\n type: 'render'\n },\n {\n name: 'Render 04',\n src: 'https://media.bizionar.digital/retamar/render/street/cam04.jpg',\n type: 'render'\n },\n {\n name: 'Render 05',\n src: 'https://media.bizionar.digital/retamar/render/street/cam05.jpg',\n type: 'render'\n },\n {\n name: 'Render 06',\n src: 'https://media.bizionar.digital/retamar/render/street/cam06.jpg',\n type: 'render'\n },\n {\n name: 'Render 07',\n src: 'https://media.bizionar.digital/retamar/render/street/cam07.jpg',\n type: 'render'\n },\n ],\n\n // Actions\n setCurrentOrbitPoint: action((state, column) => {\n state.currentOrbitPoint = state.orbitPoints.find(orbitPoint => orbitPoint.column === column);\n state.isFreeNavigationEnabled = false;\n }),\n enableFreeNavigation: action((state) => {\n state.isFreeNavigationEnabled = true;\n state.iframe.contentWindow.postMessage(JSON.stringify({\n type: \"enable-free-navigation\",\n value: \"\"\n }), '*');\n state.currentOrbitPoint = null;\n }),\n openExperience: action((state, experience) => {\n state.currentExperience = experience;\n\n if (experience.type === ExperienceType.Gallery) {\n state.isGalleryExperienceOpened = true;\n state.isIFrameExperienceOpened = false;\n } else {\n state.isIFrameExperienceOpened = true;\n state.isGalleryExperienceOpened = false;\n }\n }),\n closeExperience: action((state, iframe) => {\n state.currentExperience = null;\n state.isIFrameExperienceOpened = false;\n state.isGalleryExperienceOpened = false;\n }),\n setIframe: action((state, iframe) => {\n state.iframe = iframe;\n }),\n sendMessageToIframe: action((state, data) => {\n state.iframe.contentWindow.postMessage(JSON.stringify(data), '*');\n }),\n receivedMessageFromIframe: action((state, data) => {\n console.log('Message received from Iframe, event.data: ', data);\n console.log (\"data.source:\" + data.source);\n if (data.type === undefined) return;\n\n switch (data.type) {\n case \"loader\":\n const progress = data.value;\n state.loadingProgress = Math.round(progress);\n break;\n\n case \"loading-complete\":\n state.iframe.contentWindow.postMessage(JSON.stringify({\n type: \"initialize-keypoints\",\n value: state.orbitPoints\n }), '*');\n break;\n\n case \"free-navigation-enabled\":\n state.isFreeNavigationEnabled = true;\n state.currentOrbitPoint = null;\n break;\n case \"hotspot\":\n const experienceType = data.value.split(\"_\")[0];\n const experience = state.experiences.find(e => e.type === experienceType);\n\n switch (experienceType) {\n case ExperienceType.VistasReales:\n const floor = data.value.split(\"_\")[1];\n state.currentExperience = {\n type: ExperienceType.VistasReales,\n url: experience.url + \"#\" + floor\n };\n state.isIFrameExperienceOpened = true;\n break;\n\n case ExperienceType.PisoPiloto:\n state.currentExperience = experience;\n state.isIFrameExperienceOpened = true;\n break;\n\n case ExperienceType.TourParqueLineal:\n state.currentExperience = experience;\n state.isIFrameExperienceOpened = true;\n break;\n\n case ExperienceType.ZonasComunes:\n state.currentExperience = experience;\n state.isIFrameExperienceOpened = true;\n break;\n\n break;\n }\n\n }\n }),\n setLegalNoteOpened: action((state, isOpened) => {\n state.isLegalNoteOpened = isOpened;\n }),\n\n /*setCurrentCategory: action((state, category) => {\n state.currentCategory = state.categories.find(c => c.category === category);\n state.currentContent = state.content.filter(c => c.category === category);\n state.currentRenders = state.currentContent.filter(c => c.type === 'render');\n state.currentVideos = state.currentContent.filter(c => c.type === 'video');\n state.currentPanoramics = state.currentContent.filter(c => c.type === 'panoramic');\n state.currentOrbits = state.currentContent.filter(c => c.type === 'orbit');\n\n console.log(`state.currentCategory.length: ${state.currentContent.length}`);\n\n if (state.currentContent.length === 1) {\n const content = state.currentContent[0];\n console.log(`uniqye content: ${JSON.stringify(content, null, 2)}`);\n state.currentContentType = state.currentContent.filter(c => c.type === content.type);\n }\n }),*/\n setCurrentCategory: action((state, category) => {\n state.currentCategory = state.categories.find(c => c.category === category);\n state.currentContent = state.content.filter(c => c.category === category);\n }),\n setCurrentContentType: action((state, contentType) => {\n state.currentContentType = state.currentContent.filter(c => c.type === contentType);\n }),\n\n\n};\n","import React from 'react';\nimport { BrowserRouter } from 'react-router-dom';\nimport { StoreProvider, createStore } from 'easy-peasy';\nimport 'bootstrap/dist/css/bootstrap.css';\nimport '../../scss/app.scss';\nimport Router from './Router';\nimport model from '../../model/model';\n\nconst store = createStore(model);\n\nconst App = () => (\n