/trunk/widget/modules/carto/squelettes/carte_defaut.tpl.html |
---|
22,7 → 22,7 |
<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> |
<!-- <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.6&sensor=true&language=fr&region=FR"></script> |
<script type="text/javascript" src="http://www.tela-botanica.org/commun/google/map/3/markerclusterer/2.0.1/markerclusterer-2.0.1.pack.js"></script> |
33,10 → 33,9 |
<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/fancybox/1.3.4/jquery.fancybox-1.3.4.pack.js"></script> |
<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/pagination/2.2/jquery.pagination.js"></script> |
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.templates/beta1/jquery.tmpl.min.js"></script> |
<script type="text/javascript" src="<?=$url_base?>modules/carto/squelettes/scripts/smartinfowindow.js"></script> |
<!-- Javascript : données --> |
<script src="<?=$url_json?>" type="text/javascript"></script> |
<script src="<?=$url_stations?>" type="text/javascript"></script> |
<!-- Javascript : appli carto --> |
<script type="text/javascript"> |
43,34 → 42,24 |
//<![CDATA[ |
var urlsLimitesCommunales = <?=$url_limites_communales?>; |
var nt = '<?=$num_taxon?>'; |
var plantesNbre = <?=count($taxons)?>; |
var urlStation = '<?=$url_base?>carto'+'?'+ |
'carte=station'+'&'+ |
'utilisateur=<?=$utilisateur?>'+'&'+ |
'projet=<?=$projet?>'+'&'+ |
'num_taxon='+nt+'&'+ |
'dept=<?=$dept?>'+'&'+ |
'commune=<?=$commune?>'; |
var urlObs = '<?=$url_base?>carto'+'?'+ |
'carte=observations'+'&'+ |
'utilisateur=<?=$utilisateur?>'+'&'+ |
'projet=<?=$projet?>'+'&'+ |
'num_taxon='+nt+'&'+ |
'dept=<?=$dept?>'+'&'+ |
'commune=<?=$commune?>'; |
var urlObsCarte = '<?=$url_cel_carto?>/carte-defaut-json'+'?'+ |
'utilisateur=<?=$utilisateur?>'+ |
var filtreCommun = |
'&taxon=<?=$taxon?>'+ |
'&utilisateur=<?=$utilisateur?>'+ |
'&projet=<?=$projet?>'+ |
'&num_taxon='+nt+ |
'&tag=<?=$tag?>'+ |
'&date=<?=$date?>'+ |
'&dept=<?=$dept?>'+ |
'&commune=<?=$commune?>'; |
var urlObsStation = '<?=$url_cel_carto?>/{action}'+'?'+ |
var stationsUrl = '<?=$url_cel_carto?>/stations'+'?'+ |
'num_taxon='+nt+ |
filtreCommun; |
var taxonsUrl = '<?=$url_cel_carto?>/taxons'+'?'+ |
'num_taxon='+nt+ |
filtreCommun; |
var observationsUrl = '<?=$url_cel_carto?>/observations'+'?'+ |
'station={stationId}'+ |
'&utilisateur=<?=$utilisateur?>'+ |
'&projet=<?=$projet?>'+ |
'&num_taxon='+nt+ |
'&dept=<?=$dept?>'+ |
'&commune=<?=$commune?>'; |
'&num_taxon={nt}'+ |
filtreCommun; |
//]]> |
</script> |
<script type="text/javascript" src="<?=$url_base?>modules/carto/squelettes/scripts/carto.js"></script> |
84,12 → 73,14 |
<body> |
<div id="zone-titre"> |
<h1 id="carte-titre"> |
<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 ?> |
<span id="logo"> |
<a href="http://www.tela-botanica.org/site:accueil" title="Aller à l'accueil de Tela Botanica"> |
<img src="http://www.tela-botanica.org/sites/commun/generique/images/favicones/tela_botanica.png" alt="TB" /> |
</a> |
</span> |
<span id="obs-nbre"> </span> observations |
<span class="plante-titre">de <span class="plantes-nbre"> </span> plantes</span> sur |
<span id="commune-nbre"> </span> communes |
- <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"> |
112,15 → 103,7 |
</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']?>"> |
<span class="taxon" title="<?=$taxon['famille']?>"> |
<?=$taxon['nom']?> <span class="nt" title="Numéro taxonomique"><?=$taxon['nt']?></span> |
</span> |
</li> |
<? endforeach; ?> |
</ol> |
<!-- Insertion des lignes à partir du squelette tpl-taxons-liste --> |
</div> |
</div> |
</div> |
162,7 → 145,7 |
</tr> |
</thead> |
<tbody id="obs-tableau-lignes" class="obs-conteneur"> |
<!-- Insertion des lignes à partir du squelette tpl-obs-liste-tableau --> |
<!-- Insertion des lignes à partir du squelette tpl-obs-tableau --> |
</tbody> |
</table> |
</div> |
181,28 → 164,31 |
</div> |
</script> |
<!-- Squelette du contenu d'une info-bulle observation --> |
<!-- Squelette du contenu du tableau des observation --> |
<script id="tpl-obs-tableau" type="text/x-jquery-tmpl"> |
<tr> |
<td> |
<span class="nom-sci"> |
{{if nn != 0}} |
<a href="http://www.tela-botanica.org/nn${nn}" onclick="window.open(this.href); arreter(event); return false; ">${nomSci}</a> |
<a href="http://www.tela-botanica.org/nn${nn}" |
onclick="window.open(this.href); arreter(event); return false; "> |
${nomSci} |
</a> |
{{else}} |
${nomSci} |
{{/if}} |
</span> |
</td> |
<td> ${date}</td> |
<td> ${lieu}</td> |
<td> ${observateur}</td> |
<td>{{if date}}${date}{{else}} {{/if}}</td> |
<td>{{if lieu}}${lieu}{{else}} {{/if}}</td> |
<td>{{if observateur}}${observateur}{{else}} {{/if}}</td> |
</tr> |
</script> |
<!-- Squelette du contenu d'une info-bulle observation --> |
<!-- Squelette du contenu de la liste des observations --> |
<script id="tpl-obs-liste" type="text/x-jquery-tmpl"> |
<li> |
<div id="cel-obs-${id}"> |
<div id="cel-obs-${idObs}"> |
{{if images}} |
{{each(index, img) images}} |
<div{{if index == 0}} class="cel-img-principale" {{else}} class="cel-img-secondaire"{{/if}}> |
209,10 → 195,10 |
<a class="cel-img" |
href="${img.normale}" |
title="${nomSci} {{if nn}} [${nn}] {{/if}} par ${observateur} - Publiée le ${datePubli} - GUID : ${img.guid}" |
rel="cel-obs-${id}"> |
<img src="${img.miniature}" alt="Image #${img.id} de l'osbervation #${nn}" /> |
rel="cel-obs-${idObs}"> |
<img src="${img.miniature}" alt="Image #${img.idImg} de l'osbervation #${nn}" /> |
</a> |
<p id="cel-info-${img.id}" class="cel-infos"> |
<p id="cel-info-${img.idImg}" class="cel-infos"> |
<a class="cel-img-titre" href="${urlEflore}" |
onclick="window.open(this.href);return false;" |
title="Cliquez pour accéder à la fiche eFlore"> |
246,7 → 232,20 |
</div> |
</li> |
</script> |
<!-- Squelette de la liste des taxons --> |
<script id="tpl-taxons-liste" type="text/x-jquery-tmpl"> |
<ol id="taxons"> |
{{each(index, taxon) taxons}} |
<li id="taxon-${taxon.nt}"> |
<span class="taxon" title="Numéro taxonomique : ${taxon.nt} - Famille : ${taxon.famille}"> |
${taxon.nom} <span class="nt" title="Numéro taxonomique">${taxon.nt}</span> |
</span> |
</li> |
{{/each}} |
</ol> |
</script> |
<!-- Stats : Google Analytics --> |
<script type="text/javascript"> |
//<![CDATA[ |
/trunk/widget/modules/carto/squelettes/scripts/carto.js |
---|
35,6 → 35,7 |
var station = {'commune':'', 'obsNbre':0}; |
var obsStation = new Array(); |
var obsPage = new Array(); |
var taxonsCarte = new Array(); |
/*+--------------------------------------------------------------------------------------------------------+*/ |
// INITIALISATION DU CODE |
59,11 → 60,9 |
function afficherStats() { |
// Ajout du nombre de communes où des observations ont eu lieu |
$('#commune-nbre').append(obs.stats.communes.formaterNombre()); |
$('#commune-nbre').text(stations.stats.communes.formaterNombre()); |
// Ajout du nombre d'observations |
$('#obs-nbre').append(obs.stats.observations.formaterNombre()); |
// Ajout du nombre de plantes |
$('.plantes-nbre').append(plantesNbre.formaterNombre()); |
$('#obs-nbre').text(stations.stats.observations.formaterNombre()); |
} |
/*+--------------------------------------------------------------------------------------------------------+*/ |
98,14 → 97,14 |
function rafraichirCarte() { |
var points = []; |
var bounds = new google.maps.LatLngBounds(); |
for (var i = 0; i < obs.stats.communes; ++i) { |
var maLatLng = new google.maps.LatLng(obs.points[i].coord_x, obs.points[i].coord_y); |
for (var i = 0; i < stations.stats.communes; ++i) { |
var maLatLng = new google.maps.LatLng(stations.points[i].coord_x, stations.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 |
stationId: stations.points[i].id |
}); |
bounds.extend(maLatLng); |
121,7 → 120,7 |
map.panTo(centreSudLatLng); |
afficherInfoBulle(); |
lancerChargementObs(); |
chargerObs(0, 0); |
}); |
points.push(point); |
170,47 → 169,27 |
$('#chargement').remove(); |
} |
function lancerChargementObs() { |
var urlObsNbre = urlObsStation; |
urlObsNbre = urlObsNbre.replace(/\{action\}/g, 'observations-nombre'); |
urlObsNbre = urlObsNbre.replace(/\{stationId\}/g, pointClique.stationId); |
console.log("Lancement recup nombre"); |
$.getJSON(urlObsNbre, function(infos){ |
console.log("Lancement charger obs"); |
chargerObs(0, infos.obsNbre); |
station = infos; |
actualiserPagineur(); |
creerTitreInfoBulle(); |
}); |
} |
function actualiserPagineur() { |
pagineur.stationId = pointClique.stationId; |
pagineur.total = station.obsNbre; |
console.log(pagineur.total); |
if (pagineur.total > 4) { |
pagineur.format = 'tableau'; |
} else { |
pagineur.format = 'liste'; |
} |
} |
function chargerObs(depart, total) { |
if (depart < total) { |
if (depart == 0 || depart < total) { |
var limite = 300; |
if (depart == 0) { |
obsStation = new Array(); |
} |
console.log("Chargement de "+depart+" à "+(depart+limite)); |
var urlObs = urlObsStation+'&start={start}&limit='+limite; |
urlObs = urlObs.replace(/\{action\}/g, 'observations'); |
var urlObs = observationsUrl+'&start={start}&limit='+limite; |
urlObs = urlObs.replace(/\{stationId\}/g, pointClique.stationId); |
urlObs = urlObs.replace(/\{nt\}/g, nt); |
urlObs = urlObs.replace(/\{start\}/g, depart); |
$.getJSON(urlObs, function(observations){ |
obsStation = obsStation.concat(observations.observations); |
if (depart == 0) { |
actualiserInfosStation(observations); |
actualiserPagineur(); |
creerTitreInfoBulle(); |
} |
console.log("Chargement ok"); |
chargerObs(depart+limite, total); |
chargerObs(depart+limite, station.obsNbre); |
}); |
} else { |
if (pagineur.limite < total) { |
217,11 → 196,27 |
afficherPagination(); |
} else { |
surClicPagePagination(0, null); |
selectionnerOnglet("#obs-vue-"+pagineur.format); |
} |
} |
} |
function actualiserInfosStation(infos) { |
station.commune = infos.commune; |
station.obsNbre = infos.total; |
} |
function actualiserPagineur() { |
pagineur.stationId = pointClique.stationId; |
pagineur.total = station.obsNbre; |
console.log("Total pagineur: "+pagineur.total); |
if (pagineur.total > 4) { |
pagineur.format = 'tableau'; |
} else { |
pagineur.format = 'liste'; |
} |
} |
function afficherPagination(observations) { |
$(".navigation").pagination(pagineur.total, { |
items_per_page:pagineur.limite, |
286,6 → 281,10 |
$tabs.tabs('select', "#obs-vue-"+pagineur.format); |
} |
function selectionnerOnglet(onglet) { |
$('#obs').tabs('select', onglet); |
} |
function afficherTextStationId() { |
$('#obs-station-id').text(pointClique.stationId); |
} |
377,10 → 376,45 |
if (nt == '*') { |
$('#pl-ouverture').bind('click', afficherPanneauLateral); |
$('#pl-fermeture').bind('click', cacherPanneauLateral); |
$('.taxon').live('click', filtrerParTaxon); |
} |
chargerTaxons(0, 0); |
} |
function chargerTaxons(depart, total) { |
if (depart == 0 || depart < total) { |
var limite = 7000; |
console.log("Chargement des taxons de "+depart+" à "+(depart+limite)); |
var urlTax = taxonsUrl+'&start={start}&limit='+limite; |
urlTax = urlTax.replace(/\{start\}/g, depart); |
$.getJSON(urlTax, function(infos) { |
taxonsCarte = taxonsCarte.concat(infos.taxons); |
console.log("Nbre taxons :"+taxonsCarte.length); |
chargerTaxons(depart+limite, infos.total); |
}); |
} else { |
if (nt == '*') { |
afficherTaxons(); |
} else { |
afficherNomPlante(); |
} |
} |
} |
function afficherTaxons() { |
// Ajout du nombre de plantes au titre |
$('.plantes-nbre').text(taxonsCarte.length.formaterNombre()); |
$("#tpl-taxons-liste").tmpl({'taxons':taxonsCarte}).appendTo("#pl-corps"); |
$('.taxon').live('click', filtrerParTaxon); |
} |
function afficherNomPlante() { |
if (nt != '*') { |
var taxon = taxonsCarte[0]; |
$('.plante-titre').text('pour '+taxon.nom); |
} |
} |
function afficherPanneauLateral() { |
$('#panneau-lateral').width(300); |
$('#pl-contenu').css('display', 'block'); |
413,12 → 447,12 |
nt = '*'; |
executerMarkerClusterer(pointsOrigine, boundsOrigine); |
} else { |
var url = urlObsCarte+'&'+ |
var url = stationsUrl+'&'+ |
'num_taxon='+ntAFiltrer+'&'+ |
'formatRetour=jsonp'+'&'+ |
'formatRetour=jsonP'+'&'+ |
'callback=?'; |
$.getJSON(url, function (observations) { |
obs = observations; |
$.getJSON(url, function (stationsFiltrees) { |
stations = stationsFiltrees; |
nt = ntAFiltrer; |
$('#taxon-'+nt).addClass('taxon-actif'); |
rafraichirCarte(); |
/trunk/widget/modules/carto/squelettes/css/carto.css |
---|
52,6 → 52,7 |
table { |
border:1px solid gray; |
border-collapse:collapse; |
width:100%; |
} |
table thead, table tfoot, table tbody { |
background-color:Gainsboro; |
151,7 → 152,7 |
width:100%; |
height:35px; |
overflow:hidden; |
background:url(http://www.tela-botanica.org/sites/commun/generique/images/favicones/tela_botanica.png) no-repeat 8px 8px #4A4B4C; |
background-color:#4A4B4C; |
} |
#zone-info { |
position:absolute; |
168,7 → 169,7 |
} |
#carte-titre { |
display:inline-block; |
margin:0 0 0 24px; |
margin:0; |
padding:0.2em; |
color:#CCCCCC; |
} |
215,6 → 216,7 |
#pl-ouverture { |
left:0; |
background:url(../images/ouverture.png) no-repeat top left #4A4B4C; |
height:100%; |
} |
#pl-fermeture { |
display:none; |
339,9 → 341,10 |
float:right; |
} |
.cel-legende p{ |
color:black; |
font-size:12px; |
margin:5px 0; |
color: black; |
font-size: 12px; |
line-height: 18px; |
margin: 0; |
} |
.cel-legende a, .cel-legende a:active, .cel-legende a:visited { |
border-bottom:1px dotted gainsboro; |