// JavaScript Document $(document).ready(function(){ if (typeof google === 'object' && typeof google.maps === 'object') { handleCFGoogleApiReady(); } else { var script = document.createElement("script"); script.type = "text/javascript"; script.src = "https://maps.googleapis.com/maps/api/js?key=AIzaSyCMS-uFpwKtiZ9g0CL8ykNYFpU6juoZxHc&callback=handleCFGoogleApiReady"; document.body.appendChild(script); } }); function handleCFGoogleApiReady() { /*! SVGMarker v0.6.0 - https://github.com/defvayne23/SVGMarker */ function SVGMarker(t){var e={clickable:!0,cursor:"pointer",draggable:!1,icon:{anchor:new google.maps.Point(0,0),size:new google.maps.Size(30,30),url:"",text:{content:"",font:"Helvetica, sans-serif",color:"#000",size:"10px",weight:"400",position:[0,0]},html:""},map:"",opacity:1,position:"",title:"",visible:!0,zIndex:""};for(var i in t)if("object"==typeof e[i])for(var o in t[i])t[i].hasOwnProperty(o)&&(e[i][o]=t[i][o]);else t.hasOwnProperty(i)&&(e[i]=t[i]);this.setValues(e),"map"in t&&this.setMap(t.map)}SVGMarker.prototype=new google.maps.OverlayView,SVGMarker.prototype.onAdd=function(){var t=this,e=document.createElement("div");e.style.border="none",e.style.borderWidth="0px",e.style.position="absolute",""!==this.get("zIndex")&&(e.style.zIndex=this.get("zIndex")),this.get("visible")===!1&&(e.style.visibility="hidden"),this.get("opacity")>=0&&this.get("opacity")<=1&&(e.style.opacity=this.get("opacity")),this.get("clickable")===!0&&google.maps.event.addDomListener(e,"click",function(e){google.maps.event.trigger(t,"click",e)}),this.get("draggable")===!0&&(google.maps.event.addDomListener(e,"drag",function(e){google.maps.event.trigger(t,"drag",e)}),google.maps.event.addDomListener(e,"mousedown",function(e){google.maps.event.trigger(t,"dragstart",e),this.style.cursor="move",t.get("map").set("draggable",!1);var i=e;t.moveHandler=google.maps.event.addDomListener(t.get("map").getDiv(),"mousemove",function(e){google.maps.event.trigger(t,"drag",e);var o=i.clientX-e.clientX,n=i.clientY-e.clientY,s=t.getProjection().fromLatLngToDivPixel(t.get("position")),r=t.getProjection().fromDivPixelToLatLng(new google.maps.Point(s.x-o,s.y-n));i=e,t.set("position",r),t.draw()})}),google.maps.event.addDomListener(e,"mouseup",function(e){google.maps.event.trigger(t,"dragend",e),t.get("map").set("draggable",!0),this.style.cursor="default",google.maps.event.removeListener(t.moveHandler)}),google.maps.event.addDomListener(this.get("map").getDiv(),"mouseleave",function(t){google.maps.event.trigger(e,"mouseup",t)})),google.maps.event.addDomListener(e,"mouseover",function(e){google.maps.event.trigger(t,"mouseover",e)}),google.maps.event.addDomListener(e,"mouseout",function(e){google.maps.event.trigger(t,"mouseout",e)});var i=document.createElement("img");if(i.src=this.get("icon").url,i.style.width=this.get("icon").size.width+"px",i.style.height=this.get("icon").size.height+"px",i.style.display="block",i.setAttribute("alt",this.get("title")),e.appendChild(i),""!==this.get("icon").text.content){var o=document.createElement("span");o.textContent=this.get("icon").text.content,o.style.fontFamily=this.get("icon").text.font,o.style.fontSize=this.get("icon").text.size,o.style.fontWeight=this.get("icon").text.weight,o.style.color=this.get("icon").text.color,o.style.position="absolute",o.style.top=this.get("icon").text.position[0]+"px",o.style.left=this.get("icon").text.position[1]+"px",o.style.transform="translate(-50%, -50%)",this.get("container").appendChild(o)}""!==this.get("icon").html&&e.appendChild(this.get("icon").html),this.set("container",e),this.getPanes().overlayImage.appendChild(e)},SVGMarker.prototype.draw=function(){var t=this.getProjection(),e=t.fromLatLngToDivPixel(this.get("position"));this.get("container").style.left=e.x-this.get("icon").anchor.x+"px",this.get("container").style.top=e.y-this.get("icon").anchor.y+"px",this.get("container").style.cursor=this.get("cursor")},SVGMarker.prototype.onRemove=function(){this.get("container").parentNode.removeChild(this.get("container")),this.set("container",null)},SVGMarker.prototype.setZIndex=function(t){this.get("container")&&(this.get("container").style.zIndex=t)},SVGMarker.prototype.setOpacity=function(t){this.get("container")&&(this.get("container").style.opacity=t)},SVGMarker.prototype.hide=function(){this.get("container")&&(this.get("container").style.visibility="hidden")},SVGMarker.prototype.show=function(){this.get("container")&&(this.get("container").style.visibility="visible")},SVGMarker.prototype.toggle=function(){this.get("container")&&("hidden"===this.get("container").style.visibility?this.show():this.hide())},SVGMarker.prototype.getPosition=function(){return this.get("position")},SVGMarker.prototype.toggleDOM=function(){this.getMap()?this.setMap(null):this.setMap(this.get("map"))}; /////svg marker var businessLat = 31.238012; var businessLng = -81.49883; var bizLatLng = new google.maps.LatLng(businessLat,businessLng); var theMap; var mapCenter; var mapZoomStart = 15; var zLevelHide = 16; var markersArr = []; var infowindow; var sitePlanOverlay; if( markerData != undefined) { var markerData = JSON.parse(markerData); } //var markerData; var otherMarker = { url: '/themes/moxleyhomes/modules/communities/markers/moxley-pin.svg', size: new google.maps.Size(55, 55), origin: new google.maps.Point(0, 0), anchor: new google.maps.Point(30, 40) //,scaledSize: new google.maps.Size(30, 30) }; function initMap() { mapCenter = new google.maps.LatLng(businessLat,businessLng); var mapOptions = { zoom: mapZoomStart, center: mapCenter, styles: gmap_styles, scrollwheel: false, mapTypeControl: false, streetViewControl: false }; // Create a map object and specify the DOM element for display. theMap = new google.maps.Map(document.getElementById('map_canvas_float'), mapOptions); offsetMapCenter(theMap); addBusinessMarker(); addMarkers(markerData); var contentString = "

