From 6e419a7db5f040bb5fa382293a06735959969a6d Mon Sep 17 00:00:00 2001
From: "real3t@gmail.com" <>
Date: Wed, 9 May 2018 08:26:38 +0000
Subject: [PATCH] =?UTF-8?q?Pouvoir=20int=C3=A9grer=20un=20calcul=20d'itin?=
 =?UTF-8?q?=C3=A9raire=20(Google=20Maps)=20dans=20un=20article.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Documentation : https://contrib.spip.net/4995
---
 .gitattributes          |  2 ++
 modeles/itineraire.html | 24 ++++++++++++++++++++
 modeles/itineraire.js   | 50 +++++++++++++++++++++++++++++++++++++++++
 paquet.xml              |  2 +-
 4 files changed, 77 insertions(+), 1 deletion(-)
 create mode 100644 modeles/itineraire.html
 create mode 100644 modeles/itineraire.js

diff --git a/.gitattributes b/.gitattributes
index d60f93c4..ac90ef66 100644
--- a/.gitattributes
+++ b/.gitattributes
@@ -438,6 +438,8 @@ modeles/documentsjoints.html -text
 modeles/documentsjoints_inc.html -text
 modeles/emb_pdf.html -text
 modeles/formulaire_inscription_newsletter.html -text
+modeles/itineraire.html -text
+modeles/itineraire.js -text
 modeles/mod_lien_detail.html -text
 modeles/popup.html -text
 modeles/secteur_pdf.html -text
diff --git a/modeles/itineraire.html b/modeles/itineraire.html
new file mode 100644
index 00000000..b445d4f5
--- /dev/null
+++ b/modeles/itineraire.html
@@ -0,0 +1,24 @@
+<style type="text/css">
+#itineraire_container #itineraire_map{width:100%;height:500px;margin:auto;}
+#itineraire_container #itineraire_panel{width:100%;margin:auto;}
+</style>
+<div id="itineraire_container">
+	<div id="itineraire_destinationForm">
+		<form action="" method="get" name="direction" id="itineraire_direction">
+			<label for="itineraire_origin">Point de départ&nbsp;:</label>
+			<input type="text" name="origin" id="itineraire_origin" />
+			<label for="itineraire_destination">Destination&nbsp;:</label>
+			<input type="text" name="destination" id="itineraire_destination"[ value="(#ENV{destination})" readonly="readonly"] />
+			<input type="button" value="Calculer l'itinéraire" onclick="javascript:calculate_itineraire()" />
+		</form>
+	</div>
+	<div id="itineraire_panel"></div>
+	<div id="itineraire_map"[ data-title="(#ENV{destination})"][ data-lat="(#ENV{lat})"][ data-lng="(#ENV{lng})"]>
+		<p>Veuillez patienter pendant le chargement de la carte...</p>
+	</div>
+</div>
+
+<!-- Include Javascript -->
+<script async defer src="https://maps.googleapis.com/maps/api/js?[key=(#ENV{apikey})&]callback=initialize_map_itineraire"
+  type="text/javascript"></script>
+<script type="text/javascript" src="#CHEMIN{modeles/itineraire.js}"></script>
diff --git a/modeles/itineraire.js b/modeles/itineraire.js
new file mode 100644
index 00000000..824389de
--- /dev/null
+++ b/modeles/itineraire.js
@@ -0,0 +1,50 @@
+var map;
+var panel;
+var initialize_map_itineraire;
+var calculate_itineraire;
+var direction;
+
+initialize_map_itineraire = function(){
+  var latLng = new google.maps.LatLng($('#itineraire_map').data("lat") || 44.330642, $('#itineraire_map').data("lng") || -1.225703); // Correspond au coordonnées de Lille
+  var myOptions = {
+    zoom      : 14, // Zoom par défaut
+    center    : latLng, // Coordonnées de départ de la carte de type latLng 
+    mapTypeId : google.maps.MapTypeId.TERRAIN, // Type de carte, différentes valeurs possible HYBRID, ROADMAP, SATELLITE, TERRAIN
+    maxZoom   : 20
+  };
+  
+  map      = new google.maps.Map(document.getElementById('itineraire_map'), myOptions);
+  panel    = document.getElementById('itineraire_panel');
+  
+  var marker = new google.maps.Marker({
+    position : latLng,
+    map      : map,
+    title    : $('#itineraire_map').data("title") || 'Perdu'
+    //icon     : "marker_lille.gif" // Chemin de l'image du marqueur pour surcharger celui par défaut
+  });
+  
+  
+  direction = new google.maps.DirectionsRenderer({
+    map   : map,
+    panel : panel // Dom element pour afficher les instructions d'itinéraire
+  });
+
+};
+
+calculate_itineraire = function(){
+    origin      = document.getElementById('itineraire_origin').value; // Le point départ
+    destination = document.getElementById('itineraire_destination').value; // Le point d'arrivé
+    if(origin && destination){
+        var request = {
+            origin      : origin,
+            destination : destination,
+            travelMode  : google.maps.DirectionsTravelMode.DRIVING // Mode de conduite
+        }
+        var directionsService = new google.maps.DirectionsService(); // Service de calcul d'itinéraire
+        directionsService.route(request, function(response, status){ // Envoie de la requête pour calculer le parcours
+            if(status == google.maps.DirectionsStatus.OK){
+                direction.setDirections(response); // Trace l'itinéraire sur la carte et les différentes étapes du parcours
+            }
+        });
+    }
+};
\ No newline at end of file
diff --git a/paquet.xml b/paquet.xml
index 04af44e7..a086e08e 100644
--- a/paquet.xml
+++ b/paquet.xml
@@ -1,7 +1,7 @@
 <paquet
 	prefix="soyezcreateurs"
 	categorie="squelette"
-	version="4.3.5"
+	version="4.3.6"
 	etat="stable"
 	compatibilite="[3.1.8;3.2.*]"
 	logo="img_pack/soyezcreateurs_48.png"
-- 
GitLab