WebSVN – eFlore/Applications.cel – Diff – /trunk/widget/modules/carto/squelettes/carte_defaut.tpl.html


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<title>Observations publiques du CEL - Tela Botanica</title>
		
		<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
		<meta http-equiv="Content-style-type" content="text/css" />
		<meta http-equiv="Content-script-type" content="text/javascript" />
		<meta http-equiv="Content-language" content="fr" />
		
		<meta name="revisit-after" content="15 days" />
        <meta name="robots" content="index,follow" />
        <meta name="author" content="Delphine CAUQUIL, Jean-Pascal MILCENT" />
        <meta name="keywords" content="Tela Botanica, cartographie, CEL" />
        <meta name="description" content="Widget de cartographie des observations publiques de plantes saisies dans le Carnet en Ligne (CEL)" />
 
		<!-- Spécial mobile -->
		<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
		
		<!-- Favicones -->
		<link rel="icon" type="image/png" href="http://www.tela-botanica.org/sites/commun/generique/images/favicones/tela_botanica.png" />
		<link rel="shortcut icon" type="image/x-icon" href="http://www.tela-botanica.org/sites/commun/generique/images/favicones/tela_botanica.ico" />
		
		<!-- Javascript : bibliothèques -->
		<!-- 	Google Map v3 -->
		<script type="text/javascript" src="http://maps.google.com/maps/api/js?v=3.3&amp;sensor=true"></script>
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/google/map/3/markerclusterer/1.0/markerclusterer-1.0.pack.js"></script>
		<!-- 	Jquery -->
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/<?=$jquery_version?>/jquery-<?=$jquery_version?>.min.js"></script>
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/tablesorter/2.0.5/jquery.tablesorter.min.js"></script>
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/fancybox/1.3.4/jquery.fancybox-1.3.4.pack.js"></script>
		
		<!-- Javascript : données -->
		<script src="<?=$url_json?>" type="text/javascript"></script>
		
		<!-- Javascript : appli carto -->
		<script type="text/javascript">
		//<![CDATA[
			var pointImageUrl = 'http://chart.apis.google.com/chart?cht=mm&chs=24x32&chco=FFFFFF,008CFF,000000&ext=.png';
			var pointsOrigine = null;
			var boundsOrigine = null;
			var markerClusterer = null;
			var map = null;
			var nt = '<?=$num_taxon?>';
			
			var infoBulle = new google.maps.InfoWindow();
			google.maps.event.addListener(infoBulle, 'domready', function() {
				// Onglet Tableau : Jquery => TableSorter
				if ($("#observations table").get() != '') {
					// add parser through the tablesorter addParser method 
					$.tablesorter.addParser({ 
						// Définition d'un id unique pour ce parsseur 
						id: 'date_cel', 
						is: function(s) { 
							// retourne false si le parsseur n'est pas autodétecté 
							return false; 
						}, 
						format: function(s) { 
							// Transformation date jj/mm/aaaa en aaaa/mm/jj
							s = s.replace(/(\d{1,2})[\/\-](\d{1,2})[\/\-](\d{4})/, "$3/$2/$1");
							// Remplace la date par un nombre de millisecondes pour trier numériquement
							return $.tablesorter.formatFloat(new Date(s).getTime());
						}, 
						// set type, either numeric or text 
						type: 'numeric' 
					});
					$("#observations table").tablesorter({ 
			            headers: { 
			                1: { 
			                    sorter:'date_cel' 
			                } 
			            } 
			        });
				}
				// Onglet Liste : Jquery => FancyBox
				if ($("#observations ol").get() != '') {
					$("a.cel-img").fancybox({
						transitionIn : 'elastic',
						transitionOut : 'elastic',
						speedIn	 : 600, 
						speedOut : 200, 
						overlayShow : true
					}).bind('click', function(e) {
						if (e.stopPropagation) {
							e.stopPropagation();
						}
						return false;
					});
				}
			});
			
			var carteCentre = new google.maps.LatLng(46.4, 3.10);
			var carteOptions = {
				zoom: 6,
				mapTypeId: google.maps.MapTypeId.ROADMAP,
				mapTypeControlOptions: {
			        style: google.maps.MapTypeControlStyle.DROPDOWN_MENU}
			};
			var ctaLayer = null;
			
			function refreshMap() {
				var points = [];
				var bounds = new google.maps.LatLngBounds();
				for (var i = 0; i < obs.nombre; ++i) {
					var maLatLng = new google.maps.LatLng(obs.points[i].coord_x, obs.points[i].coord_y);
					var pointImage = new google.maps.MarkerImage(pointImageUrl, new google.maps.Size(24, 32));
					var point = new google.maps.Marker({
						position: maLatLng,
						map: map,
						icon: pointImage,
						stationId: obs.points[i].id
					});
 
					bounds.extend(maLatLng);
					
					google.maps.event.addListener(point, 'click', function() {
						var limites = map.getBounds();
						var centre = limites.getCenter();
						var nordEst = limites.getNorthEast();
						var centreSudLatLng = new google.maps.LatLng(nordEst.lat(), centre.lng());
						
						infoBulle.open(map, this);
						afficherMsgChargement();
						chargerFormatObs(this.stationId, '*');
						
						map.panTo(centreSudLatLng);
					});
					
					points.push(point);
				}
 
				if (pointsOrigine == null && boundsOrigine == null) {
					pointsOrigine = points;
					boundsOrigine = bounds;
				}
				
				executerMarkerClusterer(points, bounds);
			}
 
			function executerMarkerClusterer(points, bounds) {
				if (markerClusterer) {
					markerClusterer.clearMarkers();
				}
				markerClusterer = new MarkerClusterer(map, points);
				map.fitBounds(bounds);
			}
 
			function afficherMsgChargement() {
				var chargement = document.getElementById('chargement').cloneNode(true);
				chargement.setAttribute('id', 'chargement-copie');
				infoBulle.setContent(chargement);
			}
 
			function chargerFormatObs(stationId, format) {
				var url = '<?=$url_base?>carto?carte=observations'+
					'&utilisateur=<?=$utilisateur?>'+
					'&projet=<?=$projet?>'+
					'&num_taxon='+nt+
					'&dept=<?=$dept?>'+
					'&format='+format+'&station='+stationId;
				$.get(url, function(observations){
					infoBulle.setContent(observations);
				});
			}
 
			function arreter(event) {
				if (event.stopPropagation) {
					event.stopPropagation();
				}
				return false;
			}
			
			function afficher() {
				document.getElementById('panneau-lateral').style.width = '300px';
				document.getElementById('pl-contenu').style.display = 'block';
				document.getElementById('pl-ouverture').style.display = 'none';
				document.getElementById('pl-fermeture').style.display = 'block';
				document.getElementById('carte').style.left = '300px';
				google.maps.event.trigger(map, 'resize');
			};
			
			function cacher() {
				document.getElementById('panneau-lateral').style.width = '24px';
				document.getElementById('pl-contenu').style.display = 'none';
				document.getElementById('pl-ouverture').style.display = 'block';
				document.getElementById('pl-fermeture').style.display = 'none';
				document.getElementById('carte').style.left = '24px';
				google.maps.event.trigger(map, 'resize');
			};
 
			function ouvrirPopUp(url, nom) {
				window.open(url, nom, 'scrollbars=yes,width=650,height=600,directories=no,location=no,menubar=no,status=no,toolbar=no');
			};
			
			function filtrerParTaxon(ntAFiltrer) {
				infoBulle.close();
				$('#taxon-'+nt).removeClass('taxon-actif');
				if (nt == ntAFiltrer) {
					nt = '*';
					executerMarkerClusterer(pointsOrigine, boundsOrigine);
				} else {
					var url = '<?=$url_cel_carto?>/carte-defaut-json/<?=$utilisateur?>/<?=$projet?>/<?=$dept?>/'+ntAFiltrer+'?formatRetour=jsonp&callback=?';
					$.getJSON(url, function (observations) {
						obs = observations;
						nt = ntAFiltrer;
						$('#taxon-'+nt).addClass('taxon-actif');
						refreshMap();
					});
				}
			};
			
			function initialize() {
				map = new google.maps.Map(document.getElementById('carte'), carteOptions);
 
				// Ajout des limites communales sur la carte
				<? if (isset($url_limites_communales)) : ?>
					<? foreach ($url_limites_communales as $url) : ?>
						ctaLayer = new google.maps.KmlLayer('<?=$url?>', {preserveViewport: true});
						ctaLayer.setMap(map);
					<? endforeach ?>
				<? endif ?>
				
				<? if ($num_taxon == '*') : ?>
				var ouvertureDiv = document.getElementById('pl-ouverture');
				google.maps.event.addDomListener(ouvertureDiv, 'click', afficher);
 
				var fermetureDiv = document.getElementById('pl-fermeture');
				google.maps.event.addDomListener(fermetureDiv, 'click', cacher);
				<? endif ?>
		
				refreshMap();
			}
			
			// Déclenchement d'actions pour JQuery
			$(document).ready(function() {
				// Ajout du nombre de communes où des observations ont eu lieu
				$('#commune-nbre').append(obs.nombre);
			});
		//]]>
		</script>
		
		<!-- CSS -->
		<link href="<?=$url_base?>modules/carto/squelettes/css/carto.css" rel="stylesheet" type="text/css" media="screen" />
		<link rel="stylesheet" href="http://www.tela-botanica.org/commun/jquery/fancybox/1.3.4/jquery.fancybox-1.3.4.css" type="text/css" media="screen" />
		
		<!--[if lt IE 7]>
			<style type="text/css">
				#carte {
					height:expression(document.body.clientHeight-35); /* 80+20+20=120 */
					width:expression(document.body.clientWidth-24); /* 200+20+20+20=260 */
				}
				#panneau-lateral {
					height:expression(document.body.clientHeight-35); /* 80+20+20=120 */
				}
			</style>
		<![endif]-->
		
		<? if ($num_taxon != '*') : ?>
		<style type="text/css">
			#carte {
				left:0;
			}
		</style>
		<? endif ?>
		
		<!-- Stats : Google Analytics -->
		<script type="text/javascript">
			//<![CDATA[
			var _gaq = _gaq || [];
			_gaq.push(['_setAccount', 'UA-20092557-1']);
			_gaq.push(['_trackPageview']);
			
			(function() {
			  var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
			  ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
			  var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
			})();
			//]]>
		</script>
	</head>
 
	<body onload="initialize()">
		<div id="zone-titre">
			<h1 id="carte-titre">
				<? if ($num_taxon == '*') : ?>
				<span id="commune-nbre">&nbsp;</span> communes contenant des observations du <a href="http://www.tela-botanica.org/appli:cel" title="Carnet en Ligne" onclick="window.open(this.href); arreter(event); return false;">CEL</a> de <a href="http://www.tela-botanica.org/" onclick="window.open(this.href); arreter(event); return false;">Tela Botanica</a>
				<? else : ?>
				<span id="commune-nbre">&nbsp;</span> communes pour <?=$taxon_nom?> - <a href="http://www.tela-botanica.org/appli:cel" title="Carnet en Ligne" onclick="window.open(this.href); arreter(event); return false;">CEL</a> de <a href="http://www.tela-botanica.org/" onclick="window.open(this.href); arreter(event); return false;">Tela Botanica</a>
				<? endif ?>
			</h1>
			<div id="zone-info">
				<a href="<?=$url_base?>carto?carte=avertissement" onClick="ouvrirPopUp('<?=$url_base?>carto?carte=avertissement', 'Avertissement'); arreter(event); return false;">
					<img src="<?=$url_base?>modules/carto/squelettes/images/information.png" 
						alt="Avertissements" title="Avertissements &amp; informations" />
				</a>
			</div>
		</div>
		<? if ($num_taxon == '*') : ?>
		<div id="panneau-lateral">
			<div id="pl-ouverture" title="Ouvrir le panneau latéral"><span>Panneau >></span></div>
			<div id="pl-fermeture" title="Fermer le panneau latéral"><span><< Fermer [x]</span></div>
			<div id="pl-contenu">
				<div id="pl-entete">
					<h2>Filtre sur <?=count($taxons)?> plantes</h2>	
					<p>
						Cliquez sur un nom de plante pour filtrer les observations sur la carte.<br /> 
						Pour revenir à l'état initial, cliquez à nouveau sur le nom sélectionné.
					</p>
				</div>
				<div id="pl-corps" onMouseOver="map.setOptions({'scrollwheel':false});" onMouseOut="map.setOptions({'scrollwheel':true});">
					<ol id="taxons">
					<? foreach ($taxons as $taxon) : ?>
						<li id="taxon-<?=$taxon['nt']?>">
							<a href="#" onclick="filtrerParTaxon(<?=$taxon['nt']?>);" title="<?=$taxon['famille']?>">
								<?=$taxon['nom']?> 
							</a>
						</li>
					<? endforeach; ?>
					</ol>
				</div>
			</div>
		</div>
		<? endif ?>
		<div id="carte"></div>
		
		<!-- Blocs chargés à la demande : par défaut avec un style display à none -->
		<div id="chargement">
			<img src="<?=$url_base?>modules/carto/squelettes/images/chargement.gif" alt="Chargement en cours..." />
			<p>Chargement des observations en cours...</p>
		</div>
	</body>
