function mapClickSim(m,i){$('#contentMapModal_'+m).modal('show');function w(){if(window.contentMaps[m]!==undefined&&typeof toggleMapIconClick==="function"&&typeof resetMarkersAndCards==="function"){resetMarkersAndCards(m);toggleMapIconClick(m,i);}else{setTimeout(w,100);}}
w();}
function handleActionClick(e){const target=e.target.closest('[data-action]');if(!target)return;const{action,actionArgs}=target.dataset;const fn={mapClickSim}[action];fn&&fn(...actionArgs.split(',').map(Number));}
if(document.readyState==='loading'){document.addEventListener('DOMContentLoaded',()=>{document.querySelectorAll('[data-action]').forEach(b=>b.addEventListener('click',handleActionClick));});}else{document.querySelectorAll('[data-action]').forEach(b=>b.addEventListener('click',handleActionClick));}if(typeof window.contentMaps==='undefined'){window.contentMaps={};window.initialMapBounds={};}
if(typeof window.bounds==='undefined'){window.bounds={};}
if(typeof window.markerData==='undefined'){window.markerData={};}
if(!markerData[1]){markerData[1]={};}
function initMapbox_1(){mapboxgl.accessToken='pk.eyJ1IjoibGF6eXRyaXBzIiwiYSI6ImNsaTJ4anh2MTA5NDYzZW85ODJmMm45ZzcifQ.9u5pN47V7SsoFwF6_Pw5bQ';const contentMap_1=new mapboxgl.Map({container:'contentMap_1',style:'mapbox://styles/mapbox/streets-v11',center:[-116.11778817918791,34.4195277908562],zoom:5,cooperativeGestures:false});window.contentMaps[1]=contentMap_1;if(typeof window.bounds[1]==='undefined'){window.bounds[1]=new mapboxgl.LngLatBounds();}
markerData[1][0]={"lonLat":[" -117.16125040121192","32.71761271866671"],"type":"star-plain"};markerData[1][1]={"lonLat":["-116.539972","33.832528"],"best":"1","time":"180","distance":160,"type":"numbered","onClick":true,"route":{"id":"2000","color":"#fa5050"},"card":{"title":"Palm Springs","distanceTime":"\ud83d\ude97 160 miles \u23f1\ufe0f 3 hours","photoCode":"<img width=\"640\" height=\"480\" class=\"w-100 cardListCardImg\" src=\"https:\/\/cdn.lazytrips.com\/photos\/ea\/b6\/eab6976051edae594238fc2cbe91fe0f-bb.jpg\" alt=\"sunset in palm springs, california\">","oX":175,"oY":0},"cardLink":"\/trip\/road-trip-from-san-diego-to-palm-springs","cardLinkText":"Read more"};function getNewLngLat(map,originalLngLat,offsets){var pixel=map.project(new mapboxgl.LngLat(originalLngLat[0],originalLngLat[1]));pixel.x+=offsets.x;pixel.y+=offsets.y;return map.unproject(pixel);}
Object.keys(contentMaps).forEach(function(mapNum){contentMaps[mapNum].on('zoom',function(){Object.keys(markerData[mapNum]).forEach(function(iconNum){var marker=markerData[mapNum][iconNum];if(!isMobileDevice()&&marker.cardInstance){var offsets={x:marker.card.oX,y:marker.card.oY};var newLngLat=getNewLngLat(contentMaps[mapNum],marker.lonLat,offsets);marker.cardInstance.setLngLat([newLngLat.lng,newLngLat.lat]);}});});});async function fetchRoute(d,m,i,c){const p={routeId:d};const r=await fetch('/api/request-route',{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify(p)});if(r.ok){const data=await r.json();if(data.response&&data.response.route){const d=JSON.parse(data.response.route);markerData[m][i].routeJson=d;updateMapWithRoute(m,i,d,c);}}}
function updateMapWithRoute(m,i,r,c){const l='iconRoute_'+m+'_'+i;const g={type:'Feature',properties:{},geometry:{type:'LineString',coordinates:r}};if(contentMaps[m].getLayer(l)){contentMaps[m].setLayoutProperty(l,'visibility','visible');contentMaps[m].getSource(l).setData(g);}else{contentMaps[m].addLayer({id:l,type:'line',source:{type:'geojson',data:g},layout:{'line-join':'round','line-cap':'round'},paint:{'line-color':c,'line-width':5,'line-opacity':0.8}});}}
function hideRouteLayer(m,i){const l='iconRoute_'+m+'_'+i;if(contentMaps[m].getLayer(l)){contentMaps[m].setLayoutProperty(l,'visibility','none');}}
window.toggleMapIconClick=function(m,iconNum){if(markerData[m][iconNum].a){return;}
for(const[key,icon]of Object.entries(markerData[m])){if(parseInt(key)===iconNum){continue;}
if(icon.popupInstance){icon.popupInstance.remove();delete icon.popupInstance;}
if(icon.route&&contentMaps[m].getLayer('iconRoute_'+m+'_'+key)){hideRouteLayer(m,key);}
if(icon.marker){icon.marker.getElement().classList.remove('markerSpanSelect');}
if(icon.cardInstance){icon.cardInstance.remove();delete icon.cardInstance;}
if(icon.cardOverlay){var overlayToRemove=icon.cardOverlay;if(overlayToRemove&&overlayToRemove.parentNode){overlayToRemove.parentNode.removeChild(overlayToRemove);delete icon.cardOverlay;}}
icon.a=false;}
if(!markerData[m][iconNum].a){markerData[m][iconNum].marker.getElement().classList.add('markerSpanSelect');if(markerData[m][iconNum].popup){const t=markerData[m][iconNum].popup.title;const p=markerData[m][iconNum].popup.text;let popupHTML='<div>';if(t){popupHTML+='<p class="font-semi-bold mb-1 font-size-normal">'+t+'</p>';}
if(p){popupHTML+='<p class="mb-0 font-size-normal">'+p+'</p>';}
popupHTML+='</div>';var popup=new mapboxgl.Popup({anchor:'bottom',closeButton:false,closeOnClick:false,className:'pointer'}).setLngLat(markerData[m][iconNum].lonLat).setHTML(popupHTML).addTo(contentMaps[m]);markerData[m][iconNum].popupInstance=popup;popup._content.addEventListener('click',function(){toggleMapIconClick(m,iconNum);});markerData[m][iconNum].marker.getElement().style.display='none';}
if(markerData[m][iconNum].route){const layerId='iconRoute_'+m+'_'+iconNum;if(contentMaps[m].getLayer(layerId)){contentMaps[m].setLayoutProperty(layerId,'visibility','visible');}else{fetchRoute(markerData[m][iconNum].route.id,m,iconNum,markerData[m][iconNum].route.color);}}
if(markerData[m][iconNum].card){var cardContent={cardTitle:markerData[m][iconNum].card.title,cardDistanceTime:markerData[m][iconNum].card.distanceTime,photoCode:markerData[m][iconNum].card.photoCode,};if(markerData[m][iconNum].hasOwnProperty('cardLink')){cardContent.cardLink=markerData[m][iconNum].cardLink;}
if(markerData[m][iconNum].hasOwnProperty('cardLinkText')){cardContent.cardLinkText=markerData[m][iconNum].cardLinkText;}
if(!isMobileDevice()){var cardContentHtml=createCardContentHtml(cardContent,false);var offsets={x:markerData[m][iconNum].card.oX,y:markerData[m][iconNum].card.oY};var newLngLat=getNewLngLat(contentMaps[m],markerData[m][iconNum]['lonLat'],offsets);var cardPopup=new mapboxgl.Popup({anchor:'bottom',closeButton:false,closeOnClick:false,className:'mapPopupCard'}).setHTML(cardContentHtml).setLngLat([newLngLat.lng,newLngLat.lat]).addTo(contentMaps[m]);markerData[m][iconNum].cardInstance=cardPopup;}else{var cardMobile=document.createElement('div');cardMobile.className='mapPopupCardMobile';cardMobile.innerHTML=createCardContentHtml(cardContent,true);var mapContainer=contentMaps[m].getContainer();mapContainer.appendChild(cardMobile);markerData[m][iconNum].cardOverlay=cardMobile;}}
markerData[m][iconNum].a=true;updateMapBounds(m,iconNum);}else{resetMarkersAndCards(m);}}
window.resetMarkersAndCards=function(m){Object.keys(markerData[m]).forEach((i)=>{if(markerData[m][i].marker){markerData[m][i].marker.getElement().classList.remove('markerSpanSelect');}
if(markerData[m][i].popupInstance){markerData[m][i].popupInstance.remove();delete markerData[m][i].popupInstance;}
if(markerData[m][i].route){if(contentMaps[m].getLayer('iconRoute_'+m+'_'+i)){hideRouteLayer(m,i);}}
if(markerData[m][i].card){if(markerData[m][i].cardInstance){markerData[m][i].cardInstance.remove();delete markerData[m][i].cardInstance;}}
if(markerData[m][i].cardOverlay){var overlayToRemove=markerData[m][i].cardOverlay;if(overlayToRemove&&overlayToRemove.parentNode){overlayToRemove.parentNode.removeChild(overlayToRemove);delete markerData[m][i].cardOverlay;}}
markerData[m][i].marker.getElement().style.display='block';markerData[m][i].a=false;if(markerData[m][i].best){updateMapBounds(m,i);}});}
function createCardContentHtml(c,m){let htmlContent='<div class="cardContentPopup">';if(c.photoCode){htmlContent+='<div class="card-img-top cardListCardTop">'+c.photoCode+'</div>';}
if(c.cardTitle||c.cardDistanceTime||c.cardLink){htmlContent+='<div class="card-body cardListCardBody">';if(c.cardTitle){htmlContent+='<div class="card-title cardListCardTitle">'+c.cardTitle+'</div>';}
if(c.cardDistanceTime){if(m){const parts=c.cardDistanceTime.split('⏱️');htmlContent+='<div class="cardDistanceTime"><div class="w-100" style="margin-bottom: 8px;">'+parts[0].trim()+'</div><div class="w-100">⏱️ '+parts[1].trim()+'</div></div>';}else{htmlContent+='<div class="cardDistanceTime">'+c.cardDistanceTime+'</div>';}}
if(c.cardLink){var linkText=c.cardLinkText||'Read more';htmlContent+='<a class="but-primary-outline mt-3" href="'+c.cardLink+'">'+linkText+'</a>';}
htmlContent+='</div>';}
htmlContent+='</div>';return htmlContent;}
$(document).on('shown.bs.modal','[id^=contentMapModal_]',function(){let modalId=$(this).attr('id');let mapNum=modalId.replace('contentMapModal_','');if(window.contentMaps&&window.contentMaps[mapNum]){window.contentMaps[mapNum].resize();Object.keys(markerData[mapNum]).forEach((i)=>{updateMapBounds(mapNum,i);});}});$(document).on('hidden.bs.modal','[id^=contentMapModal_]',function(){resetMarkersAndCards($(this).attr('id').replace('contentMapModal_',''));});function isMobileDevice(){return window.innerWidth<=768||window.innerHeight<=600;}
function updateMapBounds(mapNum,iconNum){const oldBounds=contentMaps[mapNum].getBounds();const newBounds=contentMaps[mapNum].getBounds();const mapDimensions=contentMaps[mapNum].getContainer().getBoundingClientRect();const clickedMarker=markerData[mapNum][iconNum];const lngDiff=oldBounds.getNorthEast().lng-oldBounds.getSouthWest().lng;const latDiff=oldBounds.getNorthEast().lat-oldBounds.getSouthWest().lat;const lngPerPx=lngDiff / mapDimensions.width;const latPerPx=latDiff / mapDimensions.height;if(clickedMarker['popup']&&clickedMarker.a){const pixelCoordinates=contentMaps[mapNum].project(clickedMarker.lonLat);const tooCloseX=100;const tooCloseT=80;const tooCloseB=10;const eXp=120;const eTp=120;const eBp=20;const extendNWSE=[0,0,0,0];if(pixelCoordinates.x<tooCloseX){extendNWSE[3]=eXp-pixelCoordinates.x;}
else if(pixelCoordinates.x>mapDimensions.width-tooCloseX){extendNWSE[1]=eXp-(mapDimensions.width-pixelCoordinates.x);}
if(pixelCoordinates.y<tooCloseT){extendNWSE[0]=eTp-pixelCoordinates.y;}
else if(pixelCoordinates.y>mapDimensions.height-tooCloseB){extendNWSE[2]=eBp-(mapDimensions.height-pixelCoordinates.y);}
for(let i=0;i<extendNWSE.length;i++){if(extendNWSE[i]>0){switch(i){case 0:const extendNorthLat=extendNWSE[i]*latPerPx;newBounds.extend(new mapboxgl.LngLat(clickedMarker.lonLat[0],oldBounds.getNorthEast().lat+extendNorthLat));break;case 1:const extendEastLng=extendNWSE[i]*lngPerPx;newBounds.extend(new mapboxgl.LngLat(oldBounds.getNorthEast().lng+extendEastLng,clickedMarker.lonLat[1]));break;case 2:const extendSouthLat=extendNWSE[i]*latPerPx;newBounds.extend(new mapboxgl.LngLat(clickedMarker.lonLat[0],oldBounds.getSouthWest().lat-extendSouthLat));break;case 3:const extendWestLng=extendNWSE[i]*lngPerPx;newBounds.extend(new mapboxgl.LngLat(oldBounds.getSouthWest().lng-extendWestLng,clickedMarker.lonLat[1]));break;}}}
if(Math.abs(newBounds.getSouthWest().lng-oldBounds.getSouthWest().lng)>1e-6||Math.abs(newBounds.getSouthWest().lat-oldBounds.getSouthWest().lat)>1e-6||Math.abs(newBounds.getNorthEast().lng-oldBounds.getNorthEast().lng)>1e-6||Math.abs(newBounds.getNorthEast().lat-oldBounds.getNorthEast().lat)>1e-6){contentMaps[mapNum].fitBounds(newBounds,{padding:0,duration:600,easing:(t)=>t*(2-t)});}}
if(clickedMarker['route']&&clickedMarker['routeJson']&&clickedMarker['clicked']){const paddingRoutePixels=20;let extendWest=false,extendEast=false,extendNorth=false,extendSouth=false;clickedMarker['routeJson'].forEach(coord=>{if(coord[0]<newBounds.getWest())extendWest=true;if(coord[0]>newBounds.getEast())extendEast=true;if(coord[1]>newBounds.getNorth())extendNorth=true;if(coord[1]<newBounds.getSouth())extendSouth=true;newBounds.extend(new mapboxgl.LngLat(coord[0],coord[1]));});const C=contentMaps[mapNum].getContainer();const lngDegPerPixel=(newBounds.getEast()-newBounds.getWest())/ C.offsetWidth;const latDegPerPixel=(newBounds.getNorth()-newBounds.getSouth())/ C.offsetHeight;const wB=extendWest?newBounds.getWest()-paddingRoutePixels*lngDegPerPixel:newBounds.getWest();const eB=extendEast?newBounds.getEast()+paddingRoutePixels*lngDegPerPixel:newBounds.getEast();const nB=extendNorth?newBounds.getNorth()+paddingRoutePixels*latDegPerPixel:newBounds.getNorth();const sB=extendSouth?newBounds.getSouth()-paddingRoutePixels*latDegPerPixel:newBounds.getSouth();const paddedBounds=new mapboxgl.LngLatBounds(new mapboxgl.LngLat(wB,sB),new mapboxgl.LngLat(eB,nB));contentMaps[mapNum].fitBounds(paddedBounds,{padding:0,duration:600,easing:(t)=>t*(2-t)});}
if(!isMobileDevice()&&markerData[mapNum][iconNum].card&&markerData[mapNum][iconNum].a){const w=300;const h=360;const p=100;const oX=markerData[mapNum][iconNum].card.oX;const oY=markerData[mapNum][iconNum].card.oY;const markerPixel=contentMaps[mapNum].project(clickedMarker.lonLat);const topLeftPixel={x:markerPixel.x+oX-w/2-p,y:markerPixel.y+oY-h-p};const topRightPixel={x:topLeftPixel.x+w+(2*p),y:topLeftPixel.y};const bottomLeftPixel={x:topLeftPixel.x,y:topLeftPixel.y+h+(2*p)};const bottomRightPixel={x:topRightPixel.x,y:bottomLeftPixel.y};[topLeftPixel,topRightPixel,bottomLeftPixel,bottomRightPixel].forEach(pixel=>{const lngLat=contentMaps[mapNum].unproject(pixel);newBounds.extend(lngLat);});contentMaps[mapNum].fitBounds(newBounds,{padding:0,duration:600,easing:(t)=>t*(2-t)});}}markerData[1][2]={"lonLat":["-118.243563","34.052357"],"best":"2","time":"140","distance":120,"type":"numbered","onClick":true,"route":{"id":"593","color":"#fa5050"},"card":{"title":"Los Angeles","distanceTime":"\ud83d\ude97 120 miles \u23f1\ufe0f 2 hours, 20 minutes","photoCode":"<img width=\"640\" height=\"480\" class=\"w-100 cardListCardImg\" src=\"https:\/\/cdn.lazytrips.com\/photos\/ff\/9a\/ff9a6e5aee27d4a4a1d59cf052b8da14-bb.jpg\" alt=\"Los Angeles, California, USA taken at the world famous landmark Hollywood Sign.\">","oX":-175,"oY":0},"cardLink":"\/trip\/road-trip-from-san-diego-to-los-angeles","cardLinkText":"Read more"};markerData[1][3]={"lonLat":["-117.350815","33.158055"],"best":"3","time":"40","distance":35,"type":"numbered","onClick":true,"route":{"id":"1998","color":"#fa5050"},"card":{"title":"Carlsbad","distanceTime":"\ud83d\ude97 35 miles \u23f1\ufe0f 40 minutes","photoCode":"<img width=\"640\" height=\"480\" class=\"w-100 cardListCardImg\" src=\"https:\/\/cdn.lazytrips.com\/photos\/1c\/8a\/1c8a74938c17e8f8dbcaa85ed3bd26d5-bb.jpg\" alt=\"An aerial shot of a pale blue and white wooden lifeguard tower stands on the sands at South Carlsbad State Beach, with vegetation growing behind it\">","oX":-175,"oY":0},"cardLink":"#","cardLinkText":""};markerData[1][4]={"lonLat":["-117.161091","32.715728"],"best":"4","time":"60","distance":70,"type":"numbered","onClick":true,"route":{"id":"2081","color":"#fa5050"},"card":{"title":"San Juan Capistrano","distanceTime":"\ud83d\ude97 70 miles \u23f1\ufe0f 1 hour","photoCode":"<img width=\"640\" height=\"480\" class=\"w-100 cardListCardImg\" src=\"https:\/\/cdn.lazytrips.com\/photos\/73\/42\/7342910e78376c057636410c87434af4-bb.jpg\" alt=\"Courtyard of Mission San Juan Capistrano in California on a sunny day with a pond in the foreground and building in the background.\">","oX":175,"oY":0},"cardLink":"#","cardLinkText":""};markerData[1][5]={"lonLat":["-117.083499","36.519229"],"best":"5","time":"300","distance":280,"type":"numbered","onClick":true,"route":{"id":"686","color":"#fa5050"},"card":{"title":"Death Valley National Park","distanceTime":"\ud83d\ude97 280 miles \u23f1\ufe0f 5 hours","photoCode":"<img width=\"640\" height=\"480\" class=\"w-100 cardListCardImg\" src=\"https:\/\/cdn.lazytrips.com\/photos\/6d\/a5\/6da5ad4950739250b8ad336737afc823-bb.jpg\" alt=\"Badwater Basin salt flats in Death Valley National Park during a misty sunset\">","oX":175,"oY":0},"cardLink":"\/trip\/road-trip-from-san-diego-to-death-valley-national-park","cardLinkText":"Read more"};markerData[1][6]={"lonLat":["-115.731255","33.353487"],"best":"6","time":"150","distance":120,"type":"numbered","onClick":true,"route":{"id":"2160","color":"#fa5050"},"card":{"title":"Salton Sea","distanceTime":"\ud83d\ude97 120 miles \u23f1\ufe0f 2 hours, 30 minutes","photoCode":"<img width=\"640\" height=\"480\" class=\"w-100 cardListCardImg\" src=\"https:\/\/cdn.lazytrips.com\/photos\/47\/57\/475746a88c111bbdba39600f8205d7b7-bb.jpg\" alt=\"An abandoned rusty swing at Bombay beach in Salton Sea, California.\">","oX":175,"oY":0},"cardLink":"#","cardLinkText":""};markerData[1][7]={"lonLat":["-115.140990","36.170176"],"best":"7","time":"300","distance":330,"type":"numbered","onClick":true,"route":{"id":"554","color":"#fa5050"},"card":{"title":"Las Vegas","distanceTime":"\ud83d\ude97 330 miles \u23f1\ufe0f 5 hours","photoCode":"<img width=\"640\" height=\"480\" class=\"w-100 cardListCardImg\" src=\"https:\/\/cdn.lazytrips.com\/photos\/f6\/23\/f6232353f60a778621f8709ec2e6a649-bb.jpg\" alt=\"Las Vegas, Nevada USA, at the Welcome to Las Vegas Sign at dusk.\">","oX":175,"oY":0},"cardLink":"\/trip\/road-trip-from-san-diego-to-las-vegas","cardLinkText":"Read more"};markerData[1][8]={"lonLat":["-111.757065","34.873841"],"best":"8","time":"550","distance":510,"type":"numbered","onClick":true,"route":{"id":"157","color":"#fa5050"},"card":{"title":"Sedona","distanceTime":"\ud83d\ude97 510 miles \u23f1\ufe0f 9 hours, 10 minutes","photoCode":"<img width=\"640\" height=\"480\" class=\"w-100 cardListCardImg\" src=\"https:\/\/cdn.lazytrips.com\/photos\/9c\/af\/9caf1a2974b3202ce8a840bcaf790d97-bb.jpg\" alt=\"Travel in Devil&#039;s Bridge Trail, scenic view panoramic landscape, Sedona, Arizona, USA\">","oX":175,"oY":-60},"cardLink":"\/trip\/road-trip-from-san-diego-to-sedona","cardLinkText":"Read more"};markerData[1][9]={"lonLat":["-119.258171","37.910893"],"best":"9","time":"390","distance":400,"type":"numbered","onClick":true,"route":{"id":"556","color":"#fa5050"},"card":{"title":"Yosemite National Park","distanceTime":"\ud83d\ude97 400 miles \u23f1\ufe0f 6 hours, 30 minutes","photoCode":"<img width=\"640\" height=\"480\" class=\"w-100 cardListCardImg\" src=\"https:\/\/cdn.lazytrips.com\/photos\/15\/e8\/15e8f2450f01c3ab44eb075022c0f2c2-bb.jpg\" alt=\"Yosemite National Park, California, USA with water in the foreground and the mountains against a blue sky.\">","oX":175,"oY":0},"cardLink":"\/trip\/road-trip-from-san-diego-to-yosemite-national-park","cardLinkText":"Read more"};markerData[1][10]={"lonLat":["-122.486214","37.769422"],"best":"10","time":"620","distance":560,"type":"numbered","onClick":true,"route":{"id":"97","color":"#fa5050"},"card":{"title":"San Francisco","distanceTime":"\ud83d\ude97 560 miles \u23f1\ufe0f 10 hours, 20 minutes","photoCode":"<img width=\"640\" height=\"480\" class=\"w-100 cardListCardImg\" src=\"https:\/\/cdn.lazytrips.com\/photos\/58\/95\/5895941ca9fc5be7b04becd102646da7-bb.jpg\" alt=\"View across Golden Gate Bridge and downtown San Francisco\">","oX":-175,"oY":0},"cardLink":"\/trip\/road-trip-from-san-diego-to-san-francisco","cardLinkText":"Read more"};markerData[1][11]={"lonLat":["-112.121796","35.998795"],"best":"11","time":"470","distance":500,"type":"numbered","onClick":true,"route":{"id":"562","color":"#fa5050"},"card":{"title":"Grand Canyon National Park","distanceTime":"\ud83d\ude97 500 miles \u23f1\ufe0f 7 hours, 50 minutes","photoCode":"<img width=\"640\" height=\"480\" class=\"w-100 cardListCardImg\" src=\"https:\/\/cdn.lazytrips.com\/photos\/88\/a9\/88a92120dc0c036a6076bd246005f804-bb.jpg\" alt=\"Beautiful Landscape of Grand Canyon from Desert View Point with the Colorado River visible during dusk\">","oX":175,"oY":0},"cardLink":"\/trip\/road-trip-from-san-diego-to-grand-canyon","cardLinkText":"Read more"};markerData[1][12]={"lonLat":["-120.034182","39.097692"],"best":"12","time":"540","distance":530,"type":"numbered","onClick":true,"route":{"id":"653","color":"#fa5050"},"card":{"title":"Lake Tahoe","distanceTime":"\ud83d\ude97 530 miles \u23f1\ufe0f 9 hours","photoCode":"<img width=\"640\" height=\"480\" class=\"w-100 cardListCardImg\" src=\"https:\/\/cdn.lazytrips.com\/photos\/5a\/8f\/5a8f60cd1f53f580e723cac84c24c238-bb.jpg\" alt=\"Lake Tahoe rocky shoreline in sunny day, beach with blue sky over clear transparent water\">","oX":-175,"oY":0},"cardLink":"\/trip\/road-trip-from-san-diego-to-lake-tahoe","cardLinkText":"Read more"};markerData[1][13]={"lonLat":["-116.261937","34.093415"],"best":"13","time":"170","distance":165,"type":"numbered","onClick":true,"route":{"id":"130","color":"#fa5050"},"card":{"title":"Joshua Tree National Park","distanceTime":"\ud83d\ude97 165 miles \u23f1\ufe0f 2 hours, 50 minutes","photoCode":"<img width=\"640\" height=\"480\" class=\"w-100 cardListCardImg\" src=\"https:\/\/cdn.lazytrips.com\/photos\/04\/91\/049164f9bdd8d846320639115a337d5b-bb.jpg\" alt=\"Unique Joshua tree standing tall with a rocky background in Joshua Tree National Park on a sunny day\">","oX":175,"oY":0},"cardLink":"\/trip\/road-trip-from-san-diego-to-joshua-tree-national-park","cardLinkText":"Read more"};markerData[1][14]={"lonLat":["-121.807972","36.270449"],"best":"14","time":"480","distance":420,"type":"numbered","onClick":true,"route":{"id":"600","color":"#fa5050"},"card":{"title":"Big Sur","distanceTime":"\ud83d\ude97 420 miles \u23f1\ufe0f 8 hours","photoCode":"<img width=\"640\" height=\"480\" class=\"w-100 cardListCardImg\" src=\"https:\/\/cdn.lazytrips.com\/photos\/6a\/39\/6a394b40e8812cafd17b974b6286aa99-bb.jpg\" alt=\"Big Sur, California taken from a hill looking down at a secret waterfall and sand beach surrounded by rocks on a sunny day.\">","oX":-175,"oY":0},"cardLink":"\/trip\/road-trip-from-san-diego-to-big-sur","cardLinkText":"Read more"};markerData[1][15]={"lonLat":["-112.074103","33.448235"],"best":"15","time":"330","distance":355,"type":"numbered","onClick":true,"route":{"id":"1723","color":"#fa5050"},"card":{"title":"Phoenix","distanceTime":"\ud83d\ude97 355 miles \u23f1\ufe0f 5 hours, 30 minutes","photoCode":"<img width=\"640\" height=\"480\" class=\"w-100 cardListCardImg\" src=\"https:\/\/cdn.lazytrips.com\/photos\/a8\/18\/a818f01a1cbaae0504e9e24cfc4ffd88-bb.jpg\" alt=\"Colourful view of Pheonix city and its lights at dusk.\">","oX":175,"oY":0},"cardLink":"\/trip\/road-trip-from-san-diego-to-phoenix","cardLinkText":"Read more"};markerData[1][16]={"lonLat":["-122.394273","38.427425"],"best":"16","time":"760","distance":690,"type":"numbered","onClick":true,"route":{"id":"1223","color":"#fa5050"},"card":{"title":"Napa Valley &amp; Sonoma","distanceTime":"\ud83d\ude97 690 miles \u23f1\ufe0f 12 hours, 40 minutes","photoCode":"<img width=\"640\" height=\"480\" class=\"w-100 cardListCardImg\" src=\"https:\/\/cdn.lazytrips.com\/photos\/6f\/37\/6f37856571598fe083c02d14f266445e-bb.jpg\" alt=\"Rows of grape vines with mountains and the sun setting in the background\">","oX":-175,"oY":0},"cardLink":"\/trip\/road-trip-from-san-diego-to-napa-valley","cardLinkText":"Read more"};markerData[1][17]={"lonLat":["-113.009812","37.292835"],"best":"17","time":"465","distance":500,"type":"numbered","onClick":true,"route":{"id":"674","color":"#fa5050"},"card":{"title":"Zion National Park","distanceTime":"\ud83d\ude97 500 miles \u23f1\ufe0f 7 hours, 45 minutes","photoCode":"<img width=\"640\" height=\"480\" class=\"w-100 cardListCardImg\" src=\"https:\/\/cdn.lazytrips.com\/photos\/75\/6a\/756a3653b5b99782c9e23c4f3981a13a-bb.jpg\" alt=\"Zion National Park, USA taken at sunset with a stream and trees in the foreground and red canyons in the distance. \">","oX":175,"oY":0},"cardLink":"\/trip\/road-trip-from-san-diego-to-zion-national-park","cardLinkText":"Read more"};markerData[1][18]={"lonLat":["-121.8993372777271","36.600571359990354"],"best":"18","time":"660","distance":520,"type":"numbered","onClick":true,"route":{"id":"2077","color":"#fa5050"},"card":{"title":"Monterey","distanceTime":"\ud83d\ude97 520 miles \u23f1\ufe0f 11 hours","photoCode":"<img width=\"640\" height=\"480\" class=\"w-100 cardListCardImg\" src=\"https:\/\/cdn.lazytrips.com\/photos\/59\/3d\/593d8f933c57cd548c101e738bda7dce-bb.jpg\" alt=\"Blooming pale dewplant along the rocky shore of Monterey Bay coastline at Pacific Grove, California\">","oX":-175,"oY":0},"cardLink":"\/trip\/road-trip-from-san-diego-to-monterey","cardLinkText":"Read more"};markerData[1][19]={"lonLat":["-119.699462","34.419691"],"best":"19","time":"210","distance":220,"type":"numbered","onClick":true,"route":{"id":"574","color":"#fa5050"},"card":{"title":"Santa Barbara","distanceTime":"\ud83d\ude97 220 miles \u23f1\ufe0f 3 hours, 30 minutes","photoCode":"<img width=\"640\" height=\"480\" class=\"w-100 cardListCardImg\" src=\"https:\/\/cdn.lazytrips.com\/photos\/34\/de\/34de3a277aa486c38ba0ec09466bdc14-bb.jpg\" alt=\"The historic Santa Barbara Mission in California\">","oX":-175,"oY":0},"cardLink":"\/trip\/road-trip-from-san-diego-to-santa-barbara","cardLinkText":"Read more"};markerData[1][20]={"lonLat":["-120.150557","34.593088"],"best":"20","time":"300","distance":250,"type":"numbered","onClick":true,"route":{"id":"673","color":"#fa5050"},"card":{"title":"Solvang","distanceTime":"\ud83d\ude97 250 miles \u23f1\ufe0f 5 hours","photoCode":"<img width=\"640\" height=\"480\" class=\"w-100 cardListCardImg\" src=\"https:\/\/cdn.lazytrips.com\/photos\/f7\/a5\/f7a5de0efb3df0d3c4643bdd4126d937-bb.jpg\" alt=\"Colorful houses in the Danish village of Solvang in southern California.\">","oX":-175,"oY":0},"cardLink":"\/trip\/road-trip-from-san-diego-to-solvang","cardLinkText":"Read more"};initialMapBounds[1]=new mapboxgl.LngLatBounds(window.bounds[1].getSouthWest(),window.bounds[1].getNorthEast());const visibleMapRoutes_1=[];contentMaps[1].on('click',(e)=>{resetMarkersAndCards(1);});const markerConfig={'finish':{className:'marker_finish',size:[58,58],offset:[0,-29],span:false,best:false,text:false,},'start':{className:'marker_start',size:[58,58],offset:[0,-29],span:false,best:false,text:false,},'star':{className:'marker_star',size:[58,58],offset:[0,-29],span:false,best:false,text:false,},'numbered':{className:'mapMarkerNum',size:false,offset:[0,0],span:true,best:true,text:false,},'star-plain':{className:'mapMarkerNum markerSpanRed',size:false,offset:[0,0],span:true,best:false,text:'☆',},'grey':{className:'mapMarkerNum markerSpanGrey',size:false,offset:[0,0],span:true,best:false,text:false,},};function addMarkersToMap(m,f=null){Object.values(markerData[m]).forEach((i,n)=>{if(f!==null&&n<f){return;}
var el=document.createElement('div');var mC=markerConfig[i.type]||markerConfig.star;el.className=mC.className;if(mC.span){var t='';if(i.best){t=i.best;}
else if(mC.text){t=mC.text;}
el.innerHTML='<span><div id="markerSpan-'+m+'-'+n+'" class="mapMarkerNumInner">'+t+'</div></span>';}
if(mC.width&&mC.height){el.style.width=mC.width+'px';el.style.height=mC.height+'px';}
var marker=new mapboxgl.Marker(el,{offset:mC.offset}).setLngLat(i.lonLat).addTo(window.contentMaps[m]);marker.markerType=i.iconType;if(f!==null){}
i.marker=marker;if(i.best){window.bounds[m].extend(i.lonLat);}
if(i.onClick){marker.getElement().addEventListener('click',function(){event.stopPropagation();toggleMapIconClick(m,n);});}});}
markerData[1][28]={"lonLat":["-122.691636","45.511937"],"time":"1500","distance":1400,"type":"grey","onClick":true,"route":{"id":"677","color":"#fa5050"},"card":{"title":"Portland","distanceTime":"\ud83d\ude97 1,400 miles \u23f1\ufe0f 25 hours","photoCode":"<img width=\"640\" height=\"480\" class=\"w-100 cardListCardImg\" src=\"https:\/\/cdn.lazytrips.com\/photos\/51\/59\/5159f05bd6763bfcaece938e302b482a-bb.jpg\" alt=\"Mount Hood near Portland, Oregon surrounded by field and forests.\">","oX":-175,"oY":0},"cardLink":"\/trip\/road-trip-from-san-diego-to-portland","cardLinkText":"Read more"};markerData[1][21]={"lonLat":["-111.893550","40.761256"],"time":"700","distance":750,"type":"grey","onClick":true,"route":{"id":"320","color":"#fa5050"},"card":{"title":"Salt Lake City","distanceTime":"\ud83d\ude97 750 miles \u23f1\ufe0f 11 hours, 40 minutes","photoCode":"<img width=\"640\" height=\"480\" class=\"w-100 cardListCardImg\" src=\"https:\/\/cdn.lazytrips.com\/photos\/81\/79\/8179945806e62ccc6ef5c8400712ffd5-bb.jpg\" alt=\"Salt Lake Temple on Temple Square and the Reflecting Pool in Salt Lake City, Utah.\">","oX":175,"oY":0},"cardLink":"\/trip\/road-trip-from-san-diego-to-salt-lake-city","cardLinkText":"Read more"};markerData[1][22]={"lonLat":["-95.368246","29.758848"],"time":"1350","distance":1360,"type":"grey","onClick":true,"route":{"id":"114","color":"#fa5050"},"card":{"title":"Houston","distanceTime":"\ud83d\ude97 1,360 miles \u23f1\ufe0f 22 hours, 30 minutes","photoCode":"<img width=\"640\" height=\"480\" class=\"w-100 cardListCardImg\" src=\"https:\/\/cdn.lazytrips.com\/photos\/72\/d6\/72d6394fb5307bdd796abed6462dede5-bb.jpg\" alt=\"Houston, Texas, USA taken at downtown with the city skyline in the distance at twilight.\">","oX":175,"oY":0},"cardLink":"\/trip\/road-trip-from-san-diego-to-houston","cardLinkText":"Read more"};markerData[1][23]={"lonLat":["-104.971364","39.746412"],"time":"1140","distance":1200,"type":"grey","onClick":true,"route":{"id":"2078","color":"#fa5050"},"card":{"title":"Denver","distanceTime":"\ud83d\ude97 1,200 miles \u23f1\ufe0f 19 hours","photoCode":"<img width=\"640\" height=\"480\" class=\"w-100 cardListCardImg\" src=\"https:\/\/cdn.lazytrips.com\/photos\/9e\/54\/9e54ea24fdd35257ca8d27019139693c-bb.jpg\" alt=\"Summer in Denver Colorado. Denver Summer Skyline Panorama. United States.\">","oX":175,"oY":0},"cardLink":"\/trip\/road-trip-from-san-diego-to-denver","cardLinkText":"Read more"};markerData[1][24]={"lonLat":["-110.596284","44.426658"],"time":"1020","distance":1120,"type":"grey","onClick":true,"route":{"id":"793","color":"#fa5050"},"card":{"title":"Yellowstone National Park","distanceTime":"\ud83d\ude97 1,120 miles \u23f1\ufe0f 17 hours","photoCode":"<img width=\"640\" height=\"480\" class=\"w-100 cardListCardImg\" src=\"https:\/\/cdn.lazytrips.com\/photos\/c9\/fd\/c9fded00a9248c367c62a9f6326bd0ee-bb.jpg\" alt=\"Grand Prismatic Spring, Midway Geyser Basin, Yellowstone National Park, Wyoming, USA. The colorful waters are caused by a bacteria.\">","oX":175,"oY":0},"cardLink":"\/trip\/road-trip-from-san-diego-to-yellowstone","cardLinkText":"Read more"};markerData[1][25]={"lonLat":["-97.741968","30.266763"],"time":"1260","distance":1400,"type":"grey","onClick":true,"route":{"id":"840","color":"#fa5050"},"card":{"title":"Austin","distanceTime":"\ud83d\ude97 1,400 miles \u23f1\ufe0f 21 hours","photoCode":"<img width=\"640\" height=\"480\" class=\"w-100 cardListCardImg\" src=\"https:\/\/cdn.lazytrips.com\/photos\/78\/f5\/78f5bae6552497610c1ffd47a2b867df-bb.jpg\" alt=\"American and Texas State flags flying at the Texas State Capitol building in Austin\">","oX":175,"oY":0},"cardLink":"\/trip\/road-trip-from-san-diego-to-austin-texas","cardLinkText":"Read more"};markerData[1][26]={"lonLat":["-96.796769","32.776453"],"time":"1350","distance":1500,"type":"grey","onClick":true,"route":{"id":"377","color":"#fa5050"},"card":{"title":"Dallas","distanceTime":"\ud83d\ude97 1,500 miles \u23f1\ufe0f 22 hours, 30 minutes","photoCode":"<img width=\"640\" height=\"480\" class=\"w-100 cardListCardImg\" src=\"https:\/\/cdn.lazytrips.com\/photos\/ac\/ec\/acecb1112ed628d18abd1b8c44f16497-bb.jpg\" alt=\"Skyline of downtown Dallas, Texas under a beautiful sky.\">","oX":175,"oY":0},"cardLink":"\/trip\/road-trip-from-san-diego-to-dallas","cardLinkText":"Read more"};markerData[1][27]={"lonLat":["-74.168877","40.489476"],"time":"2880","distance":3080,"type":"grey","onClick":true,"route":{"id":"2161","color":"#fa5050"},"card":{"title":"New York City","distanceTime":"\ud83d\ude97 3,080 miles \u23f1\ufe0f 48 hours","photoCode":"<img width=\"640\" height=\"480\" class=\"w-100 cardListCardImg\" src=\"https:\/\/cdn.lazytrips.com\/photos\/36\/be\/36be51360d2627043ec50622559e2852-bb.jpg\" alt=\"Manhattan skyline including architectural landmark Chrysler Building in New York City\">","oX":175,"oY":0},"cardLink":"\/trip\/road-trip-from-san-diego-to-new-york","cardLinkText":"Read more"};addMarkersToMap(1);contentMap_1.fitBounds(window.bounds[1],{padding:{top:60,bottom:60,left:60,right:60}});const sortByValue=document.querySelector('.cardListSortDropdown').value;sortMapMarkers(markerData,sortOptionsMap,sortByValue,1);}const sortOptionsMap={'best':'best','distance':'distanceSort',};function sortMapMarkers(markerData,sortOptionsMap,sortBy,listNum){const markersWithDistance=Object.values(markerData[listNum]).filter(marker=>marker.hasOwnProperty('distance')&&marker.hasOwnProperty('best'));const hasDistanceSort=markersWithDistance.some(marker=>marker.hasOwnProperty('distanceSort'));if(!hasDistanceSort){const sortedMarkers=markersWithDistance.sort((a,b)=>a.distance-b.distance);sortedMarkers.forEach((sortedMarker,index)=>{sortedMarker.distanceSort=index+1;});}
Object.keys(markerData[listNum]).forEach(iconNum=>{const marker=markerData[listNum][iconNum];if(marker.hasOwnProperty('distance')&&marker.hasOwnProperty('best')){const markerElement=document.getElementById('markerSpan-'+listNum+'-'+iconNum);if(markerElement){const propertyToUse=sortOptionsMap[sortBy]||sortBy;const v=marker[propertyToUse];if(v!==undefined){markerElement.innerHTML=v;}else{markerElement.innerHTML='';}}}});document.querySelectorAll('.cardListSortDropdown').forEach(function(dropdownUpdate){dropdownUpdate.value=sortBy;});}
(function(){function initializeSortDropdown(){document.querySelectorAll('.cardListSortDropdown').forEach(function(dropdown){dropdown.addEventListener('change',function(){const sortBy=this.value;const listNum=this.getAttribute('data-listnum');const cardsContainer=document.querySelector('.row[data-listnum=\"'+listNum+'\"]');Array.from(cardsContainer.children).sort((a,b)=>{const aValue=parseFloat(a.getAttribute('data-'+sortBy)||Infinity);const bValue=parseFloat(b.getAttribute('data-'+sortBy)||Infinity);return aValue-bValue;}).forEach((card,index)=>{cardsContainer.appendChild(card);const titleElement=card.querySelector('.card-title.cardListCardTitle');if(titleElement){const updatedTitle=(index+1)+titleElement.innerHTML.replace(/^\d+\./,'.');titleElement.innerHTML=updatedTitle;}});sortMapMarkers(markerData,sortOptionsMap,sortBy,listNum);});});}
if(document.readyState==='loading'){document.addEventListener('DOMContentLoaded',initializeSortDropdown);}else{initializeSortDropdown();}})(); var mapScriptCreated = 0;
var mapCssCreated = 0;
var mapScriptLoaded = 0;
var mapCssLoaded = 0;
var mapLoadList = [];
function showLazyMap(fname) {
    if (mapScriptLoaded == 1 && mapCssLoaded == 1) {
        if (!mapLoadList.includes(fname)) {
            window[fname]();
            mapLoadList.push(fname);
        }
    }
}
(function fn() {
    var pics = document.querySelectorAll('.no-js-hide');
    pics.forEach(function(pic) {
        pic.classList.toggle('no-js-hide');
    });
    var lazyImages = [].slice.call(document.querySelectorAll(".lazeeload"));
    if ("IntersectionObserver" in window) {
        const config = {
            root: null,
            rootMargin: '1000px',
            threshold: 0
        };
        let lazyImageObserver = new IntersectionObserver(function(entries, observer) {
            entries.forEach(function(entry) {
                if (entry.isIntersecting) {
                    let lazyImage = entry.target;
                    if (lazyImage.dataset.src) {lazyImage.src = lazyImage.dataset.src;}
                    if (lazyImage.dataset.srcset) {lazyImage.srcset = lazyImage.dataset.srcset;}
                    if (lazyImage.dataset.map) {
                        const fname = "initMapbox_"+lazyImage.dataset.map;
                        if (mapScriptLoaded == 0) {
                        
                            let script = document.createElement('script');
                            script.async=true;
                            script.defer=true;
                            script.src = "https://api.mapbox.com/mapbox-gl-js/v3.0.0/mapbox-gl.js";
                            script.onload = function(){
                                mapScriptLoaded = 1;
                                showLazyMap(fname);
                            }
                            document.head.appendChild(script);
                            mapScriptCreated = 1;
                            let css = document.createElement('link');
                            css.rel = "stylesheet";
                            css.href = "https://api.mapbox.com/mapbox-gl-js/v3.0.0/mapbox-gl.css";
                            css.onload = function(){
                                mapCssLoaded = 1;
                                showLazyMap(fname);
                            }
                            document.head.appendChild(css);
                            mapCssCreated = 1;
                        } else {
                            if (typeof window[fname] === 'function') {
                                window[fname]();
                            }
                            showLazyMap(fname);
                        }                      
                    }
                    lazyImage.classList.remove("no-js-hide");
                    lazyImage.classList.remove("lazeeload");
                    lazyImageObserver.unobserve(lazyImage);
                }
            });
        }, config);

        lazyImages.forEach(function(lazyImage) {
            lazyImageObserver.observe(lazyImage);
            lazyImage.classList.add("lazeeload-activated");
        });
    } else {
        let active = false; 
        const lazyLoad = function() {
            if (active === false) {
            active = true;

            setTimeout(function() {
                lazyImages.forEach(function(lazyImage) {
                if ((lazyImage.getBoundingClientRect().top <= window.innerHeight+1000 && lazyImage.getBoundingClientRect().bottom >= 0) && getComputedStyle(lazyImage).display !== "none") {
                    if (lazyImage.dataset.src) lazyImage.src = lazyImage.dataset.src;
                    if (lazyImage.dataset.srcset) lazyImage.srcset = lazyImage.dataset.srcset;
                    if (lazyImage.dataset.onload) lazyImage.onload = lazyImage.dataset.onload;
                    lazyImage.classList.remove("lazeeload");
                    lazyImages = lazyImages.filter(function(image) {
                        return image !== lazyImage;
                    });
                    if (lazyImages.length === 0) {
                    document.removeEventListener("scroll", lazyLoad);
                    window.removeEventListener("resize", lazyLoad);
                    window.removeEventListener("orientationchange", lazyLoad);
                    }
                }
                });

                active = false;
            }, 200);
            }
        };
        document.addEventListener("scroll", lazyLoad);
        window.addEventListener("resize", lazyLoad);
        window.addEventListener("orientationchange", lazyLoad);
    } 
    var lazyImages = [].slice.call(document.querySelectorAll(".lazeeload"));
    i=1;
    lazyImages.forEach(function(lazyImage) {
        if (!(lazyImage.classList.contains("lazeeload-activated"))) {
            if (lazyImage.dataset.src) lazyImage.src = lazyImage.dataset.src;
            if (lazyImage.dataset.srcset) lazyImage.srcset = lazyImage.dataset.srcset;
            lazyImage.classList.remove("lazeeload");
        }
    });
})();