Moxley Homes


,

" infowindow = new google.maps.InfoWindow({ content: contentString, maxWidth: 300, pixelOffset: new google.maps.Size(-10, -10) }); // make list of locations clickable $('.location-link').click(function(e) { e.preventDefault(); $this = $(this); var theID = $this.data('id'); console.log(theID); for (var i=0; i < markersArr.length; i++) { if (markersArr[i].markerID === theID) { google.maps.event.trigger(markersArr[i], 'click'); break; } } }); }; // initMap function addBusinessMarker() { var loadedmarker = new SVGMarker({ map: theMap, position: bizLatLng, icon: otherMarker, // custom marker info markerID : '#Application.settings.businessname#', markerHeadline : '#Application.settings.businessname#' }); markersArr.push(loadedmarker); } ///// addBusinessMarker function offsetMapCenter(map){ if ( $(window).width() > 768 ) { var offsetXnew = -(window.innerWidth / 4); offsetXnew = 0; offsetYnew = 0; map.setCenter(mapCenter); map.panBy(offsetXnew,offsetYnew); } else { offsetYnew = 0; map.setCenter(mapCenter); map.panBy(0,offsetYnew); } }; $( window ).resize(function() { offsetMapCenter(theMap); }); function addMarkers(markerData) { if( markerData != undefined) { var markerTitle; console.log(markerData); for(var i = 0; i < markerData.ROWCOUNT; i++){ var hasImage = true; var markerID = markerData.DATA.ID[i]; var markerHeadline = markerData.DATA.HEADLINE[i]; var markerSubhead = markerData.DATA.SUBHEAD[i]; var marker_text = String(markerData.DATA.INTRO_TEXT[i]); marker_text = marker_text; //var image1 = markerData.DATA.DOCUMENT_FILE_PATH[i] + 'thumb_' + markerData.DATA.DOCUMENT_FILE[i]; var image1 = markerData.DATA.SMALLIMAGE[i]; var newLatLng = new google.maps.LatLng(markerData.DATA.LATITUDE[i],markerData.DATA.LONGITUDE[i]); if ( markerData.DATA.DOCUMENT_FILE[i] == null){ hasImage = false; } var loadedmarker = new SVGMarker({ map: theMap, position: newLatLng, icon: otherMarker, // custom marker info markerID : markerID, markerHeadline : markerHeadline, markerSubhead : markerSubhead, markerText : marker_text, image : image1, hasImage : hasImage }); markersArr.push(loadedmarker); theMap.setCenter(loadedmarker.getPosition()); google.maps.event.addListener(loadedmarker, 'click', markerInfoWindow); }//end for loop }// end if undefined }//end addMarkers function markerInfoWindow(event) { var contentString = '

