WordPress/creator-child
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Nouvelle carte

Browse Source 
-single.php: chargement map à la demande
This commit is contained in:
Bruno Pesenti
2017-02-14 06:59:44 +01:00
parent a722102766
commit 6a29ca3de0
6 changed files with 289 additions and 181 deletions
Download Patch File Download Diff File Expand all files Collapse all files

200
single.php
View File

@@ -1,6 +1,5 @@
<?php
get_header();
//include('exifer/exif.php');
?>
<div class="content">
<div class="container">
@@ -9,10 +8,6 @@ get_header();
<article class="post_box" id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<h1><?php the_title(); ?></h1>
<?php //echo get_stylesheet_directory_uri();
//$a = include(get_stylesheet_directory_uri() . '/exifer/exif.php');
//echo "a: " . $a;
?>
<div class="entry-meta">
<?php if (dess_setting('dess_display_meta') == true) creator_entry_meta(); ?>
<?php //edit_post_link( __( 'Edit', 'twentythirteen' ), '<span class="edit-link">', '</span>' ); ?>
@@ -21,23 +16,52 @@ get_header();
<?php
$coord = array();
xdebug_start_trace(null,XDEBUG_TRACE_HTML);
the_content();
xdebug_stop_trace();
?>
<?php //$content = apply_filters('the_content', get_the_content());
//echo $content;
<?php //echo '<div id="map" style="display: ' . ((count($coord) > 0) ? "block" : "none") . ';"></div>'; ?>
//preprint ($coord);
<script type="text/javascript">
echo '<div id="map" style="display: ' . ((count($coord) > 0) ? "block" : "none") . ';"></div>';
?>
<script>
function initMap() {
jQuery(document).ready(function ($) { // wait until the document is ready
data = false;
$('button#showmap').click(function(){
if (data == false) {
$.ajax({
url: "http://maps.googleapis.com/maps/api/js?key=AIzaSyB7cAx3NSH4dPM3Sx2oQeud7Zr-KaGXmLk&sensor=false&callback=MapApiLoaded",
dataType: "script",
timeout:8000,
success: function(data) {
// Run the code here that needs
// to access the data returned
data = true;
return data;
},
error: function() {
alert('Error occured');
}
});
}
$( "#locations" ).toggle( "fast");
$( "button#hidemap" ).show();
$( "button#showmap" ).hide();
}); // button#showmap
$('button#hidemap').click(function(){
$( "#locations" ).toggle( "fast");
$( "button#hidemap" ).hide();
$( "button#showmap" ).show();
data = true;
});
}); // jQuery
var map;
var markers = [];
var cnt;
var locations = [
<?php
$j = (count($coord) - 1);
@@ -45,46 +69,72 @@ get_header();
//echo "['<h4>" . $coord[$i][2] . "</h4>', " . $coord[$i][0] . ", " . $coord[$i][1] . "]" . (($i<$j) ? "," : "")."\r\n";
echo "['<span class\"infowindow\">" . $coord[$i][2] . "</span>', " . $coord[$i][0] . ", " . $coord[$i][1] . "]" . (($i<$j) ? "," : "")."\r\n";
}
?>
?>
];
// Setup the different icons and shadows
var iconURLPrefix = 'https://maps.google.com/mapfiles/ms/icons/';
function MapApiLoaded() {
// Setup the different icons and shadows
var iconURLPrefix = 'https://maps.google.com/mapfiles/ms/icons/';
var icons = [
iconURLPrefix + 'red-dot.png',
iconURLPrefix + 'green-dot.png',
iconURLPrefix + 'blue-dot.png',
iconURLPrefix + 'orange-dot.png',
iconURLPrefix + 'purple-dot.png',
iconURLPrefix + 'pink-dot.png',
iconURLPrefix + 'yellow-dot.png'
]
var iconsLength = icons.length;
var icons = [
iconURLPrefix + 'red-dot.png',
iconURLPrefix + 'green-dot.png',
iconURLPrefix + 'blue-dot.png',
iconURLPrefix + 'orange-dot.png',
iconURLPrefix + 'purple-dot.png',
iconURLPrefix + 'pink-dot.png',
iconURLPrefix + 'yellow-dot.png'
]
var iconsLength = icons.length;
window.map = new google.maps.Map(document.getElementById('map'), {
mapTypeId: google.maps.MapTypeId.ROADMAP
});
// Create google map
map = new google.maps.Map($('#gmap')[0], {
zoom:8,
mapTypeId:google.maps.MapTypeId.ROADMAP,
panControl:false,
streetViewControl:false,
mapTypeControl:true
});
var infowindow = new google.maps.InfoWindow();
infowindow = new google.maps.InfoWindow();
var bounds = new google.maps.LatLngBounds();
var bounds = new google.maps.LatLngBounds();
var markers = new Array();
var iconCounter = 0;
for (i = 0; i < locations.length; i++) {
marker = new google.maps.Marker({
position: new google.maps.LatLng(locations[i][1], locations[i][2]),
map: map,
icon: icons[iconCounter]
});
var iconCounter = 0;
for (i = 0; i < locations.length; i++) {
marker = new google.maps.Marker({
position: new google.maps.LatLng(locations[i][1], locations[i][2]),
map: map,
icon: icons[iconCounter]
});
/*markers.push(marker);*/
markers.push(marker);
var zoom = 1;
a = map.getZoom();
bounds.extend(marker.position);
bounds.extend(marker.position);
// add the double-click event listener
google.maps.event.addListener(marker, 'dblclick', function() {
map.panTo(this.getPosition());
//map.setZoom(9);
if (zoom == 1) {
if (map.getZoom() < (a + 6)) {
map.setZoom(map.getZoom() + 2);
}
else zoom = 0;
}
else if (zoom == 0) {
if (map.getZoom() >= a) {
map.setZoom(map.getZoom() - 2);
}
else zoom = 1;
}
});
google.maps.event.addListener(marker, 'click', (function (marker, i) {
return function () {
google.maps.event.addListener(marker, 'mousemove', (function (marker, i) {
return function () {
/*
var contentString = '<div id="content">'+
'<div id="siteNotice">'+
@@ -95,31 +145,55 @@ get_header();
'</div>';
infowindow.setContent(contentString);
*/
infowindow.setContent(locations[i][0]);
infowindow.open(map, marker);
}
})(marker, i));
infowindow.setContent(locations[i][0]);
infowindow.open(map, marker);
}
})(marker, i));
iconCounter++;
if (iconCounter >= iconsLength) {
iconCounter = 0;
}
iconCounter++;
if (iconCounter >= iconsLength) {
iconCounter = 0;
}
}
} // for
map.fitBounds(bounds);
map.fitBounds(bounds);
} //MapApiLoaded
var listener = google.maps.event.addListener(map, "idle", function () {
map.setZoom(8);
google.maps.event.removeListener(listener);
});
}
function jumpToMarker(cnt){
map.panTo(markers[cnt].getPosition());
if (map.getZoom() < 15) {
map.setZoom(a + 4);
}
setTimeout(function() {
infowindow.setContent(locations[cnt][0]);
infowindow.open(map, markers[cnt]);
}, 300);
} //jumpToMarker
</script>
<div id="locations">
<?php
$j = (count($coord) - 1);
echo "<div id='center_marker'><ul class='list_marker'>";
for ($i = 0; $i <= $j; $i++) {
//<a href="javascript:void(0);" onclick="jumpToMarker(4)" class="button3">PontDArc</a>
echo "<li><i class='ion-ios-location'></i><a href='javascript:void(0);' onclick='jumpToMarker(" . $i . ")'>" . $coord[$i][2] . "</a></li>";
}
echo "</ul></div>";
?>
<div id="gmap" style="width: 950px; height: 400px; border:1px solid black;" class="aligncenter"></div>
</div>
<button type="button" id="showmap"><?php _e('Show map','CreatorThemeRes-child'); ?></button>
<button type="button" id="hidemap"><?php _e('Hide map','CreatorThemeRes-child'); ?></button>