Subversion Repositories eFlore/Applications.cel

Rev

Rev 2678 | Go to most recent revision | Only display areas with differences | Ignore whitespace | Details | Blame | Last modification | View Log | RSS feed

Rev 2678 Rev 2848
1 
<!DOCTYPE html>
 1 
<!DOCTYPE html>
2 
<html lang="fr" manifest="mobile.appcache">
2 
<html lang="fr" manifest="mobile.appcache">
3 
	<head>
 3 
	<head>
4 
		<base href="http://www.tela-botanica.org/eflore-test/cel/widget/modules/saisie/squelettes/mobile/"/>
 4 
		<base href="http://www.tela-botanica.org/eflore-test/cel/widget/modules/saisie/squelettes/mobile/"/>
5 
		<title>CEL Mobile</title>
5 
		<title>CEL Mobile</title>
6
6
7 
		<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
 7 
		<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
8 
		<meta http-equiv="Content-style-type" content="text/css" />
 8 
		<meta http-equiv="Content-style-type" content="text/css" />
9 
		<meta http-equiv="Content-script-type" content="text/javascript" />
 9 
		<meta http-equiv="Content-script-type" content="text/javascript" />
10 
		<meta http-equiv="Content-language" content="fr" />
 10 
		<meta http-equiv="Content-language" content="fr" />
11
11
12 
		<meta name="revisit-after" content="15 days" />
 12 
		<meta name="revisit-after" content="15 days" />
13 
		<meta name="robots" content="index,follow" />
 13 
		<meta name="robots" content="index,follow" />
14 
		<meta name="author" content="Jean-Pascal MILCENT, Isabelle NEMBROT" />
 14 
		<meta name="author" content="Jean-Pascal MILCENT, Isabelle NEMBROT" />
15 
		<meta name="keywords" content="Tela Botanica, CEL, mobile" />
 15 
		<meta name="keywords" content="Tela Botanica, CEL, mobile" />
16 
		<meta name="description" content="Widget de saisie du CEL pour smartphone" />
 16 
		<meta name="description" content="Widget de saisie du CEL pour smartphone" />
17
17
18 
		<!-- Favicones -->
 18 
		<!-- Favicones -->
19 
		<link rel="shortcut icon" type="image/x-icon" href="http://resources.tela-botanica.org/tb/img/16x16/favicon.ico" />
 19 
		<link rel="shortcut icon" type="image/x-icon" href="http://resources.tela-botanica.org/tb/img/16x16/favicon.ico" />
20
20
21 
		<!-- Viewport -->
 21 
		<!-- Viewport -->
22 
		<meta name="viewport" content="width=device-width, initial-scale=1">
22 
		<meta name="viewport" content="width=device-width, initial-scale=1">
23 
		<meta name="apple-mobile-web-app-capable" content="yes" />
 23 
		<meta name="apple-mobile-web-app-capable" content="yes" />
24 
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
 24 
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
25
25
26 
		<!-- CSS -->
 26 
		<!-- CSS -->
27 
		<link rel="stylesheet" href="http://www.tela-botanica.org/commun/jquery/mobile/1.3.1/jquery.mobile-1.3.1.min.css" />
 27 
		<link rel="stylesheet" href="http://www.tela-botanica.org/commun/jquery/mobile/1.3.1/jquery.mobile-1.3.1.min.css" />
28 
		<link href="http://www.tela-botanica.org/eflore/cel/widget/modules/saisie/squelettes/mobile/css/mobile.css" rel="stylesheet" type="text/css" media="screen" />
 28 
		<link href="http://www.tela-botanica.org/eflore/cel/widget/modules/saisie/squelettes/mobile/css/mobile.css" rel="stylesheet" type="text/css" media="screen" />
29
29
30 
		<!-- Javascript -->
 30 
		<!-- Javascript -->
31 
		<script src="http://www.tela-botanica.org/commun/jquery/1.7.1/jquery-1.7.1.min.js"></script>
 31 
		<script src="http://www.tela-botanica.org/commun/jquery/1.7.1/jquery-1.7.1.min.js"></script>