</html>

Rev 569	Rev 571
1	`<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">`	1	`<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">`
2	`<html xmlns="http://www.w3.org/1999/xhtml">`	2	`<html xmlns="http://www.w3.org/1999/xhtml">`
3	`<head>`	3	`<head>`
4	`<title>Observations publiques du CEL - Tela Botanica</title>`	4	`<title>Observations publiques du CEL - Tela Botanica</title>`
5		5
6	`<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>`	6	`<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>`
7	`<meta http-equiv="Content-style-type" content="text/css" />`	7	`<meta http-equiv="Content-style-type" content="text/css" />`
8	`<meta http-equiv="Content-script-type" content="text/javascript" />`	8	`<meta http-equiv="Content-script-type" content="text/javascript" />`
9	`<meta http-equiv="Content-language" content="fr" />`	9	`<meta http-equiv="Content-language" content="fr" />`
10		10
11	`<meta name="revisit-after" content="15 days" />`	11	`<meta name="revisit-after" content="15 days" />`
12	`<meta name="robots" content="index,follow" />`	12	`<meta name="robots" content="index,follow" />`
13	`<meta name="author" content="Delphine CAUQUIL, Jean-Pascal MILCENT" />`	13	`<meta name="author" content="Delphine CAUQUIL, Jean-Pascal MILCENT" />`
14	`<meta name="keywords" content="Tela Botanica, cartographie, CEL" />`	14	`<meta name="keywords" content="Tela Botanica, cartographie, CEL" />`
15	`<meta name="description" content="Widget de cartographie des observations publiques de plantes saisies dans le Carnet en Ligne (CEL)" />`	15	`<meta name="description" content="Widget de cartographie des observations publiques de plantes saisies dans le Carnet en Ligne (CEL)" />`
16		16
17	`<!-- Spécial mobile -->`	17	`<!-- Spécial mobile -->`
18	`<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />`	18	`<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />`
19		19
20	`<!-- Favicones -->`	20	`<!-- Favicones -->`
21	`<link rel="icon" type="image/png" href="http://www.tela-botanica.org/sites/commun/generique/images/favicones/tela_botanica.png" />`	21	`<link rel="icon" type="image/png" href="http://www.tela-botanica.org/sites/commun/generique/images/favicones/tela_botanica.png" />`
22	`<link rel="shortcut icon" type="image/x-icon" href="http://www.tela-botanica.org/sites/commun/generique/images/favicones/tela_botanica.ico" />`	22	`<link rel="shortcut icon" type="image/x-icon" href="http://www.tela-botanica.org/sites/commun/generique/images/favicones/tela_botanica.ico" />`
23		23
24	`<!-- Javascript : bibliothèques -->`	24	`<!-- Javascript : bibliothèques -->`
25	`<!-- Google Map v3 -->`	25	`<!-- Google Map v3 -->`
26	`<script type="text/javascript" src="http://maps.google.com/maps/api/js?v=3.3&sensor=true"></script>`	26	`<script type="text/javascript" src="http://maps.google.com/maps/api/js?v=3.3&sensor=true"></script>`
27	`<script type="text/javascript" src="http://www.tela-botanica.org/commun/google/map/3/markerclusterer/1.0/markerclusterer-1.0.pack.js"></script>`	27	`<script type="text/javascript" src="http://www.tela-botanica.org/commun/google/map/3/markerclusterer/1.0/markerclusterer-1.0.pack.js"></script>`
28	`<!-- Jquery -->`	28	`<!-- Jquery -->`
29	`<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/<?=$jquery_version?>/jquery-<?=$jquery_version?>.min.js"></script>`	29	`<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/<?=$jquery_version?>/jquery-<?=$jquery_version?>.min.js"></script>`
30	`<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/tablesorter/2.0.5/jquery.tablesorter.min.js"></script>`	30	`<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/tablesorter/2.0.5/jquery.tablesorter.min.js"></script>`
31	`<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/fancybox/1.3.4/jquery.fancybox-1.3.4.pack.js"></script>`	31	`<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/fancybox/1.3.4/jquery.fancybox-1.3.4.pack.js"></script>`
32		32
33	`<!-- Javascript : données -->`	33	`<!-- Javascript : données -->`
34	`<script src="<?=$url_json?>" type="text/javascript"></script>`	34	`<script src="<?=$url_json?>" type="text/javascript"></script>`
35		35
36	`<!-- Javascript : appli carto -->`	36	`<!-- Javascript : appli carto -->`
37	`<script type="text/javascript">`	37	`<script type="text/javascript">`
38	`//<![CDATA[`	38	`//<![CDATA[`
39	`var pointImageUrl = 'http://chart.apis.google.com/chart?cht=mm&chs=24x32&chco=FFFFFF,008CFF,000000&ext=.png';`	39	`var pointImageUrl = 'http://chart.apis.google.com/chart?cht=mm&chs=24x32&chco=FFFFFF,008CFF,000000&ext=.png';`
40	`var pointsOrigine = null;`	40	`var pointsOrigine = null;`
41	`var boundsOrigine = null;`	41	`var boundsOrigine = null;`
42	`var markerClusterer = null;`	42	`var markerClusterer = null;`
43	`var map = null;`	43	`var map = null;`
44	`var nt = '<?=$num_taxon?>';`	44	`var nt = '<?=$num_taxon?>';`
-		45
45	`var infoBulle = new google.maps.InfoWindow();`	46	`var infoBulle = new google.maps.InfoWindow();`
46	`google.maps.event.addListener(infoBulle, 'domready', function() {`	47	`google.maps.event.addListener(infoBulle, 'domready', function() {`
47	`// Onglet Tableau : Jquery => TableSorter`	48	`// Onglet Tableau : Jquery => TableSorter`
48	`if ($("#observations table").get() != '') {`	49	`if ($("#observations table").get() != '') {`
-		50	`// add parser through the tablesorter addParser method`
-		51	`$.tablesorter.addParser({`
-		52	`// Définition d'un id unique pour ce parsseur`
-		53	`id: 'date_cel',`
-		54	`is: function(s) {`
-		55	`// retourne false si le parsseur n'est pas autodétecté`
-		56	`return false;`
-		57	`},`
-		58	`format: function(s) {`
-		59	`// Transformation date jj/mm/aaaa en aaaa/mm/jj`
-		60	`s = s.replace(/(\d{1,2})[\/\-](\d{1,2})[\/\-](\d{4})/, "$3/$2/$1");`
-		61	`// Remplace la date par un nombre de millisecondes pour trier numériquement`
-		62	`return $.tablesorter.formatFloat(new Date(s).getTime());`
-		63	`},`
-		64	`// set type, either numeric or text`
-		65	`type: 'numeric'`
-		66	`});`
49	`$("#observations table").tablesorter();`	67	`$("#observations table").tablesorter({`
-		68	`headers: {`
-		69	`1: {`
-		70	`sorter:'date_cel'`
-		71	`}`
-		72	`}`
-		73	`});`
50	`}`	74	`}`
51	`// Onglet Liste : Jquery => FancyBox`	75	`// Onglet Liste : Jquery => FancyBox`
52	`if ($("#observations ol").get() != '') {`	76	`if ($("#observations ol").get() != '') {`
53	`$("a.cel-img").fancybox({`	77	`$("a.cel-img").fancybox({`
54	`transitionIn : 'elastic',`	78	`transitionIn : 'elastic',`
55	`transitionOut : 'elastic',`	79	`transitionOut : 'elastic',`
56	`speedIn : 600,`	80	`speedIn : 600,`
57	`speedOut : 200,`	81	`speedOut : 200,`
58	`overlayShow : true`	82	`overlayShow : true`
59	`}).bind('click', function(e) {`	83	`}).bind('click', function(e) {`
60	`if (e.stopPropagation) {`	84	`if (e.stopPropagation) {`
61	`e.stopPropagation();`	85	`e.stopPropagation();`
62	`}`	86	`}`
63	`return false;`	87	`return false;`
64	`});`	88	`});`
65	`}`	89	`}`
66	`});`	90	`});`
67		91
68	`var carteCentre = new google.maps.LatLng(46.4, 3.10);`	92	`var carteCentre = new google.maps.LatLng(46.4, 3.10);`
69	`var carteOptions = {`	93	`var carteOptions = {`
70	`zoom: 6,`	94	`zoom: 6,`
71	`mapTypeId: google.maps.MapTypeId.ROADMAP,`	95	`mapTypeId: google.maps.MapTypeId.ROADMAP,`
72	`mapTypeControlOptions: {`	96	`mapTypeControlOptions: {`
73	`style: google.maps.MapTypeControlStyle.DROPDOWN_MENU}`	97	`style: google.maps.MapTypeControlStyle.DROPDOWN_MENU}`
74	`};`	98	`};`
75	`var ctaLayer = null;`	99	`var ctaLayer = null;`
76		100
77	`function refreshMap() {`	101	`function refreshMap() {`
78	`var points = [];`	102	`var points = [];`
79	`var bounds = new google.maps.LatLngBounds();`	103	`var bounds = new google.maps.LatLngBounds();`
80	`for (var i = 0; i < obs.nombre; ++i) {`	104	`for (var i = 0; i < obs.nombre; ++i) {`
81	`var maLatLng = new google.maps.LatLng(obs.points[i].coord_x, obs.points[i].coord_y);`	105	`var maLatLng = new google.maps.LatLng(obs.points[i].coord_x, obs.points[i].coord_y);`
82	`var pointImage = new google.maps.MarkerImage(pointImageUrl, new google.maps.Size(24, 32));`	106	`var pointImage = new google.maps.MarkerImage(pointImageUrl, new google.maps.Size(24, 32));`
83	`var point = new google.maps.Marker({`	107	`var point = new google.maps.Marker({`
84	`position: maLatLng,`	108	`position: maLatLng,`
85	`map: map,`	109	`map: map,`
86	`icon: pointImage,`	110	`icon: pointImage,`
87	`stationId: obs.points[i].id`	111	`stationId: obs.points[i].id`
88	`});`	112	`});`
89		113
90	`bounds.extend(maLatLng);`	114	`bounds.extend(maLatLng);`
91		115
92	`google.maps.event.addListener(point, 'click', function() {`	116	`google.maps.event.addListener(point, 'click', function() {`
93	`afficherMsgChargement();`	117	`var limites = map.getBounds();`
-		118	`var centre = limites.getCenter();`
-		119	`var nordEst = limites.getNorthEast();`
-		120	`var centreSudLatLng = new google.maps.LatLng(nordEst.lat(), centre.lng());`
-		121
94	`infoBulle.open(map, this);`	122	`infoBulle.open(map, this);`
-		123	`afficherMsgChargement();`
95	`chargerFormatObs(this.stationId, '*');`	124	`chargerFormatObs(this.stationId, '*');`
-		125
-		126	`map.panTo(centreSudLatLng);`
96	`});`	127	`});`
97		128
98	`points.push(point);`	129	`points.push(point);`
99	`}`	130	`}`
100		131
101	`if (pointsOrigine == null && boundsOrigine == null) {`	132	`if (pointsOrigine == null && boundsOrigine == null) {`
102	`pointsOrigine = points;`	133	`pointsOrigine = points;`
103	`boundsOrigine = bounds;`	134	`boundsOrigine = bounds;`
104	`}`	135	`}`
105		136
106	`executerMarkerClusterer(points, bounds);`	137	`executerMarkerClusterer(points, bounds);`
107	`}`	138	`}`
108		139
109	`function executerMarkerClusterer(points, bounds) {`	140	`function executerMarkerClusterer(points, bounds) {`
110	`if (markerClusterer) {`	141	`if (markerClusterer) {`
111	`markerClusterer.clearMarkers();`	142	`markerClusterer.clearMarkers();`
112	`}`	143	`}`
113	`markerClusterer = new MarkerClusterer(map, points);`	144	`markerClusterer = new MarkerClusterer(map, points);`
114	`map.fitBounds(bounds);`	145	`map.fitBounds(bounds);`
115	`}`	146	`}`
116		147
117	`function afficherMsgChargement() {`	148	`function afficherMsgChargement() {`
118	`var chargement = document.getElementById('chargement').cloneNode(true);`	149	`var chargement = document.getElementById('chargement').cloneNode(true);`
119	`chargement.setAttribute('id', 'chargement-copie');`	150	`chargement.setAttribute('id', 'chargement-copie');`
120	`infoBulle.setContent(chargement);`	151	`infoBulle.setContent(chargement);`
121	`}`	152	`}`
122		153
123	`function chargerFormatObs(stationId, format) {`	154	`function chargerFormatObs(stationId, format) {`
124	`var url = '<?=$url_base?>carto?carte=observations'+`	155	`var url = '<?=$url_base?>carto?carte=observations'+`
125	`'&utilisateur=<?=$utilisateur?>'+`	156	`'&utilisateur=<?=$utilisateur?>'+`
126	`'&projet=<?=$projet?>'+`	157	`'&projet=<?=$projet?>'+`
127	`'&num_taxon='+nt+`	158	`'&num_taxon='+nt+`
128	`'&dept=<?=$dept?>'+`	159	`'&dept=<?=$dept?>'+`
129	`'&format='+format+'&station='+stationId;`	160	`'&format='+format+'&station='+stationId;`
130	`$.get(url, function(observations){`	161	`$.get(url, function(observations){`
131	`infoBulle.setContent(observations);`	162	`infoBulle.setContent(observations);`
132	`});`	163	`});`
133	`}`	164	`}`
134		165
135	`function arreter(event) {`	166	`function arreter(event) {`
136	`if (event.stopPropagation) {`	167	`if (event.stopPropagation) {`
137	`event.stopPropagation();`	168	`event.stopPropagation();`
138	`}`	169	`}`
139	`return false;`	170	`return false;`
140	`}`	171	`}`
141		172
142	`function afficher() {`	173	`function afficher() {`
143	`document.getElementById('panneau-lateral').style.width = '300px';`	174	`document.getElementById('panneau-lateral').style.width = '300px';`
144	`document.getElementById('pl-contenu').style.display = 'block';`	175	`document.getElementById('pl-contenu').style.display = 'block';`
145	`document.getElementById('pl-ouverture').style.display = 'none';`	176	`document.getElementById('pl-ouverture').style.display = 'none';`
146	`document.getElementById('pl-fermeture').style.display = 'block';`	177	`document.getElementById('pl-fermeture').style.display = 'block';`
147	`document.getElementById('carte').style.left = '300px';`	178	`document.getElementById('carte').style.left = '300px';`
148	`google.maps.event.trigger(map, 'resize');`	179	`google.maps.event.trigger(map, 'resize');`
149	`};`	180	`};`
150		181
151	`function cacher() {`	182	`function cacher() {`
152	`document.getElementById('panneau-lateral').style.width = '24px';`	183	`document.getElementById('panneau-lateral').style.width = '24px';`
153	`document.getElementById('pl-contenu').style.display = 'none';`	184	`document.getElementById('pl-contenu').style.display = 'none';`
154	`document.getElementById('pl-ouverture').style.display = 'block';`	185	`document.getElementById('pl-ouverture').style.display = 'block';`
155	`document.getElementById('pl-fermeture').style.display = 'none';`	186	`document.getElementById('pl-fermeture').style.display = 'none';`
156	`document.getElementById('carte').style.left = '24px';`	187	`document.getElementById('carte').style.left = '24px';`
157	`google.maps.event.trigger(map, 'resize');`	188	`google.maps.event.trigger(map, 'resize');`
158	`};`	189	`};`
159		190
160	`function ouvrirPopUp(url, nom) {`	191	`function ouvrirPopUp(url, nom) {`
161	`window.open(url, nom, 'scrollbars=yes,width=650,height=600,directories=no,location=no,menubar=no,status=no,toolbar=no');`	192	`window.open(url, nom, 'scrollbars=yes,width=650,height=600,directories=no,location=no,menubar=no,status=no,toolbar=no');`
162	`};`	193	`};`
163		194
164	`function filtrerParTaxon(ntAFiltrer) {`	195	`function filtrerParTaxon(ntAFiltrer) {`
165	`infoBulle.close();`	196	`infoBulle.close();`
166	`$('#taxon-'+nt).removeClass('taxon-actif');`	197	`$('#taxon-'+nt).removeClass('taxon-actif');`
167	`if (nt == ntAFiltrer) {`	198	`if (nt == ntAFiltrer) {`
168	`nt = '*';`	199	`nt = '*';`
169	`executerMarkerClusterer(pointsOrigine, boundsOrigine);`	200	`executerMarkerClusterer(pointsOrigine, boundsOrigine);`
170	`} else {`	201	`} else {`
171	`var url = '<?=$url_cel_carto?>/carte-defaut-json/<?=$utilisateur?>/<?=$projet?>/<?=$dept?>/'+ntAFiltrer+'?formatRetour=jsonp&callback=?';`	202	`var url = '<?=$url_cel_carto?>/carte-defaut-json/<?=$utilisateur?>/<?=$projet?>/<?=$dept?>/'+ntAFiltrer+'?formatRetour=jsonp&callback=?';`
172	`$.getJSON(url, function (observations) {`	203	`$.getJSON(url, function (observations) {`
173	`obs = observations;`	204	`obs = observations;`
174	`nt = ntAFiltrer;`	205	`nt = ntAFiltrer;`
175	`$('#taxon-'+nt).addClass('taxon-actif');`	206	`$('#taxon-'+nt).addClass('taxon-actif');`
176	`refreshMap();`	207	`refreshMap();`
177	`});`	208	`});`
178	`}`	209	`}`
179	`};`	210	`};`
180		211
181	`function initialize() {`	212	`function initialize() {`
182	`map = new google.maps.Map(document.getElementById('carte'), carteOptions);`	213	`map = new google.maps.Map(document.getElementById('carte'), carteOptions);`
183		214
184	`// Ajout des limites communales sur la carte`	215	`// Ajout des limites communales sur la carte`
185	`<? if (isset($url_limites_communales)) : ?>`	216	`<? if (isset($url_limites_communales)) : ?>`
186	`<? foreach ($url_limites_communales as $url) : ?>`	217	`<? foreach ($url_limites_communales as $url) : ?>`
187	`ctaLayer = new google.maps.KmlLayer('<?=$url?>', {preserveViewport: true});`	218	`ctaLayer = new google.maps.KmlLayer('<?=$url?>', {preserveViewport: true});`
188	`ctaLayer.setMap(map);`	219	`ctaLayer.setMap(map);`
189	`<? endforeach ?>`	220	`<? endforeach ?>`
190	`<? endif ?>`	221	`<? endif ?>`
191		222
192	`<? if ($num_taxon == '*') : ?>`	223	`<? if ($num_taxon == '*') : ?>`
193	`var ouvertureDiv = document.getElementById('pl-ouverture');`	224	`var ouvertureDiv = document.getElementById('pl-ouverture');`
194	`google.maps.event.addDomListener(ouvertureDiv, 'click', afficher);`	225	`google.maps.event.addDomListener(ouvertureDiv, 'click', afficher);`
195		226
196	`var fermetureDiv = document.getElementById('pl-fermeture');`	227	`var fermetureDiv = document.getElementById('pl-fermeture');`
197	`google.maps.event.addDomListener(fermetureDiv, 'click', cacher);`	228	`google.maps.event.addDomListener(fermetureDiv, 'click', cacher);`
198	`<? endif ?>`	229	`<? endif ?>`
199		230
200	`refreshMap();`	231	`refreshMap();`
201	`}`	232	`}`
202		233
203	`// Déclenchement d'actions pour JQuery`	234	`// Déclenchement d'actions pour JQuery`
204	`$(document).ready(function() {`	235	`$(document).ready(function() {`
205	`// Ajout du nombre de communes où des observations ont eu lieu`	236	`// Ajout du nombre de communes où des observations ont eu lieu`
206	`$('#commune-nbre').append(obs.nombre);`	237	`$('#commune-nbre').append(obs.nombre);`
207	`});`	238	`});`
208	`//]]>`	239	`//]]>`
209	`</script>`	240	`</script>`
210		241
211	`<!-- CSS -->`	242	`<!-- CSS -->`
212	`<link href="<?=$url_base?>modules/carto/squelettes/css/carto.css" rel="stylesheet" type="text/css" media="screen" />`	243	`<link href="<?=$url_base?>modules/carto/squelettes/css/carto.css" rel="stylesheet" type="text/css" media="screen" />`
213	`<link rel="stylesheet" href="http://www.tela-botanica.org/commun/jquery/fancybox/1.3.4/jquery.fancybox-1.3.4.css" type="text/css" media="screen" />`	244	`<link rel="stylesheet" href="http://www.tela-botanica.org/commun/jquery/fancybox/1.3.4/jquery.fancybox-1.3.4.css" type="text/css" media="screen" />`
214		245
215	`<!--[if lt IE 7]>`	246	`<!--[if lt IE 7]>`
216	`<style type="text/css">`	247	`<style type="text/css">`
217	`#carte {`	248	`#carte {`
218	`height:expression(document.body.clientHeight-35); /* 80+20+20=120 */`	249	`height:expression(document.body.clientHeight-35); /* 80+20+20=120 */`
219	`width:expression(document.body.clientWidth-24); /* 200+20+20+20=260 */`	250	`width:expression(document.body.clientWidth-24); /* 200+20+20+20=260 */`
220	`}`	251	`}`
221	`#panneau-lateral {`	252	`#panneau-lateral {`
222	`height:expression(document.body.clientHeight-35); /* 80+20+20=120 */`	253	`height:expression(document.body.clientHeight-35); /* 80+20+20=120 */`
223	`}`	254	`}`
224	`</style>`	255	`</style>`
225	`<![endif]-->`	256	`<![endif]-->`
226		257
227	`<? if ($num_taxon != '*') : ?>`	258	`<? if ($num_taxon != '*') : ?>`
228	`<style type="text/css">`	259	`<style type="text/css">`
229	`#carte {`	260	`#carte {`
230	`left:0;`	261	`left:0;`
231	`}`	262	`}`
232	`</style>`	263	`</style>`
233	`<? endif ?>`	264	`<? endif ?>`
234		265
235	`<!-- Stats : Google Analytics -->`	266	`<!-- Stats : Google Analytics -->`
236	`<script type="text/javascript">`	267	`<script type="text/javascript">`
237	`//<![CDATA[`	268	`//<![CDATA[`
238	`var _gaq = _gaq \|\| [];`	269	`var _gaq = _gaq \|\| [];`
239	`_gaq.push(['_setAccount', 'UA-20092557-1']);`	270	`_gaq.push(['_setAccount', 'UA-20092557-1']);`
240	`_gaq.push(['_trackPageview']);`	271	`_gaq.push(['_trackPageview']);`
241		272
242	`(function() {`	273	`(function() {`
243	`var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;`	274	`var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;`
244	`ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';`	275	`ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';`
245	`var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);`	276	`var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);`
246	`})();`	277	`})();`
247	`//]]>`	278	`//]]>`
248	`</script>`	279	`</script>`
249	`</head>`	280	`</head>`
250		281
251	`<body onload="initialize()">`	282	`<body onload="initialize()">`
252	`<div id="zone-titre">`	283	`<div id="zone-titre">`
253	`<h1 id="carte-titre">`	284	`<h1 id="carte-titre">`
254	`<? if ($num_taxon == '*') : ?>`	285	`<? if ($num_taxon == '*') : ?>`
255	`<span id="commune-nbre"> </span> communes contenant des observations du <a href="http://www.tela-botanica.org/appli:cel" title="Carnet en Ligne" onclick="window.open(this.href); arreter(event); return false;">CEL</a> de <a href="http://www.tela-botanica.org/" onclick="window.open(this.href); arreter(event); return false;">Tela Botanica</a>`	286	`<span id="commune-nbre"> </span> communes contenant des observations du <a href="http://www.tela-botanica.org/appli:cel" title="Carnet en Ligne" onclick="window.open(this.href); arreter(event); return false;">CEL</a> de <a href="http://www.tela-botanica.org/" onclick="window.open(this.href); arreter(event); return false;">Tela Botanica</a>`
256	`<? else : ?>`	287	`<? else : ?>`
257	`<span id="commune-nbre"> </span> communes pour <?=$taxon_nom?> - <a href="http://www.tela-botanica.org/appli:cel" title="Carnet en Ligne" onclick="window.open(this.href); arreter(event); return false;">CEL</a> de <a href="http://www.tela-botanica.org/" onclick="window.open(this.href); arreter(event); return false;">Tela Botanica</a>`	288	`<span id="commune-nbre"> </span> communes pour <?=$taxon_nom?> - <a href="http://www.tela-botanica.org/appli:cel" title="Carnet en Ligne" onclick="window.open(this.href); arreter(event); return false;">CEL</a> de <a href="http://www.tela-botanica.org/" onclick="window.open(this.href); arreter(event); return false;">Tela Botanica</a>`
258	`<? endif ?>`	289	`<? endif ?>`
259	`</h1>`	290	`</h1>`
260	`<div id="zone-info">`	291	`<div id="zone-info">`
261	`<a href="<?=$url_base?>carto?carte=avertissement" onClick="ouvrirPopUp('<?=$url_base?>carto?carte=avertissement', 'Avertissement'); arreter(event); return false;">`	292	`<a href="<?=$url_base?>carto?carte=avertissement" onClick="ouvrirPopUp('<?=$url_base?>carto?carte=avertissement', 'Avertissement'); arreter(event); return false;">`
262	`<img src="<?=$url_base?>modules/carto/squelettes/images/information.png"`	293	`<img src="<?=$url_base?>modules/carto/squelettes/images/information.png"`
263	`alt="Avertissements" title="Avertissements & informations" />`	294	`alt="Avertissements" title="Avertissements & informations" />`
264	`</a>`	295	`</a>`
265	`</div>`	296	`</div>`
266	`</div>`	297	`</div>`
267	`<? if ($num_taxon == '*') : ?>`	298	`<? if ($num_taxon == '*') : ?>`
268	`<div id="panneau-lateral">`	299	`<div id="panneau-lateral">`
269	`<div id="pl-ouverture" title="Ouvrir le panneau latéral"><span>Panneau >></span></div>`	300	`<div id="pl-ouverture" title="Ouvrir le panneau latéral"><span>Panneau >></span></div>`
270	`<div id="pl-fermeture" title="Fermer le panneau latéral"><span><< Fermer [x]</span></div>`	301	`<div id="pl-fermeture" title="Fermer le panneau latéral"><span><< Fermer [x]</span></div>`
271	`<div id="pl-contenu">`	302	`<div id="pl-contenu">`
272	`<div id="pl-entete">`	303	`<div id="pl-entete">`
273	`<h2>Filtre sur <?=count($taxons)?> plantes</h2>`	304	`<h2>Filtre sur <?=count($taxons)?> plantes</h2>`
274	`<p>`	305	`<p>`
275	`Cliquez sur un nom de plante pour filtrer les observations sur la carte.<br />`	306	`Cliquez sur un nom de plante pour filtrer les observations sur la carte.<br />`
276	`Pour revenir à l'état initial, cliquez à nouveau sur le nom sélectionné.`	307	`Pour revenir à l'état initial, cliquez à nouveau sur le nom sélectionné.`
277	`</p>`	308	`</p>`
278	`</div>`	309	`</div>`
279	`<div id="pl-corps" onMouseOver="map.setOptions({'scrollwheel':false});" onMouseOut="map.setOptions({'scrollwheel':true});">`	310	`<div id="pl-corps" onMouseOver="map.setOptions({'scrollwheel':false});" onMouseOut="map.setOptions({'scrollwheel':true});">`
280	`<ol id="taxons">`	311	`<ol id="taxons">`
281	`<? foreach ($taxons as $taxon) : ?>`	312	`<? foreach ($taxons as $taxon) : ?>`
282	`<li id="taxon-<?=$taxon['nt']?>">`	313	`<li id="taxon-<?=$taxon['nt']?>">`
283	`<a href="#" onclick="filtrerParTaxon(<?=$taxon['nt']?>);" title="<?=$taxon['famille']?>">`	314	`<a href="#" onclick="filtrerParTaxon(<?=$taxon['nt']?>);" title="<?=$taxon['famille']?>">`
284	`<?=$taxon['nom']?>`	315	`<?=$taxon['nom']?>`
285	`</a>`	316	`</a>`
286	`</li>`	317	`</li>`
287	`<? endforeach; ?>`	318	`<? endforeach; ?>`
288	`</ol>`	319	`</ol>`
289	`</div>`	320	`</div>`
290	`</div>`	321	`</div>`
291	`</div>`	322	`</div>`
292	`<? endif ?>`	323	`<? endif ?>`
293	`<div id="carte"></div>`	324	`<div id="carte"></div>`
294		325
295	`<!-- Blocs chargés à la demande : par défaut avec un style display à none -->`	326	`<!-- Blocs chargés à la demande : par défaut avec un style display à none -->`
296	`<div id="chargement">`	327	`<div id="chargement">`
297	`<img src="<?=$url_base?>modules/carto/squelettes/images/chargement.gif" alt="Chargement en cours..." />`	328	`<img src="<?=$url_base?>modules/carto/squelettes/images/chargement.gif" alt="Chargement en cours..." />`
298	`<p>Chargement des observations en cours...</p>`	329	`<p>Chargement des observations en cours...</p>`
299	`</div>`	330	`</div>`
300	`</body>`	331	`</body>`
301	`</html>`	332	`</html>`

Subversion Repositories eFlore/Applications.cel

(root)/trunk/widget/modules/carto/squelettes/carte_defaut.tpl.html @ 2081 – Rev 569 → 571