22,11 → 22,12 |
<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 --> |
<script type="text/javascript" src="https://getfirebug.com/firebug-lite.js"></script> |
<!-- Google Map v3 --> |
<script type="text/javascript" src="http://maps.google.com/maps/api/js?v=3.3&sensor=true"></script> |
<script type="text/javascript" src="http://maps.google.com/maps/api/js?v=3.5&sensor=true&language=fr&region=FR"></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/1.6.2/jquery-1.6.2.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> |
|
36,264 → 37,38 |
<!-- 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 urlsLimitesCommunales = <?=$url_limites_communales?>; |
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; |
}); |
} |
}); |
google.maps.event.addListener(infoBulle, 'closeclick', function() { |
map.panTo(pointClique.position); |
}); |
|
var pointClique = null; |
|
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() { |
pointClique = this; |
|
infoBulle.open(map, this); |
|
var limites = map.getBounds(); |
var centre = limites.getCenter(); |
var nordEst = limites.getNorthEast(); |
var centreSudLatLng = new google.maps.LatLng(nordEst.lat(), centre.lng()); |
map.panTo(centreSudLatLng); |
|
afficherMsgChargement(); |
chargerFormatObs(this.stationId, '*'); |
}); |
|
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); |
}); |
var plantesNbre = <?=count($taxons)?>; |
var urlObsStation = '<?=$url_base?>carto'+'?'+ |
'carte=observations'+'&'+ |
'utilisateur=<?=$utilisateur?>'+'&'+ |
'projet=<?=$projet?>'+'&'+ |
'num_taxon='+nt+'&'+ |
'dept=<?=$dept?>'; |
var urlObsCarte = '<?=$url_cel_carto?>/carte-defaut-json'+'?'+ |
'utilisateur=<?=$utilisateur?>'+'&'+ |
'projet=<?=$projet?>'+'&'+ |
'dept=<?=$dept?>'; |
//]]> |
</script> |
<script type="text/javascript" src="<?=$url_base?>modules/carto/squelettes/scripts/carto.js"></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()"> |
<body> |
<div id="zone-titre"> |
<h1 id="carte-titre"> |
<? if ($num_taxon == '*') : ?> |
<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> |
<? else : ?> |
<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> |
<span id="obs-nbre"> </span> observations de |
<span class="plantes-nbre"> </span> plantes sur |
<span id="commune-nbre"> </span> communes |
<? if ($num_taxon != '*') : ?> |
pour <?=$taxon_nom?> |
<? endif ?> |
- <a href="http://www.tela-botanica.org/appli:cel" title="Carnet en Ligne" onclick="window.open(this.href); arreter(event); return false;">CEL</a> (<a href="http://www.tela-botanica.org/" onclick="window.open(this.href); arreter(event); return false;">Tela Botanica</a>) |
</h1> |
<div id="zone-info"> |
<a href="<?=$url_base?>carto?carte=avertissement" onClick="ouvrirPopUp('<?=$url_base?>carto?carte=avertissement', 'Avertissement'); arreter(event); return false;"> |
308,7 → 83,7 |
<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> |
<h2>Filtre sur <span class="plantes-nbre"> </span> 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é. |
318,9 → 93,9 |
<ol id="taxons"> |
<? foreach ($taxons as $taxon) : ?> |
<li id="taxon-<?=$taxon['nt']?>"> |
<a href="#" onclick="filtrerParTaxon(<?=$taxon['nt']?>);" title="<?=$taxon['famille']?>"> |
<?=$taxon['nom']?> |
</a> |
<span class="taxon" title="<?=$taxon['famille']?>"> |
<?=$taxon['nom']?> <span class="nt" title="Numéro taxonomique"><?=$taxon['nt']?></span> |
</span> |
</li> |
<? endforeach; ?> |
</ol> |
335,5 → 110,20 |
<img src="<?=$url_base?>modules/carto/squelettes/images/chargement.gif" alt="Chargement en cours..." /> |
<p>Chargement des observations en cours...</p> |
</div> |
|
<!-- 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> |
</body> |
</html> |