32
32
33 
		<!-- Javascript : appli saisie -->
 33 
		<!-- Javascript : appli saisie -->
34 
		<script type="text/javascript" src="config.js"></script>
 34 
		<script type="text/javascript" src="config.js"></script>
35 
		<script type="text/javascript" src="js/mobile.js"></script>
 35 
		<script type="text/javascript" src="js/mobile.js"></script>
36 
		<script type="text/javascript" src="js/bdtfx.js"></script>
 36 
		<script type="text/javascript" src="js/bdtfx.js"></script>
37
37
38 
		<!-- Javascript : Jquery Mobile -->
 38 
		<!-- Javascript : Jquery Mobile -->
39 
		<script src="http://www.tela-botanica.org/commun/jquery/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>
 39 
		<script src="http://www.tela-botanica.org/commun/jquery/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>
40
- 
 
41
40 
 
42 
		<script>
 - 
 
43 
		  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
 - 
 
44 
		  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
 - 
 
45 
		  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
 - 
 
46 
		  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
 - 
 
47
- 
 
48 
		  ga('create', 'UA-20092557-1', 'auto');
 41 
		<!--  Google Analytics -->
49 
		  ga('require', 'displayfeatures');
 42 
		<?php if($prod): ?>
50 
		  ga('send', 'pageview');
 43 
			<?php include "analytics.html"; ?>
51
- 
 
52 
		</script>
 44 
		<?php endif; ?>
53 
	</head>
 45 
	</head>
54
46
55
47
56 
	<body data-theme="b">
 48 
	<body data-theme="b">
57 
		<div id="menu" data-role="page"> <!--data-add-back-btn="true" data-back-btn-text="Retour"-->
 49 
		<div id="menu" data-role="page"> <!--data-add-back-btn="true" data-back-btn-text="Retour"-->
58 
			<div data-role="header">
 50 
			<div data-role="header">
59 
				<h1>Accueil</h1>
 51 
				<h1>Accueil</h1>
60 
				<a href="#infos" data-icon="info" data-iconpos="notext" class="ui-btn-right">Infos</a>
 52 
				<a href="#infos" data-icon="info" data-iconpos="notext" class="ui-btn-right">Infos</a>
61 
			</div>
 53 
			</div>
62 
			<div data-role="content" data-theme="g">
 54 
			<div data-role="content" data-theme="g">
63 
				<p class="center">
55 
				<p class="center">
64 
					Bienvenue sur le Carnet En Ligne mobile ! <br />
 56 
					Bienvenue sur le Carnet En Ligne mobile ! <br />
65 
				</p>
 57 
				</p>
66 
				<ul data-role="listview">
 58 
				<ul data-role="listview">
67 
					<li>
 59 
					<li>
68 
						<img src="http://www.tela-botanica.org/commun/icones/glyphish/187-pencil.png" class="ui-li-icon"/>
 60 
						<img src="http://www.tela-botanica.org/commun/icones/glyphish/187-pencil.png" class="ui-li-icon"/>
69 
						<a href="#saisie" class="saisie" data-role="button">1 - Saisir une observation</a>
 61 
						<a href="#saisie" class="saisie" data-role="button">1 - Saisir une observation</a>
70 
					</li>
 62 
					</li>
71 
					<li>
 63 
					<li>
72 
						<img src="http://www.tela-botanica.org/commun/icones/glyphish/179-notepad.png" class="ui-li-icon"/>
 64 
						<img src="http://www.tela-botanica.org/commun/icones/glyphish/179-notepad.png" class="ui-li-icon"/>
73 
						<a href="#liste" data-role="button">2 - Voir mes observations</a>
 65 
						<a href="#liste" data-role="button">2 - Voir mes observations</a>
74 
					</li>
 66 
					</li>
75 
					<li>
 67 
					<li>
