Subversion Repositories eFlore/Applications.cel

Rev

Rev 1235 | Rev 1240 | Go to most recent revision | Show entire file | Ignore whitespace | Details | Blame | Last modification | View Log | RSS feed

Rev 1235 Rev 1239
Line 30... Line 30...
30 
		<!-- Jquery UI : nécessaire pour le minicalendrier et l'auto-complétion -->
 30 
		<!-- Jquery UI : nécessaire pour le minicalendrier et l'auto-complétion -->
31 
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/jquery-ui/1.8.18/js/jquery-ui-1.8.18.custom.min.js"></script>
 31 
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/jquery-ui/1.8.18/js/jquery-ui-1.8.18.custom.min.js"></script>
32 
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/jquery-ui/1.8.18/js/jquery.ui.datepicker-fr.js"></script>
 32 
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/jquery-ui/1.8.18/js/jquery.ui.datepicker-fr.js"></script>
33 
		<!-- Jquery Plugins -->
 33 
		<!-- Jquery Plugins -->
34 
		<!-- Jquery Validate : nécessaire pour la validation des formulaires -->
 34 
		<!-- Jquery Validate : nécessaire pour la validation des formulaires -->
35 
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/bootstrap/2.0.1/js/validate/1.9.0/jquery.validate.min.js"></script>
 35 
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/bootstrap/2.0.2/js/validate/1.9.0/jquery.validate.min.js"></script>
36 
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/validate/1.9.0/messages_fr.js"></script>
 36 
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/validate/1.9.0/messages_fr.js"></script>
37 
		<!-- Jquery Form :nécessaire pour l'upload des images -->
 37 
		<!-- Jquery Form :nécessaire pour l'upload des images -->
38 
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/form/2.95/jquery.form.min.js"></script>
 38 
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/form/2.95/jquery.form.min.js"></script>
Line 39... Line 39...
39
39
40 
		<!-- Bootstrap -->
 40 
		<!-- Bootstrap -->
Line 41... Line 41...
41 
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/bootstrap/2.0.1/js/bootstrap.min.js"></script>
 41 
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/bootstrap/2.0.2/js/bootstrap.min.js"></script>
42
42
43 
		<!-- Javascript : appli saisie -->
 43 
		<!-- Javascript : appli saisie -->
44 
		<script type="text/javascript">
 44 
		<script type="text/javascript">
Line 63... Line 63...
63 
			var AUTOCOMPLETION_ELEMENTS_NBRE = 20;
 63 
			var AUTOCOMPLETION_ELEMENTS_NBRE = 20;
64 
			// URL du web service permettant l'auto-complétion des noms scientifiques.
 64 
			// URL du web service permettant l'auto-complétion des noms scientifiques.
65 
			var SERVICE_AUTOCOMPLETION_NOM_SCI_URL = "<?=$url_ws_autocompletion_ns?>?"+
 65 
			var SERVICE_AUTOCOMPLETION_NOM_SCI_URL = "<?=$url_ws_autocompletion_ns?>?"+
66 
					"masque={masque}&"+
 66 
					"masque={masque}&"+
67 
					"recherche=etendue&"+
 67 
					"recherche=etendue&"+
68 
					"retour.champs=famille,nom_retenu,num_taxonomique,nom_retenu.id&"+
 68 
					"retour.champs=famille,nom_retenu,nom_retenu_complet,num_taxonomique,nom_retenu.id&"+
69 
					"version.projet="+NOM_SCI_VERSION+"&"+
 69 
					"version.projet="+NOM_SCI_VERSION+"&"+
70 
					"ns.structure=au"+"&"+
 70 
					"ns.structure=au"+"&"+
71 
					"navigation.limite="+AUTOCOMPLETION_ELEMENTS_NBRE;
 71 
					"navigation.limite="+AUTOCOMPLETION_ELEMENTS_NBRE;
72 
			console.log(SERVICE_AUTOCOMPLETION_NOM_SCI_URL);
 72 
			console.log(SERVICE_AUTOCOMPLETION_NOM_SCI_URL);
73 
			// Squelette d'URL du web service d'eFlore fournissant les noms de communes.
 73 
			// Squelette d'URL du web service d'eFlore fournissant les noms de communes.
Line 78... Line 78...
78 
			var SUPPRIMER_ICONE_URL = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/supprimer.png";
 78 
			var SUPPRIMER_ICONE_URL = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/supprimer.png";
79 
			// URL de l'icône du chargement en cours
 79 
			// URL de l'icône du chargement en cours
80 
			var CHARGEMENT_ICONE_URL = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/chargement.gif";
 80 
			var CHARGEMENT_ICONE_URL = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/chargement.gif";
81 
			// URL de l'icône du calendrier
 81 
			// URL de l'icône du calendrier
82 
			var CALENDRIER_ICONE_URL = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/calendrier.png";
 82 
			var CALENDRIER_ICONE_URL = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/calendrier.png";
- 
 
 83 
			// URL de l'icône du calendrier
- 
 
 84 
			var PAS_DE_PHOTO_ICONE_URL = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/pasdephoto.png";
83 
		//]]>
 85 
		//]]>
84 
		</script>
 86 
		</script>
