/branches/v1.6-croc/widget/modules/export/squelettes/js/export.js |
---|
New file |
0,0 → 1,168 |
//+---------------------------------------------------------------------------------------------------------+ |
// AUTO-COMPLÉTION Noms Scientifiques |
function ajouterAutocompletionNomSci() { |
$('#taxon').autocomplete({ |
source: function(requete, add){ |
// la variable de requête doit être vidée car sinon le parametre "term" est ajouté |
requete = ""; |
var url = getUrlAutocompletionNomSci()+"/"+formaterRequeteNomSci($('#taxon').val()); |
$.getJSON(url, requete, function(data) { |
var suggestions = traiterRetourNomSci(data); |
add(suggestions); |
}); |
}, |
html: true |
}); |
} |
function formaterRequeteNomSci(nomSci) { |
var nomSciCoupe = nomSci.split(' '); |
if(nomSciCoupe.length >= 2) { |
nomSci = nomSciCoupe[0]+'/'+nomSciCoupe[1]; |
} else { |
nomSci = nomSciCoupe[0]+'/*'; |
} |
return nomSci; |
} |
function traiterRetourNomSci(data) { |
var suggestions = []; |
if (data != undefined) { |
$.each(data, function(i, val) { |
var nom = {label : '', value : ''}; |
if (suggestions.length >= AUTOCOMPLETION_ELEMENTS_NBRE) { |
nom.label = "..."; |
nom.value = val[0]; |
suggestions.push(nom); |
return false; |
} else { |
nom.label = val[0]; |
nom.value = val[0]; |
suggestions.push(nom); |
} |
}); |
} |
return suggestions; |
} |
function ajouterAutocompletionCommunes() { |
$('#commune').autocomplete({ |
source: function(requete, add){ |
// la variable de requête doit être vidée car sinon le parametre "term" est ajouté |
requete = ""; |
var url = getUrlAutocompletionCommunes()+"/"+$('#commune').val(); |
$.getJSON(url, requete, function(data) { |
var suggestions = traiterRetourCommune(data); |
add(suggestions); |
}); |
}, |
html: true |
}); |
$( "#commune" ).bind("autocompleteselect", function(event, ui) { |
console.log(ui.item); |
$("#commune").data(ui.item.value); |
$("#dept").data(ui.item.code); |
$("#dept").val(ui.item.code); |
}); |
} |
function getUrlAutocompletionNomSci() { |
var url = SERVICE_AUTOCOMPLETION_NOM_SCI_URL; |
return url; |
} |
function separerCommuneDepartement(chaine) { |
var deptCommune = chaine.split(' ('); |
if(deptCommune[1] != null && deptCommune[1] != undefined) { |
deptCommune[1] = deptCommune[1].replace(')', ''); |
} else { |
deptCommune[1] = ''; |
} |
return deptCommune; |
} |
function traiterRetourCommune(data) { |
var suggestions = []; |
if (data != undefined) { |
$.each(data, function(i, val) { |
var nom = {label : '', value : ''}; |
if (suggestions.length >= AUTOCOMPLETION_ELEMENTS_NBRE) { |
nom.label = "..."; |
nom.value = val[0]; |
suggestions.push(nom); |
return false; |
} else { |
nom.label = val[0]; |
var deptCommune = separerCommuneDepartement(val[0]); |
nom.value = deptCommune[0]; |
nom.code = deptCommune[1]; |
suggestions.push(nom); |
} |
}); |
} |
return suggestions; |
} |
function getUrlAutocompletionCommunes() { |
var url = SERVICE_AUTOCOMPLETION_COMMUNE_URL; |
return url; |
} |
function configurerValidationFormulaire() { |
$("#form-export-obs").validate({ |
rules: { |
utilisateur: { |
email: true |
}, |
date_debut: { |
date: true, |
date_valid : $('#date_debut') |
}, |
date_fin: { |
date: true, |
date_valid : $('#date_fin') |
}, |
dept: { |
dept_valid : $('#dept') |
}, |
num_taxon: { |
number: true |
} |
}, |
messages: { |
email: "L'email de l'utilisateur doit être valide", |
num_taxon: "Le numéro taxonomique doit être un entier" |
} |
}); |
$.validator.addMethod("dept_valid", function(valeur) { |
return valeur == "" || valeur.match(/^\d+(?:,\d+)*$/); |
}, "Le ou les département(s) doivent être sur deux chiffres, séparés par des virgules" |
); |
$.validator.addMethod("date_valid", function(element) { |
var valid = true; |
var dateDebut = $('#date_debut').datepicker("getDate"); |
var dateFin = $('#date_fin').datepicker("getDate"); |
if($('#date_debut').val() != "" && $('#date_fin').val() != "") { |
if(dateDebut != null && dateFin != null) { |
valid = dateDebut <= dateFin; |
} else { |
valid = dateDebut == null || dateFin == null; |
} |
} |
return valid; |
}, "Les dates de début et de fin doivent être au format jj/mm/aaaa et la première inférieur à la dernière, si les deux sont présentes" |
); |
} |
$(document).ready(function() { |
ajouterAutocompletionNomSci(); |
ajouterAutocompletionCommunes(); |
$("#date_debut").datepicker($.datepicker.regional['fr']); |
$("#date_fin").datepicker($.datepicker.regional['fr']); |
configurerValidationFormulaire(); |
}); |
/branches/v1.6-croc/widget/modules/export/squelettes/export.tpl.html |
---|
New file |
0,0 → 1,112 |
<!DOCTYPE html> |
<html xmlns="http://www.w3.org/1999/xhtml"> |
<head> |
<title>Export des observations du CEL</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="Aurélien Peronnet" /> |
<meta name="keywords" content="Tela Botanica, CEL" /> |
<meta name="description" content="Widget d'export du carnet en ligne" /> |
<!-- Favicones --> |
<link rel="shortcut icon" type="image/x-icon" href="http://www.tela-botanica.org/favicon.ico" /> |
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> |
<!-- Jquery --> |
<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/1.7.1/jquery-1.7.1.min.js"></script> |
<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/jquery-ui/1.8.17/js/jquery-ui-1.8.17.custom.min.js"></script> |
<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/jquery-ui/1.8.17/js/jquery.ui.datepicker-fr.js"></script> |
<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/validate/1.9.0/jquery.validate.js"></script> |
<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/validate/1.9.0/messages_fr.js"></script> |
<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/form/2.95/jquery.form.min.js"></script> |
<!-- Javascript : appli saisie --> |
<script type="text/javascript"> |
//<![CDATA[ |
// Nombre d'élément dans les listes d'auto-complétion |
var AUTOCOMPLETION_ELEMENTS_NBRE = 20; |
// URL du web service permettant l'auto-complétion des noms scientifiques. |
var SERVICE_AUTOCOMPLETION_NOM_SCI_URL = "<?= $url_ws_autocompletion_nom_sci; ?>"; |
// URL du web service permettant l'auto-complétion des communes. |
var SERVICE_AUTOCOMPLETION_COMMUNE_URL = "<?= $url_ws_autocompletion_commune; ?>"; |
//]]> |
</script> |
<script type="text/javascript" src="<?= $url_base; ?>modules/export/squelettes/js/export.js"></script> |
<!-- CSS --> |
<!-- CSS --> |
<link href="http://www.tela-botanica.org/commun/jquery/jquery-ui/1.8.18/css/smoothness/jquery-ui-1.8.18.custom.css" rel="stylesheet" type="text/css" media="screen" /> |
<link href="http://www.tela-botanica.org/commun/bootstrap/2.0.2/css/bootstrap.min.css" rel="stylesheet" type="text/css" media="screen" /> |
<link href="http://www.tela-botanica.org/commun/bootstrap/2.0.2/css/bootstrap-responsive.min.css" rel="stylesheet" type="text/css" media="screen" /> |
<link href="http://www.tela-botanica.org/commun/jquery/jquery-ui/1.8.17/css/ui-darkness/jquery-ui-1.8.17.custom.css" rel="stylesheet" type="text/css" media="screen" /> |
<link href="<?= $url_base; ?>modules/export/squelettes/css/export.css" rel="stylesheet" type="text/css" media="screen" /> |
</head> |
<body> |
<div id="zone-appli" class="container"> |
<form id="form-export-obs" class="well" action="<?= $url_export.'/csv' ?>" method="get" > |
<h1 id="widget-titre"> Export des données du CEL</h1> |
<div class="row-fluid"> |
<label for="utilisateur">Email de la source des données </label><input id="utilisateur" class="large" name="utilisateur" type="text" placeholder="ex: accueil@tela-botanica.org" /> |
</div > |
<div class="row-fluid"> |
<label for="commune">Commune </label><input id="commune" class="large" name="commune" type="text" placeholder="ex: Montpellier" /> |
</div> |
<div class="row-fluid"> |
<label for="dept">Département(s) </label><input id="dept" class="large" name="dept" type="text" placeholder="ex: 34 OU 26,84,34..." /> |
</div> |
<div class="row-fluid"> |
<label for="projet">Projet </label><input id="projet" class="large" name="projet" type="text" placeholder="ex: sauvages" /> |
</div> |
<div class="row-fluid"> |
<label for="num_taxon">Taxon </label><input id="taxon" class="large" name="taxon" type="text" placeholder="ex: Viola OU Viola alba OU Violaceae" /> |
</div> |
<div class="row-fluid"> |
<div class="span conteneur_date_debut"> |
<label for="date_debut">Date de début </label><input id="date_debut" name="date_debut" type="text" placeholder="jj/mm/aaaa" /> |
</div> |
<div class="span conteneur_date_fin"> |
<label for="date_fin">Date de fin </label><input id="date_fin" name="date_fin" type="text" placeholder="jj/mm/aaaa" /> |
</div> |
</div> |
<div class="row-fluid conteneur_selection_format"> |
<label class="titre_format_export">Format d'export</label> |
<input type="radio" class="selection_format" name="format" value="xls" id="format_xls" checked="checked" /> |
<label class="label_selection_format" for="format_xls">excel (.xls)</label> |
<input type="radio" class="selection_format" name="format" value="csv" id="format_csv"/> |
<label class="label_selection_format" for="format_csv">csv (.csv)</label> |
</div> |
<div> |
<input class="btn" value="Télécharger les données" type="submit" /> |
</div> |
<div class="attention"> |
Si le volume de données est trop important, l'export peut échouer, dans ce cas là, |
essayez de privilégier le format csv ou bien de choisir des critères plus restrictifs. |
</div> |
</form> |
</div> |
<!-- Stats : Google Analytics--> |
<script type="text/javascript"> |
//<![CDATA[ |
var _gaq = _gaq || []; |
_gaq.push(['_setAccount', 'UA-20092557-1']); |
_gaq.push(['_trackPageview']); |
(function() { |
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; |
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; |
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); |
})(); |
//]]> |
</script> |
</body> |
</html> |
/branches/v1.6-croc/widget/modules/export/squelettes/images/information.png |
---|
Cannot display: file marked as a binary type. |
svn:mime-type = image/png |
/branches/v1.6-croc/widget/modules/export/squelettes/images/information.png |
---|
New file |
Property changes: |
Added: svn:executable |
+* |
\ No newline at end of property |
Added: svn:mime-type |
+image/png |
\ No newline at end of property |
/branches/v1.6-croc/widget/modules/export/squelettes/images/favicon.ico |
---|
Cannot display: file marked as a binary type. |
svn:mime-type = application/octet-stream |
/branches/v1.6-croc/widget/modules/export/squelettes/images/favicon.ico |
---|
New file |
Property changes: |
Added: svn:mime-type |
+application/octet-stream |
\ No newline at end of property |
/branches/v1.6-croc/widget/modules/export/squelettes/css/export.css |
---|
New file |
0,0 → 1,121 |
@CHARSET "UTF-8"; |
/*+--------------------------------------------------------------------------------------------------------+*/ |
/* Balises */ |
footer p{ |
text-align:center; |
} |
button img { |
display:block; |
} |
/*+--------------------------------------------------------------------------------------------------------+*/ |
/* Générique */ |
#zone-appli { |
width:260px; |
} |
.discretion { |
color:grey; |
font-family:arial; |
font-size:11px; |
line-height: 13px; |
} |
.droite { |
float:right; |
} |
.texte_droite { |
text-align:right; |
} |
.texte_centre { |
text-align:center; |
} |
.modal-fenetre{ |
position:fixed; |
z-index:1000; |
top:0; |
left:0; |
height:100%; |
width:100%; |
background:#777; |
background:rgba(90,86,93,0.7); |
text-align:center; |
} |
.modal-contenu{ |
position:relative; |
width:30%; |
margin:0 auto; |
top:30%; |
} |
/*+--------------------------------------------------------------------------------------------------------+*/ |
/* Formulaire spécifique */ |
h1#widget-titre { |
font-size: 18px; |
} |
#date_debut, #date_fin { |
width: 67px; |
} |
.conteneur_date_fin { |
float: right; |
padding-right: 35px; |
} |
.conteneur_date_debut { |
padding-left: 20px; |
} |
.conteneur_date { |
width: 80px; |
} |
input.error { |
border: 1px solid red; |
} |
label.error { |
color: red; |
} |
#form-export-obs input.large { |
width: 230px; |
} |
.label_selection_format, .selection_format { |
display: inline; |
} |
label.titre_format_export { |
margin-bottom: 0px; |
} |
#format_xls, #format_csv { |
margin-left: 30px; |
} |
.conteneur_selection_format { |
margin-bottom: 10px; |
} |
.attention { |
background-color:#e7ebfd; |
background-image:url("../images/information.png"); |
} |
.attention { |
display:inline-block; |
background-repeat:no-repeat; |
background-position:5px 50%; |
padding:10px 5px 5px 40px; |
background-size:24px 24px; -webkit-background-size:24px 24px; -o-background-size:24px 24px; -moz-background-size:24px 24px; |
max-width:600px; |
min-height:20px; |
} |
/*+--------------------------------------------------------------------------------------------------------+*/ |
/* Correction style CSS Bootstrap */ |
.well { |
margin-bottom: 5px; |
padding: 4px; |
} |