{"id":46,"date":"2023-03-15T09:10:42","date_gmt":"2023-03-15T09:10:42","guid":{"rendered":"https:\/\/edificiobrown.com.ar\/?page_id=46"},"modified":"2023-04-04T05:06:30","modified_gmt":"2023-04-04T08:06:30","slug":"reservas","status":"publish","type":"page","link":"https:\/\/edificiobrown.com.ar\/en\/reservas\/","title":{"rendered":"Booking"},"content":{"rendered":"<div data-elementor-type=\"wp-page\" data-elementor-id=\"46\" class=\"elementor elementor-46\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-c94fbb2 e-flex e-con-boxed e-con e-parent\" data-id=\"c94fbb2\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;slideshow&quot;,&quot;background_slideshow_gallery&quot;:[{&quot;id&quot;:2926,&quot;url&quot;:&quot;http:\\\/\\\/edificiobrown.com.ar\\\/wp-content\\\/uploads\\\/2023\\\/04\\\/IMG-20220310-WA0011.jpg&quot;}],&quot;background_slideshow_loop&quot;:&quot;yes&quot;,&quot;background_slideshow_slide_duration&quot;:5000,&quot;background_slideshow_slide_transition&quot;:&quot;fade&quot;,&quot;background_slideshow_transition_duration&quot;:500}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9519f1a elementor-widget-laptop__width-initial elementor-invisible elementor-widget elementor-widget-heading\" data-id=\"9519f1a\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeIn&quot;}\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Booking<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-9de7f42 e-flex e-con-boxed elementor-invisible e-con e-parent\" data-id=\"9de7f42\" data-element_type=\"container\" data-settings=\"{&quot;animation&quot;:&quot;fadeIn&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ce3b633 elementor-widget elementor-widget-html\" data-id=\"ce3b633\" 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>\r\n\r\n   .form-group-book{\r\n     width: 100% !important;   \r\n    }\r\n   #edades-menores {\r\n  display: flex;\r\n  flex-wrap: wrap;\r\n}\r\n\r\n\/*Menores*\/\r\n.form-group {\r\n  flex-basis: 100%;\r\n  box-sizing: border-box;\r\n  padding: 10px;\r\n}\r\n\r\n    \r\n    .form-book{\r\n        border: 1px solid gray;\r\n    padding: 25px;\r\n    box-shadow: 0px 0px 5px rgb(0 0 0 \/ 25%);\r\n    margin-top: 50px;\r\n    margin-bottom: 60px;\r\n    }\r\n    \r\n    \r\n @media (min-width: 768px)  {\r\n      .form-group-book{\r\n     width: 25%;   \r\n    }\r\n   #edades-menores {\r\n  display: flex;\r\n  flex-wrap: wrap;\r\n}\r\n\r\n\/*Menores*\/\r\n.form-group {\r\n  flex-basis: 25%;\r\n  box-sizing: border-box;\r\n  padding: 10px;\r\n}\r\n\r\n    \r\n    .form-book{\r\n        border: 1px solid gray;\r\n    padding: 25px;\r\n    box-shadow: 0px 0px 5px rgb(0 0 0 \/ 25%);\r\n    margin-top: 50px;\r\n    margin-bottom: 60px;\r\n    }\r\n    \r\n    .container-1{\r\n        display:flex; \r\n        gap:15px;\r\n    }\r\n    \r\n}\r\n  \r\n<\/style>\r\n\r\n<form class='form-book'; action=\"\">\r\n  \r\n  <div class='container-1' >\r\n  <div class=\"form-group-book\">\r\n    <label for=\"ingreso\">Checkin<\/label>\r\n    <input  type=\"date\" id=\"ingreso\" name=\"ingreso\" class=\"form-control\" required>\r\n    <div id=\"ingreso-help\" class=\"form-text\"><\/div>\r\n  <\/div>\r\n  <div class=\"form-group-book\">\r\n    <label for=\"egreso\">Checkout<\/label>\r\n    <input type=\"date\" id=\"egreso\" name=\"egreso\" class=\"form-control\" required>\r\n    <div id=\"egreso-help\" class=\"form-text\"><\/div>\r\n  <\/div>\r\n  \r\n  \r\n  <div class=\"form-group-book\">\r\n    <label for=\"adultos\">Number of adults<\/label>\r\n    <input type=\"number\" id=\"adultos\" name=\"adultos\" min=\"1\" max=\"10\" value=\"1\" class=\"form-control\" required>\r\n    <div id=\"adultos-help\" class=\"form-text\"><\/div>\r\n  <\/div>\r\n  <div class=\"form-group-book\">\r\n    <label for=\"menores\">Number of children<\/label>\r\n    <input type=\"number\" id=\"menores\" name=\"menores\" min=\"0\" max=\"8\" value=\"0\" class=\"form-control\">\r\n    <div id=\"menores-help\" class=\"form-text\"><\/div>\r\n\r\n  <\/div>\r\n  \r\n  \r\n  <button id=\"reservar\" class=\"btn btn-primary\">Book<\/button>\r\n  \r\n  <\/div>\r\n      <div class='container-2' id=\"edades-menores\"><\/div>\r\n      \r\n<input type=\"hidden\" name=\"trp-form-language\" value=\"en\"\/><\/form>\r\n\r\n\r\n\r\n<script>\r\nfunction formatDate(date) {\r\n  const yyyy = date.getFullYear();\r\n  const mm = String(date.getMonth() + 1).padStart(2, '0');\r\n  const dd = String(date.getDate()).padStart(2, '0');\r\n  return `${dd}\/${mm}\/${yyyy}`;\r\n}\r\n\r\n\r\n\r\n    const adultosInput = document.getElementById('adultos');\r\nconst menoresInput = document.getElementById('menores');\r\nconst edadesMenoresDiv = document.getElementById('edades-menores');\r\nconst ingresoInput = document.getElementById('ingreso');\r\nconst egresoInput = document.getElementById('egreso');\r\nconst reservarButton = document.getElementById('reservar');\r\n\r\n\/\/ Obtener fecha actual\r\nconst hoy = new Date();\r\nconst yyyy = hoy.getFullYear();\r\nconst mm = String(hoy.getMonth() + 1).padStart(2, '0');\r\nconst dd = String(hoy.getDate()).padStart(2, '0');\r\nconst fechaMinima = `${yyyy}-${mm}-${dd}`;\r\n\r\n\/\/ Establecer fecha m\u00ednima en campo de fecha de ingreso\r\ningresoInput.setAttribute('min', fechaMinima);\r\n\r\n\/\/ Mostrar campos de edades de menores seg\u00fan cantidad de menores ingresada\r\nmenoresInput.addEventListener('change', function() {\r\n  const cantidadMenores = parseInt(this.value);\r\n  let html = '';\r\n  for (let i = 1; i <= cantidadMenores; i++) {\r\n    html += `\r\n      <div class=\"form-group\">\r\n        <label for=\"edad-menor-${i}\">Edad del menor ${i}<\/label>\r\n        <input type=\"number\" id=\"edad-menor-${i}\" name=\"edad-menor-${i}\" min=\"0\" max=\"17\" class=\"form-control\" required>\r\n      <\/div>\r\n    `;\r\n  }\r\n  edadesMenoresDiv.innerHTML = html;\r\n});\r\n\r\n\/\/ Validar formulario y enviar mensaje por WhatsApp\r\nreservarButton.addEventListener('click', function(event) {\r\n  event.preventDefault();\r\n\r\n  const adultos = adultosInput.value;\r\n  const menores = menoresInput.value;\r\n  const ingreso = ingresoInput.value;\r\n  const egreso = egresoInput.value;\r\n\r\n  \/\/ Validar que se ingresen las edades de los menores si corresponde\r\n  if (menores > 0) {\r\n    const edadesMenoresInputs = edadesMenoresDiv.querySelectorAll('input[type=\"number\"]');\r\n    for (let i = 0; i < edadesMenoresInputs.length; i++) {\r\n      if (!edadesMenoresInputs[i].value) {\r\n        alert('Debe ingresar las edades de los menores.');\r\n        return;\r\n      }\r\n    }\r\n  }\r\n\r\n  \/\/ Armar mensaje\r\n  let mensaje = `Hola, quiero hacer una reserva para ${adultos} adulto(s)`;\r\n  if (menores > 0) {\r\n    mensaje += ` y ${menores} menor(es)`;\r\n    mensaje += ` (edades: `;\r\n    const edadesMenores = [];\r\n    const edadesMenoresInputs = edadesMenoresDiv.querySelectorAll('input[type=\"number\"]');\r\n    for (let i = 0; i < edadesMenoresInputs.length; i++) {\r\n      edadesMenores.push(edadesMenoresInputs[i].value);\r\n    }\r\n    mensaje += edadesMenores.join(', ');\r\n    mensaje += ')';\r\n  }\r\n\r\n  mensaje += `. Fecha de ingreso: ${formatDate(new Date(ingreso))}. Fecha de egreso: ${formatDate(new Date(egreso))}.`;\r\n\r\n\r\n  \/\/ Enviar mensaje por WhatsApp\r\n  const url = `https:\/\/api.whatsapp.com\/send\/?phone=5492314 502865&text=${encodeURIComponent(mensaje)}`;\r\n  window.open(url, '_blank');\r\n}); \r\n\r\nfunction validarFechas() {\r\n  const ingreso = ingresoInput.value;\r\n  const egreso = egresoInput.value;\r\n  reservarButton.disabled = !ingreso || !egreso;\r\n}\r\n\r\n\/\/ Habilitar bot\u00f3n de reservar solo si las fechas de ingreso y egreso est\u00e1n completadas\r\nvalidarFechas();\r\ningresoInput.addEventListener('change', validarFechas);\r\negresoInput.addEventListener('change', validarFechas);\r\n\r\n \r\n\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-71bb8a4 e-flex e-con-boxed e-con e-parent\" data-id=\"71bb8a4\" 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>","protected":false},"excerpt":{"rendered":"<p>Reservas Fecha de ingreso Fecha de egreso Cantidad de adultos Cantidad de menores Reservar<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"_joinchat":[],"footnotes":""},"class_list":["post-46","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/edificiobrown.com.ar\/en\/wp-json\/wp\/v2\/pages\/46","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/edificiobrown.com.ar\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/edificiobrown.com.ar\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/edificiobrown.com.ar\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/edificiobrown.com.ar\/en\/wp-json\/wp\/v2\/comments?post=46"}],"version-history":[{"count":0,"href":"https:\/\/edificiobrown.com.ar\/en\/wp-json\/wp\/v2\/pages\/46\/revisions"}],"wp:attachment":[{"href":"https:\/\/edificiobrown.com.ar\/en\/wp-json\/wp\/v2\/media?parent=46"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}