85 
		<script type="text/javascript" src="<?=$url_base?>modules/saisie/squelettes/defaut/js/defaut.js"></script>
 87 
		<script type="text/javascript" src="<?=$url_base?>modules/saisie/squelettes/defaut/js/defaut.js"></script>
Line 86... Line 88...
86
88
87 
		<!-- CSS -->
 89 
		<!-- CSS -->
88 
		<link href="http://www.tela-botanica.org/commun/jquery/jquery-ui/1.8.18/css/smoothness/jquery-ui-1.8.18.custom.css" rel="stylesheet" type="text/css" media="screen" />
 90 
		<link href="http://www.tela-botanica.org/commun/jquery/jquery-ui/1.8.18/css/smoothness/jquery-ui-1.8.18.custom.css" rel="stylesheet" type="text/css" media="screen" />
89 
		<link href="http://www.tela-botanica.org/commun/bootstrap/2.0.1/css/bootstrap.min.css" rel="stylesheet" type="text/css" media="screen" />
 91 
		<link href="http://www.tela-botanica.org/commun/bootstrap/2.0.2/css/bootstrap.min.css" rel="stylesheet" type="text/css" media="screen" />
90 
		<link href="http://www.tela-botanica.org/commun/bootstrap/2.0.1/css/bootstrap-responsive.min.css" rel="stylesheet" type="text/css" media="screen" />
 92 
		<link href="http://www.tela-botanica.org/commun/bootstrap/2.0.2/css/bootstrap-responsive.min.css" rel="stylesheet" type="text/css" media="screen" />
91 
		<link href="<?=$url_base?>modules/saisie/squelettes/defaut/css/<?=isset($_GET['style']) ? $_GET['style'] : 'defaut'?>.css" rel="stylesheet" type="text/css" media="screen" />
 93 
		<link href="<?=$url_base?>modules/saisie/squelettes/defaut/css/<?=isset($_GET['style']) ? $_GET['style'] : 'defaut'?>.css" rel="stylesheet" type="text/css" media="screen" />
Line 92... Line 94...
92 
	</head>
 94 
	</head>
93 
 
 95 
 
Line 98... Line 100...
98 
					<div class="row">
 100 
					<div class="row">
99 
						<img class="span1" src="<?=$url_base?>/modules/saisie/squelettes/defaut/img/logos/tela_botanica.png" alt="Tela Botanica" />
 101 
						<img class="span1" src="<?=$url_base?>/modules/saisie/squelettes/defaut/img/logos/tela_botanica.png" alt="Tela Botanica" />
100 
						<div class="span5">
 102 
						<div class="span5">
101 
							<h1>Outil de saisie simplifiée (CEL)</h1>
 103 
							<h1>Outil de saisie simplifiée (CEL)</h1>
102 
							<p>
 104 
							<p>
103 
								Ce widget de saisie vous permet de partager simplement vos observations avec le réseau Tela Botanica.
 105 
								Ce widget de saisie vous permet de partager simplement vos observations avec le
- 
 
 106 
								<a href="http://www.tela-botanica.org/site:accueil">réseau Tela Botanica</a>.
104 
								Complétez les champs, créez jusqu'à 10 observations (bouton "créer") puis partagez-les (bouton "transmettre").
107 
								Complétez les champs, créez jusqu'à 10 observations (bouton "créer") puis partagez-les (bouton "transmettre").
105 
								Retrouvez ensuite facilement ces observations dans votre
108 
								Retrouvez ensuite facilement ces observations dans votre
106 
								<a href="http://www.tela-botanica.org/appli:cel">Carnet en ligne</a>.
 109 
								<a href="http://www.tela-botanica.org/appli:cel">Carnet en ligne</a>.
107 
							</p>
 110 
							</p>
108 
							<p class="discretion">
 111 
							<p class="discretion">
- 
 
 112 
								Attention : si vous actualisez la page, fermez votre navigateur... vos observations qui
109 
								Attention : si vos observations ne sont pas partagées (bouton "transmettre"),
113 
								ne sont pas partagées (bouton "transmettre") seront perdues.
110 
								elles seront perdues. Nous vous conseillons donc de partager un nombre limité d'observations.
 114 
								Nous vous conseillons donc de créer un nombre limité d'observations et de les transmettre régulièrement.
111 
							</p>
 115 
							</p>
112 
						</div>
 116 
						</div>
113 
					</div>
 117 
					</div>
Line 114... Line 118...
114
118
Line 115... Line 119...
115 
				</div>
 119 
				</div>
116
120
- 
 
 121 
				<div class="span6">
117 
				<div class="span6">
 122 
					<div class="well">
118 
					<div class="well">
 123 
					<fieldset>
119 
						<h2>Observateur</h2>
 124 
						<h2>Observateur</h2>
120 
						<form id="form-observateur" class="" action="#" autocomplete="on">
 125 
						<form id="form-observateur" action="#" class="" autocomplete="on">
121 
							<div class="row-fluid">
 126 
							<div class="row-fluid">
122 
								<div class="span6">
 127 
								<div class="span6">
123 
									<label for="prenom">Prénom</label>
 128 
									<label for="prenom">Prénom</label>
124 
									<div>
 129 
									<div>