76 
						<img src="http://www.tela-botanica.org/commun/icones/glyphish/56-cloud.png" class="ui-li-icon"/>
 68 
						<img src="http://www.tela-botanica.org/commun/icones/glyphish/56-cloud.png" class="ui-li-icon"/>
77 
						<a href="#transmission" data-role="button">3 - Transmettre mes observations</a>
 69 
						<a href="#transmission" data-role="button">3 - Transmettre mes observations</a>
78 
					</li>
 70 
					</li>
79 
					<li></li>
 71 
					<li></li>
80 
				</ul>
 72 
				</ul>
81 
			</div>
 73 
			</div>
82 
			<div data-role="footer" data-position="fixed"></div>
 74 
			<div data-role="footer" data-position="fixed"></div>
83 
		</div>
 75 
		</div>
84 
 
 76 
 
85 
		<div id="saisie" data-role="page">
 77 
		<div id="saisie" data-role="page">
86 
			<div data-role="header" data-position="inline">
 78 
			<div data-role="header" data-position="inline">
87 
				<a href="#menu" data-icon="home" data-iconpos="notext" data-direction="reverse">Accueil</a>
 79 
				<a href="#menu" data-icon="home" data-iconpos="notext" data-direction="reverse">Accueil</a>
88 
				<h1>Saisie</h1>
 80 
				<h1>Saisie</h1>
89 
				<a href="#infos" data-icon="info" data-iconpos="notext" class="ui-btn-right">Infos</a>
 81 
				<a href="#infos" data-icon="info" data-iconpos="notext" class="ui-btn-right">Infos</a>
90 
			</div>
 82 
			</div>
91 
			<form id="form-saisie-observation" method="post" action="#">
 83 
			<form id="form-saisie-observation" method="post" action="#">
92 
				<div data-role="content">
 84 
				<div data-role="content">
93 
					<div id="obs-saisie-infos"></div>
 85 
					<div id="obs-saisie-infos"></div>
94 
					<div data-role="fieldcontain">
 86 
					<div data-role="fieldcontain">
95 
						<label for="nom">Espèce : </label>
 87 
						<label for="nom">Espèce : </label>
96 
						<span id="nom"></span>
 88 
						<span id="nom"></span>
97
89
98 
						<br />
 90 
						<br />
99 
						<a href="#saisie-popup" id="saisie-popup-btn"
 91 
						<a href="#saisie-popup" id="saisie-popup-btn"
100 
								data-role="button" data-icon="search" data-iconpos="right"
92 
								data-role="button" data-icon="search" data-iconpos="right"
101 
								data-rel="dialog" data-transition="pop" data-theme="b">
 93 
								data-rel="dialog" data-transition="pop" data-theme="b">
102 
							Changer l'espèce
 94 
							Changer l'espèce
103 
						</a>
 95 
						</a>
104 
						<hr />
 96 
						<hr />
105 
 
 97 
 
106 
						<label for="date">
 98 
						<label for="date">
107 
							Date :
 99 
							Date :
108 
							<span id="date"></span>
 100 
							<span id="date"></span>
109 
						</label>
 101 
						</label>
110 
						<hr />
 102 
						<hr />
111
103
112 
						<button id="geolocaliser"
104 
						<button id="geolocaliser"
113 
								data-role="button" data-icon="refresh" data-iconpos="" data-ajax="false">
 105 
								data-role="button" data-icon="refresh" data-iconpos="" data-ajax="false">
114 
							Recalculer ma position
 106 
							Recalculer ma position
115 
						</button>
 107 
						</button>
116
108
117 
						<label for="lat">
 109 
						<label for="lat">
118 
							Latitude :
 110 
							Latitude :
119 
							<span id="lat"></span>
 111 
							<span id="lat"></span>
120 
						</label>
 112 
						</label>
121
113
122 
						<br />
 114 
						<br />
123 
						<label for="lng">
 115 
						<label for="lng">
124 
							Longitude :
 116 
							Longitude :
125 
							<span id="lng"></span>
 117 
							<span id="lng"></span>
126 
						</label>
 118 
						</label>
