import React from 'react';
import Modularity from 'modularity-front';
import GoogleMapReact from 'google-map-react';
import './GoogleMap.css';
let Module = Modularity.Module;

class GoogleMapModule extends Modularity.Module {
	constructor(props) {
		super(props);
		console.log()
	}

	
    
	render() {
		
		return(
			<div className={"GoogleMap " + this.className.value}>
				<GoogleMapReact
		          bootstrapURLKeys={{ key:  this.APIKey.value }}
		          defaultCenter={this.center.value}
		          defaultZoom={this.zoom.value}
		        >
		        	<img className="marker" lat={this.center.value.lat} lng={this.center.value.lng}  src="/marker.png"/>
		        </GoogleMapReact>
		        {super.render()}
			</div>
			);
				    
	}
}

GoogleMapModule.Inputs = {
	center:{
		type:Module.Types.Object,
		defaultValue: {
			lat:38.0402228,
			lng:23.6910616
		}
	},
	zoom:{
		type:Module.Types.Text,
		defaultValue:18
	},
	APIKey: {
		type: Module.Types.Text,
		defaultValue: "AIzaSyAl12iHrDKuqZvduxyP6PkT9i4CMvn7Ku0"
	},
	className: {
		type: Module.Types.Text
	}
}

GoogleMapModule.Outputs = {
	
}



GoogleMapModule.Category = "sxoinas";
export default GoogleMapModule;