Subversion Repositories eFlore/Applications.moissonnage

Rev

Rev 28 | Go to most recent revision | Details | Last modification | View Log | RSS feed

Rev Author Line No. Line
10 delphine 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">
3
	<head>
4
		<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
5
		<meta http-equiv="Content-style-type" content="text/css" />
6
		<meta http-equiv="Content-script-type" content="text/javascript" />
7
		<meta http-equiv="Content-language" content="fr" />
8
 
9
		<title>Carte des observations E-flore : Nouvelle version</title>
10
 
11
		<link rel="icon" type="image/png" href="http://www.tela-botanica.org/sites/commun/generique/images/favicones/tela_botanica.png" />
12
		<link rel="shortcut icon" type="image/x-icon" href="http://www.tela-botanica.org/sites/commun/generique/images/favicones/tela_botanica.ico" />
13
 
14
		<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.5/leaflet.css" />
15
		<link rel="stylesheet" href="<?=$url_base?>modules/carto/squelettes/css/L.Control.Zoomslider.css" />
16
		<!--[if lte IE 8]>
17
			<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.5/leaflet.ie.css" />
18
			<link rel="stylesheet" href="<?=$url_base?>modules/carto/squelettes/css/L.Control.Zoomslider.ie.css" />
19
		<![endif]-->
20
		<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" />
21
		<link rel="stylesheet" href="http://www.tela-botanica.org/commun/jquery/jquery-ui/1.8.15/css/smoothness/jquery-ui-1.8.15.custom.css" type="text/css" media="screen" />
22
		<link href="<?=$url_base?>modules/carto/squelettes/css/carto.css" rel="stylesheet" type="text/css" media="screen" />
23
		<style type="text/css">
24
		<!--
25
			#body {margin: 0; padding: 2px;}
26
			#map { margin: 1px solid black;}
27
			.info { padding: 6px 8px; font-size: 13px; background: white; width: 100px;
28
    			box-shadow: 0 0 15px black;  border-radius: 5px; line-height: 18px; }
