WebSVN – eFlore/Applications.cel – Diff – /trunk/widget/modules/saisie/squelettes/mobile/mobile.tpl.html


<!DOCTYPE html>
<html lang="fr" manifest="mobile.appcache"> 
	<head>
		<base href="http://www.tela-botanica.org/eflore/cel/widget/modules/saisie/squelettes/mobile/"/>
		<title>CEL Mobile</title> 
		
		<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
		<meta http-equiv="Content-style-type" content="text/css" />
		<meta http-equiv="Content-script-type" content="text/javascript" />
		<meta http-equiv="Content-language" content="fr" />
		
		<meta name="revisit-after" content="15 days" />
        <meta name="robots" content="index,follow" />
        <meta name="author" content="Jean-Pascal MILCENT, Isabelle NEMBROT" />
        <meta name="keywords" content="Tela Botanica, CEL, mobile" />
        <meta name="description" content="Widget de saisie du CEL pour smartphone" />
		
		<!-- Favicones -->
		<link rel="shortcut icon" type="image/x-icon" href="http://www.tela-botanica.org/favicon.ico" />
		
		<!-- Viewport -->
		<meta name="viewport" content="width=device-width, initial-scale=1"> 
		<meta name="apple-mobile-web-app-capable" content="yes" />
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		
		<!-- CSS -->
		<link rel="stylesheet" href="http://www.tela-botanica.org/commun/jquery/mobile/1.3.1/jquery.mobile-1.3.1.min.css" />
		<link href="http://www.tela-botanica.org/eflore/cel/widget/modules/saisie/squelettes/mobile/css/mobile.css" rel="stylesheet" type="text/css" media="screen" />
		
		<!-- Javascript -->
		<script src="http://www.tela-botanica.org/commun/jquery/1.7.1/jquery-1.7.1.min.js"></script>
		
		<!-- Javascript : appli saisie -->
		<script type="text/javascript">
		//<![CDATA[
			// Nombre d'observations max autorisé avant transmission
			var OBS_MAX_NBRE = 10;
			// Délai d'attente avant de lancer la recherche des noms latins en ms
			var DELAI_RECHERCHE = 500;
			// Mot-clé du widget/projet
			var TAG_PROJET = "WidgetSaisie";
			// URL du web service réalisant l'insertion des données dans la base du CEL.
			var SERVICE_SAISIE_URL = "http://www.tela-botanica.org/service:cel:CelWidgetSaisie";
			//var SERVICE_SAISIE_URL = "http://www.tela-botanica.org/test-service:cel:CelWidgetSaisie";
			// URL du web service annuaire des membres du réseau.
			var SERVICE_ANNUAIRE = "http://www.tela-botanica.org/client/annuaire_nouveau/actuelle/jrest/utilisateur/identite-par-courriel/";
			// Squelette d'URL du web service d'eFlore fournissant les noms de communes.
			var SERVICE_NOM_COMMUNE_URL = "http://www.tela-botanica.org/service:eflore:0.1/osm/nom-commune?lon={lon}&lat={lat}";
			// Texte en absence de connexion
			var TEXTE_HORS_LIGNE = 'Aucune connexion.';
			// Texte en absence de compte
			var TEXTE_NON_COMPTE = 'Aucun compte enregistré.';
			// Texte en presence de compte
			var TEXTE_OUI_COMPTE = 'Ajouter au compte ';
			// Texte d'identification des observations
			var TEXTE_OBS = 'obsId';
			// Texte d'identification des photos
			var TEXTE_PHOTO = 'photoId';
		//]]>
		</script>
		<script type="text/javascript" src="js/mobile.js"></script>
		<script type="text/javascript" src="js/bdtfx.js"></script>
		
		<!-- Javascript : Jquery Mobile -->
		<script src="http://www.tela-botanica.org/commun/jquery/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>
	</head>
	
	
	<body data-theme="b">
		<div id="menu" data-role="page"> <!--data-add-back-btn="true" data-back-btn-text="Retour"-->
			<div data-role="header">
				<h1>Accueil</h1>
				<a href="#infos" data-icon="info" data-iconpos="notext" class="ui-btn-right">Infos</a>
			</div>
			<div data-role="content" data-theme="g">
				<p class="center"> 
					Bienvenue sur le Carnet En Ligne mobile ! <br />
				</p>
				<ul data-role="listview">
					<li>
						<img src="http://www.tela-botanica.org/commun/icones/glyphish/187-pencil.png" class="ui-li-icon"/>
						<a href="#saisie" class="saisie" data-role="button">1 - Saisir une observation</a>
					</li>
					<li>
						<img src="http://www.tela-botanica.org/commun/icones/glyphish/179-notepad.png" class="ui-li-icon"/>
						<a href="#liste" data-role="button">2 - Voir mes observations</a>
					</li>
					<li>
						<img src="http://www.tela-botanica.org/commun/icones/glyphish/56-cloud.png" class="ui-li-icon"/>
						<a href="#transmission" data-role="button">3 - Transmettre mes observations</a>
					</li>
					<li></li>
				</ul>
			</div>
			<div data-role="footer" data-position="fixed"></div>
		</div>
 
		<div id="saisie" data-role="page">
			<div data-role="header" data-position="inline">
				<a href="#menu" data-icon="home" data-iconpos="notext" data-direction="reverse">Accueil</a>
				<h1>Saisie</h1>
				<a href="#infos" data-icon="info" data-iconpos="notext" class="ui-btn-right">Infos</a>
			</div>
			<form id="form-saisie-observation" method="post" action="#">
				<div data-role="content">
					<div id="obs-saisie-infos"></div>
					<div data-role="fieldcontain">
						<label for="nom">Espèce : </label>
						<span id="nom"></span>
						
						<br />
						<a href="#saisie-popup" id="saisie-popup-btn"
								data-role="button" data-icon="search" data-iconpos="right" 
								data-rel="dialog" data-transition="pop" data-theme="b">
							Changer l'espèce
						</a>
						<hr />
 
						<label for="date">
							Date :
							<span id="date"></span>
						</label>
						<hr />
						
						<button id="geolocaliser" 
								data-role="button" data-icon="refresh" data-iconpos="" data-ajax="false">
							Recalculer ma position
						</button>
						
						<label for="lat">
							Latitude :
							<span id="lat"></span>
						</label>
						
						<br />
						<label for="lng">
							Longitude :
							<span id="lng"></span>
						</label>
						
						<br />
						<label for="location">
							Commune :
							<span id="location"></span>
							<input id="code-insee" type="hidden" name="code-insee" />
						</label>
						
						<br />
						<hr />
						<button id="sauver-obs" data-role="button" data-icon="check">Sauver</button>
						
						<input id="referentiel" type="hidden" name="referentiel" />
						<input id="nom-sci-select" type="hidden" name="nom-sci-select" />
						<input id="num-nom-select" type="hidden" name="num-nom-select" />
					</div>
				</div>
				<div data-role="footer" data-position="fixed">
					<div data-role="navbar">
						<ul>
							<li><a href="#liste" data-role="button" data-icon="notepad" data-iconpos="notext">Liste de mes obs.</a></li>
							<li><a href="#transmission" data-role="button" data-icon="cloud" data-iconpos="notext">Transmission</a></li>
						</ul>
					</div>
				</div>
			</form>
		</div>
		
		<div id="saisie-popup" data-role="page" data-history="false" data-close-btn="right">
			<div data-role="header">
				<h1></h1>
			</div>
			<div data-role="content">
				<ul id="liste-noms-latins" data-role="listview" 
					data-inset="true" data-filter="true" data-filter-reveal="true" 
					data-filter-placeholder="Trouver une espèce...">
				</ul>
				<div class="hidden">
					<button id="recherche-chargement" data-theme="a" data-textonly="true" data-textvisible="true" data-msgtext="Chargement des résultats..." ></button>
				</div>
			</div>
		</div>
		
		<div id="liste" data-role="page">
			<div data-role="header" data-position="inline">
				<a href="#menu" data-icon="home" data-iconpos="notext" data-direction="reverse">Accueil</a>
				<h1>Observations</h1>
				<a href="#infos" data-icon="info" data-iconpos="notext" class="ui-btn-right">Infos</a>
			</div>
			<div data-role="content">
				<div id="obs-suppression-infos"></div>
				<ul id="liste-obs" data-role="listview" data-split-icon="delete" data-split-theme="g" data-theme="g" data-inset="true"></ul>
			</div>
			<div data-role="footer" data-position="fixed">
				<div data-role="navbar">
					<ul>
						<li><a href="#saisie" class="saisie" data-role="button" data-icon="pencil" data-iconpos="notext">Saisie</a></li>
						<li><a href="#transmission" data-role="button" data-icon="cloud" data-iconpos="notext">Transmission</a></li>
					</ul>
				</div>
			</div>
		</div>
		
		<div id="observation" data-role="page">
			<div data-role="header" data-position="inline">
				<a href="#menu" data-icon="home" data-iconpos="notext" data-direction="reverse">Accueil</a>
				<h1>Détails de l'observation</h1>
				<a href="#liste" data-icon="notepad" data-iconpos="notext" ></a>
			</div>
			<div data-role="content">
				<label for="id-obs">Identifiant :</label> <span id="id-obs"></span>
				<div id="details-obs"></div>
				
				<input type="file" id="pic" name="photos-obs[]" accept="image/*" multiple>
				<button id="valider-photos"
						data-role="button" data-icon="search" data-iconpos="" data-ajax="false">
					Ajouter les images sélectionnées
				</button>
 
				<div data-role="popup" id="cache-plein" class="ui-content" data-position-to="#valider-photos">
					<a href="#" data-rel="back" data-role="button" data-theme="a" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Close</a>
					<p>
						La mémoire de cette application est pleine. <br />
						Veuillez supprimer des images ou transmettre vos observations.
					</p>
				</div>
				
				<div data-role="popup" id="photo-zoom" class="ui-content">
					<span id="photo-zoom-infos"></span>
					<button data-role="button" data-theme="a" onclick="$('#photo-zoom').popup('close');">
						Fermer cet aperçu
					</button>
				</div>
				
				<div id="photo-suppression-infos"></div>
				<ul id="photos-obs" data-role="listview" data-inset="true"></ul>
				<canvas id="photo-canvas" class="hidden"></canvas>
			</div>
			<div data-role="footer" data-position="fixed">
				<div data-role="navbar">
					<ul>
						<li><a href="#saisie" class="saisie" data-role="button" data-icon="pencil" data-iconpos="notext">Saisie</a></li>
						<li><a href="#liste" data-role="button" data-icon="notepad" data-iconpos="notext">Liste de mes obs.</a></li>
					</ul>
				</div>
			</div>
		</div>
		
		<div id="transmission" data-role="page">
			<div data-role="header">
				<a href="#menu" data-icon="home" data-iconpos="notext" data-direction="reverse">Accueil</a>
				<h1>Transmission</h1>
				<a href="#infos" data-icon="info" data-iconpos="notext" class="ui-btn-right">Infos</a>
			</div>
			<div data-role="content" data-theme="d">	
				<p>
					<span id="identification-texte">
						Ajouter au compte
					</span>
					<strong><span id="utilisateur-compte"></span></strong>
				</p>
				<a href="#identification-popup" id="identification-btn"
					data-role="button" data-icon="grid" data-iconpos="right" 
					data-rel="dialog" data-transition="pop" data-theme="b">
						Modifier le compte
				</a>	
				<div id="identification-infos"></div>
				<hr />
				<button data-role="button" data-icon="cloud-black" id="transmettre-obs" >
					Transmettre
				</button>			
			</div>
			<div data-role="footer" data-position="fixed">
				<div data-role="navbar">
					<ul>
						<li><a href="#saisie" class="saisie" data-role="button" data-icon="pencil" data-iconpos="notext">Saisie</a></li>
						<li><a href="#liste" data-role="button" data-icon="notepad" data-iconpos="notext">Liste de mes obs.</a></li>
					</ul>
				</div>
			</div>
		</div>
		
		<div id="identification-popup" data-role="page" data-history="false" data-close-btn="right">
			<div data-role="header">
				<h1>Compte Tela Botanica</h1>
			</div>
			<form id="form-transmission" method="post" action="#">
				<div data-role="content">
					<div data-role="fieldcontain"> 
						<label for="courriel">Courriel * :</label>
						<input id="courriel" type="email" name="courriel"/>
						<input id="id-utilisateur" name="id-utilisateur" type="hidden"/>
						
						<button id="valider-courriel" data-role="button" 
							data-icon="forward" data-iconpos="">
								Vérifier ce compte Tela
						</button>
					</div>
					<div id="zone-courriel-confirmation" data-role="fieldcontain" class="hidden">
						<label for="courriel-confirmation">
							<strong class="obligatoire">*</strong> Courriel (confirmation) : 
						</label>
						<input id="courriel-confirmation" name="courriel-confirmation" type="text"/>
					</div>
					<div id="zone-prenom-nom" data-role="fieldcontain" class="hidden">
						<div>
							<label for="nom">Nom :</label>
							<input id="nom-utilisateur" name="nom" type="text"/>
						</div>
						
						<div>
							<label for="prenom">Prénom :</label>
							<input id="prenom-utilisateur" name="prenom" type="text"/>
						</div>
					</div>
					<input type="checkbox" name="courriel-memoire" id="courriel-memoire" checked="checked">
					<label for="courriel-memoire">Se souvenir de moi</label>
						
					<button id="valider-identification" data-role="button" 
						data-icon="check" data-iconpos="right" data-theme="b">
							Valider le formulaire
					</button>
				</div>
			</form>
			<div data-role="footer"></div>
		</div><!-- /page popup -->		
		
		<div id="infos" data-role="page" data-add-back-btn="true" data-back-btn-text="Retour">
			<div data-role="header">
				<h1>Infos</h1>
			</div>
			<div data-role="content">
				<p>
					Développement : 
					<ul>
						<li>Jean-Pascal MILCENT</li>
						<li>Isabelle NEMBROT</li>
					</ul>
					sur une idée originale de Aurélien PERONNET.
				</p>
			</div>
			<div data-role="footer" data-position="fixed">
				<p class="center">
					Icônes par <a href="http://glyphish.com">Joseph Wain - Glyphish</a>. <br />
					© Copyright <span id="annee"></span> - <a href="http://www.tela-botanica.org/site:accueil">Tela Botanica</a>
				</p>
			</div>
		</div>
	</body>