127
119
128 
						<br />
 120 
						<br />
129 
						<label for="location">
 121 
						<label for="location">
130 
							Commune :
 122 
							Commune :
131 
							<span id="location"></span>
 123 
							<span id="location"></span>
132 
							<input id="code-insee" type="hidden" name="code-insee" />
 124 
							<input id="code-insee" type="hidden" name="code-insee" />
133 
						</label>
 125 
						</label>
134
126
135 
						<br />
 127 
						<br />
136 
						<hr />
 128 
						<hr />
137 
						<button id="sauver-obs" data-role="button" data-icon="check">Sauver</button>
 129 
						<button id="sauver-obs" data-role="button" data-icon="check">Sauver</button>
138
130
139 
						<input id="referentiel" type="hidden" name="referentiel" />
 131 
						<input id="referentiel" type="hidden" name="referentiel" />
140 
						<input id="nom-sci-select" type="hidden" name="nom-sci-select" />
 132 
						<input id="nom-sci-select" type="hidden" name="nom-sci-select" />
141 
						<input id="num-nom-select" type="hidden" name="num-nom-select" />
 133 
						<input id="num-nom-select" type="hidden" name="num-nom-select" />
142 
					</div>
 134 
					</div>
143 
				</div>
 135 
				</div>
144 
				<div data-role="footer" data-position="fixed">
 136 
				<div data-role="footer" data-position="fixed">
145 
					<div data-role="navbar">
 137 
					<div data-role="navbar">
146 
						<ul>
 138 
						<ul>
147 
							<li><a href="#liste" data-role="button" data-icon="notepad" data-iconpos="notext">Liste de mes obs.</a></li>
 139 
							<li><a href="#liste" data-role="button" data-icon="notepad" data-iconpos="notext">Liste de mes obs.</a></li>
148 
							<li><a href="#transmission" data-role="button" data-icon="cloud" data-iconpos="notext">Transmission</a></li>
 140 
							<li><a href="#transmission" data-role="button" data-icon="cloud" data-iconpos="notext">Transmission</a></li>
149 
						</ul>
 141 
						</ul>
150 
					</div>
 142 
					</div>
151 
				</div>
 143 
				</div>
152 
			</form>
 144 
			</form>
153 
		</div>
 145 
		</div>
154
146
155 
		<div id="saisie-popup" data-role="page" data-history="false" data-close-btn="right">
 147 
		<div id="saisie-popup" data-role="page" data-history="false" data-close-btn="right">
156 
			<div data-role="header">
 148 
			<div data-role="header">
157 
				<h1></h1>
 149 
				<h1></h1>
158 
			</div>
 150 
			</div>
159 
			<div data-role="content">
 151 
			<div data-role="content">
160 
				<ul id="liste-noms-latins" data-role="listview"
152 
				<ul id="liste-noms-latins" data-role="listview"
161 
					data-inset="true" data-filter="true" data-filter-reveal="true"
153 
					data-inset="true" data-filter="true" data-filter-reveal="true"
162 
					data-filter-placeholder="Trouver une espèce...">
 154 
					data-filter-placeholder="Trouver une espèce...">
163 
				</ul>
 155 
				</ul>
164 
				<div class="hidden">
 156 
				<div class="hidden">
165 
					<button id="recherche-chargement" data-theme="a" data-textonly="true" data-textvisible="true" data-msgtext="Chargement des résultats..." ></button>
 157 
					<button id="recherche-chargement" data-theme="a" data-textonly="true" data-textvisible="true" data-msgtext="Chargement des résultats..." ></button>
166 
				</div>
 158 
				</div>
167 
			</div>
 159 
			</div>
168 
		</div>
 160 
		</div>
169
161
170 
		<div id="liste" data-role="page">
 162 
		<div id="liste" data-role="page">
171 
			<div data-role="header" data-position="inline">
 163 
			<div data-role="header" data-position="inline">