125 
										<input id="prenom" name="prenom" type="text"/>
 130 
										<input id="prenom" name="prenom" class="span3" type="text"/>
126 
									</div>
 131 
									</div>
127 
								</div>
 132 
								</div>
128 
								<div class="span6">
 133 
								<div class="span6">
129 
									<label for="nom">Nom</label>
 134 
									<label for="nom">Nom</label>
130 
									<div>
 135 
									<div>
131 
										<input id="nom" name="nom" type="text"/>
 136 
										<input id="nom" name="nom"  class="span3" type="text"/>
132 
									</div>
 137 
									</div>
133 
								</div>
 138 
								</div>
134 
							</div>
 139 
							</div>
Line 139... Line 144...
139 
										<strong class="obligatoire">*</strong> Courriel
 144 
										<strong class="obligatoire">*</strong> Courriel
140 
									</label>
 145 
									</label>
141 
									<div class="input-prepend">
 146 
									<div class="input-prepend">
142 
										<span class="add-on">
 147 
										<span class="add-on">
143 
											<i class="icon-envelope"></i>
 148 
											<i class="icon-envelope"></i>
144 
										</span>
 - 
 
145 
										<input id="courriel" name="courriel" type="text" value=""/>
 149 
										</span><input id="courriel" class="input-medium" name="courriel" type="text"/>
146 
									</div>
 150 
									</div>
147 
								</div>
 151 
								</div>
148 
								<div class="span6">
 152 
								<div class="span6">
- 
 
 153 
									<label for="courriel_confirmation"
149 
									<label for="courriel_confirmation" title="Veuillez saisir confirmer votre adresse courriel.">
 154 
										title="Veuillez saisir confirmer votre adresse courriel.">
150 
										<strong class="obligatoire">*</strong> Courriel (confirmation)
 155 
										<strong class="obligatoire">*</strong> Courriel (confirmation)
151 
									</label>
 156 
									</label>
152 
									<div class="input-prepend">
 157 
									<div class="input-prepend">
153 
										<span class="add-on">
 158 
										<span class="add-on">
154 
											<i class="icon-envelope"></i>
 159 
											<i class="icon-envelope"></i>
155 
										</span>
 - 
 
156 
										<input id="courriel_confirmation" name="courriel_confirmation" type="text" value=""/>
 160 
										</span><input id="courriel_confirmation" class="input-medium" name="courriel_confirmation" type="text"/>
157 
									</div>
 161 
									</div>
158 
								</div>
 162 
								</div>
159 
							</div>
 163 
							</div>
160 
						</form>
 164 
						</form>
161 
						<div class="row-fluid">
 165 
						<div class="row-fluid">
Line 164... Line 168...
164 
									<span class="icon-question-sign icon-white"></span>
 168 
									<span class="icon-question-sign icon-white"></span>
165 
									<span id="btn-aide-txt" >Activer l'aide</span>
 169 
									<span id="btn-aide-txt" >Activer l'aide</span>
166 
								</button>
 170 
								</button>
167 
							</div>
 171 
							</div>
168 
						</div>
 172 
						</div>
- 
 
 173 
					</fieldset>
169 
					</div>
 174 
					</div>
170 
				</div>
 175 
				</div>
171 
			</div>
 176 
			</div>
172 
			<!-- Messages d'erreur du formulaire-->
 177 
			<!-- Messages d'erreur du formulaire-->
173 
			<div class="row">
 178 
			<div class="row">
Line 180... Line 185...
180 
							La double saisie permet de vérifier l'absence d'erreurs.
 185 
							La double saisie permet de vérifier l'absence d'erreurs.
181 
						</p>
 186 
						</p>
182 
					</div>
 187 
					</div>
183 
				</div>
 188 
				</div>
184 
			</div>
 189 
			</div>
185 
			<div class="row-fluid well">
 190 
			<div class="row-fluid">
186 
				<div class="span6">
 191 
				<div class="span12">
187 
					<div class="well">
 192 
					<div class="well">
188 
						<div class="row-fluid">
 193 
						<div class="row-fluid">
189 
							<div class="span12">
 - 
 
190 
								<h2>Lieu du relevé</h2>
 - 
 
191 
							</div>
 - 
 
192 
						</div>
 - 
 
193 
						<div class="row-fluid">
 - 
 
194 
							<div class="span4">
 194 
							<div class="span6">
195 
								<label for="map_canvas" title="Veuillez localiser l'observation">
 - 
 
196 
									<strong class="obligatoire">*</strong>
- 
 
197 
									Géolocalisation
 - 
 
198 
								</label>
 - 
 
199 
							</div>
 - 
 
200 
							<div class="span8 droite">
 - 
 
201 
								<form id="form-carte-recherche" class="form-search form-horizontal" action="#" >
 - 
 
202 
									<div class="control-group">
 - 
 
203 
										<label for="carte-recherche">Rechercher</label>
 - 
 
204 
										<input id="carte-recherche" class="search-query" type="text" value=""
 - 
 
205 
											rel="tooltip"
 - 
 
206 
											title="Permet de centrer la carte sur le lieu recherché."
 - 
 
207 
											placeholder="Centrer la carte sur un lieu..."/>
 - 
 
208 
									</div>
 195 
								<div>
209 
								</form>
 - 
 