</html>

Rev 1827	Rev 1828
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/cel/widget/modules/saisie/squelettes/mobile/"/>`	4	`<base href="http://www.tela-botanica.org/eflore/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://www.tela-botanica.org/favicon.ico" />`	19	`<link rel="shortcut icon" type="image/x-icon" href="http://www.tela-botanica.org/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">`	34	`<script type="text/javascript">`
35	`//<![CDATA[`	35	`//<![CDATA[`
36	`// Nombre d'observations max autorisé avant transmission`	36	`// Nombre d'observations max autorisé avant transmission`
37	`var OBS_MAX_NBRE = 10;`	37	`var OBS_MAX_NBRE = 10;`
38	`// Délai d'attente avant de lancer la recherche des noms latins en ms`	38	`// Délai d'attente avant de lancer la recherche des noms latins en ms`
39	`var DELAI_RECHERCHE = 500;`	39	`var DELAI_RECHERCHE = 500;`
40	`// Mot-clé du widget/projet`	40	`// Mot-clé du widget/projet`
41	`var TAG_PROJET = "WidgetSaisie";`	41	`var TAG_PROJET = "WidgetSaisie";`
42	`// URL du web service réalisant l'insertion des données dans la base du CEL.`	42	`// URL du web service réalisant l'insertion des données dans la base du CEL.`
43	`var SERVICE_SAISIE_URL = "http://www.tela-botanica.org/service:cel:CelWidgetSaisie";`	43	`var SERVICE_SAISIE_URL = "http://www.tela-botanica.org/service:cel:CelWidgetSaisie";`
44	`//var SERVICE_SAISIE_URL = "http://www.tela-botanica.org/test-service:cel:CelWidgetSaisie";`	44	`//var SERVICE_SAISIE_URL = "http://www.tela-botanica.org/test-service:cel:CelWidgetSaisie";`
45	`// URL du web service annuaire des membres du réseau.`	45	`// URL du web service annuaire des membres du réseau.`
46	`var SERVICE_ANNUAIRE = "http://www.tela-botanica.org/client/annuaire_nouveau/actuelle/jrest/utilisateur/identite-par-courriel/";`	46	`var SERVICE_ANNUAIRE = "http://www.tela-botanica.org/client/annuaire_nouveau/actuelle/jrest/utilisateur/identite-par-courriel/";`
47	`// Squelette d'URL du web service d'eFlore fournissant les noms de communes.`	47	`// Squelette d'URL du web service d'eFlore fournissant les noms de communes.`
48	`var SERVICE_NOM_COMMUNE_URL = "http://www.tela-botanica.org/service:eflore:0.1/osm/nom-commune?lon={lon}&lat={lat}";`	48	`var SERVICE_NOM_COMMUNE_URL = "http://www.tela-botanica.org/service:eflore:0.1/osm/nom-commune?lon={lon}&lat={lat}";`
49	`// Texte en absence de connexion`	49	`// Texte en absence de connexion`
50	`var TEXTE_HORS_LIGNE = 'Aucune connexion.';`	50	`var TEXTE_HORS_LIGNE = 'Aucune connexion.';`
51	`// Texte en absence de compte`	51	`// Texte en absence de compte`
52	`var TEXTE_NON_COMPTE = 'Aucun compte enregistré.';`	52	`var TEXTE_NON_COMPTE = 'Aucun compte enregistré.';`
53	`// Texte en presence de compte`	53	`// Texte en presence de compte`
54	`var TEXTE_OUI_COMPTE = 'Ajouter au compte ';`	54	`var TEXTE_OUI_COMPTE = 'Ajouter au compte ';`
55	`// Texte d'identification des observations`	55	`// Texte d'identification des observations`
56	`var TEXTE_OBS = 'obsId';`	56	`var TEXTE_OBS = 'obsId';`
57	`// Texte d'identification des photos`	57	`// Texte d'identification des photos`
58	`var TEXTE_PHOTO = 'photoId';`	58	`var TEXTE_PHOTO = 'photoId';`
59	`//]]>`	59	`//]]>`
60	`</script>`	60	`</script>`
61	`<script type="text/javascript" src="js/mobile.js"></script>`	61	`<script type="text/javascript" src="js/mobile.js"></script>`
62	`<script type="text/javascript" src="js/bdtfx.js"></script>`	62	`<script type="text/javascript" src="js/bdtfx.js"></script>`
63		63
64	`<!-- Javascript : Jquery Mobile -->`	64	`<!-- Javascript : Jquery Mobile -->`
65	`<script src="http://www.tela-botanica.org/commun/jquery/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>`	65	`<script src="http://www.tela-botanica.org/commun/jquery/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>`
66	`</head>`	66	`</head>`
67		67
68		68
69	`<body data-theme="b">`	69	`<body data-theme="b">`
70	`<div id="menu" data-role="page"> <!--data-add-back-btn="true" data-back-btn-text="Retour"-->`	70	`<div id="menu" data-role="page"> <!--data-add-back-btn="true" data-back-btn-text="Retour"-->`
71	`<div data-role="header">`	71	`<div data-role="header">`
72	`<h1>Accueil</h1>`	72	`<h1>Accueil</h1>`
73	`<a href="#infos" data-icon="info" data-iconpos="notext" class="ui-btn-right">Infos</a>`	73	`<a href="#infos" data-icon="info" data-iconpos="notext" class="ui-btn-right">Infos</a>`
74	`</div>`	74	`</div>`
75	`<div data-role="content" data-theme="g">`	75	`<div data-role="content" data-theme="g">`
76	`<p class="center">`	76	`<p class="center">`
77	`Bienvenue sur le Carnet En Ligne mobile ! <br />`	77	`Bienvenue sur le Carnet En Ligne mobile ! <br />`
78	`</p>`	78	`</p>`
79	`<ul data-role="listview">`	79	`<ul data-role="listview">`
80	`<li>`	80	`<li>`
81	`<img src="http://www.tela-botanica.org/commun/icones/glyphish/187-pencil.png" class="ui-li-icon"/>`	81	`<img src="http://www.tela-botanica.org/commun/icones/glyphish/187-pencil.png" class="ui-li-icon"/>`
82	`<a href="#saisie" class="saisie" data-role="button">1 - Saisir une observation</a>`	82	`<a href="#saisie" class="saisie" data-role="button">1 - Saisir une observation</a>`
83	`</li>`	83	`</li>`
84	`<li>`	84	`<li>`
85	`<img src="http://www.tela-botanica.org/commun/icones/glyphish/179-notepad.png" class="ui-li-icon"/>`	85	`<img src="http://www.tela-botanica.org/commun/icones/glyphish/179-notepad.png" class="ui-li-icon"/>`
86	`<a href="#liste" data-role="button">2 - Voir mes observations</a>`	86	`<a href="#liste" data-role="button">2 - Voir mes observations</a>`
87	`</li>`	87	`</li>`
88	`<li>`	88	`<li>`
89	`<img src="http://www.tela-botanica.org/commun/icones/glyphish/56-cloud.png" class="ui-li-icon"/>`	89	`<img src="http://www.tela-botanica.org/commun/icones/glyphish/56-cloud.png" class="ui-li-icon"/>`
90	`<a href="#transmission" data-role="button">3 - Transmettre mes observations</a>`	90	`<a href="#transmission" data-role="button">3 - Transmettre mes observations</a>`
91	`</li>`	91	`</li>`
92	`<li></li>`	92	`<li></li>`
93	`</ul>`	93	`</ul>`
94	`</div>`	94	`</div>`
95	`<div data-role="footer" data-position="fixed"></div>`	95	`<div data-role="footer" data-position="fixed"></div>`
96	`</div>`	96	`</div>`
97		97
98	`<div id="saisie" data-role="page">`	98	`<div id="saisie" data-role="page">`
99	`<div data-role="header" data-position="inline">`	99	`<div data-role="header" data-position="inline">`
100	`<a href="#menu" data-icon="home" data-iconpos="notext" data-direction="reverse">Accueil</a>`	100	`<a href="#menu" data-icon="home" data-iconpos="notext" data-direction="reverse">Accueil</a>`
101	`<h1>Saisie</h1>`	101	`<h1>Saisie</h1>`
102	`<a href="#infos" data-icon="info" data-iconpos="notext" class="ui-btn-right">Infos</a>`	102	`<a href="#infos" data-icon="info" data-iconpos="notext" class="ui-btn-right">Infos</a>`
103	`</div>`	103	`</div>`
104	`<form id="form-saisie-observation" method="post" action="#">`	104	`<form id="form-saisie-observation" method="post" action="#">`
105	`<div data-role="content">`	105	`<div data-role="content">`
106	`<div id="obs-saisie-infos"></div>`	106	`<div id="obs-saisie-infos"></div>`
107	`<div data-role="fieldcontain">`	107	`<div data-role="fieldcontain">`
108	`<label for="nom">Espèce : </label>`	108	`<label for="nom">Espèce : </label>`
109	`<span id="nom"></span>`	109	`<span id="nom"></span>`
110		110
111	`<br />`	111	`<br />`
112	`<a href="#saisie-popup" id="saisie-popup-btn"`	112	`<a href="#saisie-popup" id="saisie-popup-btn"`
113	`data-role="button" data-icon="search" data-iconpos="right"`	113	`data-role="button" data-icon="search" data-iconpos="right"`
114	`data-rel="dialog" data-transition="pop" data-theme="b">`	114	`data-rel="dialog" data-transition="pop" data-theme="b">`
115	`Changer l'espèce`	115	`Changer l'espèce`
116	`</a>`	116	`</a>`
117	`<hr />`	117	`<hr />`
118		118
119	`<label for="date">`	119	`<label for="date">`
120	`Date :`	120	`Date :`
121	`<span id="date"></span>`	121	`<span id="date"></span>`
122	`</label>`	122	`</label>`
123	`<hr />`	123	`<hr />`
124		124
125	`<button id="geolocaliser"`	125	`<button id="geolocaliser"`
126	`data-role="button" data-icon="refresh" data-iconpos="" data-ajax="false">`	126	`data-role="button" data-icon="refresh" data-iconpos="" data-ajax="false">`
127	`Recalculer ma position`	127	`Recalculer ma position`
128	`</button>`	128	`</button>`
129		129
130	`<label for="lat">`	130	`<label for="lat">`
131	`Latitude :`	131	`Latitude :`
132	`<span id="lat"></span>`	132	`<span id="lat"></span>`
133	`</label>`	133	`</label>`
134		134
135	`<br />`	135	`<br />`
136	`<label for="lng">`	136	`<label for="lng">`
137	`Longitude :`	137	`Longitude :`
138	`<span id="lng"></span>`	138	`<span id="lng"></span>`
139	`</label>`	139	`</label>`
140		140
141	`<br />`	141	`<br />`
142	`<label for="location">`	142	`<label for="location">`
143	`Commune :`	143	`Commune :`
144	`<span id="location"></span>`	144	`<span id="location"></span>`
145	`<input id="code-insee" type="hidden" name="code-insee" />`	145	`<input id="code-insee" type="hidden" name="code-insee" />`
146	`</label>`	146	`</label>`
147		147
148	`<br />`	148	`<br />`
149	`<hr />`	149	`<hr />`
150	`<button id="sauver-obs" data-role="button" data-icon="check">Sauver</button>`	150	`<button id="sauver-obs" data-role="button" data-icon="check">Sauver</button>`
151		151
152	`<input id="referentiel" type="hidden" name="referentiel" />`	152	`<input id="referentiel" type="hidden" name="referentiel" />`
153	`<input id="nom-sci-select" type="hidden" name="nom-sci-select" />`	153	`<input id="nom-sci-select" type="hidden" name="nom-sci-select" />`
154	`<input id="num-nom-select" type="hidden" name="num-nom-select" />`	154	`<input id="num-nom-select" type="hidden" name="num-nom-select" />`
155	`</div>`	155	`</div>`
156	`</div>`	156	`</div>`
157	`<div data-role="footer" data-position="fixed">`	157	`<div data-role="footer" data-position="fixed">`
158	`<div data-role="navbar">`	158	`<div data-role="navbar">`
159	`<ul>`	159	`<ul>`
160	`<li><a href="#liste" data-role="button" data-icon="notepad" data-iconpos="notext">Liste de mes obs.</a></li>`	160	`<li><a href="#liste" data-role="button" data-icon="notepad" data-iconpos="notext">Liste de mes obs.</a></li>`
161	`<li><a href="#transmission" data-role="button" data-icon="cloud" data-iconpos="notext">Transmission</a></li>`	161	`<li><a href="#transmission" data-role="button" data-icon="cloud" data-iconpos="notext">Transmission</a></li>`
162	`</ul>`	162	`</ul>`
163	`</div>`	163	`</div>`
164	`</div>`	164	`</div>`
165	`</form>`	165	`</form>`
166	`</div>`	166	`</div>`
167		167
168	`<div id="saisie-popup" data-role="page" data-history="false" data-close-btn="right">`	168	`<div id="saisie-popup" data-role="page" data-history="false" data-close-btn="right">`
169	`<div data-role="header">`	169	`<div data-role="header">`
170	`<h1></h1>`	170	`<h1></h1>`
171	`</div>`	171	`</div>`
172	`<div data-role="content">`	172	`<div data-role="content">`
173	`<ul id="liste-noms-latins" data-role="listview"`	173	`<ul id="liste-noms-latins" data-role="listview"`
174	`data-inset="true" data-filter="true" data-filter-reveal="true"`	174	`data-inset="true" data-filter="true" data-filter-reveal="true"`
175	`data-filter-placeholder="Trouver une espèce...">`	175	`data-filter-placeholder="Trouver une espèce...">`
176	`</ul>`	176	`</ul>`
177	`<div class="hidden">`	177	`<div class="hidden">`
178	`<button id="recherche-chargement" data-theme="a" data-textonly="true" data-textvisible="true" data-msgtext="Chargement des résultats..." ></button>`	178	`<button id="recherche-chargement" data-theme="a" data-textonly="true" data-textvisible="true" data-msgtext="Chargement des résultats..." ></button>`
179	`</div>`	179	`</div>`
180	`</div>`	180	`</div>`
181	`</div>`	181	`</div>`
182		182
183	`<div id="liste" data-role="page">`	183	`<div id="liste" data-role="page">`
184	`<div data-role="header" data-position="inline">`	184	`<div data-role="header" data-position="inline">`
185	`<a href="#menu" data-icon="home" data-iconpos="notext" data-direction="reverse">Accueil</a>`	185	`<a href="#menu" data-icon="home" data-iconpos="notext" data-direction="reverse">Accueil</a>`
186	`<h1>Observations</h1>`	186	`<h1>Observations</h1>`
187	`<a href="#infos" data-icon="info" data-iconpos="notext" class="ui-btn-right">Infos</a>`	187	`<a href="#infos" data-icon="info" data-iconpos="notext" class="ui-btn-right">Infos</a>`
188	`</div>`	188	`</div>`
189	`<div data-role="content">`	189	`<div data-role="content">`
190	`<div id="obs-suppression-infos"></div>`	190	`<div id="obs-suppression-infos"></div>`
191	`<ul id="liste-obs" data-role="listview" data-split-icon="delete" data-split-theme="g" data-theme="g" data-inset="true"></ul>`	191	`<ul id="liste-obs" data-role="listview" data-split-icon="delete" data-split-theme="g" data-theme="g" data-inset="true"></ul>`
192	`</div>`	192	`</div>`
193	`<div data-role="footer" data-position="fixed">`	193	`<div data-role="footer" data-position="fixed">`
194	`<div data-role="navbar">`	194	`<div data-role="navbar">`
195	`<ul>`	195	`<ul>`
196	`<li><a href="#saisie" class="saisie" data-role="button" data-icon="pencil" data-iconpos="notext">Saisie</a></li>`	196	`<li><a href="#saisie" class="saisie" data-role="button" data-icon="pencil" data-iconpos="notext">Saisie</a></li>`
197	`<li><a href="#transmission" data-role="button" data-icon="cloud" data-iconpos="notext">Transmission</a></li>`	197	`<li><a href="#transmission" data-role="button" data-icon="cloud" data-iconpos="notext">Transmission</a></li>`
198	`</ul>`	198	`</ul>`
199	`</div>`	199	`</div>`
200	`</div>`	200	`</div>`
201	`</div>`	201	`</div>`
202		202
203	`<div id="observation" data-role="page">`	203	`<div id="observation" data-role="page">`
204	`<div data-role="header" data-position="inline">`	204	`<div data-role="header" data-position="inline">`
205	`<a href="#menu" data-icon="home" data-iconpos="notext" data-direction="reverse">Accueil</a>`	205	`<a href="#menu" data-icon="home" data-iconpos="notext" data-direction="reverse">Accueil</a>`
206	`<h1>Détails de l'observation</h1>`	206	`<h1>Détails de l'observation</h1>`
207	`<a href="#liste" data-icon="notepad" data-iconpos="notext" ></a>`	207	`<a href="#liste" data-icon="notepad" data-iconpos="notext" ></a>`
208	`</div>`	208	`</div>`
209	`<div data-role="content">`	209	`<div data-role="content">`
210	`<label for="id-obs">Identifiant :</label> <span id="id-obs"></span>`	210	`<label for="id-obs">Identifiant :</label> <span id="id-obs"></span>`
211	`<div id="details-obs"></div>`	211	`<div id="details-obs"></div>`
212		212
213	`<input type="file" id="pic" name="photos-obs[]" accept="image/*" multiple>`	213	`<input type="file" id="pic" name="photos-obs[]" accept="image/*" multiple>`
214	`<button id="valider-photos"`	214	`<button id="valider-photos"`
215	`data-role="button" data-icon="search" data-iconpos="" data-ajax="false">`	215	`data-role="button" data-icon="search" data-iconpos="" data-ajax="false">`
216	`Ajouter les images sélectionnées`	216	`Ajouter les images sélectionnées`
217	`</button>`	217	`</button>`
218		218
219	`<div data-role="popup" id="cache-plein" class="ui-content" data-position-to="#valider-photos">`	219	`<div data-role="popup" id="cache-plein" class="ui-content" data-position-to="#valider-photos">`
220	`<a href="#" data-rel="back" data-role="button" data-theme="a" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Close</a>`	220	`<a href="#" data-rel="back" data-role="button" data-theme="a" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Close</a>`
221	`<p>`	221	`<p>`
222	`La mémoire de cette application est pleine. <br />`	222	`La mémoire de cette application est pleine. <br />`
223	`Veuillez supprimer des images ou transmettre vos observations.`	223	`Veuillez supprimer des images ou transmettre vos observations.`
224	`</p>`	224	`</p>`
225	`</div>`	225	`</div>`
226		226
227	`<div data-role="popup" id="photo-zoom" class="ui-content">`	227	`<div data-role="popup" id="photo-zoom" class="ui-content">`
228	`<span id="photo-zoom-infos"></span>`	228	`<span id="photo-zoom-infos"></span>`
229	`<button data-role="button" data-theme="a" onclick="$('#photo-zoom').popup('close');">`	229	`<button data-role="button" data-theme="a" onclick="$('#photo-zoom').popup('close');">`
230	`Fermer cet aperçu`	230	`Fermer cet aperçu`
231	`</button>`	231	`</button>`
232	`</div>`	232	`</div>`
233		233
234	`<div id="photo-suppression-infos"></div>`	234	`<div id="photo-suppression-infos"></div>`
235	`<ul id="photos-obs" data-role="listview" data-inset="true"></ul>`	235	`<ul id="photos-obs" data-role="listview" data-inset="true"></ul>`
236	`<canvas id="photo-canvas" class="hidden"></canvas>`	236	`<canvas id="photo-canvas" class="hidden"></canvas>`
237	`</div>`	237	`</div>`
238	`<div data-role="footer" data-position="fixed">`	238	`<div data-role="footer" data-position="fixed">`
239	`<div data-role="navbar">`	239	`<div data-role="navbar">`
240	`<ul>`	240	`<ul>`
241	`<li><a href="#saisie" class="saisie" data-role="button" data-icon="pencil" data-iconpos="notext">Saisie</a></li>`	241	`<li><a href="#saisie" class="saisie" data-role="button" data-icon="pencil" data-iconpos="notext">Saisie</a></li>`
242	`<li><a href="#liste" data-role="button" data-icon="notepad" data-iconpos="notext">Liste de mes obs.</a></li>`	242	`<li><a href="#liste" data-role="button" data-icon="notepad" data-iconpos="notext">Liste de mes obs.</a></li>`
243	`</ul>`	243	`</ul>`
244	`</div>`	244	`</div>`
245	`</div>`	245	`</div>`
246	`</div>`	246	`</div>`
247		247
248	`<div id="transmission" data-role="page">`	248	`<div id="transmission" data-role="page">`
249	`<div data-role="header">`	249	`<div data-role="header">`
250	`<a href="#menu" data-icon="home" data-iconpos="notext" data-direction="reverse">Accueil</a>`	250	`<a href="#menu" data-icon="home" data-iconpos="notext" data-direction="reverse">Accueil</a>`
251	`<h1>Transmission</h1>`	251	`<h1>Transmission</h1>`
252	`<a href="#infos" data-icon="info" data-iconpos="notext" class="ui-btn-right">Infos</a>`	252	`<a href="#infos" data-icon="info" data-iconpos="notext" class="ui-btn-right">Infos</a>`
253	`</div>`	253	`</div>`
254	`<div data-role="content" data-theme="d">`	254	`<div data-role="content" data-theme="d">`
255	`<p>`	255	`<p>`
256	`<span id="identification-texte">`	256	`<span id="identification-texte">`
257	`Ajouter au compte`	257	`Ajouter au compte`
258	`</span>`	258	`</span>`
259	`<strong><span id="utilisateur-compte"></span></strong>`	259	`<strong><span id="utilisateur-compte"></span></strong>`
260	`</p>`	260	`</p>`
261	`<a href="#identification-popup" id="identification-btn"`	261	`<a href="#identification-popup" id="identification-btn"`
262	`data-role="button" data-icon="grid" data-iconpos="right"`	262	`data-role="button" data-icon="grid" data-iconpos="right"`
263	`data-rel="dialog" data-transition="pop" data-theme="b">`	263	`data-rel="dialog" data-transition="pop" data-theme="b">`
264	`Modifier le compte`	264	`Modifier le compte`
265	`</a>`	265	`</a>`
266	`<div id="identification-infos"></div>`	266	`<div id="identification-infos"></div>`
267	`<hr />`	267	`<hr />`
268	`<button data-role="button" data-icon="cloud-black" id="transmettre-obs" >`	268	`<button data-role="button" data-icon="cloud-black" id="transmettre-obs" >`
269	`Transmettre`	269	`Transmettre`
270	`</button>`	270	`</button>`
271	`</div>`	271	`</div>`
272	`<div data-role="footer" data-position="fixed">`	272	`<div data-role="footer" data-position="fixed">`
273	`<div data-role="navbar">`	273	`<div data-role="navbar">`
274	`<ul>`	274	`<ul>`
275	`<li><a href="#saisie" class="saisie" data-role="button" data-icon="pencil" data-iconpos="notext">Saisie</a></li>`	275	`<li><a href="#saisie" class="saisie" data-role="button" data-icon="pencil" data-iconpos="notext">Saisie</a></li>`
276	`<li><a href="#liste" data-role="button" data-icon="notepad" data-iconpos="notext">Liste de mes obs.</a></li>`	276	`<li><a href="#liste" data-role="button" data-icon="notepad" data-iconpos="notext">Liste de mes obs.</a></li>`
277	`</ul>`	277	`</ul>`
278	`</div>`	278	`</div>`
279	`</div>`	279	`</div>`
280	`</div>`	280	`</div>`
281		281
282	`<div id="identification-popup" data-role="page" data-history="false" data-close-btn="right">`	282	`<div id="identification-popup" data-role="page" data-history="false" data-close-btn="right">`
283	`<div data-role="header">`	283	`<div data-role="header">`
284	`<h1>Compte Tela Botanica</h1>`	284	`<h1>Compte Tela Botanica</h1>`
285	`</div>`	285	`</div>`
286	`<form id="form-transmission" method="post" action="#">`	286	`<form id="form-transmission" method="post" action="#">`
287	`<div data-role="content">`	287	`<div data-role="content">`
288	`<div data-role="fieldcontain">`	288	`<div data-role="fieldcontain">`
289	`<label for="courriel">Courriel * :</label>`	289	`<label for="courriel">Courriel * :</label>`
290	`<input id="courriel" type="email" name="courriel"/>`	290	`<input id="courriel" type="email" name="courriel"/>`
291	`<input id="id-utilisateur" name="id-utilisateur" type="hidden"/>`	291	`<input id="id-utilisateur" name="id-utilisateur" type="hidden"/>`
292		292
293	`<button id="valider-courriel" data-role="button"`	293	`<button id="valider-courriel" data-role="button"`
294	`data-icon="forward" data-iconpos="">`	294	`data-icon="forward" data-iconpos="">`
295	`Vérifier ce compte Tela`	295	`Vérifier ce compte Tela`
296	`</button>`	296	`</button>`
297	`</div>`	297	`</div>`
298	`<div id="zone-courriel-confirmation" data-role="fieldcontain" class="hidden">`	298	`<div id="zone-courriel-confirmation" data-role="fieldcontain" class="hidden">`
299	`<label for="courriel-confirmation">`	299	`<label for="courriel-confirmation">`
300	`<strong class="obligatoire">*</strong> Courriel (confirmation) :`	300	`<strong class="obligatoire">*</strong> Courriel (confirmation) :`
301	`</label>`	301	`</label>`
302	`<input id="courriel-confirmation" name="courriel-confirmation" type="text"/>`	302	`<input id="courriel-confirmation" name="courriel-confirmation" type="text"/>`
303	`</div>`	303	`</div>`
304	`<div id="zone-prenom-nom" data-role="fieldcontain" class="hidden">`	304	`<div id="zone-prenom-nom" data-role="fieldcontain" class="hidden">`
305	`<div>`	305	`<div>`
306	`<label for="nom">Nom :</label>`	306	`<label for="nom">Nom :</label>`
307	`<input id="nom-utilisateur" name="nom" type="text"/>`	307	`<input id="nom-utilisateur" name="nom" type="text"/>`
308	`</div>`	308	`</div>`
309		309
310	`<div>`	310	`<div>`
311	`<label for="prenom">Prénom :</label>`	311	`<label for="prenom">Prénom :</label>`
312	`<input id="prenom-utilisateur" name="prenom" type="text"/>`	312	`<input id="prenom-utilisateur" name="prenom" type="text"/>`
313	`</div>`	313	`</div>`
314	`</div>`	314	`</div>`
315	`<input type="checkbox" name="courriel-memoire" id="courriel-memoire" checked="checked">`	315	`<input type="checkbox" name="courriel-memoire" id="courriel-memoire" checked="checked">`
316	`<label for="courriel-memoire">Se souvenir de moi</label>`	316	`<label for="courriel-memoire">Se souvenir de moi</label>`
317		317
318	`<button id="valider-identification" data-role="button"`	318	`<button id="valider-identification" data-role="button"`
319	`data-icon="check" data-iconpos="right" data-theme="b">`	319	`data-icon="check" data-iconpos="right" data-theme="b">`
320	`Valider le formulaire`	320	`Valider le formulaire`
321	`</button>`	321	`</button>`
322	`</div>`	322	`</div>`
323	`</form>`	323	`</form>`
324	`<div data-role="footer"></div>`	324	`<div data-role="footer"></div>`
325	`</div><!-- /page popup -->`	325	`</div><!-- /page popup -->`
326		326
327	`<div id="infos" data-role="page" data-add-back-btn="true" data-back-btn-text="Retour">`	327	`<div id="infos" data-role="page" data-add-back-btn="true" data-back-btn-text="Retour">`
328	`<div data-role="header">`	328	`<div data-role="header">`
329	`<h1>Infos</h1>`	329	`<h1>Infos</h1>`
330	`</div>`	330	`</div>`
331	`<div data-role="content">`	331	`<div data-role="content">`
332	`<p>`	332	`<p>`
333	`Développement :`	333	`Développement :`
334	`<ul>`	334	`<ul>`
335	`<li>Jean-Pascal MILCENT</li>`	335	`<li>Jean-Pascal MILCENT</li>`
336	`<li>Isabelle NEMBROT</li>`	336	`<li>Isabelle NEMBROT</li>`
337	`</ul>`	337	`</ul>`
338	`sur une idée originale de Aurélien PERONNET.`	338	`sur une idée originale de Aurélien PERONNET.`
339	`</p>`	339	`</p>`
340	`</div>`	340	`</div>`
341	`<div data-role="footer" data-position="fixed">`	341	`<div data-role="footer" data-position="fixed">`
342	`<p class="center">`	342	`<p class="center">`
343	`Icônes par <a href="http://glyphish.com">Joseph Wain - Glyphish</a>. <br />`	343	`Icônes par <a href="http://glyphish.com">Joseph Wain - Glyphish</a>. <br />`
344	`© Copyright <span id="annee"></span> - <a href="http://www.tela-botanica.org/site:accueil">Tela Botanica</a>`	344	`© Copyright <span id="annee"></span> - <a href="http://www.tela-botanica.org/site:accueil">Tela Botanica</a>`
345	`</p>`	345	`</p>`
346	`</div>`	346	`</div>`
347	`</div>`	347	`</div>`
348	`</body>`	348	`</body>`
349	`</html>`	349	`</html>`

Subversion Repositories eFlore/Applications.cel

(root)/trunk/widget/modules/saisie/squelettes/mobile/mobile.tpl.html @ 3646 – Rev 1827 → 1828