172 
				<a href="#menu" data-icon="home" data-iconpos="notext" data-direction="reverse">Accueil</a>
 164 
				<a href="#menu" data-icon="home" data-iconpos="notext" data-direction="reverse">Accueil</a>
173 
				<h1>Observations</h1>
 165 
				<h1>Observations</h1>
174 
				<a href="#infos" data-icon="info" data-iconpos="notext" class="ui-btn-right">Infos</a>
 166 
				<a href="#infos" data-icon="info" data-iconpos="notext" class="ui-btn-right">Infos</a>
175 
			</div>
 167 
			</div>
176 
			<div data-role="content">
 168 
			<div data-role="content">
177 
				<div id="obs-suppression-infos"></div>
 169 
				<div id="obs-suppression-infos"></div>
178 
				<ul id="liste-obs" data-role="listview" data-split-icon="delete" data-split-theme="g" data-theme="g" data-inset="true"></ul>
 170 
				<ul id="liste-obs" data-role="listview" data-split-icon="delete" data-split-theme="g" data-theme="g" data-inset="true"></ul>
179 
			</div>
 171 
			</div>
180 
			<div data-role="footer" data-position="fixed">
 172 
			<div data-role="footer" data-position="fixed">
181 
				<div data-role="navbar">
 173 
				<div data-role="navbar">
182 
					<ul>
 174 
					<ul>
183 
						<li><a href="#saisie" class="saisie" data-role="button" data-icon="pencil" data-iconpos="notext">Saisie</a></li>
 175 
						<li><a href="#saisie" class="saisie" data-role="button" data-icon="pencil" data-iconpos="notext">Saisie</a></li>
184 
						<li><a href="#transmission" data-role="button" data-icon="cloud" data-iconpos="notext">Transmission</a></li>
 176 
						<li><a href="#transmission" data-role="button" data-icon="cloud" data-iconpos="notext">Transmission</a></li>
185 
					</ul>
 177 
					</ul>
186 
				</div>
 178 
				</div>
187 
			</div>
 179 
			</div>
188 
		</div>
 180 
		</div>
189
181
190 
		<div id="observation" data-role="page">
 182 
		<div id="observation" data-role="page">
191 
			<div data-role="header" data-position="inline">
 183 
			<div data-role="header" data-position="inline">
192 
				<a href="#menu" data-icon="home" data-iconpos="notext" data-direction="reverse">Accueil</a>
 184 
				<a href="#menu" data-icon="home" data-iconpos="notext" data-direction="reverse">Accueil</a>
193 
				<h1>Détails de l'observation</h1>
 185 
				<h1>Détails de l'observation</h1>
194 
				<a href="#liste" data-icon="notepad" data-iconpos="notext" ></a>
 186 
				<a href="#liste" data-icon="notepad" data-iconpos="notext" ></a>
195 
			</div>
 187 
			</div>
196 
			<div data-role="content">
 188 
			<div data-role="content">
197 
				<label for="id-obs">Identifiant :</label> <span id="id-obs"></span>
 189 
				<label for="id-obs">Identifiant :</label> <span id="id-obs"></span>
198 
				<div id="details-obs"></div>
 190 
				<div id="details-obs"></div>
199
191
200 
				<input type="file" id="pic" name="photos-obs[]" accept="image/*" multiple>
 192 
				<input type="file" id="pic" name="photos-obs[]" accept="image/*" multiple>
201 
				<button id="valider-photos"
 193 
				<button id="valider-photos"
202 
						data-role="button" data-icon="search" data-iconpos="" data-ajax="false">
 194 
						data-role="button" data-icon="search" data-iconpos="" data-ajax="false">
203 
					Ajouter les images sélectionnées
 195 
					Ajouter les images sélectionnées
204 
				</button>
 196 
				</button>
205 
 
 197 
 
206 
				<div data-role="popup" id="cache-plein" class="ui-content" data-position-to="#valider-photos">
 198 
				<div data-role="popup" id="cache-plein" class="ui-content" data-position-to="#valider-photos">