210 
							</div>
 - 
 
211 
						</div>
 - 
 
212 
						<div class="row-fluid">
 196 
									<div class="row-fluid">
213 
							<div class="span12">
 197 
										<div class="span12">
214 
								<div id="map-canvas"></div>
 198 
											<h2>Lieu du relevé</h2>
215 
							</div>
 - 
 
216 
						</div>
 - 
 
217 
						<div class="row-fluid">
 - 
 
218 
							<label for="coordonnees-geo" class="span7">
 - 
 
219 
								<a href="#" class="afficher-coord">Afficher</a>
 - 
 
220 
								<a href="#" class="afficher-coord" style="display:none;">Cacher</a>
 - 
 
221 
								les coordonnées géographiques
 - 
 
222 
								<span id="lat-lon-info" class="info"
- 
 
223 
									rel="tooltip"
- 
 
224 
									title="Système géodésique mondial, révision de 1984 - Coordonnées non projetées">
 - 
 
225 
									(WGS84)
 - 
 
226 
								</span>
 - 
 
227 
							</label>
 - 
 
228 
							<div id="info-commune" class="span5">
 - 
 
229 
					    		<span for="marqueur-commune">Commune : </span>
 - 
 
230 
					    		<span id="marqueur-commune">
 - 
 
231 
					    			<span id="commune-nom" class="commune-info"></span>
 - 
 
232 
					    			(<span id="commune-code-insee" class="commune-info"
- 
 
233 
					    				rel="tooltip"
- 
 
234 
					    				title="Code INSEE de la commune"></span>)
 - 
 
235 
					    		</span>
 - 
 
236 
				    		</div>
 - 
 
237 
						</div>
 - 
 
238 
						<form id="form-station" class="control-group" action="#" enctype="multipart/form-data" autocomplete="on">
 - 
 
239 
							<div id="coordonnees-geo" class="well" style="display:none;">
 - 
 
240 
								<div class="row-fluid form-inline">
 - 
 
241 
									<div id="coord-lat" class="span4">
- 
 
242 
										<label for="latitude">Latitude</label>
 - 
 
243 
										<div>
 - 
 
244 
											<input id="latitude" class="input-mini" name="latitude" type="text" value=""/>
 - 
 
245 
										</div>
 199 
										</div>
246 
									</div>
 200 
									</div>
- 
 
 201 
									<div class="row-fluid">
247 
									<div id="coord-lng" class="span4">
 202 
										<div class="span4">
248 
										<label for="longitude">Longitude</label>
 203 
											<label for="map_canvas" title="Veuillez localiser l'observation">
- 
 
 204 
												<strong class="obligatoire">*</strong>
- 
 
 205 
												Géolocalisation
249 
										<div>
 206 
											</label>
250 
											<input id="longitude" class="input-mini" name="longitude" type="text" value=""/>
 - 
 
251 
										</div>
 207 
										</div>
252 
									</div>
 208 
										<div class="span8 droite">
- 
 
 209 
											<form id="form-carte-recherche" class="form-search form-horizontal" action="#" >
253 
									<div class="span1">
 210 
												<div class="control-group">
254 
										<div>
 211 
													<label for="carte-recherche">Rechercher</label>
255 
											<input id="geolocaliser" type="button" value="Voir sur la carte"
212 
													<input id="carte-recherche" class="search-query" type="text" value=""
256 
												rel="tooltip"
 213 
														rel="tooltip"
257 
												title="Centre la carte sur les coordonnées de latitude et longitude saisies."/>
 214 
														title="Permet de centrer la carte sur le lieu recherché."
- 
 
 215 
														placeholder="Centrer la carte sur un lieu..."/>
- 
 
 216 
												</div>
- 
 
 217 
											</form>
258 
										</div>
 218 
										</div>
259 
									</div>
 219 
									</div>
260 
						    	</div>
 - 
 
261 
							</div>
 - 
 
262 
							<div class="row-fluid">
 220 
									<div class="row-fluid">
263 
								<div class="span4" rel="tooltip" title="Le lieu-dit est la dénomination administrative du lieu que l’on peut trouver sur une carte au 1/25 000, sur le cadastre ou au dire des habitants locaux." >
 - 
 
264 
									<label for="lieudit">
 221 
										<div class="span12">
265 
										Lieu-dit
 - 
 
266 
									</label>
 - 
 
267 
									<div>
 - 
 
268 
										<input type="text" id="lieudit" class="input-medium" name="lieudit"/>
 - 
 
269 
									</div>
 - 
 
270 
								</div>
 - 
 
271 
								<div class="span4" rel="tooltip" title="La station est la dénomination qui caractérise le lieu de la collecte d’un point de vue écologique. Il est recommandéde choisir une station qui soit homogène dans sa compositionfloristique afin de refléter le plus fidèlement possible son identité sous l’angle phytosociologique. Exemple : zone humide située au centre du près. " >
 222 
											<div id="map-canvas"></div>
272 
									<label for="station">
 - 
 
273 
										Station
 - 
 
274 
									</label>
 - 
 
275 
									<div>
 - 
 
276 
										<input type="text" id="station" class="input-medium" name="station"/>
 - 
 
277 
									</div>
 223 
										</div>
278 
								</div>
 - 
 
