MarkupGoogleMap.module

<?php

/**
 * ProcessWire Map Markup
 *
 * Renders maps for the FieldtypeMapMarker module
 * 
 * ProcessWire 2.x 
 * Copyright (C) 2016 by Ryan Cramer 
 * Licensed under MPL 2.0
 * 
 * https://processwire.com
 *
 * USAGE:
 * ======
 *
 * Add this somewhere before your closing </head> tag:
 * 
 *    <script type='text/javascript' src='https://maps.googleapis.com/maps/api/js'></script>
 *  
 * In the location where you want to output your map, do the following in your template file:
 * 
 *    $map = $modules->get('MarkupGoogleMap'); 
 *    echo $map->render($page, 'map'); // replace 'map' with the name of your FieldtypeMap field
 *
 * To render a map with multiple markers on it, specify a PageArray rather than a single $page: 
 *
 *    $items = $pages->find("template=something, map!='', sort=title"); 
 *    $map = $modules->get('MarkupGoogleMap'); 
 *    echo $map->render($items, 'map'); 
 *
 * To specify options, provide a 3rd argument with an options array:
 *
 *    $map = $modules->get('MarkupGoogleMap'); 
 *    echo $map->render($items, 'map', array('height' => '500px')); 
 *
 * 
 * OPTIONS
 * =======
 * Here is a list of all possible options (with defaults shown):  
 * 
 * // default width of the map 
 * 'width' => '100%' 
 * 
 * // default height of the map
 * 'height' => '300px' 
 * 
 * // zoom level
 * 'zoom' => 12 (or $field->defaultZoom)
 * 
 * // map type: ROADMAP, HYBRID or SATELLITE
 * 'type' => 'HYBRID' or $field->defaultType
 * 
 * // map ID attribute
 * 'id' => "mgmap" 
 * 
 * // map class attribute
 * 'class' => "MarkupGoogleMap" 
 * 
 * // center latitude
 * 'lat' => $field->defaultLat 
 * 
 * // center longitude
 * 'lng' => $field->defaultLng 
 * 
 * // set to false only if you will style the map <div> yourself
 * 'useStyles' => true 
 * 
 * // allows single-marker map to use marker settings rather than map settings
 * 'useMarkerSettings' => true 
 * 
 * // field to use for the marker link, or blank to not link
 * 'markerLinkField' => 'url' 
 *
 * // field to use for the marker title
 * 'markerTitleField' => 'title' 
 * 
 * // map will automatically adjust to fit to the given markers (when multiple markers)
 * 'fitToMarkers' => true 
 *
 * // use hover box? When true, shows a tooltip-type box when you hover the marker, populated with the markerTitleField
 * // this is often more useful than the default presentation google maps uses
 * 'useHoverBox' => false
 *
 * // when useHoverBox is true, you can specify the markup used for it. Use the following (which is the default) as your starting point:
 * 'hoverBoxMarkup' => "<div data-top='-10' data-left='15' style='background: #000; color: #fff; padding: 0.25em 0.5em; border-radius: 3px;'></div>", 
 *
 * // FUll URL to icon file to use for markers. Blank=use default Google marker icon. 
 * 'icon' => '', 
 * 
 * // Any extra javascript initialization code you want to occur before the map itself is drawn
 * 'init' => '', 
 *
 */

class MarkupGoogleMap extends WireData implements Module {

	public static function getModuleInfo() {
		return array(
			'title' => 'Map Markup (Google Maps)',
			'version' => 101,
			'summary' => 'Renders Google Maps for the MapMarker Fieldtype',
			'requires' => 'FieldtypeMapMarker',
			);
	}

	/**
	 * Include our MapMarker class, which serves as the value for fields of type FieldtypeMapMarker
	 *
	 */
	public function init() {	
		require_once(dirname(__FILE__) . '/MapMarker.php'); 
	}

	/**
	 * Get associative array of map options
	 * 
	 * @param string $fieldName
	 * @return array
	 * @throws WireException
	 * 
	 */
	public function getOptions($fieldName) {

		static $n = 0; 
		$field = $this->fields->get($fieldName); 
		if(!$field) throw new WireException("Unknown field: $fieldName"); 

		return array(
			'useStyles' => true, 
			'fitToMarkers' => true, 
			'useMarkerSettings' => true, 
			'useHoverBox' => false, 
			'hoverBoxMarkup' => "<div data-top='-10' data-left='15' style='background: #000; color: #fff; padding: 0.25em 0.5em; border-radius: 3px;'></div>", 
			'markerLinkField' => 'url', 
			'markerTitleField' => 'title', 
			'width' => '100%', 
			'height' => $field->height, 
			'zoom' => $field->defaultZoom ? (int) $field->defaultZoom : 12, 
			'type' => $field->defaultType ? $field->defaultType : 'HYBRID', 
			'id' => "mgmap" . (++$n), 
			'class' => "MarkupGoogleMap", 
			'lat' => $field->defaultLat,
			'lng' => $field->defaultLng,
			'icon' => '', // url to icon (blank=use default)
			'iconHover' => '', // url to icon when hovered (default=none)
			'shadow' => '', // url to icon shadow (blank=use default)
			'init' => '', // additional javascript code to insert in map initialization
			'n' => $n, 
			);
	}