207 
					<a href="#" data-rel="back" data-role="button" data-theme="a" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Close</a>
 199 
					<a href="#" data-rel="back" data-role="button" data-theme="a" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Close</a>
208 
					<p>
 200 
					<p>
209 
						La mémoire de cette application est pleine. <br />
 201 
						La mémoire de cette application est pleine. <br />
210 
						Veuillez supprimer des images ou transmettre vos observations.
 202 
						Veuillez supprimer des images ou transmettre vos observations.
211 
					</p>
 203 
					</p>
212 
				</div>
 204 
				</div>
213
205
214 
				<div data-role="popup" id="photo-zoom" class="ui-content">
 206 
				<div data-role="popup" id="photo-zoom" class="ui-content">
215 
					<span id="photo-zoom-infos"></span>
 207 
					<span id="photo-zoom-infos"></span>
216 
					<button data-role="button" data-theme="a" onclick="$('#photo-zoom').popup('close');">
 208 
					<button data-role="button" data-theme="a" onclick="$('#photo-zoom').popup('close');">
217 
						Fermer cet aperçu
 209 
						Fermer cet aperçu
218 
					</button>
 210 
					</button>
219 
				</div>
 211 
				</div>
220
212
221 
				<div id="photo-suppression-infos"></div>
 213 
				<div id="photo-suppression-infos"></div>
222 
				<ul id="photos-obs" data-role="listview" data-inset="true"></ul>
 214 
				<ul id="photos-obs" data-role="listview" data-inset="true"></ul>
223 
				<canvas id="photo-canvas" class="hidden"></canvas>
 215 
				<canvas id="photo-canvas" class="hidden"></canvas>
224 
			</div>
 216 
			</div>
225 
			<div data-role="footer" data-position="fixed">
 217 
			<div data-role="footer" data-position="fixed">
226 
				<div data-role="navbar">
 218 
				<div data-role="navbar">
227 
					<ul>
 219 
					<ul>
228 
						<li><a href="#saisie" class="saisie" data-role="button" data-icon="pencil" data-iconpos="notext">Saisie</a></li>
 220 
						<li><a href="#saisie" class="saisie" data-role="button" data-icon="pencil" data-iconpos="notext">Saisie</a></li>
229 
						<li><a href="#liste" data-role="button" data-icon="notepad" data-iconpos="notext">Liste de mes obs.</a></li>
 221 
						<li><a href="#liste" data-role="button" data-icon="notepad" data-iconpos="notext">Liste de mes obs.</a></li>
230 
					</ul>
 222 
					</ul>
231 
				</div>
 223 
				</div>
232 
			</div>
 224 
			</div>
233 
		</div>
 225 
		</div>
234
226
235 
		<div id="transmission" data-role="page">
 227 
		<div id="transmission" data-role="page">
236 
			<div data-role="header">
 228 
			<div data-role="header">
237 
				<a href="#menu" data-icon="home" data-iconpos="notext" data-direction="reverse">Accueil</a>
 229 
				<a href="#menu" data-icon="home" data-iconpos="notext" data-direction="reverse">Accueil</a>
238 
				<h1>Transmission</h1>
 230 
				<h1>Transmission</h1>
239 
				<a href="#infos" data-icon="info" data-iconpos="notext" class="ui-btn-right">Infos</a>
 231 
				<a href="#infos" data-icon="info" data-iconpos="notext" class="ui-btn-right">Infos</a>
240 
			</div>
 232 
			</div>
241 
			<div data-role="content" data-theme="d">
233 
			<div data-role="content" data-theme="d">
242 
				<p>
 234 
				<p>
243 
					<span id="identification-texte">
 235 
					<span id="identification-texte">
244 
						Ajouter au compte
 236 
						Ajouter au compte
245 
					</span>
 237 
					</span>
246 
					<strong><span id="utilisateur-compte"></span></strong>
 238 
					<strong><span id="utilisateur-compte"></span></strong>
247 
				</p>
 239 
				</p>
248 
				<a href="#identification-popup" id="identification-btn"
 240 
				<a href="#identification-popup" id="identification-btn"
