Subversion Repositories eFlore/Applications.cel

Compare Revisions

Ignore whitespace Rev 1551 → Rev 1552

/trunk/widget/modules/saisie/squelettes/mobile/css/mobile.css
12,11 → 12,18
}
.ui-icon-cloud{
background:url(http://www.tela-botanica.org/commun/icones/glyphish/56-cloud-white.png) no-repeat;
}.ui-icon-cloud-black{
background:url(http://www.tela-botanica.org/commun/icones/glyphish/56-cloud.png) no-repeat;
}
.ui-icon-radar{
background:url(http://www.tela-botanica.org/commun/icones/glyphish/73-radar-white.png) no-repeat;
}
/*+--------------------------------------------------------------------------------------------------------+*/
.ui-header, .ui-footer, .ui-navbar .ui-btn-inner {
border: 1px solid #90B83B;
background: #90B83B;
}
 
/* Formulaire à l'application */
#conteneur_reponse{
display:none;
27,4 → 34,8
text-align:center;
font-size:1.2 em;
font-weight:bold;
}
}
 
.hidden {
visibility: hidden;
}
/trunk/widget/modules/saisie/squelettes/mobile/mobile.tpl.html
1,9 → 1,8
<?php
$annee = date('Y');
$aujourdhui = date('d/m/Y');
 
?>
<!DOCTYPE html>
<html lang="fr" manifest="<?=$url_base?>modules/saisie/squelettes/mobile/mobile.appcache">
<html lang="fr">
<head>
<title>CEL Mobile</title>
23,10 → 22,12
<!-- 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.1.0-rc.1/jquery.mobile-1.1.0-rc.1.min.css" />
<link href="<?=$url_base?>modules/saisie/squelettes/mobile/css/<?=isset($_GET['style']) ? $_GET['style'] : 'mobile'?>.css" rel="stylesheet" type="text/css" media="screen" />
<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://162.38.234.16/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>
34,29 → 35,48
<!-- 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;
// 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";
// 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.";
// Texte d'identification des observations
var TEXTE_OBS = "obsId";
// Texte d'identification des photos
var TEXTE_PHOTO = "photoId";
//]]>
</script>
<script type="text/javascript" src="<?=$url_base?>modules/saisie/squelettes/mobile/js/mobile.js"></script>
<script type="text/javascript" src="http://162.38.234.16/cel/widget/modules/saisie/squelettes/mobile/js/mobile.js"></script>
<!-- Javascript : Jquery Mobile -->
<script src="http://www.tela-botanica.org/commun/jquery/mobile/1.1.0-rc.1/jquery.mobile-1.1.0-rc.1.min.js"></script>
<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">
<?php if($titre == 'defaut' ) { ?>
<h1>Accueil</h1>
<?php } else { ?>
<h1><?= $titre ?></h1>
<?php } ?>
<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">
<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" data-role="button">Saisir une observation</a>
<a href="#saisie" class="saisie" data-role="button">Saisir une observation</a>
</li>
<li>
<img src="http://www.tela-botanica.org/commun/icones/glyphish/179-notepad.png" class="ui-li-icon"/>
69,46 → 89,96
</ul>
</div>
<div data-role="footer" data-position="fixed">
<a href="#infos" data-role="button">Infos</a>
</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="#liste" data-icon="notepad" data-iconpos="notext">Liste des obs</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="location">Commune :</label>
<input type="text" name="location" id="location"/>
-->
<button id="geolocaliser" data-role="button" data-icon="search" data-iconpos="">Trouver ma position</button>
<label for="lat">Latitude :</label>
<input id="lat" type="text" name="lat"/>
<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="lng">Longitude :</label>
<input id="lng" type="text" name="lng"/>
<button id="geolocaliser"
data-role="button" data-icon="search" data-iconpos="" data-ajax="false">
Recalculer ma position
</button>
<label for="date">Date :</label>
<input id="date" type="text" name="date" value="<?=$aujourdhui?>"/>
<label for="lat">
Latitude :
<span id="lat"></span>
</label>
<label for="nom">Espece :</label>
<input id="nom" type="text" name="nom"/>
<br />
<label for="lng">
Longitude :
<span id="lng"></span>
</label>
<input id="num_nom" type="hidden" name="num_nom"/>
<br />
<label for="location">
Commune :
<span id="location"></span>
<input id="code_insee" type="hidden" name="code_insee" />
</label>
<br />
<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']?>"/>
</div>
</div>
<div data-role="footer" data-position="fixed">
<button id="sauver-obs" data-role="button" data-icon="check">Sauver</button>
<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="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>
115,12 → 185,13
<h1>Observations</h1>
</div>
<div data-role="content">
<ul id="liste-obs" data-role="listview" data-split-icon="delete" data-split-theme="g" data-theme="g" data-inset="true"></ul>
<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" data-role="button" data-icon="pencil" data-iconpos="notext">Saisie</a></li>
<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>
127,24 → 198,86
</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>
</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 id="photo-suppression-infos"></div>
<ul id="photos_obs" data-role="listview" 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="#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="#saisie" data-icon="notepad" data-iconpos="notext">Saisie</a>
<!-- <a href="#liste" data-icon="notepad" data-iconpos="notext">Observations</a> -->
</div>
<form id="form-transmission" method="post" action="#">
<form id="form_transmission" method="post" action="#">
<div data-role="content">
<div data-role="fieldcontain">
<label for="courriel">Courriel :</label>
<label for="courriel">Courriel * :</label>
<input id="courriel" type="email" name="courriel"/>
<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>
</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"/>
</div>
<div>
<label for="nom">Nom :</label>
<input id="nom_utilisateur" name="nom" 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>
</div>
<div data-role="footer" data-position="fixed">
<button data-role="button" data-icon="cloud">Transmettre</button>
<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 id="infos" data-role="page">
<div data-role="header">
153,10 → 286,18
</div>
<div data-role="content">
<p>Icônes par <a href="http://glyphish.com">Joseph Wain - Glyphish</a>.</p>
<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>©Copyright <?=$annee?> - <a href="http://www.tela-botanica.org/site:accueil">Tela Botanica</a></p>
<p>© Copyright <span id="annee"></span> - <a href="http://www.tela-botanica.org/site:accueil">Tela Botanica</a></p>
</div>
</div>
</body>
</html>
</html>
/trunk/widget/modules/saisie/squelettes/mobile/mobile.appcache
2,13 → 2,12
# v2 - 2012-03-28
# Fichier Manifest pour le cache du widget Mobile.
CACHE:
http://localhost/eflore/applications/cel-widget_cisaille/modules/saisie/squelettes/mobile/css/mobile.css
http://localhost/eflore/applications/cel-widget_cisaille/modules/saisie/squelettes/mobile/js/mobile.js
http://162.38.234.16/cel/widget/modules/saisie/squelettes/mobile/css/mobile.css
http://162.38.234.16/cel/widget/modules/saisie/squelettes/mobile/js/mobile.js
http://www.tela-botanica.org/favicon.ico
http://www.tela-botanica.org/commun/jquery/mobile/1.1.0-rc.1/jquery.mobile-1.1.0-rc.1.min.css
http://www.tela-botanica.org/commun/jquery/mobile/1.1.0-rc.1/images/*
http://www.tela-botanica.org/commun/jquery/mobile/1.3.1/jquery.mobile-1.3.1.min.css
http://www.tela-botanica.org/commun/jquery/1.7.1/jquery-1.7.1.min.js
http://www.tela-botanica.org/commun/jquery/mobile/1.1.0-rc.1/jquery.mobile-1.1.0-rc.1.min.js
http://www.tela-botanica.org/commun/jquery/mobile/1.3.1/jquery.mobile-1.3.1.min.js
http://www.tela-botanica.org/commun/icones/glyphish/187-pencil.png
http://www.tela-botanica.org/commun/icones/glyphish/179-notepad.png
http://www.tela-botanica.org/commun/icones/glyphish/56-cloud.png
/trunk/widget/modules/saisie/squelettes/mobile/js/mobile.js
1,114 → 1,574
//+----------------------------------------------------------------------------------------------------------+
// Initialisation de Jquery mobile
$(document).bind("mobileinit", function(){
$.mobile.defaultPageTransition = "fade";
$(document).bind('mobileinit', function() {
$.mobile.defaultPageTransition = 'fade';
});
 
$(document).on('online', function(event) {
console.log('online');
miseAJourObs();
});
//+----------------------------------------------------------------------------------------------------------+
// Géolocalisation
var gps = navigator.geolocation;
 
// Gestion des paramètres URL
$.urlParam = function(name){
var results = new RegExp('[\\?&]' + name + '=([^&#]*)').exec(window.location.href);
return decodeURIComponent(results[1]) || 0;
}
function recupererParametresUrl() {
$('#referentiel').val($.urlParam('ref'));
$('#nom').val($.urlParam('nom_sci'));
$('#nom-sci-select').val($.urlParam('nom_sci'));
$('#num-nom-select').val($.urlParam('num_nom'));
}
$(document).ready(function() {
$('#geolocaliser').on('click', geolocaliser);
$('body').on('pageshow', '#saisie', function(event) {
obtenirPosition(event);
recupererParametresUrl();
});
$('#geolocaliser').on('click', obtenirPosition);
$('body').on('pageshow', '#infos', obtenirDate);
});
//+----------------------------------------------------------------------------------------------------------+
// Géolocalisation et date du jour
var gps = navigator.geolocation;
 
function geolocaliser(event) {
function obtenirPosition(event) {
event.stopImmediatePropagation();
event.stopPropagation();
event.preventDefault();
obtenirDate();
geolocaliser();
}
function geolocaliser() {
if (gps) {
navigator.geolocation.getCurrentPosition(surSuccesGeoloc, surErreurGeoloc);
} else {
var erreur = {code:'0', message:'Géolocalisation non supportée par le navigateur'};
var erreur = {code:'0', message: 'Géolocalisation non supportée par le navigateur'};
surErreurGeoloc(erreur);
}
event.stopPropagation();
event.preventDefault();
}
function surSuccesGeoloc(position){
if (position){
var lat = position.coords.latitude;
var lng = position.coords.longitude;
$('#lat').val(lat);
$('#lng').val(lng);
}
if (position) {
var lat = position.coords.latitude;
var lng = position.coords.longitude;
$('#lat').html(lat);
$('#lng').html(lng);
 
console.log('Geolocation SUCCESS');
var url_service = SERVICE_NOM_COMMUNE_URL;
var urlNomCommuneFormatee = url_service.replace('{lat}', lat).replace('{lon}', lng);
var jqxhr = $.getJSON(urlNomCommuneFormatee, function(data) {
console.log('NOM_COMMUNE found.');
$('#location').html(data['nom']);
$('#code_insee').val(data['codeINSEE']);
})
.complete(function() {
var texte = ($('#location').html() == '') ? TEXTE_HORS_LIGNE : $('#location').html();
$('#location').html(texte);
})
;
}
}
function surErreurGeoloc(error){
alert("Echec de la géolocalisation, code: " + error.code + " message: "+ error.message);
alert('Echec de la géolocalisation, code: ' + error.code + ' message: '+ error.message);
}
 
function obtenirDate() {
var d = new Date();
var jour = d.getDate();
var mois = d.getMonth()+1;
var annee = d.getFullYear();
var aujourdhui =
( (''+jour).length < 2 ? '0' : '') + jour + '/' +
( (''+mois).length < 2 ? '0' : '') + mois + '/' +
annee;
$('#date').val(aujourdhui);
$('#annee').html(annee);
}
//+----------------------------------------------------------------------------------------------------------+
// Local Storage
var bdd = window.localStorage;
bdd.clear();
$(document).ready(function() {
$('#sauver-obs').on('click', ajouterObs);
$('#valider_photos').on('click', ajoutPhoto);
$('body').on('pageshow', '#liste', chargerListeObs);
$('body').on('pageshow', '#transmission', miseAJourObs);
});
 
var bdd = window.localStorage,
index_obs = (bdd.getItem('index_obs') == null) ? 1 : bdd.getItem('index_obs'),
index_photos = (bdd.getItem('index_photos') == null) ? 1 : bdd.getItem('index_photos');
alert('space used:'+JSON.stringify(bdd).length);
//bdd.clear();
 
console.log(bdd);
function ajouterObs(event) {
var obs = {num:0, date:'', lat:'', lng:'', nom:''};
obs.num = (bdd.length + 1);
obs.date = $('#date').val();
obs.lat = $('#lat').val();
obs.lng = $('#lng').val();
obs.nom = $('#nom').val();
var cle = 'obs'+obs.num;
if ($('#nom').val() != '') {
var obs = {
num:TEXTE_OBS,
maj:0,
date:'',
referentiel:'',
lat:'', lng:'',
commune:'', code_insee: 0,
nom:'',
nom_sci_selec:'',
nn_select:'',
nom_sci_retenu:'',
nn_retenu:'',
num_taxon:'',
famille:''
};
obs.num += index_obs++;
obs.date = $('#date').val();
obs.referentiel = $('#referentiel').val();
obs.lat = $('#lat').html();
obs.lng = $('#lng').html();
obs.commune = $('#location').html();
obs.code_insee = $('#code_insee').val();
obs.nom = $('#nom').val();
obs.referentiel = $('#referentiel').val();
obs.nom_sci_selec = $('#nom_sci_select').val();
obs.nn_select = $('#num_nom_select').val();
var cle = obs.num;
sauvegarderObs(cle, obs);
bdd.setItem('index_obs', index_obs);
/*
var txt = 'Observation n°'+obs.num+'/'+bdd.length+' créée';
$('#obs-saisie-infos').html('<p class="reponse ui-btn-inner ui-btn-corner-all">'+txt+'</p>')
.fadeIn("slow")
.delay(1600)
.fadeOut("slow");
*/
$.mobile.changePage('#liste');
effacerFormulaire();
event.stopPropagation();
event.preventDefault();
} else {
$.mobile.changePage('#saisie');
event.stopPropagation();
event.preventDefault();
}
}
 
function sauvegarderObs(cle, obs) {
var val = JSON.stringify(obs);
 
alert('space used:'+JSON.stringify(bdd).length+'_'+(JSON.stringify(bdd).length+val.length));
bdd.setItem(cle, val);
}
 
function effacerFormulaire() {
$('#lat').html('');
$('#lng').html('');
$('#location').html('');
}
 
function chargerListeObs() {
$('#liste_obs').empty();
var txt = 'Observation n°'+obs.num+'/'+bdd.length+' créée';
$('#obs-saisie-infos').html('<p class="reponse ui-btn-inner ui-btn-corner-all">'+txt+'</p>')
.fadeIn("slow")
var nbre = bdd.length;
for (var i = 0; i < nbre; i++) {
var cle = bdd.key(i);
if (cle.indexOf(TEXTE_OBS) !== -1) {
var obs = JSON.parse(bdd.getItem(cle));
console.log(obs);
$('#liste_obs').prepend(
'<li>'+
obs.num + ' (Nbre photos : ' + compterPhotos(obs.num) + ')<br />' +
'<a href="#" onclick="detailsObs(this);" data-split-icon="next" data-split-theme="a" title="Voir la fiche" data-obs-num="'+obs.num+'">'+
'<strong>'+obs.nom+'</strong> <br />'+obs.date+' à '+obs.commune+
'</a>'+
'<a href="#" onclick="supprimerObs(this);" title="Supprimer l\'observation" ' +
'data-obs-num="'+obs.num+'">'+
'Supprimer'+
'</a>'+
'</li>'
);
}
$('#liste_obs').listview('refresh');
}
}
 
function compterPhotos(num_obs) {
var compteur = 0;
if (num_obs != '') {
var nbre = bdd.length;
for (var i = 0; i < nbre; i++) {
var cle = bdd.key(i);
if (cle.indexOf(TEXTE_PHOTO) !== -1) {
var photo = JSON.parse(bdd.getItem(cle));
if (photo.parent == num_obs) {
compteur++;
}
}
}
}
return compteur;
}
 
function supprimerObs(data) {
var cle_obs = data.getAttribute('data-obs-num'),
obs = JSON.parse(bdd.getItem(cle_obs)),
nbre = bdd.length,
a_supprimer = new Array();
for (var i = 0; i < nbre; i++) {
var cle = bdd.key(i);
if (cle.indexOf(TEXTE_PHOTO) !== -1) {
var photo = JSON.parse(bdd.getItem(cle));
if (photo.parent == obs.num) {
a_supprimer.push(photo.num);
}
}
}
for (var c = 0; c < a_supprimer.length; c++) {
bdd.removeItem(a_supprimer[c]);
}
bdd.removeItem(cle_obs);
var txt = obs.num + ' supprimée.';
$('#obs-suppression-infos').html('<p class="reponse ui-btn-inner ui-btn-corner-all">'+txt+'</p>')
.fadeIn(0)
.delay(1600)
.fadeOut("slow");
.fadeOut('slow');
event.stopPropagation();
event.preventDefault();
chargerListeObs();
}
 
function supprimerObs(event) {
var cle = 'obs'+obs.num;
bdd.removeItem(cle);
function detailsObs(data) {
var num_obs = data.getAttribute('data-obs-num');
var obs = JSON.parse(bdd.getItem(num_obs));
$('#id_obs').html(obs.num);
var txt = 'Observation n°'+obs.num+' supprimée';
$('#obs-saisie-infos').html('<p class="reponse ui-btn-inner ui-btn-corner-all">'+txt+'</p>')
.fadeIn("slow")
var texte = '<strong>' + obs.nom + '</strong> vue le ' + obs.date;
texte += (obs.commune == TEXTE_HORS_LIGNE || obs.commune == '') ? '' : ' <br /> à ' + obs.commune;
$('#details_obs').html(texte);
$.mobile.changePage('#observation');
afficherPhotos(obs.num);
}
 
function ajoutPhoto() {
var id_obs = $('#id_obs').html();
if (id_obs != '') {
$.each($('#pic').get(0).files, function(index, valeur) {
var reader = new FileReader(),
binary, base64;
reader.addEventListener('loadend', function (evt) {
binary = reader.result; // binary data (stored as string), unsafe for most actions
base64 = btoa(binary); // base64 data, safer but takes up more memory
var photo = {
num:TEXTE_PHOTO,
nom: '',
parent:'',
base64:0
};
photo.num += index_photos++;
photo.nom = valeur.name;
photo.parent = id_obs;
photo.base64 = base64;
var cle = photo.num;
sauvegarderObs(cle, photo);
bdd.setItem('index_photos', index_photos);
afficherPhotos(id_obs);
}, false);
reader.readAsBinaryString(valeur);
});
}
}
 
function afficherPhotos(num_obs) {
$('#pic').val('');
$('#photos_obs').empty();
if (num_obs != '') {
var nbre = bdd.length;
for (var i = 0; i < nbre; i++) {
var cle = bdd.key(i);
if (cle.indexOf(TEXTE_PHOTO) !== -1) {
var photo = JSON.parse(bdd.getItem(cle));
if (photo.parent == num_obs) {
$('#photos_obs').prepend(
'<li>'+
'<a href="#'+photo.num+'" data-rel="popup" data-role="button" data-inline="true">' +
'<img src="data:image/png;base64,' + photo.base64 + '" />' +
photo.nom +
'</a>' +
'<a href="#" onclick="supprimerPhoto(this);" title="Supprimer la photo" ' +
'data-icon="delete" data-photo-num="' + photo.num + '"' +
'data-photo-parent="' + num_obs + '" data-theme="c">'+
'Supprimer cette photo'+
'</a>'+
'</li>'
);
}
}
$('#photos_obs').listview('refresh');
}
}
}
 
function compterPhotos(num_obs) {
var compteur = 0;
if (num_obs != '') {
var nbre = bdd.length;
for (var i = 0; i < nbre; i++) {
var cle = bdd.key(i);
if (cle.indexOf(TEXTE_PHOTO) !== -1) {
var photo = JSON.parse(bdd.getItem(cle));
if (photo.parent == num_obs) {
compteur++;
}
}
}
}
return compteur;
}
 
function supprimerPhoto(data) {
var cle_photo = data.getAttribute('data-photo-num'),
parent = data.getAttribute('data-photo-parent'),
photo = JSON.parse(bdd.getItem(cle_photo));
bdd.removeItem(cle_photo);
var txt = photo.num + ' supprimée.';
$('#photo-suppression-infos').html('<p class="reponse ui-btn-inner ui-btn-corner-all">'+txt+'</p>')
.fadeIn(0)
.delay(1600)
.fadeOut("slow");
.fadeOut('slow');
event.stopPropagation();
event.preventDefault();
afficherPhotos(parent);
}
 
function chargerListeObs() {
$('#liste-obs').empty();
function miseAJourObs() {
console.log('majObs');
var nbre = bdd.length;
for (var i = 0; i < nbre; i++) {
var cle = 'obs'+(i+1);
var obs = JSON.parse(bdd.getItem(cle));
$('#liste-obs').append(
'<li>'+
'<img src="http://www.tela-botanica.org/widget-test:cel:modules/saisie/squelettes/defaut/img/icones/pasdephoto.png" />'+
'<a href="#'+cle+'" data-split-icon="next" data-split-theme="a" title="Voir la fiche" data-obs-num="'+obs.num+'">'+
'<strong>'+obs.nom+'</strong> observé le '+obs.date+' à lat : '+obs.lat+' lng : '+obs.lng+
'</a>'+
'<a href="#" title="Supprimer l\'observation" data-obs-num="'+obs.num+'">'+
'Supprimer'+
'</a>'+
'</li>'
);
var cle = bdd.key(i);
if (cle.indexOf(TEXTE_OBS) !== -1) {
var obs = JSON.parse(bdd.getItem(cle));
if (obs.maj == 0) {
var maj = 1;
if (obs.commune == TEXTE_HORS_LIGNE || obs.commune == '') {
var url_service = SERVICE_NOM_COMMUNE_URL;
var urlNomCommuneFormatee = url_service.replace('{lat}', lat).replace('{lon}', lng);
jQuery.ajax({
url: urlNomCommuneFormatee,
success: function(data) {
obs.commune = data['nom'];
obs.code_insee = data['codeINSEE'];
},
error: function() {
maj = 0;
},
async: false
});
}
if (obs.nom_sci_retenu == '') {
jQuery.ajax({
url: '/service:eflore:0.1/' + obs.referentiel + '/noms?'
+ 'masque.nn=' + obs.nn_select
+ '&retour.champs=num_taxonomique',
success: function(data) {
var cle = '',
compteur = 0;
for (name in data['resultat']) {
if (compteur == 0) {
cle = name;
}
compteur++;
}
obs.num_taxon = data['resultat'][cle]['num_taxonomique'];
jQuery.ajax({
url: '/service:eflore:0.1/' + obs.referentiel + '/noms?'
+ 'masque.nt=' + obs.num_taxon
+ '&retour.champs=famille'
+ '&retour.tri=retenu',
success: function(data) {
var cle = '',
compteur = 0;
for (name in data['resultat']) {
if (compteur == 0) {
cle = name;
}
compteur++;
}
obs.famille = data['resultat'][cle]['famille'];
obs.nom_sci_retenu = data['resultat'][cle]['nom_sci'];
obs.nn_retenu = cle;
},
error: function() {
maj = 0;
},
async: false
});
},
async: false
});
}
obs.maj = maj;
}
sauvegarderObs(obs.num, obs);
}
}
$('#liste-obs').listview('refresh');
}
 
function transmettreObs() {
if ($('#courriel').val() == $('#courriel_confirmation').val() && $('#courriel').val() != '') {
var nbre = bdd.length;
for (var i = 0; i < nbre; i++) {
var cle = bdd.key(i);
if (cle.indexOf('obs') !== -1) {
var obs = JSON.parse(bdd.getItem(cle));
stockerObsData(obs);
}
}
var observations = $('#details_obs').data();
console.log(observations);
if (observations == undefined || jQuery.isEmptyObject(observations)) {
//afficherPanneau("#dialogue-zero-obs");
} else {
observations['projet'] = TAG_PROJET;
observations['tag-obs'] = '';
observations['tag-img'] = '';
var utilisateur = new Object();
utilisateur.id_utilisateur = $('#id_utilisateur').val();
utilisateur.prenom = $('#prenom_utilisateur').val();
utilisateur.nom = $('#nom_utilisateur').val();
utilisateur.courriel = $('#courriel').val();
observations['utilisateur'] = utilisateur;
envoyerObsAuCel(observations);
}
}
}
 
function stockerObsData(obs) {
var nbre = bdd.length,
img_noms = new Array(),
img_codes = new Array();
for (var i = 0; i < nbre; i++) {
var cle = bdd.key(i);
if (cle.indexOf(TEXTE_PHOTO) !== -1) {
var photo = JSON.parse(bdd.getItem(cle));
if (photo.parent == obs.num) {
img_noms.push(photo.nom);
img_codes.push(photo.base64);
}
}
}
$('#details_obs').data(obs.num, {
'date' : obs.date,
'notes' : '',
'nom_sel' : obs.nom,
'num_nom_sel' : obs.nn_select,
'nom_ret' : obs.nom_sci_retenu,
'num_nom_ret' : obs.nn_retenu,
'num_taxon' : obs.num_taxon,
'famille' : obs.famille,
'referentiel' : obs.referentiel,
'latitude' : obs.lat,
'longitude' : obs.lng,
'commune_nom' : obs.commune,
'commune_code_insee' : obs.code_insee,
'lieudit' : '',
'station' : '',
'milieu' : '',
//Ajout des champs images
'image_nom' : img_noms,
'image_b64' : img_codes
});
}
 
 
function envoyerObsAuCel(observations) {
/*
var erreurMsg = "";
$.ajax({
url : SERVICE_SAISIE_URL,
type : "POST",
data : observations,
dataType : "json",
beforeSend : function() {
$("#dialogue-obs-transaction-ko").hide();
$("#dialogue-obs-transaction-ok").hide();
$(".alert-txt .msg").remove();
$(".alert-txt .msg-erreur").remove();
$(".alert-txt .msg-debug").remove();
$("#chargement").show();
},
success : function(data, textStatus, jqXHR) {
$('#dialogue-obs-transaction-ok .alert-txt').append($("#tpl-transmission-ok").clone().html());
supprimerMiniatures();
},
statusCode : {
500 : function(jqXHR, textStatus, errorThrown) {
erreurMsg += "Erreur 500 :\ntype : "+textStatus+' '+errorThrown+"\n";
}
},
error : function(jqXHR, textStatus, errorThrown) {
erreurMsg += "Erreur Ajax :\ntype : "+textStatus+' '+errorThrown+"\n";
try {
reponse = jQuery.parseJSON(jqXHR.responseText);
if (reponse != null) {
$.each(reponse, function (cle, valeur) {
erreurMsg += valeur + "\n";
});
}
} catch(e) {
erreurMsg += "L'erreur n'était pas en JSON.";
}
},
complete : function(jqXHR, textStatus) {
$("#chargement").hide();
var debugMsg = extraireEnteteDebug(jqXHR);
if (erreurMsg != '') {
if (DEBUG) {
$("#dialogue-obs-transaction-ko .alert-txt").append('<pre class="msg-erreur">'+erreurMsg+'</pre>');
$("#dialogue-obs-transaction-ko .alert-txt").append('<pre class="msg-debug">Débogage : '+debugMsg+'</pre>');
}
var hrefCourriel = "mailto:cel@tela-botanica.org?"+
"subject=Disfonctionnement du widget de saisie "+TAG_PROJET+
"&body="+erreurMsg+"\nDébogage :\n"+debugMsg;
$('#dialogue-obs-transaction-ko .alert-txt').append($("#tpl-transmission-ko").clone()
.find('.courriel-erreur')
.attr('href', hrefCourriel)
.end()
.html());
$("#dialogue-obs-transaction-ko").show();
} else {
if (DEBUG) {
$("#dialogue-obs-transaction-ok .alert-txt").append('<pre class="msg-debug">Débogage : '+debugMsg+'</pre>');
}
$("#dialogue-obs-transaction-ok").show();
}
initialiserObs();
}
});
*/
}
 
//+----------------------------------------------------------------------------------------------------------+
// Manifest Cache
var appCache = window.applicationCache;
 
$(document).ready(function() {
appCache.addEventListener('updateready', function() {
alert('Mise à jour :'+appCache.status);
});
});
if (appCache.status === appCache.UPDATEREADY) {
surMiseAJourCache();
}
116,9 → 576,84
 
function surMiseAJourCache() {
// Browser downloaded a new app cache.
// Swap it in and reload the page to get the new hotness.
// Swap it in and reload the page to get the new hotness.
appCache.swapCache();
if (confirm('A new version of this site is available. Load it?')) {
window.location.reload();
}
}
if (confirm('A new version of this site is available. Load it ?')) {
window.location.reload();
}
}
 
 
//+----------------------------------------------------------------------------------------------------------+
//Transmission données
function verifierConnexion() {
return ( ('onLine' in navigator) && (navigator.onLine));
}
 
//+---------------------------------------------------------------------------------------------------------+
//IDENTITÉ
$(document).ready(function() {
$('#courriel').on('blur', requeterIdentite);
$('#courriel').on('keypress', function(event) {
if (event.which == 13) {
testerLancementRequeteIdentite(event);
}
});
$('#valider_courriel').on('vmousedown', testerLancementRequeteIdentite);
$('body').on('pageshow', '#transmission', testerLancementRequeteIdentite);
});
 
function testerLancementRequeteIdentite(event) {
if (bdd.getItem('courriel') != null) {
$('#courriel').val(bdd.getItem('courriel'));
}
requeterIdentite();
event.preventDefault();
event.stopPropagation();
}
 
function requeterIdentite() {
var courriel = $('#courriel').val();
if (courriel != '') {
miseAJourCourriel();
var urlAnnuaire = SERVICE_ANNUAIRE + courriel; //http://localhost/applications/annuaire/jrest/
$.ajax({
url : urlAnnuaire,
type : 'GET',
success : function(data, textStatus, jqXHR) {
console.log('Annuaire SUCCESS : ' + textStatus);
if (data != undefined && data[courriel] != undefined) {
var infos = data[courriel];
$('#id_utilisateur').val(infos.id);
$('#prenom_utilisateur').val(infos.prenom);
$('#nom_utilisateur').val(infos.nom);
$('#courriel_confirmation').val(courriel);
$('#prenom_utilisateur, #nom_utilisateur, #courriel_confirmation').attr('disabled', 'disabled');
} else {
surErreurCompletionCourriel();
}
},
error : function(jqXHR, textStatus, errorThrown) {
console.log('Annuaire ERREUR : ' + textStatus);
surErreurCompletionCourriel();
},
complete : function(jqXHR, textStatus) {
console.log('Annuaire COMPLETE : ' + textStatus);
$('#zone_prenom_nom').removeClass('hidden');
$('#zone_courriel_confirmation').removeClass('hidden');
}
});
}
}
 
function surErreurCompletionCourriel() {
$('#prenom_utilisateur, #nom_utilisateur, #courriel_confirmation').val('');
$('#prenom_utilisateur, #nom_utilisateur, #courriel_confirmation').removeAttr('disabled');
}
 
function miseAJourCourriel() {
if ($('#courriel_memoire').is(':checked')) {
bdd.setItem('courriel', $("#courriel").val());
}
}