openstack-uicore-foundation/lib/components/google-map.js

ui reactjs components for openstack marketing site

!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define("openstack-uicore-foundation",[],t):"object"==typeof exports?exports["openstack-uicore-foundation"]=t():e["openstack-uicore-foundation"]=t()}(this,(()=>(()=>{"use strict";var e={9558:(e,t,n)=>{n.d(t,{arraysEqual:()=>a});n(5812),n(8041);const a=(e,t)=>e.length===t.length&&e.every(((e,n)=>((e,t)=>{const n=Object.keys(e),a=Object.keys(t);if(n.length!==a.length)return!1;for(let a of n)if(e[a]!==t[a])return!1;return!0})(e,t[n])))},5812:e=>{e.exports=require("moment-timezone")},8041:e=>{e.exports=require("urijs")}},t={};function n(a){var o=t[a];if(void 0!==o)return o.exports;var r=t[a]={exports:{}};return e[a](r,r.exports,n),r.exports}(()=>{n.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return n.d(t,{a:t}),t}})(),(()=>{n.d=(e,t)=>{for(var a in t)n.o(t,a)&&!n.o(e,a)&&Object.defineProperty(e,a,{enumerable:!0,get:t[a]})}})(),(()=>{n.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t)})(),(()=>{n.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}})();var a={};n.r(a),n.d(a,{GMap:()=>g,default:()=>c});const o=require("react");var r=n.n(o);const l=require("react-google-maps"),s=require("react-google-maps/lib/components/addons/MarkerClusterer");var i=n.n(s),d=n(9558);const p={defaultZoom:2,defaultCenter:{lat:30.270166,lng:-97.731271},options:{minZoom:1,maxZoom:19}},h=(0,l.withGoogleMap)((e=>r().createElement(l.GoogleMap,{ref:e.onMapLoad,zoom:e.zoom,center:e.center,onBoundsChanged:e.onMapChange,onClick:e.onMapClick},e.showMarkers&&r().createElement(i(),{averageCenter:!0,enableRetinaIcons:!0,gridSize:60},e.markers.map((t=>r().createElement(l.Marker,{key:t.id,position:{lat:t.lat,lng:t.lng},onClick:()=>e.onToggleInfoWindow(t.id),onDragEnd:e.onMarkerDrag,draggable:e.draggable},t.isInfoWindowOpen&&r().createElement(l.InfoWindow,{onCloseClick:()=>e.onToggleInfoWindow(t.id)},r().createElement("div",null,t.name)))))))));class g extends r().Component{constructor(e){super(e),this.state={markers:e.markers},this.handleMapLoad=this.handleMapLoad.bind(this),this.handleMapChange=this.handleMapChange.bind(this),this.handleMarkerDrag=this.handleMarkerDrag.bind(this),this.handleMapClick=this.handleMapClick.bind(this)}componentDidUpdate(e,t,n){const a=this.props.markers;(0,d.arraysEqual)(a,e.markers)||this.setState({markers:a});let o=e.markers.map((e=>e.id)).sort().join(),r=a.map((e=>e.id)).sort().join();if(a.length>1&&o!==r){const e=new google.maps.LatLngBounds;for(let t of a){let n=new google.maps.LatLng(t.lat,t.lng);e.extend(n)}this._mapComponent.fitBounds(e)}}handleMapLoad(e){this._mapComponent=e}handleMapChange(){let e=this.props.markers.filter((e=>{let t=new google.maps.LatLng(e.lat,e.lng);return this._mapComponent.getBounds().contains(t)}));this.props.hasOwnProperty("onChangeCallback")&&this.props.onChangeCallback(e)}handleMarkerClick(e){let t=this.state.markers,n=t.find((t=>t.id==e)).isInfoWindowOpen;t.find((t=>t.id==e)).isInfoWindowOpen=!n,this.setState({markers:t})}handleMarkerDrag(e){this.props.onMarkerDragged(e.latLng.lat(),e.latLng.lng())}handleMapClick(e){this.props.onMapClick(e.latLng.lat(),e.latLng.lng())}render(){let{markers:e}=this.state,{zoom:t,center:n}=this.props,a=this.props.hasOwnProperty("draggable");return r().createElement(h,{showMarkers:e.length>0,markers:e,zoom:t||p.defaultZoom,center:n.lat?n:p.defaultCenter,loadingElement:r().createElement("div",{style:{height:"100%"}}),containerElement:r().createElement("div",{style:{height:"400px"}}),mapElement:r().createElement("div",{style:{height:"100%"}}),onMapLoad:this.handleMapLoad,onMapChange:this.handleMapChange,onToggleInfoWindow:this.handleMarkerClick,onMarkerDrag:this.handleMarkerDrag,draggable:a,onMapClick:this.handleMapClick})}}const c=g;return a})()));
//# sourceMappingURL=google-map.js.map