249 
					data-role="button" data-icon="grid" data-iconpos="right"
241 
					data-role="button" data-icon="grid" data-iconpos="right"
250 
					data-rel="dialog" data-transition="pop" data-theme="b">
 242 
					data-rel="dialog" data-transition="pop" data-theme="b">
251 
						Modifier le compte
 243 
						Modifier le compte
252 
				</a>
244 
				</a>
253 
				<div id="identification-infos"></div>
 245 
				<div id="identification-infos"></div>
254 
				<hr />
 246 
				<hr />
255 
				<button data-role="button" data-icon="cloud-black" id="transmettre-obs" >
 247 
				<button data-role="button" data-icon="cloud-black" id="transmettre-obs" >
256 
					Transmettre
 248 
					Transmettre
257 
				</button>
249 
				</button>
258 
			</div>
 250 
			</div>
259 
			<div data-role="footer" data-position="fixed">
 251 
			<div data-role="footer" data-position="fixed">
260 
				<div data-role="navbar">
 252 
				<div data-role="navbar">
261 
					<ul>
 253 
					<ul>
262 
						<li><a href="#saisie" class="saisie" data-role="button" data-icon="pencil" data-iconpos="notext">Saisie</a></li>
 254 
						<li><a href="#saisie" class="saisie" data-role="button" data-icon="pencil" data-iconpos="notext">Saisie</a></li>
263 
						<li><a href="#liste" data-role="button" data-icon="notepad" data-iconpos="notext">Liste de mes obs.</a></li>
 255 
						<li><a href="#liste" data-role="button" data-icon="notepad" data-iconpos="notext">Liste de mes obs.</a></li>
264 
					</ul>
 256 
					</ul>
265 
				</div>
 257 
				</div>
266 
			</div>
 258 
			</div>
267 
		</div>
 259 
		</div>
268
260
269 
		<div id="identification-popup" data-role="page" data-history="false" data-close-btn="right">
 261 
		<div id="identification-popup" data-role="page" data-history="false" data-close-btn="right">
270 
			<div data-role="header">
 262 
			<div data-role="header">
271 
				<h1>Compte Tela Botanica</h1>
 263 
				<h1>Compte Tela Botanica</h1>
272 
			</div>
 264 
			</div>
273 
			<form id="form-transmission" method="post" action="#">
 265 
			<form id="form-transmission" method="post" action="#">
274 
				<div data-role="content">
 266 
				<div data-role="content">
275 
					<div data-role="fieldcontain">
267 
					<div data-role="fieldcontain">
276 
						<label for="courriel">Courriel * :</label>
 268 
						<label for="courriel">Courriel * :</label>
277 
						<input id="courriel" type="email" name="courriel"/>
 269 
						<input id="courriel" type="email" name="courriel"/>
278 
						<input id="id-utilisateur" name="id-utilisateur" type="hidden"/>
 270 
						<input id="id-utilisateur" name="id-utilisateur" type="hidden"/>
279
271
280 
						<button id="valider-courriel" data-role="button"
272 
						<button id="valider-courriel" data-role="button"
281 
							data-icon="forward" data-iconpos="">
 273 
							data-icon="forward" data-iconpos="">
282 
								Vérifier ce compte Tela
 274 
								Vérifier ce compte Tela
283 
						</button>
 275 
						</button>
284 
					</div>
 276 
					</div>
285 
					<div id="zone-courriel-confirmation" data-role="fieldcontain" class="hidden">
 277 
					<div id="zone-courriel-confirmation" data-role="fieldcontain" class="hidden">
286 
						<label for="courriel-confirmation">
 278 
						<label for="courriel-confirmation">
287 
							<strong class="obligatoire">*</strong> Courriel (confirmation) :
279 
							<strong class="obligatoire">*</strong> Courriel (confirmation) :
288 
						</label>
 280 
						</label>
289 
						<input id="courriel-confirmation" name="courriel-confirmation" type="text"/>
 281 
						<input id="courriel-confirmation" name="courriel-confirmation" type="text"/>
