1,8 → 1,5 |
<?php |
|
?> |
<!DOCTYPE html> |
<html lang="fr"> |
<html lang="fr" manifest="mobile.appcache"> |
<head> |
<title>CEL Mobile</title> |
|
13,7 → 10,7 |
|
<meta name="revisit-after" content="15 days" /> |
<meta name="robots" content="index,follow" /> |
<meta name="author" content="Jean-Pascal MILCENT, Mathilde SALTHUN-LASSALLE" /> |
<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" /> |
|
35,31 → 32,33 |
<!-- Javascript : appli saisie --> |
<script type="text/javascript"> |
//<![CDATA[ |
//$url_base = "http://www.tela-botanica.org/widget-test:cel:"; |
// manifest="<?=$url_base?>modules/saisie/squelettes/mobile/mobile.appcache"; |
// La présence du parametre 'debug' dans l'URL enclenche le dégogage |
var DEBUG = <?=isset($_GET['debug']) ? 'true' : 'false'?>; |
// 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/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}"; |
// URL de l'icône du calendrier |
var PAS_DE_PHOTO_ICONE_URL = "http://www.tela-botanica.org/widget-test:cel:modules/saisie/squelettes/defaut/img/icones/pasdephoto.png"; |
// Texte en absence de connexion |
var TEXTE_HORS_LIGNE = "Aucune 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"; |
var TEXTE_OBS = 'obsId'; |
// Texte d'identification des photos |
var TEXTE_PHOTO = "photoId"; |
var TEXTE_PHOTO = 'photoId'; |
//]]> |
</script> |
<script type="text/javascript" src="http://162.38.234.16/cel/widget/modules/saisie/squelettes/mobile/js/mobile.js"></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> |
67,77 → 66,63 |
|
|
<body data-theme="b"> |
<div id="menu" data-role="page" data-add-back-btn="true" data-back-btn-text="Retour"> |
<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">Saisir une observation</a> |
<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">Voir mes observations</a> |
<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">Transmettre mes observations</a> |
<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 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="#liste" data-icon="notepad" data-iconpos="notext">Liste des obs</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="#"> |
<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> |
<input id="nom" type="text" name="nom" value="<?=$_GET['nom_sci']?>" /> |
<!-- |
<div data-role="fieldcontain"> |
<ul data-role="listview" style="height:120px; overflow:scroll; width: 90%" data-filter="true" data-filter-reveal="true" data-filter-placeholder="Search cars..."> |
<li><a href="#">Acura</a></li> |
<li><a href="#">Audi</a></li> |
<li><a href="#">BMW</a></li> |
<li><a href="#">Cadillac</a></li> |
<li><a href="#">Chrysler</a></li> |
<li><a href="#">Dodge</a></li> |
<li><a href="#">Ferrari</a></li> |
<li><a href="#">Ford</a></li> |
<li><a href="#">GMC</a></li> |
<li><a href="#">Honda</a></li> |
<li><a href="#">Hyundai</a></li> |
<li><a href="#">Infiniti</a></li> |
<li><a href="#">Jeep</a></li> |
<li><a href="#">Kia</a></li> |
<li><a href="#">Lexus</a></li> |
<li><a href="#">Mini</a></li> |
<li><a href="#">Nissan</a></li> |
<li><a href="#">Porsche</a></li> |
<li><a href="#">Subaru</a></li> |
<li><a href="#">Toyota</a></li> |
<li><a href="#">Volkswagen</a></li> |
<li><a href="#">Volvo</a></li> |
</ul> |
</div> |
--> |
<label for="date">Date :</label> |
<input id="date" type="text" name="date" /> |
<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="search" data-iconpos="" data-ajax="false"> |
data-role="button" data-icon="refresh" data-iconpos="" data-ajax="false"> |
Recalculer ma position |
</button> |
|
156,15 → 141,16 |
<label for="location"> |
Commune : |
<span id="location"></span> |
<input id="code_insee" type="hidden" name="code_insee" /> |
<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" value="<?=$_GET['ref']?>"/> |
<input id="nom_sci_select" type="hidden" name="nom_sci_select" value="<?=$_GET['nom_sci']?>"/> |
<input id="num_nom_select" type="hidden" name="num_nom_select" value="<?=$_GET['num_nom']?>"/> |
<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"> |
178,15 → 164,30 |
</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> |
<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"> |
198,24 → 199,40 |
</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> |
<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" |
<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> |
<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"> |
227,65 → 244,90 |
</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="#liste" data-icon="notepad" data-iconpos="notext">Observations</a> --> |
<a href="#infos" data-icon="info" data-iconpos="notext" class="ui-btn-right">Infos</a> |
</div> |
<form id="form_transmission" method="post" action="#"> |
<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"/> |
<input id="id-utilisateur" name="id-utilisateur" type="hidden"/> |
|
<input type="checkbox" name="courriel_memoire" id="courriel_memoire" checked="checked"> |
<label for="courriel_memoire">Se souvenir de moi</label> |
<button id="valider_courriel" |
data-role="button" data-icon="search" data-iconpos="" data-ajax="false"> |
Valider cet email |
<button id="valider-courriel" data-role="button" |
data-icon="forward" data-iconpos=""> |
Vérifier ce compte Tela |
</button> |
</div> |
<div id="zone_prenom_nom" data-role="fieldcontain" class="hidden"> |
<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="prenom">Prénom :</label> |
<input id="prenom_utilisateur" name="prenom" type="text"/> |
<label for="nom">Nom :</label> |
<input id="nom-utilisateur" name="nom" type="text"/> |
</div> |
|
<div> |
<label for="nom">Nom :</label> |
<input id="nom_utilisateur" name="nom" type="text"/> |
<label for="prenom">Prénom :</label> |
<input id="prenom-utilisateur" name="prenom" type="text"/> |
</div> |
</div> |
<div id="zone_courriel_confirmation" data-role="fieldcontain" class="hidden"> |
<label for="courriel_confirmation"> |
<strong class="obligatoire">*</strong> Courriel (confirmation) : <br /> |
</label> |
<input id="courriel_confirmation" name="courriel_confirmation" type="text"/> |
</div> |
<button data-role="button" data-icon="cloud-black" onclick="transmettreObs();" >Transmettre</button> |
<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> |
<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> |
</form> |
</div> |
|
<div data-role="footer"></div> |
</div><!-- /page popup --> |
|
<div id="infos" data-role="page"> |
<div id="infos" data-role="page" data-add-back-btn="true" data-back-btn-text="Retour"> |
<div data-role="header"> |
<a href="#menu" data-icon="home" data-iconpos="notext" data-direction="reverse">Accueil</a> |
<h1>Infos</h1> |
</div> |
<div data-role="content"> |
<p>Icônes par <a href="http://glyphish.com">Joseph Wain - Glyphish</a>.</p> |
<p> |
Développement : |
<ul> |
296,7 → 338,10 |
</p> |
</div> |
<div data-role="footer" data-position="fixed"> |
<p>© Copyright <span id="annee"></span> - <a href="http://www.tela-botanica.org/site:accueil">Tela Botanica</a></p> |
<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> |