' + this.markerHeadline + '

' + this.markerSubhead + '
' + this.markerText + '
' + '

'; /* if ( this.hasImage == false ) { var contentString = '

' + this.markerHeadline + '

' + this.markerSubhead + '
' + this.markerText + '
' + '

'; } else { var contentString = '

' + this.markerHeadline + '

' + this.markerSubhead + '
' + this.markerText + '
' + '

' + '
' + '
'; }*/ infowindow.setContent(contentString); infowindow.open(theMap,this); theMap.setCenter(this.getPosition()); //theMap.panBy(0,-100); //offsetMapCenter(theMap); } var gmap_styles = [{"elementType":"geometry","stylers":[{"color":"#ebecee"}]},{"elementType":"labels.icon","stylers":[{"visibility":"on"}]},{"elementType":"labels.text.fill","stylers":[{"color":"#3e4756"}]},{"elementType":"labels.text.stroke","stylers":[{"color":"#e8e9eb"},{"weight":3.5}]},{"featureType":"administrative.land_parcel","elementType":"labels.text.fill","stylers":[{"color":"#bdbdbd"}]},{"featureType":"poi","elementType":"geometry","stylers":[{"color":"#c4c5c7"}]},{"featureType":"poi","elementType":"labels.text.fill","stylers":[{"color":"#3e4756"}]},{"featureType":"poi.attraction","elementType":"labels","stylers":[{"visibility":"on"}]},{"featureType":"poi.business","stylers":[{"visibility":"off"}]},{"featureType":"poi.business","elementType":"labels","stylers":[{"visibility":"on"}]},{"featureType":"poi.medical","elementType":"labels","stylers":[{"visibility":"on"}]},{"featureType":"poi.park","elementType":"geometry","stylers":[{"color":"#d6d8dc"}]},{"featureType":"poi.park","elementType":"labels.text.fill","stylers":[{"color":"#3e4756"}]},{"featureType":"poi.place_of_worship","elementType":"labels","stylers":[{"visibility":"on"}]},{"featureType":"poi.school","elementType":"labels","stylers":[{"visibility":"on"}]},{"featureType":"poi.sports_complex","elementType":"labels","stylers":[{"visibility":"on"}]},{"featureType":"road","elementType":"geometry","stylers":[{"color":"#d8d8da"}]},{"featureType":"road.arterial","elementType":"labels.text.fill","stylers":[{"color":"#3e4756"}]},{"featureType":"road.highway","elementType":"geometry","stylers":[{"color":"#c4c5c7"}]},{"featureType":"road.highway","elementType":"labels.text.fill","stylers":[{"color":"#3e4756"}]},{"featureType":"road.local","elementType":"labels.text.fill","stylers":[{"color":"#3e4756"}]},{"featureType":"transit.line","elementType":"geometry","stylers":[{"color":"#e8e9eb"}]},{"featureType":"transit.station","elementType":"geometry","stylers":[{"color":"#eeeeee"}]},{"featureType":"water","elementType":"geometry","stylers":[{"color":"#9faabd"}]},{"featureType":"water","elementType":"labels.text.fill","stylers":[{"color":"#34435c"}]}] initMap(); } //handleGoogleApiReady