290 
					</div>
 282 
					</div>
291 
					<div id="zone-prenom-nom" data-role="fieldcontain" class="hidden">
 283 
					<div id="zone-prenom-nom" data-role="fieldcontain" class="hidden">
292 
						<div>
 284 
						<div>
293 
							<label for="nom">Nom :</label>
 285 
							<label for="nom">Nom :</label>
294 
							<input id="nom-utilisateur" name="nom" type="text"/>
 286 
							<input id="nom-utilisateur" name="nom" type="text"/>
295 
						</div>
 287 
						</div>
296
288
297 
						<div>
 289 
						<div>
298 
							<label for="prenom">Prénom :</label>
 290 
							<label for="prenom">Prénom :</label>
299 
							<input id="prenom-utilisateur" name="prenom" type="text"/>
 291 
							<input id="prenom-utilisateur" name="prenom" type="text"/>
300 
						</div>
 292 
						</div>
301 
					</div>
 293 
					</div>
302 
					<input type="checkbox" name="courriel-memoire" id="courriel-memoire" checked="checked">
 294 
					<input type="checkbox" name="courriel-memoire" id="courriel-memoire" checked="checked">
303 
					<label for="courriel-memoire">Se souvenir de moi</label>
 295 
					<label for="courriel-memoire">Se souvenir de moi</label>
304
296
305 
					<button id="valider-identification" data-role="button"
297 
					<button id="valider-identification" data-role="button"
306 
						data-icon="check" data-iconpos="right" data-theme="b">
 298 
						data-icon="check" data-iconpos="right" data-theme="b">
307 
							Valider le formulaire
 299 
							Valider le formulaire
308 
					</button>
 300 
					</button>
309 
				</div>
 301 
				</div>
310 
			</form>
 302 
			</form>
311 
			<div data-role="footer"></div>
 303 
			<div data-role="footer"></div>
312 
		</div><!-- /page popup -->
304 
		</div><!-- /page popup -->
313
305
314 
		<div id="infos" data-role="page" data-add-back-btn="true" data-back-btn-text="Retour">
 306 
		<div id="infos" data-role="page" data-add-back-btn="true" data-back-btn-text="Retour">
315 
			<div data-role="header">
 307 
			<div data-role="header">
316 
				<h1>Infos</h1>
 308 
				<h1>Infos</h1>
317 
			</div>
 309 
			</div>
318 
			<div data-role="content">
 310 
			<div data-role="content">
319 
				<p>
 311 
				<p>
320 
					Développement :
312 
					Développement :
321 
					<ul>
 313 
					<ul>
322 
						<li>Jean-Pascal MILCENT</li>
 314 
						<li>Jean-Pascal MILCENT</li>
323 
						<li>Isabelle NEMBROT</li>
 315 
						<li>Isabelle NEMBROT</li>
324 
					</ul>
 316 
					</ul>
325 
					sur une idée originale de Aurélien PERONNET.
 317 
					sur une idée originale de Aurélien PERONNET.
326 
				</p>
 318 
				</p>
327 
			</div>
 319 
			</div>
328 
			<div data-role="footer" data-position="fixed">
 320 
			<div data-role="footer" data-position="fixed">
329 
				<p class="center">
 321 
				<p class="center">
330 
					Icônes par <a href="http://glyphish.com">Joseph Wain - Glyphish</a>. <br />
 322 
					Icônes par <a href="http://glyphish.com">Joseph Wain - Glyphish</a>. <br />
331 
					© Copyright <span id="annee"></span> - <a href="http://www.tela-botanica.org/site:accueil">Tela Botanica</a>
 323 
					© Copyright <span id="annee"></span> - <a href="http://www.tela-botanica.org/site:accueil">Tela Botanica</a>
332 
				</p>
 324 
				</p>
333 
			</div>
 325 
			</div>
334 
		</div>
 326 
		</div>
335 
	</body>
 327 
	</body>
336 
</html>
 328 
</html>