29
    		.info h4 { font-size: 15px; margin: 0 0 5px; color: #555; }
30
    		.legend { padding : 3px; color: #999; }
31
			.legend i { width: 18px; height: 18px; float: left; margin-right: 8px; opacity: 0.7; }
32
			.nombre-sites { font-size: 13px; font-family: sans-serif; text-align: center;
33
				color : black; }
34
		-->
35
		</style>
36
 
37
		<!-- Javascript : bibliothèques -->
38
		<script src="http://cdn.leafletjs.com/leaflet-0.5/leaflet.js"></script>
39
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/1.6.2/jquery-1.6.2.min.js"></script>
40
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/tablesorter/2.0.5/jquery.tablesorter.min.js"></script>
41
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/jquery-ui/1.8.15/js/jquery-ui-1.8.15.custom.min.js"></script>
42
		<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.templates/beta1/jquery.tmpl.min.js"></script>
43
				<script type="text/javascript">
44
		//<![CDATA[
45
			var source = '<?= $source ?>',
46
				num_taxon = '<?= $num_taxon ?>',
47
				dept = '<?= $departement ?>',
48
				utilisateur = '<?= $utilisateur ?>',
49
				referentiel = '<?= $referentiel ?>',
50
				urlBase = '<?= $url_serivce_carto ?>/moissonnage/',
51
				urlsLimitesCommunales = <?= $url_limites_communales ?>,
52
				communeImageUrl = '<?= $communeImageUrl ?>',
53
				pointImageUrl = '<?= $pointImageUrl ?>',
54
				liensVersSources = '<?= $liensVersSources ?>'.split(','),
55
				titreLegende = '<?= $titreLegende ?>',
56
				sources = '<?= $sourcesDispo ?>'.split(','),
57
				nomSources = '<?= $nomSourcesDispo ?>'.split(',');
58
		//]]>
59
		</script>
60
		<script src="http://maps.google.com/maps/api/js?v=3.5&sensor=true&language=fr&region=FR" type="text/javascript"></script>
61
		<script src="<?=$url_base?>modules/carto/squelettes/scripts/layer/vector/KML.js" type="text/javascript"></script>
62
		<script src="<?=$url_base?>modules/carto/squelettes/scripts/carto.js"></script>
63
		<script src="<?=$url_base?>modules/carto/squelettes/scripts/L.Control.Zoomslider.js" ></script>
64
	</head>
65
 
66
	<body>
67
		<div id="zone-chargement"></div>
68
		<div id="map"></div>
69
 
70
		<!-- +-------------------------------------------------------------------------------------------+ -->
71
		<!-- Blocs chargés à la demande : par défaut avec un style display à none -->
72
 
73
		<!-- Squelette du message de chargement des observations -->
74
		<script id="tpl-chargement-stations" type="text/x-jquery-tmpl">
75
			<div id="chargement-stations">
76
				<img src="<?=$url_base?>modules/carto/squelettes/images/chargement.gif" alt="Chargement en cours..." />
77
				<p>Chargement des stations en cours...</p>
78
			</div>
79
		</script>
80
 
81
		<!-- Squelette du message de chargement des observations -->
82
		<script id="tpl-chargement-observations" type="text/x-jquery-tmpl">
83
			<div id="chargement-observations">
84
				<img src="<?=$url_base?>modules/carto/squelettes/images/chargement.gif" alt="Chargement en cours..." />
85
				<p>Chargement des observations en cours...</p>
86
			</div>
87
		</script>
88
 
89
		<!-- Squelette du contenu d'une info-bulle observation -->
90
		<script id="tpl-obs" type="text/x-jquery-tmpl">
91
			<div id="info-bulle" style="width:{largeur}px;">
92
				<div id="obs">
93
					<h2 id="obs-station-titre">Station</h2>
94
					<div class="navigation">&nbsp;</div>
95
					<div>
96
						<ul>
97
							<li><a href="#obs-vue-tableau">Tableau</a></li>
98
							<li><a href="#obs-vue-liste">Liste</a></li>
99
						</ul>
100
					</div>
101
					<div id="observations">
102
						<div id="obs-vue-tableau" style="display:none;">
103
							<table id="obs-tableau">
104
								<thead>
105
									<tr>
106
										<th title="Nom scientifique défini par l'utilisateur.">Nom</th>
107
										<th title="Date de l'observation">Date</th>
108
										<th title="Lieu d'observation">Lieu</th>
109
										<th title="Auteur de l'observation">Observateur</th>
110
									</tr>
111
								</thead>
112
								<tbody id="obs-tableau-lignes" class="obs-conteneur">
113
									<!-- Insertion des lignes à partir du squelette tpl-obs-tableau -->
114
								</tbody>
115
							</table>
116
						</div>
117
						<div id="obs-vue-liste" style="display:none;">
118
							<ol id="obs-liste-lignes" class="obs-conteneur">
119
								<!-- Insertion des lignes à partir du squelette tpl-obs-liste -->
120
							</ol>
121
						</div>
122
					</div>
123
					<div id="obs-pieds-page">
124
						<p>Id : <span id="obs-station-id">&nbsp;</span></p>
125
					</div>
126
					<div class="navigation">&nbsp;</div>
127
				</div>
128
			</div>
129
		</script>
130
 
131
		<!-- Squelette du contenu du tableau des observation -->
132
		<script id="tpl-obs-tableau" type="text/x-jquery-tmpl">
133
			<tr class="cel-obs-${idObs}">
134
				<td>
135
					<span class="nom-sci">&nbsp;
136
					{{if nn != 0}}
137
						<a href="http://www.tela-botanica.org/nn${nn}"
138
							target="_blank">
139
							${nomSci}
140
						</a>
141
					{{else}}
142
						${nomSci}
143
					{{/if}}
144
					</span>
145
				</td>
146
				<td class="date">{{if date}}${date}{{else}}&nbsp;{{/if}}</td>
147
				<td class="lieu">{{if lieu}}${lieu}{{else}}&nbsp;{{/if}}</td>
148
				<td>
149
				{{if observateur}}
150
					{{if observateurId}}
151
						<a class="contact obs-${idObs} contributeur-${observateurId}"
152
						href="#form-contact"
153
						title="Contactez ce contributeur">
154
							${observateur}
155
						</a>
156
					{{else}}
157
						${observateur}
158
					{{/if}}
159
				{{else}}
160
					&nbsp;
161
				{{/if}}
162
				</td>
163
			</tr>
164
		</script>
165
 
166
		<!-- Squelette du contenu de la liste des observations -->
167
		<script id="tpl-obs-liste" type="text/x-jquery-tmpl">
168
			<li>
169
				<div class="cel-obs-${idObs}">
170
					{{if images}}
171
					{{each(index, img) images}}
172
					<div{{if index == 0}} class="cel-img-principale" {{else}} class="cel-img-secondaire"{{/if}}>
173
						<a class="cel-img"
174
							href="${img.normale}"
175
							title="${nomSci} {{if nn}} [${nn}] {{/if}} par ${observateur} - Publiée le ${datePubli} - GUID : ${img.guid}"
176
							rel="cel-obs-${idObs}">
177
							<img src="${img.miniature}" alt="Image #${img.idImg} de l'osbervation #${nn}" />
178
						</a>
179
						<p id="cel-info-${img.idImg}" class="cel-infos">
180
							<a class="cel-img-titre" href="${urlEflore}"
181
								onclick="window.open(this.href);return false;"
182
								title="Cliquez pour accéder à la fiche eFlore">
183
								<strong>${nomSci} {{if nn}} [nn${nn}] {{/if}}</strong> par <em>${observateur}</em>
184
							</a>
185
							<br />
186
							<span class="cel-img-date">Publiée le ${datePubli}</span>
187
 						</p>
188
					</div>
189
					{{/each}}
190
					{{/if}}
191
					<dl>
192
						<dt class="champ-nom-sci">Nom</dt>
193
						<dd title="Nom défini par l'utilisateur{{if nn != 0}}. Cliquez pour accéder à la fiche d'eFlore.{{/if}}">
194
							<span class="nom-sci">&nbsp;
195
							{{if nn != 0}}
196
								<a href="http://www.tela-botanica.org/nn${nn}"
197
									target="_blank">
198
									${nomSci}
199
								</a>
200
							{{else}}
201
								${nomSci}
202
							{{/if}}
203
							</span>
204
						</dd>
205
						<dt title="Lieu d'observation">Lieu</dt><dd class="lieu">&nbsp;${lieu}</dd>
206
						<dt title="Date d'observation">Le</dt><dd class="date">&nbsp;${date}</dd>
207
						<dt title="Auteur de l'observation">Publié par</dt>
208
						<dd>
209
						{{if observateur}}
210
							{{if observateurId}}
211
								<a class="contact obs-${idObs} contributeur-${observateurId}"
212
									href="#form-contact"
213
									title="Contactez ce contributeur">
214
									${observateur}
215
								</a>
216
							{{else}}
217
								${observateur}
218
							{{/if}}
219
						{{else}}
220
							&nbsp;
221
						{{/if}}
222
						</dd>
223
					</dl>
224
					<hr class="nettoyage"/>
225
				</div>
226
			</li>
227
		</script>
228
 
229
		<!-- Squelette de la liste des taxons -->
230
		<script id="tpl-taxons-liste" type="text/x-jquery-tmpl">
231
			<ol id="taxons">
232
				{{each(index, taxon) taxons}}
233
					<li id="taxon-${taxon.nt}">
234
						<span class="taxon" title="Numéro taxonomique : ${taxon.nt} - Famille : ${taxon.famille}">
235
							${taxon.nom} <span class="nt" title="Numéro taxonomique">${taxon.nt}</span>
236
						</span>
237
					</li>
238
				{{/each}}
239
			</ol>
240
		</script>
241
	</body>
242
</html>