279 
								<div class="span4" rel="tooltip" title="Le milieu est un terme générique caractérisant la station. On peut se référer pour cela à des codes comme Corine Biotope ou le nom d’une unité phytosociologique. Exemple : prairie humide">
 - 
 
280 
									<label for="milieux">
 - 
 
281 
										Milieu
 - 
 
282 
									</label>
 - 
 
283 
									<div>
 - 
 
284 
										<input type="text" id="milieu" class="input-medium" name="milieu" />
 - 
 
285 
									</div>
 224 
									</div>
- 
 
 225 
									<div class="row-fluid">
- 
 
 226 
										<label for="coordonnees-geo" class="span7">
- 
 
 227 
											<a href="#" class="afficher-coord">Afficher</a>
- 
 
 228 
											<a href="#" class="afficher-coord" style="display:none;">Cacher</a>
- 
 
 229 
											les coordonnées géographiques
- 
 
 230 
											<span id="lat-lon-info" class="info"
- 
 
 231 
												rel="tooltip"
- 
 
 232 
												title="Système géodésique mondial, révision de 1984 - Coordonnées non projetées">
- 
 
 233 
												(WGS84)
- 
 
 234 
											</span>
- 
 
 235 
										</label>
- 
 
 236 
										<div id="info-commune" class="span5">
- 
 
 237 
								    		<span for="marqueur-commune">Commune : </span>
- 
 
 238 
								    		<span id="marqueur-commune">
- 
 
 239 
								    			<span id="commune-nom" class="commune-info"></span>
- 
 
 240 
								    			(<span id="commune-code-insee" class="commune-info"
- 
 
 241 
								    				rel="tooltip"
- 
 
 242 
								    				title="Code INSEE de la commune"></span>)
- 
 
 243 
								    		</span>
- 
 
 244 
							    		</div>
- 
 
 245 
									</div>
- 
 
 246 
									<form id="form-station" class="control-group" action="#" enctype="multipart/form-data" autocomplete="on">
- 
 
 247 
										<div id="coordonnees-geo" class="well" style="display:none;">
- 
 
 248 
											<div class="row-fluid form-inline">
- 
 
 249 
												<div id="coord-lat" class="span4">
- 
 
 250 
													<label for="latitude">Latitude</label>
- 
 
 251 
													<div>
- 
 
 252 
														<input id="latitude" class="input-mini" name="latitude" type="text" value=""/>
- 
 
 253 
													</div>
- 
 
 254 
												</div>
- 
 
 255 
												<div id="coord-lng" class="span4">
- 
 
 256 
													<label for="longitude">Longitude</label>
- 
 
 257 
													<div>
- 
 
 258 
														<input id="longitude" class="input-mini" name="longitude" type="text" value=""/>
- 
 
 259 
													</div>
- 
 
 260 
												</div>
- 
 
 261 
												<div class="span1">
- 
 
 262 
													<div>
- 
 
 263 
														<input id="geolocaliser" type="button" value="Voir sur la carte"
- 
 
 264 
															rel="tooltip"
- 
 
 265 
															title="Centre la carte sur les coordonnées de latitude et longitude saisies."/>
- 
 
 266 
													</div>
- 
 
 267 
												</div>
- 
 
 268 
									    	</div>
- 
 
 269 
										</div>
- 
 
 270 
										<div class="row-fluid">
- 
 
 271 
											<div class="span4" rel="tooltip" title="Le lieu-dit est la dénomination administrative du lieu que l’on peut trouver sur une carte au 1/25 000, sur le cadastre ou au dire des habitants locaux." >
- 
 
 272 
												<label for="lieudit">Lieu-dit</label>
- 
 
 273 
												<div>
- 
 
 274 
													<input type="text" id="lieudit" class="span2" name="lieudit"/>
- 
 
 275 
												</div>
- 
 
 276 
											</div>
- 
 
 277 
											<div class="span4" rel="tooltip" title="La station est la dénomination qui caractérise le lieu de la collecte d’un point de vue écologique. Il est recommandéde choisir une station qui soit homogène dans sa compositionfloristique afin de refléter le plus fidèlement possible son identité sous l’angle phytosociologique. Exemple : zone humide située au centre du près. " >
- 
 
 278 
												<label for="station">Station</label>
- 
 
 279 
												<div>
- 
 
 280 
													<input type="text" id="station" class="span2" name="station"/>
- 
 
 281 
												</div>
- 
 
 282 
											</div>
- 
 
 283 
											<div class="span4" rel="tooltip" title="Le milieu est un terme générique caractérisant la station. On peut se référer pour cela à des codes comme Corine Biotope ou le nom d’une unité phytosociologique. Exemple : prairie humide">
- 
 
 284 
												<label for="milieux">Milieu</label>
- 
 
 285 
												<div>
- 
 
 286 
													<input type="text" id="milieu" class="span2" name="milieu" />
- 
 
 287 
												</div>
- 
 
 288 
											</div>
- 
 
 289 
										</div>
- 
 
 290 
									</form>
286 
								</div>
 291 
								</div>
287 
							</div>
 292 
							</div>
288 
						</form>
 - 
 
289 
					</div>
 - 
 
290 
				</div>
 - 
 
