/trunk/widget/modules/carto/squelettes/obs_liste.tpl.html |
---|
1,30 → 1,31 |
<div class="onglets"> |
<ul> |
<li class="inactif"><a class="onglet" onclick="chargerFormatObs('<?=$station_id?>', 'tableau');return false;" href="#">Tableau</a></li> |
<li class="actif"><span class="onglet">Liste</span></li> |
</ul> |
</div> |
<div id="observations"> |
<h2><?=count($observations)?> observations pour <?=(isset($commune) ? $commune : '?')?></h2> |
<ol> |
<? foreach ($observations as $obs) : ?> |
<li> |
<dl> |
<dt class="champ_nom_latin">Nom</dt> |
<dd> |
<? if (isset($obs['nn'])) : ?> |
<a href="http://www.tela-botanica.org/nn<?=$obs['nn']?>" onclick="window.open(this.href); arreter(event); return false; "><?=$obs['nom']?></a> |
<? else : ?> |
<?=$obs['nom']?> |
<? endif; ?> |
</dd> |
<dt>Lieu</dt><dd><?=$obs['lieu']?></dd> |
<dt>Publié par</dt><dd><?=$obs['observateur']?></dd> |
<dt>Le</dt><dd><?=$obs['date']?></dd> |
</dl> |
</li> |
<? endforeach; ?> |
</ol> |
<? include(dirname(__FILE__).'/obs_msg_info.tpl.html') ?> |
</div> |
<div class="info-bulle-contenu"> |
<div class="onglets"> |
<ul> |
<li class="inactif"><a class="onglet" onclick="chargerFormatObs('<?=$station_id?>', 'tableau');return false;" href="#">Tableau</a></li> |
<li class="actif"><span class="onglet">Liste</span></li> |
</ul> |
</div> |
<div id="observations"> |
<h2><?=count($observations)?> observations pour <?=(isset($commune) ? $commune : '?')?></h2> |
<ol> |
<? foreach ($observations as $obs) : ?> |
<li> |
<dl> |
<dt class="champ_nom_latin">Nom</dt> |
<dd> |
<? if (isset($obs['nn'])) : ?> |
<a href="http://www.tela-botanica.org/nn<?=$obs['nn']?>" onclick="window.open(this.href); arreter(event); return false; "><?=$obs['nom']?></a> |
<? else : ?> |
<?=$obs['nom']?> |
<? endif; ?> |
</dd> |
<dt>Lieu</dt><dd><?=$obs['lieu']?></dd> |
<dt>Publié par</dt><dd><?=$obs['observateur']?></dd> |
<dt>Le</dt><dd><?=$obs['date']?></dd> |
</dl> |
</li> |
<? endforeach; ?> |
</ol> |
<? include(dirname(__FILE__).'/obs_msg_info.tpl.html') ?> |
</div> |
</div> |
/trunk/widget/modules/carto/squelettes/carte_defaut.tpl.html |
---|
16,13 → 16,13 |
<!-- 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 --> |
<script type="text/javascript" src="http://maps.google.com/maps/api/js?v=3.2&sensor=false"></script> |
<script type="text/javascript" src="http://maps.google.com/maps/api/js?v=3.3&sensor=true"></script> |
<script type="text/javascript" src="<?=$url_base?>modules/carto/squelettes/markerclusterer_compiled.js"></script> |
<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> |
120,14 → 120,20 |
} |
function afficher() { |
document.getElementById('panneau-lateral').style.display = 'block'; |
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.display = 'none'; |
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'); |
}; |
163,18 → 169,6 |
<? endforeach; ?> |
<? endif; ?> |
// Create the DIV to hold the control and call the HomeControl() |
// constructor passing in this DIV. |
var panneauDiv = document.getElementById('panneau-lateral'); |
panneauDiv.index = 0; |
map.controls[google.maps.ControlPosition.TOP_LEFT].push(panneauDiv); |
var ouverturePanneauDiv = document.getElementById('pl-ouverture'); |
ouverturePanneauDiv.index = 0; |
map.controls[google.maps.ControlPosition.TOP_LEFT].push(ouverturePanneauDiv); |
var ouvertureDiv = document.getElementById('pl-ouverture'); |
google.maps.event.addDomListener(ouvertureDiv, 'click', afficher); |
181,7 → 175,6 |
var fermetureDiv = document.getElementById('pl-fermeture'); |
google.maps.event.addDomListener(fermetureDiv, 'click', cacher); |
cacher(); |
refreshMap(); |
} |
//]]> |
190,6 → 183,18 |
<!-- CSS --> |
<link href="<?=$url_base?>modules/carto/squelettes/css/carto.css" rel="stylesheet" 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]--> |
<!-- Stats : Google Analytics --> |
<script type="text/javascript"> |
//<![CDATA[ |
209,7 → 214,7 |
<body onload="initialize()"> |
<div id="zone-titre"> |
<h1 id="carte-titre"> |
Observations issues des membres de <a href="http://www.tela-botanica.org/" onclick="window.open(this.href); arreter(event); return false;">Tela Botanica</a> |
Communes contenant des observations du <abbr title="Carnet en Ligne">CEL</abbr> de <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;"> |
221,24 → 226,26 |
<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-entete"> |
<h2>Filtre par plante</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 id="pl-contenu"> |
<div id="pl-entete"> |
<h2>Filtre par plante</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 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 id="carte"></div> |
/trunk/widget/modules/carto/squelettes/css/carto.css |
---|
1,9 → 1,13 |
@charset "UTF-8"; |
html, body { |
html { |
overflow:hidden; |
} |
body { |
overflow:hidden; |
padding:0; |
margin:0; |
padding:0; |
height: 100%; |
width:100%; |
height:100%; |
font-family:Arial; |
font-size:12px; |
} |
31,8 → 35,14 |
/*+-----------------------------------------------------------------------------------------------------------------+*/ |
/* Carte */ |
#carte { |
width:100%; |
height:95%; |
padding:0; |
margin:0; |
position:absolute; |
top:35px; |
left:24px; |
right:0; |
bottom:0; |
overflow:auto; |
} |
.bouton { |
background-color:white; |
52,33 → 62,31 |
/*+-----------------------------------------------------------------------------------------------------------------+*/ |
/* Avertissement */ |
#zone-avertissement { |
background-color:rgba(29,30,32,0.8); |
background-color:#4A4B4C !hackCssIe6Et7;/*Hack CSS pour ie6 & ie7 */ |
background-color:#4A4B4C; |
color:#CCC; |
padding:12px; |
text-align:justify; |
line-height:16px; |
} |
#zone-avertissement {/*Hack CSS fonctionne seulement dans ie6, 7 & 8 */ |
background-color:#4A4B4C !hackCssIe6Et7;/*Hack CSS pour ie6 & ie7 */ |
background-color /*\**/:#4A4B4C\9;/*Hack CSS pour ie8 */ |
} |
#zone-avertissement h1{ |
margin:0; |
} |
#zone-avertissement a { |
border-bottom:1px dotted gainsboro; |
} |
/*+-----------------------------------------------------------------------------------------------------------------+*/ |
/* Carte titre */ |
#zone-titre { |
background:url(http://www.tela-botanica.org/sites/commun/generique/images/favicones/tela_botanica.png) no-repeat 8px 8px rgba(29,30,32,0.8); |
padding-left:24px; |
min-height:30px; |
height:5%; |
padding:0; |
margin:0; |
position:absolute; |
top:0; |
left:0; |
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; |
} |
#zone-titre {/*Hack CSS fonctionne seulement dans ie6, 7 & 8 */ |
height:30px !hackCssIe6Et7;/*Hack CSS pour ie6 & ie7 */ |
height /*\**/:30px\9;/*Hack CSS pour ie8 */ |
background:url(http://www.tela-botanica.org/sites/commun/generique/images/favicones/tela_botanica.png) no-repeat 8px 8px #4A4B4C !hackCssIe6Et7;/*Hack CSS pour ie6 & ie7 */ |
background /*\**/:url(http://www.tela-botanica.org/sites/commun/generique/images/favicones/tela_botanica.png) no-repeat 8px 8px #4A4B4C\9;/*Hack CSS pour ie8 */ |
} |
#zone-info { |
position:absolute; |
top:0; |
88,13 → 96,13 |
} |
#zone-info img { |
display:inline; |
padding:8px; |
padding:4px; |
margin:0; |
border:none; |
} |
#carte-titre { |
display:inline-block; |
margin:0; |
margin:0 0 0 24px; |
padding:0.2em; |
color:#CCCCCC; |
} |
104,56 → 112,49 |
} |
/*+-----------------------------------------------------------------------------------------------------------------+*/ |
/* Panneau latéral */ |
#panneau-lateral { |
z-index:10; |
width:300px; |
height:100%; |
padding:0; |
margin:0; |
position:absolute; |
top:35px; |
left:0; |
bottom:0; |
width:24px; |
overflow:hidden; |
background-color:#4A4B4C; |
border-right:1px solid grey; |
} |
#pl-contenu { |
display:none; |
background-color:rgba(29,30,32,0.8); |
border-right:1px solid grey; |
box-shadow:2px 2px 6px #979797;-webkit-box-shadow:2px 2px 6px #979797;-moz-box-shadow:2px 2px 6px #979797; |
} |
#panneau-lateral {/*Hack CSS fonctionne seulement dans ie6, 7 & 8 */ |
background-color:#4A4B4C !hackCssIe6Et7;/*Hack CSS pour ie6 & ie7 */ |
background-color /*\**/:#4A4B4C\9;/*Hack CSS pour ie8 */ |
} |
#pl-entete { |
height:10%; |
min-height:75px; |
height:95px; |
} |
#pl-corps { |
position:relative; |
top:25px; |
height:80%; |
position:absolute; |
top:105px; |
bottom:0; |
overflow:auto; |
padding:5px; |
width:290px; |
} |
#pl-ouverture, #pl-fermeture { |
z-index:11; |
position:relative; |
position:absolute; |
top:0; |
background-color:#FFF; |
height:24px; |
width:24px; |
text-align:center; |
cursor:pointer; |
height:16px; |
width:16px; |
} |
#pl-ouverture { |
background:url(../images/ouverture.png) no-repeat top left; |
background-color:rgba(29,30,32,0.8); |
box-shadow:2px 2px 6px #979797;-webkit-box-shadow:2px 2px 6px #979797;-moz-box-shadow:2px 2px 6px #979797; |
height:100%; |
left:0; |
background:url(../images/ouverture.png) no-repeat top left #4A4B4C; |
} |
#pl-ouverture {/*Hack CSS fonctionne seulement dans ie6, 7 & 8 */ |
background-color:#4A4B4C !hackCssIe6Et7;/*Hack CSS pour ie6 & ie7 */ |
background-color /*\**/:#4A4B4C\9;/*Hack CSS pour ie8 */ |
} |
#pl-fermeture { |
float:right; |
height:6%; |
background:url(../images/fermeture.png) no-repeat top right; |
display:none; |
left:276px; |
background:url(../images/fermeture.png) no-repeat top right #4A4B4C; |
} |
#pl-ouverture span, #pl-fermeture span{ |
display:none; |
170,8 → 171,7 |
color:#56B80E;} |
/*+-----------------------------------------------------------------------------------------------------------------+*/ |
/* Pop-up observations */ |
#contenu { |
overflow:none; |
.info-bulle-contenu { |
margin:0; |
padding:0; |
} |
195,7 → 195,7 |
} |
#observations a { |
color:#333; |
border-bottom:1px dotted #EEE; |
border-bottom:1px dotted gainsboro; |
} |
#observations a:hover { |
color:#56B80E; |
204,7 → 204,8 |
/*+-----------------------------------------------------------------------------------------------------------------+*/ |
/* Onglets */ |
.onglets { |
position:relative; |
position:absolute; |
top:0; |
float:left; |
height:22px; |
padding:0; |
/trunk/widget/modules/carto/squelettes/avertissement.tpl.html |
---|
42,6 → 42,17 |
<body> |
<div id="zone-avertissement"> |
<h1>Avertissements & informations</h1> |
<h2>C'est quoi ces chiffres sur la carte ?</h2> |
<p> |
Afin de ne pas divulguer la localisation des stations d'espèces rares ou protégées, l'ensemble des observations |
a été regroupé par commune.<br /> |
Ainsi les nombres apparaissant sur la carte représentent le nombre de communes où des observations ont été |
réalisées.<br /> |
Ce nombre varie en fonction du niveau de zoom auquel vous vous trouvez, jusqu'à faire apparaître l'icône |
<img src="http://chart.apis.google.com/chart?cht=mm&chs=24x32&chco=FFFFFF,008CFF,000000&ext=.png" alt="Icône de regroupement des observations" />. |
Il indique le centre d'une commune et permet en cliquant dessus d'afficher l'ensemble des observations que l'on |
peut y trouver. |
</p> |
<h2>Avertissements</h2> |
<p> |
Les observations affichées sur cette carte proviennent des saisies des membres du réseau Tela Botanica réalisées à l'aide |
49,12 → 60,9 |
Bien que la plupart des botanistes cherchent à déterminer avec un maximum de rigueur les espèces qu'ils observent, il arrive que des erreurs soient faites.<br /> |
Il est donc important de garder un esprit critique vis à vis des observations diffusées sur cette carte.<br /> |
Nous souhaitons prochainement ajouter à cette application cartographique un moyen de contacter les auteurs des observations. |
Cette fonctionnalité permetra de faciliter la correction d'eventuelles erreurs.<br /> |
Cette fonctionnalité permettra de faciliter la correction d'eventuelles erreurs.<br /> |
Pour l'instant, si vous constatez des problèmes, veuillez contacter : <a href="mailto:eflore_remarques@tela-botanica.org">eflore_remarques@tela-botanica.org</a>. |
</p> |
<p> |
Afin, de ne pas divulguer la localisation des stations d'espèces rares ou protégées, l'ensemble des observations ont été regroupées par commune. |
</p> |
<h2>Le <a href="http://www.tela-botanica.org/appli:cel" onclick="window.open(this.href); return false;">Carnet en Ligne (CEL)</a>, c'est quoi ?</h2> |
<h3>Un outil pour gérer mes relevés de terrain</h3> |
<p> |
68,7 → 76,7 |
<li>Un module cartographique vous permet de géolocaliser vos observations grâce aux coordonnées ou bien par pointage sur une carte (en France métropolitaine).</li> |
<li>Un module image vous permet d’ajouter des images et des les associer à vos observations.</li> |
<li>Un module projet vous permet de créer des projets et d’y associer des observations.</li> |
<li>Un module export au format tableur pour traiter ses données.</li> |
<li>Un module import/export au format tableur pour traiter ses données.</li> |
</ul> |
<h3>Partage des données</h3> |
<p> |
/trunk/widget/modules/carto/squelettes/obs_tableau.tpl.html |
---|
1,33 → 1,35 |
<div class="onglets"> |
<ul> |
<li class="actif"><span class="onglet">Tableau</span></li> |
<li class="inactif"><a class="onglet" onclick="chargerFormatObs('<?=$station_id?>', 'liste');return false;" href="#">Liste</a></li> |
</ul> |
</div> |
<div id="observations"> |
<table> |
<caption><h2><?=count($observations)?> observations pour <?=(isset($commune) ? $commune : '?')?></h2></caption> |
<thead> |
<tr> |
<th>Nom</th><th>Date</th><th>Lieu</th><th>Observateur</th> |
</tr> |
</thead> |
<tbody> |
<? foreach ($observations as $obs) : ?> |
<div class="info-bulle-contenu"> |
<div class="onglets"> |
<ul> |
<li class="actif"><span class="onglet">Tableau</span></li> |
<li class="inactif"><a class="onglet" onclick="chargerFormatObs('<?=$station_id?>', 'liste');return false;" href="#">Liste</a></li> |
</ul> |
</div> |
<div id="observations"> |
<table> |
<caption><h2><?=count($observations)?> observations pour <?=(isset($commune) ? $commune : '?')?></h2></caption> |
<thead> |
<tr> |
<td> |
<? if (isset($obs['nn'])) : ?> |
<a href="http://www.tela-botanica.org/nn<?=$obs['nn']?>" onclick="window.open(this.href); arreter(event); return false; "><?=$obs['nom']?></a> |
<? else : ?> |
<?=$obs['nom']?> |
<? endif; ?> |
</td> |
<td><?=$obs['date']?></td> |
<td><?=$obs['lieu']?></td> |
<td><?=$obs['observateur']?></td> |
<th>Nom</th><th>Date</th><th>Lieu</th><th>Observateur</th> |
</tr> |
<? endforeach; ?> |
</tbody> |
</table> |
<? include(dirname(__FILE__).'/obs_msg_info.tpl.html') ?> |
</thead> |
<tbody> |
<? foreach ($observations as $obs) : ?> |
<tr> |
<td> |
<? if (isset($obs['nn'])) : ?> |
<a href="http://www.tela-botanica.org/nn<?=$obs['nn']?>" onclick="window.open(this.href); arreter(event); return false; "><?=$obs['nom']?></a> |
<? else : ?> |
<?=$obs['nom']?> |
<? endif; ?> |
</td> |
<td><?=$obs['date']?></td> |
<td><?=$obs['lieu']?></td> |
<td><?=$obs['observateur']?></td> |
</tr> |
<? endforeach; ?> |
</tbody> |
</table> |
<? include(dirname(__FILE__).'/obs_msg_info.tpl.html') ?> |
</div> |
</div> |