{"id":683,"date":"2024-03-17T17:15:11","date_gmt":"2024-03-17T17:15:11","guid":{"rendered":"https:\/\/play.exploragame.com.ar\/?page_id=683"},"modified":"2024-06-13T22:00:21","modified_gmt":"2024-06-13T22:00:21","slug":"la-boca-2-2-3","status":"publish","type":"page","link":"https:\/\/play.exploragame.com.ar\/index.php\/la-boca-2-2-3\/","title":{"rendered":"La Boca 4 Esp \/ Inundaci\u00f3n 1\/3"},"content":{"rendered":"\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t
\n \n\n
\n 0<\/span>%<\/span><\/span>\n <\/span>\n <\/div>\n <\/div>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\"\"\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t
\n\t\t\t\t\t
\n\t\t
\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\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\t\t
\n\t\t\t\t
\n\t\t\t\t\t
Tiempo de Juego<\/span><\/div>
<\/div><\/div><\/div>\n\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
\n\t\t
\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t

Arriba pueden ver como eran las inundaciones en el barrio.\nEl agua llegaba hasta una vereda alta. \nEn base a la foto de arriba y ayud\u00e1ndose de la zona de referencia de color rojo.

Col\u00f3quense sobre la misma vereda alta desde donde fue sacada la imagen. Presten atenci\u00f3n a los barcos del fondo para orientarse<\/h3>\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
\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\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\t\t<\/div>\n\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t
<\/div><\/div><\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t
\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\r\n\r\n\r\n\r\n\r\nDestino<\/title>\r\n<style>\r\n body {\r\n text-align: center;\r\n font-family: Arial, sans-serif;\r\n }\r\n #distance-info {\r\n font-size: 24px;\r\n margin-top: 20px;\r\n }\r\n #message {\r\n font-size: 18px;\r\n margin-top: 20px;\r\n display: none; \/* Ocultamos el mensaje por defecto *\/\r\n }\r\n #photo-container {\r\n display: none;\r\n margin-top: 20px;\r\n }\r\n #camera-container {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n }\r\n #camera-icon {\r\n width: 100px; \/* Cambia el tama\u00f1o del icono aqu\u00ed *\/\r\n }\r\n #checking-image {\r\n margin-top: 10px;\r\n display: none;\r\n }\r\n #map-container {\r\n margin-top: 20px;\r\n }\r\n .animation-container {\r\n position: fixed;\r\n top: 50%;\r\n left: 50%;\r\n transform: translate(-50%, -50%);\r\n }\r\n<\/style>\r\n<\/head>\r\n<body>\r\n\r\n<div id=\"distance-info\">Esperando ubicaci\u00f3n...<\/div>\r\n\r\n<div id=\"message\">\r\n <p style=\"text-align: center;\"><strong>\u00a1Muy bien!<\/strong><\/p>\r\n <p style=\"text-align: center;\"><span>Han llegado al \u00e1rea de destino. La foto de arriba fue sacada desde una vereda alta. Busquen esa misma vereda (presten atenci\u00f3n a los barcos de fondo) y saquen una foto desde la misma posici\u00f3n de donde fue sacada.<\/span><\/p>\r\n <p style=\"text-align: center;\"><span>Hagan Click en el icono de la c\u00e1mara para sacar o adjuntar la imagen<\/span><\/p>\r\n<\/div>\r\n\r\n<div id=\"photo-container\">\r\n <div id=\"camera-container\">\r\n <label for=\"image-input\"><img decoding=\"async\" id=\"camera-icon\" src=\"https:\/\/play.exploragame.com.ar\/wp-content\/uploads\/2024\/06\/Titulo-6.png\" alt=\"Camera Icon\"><\/label>\r\n <div id=\"checking-image\">Comprobando imagen...<\/div>\r\n <\/div>\r\n <input type=\"file\" id=\"image-input\" accept=\"image\/*\" style=\"display: none;\">\r\n<\/div>\r\n\r\n<div id=\"map-container\">\r\n <!-- Aqu\u00ed colocaremos el shortcode del mapa -->\r\n [mapster_wp_map id=\"218\"]\r\n<\/div>\r\n\r\n<script>\r\n\/\/ Coordenadas del destino\r\nconst destinationCoordinates = {\r\n lat: -34.63848845320515,\r\n lng: -58.3588392106767\r\n \r\n};\r\n\r\n\/\/ Radio del destino en metros\r\nconst destinationRadius = 5;\r\n\r\n\/\/ Variable para controlar si se ha reproducido la animaci\u00f3n y el sonido al llegar al destino\r\nlet isDestinationReached = false;\r\n\r\n\/\/ Funci\u00f3n para calcular la distancia entre dos puntos en metros\r\nfunction calculateDistance(lat1, lon1, lat2, lon2) {\r\n const R = 6371000; \/\/ Radio de la Tierra en metros\r\n const dLat = deg2rad(lat2 - lat1);\r\n const dLon = deg2rad(lon2 - lon1);\r\n const a = Math.sin(dLat \/ 2) * Math.sin(dLat \/ 2) +\r\n Math.cos(deg2rad(lat1)) * Math.cos(deg2rad(lat2)) *\r\n Math.sin(dLon \/ 2) * Math.sin(dLon \/ 2);\r\n const c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));\r\n return R * c;\r\n}\r\n\r\nfunction deg2rad(deg) {\r\n return deg * (Math.PI \/ 180);\r\n}\r\n\r\n\/\/ Funci\u00f3n para actualizar la informaci\u00f3n de la distancia\r\nfunction updateDistance(position) {\r\n const userLat = position.coords.latitude;\r\n const userLng = position.coords.longitude;\r\n const distance = calculateDistance(userLat, userLng, destinationCoordinates.lat, destinationCoordinates.lng);\r\n \r\n const distanceInfo = document.getElementById('distance-info');\r\n distanceInfo.textContent = `Faltan aproximadamente ${distance.toFixed(0)} metros para el destino`;\r\n\r\n \/\/ Verificar si el usuario ha llegado al destino\r\n if (distance <= destinationRadius && !isDestinationReached) {\r\n \/\/ Ocultar el mapa\r\n document.getElementById('map-container').style.display = 'none';\r\n \r\n \/\/ Mostrar el mensaje\r\n const message = document.getElementById('message');\r\n message.style.display = 'block';\r\n\r\n \/\/ Ocultar la leyenda de distancia\r\n distanceInfo.style.display = 'none';\r\n\r\n \/\/ Reproducir la animaci\u00f3n y el sonido al llegar al destino\r\n playDestinationAnimationAndSound();\r\n isDestinationReached = true;\r\n\r\n \/\/ Mostrar el contenedor del bot\u00f3n de la foto\r\n const photoContainer = document.getElementById('photo-container');\r\n photoContainer.style.display = 'block';\r\n }\r\n}\r\n\r\n\/\/ Funci\u00f3n para reproducir la animaci\u00f3n y el sonido al llegar al destino\r\nfunction playDestinationAnimationAndSound() {\r\n const sound = new Audio('https:\/\/play.exploragame.com.ar\/wp-content\/uploads\/2024\/06\/Correct-Answer-Sound-Effect-DeeChannel-mp3cut.net_.mp3');\r\n sound.play();\r\n\r\n \/\/ Reproducir la animaci\u00f3n al llegar al destino\r\n const animation = document.createElement('img');\r\n animation.src = 'https:\/\/play.exploragame.com.ar\/wp-content\/uploads\/2024\/06\/Titulo-8.gif';\r\n animation.alt = 'Animation';\r\n animation.classList.add('animation-container');\r\n document.body.appendChild(animation);\r\n\r\n \/\/ Desaparecer la animaci\u00f3n despu\u00e9s de 4 segundos\r\n setTimeout(() => {\r\n animation.remove();\r\n }, 4000);\r\n}\r\n\r\n\/\/ Funci\u00f3n para manejar la selecci\u00f3n de la foto o la imagen adjunta\r\nfunction handleImageSelection(event) {\r\n const imageInput = event.target;\r\n const selectedFile = imageInput.files[0];\r\n\r\n if (selectedFile) {\r\n \/\/ Mostrar la leyenda \"Comprobando imagen...\"\r\n const checkingImage = document.getElementById('checking-image');\r\n checkingImage.style.display = 'block';\r\n\r\n \/\/ Despu\u00e9s de 4 segundos, reproducir la animaci\u00f3n y el sonido\r\n setTimeout(() => {\r\n \/\/ Ocultar la leyenda \"Comprobando imagen...\" despu\u00e9s de 4 segundos\r\n checkingImage.style.display = 'none';\r\n playImageSelectionAnimationAndSound();\r\n }, 4000);\r\n }\r\n}\r\n\r\n\/\/ Funci\u00f3n para reproducir la animaci\u00f3n y el sonido al cargar la imagen\r\nfunction playImageSelectionAnimationAndSound() {\r\n const sound = new Audio('https:\/\/play.exploragame.com.ar\/wp-content\/uploads\/2024\/06\/Correct-Answer-Sound-Effect-DeeChannel-mp3cut.net_.mp3');\r\n sound.play();\r\n\r\n \/\/ Reproducir la animaci\u00f3n al cargar la imagen\r\n const animation = document.createElement('img');\r\n animation.src = 'https:\/\/play.exploragame.com.ar\/wp-content\/uploads\/2024\/06\/Titulo-4.gif';\r\n animation.alt = 'Animation';\r\n animation.classList.add('animation-container');\r\n document.body.appendChild(animation);\r\n\r\n \/\/ Desaparecer la animaci\u00f3n despu\u00e9s de 4 segundos y redirigir\r\n setTimeout(() => {\r\n animation.remove();\r\n \/\/ Redirigir despu\u00e9s de 4 segundos\r\n window.location.href = 'https:\/\/play.exploragame.com.ar\/index.php\/laboca-inundacion\/';\r\n }, 4000);\r\n}\r\n\r\n\/\/ Manejar el evento de selecci\u00f3n de la foto o imagen adjunta\r\nconst imageInput = document.getElementById('image-input');\r\nimageInput.addEventListener('change', handleImageSelection);\r\n\r\n\/\/ Funci\u00f3n de error en la geolocalizaci\u00f3n\r\nfunction handleLocationError(error) {\r\n console.error(error);\r\n const distanceInfo = document.getElementById('distance-info');\r\n distanceInfo.textContent = 'Ubicaci\u00f3n no disponible';\r\n}\r\n\r\n\/\/ Obtener la ubicaci\u00f3n del usuario\r\nif (navigator.geolocation) {\r\n navigator.geolocation.watchPosition(updateDistance, handleLocationError);\r\n} else {\r\n const distanceInfo = document.getElementById('distance-info');\r\n distanceInfo.textContent = 'Geolocalizaci\u00f3n no soportada por el navegador';\r\n}\r\n<\/script>\r\n\r\n<\/body>\r\n<\/html>\r\n\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\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>0% Arriba pueden ver como eran las inundaciones en el barrio. El agua llegaba hasta una vereda alta. En base a la foto de arriba y ayud\u00e1ndose de la zona de referencia de color rojo. Col\u00f3quense sobre la misma vereda alta desde donde fue sacada la imagen. Presten atenci\u00f3n a los barcos del fondo para … <a title=\"La Boca 4 Esp \/ Inundaci\u00f3n 1\/3\" class=\"read-more\" href=\"https:\/\/play.exploragame.com.ar\/index.php\/la-boca-2-2-3\/\" aria-label=\"Leer m\u00e1s sobre La Boca 4 Esp \/ Inundaci\u00f3n 1\/3\">Leer m\u00e1s<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"wf_page_folders":[5],"class_list":["post-683","page","type-page","status-publish"],"_links":{"self":[{"href":"https:\/\/play.exploragame.com.ar\/index.php\/wp-json\/wp\/v2\/pages\/683","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/play.exploragame.com.ar\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/play.exploragame.com.ar\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/play.exploragame.com.ar\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/play.exploragame.com.ar\/index.php\/wp-json\/wp\/v2\/comments?post=683"}],"version-history":[{"count":86,"href":"https:\/\/play.exploragame.com.ar\/index.php\/wp-json\/wp\/v2\/pages\/683\/revisions"}],"predecessor-version":[{"id":6094,"href":"https:\/\/play.exploragame.com.ar\/index.php\/wp-json\/wp\/v2\/pages\/683\/revisions\/6094"}],"wp:attachment":[{"href":"https:\/\/play.exploragame.com.ar\/index.php\/wp-json\/wp\/v2\/media?parent=683"}],"wp:term":[{"taxonomy":"wf_page_folders","embeddable":true,"href":"https:\/\/play.exploragame.com.ar\/index.php\/wp-json\/wp\/v2\/wf_page_folders?post=683"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}