function print_distance_calculator_form($errors, $city, $map, $form)
{
    print_errors($errors);
    ?>
	<?php 
    if ($form) {
        ?>
	
	<script src="/wp-content/plugins/tzs/assets/js/autocomplete.js"></script>
	<form id="cpost" class="post-form" action="">
	<table id="calc_form">
		
	</table>
	<input name="calc" type="submit" id="calc" class="submit_button" value="Рассчитать"/>
	</form>
	<?php 
    }
    ?>
	
	<script>
		var city = [];
		<?php 
    if ($city != null) {
        foreach ($city as $c) {
            ?>
city.push(<?php 
            echo tzs_encode($c);
            ?>
);<?php 
        }
    }
    ?>
	</script>
	
	<?php 
    if ($map && $city != null) {
        ?>
	<p class="route">Маршрут: <span class="route_node1"></span>&nbsp;&nbsp;-&nbsp;&nbsp;<span class="route_node2"></span></p>
	<p class="distance"></p>
	<div id="map_canvas"></div>
	<script>
		var directionsService;
		var directionsDisplay;
		var map,mapRoute;
				
		//ymaps.ready(init);
        function init(){ 
            map = new ymaps.Map("map_canvas", {
                center: [55.76, 37.64],
                zoom: 5,
                controls: ['zoomControl','typeSelector']
            });	  		  
        } 
        
	function createRoute() {
            // Удаление старого маршрута
            if (mapRoute) {
                map.geoObjects.remove(mapRoute);
            }
		
            var routeFrom = city[0];
            var routeTo = city[city.length-1];
		
            //ymaps.route([routeFrom, routeTo], {mapStateAutoApply:true}).then(
            ymaps.route(city, {mapStateAutoApply:true}).then(
                function(route) {
                    map.geoObjects.add(route);
                    var length = route.getHumanLength().replace(/&#160;/,' ');
                    var time = route.getHumanTime().replace(/&#160;/g,' ');

                    jQuery('.route_node1').text(routeFrom);
                    jQuery('.route_node2').text(routeTo);
                    jQuery('.distance').text('Длина маршрута: '+ length +', '+ 'приблизительное время в пути: ' + time);
                mapRoute = route;
            },
            function(error) {
                alert('Невозможно построить маршрут');
		return;
            }
        ); 
      }
		
  		
		 jQuery(document).ready(function(){
		 	/* if (typeof google === 'object' && typeof google.maps === 'object') {
				initialize();
			} else {
				loadScript();
			}    */
			
			ymaps.ready(init);
			createRoute();
						
			//createRoute();			
		}); 
		//createRoute();		
			
		function initialize() {
 			directionsService = new google.maps.DirectionsService();
			directionsDisplay = new google.maps.DirectionsRenderer();
			var map_canvas = document.getElementById('map_canvas');
			var map_options = {
				zoom: 8,
				center: new google.maps.LatLng(50.4020355, 30.5326905),
				mapTypeId: google.maps.MapTypeId.ROADMAP
			}
			map = new google.maps.Map(map_canvas, map_options);
			displayRoute();
			redraw(); 
			
		}
		
		function redraw() {
			if (typeof google === 'object' && typeof google.maps === 'object') {
				google.maps.event.trigger(map, 'resize');
			}
		}
		
		function loadScript() {
			var script = document.createElement('script');
			script.type = 'text/javascript';
			script.src = 'https://maps.googleapis.com/maps/api/js?v=3.exp&callback=initialize';
			document.body.appendChild(script);
		}
		
		function displayRoute() {
			directionsDisplay.setMap(map);

			var request = {
				origin: city[0],
				destination: city[city.length-1],
				waypoints: [],
				provideRouteAlternatives: false,
				travelMode: google.maps.TravelMode.DRIVING,
				unitSystem: google.maps.UnitSystem.IMPERIAL
			};
			
			if (city.length > 2) {
				for (var i = 1; i < city.length-1; i++) {
					request.waypoints.push({
						location:city[i],
						stopover:true
					});
				}
			}
			
			directionsService.route(request, function(response, status) {
				if (status == google.maps.DirectionsStatus.OK) {
					directionsDisplay.setDirections(response);
				}
			});
		}
	</script>
	<?php 
    }
    ?>
	
	<?php 
    if ($form) {
        ?>
		<script src="/wp-content/plugins/tzs/assets/js/distance.js"></script>
	<?php 
    }
    ?>
	
	<script>
		var global_counter = 0;
		
		function addRow(after) {
			var tag = "row_"+global_counter;
			global_counter++;
			row = jQuery('<tr tag="'+tag+'" name="city_row"> <td id="caption"></td> <td id="field"> <input autocomplete="city" id="city" type="text" size="100" name="city[]" value=""><br/><a id="add_button" href="javascript:addAfter(\''+tag+'\');">Добавить</a> </td> <td id="del"> <a id="del_button" href="javascript:removeRow(\''+tag+'\');">Удалить</a> </td> </tr>');
			if (after == null) {
				tbl = jQuery('#calc_form');
				tbl.append(row);
			} else {
				jQuery(after).after(row);
			}
			autocomplete_initialize();
		}
		
		function update() {
			setCaptions();
			hideDel();
			hideAdd();
		}
		
		function addAfter(tag) {
			var row = jQuery('tr[tag='+tag+']');
			addRow(row);
			update();
		}
		
		function removeRow(tag) {
			var row = jQuery('tr[tag='+tag+']');
			row.remove();
			update();
		}
		
		function hideDel() {
			var arr = jQuery('a[id=del_button]');
			var visible = arr.length > 2;
			arr.each(function() {
				if (visible) {
					jQuery(this).removeAttr('style');
				} else {
					jQuery(this).attr('style', 'display:none;');
				}
			});
		}
		
		function hideAdd() {
			var arr = jQuery('a[id=add_button]');
			var visible = arr.length < 10;
			arr.each(function() {
				if (visible) {
					jQuery(this).removeAttr('style');
				} else {
					jQuery(this).attr('style', 'display:none;');
				}
			});
		}
		
		function setCaptions() {
			var counter = 0;
			var arr = jQuery('td[id=caption]');
			arr.each(function() {
				var caption;
				if (counter == 0) {
					caption = 'Откуда';
				} else if (counter == arr.length-1) {
					caption = 'Куда';
				} else {
					caption = 'Через';
				}
				jQuery(this).html(caption);
				counter++;
			});
		}
		
		function showDist() {
			city_tmp = [];
			jQuery('input[id=city]').each(function() {
				city_tmp.push(jQuery(this).val());
			});
			jQuery('#calc').attr('disabled','disabled');
			displayDistance(city_tmp, function() {
				jQuery('#calc').removeAttr('disabled');
			});
		}
		
		jQuery(document).ready(function(){
			<?php 
    if ($form) {
        ?>
			jQuery('#cpost').submit(function() {
				showDist();
				return false;
			});
			addRow(null);
			addRow(null);
			if (city.length > 2) {
				for (var i = 0; i < city.length-2; i++)
					addRow(null);
			}
			var arr = jQuery('input[id=city]');
			for (var i = 0; i < city.length; i++) {
				jQuery(arr[i]).attr('value', city[i]);
			}
			update();
			<?php 
    }
    ?>
		});
	</script>
	
	<?php 
}
Exemple #2
0
function tzs_make_distance_link($distance, $meters, $city)
{
    $url = "displayDistance([";
    $counter = 0;
    foreach ($city as $c) {
        if ($counter > 0) {
            $url .= ',';
        }
        $url .= tzs_encode($c);
        $counter++;
    }
    $url .= "], null)";
    return '<a class="distance_link" href=\'javascript:' . $url . ';\' title="Расчет расстояния между пунктами">' . tzs_convert_distance_to_str($distance, $meters) . '</a>';
}