react-0.13-geosuggest/Geosuggestdist.js

React Geosuggest for 0.13

"use strict";function _interopRequireDefault(e){return e&&e.__esModule?e:{"default":e}}function _temporalAssertDefined(e,t,s){if(e===s)throw new ReferenceError(t+" is not defined - temporal dead zone");return!0}var _temporalUndefined={},Geosuggest=_temporalUndefined,_react=require("react"),_react2=_interopRequireDefault(_react),_GeosuggestItem=require("./GeosuggestItem"),_GeosuggestItem2=_interopRequireDefault(_GeosuggestItem);Geosuggest=_react2["default"].createClass({displayName:"Geosuggest",getDefaultProps:function(){var e="undefined"!=typeof google&&void 0!==google.maps;return{fixtures:[],initialValue:"",placeholder:"Search places",disabled:!1,className:"",location:null,radius:0,bounds:null,country:null,types:null,customLocations:null,googleMaps:e?google&&google.maps:null,onSuggestSelect:function(){},onFocus:function(){},onBlur:function(){},onChange:function(){},skipSuggest:function(){},getSuggestLabel:function(e){return e.description}}},getInitialState:function(){return{isSuggestsHidden:!0,userInput:this.props.initialValue,activeSuggest:null,suggests:[],geocoder:this.props.googleMaps?new this.props.googleMaps.Geocoder:null,autocompleteService:this.props.googleMaps?new this.props.googleMaps.places.AutocompleteService:null}},componentWillReceiveProps:function(e){this.props.initialValue!==e.initialValue&&this.setState({userInput:e.initialValue})},onInputChange:function(){var e=this.refs.geosuggestInput.getDOMNode().value;this.setState({userInput:e},function(){this.showSuggests(),this.props.onChange(e)}.bind(this))},onFocus:function(){this.props.onFocus(),this.showSuggests()},update:function(e){this.setState({userInput:e}),this.props.onChange(e)},clear:function(){this.setState({userInput:""},function(){this.hideSuggests()}.bind(this))},searchSuggests:function(){if(!this.state.userInput)return void this.updateSuggests();var e=this.searchCustomSuggests(),t={input:this.state.userInput,location:this.props.location||new this.props.googleMaps.LatLng(0,0),radius:this.props.radius};this.props.bounds&&(t.bounds=this.props.bounds),this.props.types&&(t.types=this.props.types),this.props.country&&(t.componentRestrictions={country:this.props.country}),this.state.autocompleteService.getPlacePredictions(t,function(t){this.updateSuggests(t,e)}.bind(this))},searchCustomSuggests:function(){var e=[];if(this.props.customLocations&&this.state.userInput.length>3)for(var t in this.props.customLocations)t.toLowerCase().indexOf(this.state.userInput.toLowerCase())>-1&&e.push({key:t,data:this.props.customLocations[t]});return e},updateSuggests:function(e,t){var s=this;e||(e=[]),t||(t=[]);var o=[],i=RegExp(this.state.userInput,"gim"),u=this.props.skipSuggest;this.props.fixtures.forEach(function(e){!u(e)&&e.label.match(i)&&(e.placeId=e.label,o.push(e))}),t.forEach(function(e){o.push({label:e.key,type:"custom",location:e.data,placeId:e.key})}),e.forEach(function(e){u(e)||o.push({label:s.props.getSuggestLabel(e),type:"google",placeId:e.place_id})}),this.setState({suggests:o})},showSuggests:function(){this.searchSuggests(),this.setState({isSuggestsHidden:!1})},hideSuggests:function(){this.props.onBlur(),setTimeout(function(){this.setState({isSuggestsHidden:!0})}.bind(this),100)},onInputKeyDown:function(e){switch(e.which){case 40:e.preventDefault(),this.activateSuggest("next");break;case 38:e.preventDefault(),this.activateSuggest("prev");break;case 13:e.preventDefault(),this.selectSuggest(this.state.activeSuggest);break;case 9:this.selectSuggest(this.state.activeSuggest);break;case 27:this.hideSuggests()}},activateSuggest:function(e){if(this.state.isSuggestsHidden)return void this.showSuggests();var t=this.state.suggests.length-1,s="next"===e,o=null,i=0,u=0;for(u;t>=u;u++)this.state.suggests[u]===this.state.activeSuggest&&(i=s?u+1:u-1);this.state.activeSuggest||(i=s?0:t),0>i||i>t||(o=this.state.suggests[i]),this.setState({activeSuggest:o})},selectSuggest:function(e){var t=!1;return e&&this.state.suggests.map(function(s){s.label.indexOf(e.label)>-1&&(t=!0)}.bind(this)),!e&&this.state.suggests.length||!t&&this.state.suggests.length?(e=this.state.suggests[0],this.setState({activeSuggest:null})):e||(e={label:this.state.userInput}),this.setState({isSuggestsHidden:!0,userInput:e.label}),e.location?void this.props.onSuggestSelect(e):void("google"===e.type?this.geocodeSuggest(e):this.props.onSuggestSelect(e))},geocodeSuggest:function(e){this.state.geocoder.geocode({address:e.label},function(t,s){if(s===this.props.googleMaps.GeocoderStatus.OK){var o=t[0],i=o.geometry.location;e.type="google",e.gmaps=o,e.location={lat:i.lat(),lng:i.lng()},this.props.onSuggestSelect(e)}}.bind(this))},render:function(){return _react2["default"].createElement("div",{className:"geosuggest "+this.props.className,onClick:this.onClick},_react2["default"].createElement("input",{className:"geosuggest__input",ref:"geosuggestInput",type:"text",value:this.state.userInput,placeholder:this.props.placeholder,disabled:this.props.disabled,onKeyDown:this.onInputKeyDown,onChange:this.onInputChange,onFocus:this.onFocus,onBlur:this.hideSuggests}),_react2["default"].createElement("ul",{className:this.getSuggestsClasses()},this.getSuggestItems(),this.poweredByGoogle()))},poweredByGoogle:function(){var e=_temporalUndefined;return e=_react2["default"].createElement("div",{className:"poweredByGoogle"}),_react2["default"].createElement(_GeosuggestItem2["default"],{key:"google-logo",suggest:{label:_temporalAssertDefined(e,"google",_temporalUndefined)&&e},isActive:!1,onSuggestSelect:function(){}})},getSuggestItems:function(){return this.state.suggests.map(function(e){var t=this.state.activeSuggest&&e.placeId===this.state.activeSuggest.placeId;return _react2["default"].createElement(_GeosuggestItem2["default"],{key:e.placeId,suggest:e,isActive:t,onSuggestSelect:this.selectSuggest})}.bind(this))},getSuggestsClasses:function(){var e="geosuggest__suggests";return e+=this.state.isSuggestsHidden?" geosuggest__suggests--hidden":""}}),module.exports=_temporalAssertDefined(Geosuggest,"Geosuggest",_temporalUndefined)&&Geosuggest;