291 
				<div class="span6">
 293 
							<div class="span6">
292 
					<div class="well">
 - 
 
293 
						<form id="form-obs" action="#" autocomplete="on">
 294 
								<form id="form-obs" action="#" autocomplete="on">
294 
							<h2>Observations</h2>
295 
									<h2>Observations</h2>
295 
							<div class="row-fluid">
 296 
									<div class="row-fluid">
296 
								<div class="span4" rel="tooltip" title="Vous pouvez cliquer sur l'icône de calendrier pour sélectionner un date dans un calendrier.">
 297 
										<div class="span4" rel="tooltip" title="Vous pouvez cliquer sur l'icône de calendrier pour sélectionner un date dans un calendrier.">
297 
									<label for="date" title="Veuillez indiquer la date du relevé au format jj/mm/aaaa">
 298 
											<label for="date" title="Veuillez indiquer la date du relevé au format jj/mm/aaaa">
298 
										<strong class="obligatoire">*</strong> Date du relevé
 299 
												<strong class="obligatoire">*</strong> Date du relevé
299 
									</label>
 300 
											</label>
300 
									<div class="input-prepend">
 301 
											<div class="input-prepend">
301 
										<span id="date-icone" class="add-on"></span>
 302 
												<span id="date-icone" class="add-on"></span><input id="date"
302 
										<input id="date" class="input-small" name="date" type="text"
303 
													class="input-small" name="date" type="text"
303 
											placeholder="jj/mm/aaaa" />
 304 
													placeholder="jj/mm/aaaa" />
- 
 
 305 
											</div>
- 
 
 306 
										</div>
- 
 
 307 
										<div id="taxon-input-groupe" class="span8" rel="tooltip" title="Sélectionnez une espèce dans la liste déroulante." >
- 
 
 308 
											<label for="taxon" title="Choisissez une espèce">
- 
 
 309 
												<strong class="obligatoire">*</strong>
- 
 
 310 
												Espèce
- 
 
 311 
											</label>
- 
 
 312 
											<div class="input-prepend">
- 
 
 313 
												<span class="add-on">
- 
 
 314 
													<i class="icon-leaf"></i>
- 
 
 315 
												</span><input type="text" id="taxon" name="taxon" />
- 
 
 316 
											</div>
- 
 
 317 
										</div>
304 
									</div>
 318 
									</div>
305 
								</div>
 319 
									<div class="row-fluid">
306 
								<div id="taxon-input-groupe" class="span8" rel="tooltip" title="Sélectionnez une espèce dans la liste déroulante." >
 - 
 
307 
									<label for="taxon" title="Choisissez une espèce">
 320 
										<div class="span12">
308 
										<strong class="obligatoire">*</strong>
321 
											<label for="notes">Commentaires</label>
309 
										Espèce
 - 
 
310 
									</label>
 322 
											<div>
311 
									<div class="input-prepend">
 323 
												<textarea id="notes" class="span6" rows="7" name="notes"
312 
										<span class="add-on">
 324 
													placeholder="vous pouvez éventuellement ajouter des informations complémentaires à votre observation (altitude, taille de la plante...)"></textarea>
313 
											<i class="icon-leaf"></i>
 325 
											</div>
314 
										</span>
 326 
										</div>
315 
										<input type="text" id="taxon" name="taxon" />
 - 
 
316 
									</div>
 327 
									</div>
- 
 
 328 
								</form>
- 
 
 329 
								<form id="form-upload" class="form-horizontal" action="<?=$url_base?>saisie?projet=sauvages&amp;service=upload-image"
- 
 
 330 
									method="post" enctype="multipart/form-data">
- 
 
 331 
									<div rel="tooltip" title="Ajouter une photo de votre observation. Elle doit être au format JPEG et ne doit pas excéder 5Mo.">
- 
 
 332 
										<label>Photo</label>
- 
 
 333 
										<input type="file" id="fichier" name="fichier" accept="image/jpeg" />
- 
 
 334 
										<input type="hidden" name="MAX_FILE_SIZE" value="5242880"/>
- 
 
 335 
										<p id="miniature-info" class="discretion help-inline">La photo doit être au format JPEG et ne doit pas excéder 5Mo.</p>
- 
 
 336 
										<div id="miniature"></div>
- 
 
 337 
										<button id="effacer-miniature" type="button" style="display:none;">Effacer</button>
- 
 
 338 
										<p id="miniature-msg" class="span12">&nbsp;</p>
317 
								</div>
 339 
									</div>
- 
 
 340 
								</form>
318 
							</div>
 341 
							</div>
319 
							<div class="row-fluid">
 342 
							<div class="row-fluid">
320 
								<div class="span12">
 343 
								<div class="span12 centre">
- 
 
 344 
									<button id="ajouter-obs" class="btn btn-primary btn-large" type="button"
321 
									<label for="notes">Commentaires</label>
 345 
										title="Ajoute l'observation courante à la liste ci-dessous.">
322 
									<div>
 346 
										Créer
323 
										<textarea id="notes" class="span5" rows="7" name="notes"
- 
 
324 
											placeholder="vous pouvez éventuellement ajouter des informations complémentaires à votre observation (altitude, taille de la plante...)"></textarea>
 - 
 
325 
									</div>
 347 
									</button>
