https://www.geovibes.com/_next/static/chunks/7316.da33507b3d780fcb.js

1(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[7316],{27316:(e,t,r)=>{"use strict";r.r(t),r.d(t,{default:()=>j});var n=r(95155),a=r(12115),o=r(87856),l=r.n(o);r(33383);var i=r(18955),s=r(2689),c=r(7e4);function u(e){let t=[...e];for(let e=t.length-1;e>0;e--){let r=Math.floor(Math.random()*(e+1));[t[e],t[r]]=[t[r],t[e]]}return t}var d=r(33843);let f="#DE5739";var p=r(59632);let m={post:f,planning:p.KG.planning.bgColor,ongoing:p.KG.ongoing.bgColor,completed:p.KG.completed.bgColor},g=18,h=17.803030303030305,y=15,v=14.242424242424242;function b(e){let t="/_next/image?url=".concat(encodeURIComponent(e),"&w=96&q=75");return new Promise((e,r)=>{let n=new Image,a=setTimeout(()=>{n.src="",r()},8e3);n.onload=()=>{clearTimeout(a),e(n)},n.onerror=()=>{clearTimeout(a),r()},n.src=t})}async function I(e){try{return await b(e)}catch(e){}return await new Promise(e=>setTimeout(e,500)),b(e)}function x(e,t){e.save(),e.shadowColor="rgba(0,0,0,0.45)",e.shadowBlur=16,e.shadowOffsetX=0,e.shadowOffsetY=4,e.translate(12,12),e.scale(3,2*1.4242424242424243),e.fillStyle=t,e.fill(new Path2D(d.f)),e.restore()}function w(e){e.save(),e.translate(12,12),e.beginPath(),e.ellipse(2*g,2*h,2*y,2*v,0,0,2*Math.PI),e.fillStyle="white",e.fill(),e.restore()}function C(e){e.save(),e.translate(12,12),e.beginPath(),e.ellipse(2*g,2*h,(y-1.5)*2,(v-1.5)*2,0,0,2*Math.PI),e.fillStyle="#0a1628",e.fill(),e.restore()}function k(e){let t=document.createElement("canvas");t.width=96,t.height=118;let r=t.getContext("2d");return x(r,e),w(r),C(r),r.getImageData(0,0,96,118)}async function S(e,t){let r=document.createElement("canvas");r.width=96,r.height=118;let n=r.getContext("2d");x(n,t),w(n);let a=!1;if(e)try{let t=await I(e);!function(e,t){e.save(),e.translate(12,12);let r=2*g,n=2*h,a=(y-1.5)*2,o=(v-1.5)*2;e.beginPath(),e.ellipse(r,n,a,o,0,0,2*Math.PI),e.clip();let l=2*Math.max(a,o);e.drawImage(t,r-l/2,n-l/2,l,l),e.restore()}(n,t),a=!0}catch(e){}return a||C(n),{data:n.getImageData(0,0,96,118),loaded:a}}let P=[10,20];function j(e){let{visible:t,feedMode:r,onPostClick:o,onTripClick:d}=e,p=(0,i.c)(),g=(0,a.useRef)(null),h=(0,a.useRef)(null),y=(0,a.useRef)(null),{geoJSON:v}=function(){let e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"paraTi",t=(0,a.useRef)({posts:[],trips:[]}),[r,n]=(0,a.useState)(()=>({type:"FeatureCollection",features:[]})),o="siguiendo"===e?"following":void 0,l=(0,a.useCallback)(()=>{n(function(e,t){let r=[];return e.forEach(e=>{var t,n,a;let[o,l]=(null==(t=e.location)?void 0:t.coordinates)||[];(o||0===o)&&r.push({type:"Feature",geometry:{type:"Point",coordinates:[o,l]},properties:{id:String(e._id),kind:"post",imageId:"pin-post-".concat(String(e._id)),imageUrl:(null==(n=e.media)?void 0:n.thumbnailUrl)||(null==(a=e.media)?void 0:a.url)||"",postData:JSON.stringify(e)}})}),t.forEach(e=>{var t;let[n,a]=e.mapCoordinates||[];(n||0===n)&&r.push({type:"Feature",geometry:{type:"Point",coordinates:[n,a]},properties:{id:String(e._id),kind:e.status,imageId:"pin-".concat(e.status,"-").concat(String(e._id)),imageUrl:(null==(t=e.media)?void 0:t.coverImage)||e.coverImage||"",tripData:JSON.stringify(e)}})}),{type:"FeatureCollection",features:r}}(u(t.current.posts).slice(0,60),u(t.current.trips).slice(0,40)))},[]),i=(0,a.useCallback)(async()=>{try{let[e,r]=await Promise.all([(0,s.CL)(o),(0,c.JW)(o)]);t.current={posts:(null==e?void 0:e.posts)||[],trips:(null==r?void 0:r.trips)||[]},l()}catch(e){}},[o,l]);return(0,a.useEffect)(()=>{i();let e=setInterval(l,3e4),t=setInterval(i,15e3),r=()=>i();return window.addEventListener("trip-updated",r),()=>{clearInterval(e),clearInterval(t),window.removeEventListener("trip-updated",r)}},[i,l]),{geoJSON:r}}(r),{syncIcons:b,clearIcons:I,handleStyleImageMissing:x,setupClickHandlers:w,PIN_VISUAL_H:C}=function(e){let{onPostClick:t,onTripClick:r}=e,n=(0,a.useRef)(new Set),o=(0,a.useRef)(new Map),l=(0,a.useRef)(0),i=(0,a.useCallback)(async(e,t)=>{if(!e)return;let r=++l.current;for(let t of Object.keys(m)){let r="pin-fallback-".concat(t);e.hasImage(r)||(e.addImage(r,k(m[t]),{pixelRatio:2}),n.current.add(r))}let a=new Set,i=[];for(let e of t){let{imageId:t,imageUrl:r,kind:o}=e.properties;t&&(a.add(t),n.current.has(t)||i.push({iconId:t,imageUrl:r,kind:o}))}for(let t of[...n.current])!(t.startsWith("pin-fallback-")||t.startsWith("badge-"))&&(a.has(t)||(e.hasImage(t)&&e.removeImage(t),n.current.delete(t)));for(let t=0;t<i.length;t+=20){if(l.current!==r)return;let a=i.slice(t,t+20);for(let t of(await Promise.allSettled(a.map(async e=>{let{iconId:t,imageUrl:r,kind:n}=e,a=m[n]||f,l="".concat(r,"|").concat(a),i=o.current.get(l);if(i)return{iconId:t,data:i,loaded:!0};let{data:s,loaded:c}=await S(r,a);return c&&o.current.set(l,s),{iconId:t,data:s,loaded:c}})))){if("fulfilled"!==t.status)continue;let{iconId:r,data:a,loaded:o}=t.value;e.hasImage(r)&&e.removeImage(r),e.addImage(r,a,{pixelRatio:2}),o&&n.current.add(r)}}},[]),s=(0,a.useCallback)(e=>t=>{let r=t.id;if(!(!r||e.hasImage(r))){if(r.startsWith("badge-")){let t=parseInt(r.split("-")[1],10)||2;e.addImage(r,function(e){let t="Y ".concat(e-1," m\xe1s"),r=function(e){let t=getComputedStyle(document.documentElement).getPropertyValue("--font-baloo").trim();return"600 ".concat(20,"px ").concat(t||"'Baloo 2'",", sans-serif")}(20),n=document.createElement("canvas").getContext("2d");n.font=r;let a=n.measureText(t).width+28,o=Math.ceil(a+8),l=Math.ceil(40),i=document.createElement("canvas");i.width=o,i.height=l;let s=i.getContext("2d"),c=(o-a)/2,u=(l-32)/2,d=16;return s.fillStyle="rgba(0,0,0,0.45)",s.beginPath(),s.moveTo(c+d,u),s.lineTo(c+a-d,u),s.arc(c+a-d,u+d,d,-Math.PI/2,Math.PI/2),s.lineTo(c+d,u+32),s.arc(c+d,u+d,d,Math.PI/2,1.5*Math.PI),s.closePath(),s.fill(),s.font=r,s.textAlign="center",s.textBaseline="middle",s.fillStyle="white",s.fillText(t,o/2,l/2),s.getImageData(0,0,o,l)}(t),{pixelRatio:2}),n.current.add(r);return}if(r.startsWith("pin-")){let t=m[r.split("-")[1]]||f;e.addImage(r,k(t),{pixelRatio:2})}}},[]),c=(0,a.useCallback)(e=>{let n=n=>{let a=e.queryRenderedFeatures(n.point,{layers:["cluster-badges"]});if(a.length){let t=a[0].properties.cluster_id;e.getSource("feed-content").getClusterExpansionZoom(t,(t,r)=>{t||e.flyTo({center:a[0].geometry.coordinates,zoom:r+.5})});return}let o=e.queryRenderedFeatures(n.point,{layers:["cluster-pins"]});if(o.length){let n=o[0].properties.cluster_id;e.getSource("feed-content").getClusterLeaves(n,1,0,(e,n)=>{if(e||!(null==n?void 0:n.length))return;let{kind:a,postData:o,tripData:l}=n[0].properties;if("post"===a&&o)try{t(JSON.parse(o))}catch(e){}else if(l)try{r(JSON.parse(l))}catch(e){}});return}let l=e.queryRenderedFeatures(n.point,{layers:["unclustered-pins"]});

1if(l.length){let{kind:e,postData:n,tripData:a}=l[0].properties;if("post"===e&&n)try{t(JSON.parse(n))}catch(e){}else if(a)try{r(JSON.parse(a))}catch(e){}}},a=()=>{e.getCanvas().style.cursor="pointer"},o=()=>{e.getCanvas().style.cursor=""};return e.on("click",n),e.on("mouseenter","unclustered-pins",a),e.on("mouseleave","unclustered-pins",o),e.on("mouseenter","cluster-pins",a),e.on("mouseleave","cluster-pins",o),e.on("mouseenter","cluster-badges",a),e.on("mouseleave","cluster-badges",o),()=>{e.off("click",n),e.off("mouseenter","unclustered-pins",a),e.off("mouseleave","unclustered-pins",o),e.off("mouseenter","cluster-pins",a),e.off("mouseleave","cluster-pins",o),e.off("mouseenter","cluster-badges",a),e.off("mouseleave","cluster-badges",o)}},[t,r]);return{syncIcons:i,clearIcons:(0,a.useCallback)(e=>{if(e){for(let t of n.current)e.hasImage(t)&&e.removeImage(t);n.current.clear(),o.current.clear()}},[]),handleStyleImageMissing:s,setupClickHandlers:c,PIN_VISUAL_H:59}}({onPostClick:o,onTripClick:d});(0,a.useEffect)(()=>{h.current=v}),(0,a.useEffect)(()=>{if(!g.current||!g.current.isStyleLoaded())return;let e=g.current.getSource("feed-content");e&&(b(g.current,v.features),e.setData(v))},[v,b]),(0,a.useEffect)(()=>{if(!g.current||(g.current.resize(),!t))return;let e=setTimeout(()=>{var e,t;null==(e=g.current)||e.resize(),null==(t=g.current)||t.flyTo({center:P,zoom:.8,duration:700,essential:!0})},320);return()=>clearTimeout(e)},[t]);let j=(0,a.useCallback)(e=>{if(!e){if(y.current&&y.current(),I(g.current),g.current){try{g.current.remove()}catch(e){}g.current=null}return}l().accessToken="pk.eyJ1IjoiZ2VvdmliZXMiLCJhIjoiY21mc3dpa3BpMHIyYTJpczkwazFqeHJpYiJ9.eDh6FIjV3B22ry4Rse315g",setTimeout(()=>{if(!e.isConnected||g.current)return;let t=new(l()).Map({container:e,style:"mapbox://styles/mapbox/satellite-streets-v12",center:P,zoom:.8,minZoom:.3,maxZoom:14,pitch:0,bearing:0,projection:"globe",attributionControl:!1,logoPosition:"bottom-left"});t.on("styleimagemissing",x(t)),t.on("load",()=>{t.getStyle().layers.forEach(e=>{"symbol"===e.type&&t.setLayoutProperty(e.id,"visibility","none")}),t.setFog({color:"rgb(140, 175, 230)","high-color":"rgb(12, 30, 90)","horizon-blend":.02,"space-color":"#010F23","star-intensity":0}),t.addSource("feed-content",{type:"geojson",data:{type:"FeatureCollection",features:[]},cluster:!0,clusterMaxZoom:9,clusterRadius:45,clusterProperties:{leafImageId:[["coalesce",["accumulated"],["get","leafImageId"]],["get","imageId"]]}}),t.addLayer({id:"cluster-pins",type:"symbol",source:"feed-content",filter:["has","point_count"],layout:{"icon-image":["get","leafImageId"],"icon-anchor":"bottom","icon-allow-overlap":!0,"icon-ignore-placement":!0}}),t.addLayer({id:"cluster-badges",type:"symbol",source:"feed-content",filter:["has","point_count"],layout:{"icon-image":["concat","badge-",["to-string",["get","point_count"]]],"icon-anchor":"bottom","icon-allow-overlap":!0,"icon-ignore-placement":!0,"icon-offset":[0,-(C+3)]}}),t.addLayer({id:"unclustered-pins",type:"symbol",source:"feed-content",filter:["!",["has","point_count"]],layout:{"icon-image":["get","imageId"],"icon-anchor":"bottom","icon-allow-overlap":!0,"icon-ignore-placement":!0}}),y.current=w(t);let e=h.current||{type:"FeatureCollection",features:[]};b(t,e.features||[]),t.getSource("feed-content").setData(e)}),t.on("error",()=>{}),g.current=t},100)},[]);return(0,n.jsx)("div",{className:"mx-4 mb-3","data-feed-map":!0,children:(0,n.jsxs)("div",{className:"relative w-full overflow-hidden rounded-2xl transition-all duration-300 ease-in-out",style:{background:"#010F23",height:t?"350px":"0px"},children:[(0,n.jsx)("div",{ref:j,className:"w-full h-full"}),t&&(0,n.jsx)("div",{className:"absolute right-3 top-3 z-20",children:(0,n.jsx)("div",{className:"backdrop-blur-sm rounded-lg",style:{backgroundColor:"#FFFFFF33"},children:(0,n.jsx)("button",{onClick:()=>{var e;null==(e=g.current)||e.flyTo({center:P,zoom:.8,duration:700,essential:!0})},title:p("feed.centerMap"),className:"group transition-all duration-200 cursor-pointer",children:(0,n.jsx)("div",{className:"w-10 h-10 flex items-center justify-center rounded-lg group-hover:bg-black/8 transition-all duration-200",children:(0,n.jsxs)("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"white",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:"opacity-75 group-hover:opacity-90 transition-all duration-200",children:[(0,n.jsx)("circle",{cx:"12",cy:"12",r:"3"}),(0,n.jsx)("line",{x1:"12",y1:"2",x2:"12",y2:"6"}),(0,n.jsx)("line",{x1:"12",y1:"18",x2:"12",y2:"22"}),(0,n.jsx)("line",{x1:"2",y1:"12",x2:"6",y2:"12"}),(0,n.jsx)("line",{x1:"18",y1:"12",x2:"22",y2:"12"})]})})})})})]})})}},33383:()=>{},33843:(e,t,r)=>{"use strict";r.d(t,{W:()=>a,f:()=>n});let n="M12.0771 0.00122385C18.6255 0.0896761 23.8647 5.47078 23.779 12.0193L23.7644 13.1256C23.7391 15.0592 23.2486 16.8765 22.4066 18.4781C21.9399 19.567 21.3051 20.8124 20.4408 22.2431C18.7087 25.11 15.7216 28.7267 12.2838 32.2461C5.39946 26.6864 1.54614 20.2587 0.587477 16.9124C-0.0204365 15.2274 -0.105852 12.8542 0.0964077 10.9727C0.553098 4.76754 5.77249 -0.0838193 12.0771 0.00122385Z",a="0 0 24 33"}}]);