first commit

wp-content/themes/dotspice/includes/modules/map-google/js/map-google.js

@@ -0,0 +1,149 @@
+(function ($) {
+
+	/**
+	 * initMap
+	 *
+	 * Renders a Google Map onto the selected jQuery element
+	 *
+	 * @date    22/10/19
+	 * @since   5.8.6
+	 *
+	 * @param   jQuery $el The jQuery element.
+	 * @return  object The map instance.
+	 */
+	function initMap($el) {
+
+		// Find marker elements within map.
+		var $markers = $el.find('.marker');
+
+		// Create gerenic map.
+		var mapArgs = {
+			zoom: $el.data('zoom') || 16,
+			mapTypeId: google.maps.MapTypeId.ROADMAP,
+			styles: $el.data('style') || [],
+		};
+		var map = new google.maps.Map($el[0], mapArgs);
+
+		// Add markers.
+		map.markers = [];
+		$markers.each(function () {
+			initMarker($(this), map);
+		});
+
+		// Center map based on markers.
+		centerMap(map);
+
+		// Return map instance.
+		return map;
+	}
+
+	/**
+	 * initMarker
+	 *
+	 * Creates a marker for the given jQuery element and map.
+	 *
+	 * @date    22/10/19
+	 * @since   5.8.6
+	 *
+	 * @param   jQuery $el The jQuery element.
+	 * @param   object The map instance.
+	 * @return  object The marker instance.
+	 */
+	function initMarker($marker, map) {
+		var iconData = $marker.data('marker'),
+			iconImage = iconData;
+
+		if (iconData.charAt(0) === '#') {
+			var markerSvg = [
+				'<?xml version="1.0"?>',
+				'<svg width="64px" height="64px" viewBox="0 0 64 64" version="1.1" xmlns="http://www.w3.org/2000/svg">',
+				'<path fill="' + iconData + '" d="M32,4.75c-10.401,0-18.833,8.432-18.833,18.833c0,3.345,0.898,6.474,2.428,9.195c0.254,0.452,0.52,0.897,0.809,1.325L32,61.25l15.596-27.146c0.24-0.355,0.447-0.732,0.662-1.104l0.148-0.221c1.528-2.721,2.427-5.85,2.427-9.195C50.833,13.182,42.401,4.75,32,4.75z M32,14.167c5.2,0,9.417,4.216,9.417,9.417c0,5.2-4.216,9.417-9.417,9.417s-9.417-4.216-9.417-9.417S26.799,14.167,32,14.167z M32,12c-6.501,0-11.771,5.27-11.771,11.771c0,6.5,5.27,11.771,11.771,11.771c6.5,0,11.771-5.271,11.771-11.771C43.771,17.271,38.5,12,32,12z M32,16.708c3.901,0,7.063,3.162,7.063,7.063S35.901,30.834,32,30.834s-7.063-3.162-7.063-7.063S28.099,16.708,32,16.708z"/>',
+				'<path fill="#000000" fill-opacity="0.3" d="M32,12c-6.501,0-11.771,5.27-11.771,11.771c0,6.5,5.27,11.771,11.771,11.771c6.5,0,11.771-5.271,11.771-11.771C43.771,17.271,38.5,12,32,12z M32,16.708c3.901,0,7.063,3.162,7.063,7.063S35.901,30.834,32,30.834s-7.063-3.162-7.063-7.063S28.099,16.708,32,16.708z"/>',
+				'</svg>'
+			].join('\n');
+
+			iconImage = 'data:image/svg+xml;charset=UTF-8,' + encodeURIComponent(markerSvg);
+		}
+
+		// Get position from marker.
+		var lat = $marker.data('lat');
+		var lng = $marker.data('lng');
+		var icon = {
+			url: iconImage,
+			scaledSize: new google.maps.Size(75, 75)
+		};
+
+		var latLng = {
+			lat: parseFloat(lat),
+			lng: parseFloat(lng)
+		};
+
+		// Create marker instance.
+		var marker = new google.maps.Marker({
+			position: latLng,
+			map: map,
+			icon: icon
+		});
+
+		// Append to reference for later use.
+		map.markers.push(marker);
+
+		// If marker contains HTML, add it to an infoWindow.
+		if ($marker.html()) {
+
+			// Create info window.
+			var infowindow = new google.maps.InfoWindow({
+				content: $marker.html()
+			});
+
+			// Show info window when marker is clicked.
+			google.maps.event.addListener(marker, 'click', function () {
+				infowindow.open(map, marker);
+			});
+		}
+	}
+
+	/**
+	 * centerMap
+	 *
+	 * Centers the map showing all markers in view.
+	 *
+	 * @date    22/10/19
+	 * @since   5.8.6
+	 *
+	 * @param   object The map instance.
+	 * @return  void
+	 */
+	function centerMap(map) {
+
+		// Create map boundaries from all map markers.
+		var bounds = new google.maps.LatLngBounds();
+		map.markers.forEach(function (marker) {
+			bounds.extend({
+				lat: marker.position.lat(),
+				lng: marker.position.lng()
+			});
+		});
+
+		// Case: Single marker.
+		if (map.markers.length == 1) {
+			map.setCenter(bounds.getCenter());
+
+			// Case: Multiple markers.
+		} else {
+			map.fitBounds(bounds);
+
+			// or for change zoom:
+			// map.setCenter( bounds.getCenter() );
+			// map.setZoom( 13 );
+		}
+	}
+
+	// Render maps on page load.
+	$(document).ready(function () {
+		$('.acf-map').each(function () {
+			var map = initMap($(this));
+		});
+	});
+
+})(jQuery);