326 
								</div>
 348 
								</div>
327 
							</div>
 349 
							</div>
328 
						</form>
 - 
 
329 
						<form id="form-upload" class="well form-horizontal" action="<?=$url_base?>saisie?projet=sauvages&amp;service=upload-image"
- 
 
330 
							method="post" enctype="multipart/form-data">
 - 
 
331 
							<div rel="tooltip" title="Ajouter une photo de votre observation. Elle doit être au format JPEG et ne doit pas excéder 5Mo.">
 - 
 
332 
								<label>Photo</label>
 - 
 
333 
								<input type="file" id="fichier" name="fichier" accept="image/jpeg" />
 - 
 
334 
								<input type="hidden" name="MAX_FILE_SIZE" value="5242880"/>
 - 
 
335 
								<p id="miniature-info" class="discretion help-inline">La photo doit être au format JPEG et ne doit pas excéder 5Mo.</p>
 - 
 
336 
								<div id="miniature"></div>
 - 
 
337 
								<button id="effacer-miniature" type="button" style="display:none;">Effacer</button>
 - 
 
338 
								<p id="miniature-msg" class="span12">&nbsp;</p>
 - 
 
339 
							</div>
 350 
						</div>
340 
						</form>
 - 
 
341 
					</div>
 - 
 
342 
				</div>
 - 
 
343 
				<div class="row-fluid">
 - 
 
344 
					<div class="span12 centre">
 - 
 
345 
						<button id="ajouter-obs" class="btn btn-primary btn-large" type="button"
 - 
 
346 
							title="Ajoute l'observation courante à la liste ci-dessous.">
 - 
 
347 
							Créer
 - 
 
348 
						</button>
 - 
 
349 
					</div>
 351 
					</div>
350 
				</div>
352 
				</div>
351 
			</div>
 353 
			</div>
352 
			<!-- Affiche le tableau récapitualif des observations ajoutées -->
 354 
			<!-- Affiche le tableau récapitualif des observations ajoutées -->
353 
			<div id="zone-liste-obs" class="row-fluid">
 355 
			<div id="zone-liste-obs" class="row-fluid">
354 
				<form action="#" class="well form-horizontal">
 356 
				<div class="span12">
355 
					<div class="row-fluid">
 357 
					<div class="well">
356 
						<h2>Observations à transmettre : <span class="obs-nbre">0</span></h2>
 358 
						<h2>Observations à transmettre : <span class="obs-nbre">0</span></h2>
357 
						<table id="liste-obs" class="table table-bordered table-condensed">
 - 
 
358 
							<thead>
 - 
 
359 
								<tr>
 - 
 
360 
									<th rowspan="3">Photo</th>
 - 
 
361 
									<th><i class="icon-leaf illustration">&nbsp;</i>Nom</th>
 - 
 
362 
									<th colspan="2">Commune (code INSEE) [<span title="Latitude / Longitude"><i class="icon-map-marker">&nbsp;</i>Lat./Long.</span>]</th>
 - 
 
363 
									<th rowspan="3">Notes</th>
 - 
 
364 
									<th rowspan="3"><i class="icon-trash icone">&nbsp;</i>Action</th>
 - 
 
365 
								</tr>
 - 
 
366 
								<tr>
 - 
 
367 
									<!-- Photo -->
 - 
 
368 
									<th rowspan="2"><i class="icon-calendar illustration">&nbsp;</i>Date</th>
 - 
 
369 
									<th>Lieu-dit</th>
 359 
						<div id="liste-obs"></div>
370 
									<th>Station</th>
 - 
 
371 
									<!-- Notes -->
 - 
 
372 
									<!-- Action -->
- 
 
373 
								</tr>
 - 
 
374 
								<tr>
 - 
 
375 
									<!-- N° -->
 - 
 
376 
									<!-- Photo -->
 - 
 
377 
									<!-- Nom scientifique & Date -->
 - 
 
378 
									<th colspan="2">Milieu</th>
 - 
 
379 
									<!-- Notes -->
 - 
 
380 
									<!-- Action -->
 - 
 
381 
								</tr>
 - 
 
382 
							</thead>
 - 
 
383 
							<tbody></tbody>
 - 
 
384 
						</table>
 - 
 
385 
					</div>
 - 
 
386 
					<div class="row">
 360 
						<div class="row">
387 
						<div class="zone-alerte span6 offset3">
 361 
							<div class="zone-alerte span6 offset3">
388 
							<div id="dialogue-zero-obs" class="alert alert-block" style="display: none;">
 362 
								<div id="dialogue-zero-obs" class="alert alert-block" style="display: none;">
389 
								<a class="close">×</a>
 363 
									<a class="close">×</a>
390 
								<h4 class="alert-heading">Attention : aucune observation</h4>
 364 
									<h4 class="alert-heading">Attention : aucune observation</h4>
391 
								<p>Veuillez saisir des observations pour les transmettres.</p>
 365 
									<p>Veuillez saisir des observations pour les transmettres.</p>
392 
							</div>
 366 
								</div>
393
367
394 
							<div id="dialogue-obs-transaction" class="alert alert-success alert-block" style="display: none;"">
 368 
								<div id="dialogue-obs-transaction" class="alert alert-success alert-block" style="display: none;"">
