$(function() {
	var $btBoxMap = $('.box-map__bt')

	function loadMap(map, latValue, lonValue) {
		var markers = []
		var unidade = { lat: latValue, lng: lonValue }

		var gmap = new google.maps.Map(map.get(0), {
			zoom: 19,
			center: unidade
		})

		var icon = {
			url: baseUrl + 'img/layout/icon-map-pin.svg',
			origin: new google.maps.Point(0, 0),
			anchor: new google.maps.Point(0, 0),
			scaledSize: new google.maps.Size(60, 60)
		}

		var marker = new google.maps.Marker({
			position: gmap.getCenter(),
			map: gmap,
			icon: icon
		})

		markers.push(marker)
	}

	function populateMap() {
		$btBoxMap.each(function() {
			var $map = $(this)
				.parent()
				.find('.box-map__embed')

			var latValue = Number($(this).data('lat'))
			var lonValue = Number($(this).data('lng'))

			loadMap($map, latValue, lonValue)
		})
	}

	populateMap()

	$btBoxMap.on('click', function() {
		var $boxMap = $(this).parent('.box-map')

		var $map = $(this)
			.parent()
			.find('.box-map__embed')

		var $mapImage = $(this)
			.parent()
			.find('.box-map__image')

		var $mapThumb = $(this).find('.box-map__bt__thumb')

		var mapImageSrc = $mapImage.attr('src')
		var mapThumbSrc = $mapThumb.data('image')

		var latValue = Number($(this).data('lat'))
		var lonValue = Number($(this).data('lng'))

		if (!$boxMap.hasClass('--loaded')) {
			loadMap($map, latValue, lonValue)
			$boxMap.addClass('--loaded')
		}

		if ($boxMap.hasClass('--open')) {
			$boxMap.removeClass('--open')

			$map.addClass('invisible')
			$map.removeClass('animatein')

			$mapImage.removeClass('invisible')
			$mapImage.addClass('animatein')

			$mapThumb.attr('src', mapThumbSrc)
		} else {
			$boxMap.addClass('--open')

			$map.removeClass('invisible')
			$map.addClass('animatein')

			$mapImage.addClass('invisible')
			$mapImage.removeClass('animatein')

			$mapThumb.attr('src', mapImageSrc)
		}
	})
})