	/**
	 * Get the script tag for loading Google Maps
	 * 
	 * @return string
	 * @throws WireException
	 * 
	 */
	public function getGMapScript() {
		$url = 'https://maps.google.com/maps/api/js';
		$key = $this->wire('modules')->get('FieldtypeMapMarker')->get('googleApiKey');
		if($key) $url .= "?key=$key";
		return "<script type='text/javascript' src='$url'></script>";
	}

	/**
	 * Render map markup
	 * 
	 * @param PageArray|Page $pageArray Page (or multiple pages in PageArray) containing map field
	 * @param $fieldName Name of the map field
	 * @param array $options Options to adjust behavior
	 * @return string
	 * @throws WireException
	 * 
	 */
	public function render($pageArray, $fieldName, array $options = array()) {

		static $n = 0; 
		$n++;

		$defaultOptions = $this->getOptions($fieldName); 
		$options = array_merge($defaultOptions, $options); 
		
		if($pageArray instanceof Page) {
			$page = $pageArray; 
			$pageArray = new PageArray();
			$pageArray->add($page); 
		}

		$height = $options['height']; 
		$width = $options['width'];
		if(empty($height)) $height = 300; 
		if(ctype_digit("$height")) $height .= "px";
		if(ctype_digit("$width")) $width .= "px";

		$style = '';	
		if($options['useStyles'] && !empty($height) && !empty($width)) {
			$style = " style='width: $width; height: $height;'"; 
		}	

		$lat = $options['lat'];
		$lng = $options['lng'];
		$zoom = $options['zoom'] > 0 ? (int) $options['zoom'] : $defaultOptions['zoom'];
		$type = in_array($options['type'], array('ROADMAP', 'SATELLITE', 'HYBRID')) ? $options['type'] : 'HYBRID';

		if($options['useMarkerSettings'] && (count($pageArray) == 1 || !$lat)) {
			// single marker overrides lat, lng and zoom settings
			$marker = $pageArray->first()->get($fieldName); 
			$lat = $marker->lat; 
			$lng = $marker->lng; 
			if($marker->zoom > 0) $zoom = (int) $marker->zoom;
		}

		$id = $options['id'];
		$out = '';

		if($n === 1) $out .= "<script type='text/javascript' src='{$this->config->urls->MarkupGoogleMap}MarkupGoogleMap.js'></script>";

		$out .= "<div id='$id' class='$options[class]'$style></div>";

		$out .= "<script type='text/javascript'>" .
			"if(typeof google === 'undefined' || typeof google.maps === 'undefined') { " . 
			"alert('MarkupGoogleMap Error: Please add the maps.google.com script in your document head.'); " . 
			"} else { " . 
			"var $id = new MarkupGoogleMap(); " . 
			"$id.setOption('zoom', $zoom); " . 
			"$id.setOption('mapTypeId', google.maps.MapTypeId.$type); " . 
			($options['icon'] ? "$id.setIcon('$options[icon]'); " : "") .
			($options['iconHover'] ? "$id.setIconHover('$options[iconHover]'); " : "") . 
			($options['shadow'] ? "$id.setShadow('$options[shadow]'); " : "") . 
			($options['useHoverBox'] ? "$id.setHoverBox('" . str_replace("'", '"', $options['hoverBoxMarkup']) . "');" : "") . 
			$options['init'] . 
			"$id.init('$id', $lat, $lng); "; 

		foreach($pageArray as $page) {
			$marker = $page->get($fieldName); 
			if(!$marker instanceof MapMarker) continue; 
			if(!$marker->lat) continue; 
			$url = $options['markerLinkField'] ? $page->get($options['markerLinkField']) : '';
			$title = $options['markerTitleField'] ? $page->get($options['markerTitleField']) : ''; 
			$out .= "$id.addMarker($marker->lat, $marker->lng, '$url', '$title', ''); ";
		}

		if(count($pageArray) > 1 && $options['fitToMarkers']) $out .= "$id.fitToMarkers(); ";
		$out .= "}</script>";

		return $out; 
	}
}