{"id":2477,"date":"2025-06-27T03:19:42","date_gmt":"2025-06-27T03:19:42","guid":{"rendered":"https:\/\/mbresortorlando.com\/dev\/?page_id=2477"},"modified":"2025-06-28T00:36:04","modified_gmt":"2025-06-28T00:36:04","slug":"realtormaps","status":"publish","type":"page","link":"https:\/\/mbresortorlando.com\/en\/realtormaps\/","title":{"rendered":"realtormaps"},"content":{"rendered":"<div data-elementor-type=\"wp-page\" data-elementor-id=\"2477\" class=\"elementor elementor-2477\" data-elementor-settings=\"{&quot;page_masthead_image_height&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:900,&quot;sizes&quot;:[]},&quot;page_masthead_image_height_tablet&quot;:{&quot;unit&quot;:&quot;vh&quot;,&quot;size&quot;:70,&quot;sizes&quot;:[]},&quot;page_masthead_image_height_mobile&quot;:{&quot;unit&quot;:&quot;vh&quot;,&quot;size&quot;:50,&quot;sizes&quot;:[]},&quot;cassio_hide_title_disabled&quot;:&quot;yes&quot;}\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-252519e e-con-full e-grid e-con e-parent\" data-id=\"252519e\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-aa8c040 elementor-widget elementor-widget-html\" data-id=\"aa8c040\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\n<div class=\"iframe-fullscreen-wrapper\">\n  <iframe \n    id=\"plano-iframe\"\n    src=\"https:\/\/mbresortorlando.com\/masterplan-v2\/\" \n    allowfullscreen webkitallowfullscreen mozallowfullscreen>\n  <\/iframe>\n<\/div>\n\n<!-- Controles externos con selector desplegable -->\n<div class=\"controles-externos\">\n  <button class=\"btn-piso toggle-selector\" onclick=\"toggleSelector()\">SELECCIONAR PISO<\/button>\n  <div class=\"selector-pisos\" id=\"selectorPisos\">\n    <!-- Pisos generados del 1 al 165 (excepto el 16 que se usa como PH) -->\n    <div class=\"pisos-scroll\">\n      <!-- Generar autom\u00e1ticamente con JS -->\n    <\/div>\n  <\/div>\n  <button class=\"btn-piso\" onclick=\"enviarComando('irAPiso', 16)\">PENTHOUSE<\/button>\n  <button class=\"btn-piso\" onclick=\"enviarComando('resetView')\">RESET<\/button>\n<\/div>\n\n<script>\n  \/\/ Genera los botones din\u00e1micamente\n  const pisosContainer = document.querySelector('.pisos-scroll');\n  for (let i = 1; i <= 15; i++) {\n    if (i === 16) continue; \/\/ Saltar PH\n    const btn = document.createElement('button');\n    btn.className = 'btn-piso';\n    btn.textContent = `PISO ${i}`;\n    btn.onclick = () => enviarComando('irAPiso', i);\n    pisosContainer.appendChild(btn);\n  }\n\n  \/\/ Mostrar\/ocultar el selector\n  function toggleSelector() {\n    const selector = document.getElementById('selectorPisos');\n    selector.classList.toggle('visible');\n  }\n\n  \/\/ Cierra al hacer clic fuera\n  document.addEventListener('click', function (e) {\n    const selector = document.getElementById('selectorPisos');\n    const toggle = document.querySelector('.toggle-selector');\n    if (!selector.contains(e.target) && !toggle.contains(e.target)) {\n      selector.classList.remove('visible');\n    }\n  });\n<\/script>\n\n\n<!-- Navegaci\u00f3n completa de pisos -->\n<div class=\"nav-pisos-externa\">\n  <button class=\"btn-nav-piso\" onclick=\"cambiarPisoExterno('prev')\">\u25c0<\/button>\n  <span id=\"piso-actual-externo\" style=\"padding: 0 10px; font-weight: bold;\">Piso 1<\/span>\n  <button class=\"btn-nav-piso\" onclick=\"cambiarPisoExterno('next')\">\u25b6<\/button>\n<\/div>\n\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-db28f01 elementor-widget elementor-widget-html\" data-id=\"db28f01\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t        <div class=\"mbra-wrapper\" style=\"height: 700px; width: 100%; max-width: 1080px; margin: 0 auto; position: relative;\">\n                        <div class=\"mbra-video-overlay\"><\/div>\n            \n            <div class=\"mbra-agent-container\">\n                <div class=\"mbra-agent-header\">\n                    <h1 class=\"mbra-agent-title\">Dynamic Properties\u2122 IA<\/h1>\n              <!--  <h1 class=\"mbra-agent-title\">MB Resort Orlando<\/h1>\n                    <p class=\"mbra-agent-subtitle\">Tu asistente Dynamic Properties\u2122<\/p>-->\n                <\/div>\n                \n                <div class=\"mbra-chat-area\" id=\"mbra-chat-area\">\n                    <div class=\"mbra-message mbra-bot-message\">\n                        \u00a1Hola! Soy tu asistente de MB Resort Orlando. \ud83d\udc4b<br><br>\n                        Puedo ayudarte con:\n                        \u2022 Disponibilidad de fracciones<br>\n                        \u2022 Informaci\u00f3n de precios y fases<br>\n                        \u2022 Detalles del proyecto<br>\n                        \u2022 Proceso de inversi\u00f3n<br><br>\n                        \u00bfEn qu\u00e9 puedo asistirte hoy?\n                    <\/div>\n                <\/div>\n                \n                <div class=\"mbra-input-area\">\n                    <input type=\"text\" class=\"mbra-chat-input\" id=\"mbra-user-input\" placeholder=\"Escribe tu pregunta aqu\u00ed...\">\n                    <button class=\"mbra-send-button\" onclick=\"MBRA.sendMessage()\">Send<\/button>\n                <\/div>\n                \n                <div class=\"mbra-quick-actions\">\n                    <button class=\"mbra-quick-button\" onclick=\"MBRA.quickQuery('disponibilidad')\">Ver Disponibilidad<\/button>\n                    <button class=\"mbra-quick-button\" onclick=\"MBRA.quickQuery('precios')\">Consultar Precios<\/button>\n                    <button class=\"mbra-quick-button\" onclick=\"MBRA.quickQuery('amenidades')\">Amenities<\/button>\n                    <button class=\"mbra-quick-button\" onclick=\"MBRA.quickQuery('masterplan')\">Master Plan<\/button>\n                    <button class=\"mbra-quick-button\" onclick=\"MBRA.quickQuery('modelo')\">Modelo Dynamic<\/button>\n                <\/div>\n            <\/div>\n        <\/div>\n        \t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-dcb3e76 elementor-widget elementor-widget-html\" data-id=\"dcb3e76\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<style>\n  .iframe-fullscreen-wrapper {\n    position: relative;\n    width: 100%;\n    height: 100vh;\n    margin: 0;\n    padding: 0;\n    padding-top: 20px;\n    overflow: hidden;\n  }\n  .iframe-fullscreen-wrapper iframe {\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    border: 0;\n  }\n  \n  \/* Estilos para los botones de control *\/\n  .controles-externos {\n    position: fixed;\n    top: 50%;\n    right: 20px;\n    transform: translateY(-50%);\n    z-index: 1000;\n    display: flex;\n    flex-direction: column;\n    gap: 10px;\n  }\n  \n  .btn-piso {\n    background: #000;\n    color: #fff;\n    border: none;\n    padding: 10px 20px;\n    cursor: pointer;\n    font-family: 'Montserrat', sans-serif;\n    font-weight: 500;\n    font-size: 12px;\n    transition: all 0.3s ease;\n    min-width: 120px;\n  }\n  \n  .btn-piso:hover {\n    background: #333;\n  }\n  \n  .btn-piso.active {\n    background: #4a90e2;\n  }\n  \n  \/* Navegaci\u00f3n de pisos horizontal *\/\n  .nav-pisos-externa {\n    position: fixed;\n    bottom: 30px;\n    \/*left: 50%;*\/\n    left: 100px;\n    transform: translateX(-50%);\n    z-index: 1000;\n    display: flex;\n    gap: 5px;\n    background: rgba(255, 255, 255, 0.9);\n    padding: 10px;\n    border-radius: 5px;\n    box-shadow: 0 2px 10px rgba(0,0,0,0.1);\n  }\n  \n  .btn-nav-piso {\n    background: #000;\n    color: #fff;\n    border: none;\n    padding: 8px 12px;\n    cursor: pointer;\n    font-size: 11px;\n    min-width: 35px;\n    transition: all 0.2s ease;\n  }\n  \n  .btn-nav-piso:hover {\n    background: #333;\n  }\n  \n  .btn-nav-piso:disabled {\n    background: #ccc;\n    cursor: not-allowed;\n  }\n  \n  \n  \/* Selector de pisos desplegable *\/\n.selector-pisos {\n  display: none;\n  flex-direction: column;\n  max-height: 300px;\n  overflow-y: auto;\n  background: rgba(255, 255, 255, 0.95);\n  border: 1px solid #ccc;\n  padding: 10px;\n  margin-top: 5px;\n  border-radius: 5px;\n  box-shadow: 0 2px 10px rgba(0,0,0,0.1);\n  z-index: 1001;\n}\n\n.selector-pisos.visible {\n  display: flex;\n}\n\n.pisos-scroll {\n  display: flex;\n  flex-direction: column;\n  gap: 5px;\n  max-height: 250px;\n  overflow-y: auto;\n}\n\n.selector-pisos .btn-piso {\n  background: #000;\n  color: #fff;\n  font-size: 11px;\n  min-width: auto;\n  padding: 6px 10px;\n  text-align: left;\n}\n\n\n\/* Contenedor inferior derecho con distribuci\u00f3n horizontal *\/\n.controles-externos-bottom {\n  position: fixed;\n  bottom: 30px;\n  right: 0;\n  width: 50%;\n  display: flex;\n  justify-content: space-around;\n  align-items: flex-end;\n  z-index: 1000;\n}\n\n\/* Wrapper para el bot\u00f3n + selector, para que el desplegable se ancle arriba *\/\n.selector-wrapper {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n}\n\n\/* Selector de pisos, justo encima del bot\u00f3n *\/\n.selector-pisos {\n  position: absolute;\n  bottom: 100%; \/* se coloca justo encima del bot\u00f3n *\/\n  margin-bottom: 10px;\n  width: 150px;\n  background: rgba(255, 255, 255, 0.95);\n  border: 1px solid #ccc;\n  padding: 10px;\n  border-radius: 5px;\n  box-shadow: 0 4px 12px rgba(0,0,0,0.15);\n  display: flex;\n  flex-direction: column;\n  max-height: 0;\n  overflow: hidden;\n  opacity: 0;\n  transform: scaleY(0.95);\n  transform-origin: bottom center;\n  transition: all 0.3s ease;\n  z-index: 1001;\n}\n\n\/* Estado visible con animaci\u00f3n *\/\n.selector-pisos.visible {\n  max-height: 300px;\n  opacity: 1;\n  transform: scaleY(1);\n}\n\n\/* Scroll de los pisos *\/\n.pisos-scroll {\n  display: flex;\n  flex-direction: column;\n  gap: 5px;\n  max-height: 250px;\n  overflow-y: auto;\n}\n\n\/* Botones internos del selector *\/\n.selector-pisos .btn-piso {\n  background: #000;\n  color: #fff;\n  font-size: 11px;\n  min-width: auto;\n  padding: 6px 10px;\n  text-align: left;\n}\n\n\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-fcbfd56 elementor-widget elementor-widget-html\" data-id=\"fcbfd56\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<script>\n\/\/ Variable para trackear el piso actual\nlet pisoActualExterno = 1;\nconst totalPisosExterno = 16;\n\n\/\/ Funci\u00f3n para enviar comandos al iframe\nfunction enviarComando(accion, parametro) {\n  const iframe = document.getElementById('plano-iframe');\n  if (iframe && iframe.contentWindow) {\n    const mensaje = { action: accion };\n    \n    if (parametro !== undefined) {\n      mensaje.piso = parametro;\n    }\n    \n    \/\/ Enviar mensaje al iframe\n    iframe.contentWindow.postMessage(mensaje, '*');\n    \n    \/\/ Actualizar el piso actual si es cambio de piso\n    if (accion === 'irAPiso' && parametro) {\n      pisoActualExterno = parametro;\n      actualizarDisplayPiso();\n    }\n  }\n}\n\n\/\/ Funci\u00f3n para cambiar de piso con navegaci\u00f3n\nfunction cambiarPisoExterno(direccion) {\n  if (direccion === 'prev' && pisoActualExterno > 1) {\n    pisoActualExterno--;\n  } else if (direccion === 'next' && pisoActualExterno < totalPisosExterno) {\n    pisoActualExterno++;\n  }\n  \n  enviarComando('cambiarPiso', pisoActualExterno);\n  actualizarDisplayPiso();\n}\n\n\/\/ Actualizar display del piso\nfunction actualizarDisplayPiso() {\n  const display = document.getElementById('piso-actual-externo');\n  if (display) {\n    display.textContent = `Piso ${pisoActualExterno}`;\n  }\n  \n  \/\/ Actualizar estado de botones\n  const btnPrev = document.querySelector('.nav-pisos-externa button:first-child');\n  const btnNext = document.querySelector('.nav-pisos-externa button:last-child');\n  \n  if (btnPrev) btnPrev.disabled = pisoActualExterno <= 1;\n  if (btnNext) btnNext.disabled = pisoActualExterno >= totalPisosExterno;\n}\n\n\/\/ Escuchar mensajes del iframe (opcional)\nwindow.addEventListener('message', function(event) {\n  if (event.data && event.data.action === 'iframeReady') {\n    console.log('\u2705 Iframe del plano cargado y listo');\n    if (event.data.pisoActual) {\n      pisoActualExterno = event.data.pisoActual;\n      actualizarDisplayPiso();\n    }\n  }\n});\n\n\/\/ Inicializar\ndocument.addEventListener('DOMContentLoaded', function() {\n  actualizarDisplayPiso();\n});\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-dcee8ac e-flex e-con-boxed e-con e-child\" data-id=\"dcee8ac\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>SELECCIONAR PISO PENTHOUSE RESET \u25c0 Piso 1 \u25b6<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-2477","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/mbresortorlando.com\/en\/wp-json\/wp\/v2\/pages\/2477","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mbresortorlando.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/mbresortorlando.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/mbresortorlando.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/mbresortorlando.com\/en\/wp-json\/wp\/v2\/comments?post=2477"}],"version-history":[{"count":148,"href":"https:\/\/mbresortorlando.com\/en\/wp-json\/wp\/v2\/pages\/2477\/revisions"}],"predecessor-version":[{"id":2681,"href":"https:\/\/mbresortorlando.com\/en\/wp-json\/wp\/v2\/pages\/2477\/revisions\/2681"}],"wp:attachment":[{"href":"https:\/\/mbresortorlando.com\/en\/wp-json\/wp\/v2\/media?parent=2477"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}