395 
								<a class="close">×</a>
 369 
									<a class="close">×</a>
396 
								<h4 class="alert-heading">Information : transmission des observations</h4>
 370 
									<h4 class="alert-heading">Information : transmission des observations</h4>
397 
								<div class="alert-txt"></div>
 371 
									<div class="alert-txt"></div>
398 
							</div>
 372 
								</div>
399
373
400 
							<div id="dialogue-erreur" class="alert alert-error alert-block" style="display: none;">
 374 
								<div id="dialogue-erreur" class="alert alert-error alert-block" style="display: none;">
401 
								<a class="close">×</a>
 375 
									<a class="close">×</a>
402 
								<h4 class="alert-heading">Erreur : transmission des observations</h4>
 376 
									<h4 class="alert-heading">Erreur : transmission des observations</h4>
403 
								<div class="alert-txt"></div>
 377 
									<div class="alert-txt"></div>
- 
 
 378 
								</div>
404 
							</div>
 379 
							</div>
405 
						</div>
 380 
						</div>
406 
					</div>
 - 
 
407 
					<div class="row-fluid">
 381 
						<div class="row-fluid">
408 
						<div class="span12 droite">
 382 
							<div class="span12 droite">
409 
							<button id="transmettre-obs" class="btn btn-primary btn-large" type="button"
 383 
								<button id="transmettre-obs" class="btn btn-primary btn-large" type="button" disabled="disabled"
410 
								title="Ajoute les observations à votre Carnet en Ligne et les rend publiques.">
 384 
									title="Ajoute les observations à votre Carnet en Ligne et les rend publiques.">
411 
								Transmettre
 385 
									Transmettre
412 
							</button>
 386 
								</button>
- 
 
 387 
							</div>
413 
						</div>
 388 
						</div>
414 
					</div>
 389 
					</div>
415 
				</form>
 390 
				</div>
416 
			</div>
 391 
			</div>
Line 417... Line 392...
417
392
418 
			<footer class="row-fluid">
 393 
			<footer class="row-fluid">
419 
				<p class="span12">&copy; Tela Botanica 2012</p>
 394 
				<p class="span12">&copy; Tela Botanica 2012</p>
420 
			</footer>
 - 
 
Line 421... Line 395...
421 
		</div>
 395 
			</footer>
422
396
423 
		<!-- Fenêtres modales -->
 397 
			<!-- Fenêtres modales -->
424 
		<div id="chargement" style="position:fixed;z-index:1000;top:0;left:0;height:100%;width:100%;background:#777;background:rgba(90,86,93,0.7);text-align:center;display:none;">
398 
			<div id="chargement" style="position:fixed;z-index:1000;top:0;left:0;height:100%;width:100%;background:#777;background:rgba(90,86,93,0.7);text-align:center;display:none;">
425 
			<div id="chargement-centrage" style="position:relative;width:30%;margin:0 auto;top:30%;">
 399 
				<div id="chargement-centrage" style="position:relative;width:30%;margin:0 auto;top:30%;">
426 
				<img id="chargement-img" src="<?=$url_base?>modules/saisie/squelettes/sauvages/images/chargement_arbre.gif" alt="Transfert en cours..."/>
 400 
					<img id="chargement-img" src="<?=$url_base?>modules/saisie/squelettes/sauvages/images/chargement_arbre.gif" alt="Transfert en cours..."/>
427 
				<p id="chargement-txt" style="color:white;font-size:1.5em;">
 401 
					<p id="chargement-txt" style="color:white;font-size:1.5em;">
428 
					Transfert des observations en cours...<br />
 402 
						Transfert des observations en cours...<br />
- 
 
 403 
						Cela peut prendre plusieurs minutes en fonction de la taille des images et du nombre d'observation à transférer.
429 
					Cela peut prendre plusieurs minutes en fonction de la taille des images et du nombre d'observation à transférer.
 404 
					</p>
430 
				</p>
 - 
 
431 
			</div>
 - 
 
432 
		</div>
 - 
 
433
- 
 
434 
		<!-- Stats : Google Analytics-->
 - 
 
435 
		<script type="text/javascript">
 - 
 
436 
			//<![CDATA[
 - 
 
437 
			var _gaq = _gaq || [];
 - 
 
Line -... Line 405...
- 
 
 405 
				</div>
- 
 
 406 
			</div>
- 
 
 407
- 
 
 408 
			<!-- Stats : Google Analytics-->
- 
 
 409 
			<script type="text/javascript">
- 
 
 410 
				//<![CDATA[
- 
 
 411 
				var _gaq = _gaq || [];
438 
			_gaq.push(['_setAccount', 'UA-20092557-1']);
 412 
				_gaq.push(['_setAccount', 'UA-20092557-1']);
439 
			_gaq.push(['_trackPageview']);
 413 
				_gaq.push(['_trackPageview']);
440
414
441 
			(function() {
 415 
				(function() {
442 
			  var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
 416 
				  var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
443 
			  ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
 417 
				  ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
444 
			  var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
 418 
				  var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
- 
 
 419 
				})();
445 
			})();
 420 
				//]]>
446 
			//]]>
 421 
			</script>
447 
		</script>
 422 
		</div>