wp-content/themes/dotspice/includes/modules/map-google/map-google.php

@@ -0,0 +1,188 @@
+<?php
+
+/**
+ * Modules | Map Google
+ *
+ * @package Dotspice
+ * @version 1.3.0
+ */
+
+
+if (defined('DOTSPICE_MAP_GOOGLE_ENABLE') && DOTSPICE_MAP_GOOGLE_ENABLE) {
+
+	/**
+	 * Map Google | Admin | Post Type
+	 */
+	function dotspice_mg_post_type($post_types)
+	{
+		$post_types[] = array(
+			'post_type'          => 'map-google',
+			'menu_name'          => esc_html__('Maps', 'dotspice'),
+			'singular_name'      => esc_html__('Map', 'dotspice'),
+			'multiple_name'      => esc_html__('Maps', 'dotspice'),
+			'show_in_menu'       => 'theme-settings',
+			'public'             => false,
+			'publicly_queryable' => false,
+			'menu_icon'          => 'dashicons-location-alt',
+			'supports'           => array('title')
+		);
+
+		return $post_types;
+	}
+	add_filter('dotspice_cpt', 'dotspice_mg_post_type');
+
+
+	/**
+	 * Map Google | Admin | Scortcode
+	 */
+	function dotspice_mg_get_shortcode($post_id)
+	{
+		if (!empty($post_id)) {
+			$shortcode = '[map-google ids="' . $post_id . '"]';
+
+			echo '<span class="shortcode wp-ui-highlight"><input type="text"'
+				. ' onfocus="this.select();" readonly="readonly"'
+				. ' value="' . esc_attr($shortcode) . '"'
+				. ' class="large-text code" /></span>';
+		}
+	}
+
+
+	/**
+	 * Map Google | Admin | After Title
+	 */
+	function dotspice_mg_add_shortcode_after_title($post)
+	{
+		if ($post->post_type === 'map-google') {
+			dotspice_mg_get_shortcode($post->ID);
+		}
+	}
+	add_action('edit_form_after_title', 'dotspice_mg_add_shortcode_after_title');
+
+
+	/**
+	 * Map Google | Admin | Post Type Columns
+	 */
+	function dotspice_mg_add_columns($columns)
+	{
+		$columns = array_slice($columns, 0, 2, true) + array('shortcode' => __('Shortcode', 'dotspice')) + array_slice($columns, 2, count($columns) - 2, true);
+
+		if (isset($columns['pur'])) {
+			unset($columns['pur']);
+		}
+
+		return $columns;
+	}
+	add_filter('manage_map-google_posts_columns', 'dotspice_mg_add_columns', 99);
+
+	function dotspice_mg_manage_columns($column_name, $post_id)
+	{
+		if ($column_name == 'shortcode') {
+			dotspice_mg_get_shortcode($post_id);
+		}
+		return $column_name;
+	}
+	add_filter('manage_map-google_posts_custom_column', 'dotspice_mg_manage_columns', 10, 2);
+
+
+	/**
+	 * Slider Swiper | Admin | Register Google API key
+	 */
+	function dotspice_mg_register_api_key()
+	{
+		acf_update_setting('google_api_key', 'AIzaSyArV6CtaMQvN44fC3OR8fs8TXyuSvITukk');
+	}
+	add_action('acf/init', 'dotspice_mg_register_api_key');
+
+
+	/**
+	 * Map Google | Shortcode
+	 */
+	function dotspice_mg_shortcode($atts)
+	{
+		if (is_feed()) {
+			return '[map-google]';
+		}
+		if (!class_exists('acf_pro')) {
+			return '[map-google 404 "Advanced Custom Fields PRO"]';
+		}
+
+		$atts = shortcode_atts(array(
+			'ids' => ''
+		), $atts);
+		$markers = array();
+
+		// Post
+		$post_IDs     = wp_parse_id_list($atts['ids']);
+		$theme_colors = dotspice_get_theme_option('colors');
+		$marker_color = !empty($theme_colors['primary']) ? $theme_colors['primary'] : '#EA4335';
+
+		if (empty($post_IDs)) {
+			$post_IDs = get_posts(array(
+				'fields'         => 'ids',
+				'posts_per_page' => -1,
+				'post_type'      => 'map-google'
+			));
+
+			if (empty($post_IDs)) {
+				return '[map-google 404 "IDs"]';
+			}
+		}
+
+		foreach ($post_IDs as $post_ID) {
+			$post = get_post($post_ID);
+
+			if (empty($post)) {
+				return '[map-google 404 "post ' . esc_attr($post_ID) . '"]';
+			}
+			if ($post->post_status != 'publish') {
+				return '[map-google post_status ' . esc_attr($post_ID) . ' "' . esc_attr($post->post_status) . '"]';
+			}
+			if ($post->post_type != 'map-google') {
+				return '[map-google post_type ' . esc_attr($post_ID) . ' "' . esc_attr($post->post_type) . '"]';
+			}
+
+			$markers[] = array(
+				'marker'   => get_field('marker', $post_ID) ? get_field('marker', $post_ID) : esc_attr($marker_color),
+				'content'  => get_field('content', $post_ID),
+				'location' => get_field('location', $post_ID),
+			);
+		}
+
+		if (empty($markers)) {
+			return '[map-google 404 "markers"]';
+		}
+
+		// Google Map
+		ob_start();
+		$map_default_zoom = dotspice_get_theme_option('map_default_zoom') ?: '12';
+		$map_default_multiple_zoom = dotspice_get_theme_option('map_default_multiple_zoom') ?: '17';
+		$map_default_style = dotspice_get_theme_option('google_maps_json') ?: '[]';
+?>
+
+		<div class="acf-map" data-style='<?php echo $map_default_style; ?>' data-zoom="<?php echo $map_default_zoom; ?>" data-zoom-multiple="<?php echo $map_default_multiple_zoom; ?>">
+			<?php
+			foreach ($markers as $marker) {
+				echo sprintf(
+					'<div class="marker" data-lat="%s" data-lng="%s" data-marker="%s">%s</div>',
+					esc_attr($marker['location']['lat']),
+					esc_attr($marker['location']['lng']),
+					esc_attr($marker['marker']),
+					wp_kses_post($marker['content'])
+				);
+			}
+			?>
+		</div>
+<?php
+		$map_html = ob_get_clean();
+
+		// Enqueue Scripts
+		wp_enqueue_script('map-google-googleapis', 'https://maps.googleapis.com/maps/api/js?key=AIzaSyArV6CtaMQvN44fC3OR8fs8TXyuSvITukk', array(), '', true);
+		wp_enqueue_script('map-google', get_template_directory_uri() . '/includes/modules/map-google/js/map-google.js', array('jquery'), '', true);
+
+
+		// Output
+		return $map_html;
+	}
+	add_shortcode('map-google', 'dotspice_mg_shortcode');
+}