Merge branch 'master' of github.com:xdrm-brackets/projetphp
This commit is contained in:
Lucas Mascaro
commit
4ed88695ff
|
|
@ -16,8 +16,10 @@ if(!Authentification::checkUser(0)){
|
|||
|
||||
<link rel='stylesheet' href='css/animations.css'/>
|
||||
<link rel='stylesheet' href='css/global.css'/>
|
||||
<link rel='stylesheet' href='css/responsive.css'/>
|
||||
|
||||
<script type='text/javascript' src='js/adjust.js'></script>
|
||||
<script type='text/javascript' src='js/input-checker.js'></script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
|
@ -41,15 +43,19 @@ if(!Authentification::checkUser(0)){
|
|||
<!-- FIL D'ARIANE -->
|
||||
<div id='BREADCRUMB'><a href='Dashboard.php'>Accueil</a> <a href='Consultations.php'>Consultations</a></a> </div>
|
||||
|
||||
<?php/********************************/
|
||||
/* SAISIR UN RENDEZ-VOUS */
|
||||
/*************************************/ ?>
|
||||
<article data-title="Saisir un rendez-vous">
|
||||
<form>
|
||||
<div>
|
||||
<select id='newRDVPatient'>
|
||||
<option value='*'>Patients:</option>
|
||||
<option value='*'>Patient:</option>
|
||||
<?php
|
||||
foreach(PatientRepo::getAll() as $PATIENT)
|
||||
echo "<option value='".$PATIENT['Id']."' data-medecin='".$PATIENT['MedecinTraitant']."'>".$PATIENT['Nom']." ".$PATIENT['Prenom']."</option>";
|
||||
?>
|
||||
</select>Choix du patient
|
||||
</select>
|
||||
</div><div>
|
||||
<select id='newRDVMedecin'>
|
||||
<option value='*'>Medecins:</option>
|
||||
|
|
@ -57,17 +63,39 @@ if(!Authentification::checkUser(0)){
|
|||
foreach(MedecinRepo::getAll() as $MEDECIN)
|
||||
echo "<option value='".$MEDECIN['Id']."'>".$MEDECIN['Nom']." ".$MEDECIN['Prenom']."</option>";
|
||||
?>
|
||||
</select>
|
||||
<span>Selection du médecin pour la consultation.</span>
|
||||
<span class='associated'>Médecin traitant du patient.</span>
|
||||
</div><br>
|
||||
<input type='text' placeholder='dd/mm/yyyy'>
|
||||
<br><br>coucou
|
||||
</select><span class='associated'>Médecin traitant du patient.</span>
|
||||
</div>
|
||||
|
||||
<br><span>Date:   </span>
|
||||
<input type='text' id='inDate' placeholder='dd/mm/yyyy'>
|
||||
|
||||
<br><span>Heure: </span>
|
||||
<input type='text' id='inHeure' placeholder='HH:MM'>
|
||||
|
||||
<br><span>Durée: </span>
|
||||
<input type='text' id='inDuree' placeholder='minutes'>
|
||||
|
||||
<br>
|
||||
<input type='submit' value='Enregistrer la consultation'>
|
||||
</form>
|
||||
|
||||
</article>
|
||||
|
||||
|
||||
|
||||
|
||||
<?php/********************************/
|
||||
/* CONSULTER LES RENDEZ-VOUS */
|
||||
/*************************************/ ?>
|
||||
<article data-title="Numéro de sécurité sociale">
|
||||
<div>
|
||||
<input type='text' id='inSecu' placeholder='1 99 99 99 999 999 99'>
|
||||
<input type='checkbox' id='tousRDV'><label for='tousRDV'>Tous</label>
|
||||
<input type='checkbox' id='pastRDV'><label for='pastRDV'>Passés</label>
|
||||
<input type='checkbox' id='fturRDV'><label for='fturRDV'>À venir</label>
|
||||
|
||||
<input type='submit' value='Rechercher'>
|
||||
|
||||
<input type='text' id='inSecu' placeholder='1 99 99 99 999 999 95'><span class='invalid'>Clé de contrôle invalide.</span>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
|
|
|
|||
|
|
@ -16,8 +16,10 @@ if(!Authentification::checkUser(0)){
|
|||
|
||||
<link rel='stylesheet' href='css/animations.css'/>
|
||||
<link rel='stylesheet' href='css/global.css'/>
|
||||
<link rel='stylesheet' href='css/responsive.css'/>
|
||||
|
||||
<script type='text/javascript' src='js/adjust.js'></script>
|
||||
<script type='text/javascript' src='js/input-checker.js'></script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
|
@ -47,5 +49,6 @@ if(!Authentification::checkUser(0)){
|
|||
|
||||
</div>
|
||||
|
||||
<script type='text/javascript' src='js/consultations.js'></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
131
css/global.css
131
css/global.css
|
|
@ -165,11 +165,11 @@ body{
|
|||
#WRAPPER > #CONTAINER{
|
||||
/* position */
|
||||
display: block;
|
||||
position: absolute;
|
||||
position: relative;
|
||||
top: 0;
|
||||
left: 225px;
|
||||
width: calc( 100% - 225px );
|
||||
height: 100%;
|
||||
min-height: 100%;
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -223,9 +223,10 @@ body{
|
|||
/* position */
|
||||
display: block;
|
||||
position: relative;
|
||||
width: calc( 100% - 2*2em - 2*1px );
|
||||
width: calc( 100% - 2*2em - 2*1px - 2*1em );
|
||||
margin: 2em;
|
||||
margin-bottom: 4em; /* pour séparer les <articles> */
|
||||
padding: 1em;
|
||||
|
||||
/* border */
|
||||
border: 1px solid #f09108;
|
||||
|
|
@ -237,8 +238,8 @@ body{
|
|||
display: block;
|
||||
position: relative;
|
||||
margin-top: -2.5em;
|
||||
margin-left: -1px;
|
||||
width: calc( 100% - .5em - 2em );
|
||||
margin-left: calc( -1px - 1em );
|
||||
width: calc( 100% - .5em );
|
||||
padding: .5em;
|
||||
padding-left: 2em;
|
||||
|
||||
|
|
@ -307,16 +308,10 @@ body{
|
|||
|
||||
|
||||
/* <SPAN> */
|
||||
#CONTAINER > article span{
|
||||
#CONTAINER > article > form > span{
|
||||
margin-left: 1em;
|
||||
}
|
||||
|
||||
|
||||
/* SPECIFIC <SPAN> */
|
||||
#CONTAINER > article select.associated ~ span:not(.associated){
|
||||
display: none; /* on cache le texte défault quand c'est le médecin associé */
|
||||
}
|
||||
|
||||
#CONTAINER > article select:not(.associated) ~ span.associated{
|
||||
display: none; /* on cache le texte associé quand c'est pas le médecin associé */
|
||||
}
|
||||
|
|
@ -326,7 +321,7 @@ body{
|
|||
/* <INPUT> */
|
||||
#CONTAINER > article input{
|
||||
/* position */
|
||||
display: block;
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
margin: 1em;
|
||||
padding: .7em;
|
||||
|
|
@ -334,6 +329,10 @@ body{
|
|||
/* border */
|
||||
border: 1px solid #e5e5e5;
|
||||
|
||||
/* background */
|
||||
background: center right 1.5em no-repeat;
|
||||
background-size: 0em auto;
|
||||
|
||||
/* animation */
|
||||
transition: all .2s ease-in-out;
|
||||
-moz-transition: all .2s ease-in-out;
|
||||
|
|
@ -346,3 +345,109 @@ body{
|
|||
#CONTAINER > article input:focus{
|
||||
border-color: #999;
|
||||
}
|
||||
|
||||
/* .validated */
|
||||
#CONTAINER > article input.validated{
|
||||
border-color: #1cc952;
|
||||
background-image: url(../src/validated.svg);
|
||||
background-position: center right 1em;
|
||||
background-size: 1em auto;
|
||||
}
|
||||
|
||||
/* .invalid */
|
||||
#CONTAINER > article input.invalid{
|
||||
border-color: #ec111c;
|
||||
background-image: url(../src/invalid.svg);
|
||||
background-position: center right 1em;
|
||||
background-size: 1em auto;
|
||||
}
|
||||
|
||||
/* <span.invalid> après <input.invalid> */
|
||||
#CONTAINER > article input.invalid + span.invalid{
|
||||
color: #ec111c;
|
||||
}
|
||||
|
||||
/* <span.invalid> après <input> */
|
||||
#CONTAINER > article input:not(.invalid) + span.invalid{
|
||||
display: none;
|
||||
color: #ec111c;
|
||||
}
|
||||
|
||||
|
||||
/* <INPUT> [type=submit] */
|
||||
#CONTAINER > article input[type=submit]{
|
||||
/* position */
|
||||
padding-left: 3em;
|
||||
|
||||
/* border */
|
||||
border-color: #f09108;
|
||||
|
||||
/* background */
|
||||
background: #f6f4f2 url(../src/save.svg) center left 1em no-repeat;
|
||||
background-size: 1em auto;
|
||||
|
||||
/* foreground */
|
||||
color: #777;
|
||||
|
||||
/* extra */
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/* @hover */
|
||||
#CONTAINER > article input[type=submit]:hover{
|
||||
/* background */
|
||||
background-color: #f09108;
|
||||
|
||||
/* foreground */
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* CHECKBOX HACK */
|
||||
input[type=checkbox]{ display: none !important; }
|
||||
|
||||
/* label */
|
||||
input[type=checkbox] + label:before{
|
||||
content: '';
|
||||
/* position */
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
margin-right: .5em;
|
||||
margin-bottom: -.3em;
|
||||
width: 1.2em;
|
||||
height: 1.2em;
|
||||
|
||||
/* border */
|
||||
border-radius: 3px;
|
||||
border: 1px solid #f18624;
|
||||
|
||||
/* background */
|
||||
background: center center no-repeat;
|
||||
background-size: 80% auto;
|
||||
|
||||
/* animation */
|
||||
transition: all .2s ease-in-out;
|
||||
-moz-transition: all .2s ease-in-out;
|
||||
-webkit-transition: all .2s ease-in-out;
|
||||
-ms-transition: all .2s ease-in-out;
|
||||
-o-transition: all .2s ease-in-out;
|
||||
}
|
||||
|
||||
/* @active + label */
|
||||
input[type=checkbox]:active + label:before{
|
||||
transform: scale(.8);
|
||||
-moz-transform: scale(.8);
|
||||
-webkit-transform: scale(.8);
|
||||
-ms-transform: scale(.8);
|
||||
-o-transform: scale(.8);
|
||||
}
|
||||
|
||||
|
||||
/* @checked + label */
|
||||
input[type=checkbox]:checked + label:before{
|
||||
/* background */
|
||||
background-image:
|
||||
background-size: 80% auto;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,8 @@
|
|||
@media (max-width: 1024px){
|
||||
|
||||
#WRAPPER{
|
||||
left: calc( 50% - 50% - 1em );
|
||||
width: calc( 100% - 2em );
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -22,7 +22,7 @@ if(Authentification::checkUser(0)){
|
|||
|
||||
<html>
|
||||
<head>
|
||||
<title>Tests php</title>
|
||||
<title>Connexion</title>
|
||||
|
||||
<meta charset='utf-8'/>
|
||||
<meta name='description' value='Site de test'/>
|
||||
|
|
|
|||
|
|
@ -9,6 +9,10 @@ NodeList.prototype.indexOf = HTMLCollection.prototype.indexOf = function(searche
|
|||
};
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
function addClass(el, pClass){
|
||||
if( el.className.length > 0 && el.className != pClass ) el.className = el.className + ' ' + pClass;
|
||||
else el.className = pClass;
|
||||
|
|
|
|||
|
|
@ -34,25 +34,101 @@ if( newRDVPatient != null && newRDVMedecin != null ){
|
|||
|
||||
|
||||
|
||||
/* GESTION DU NUMÉRO DE SÉCU */
|
||||
var inSecu = document.getElementById('inSecu'); // input du numéro de sécu
|
||||
var ftSecu = 'x xx xx xx xxx xxx xx'; // format du numéro de sécu
|
||||
/* VERIFICATION DES CHAMPS */
|
||||
var inCk = new inputChecker();
|
||||
var inDate = document.getElementById('inDate');
|
||||
var inHeure = document.getElementById('inHeure');
|
||||
var inSecu = document.getElementById('inSecu');
|
||||
|
||||
|
||||
// format de date simplifié
|
||||
var dateFormat = new formatChecker(null,
|
||||
'Ji/Mi/2iii', { 'J': '[0-3]', 'M': '[0-1]' }
|
||||
);
|
||||
|
||||
// format de temps simplifié
|
||||
var timeFormat = new formatChecker(null,
|
||||
'Hi:Mi', { 'H': '[0-2]', 'M': '[0-6]' }
|
||||
);
|
||||
// format numéro SECU simplifié
|
||||
var secuFormat = new formatChecker(null,
|
||||
'S ii Mi ii iii iii ii', { 'S': '[0-1]', 'M': '[0-1]' }
|
||||
);
|
||||
|
||||
|
||||
|
||||
|
||||
var now = new Date();
|
||||
inCk.append( inDate, dateFormat, now.toLocaleFormat('%d/%m/%Y') );
|
||||
inCk.append( inHeure, timeFormat, now.toLocaleFormat('%H:%M') );
|
||||
inCk.append( inSecu, secuFormat, inSecu.placeholder );
|
||||
|
||||
|
||||
inDate.addEventListener('keyup', function(e){
|
||||
if( inCk.check(inDate) ) addClass(inDate, 'validated'); // on active la classe si correct
|
||||
else{ // si incorrect
|
||||
remClass(inDate, 'validated'); // on désactive la classe
|
||||
inCk.correct(inDate, false); // on corrige partiellement
|
||||
if( inCk.check(inDate) ) addClass(inDate, 'validated'); // mise à jour de la classe après correction
|
||||
}
|
||||
}, false);
|
||||
|
||||
|
||||
inHeure.addEventListener('keyup', function(e){
|
||||
if( inCk.check(inHeure) ) addClass(inHeure, 'validated'); // on active la classe
|
||||
else{ // si incorrect
|
||||
remClass(inHeure, 'validated'); // on désactive la classe
|
||||
inCk.correct(inHeure, false); // on corrige partiellement
|
||||
if( inCk.check(inHeure) ) addClass(inHeure, 'validated'); // mise à jour de la classe après correction
|
||||
}
|
||||
}, false);
|
||||
|
||||
inDuree.addEventListener('keyup', function(e){
|
||||
if( !isNaN(parseInt(inDuree.value)) ){
|
||||
inDuree.value = parseInt( inDuree.value ); // on caste en <int>
|
||||
addClass(inDuree, 'validated'); // on active la classe si correct
|
||||
}else // si incorrect
|
||||
remClass(inDuree, 'validated'); // on désactive la classe
|
||||
}, false);
|
||||
|
||||
function checkSecuControlKey(pNumSecu){
|
||||
var NIR = pNumSecu.slice(0,-2).replace(/ /g, '');
|
||||
var key = pNumSecu.slice(-2);
|
||||
|
||||
return 97-(NIR%97) == key;
|
||||
}
|
||||
|
||||
inSecu.addEventListener('keyup', function(e){
|
||||
if( inCk.check(inSecu) ){
|
||||
|
||||
// pour chaque caractère
|
||||
for( var i = 0 ; i < inSecu.value.length ; i++ ){
|
||||
|
||||
// [1] si le caractère n'est pas un nombre, on le supprime
|
||||
if( isNaN(inSecu.value[i]) )
|
||||
inSecu.value = inSecu.value.slice(0, i).concat( inSecu.value.slice(i+1) );
|
||||
|
||||
// [2] si c'est pas un espace mais qu'il en faut un, on met en forme
|
||||
if( inSecu.value[i] != ' ' && ftSecu[i] == ' ' )
|
||||
inSecu.value = inSecu.value.slice(0, i).concat(' ').concat( inSecu.value.slice(i) );
|
||||
|
||||
// [4] Le numéro saisi est trop long, on le coupe + enlève les espaces alentours
|
||||
inSecu.value = inSecu.value.slice(0, ftSecu.length).trim();
|
||||
if( checkSecuControlKey(inSecu.value) ){ // si la clé est correcte
|
||||
addClass(inSecu, 'validated'); // on dis que le champ est valide
|
||||
remClass(inSecu, 'invalid'); // on dis qu'il n'est pas invalide
|
||||
}else{
|
||||
remClass(inSecu, 'validated'); // on dis que le champ n'est pas valide
|
||||
addClass(inSecu, 'invalid'); // on dis qu'il est invalide
|
||||
}
|
||||
|
||||
}else{ // si incorrect
|
||||
|
||||
remClass(inSecu, 'validated'); // on désactive la classe
|
||||
remClass(inSecu, 'invalid'); // on dis qu'il n'est pas invalide
|
||||
|
||||
inCk.correct(inSecu, false); // on corrige partiellement
|
||||
if( inCk.check(inSecu) ){
|
||||
|
||||
if( checkSecuControlKey(inSecu.value) ){ // si la clé est correcte
|
||||
addClass(inSecu, 'validated'); // on dis que le champ est valide
|
||||
remClass(inSecu, 'invalid'); // on dis qu'il n'est pas invalide
|
||||
}else{
|
||||
remClass(inSecu, 'validated'); // on dis que le champ n'est pas valide
|
||||
addClass(inSecu, 'invalid'); // on dis qu'il est invalide
|
||||
}
|
||||
}
|
||||
}
|
||||
}, false);
|
||||
|
||||
|
||||
// inDate.value = 'x3 F3/a8';
|
||||
// inHeure.value = 'x3 F3/a8';
|
||||
inSecu.value = '1 96 01 31 555 861';
|
||||
|
|
@ -0,0 +1,293 @@
|
|||
// __ _ _ _
|
||||
// / _| ___ _ __ _ __ ___ __ _| |_ ___| |__ ___ ___| | _____ _ __
|
||||
// | |_ / _ \| '__| '_ ` _ \ / _` | __|____ / __| '_ \ / _ \/ __| |/ / _ \ '__|
|
||||
// | _| (_) | | | | | | | | (_| | ||_____| (__| | | | __/ (__| < __/ |
|
||||
// |_| \___/|_| |_| |_| |_|\__,_|\__| \___|_| |_|\___|\___|_|\_\___|_|
|
||||
//
|
||||
function formatChecker(pValue, pPattern, pRules){
|
||||
this.value = pValue;
|
||||
this.pattern = pPattern;
|
||||
this.rules = (arguments.length>2) ? pRules : [];
|
||||
};
|
||||
|
||||
formatChecker.prototype = {
|
||||
value: this.value, // valeur à formater
|
||||
pattern: this.pattern, // format global
|
||||
rules: this.rules, // définition des règles du format global
|
||||
regexp: null, // contiendra la RegExp de validation
|
||||
// règles par défaut
|
||||
default_rules: {
|
||||
'i': '[0-9]', // i = integer
|
||||
'a': '[a-z]', // a = lower case
|
||||
'A': '[A-Z]', // A = upper case
|
||||
'x': '[a-zA-Z]' // x = letter
|
||||
},
|
||||
|
||||
// créé une RegExp en fonction du format global @pattern et des règles @rules
|
||||
compile: function(){
|
||||
var RegExpExpr = '^'; // contiendra les chaines de la regex
|
||||
var RegExpDecomposition = [];
|
||||
|
||||
// on parcours les caractères du pattern
|
||||
for( var i = 0 ; i < this.pattern.length ; i++ ){
|
||||
/* [1] Cas où la règle est définie par l'utilisateur
|
||||
====================================================*/
|
||||
if( this.rules.hasOwnProperty( this.pattern[i] ) ){
|
||||
RegExpExpr += this.rules[ this.pattern[i] ];
|
||||
RegExpDecomposition.push( this.rules[ this.pattern[i] ] );
|
||||
|
||||
/* [2] Cas où la règle est définie par défaut
|
||||
====================================================*/
|
||||
}else if( this.default_rules.hasOwnProperty( this.pattern[i] ) ){
|
||||
RegExpExpr += this.default_rules[ this.pattern[i] ];
|
||||
RegExpDecomposition.push( this.default_rules[ this.pattern[i] ] );
|
||||
|
||||
/* [3] Cas où on prends juste le caractère en compte
|
||||
====================================================*/
|
||||
}else{
|
||||
RegExpExpr += this.pattern[i];
|
||||
RegExpDecomposition.push( this.pattern[i] );
|
||||
}
|
||||
}
|
||||
|
||||
RegExpExpr += '$';
|
||||
|
||||
// on définit la RegExp associée
|
||||
this.regexp = new RegExp( RegExpExpr );
|
||||
// on la complète avec la décomposition par caractère du pattern
|
||||
this.regexp.patternDecomposition = RegExpDecomposition;
|
||||
},
|
||||
|
||||
|
||||
// vérifie la validité en utilisant la RegExp, si elle n'est pas générée, on la génère
|
||||
check: function(pPlotPlate){
|
||||
/* [1] On génère la RegExp si ce n'est pas déjà fait
|
||||
====================================================*/
|
||||
if( this.regexp == null ) this.compile();
|
||||
|
||||
|
||||
/* [2] Gestion de la plaque à trous
|
||||
====================================================*/
|
||||
if( arguments.length > 0 && pPlotPlate instanceof Array){
|
||||
|
||||
// on parcours les caractères du pattern
|
||||
for( var i = 0 ; i < this.pattern.length ; i++ ){
|
||||
|
||||
var RegExpExpr = '^';
|
||||
|
||||
/* [1] Cas où la règle est définie par l'utilisateur
|
||||
====================================================*/
|
||||
if( this.rules.hasOwnProperty( this.pattern[i] ) )
|
||||
RegExpExpr += this.rules[ this.pattern[i] ];
|
||||
|
||||
/* [2] Cas où la règle est définie par défaut
|
||||
====================================================*/
|
||||
else if( this.default_rules.hasOwnProperty( this.pattern[i] ) )
|
||||
RegExpExpr += this.default_rules[ this.pattern[i] ];
|
||||
|
||||
/* [3] Cas où on prends juste le caractère en compte
|
||||
====================================================*/
|
||||
else
|
||||
RegExpExpr += this.pattern[i];
|
||||
|
||||
RegExpExpr += '$';
|
||||
|
||||
pPlotPlate.push( this.value[i].match( new RegExp(RegExpExpr) ) != null );
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
// on retourne TRUE si c'est bon, FALSE sinon
|
||||
return this.value.match( this.regexp ) != null;
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
/***********/
|
||||
/* USECASE */
|
||||
/***********/
|
||||
/* [1] On créé une instance du formatChecker()
|
||||
==================================================*/
|
||||
/*HIDDEN*///var instance = new formatChecker(
|
||||
/*HIDDEN*/// 'te2t 1 2 1/23', // la chaîne à vérifier
|
||||
/*HIDDEN*/// 'aava i i i/ii', // le schéma à respecter (cf. règles par défaut)
|
||||
/*HIDDEN*/// {'v': '[0-2]'} // règles spécifiques. Ici, 'v' correspond à un chiffre compris entre 0 et 2
|
||||
/*HIDDEN*///);
|
||||
|
||||
/* [2] On récupère le résultat de la vérification
|
||||
==================================================*/
|
||||
// Note. On passe ici en paramètre un tableau qui va être rempli à TRUE pour les caractères
|
||||
// correspondant au schéma, FALSE pour les erreurs
|
||||
/*HIDDEN*///var respecteSchema = instance.check( plotPlate=[] );
|
||||
/*HIDDEN*///console.log( respecteSchema ); // affichera "true"
|
||||
|
||||
/* [3] On accède à la plotPlate (afin de vérifier d'où vient l'erreur)
|
||||
==================================================*/
|
||||
/*HIDDEN*///console.log( plotPlate ); // affichera "[true, true, true, ..]""
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// _ _ _ _
|
||||
// (_)_ __ _ __ _ _| |_ ___| |__ ___ ___| | _____ _ __
|
||||
// | | '_ \| '_ \| | | | __|____ / __| '_ \ / _ \/ __| |/ / _ \ '__|
|
||||
// | | | | | |_) | |_| | ||_____| (__| | | | __/ (__| < __/ |
|
||||
// |_|_| |_| .__/ \__,_|\__| \___|_| |_|\___|\___|_|\_\___|_|
|
||||
//
|
||||
function inputChecker(){};
|
||||
|
||||
inputChecker.prototype = {
|
||||
input: [], // contiendra les éléments HTML <input>
|
||||
defval: [], // contiendra les valeurs par défaut ou NULL si pas défini
|
||||
checker: [], // contiendra les classes <formatChecker>
|
||||
|
||||
|
||||
/* Ajout d'un champ <input> au vérificateur
|
||||
*
|
||||
* @pInputElement<HTMLInputElement> l'élément <input> à vérifier
|
||||
* @pFormatChecker<formatChecker> l'instance <formatChecker> associée à la valeur voulue du champ
|
||||
* @pDefaultValue<String> [OPT] Valeur par défaut pour l'input
|
||||
*
|
||||
*
|
||||
* @return ajouté<Boolean> retourne TRUE, si le champ a bien été ajouté
|
||||
* retourne FALSE, si une erreur occure
|
||||
*/
|
||||
append: function(pInputElement, pFormatChecker, optDefaultValue){
|
||||
/* [1] Vérification des types
|
||||
====================================================*/
|
||||
if( !(pInputElement instanceof HTMLInputElement) ) return false; // si c'est pas un <input>, retourne FALSE
|
||||
if( !(pFormatChecker instanceof formatChecker) ) return false; // si c'est pas un <formatChecker>, retourne FALSE
|
||||
|
||||
|
||||
/* [2] Référencement des nouvelles données
|
||||
====================================================*/
|
||||
// insertion du <input>
|
||||
var index = this.input.push( pInputElement );
|
||||
|
||||
// insertion du <formatChecker>, si pb d'insertion, retourne FALSE
|
||||
if( index != this.checker.push(pFormatChecker) ) return false;
|
||||
|
||||
// insertion de la valeur par défaut (si définie), si pb d'insetion, retourne FALSE
|
||||
if( index != (this.defval.push((arguments.length>2)?optDefaultValue:null)) ) return false;
|
||||
},
|
||||
|
||||
|
||||
|
||||
/* Vérifie le format d'un champ <input> de rang spécifié
|
||||
*
|
||||
* @pInputElement<HTMLInputElement> L'élement qu'on veut vérifier
|
||||
*
|
||||
*
|
||||
* @return verification<Boolean> retourne TRUE si la vérification s'avère correcte
|
||||
* retourne FALSE si la vérification est incorrecte
|
||||
*/
|
||||
check: function(pInputElement){
|
||||
// si l'élément n'est pas référencé, retourne FALSE
|
||||
var index = this.input.indexOf( pInputElement );
|
||||
if( index < 0 ) return false;
|
||||
|
||||
/* [1] On remplace la valeur de vérification du <formatChecker> par la valeur actuelle de l'élément <input>
|
||||
====================================================*/
|
||||
this.checker[index].value = this.input[index].value;
|
||||
|
||||
/* [2] On renvoie le résultat du checker
|
||||
====================================================*/
|
||||
return this.checker[index].check();
|
||||
},
|
||||
|
||||
|
||||
|
||||
/* Vérifie le format de tous les champs <input>
|
||||
*
|
||||
* @return verifications<Boolean> retourne TRUE si les vérifications s'avèrent correctes
|
||||
* retourne FALSE si les vérifications sont incorrectes
|
||||
*/
|
||||
checkAll: function(){
|
||||
var checkerCumul = true;
|
||||
|
||||
for( var i = 0 ; i < this.input.length ; i++ )
|
||||
checkerCumul = checkerCumul && this.check(this.input[i]);
|
||||
|
||||
return checkerCumul;
|
||||
},
|
||||
|
||||
|
||||
/* Applique une correction en fonction du schéma
|
||||
*
|
||||
* @pInputElement<HTMLInputElement> l'élément <input> concerné
|
||||
* @pToEnd<Boolean> si on doit corriger jusqu'à la fin ou uniquement jusqu'à l'avancéé actuelle
|
||||
*
|
||||
*
|
||||
* @return correctValue<String> retourne la valeur corrigée
|
||||
* retourne NULL si erreur
|
||||
*/
|
||||
correct: function(pInputElement, pToEnd){
|
||||
/* GESTION PARAMS */
|
||||
|
||||
// on retourne une erreur si l'élément <input> n'est pas référencé
|
||||
if( (index = this.input.indexOf(pInputElement)) < 0 ) return null;
|
||||
|
||||
var pToEnd = (arguments.length>1) ? pToEnd : true;
|
||||
|
||||
|
||||
|
||||
/* [1] On met à jour la valeur du <formatChecker>
|
||||
====================================================*/
|
||||
this.checker[index].value = this.input[index].value;
|
||||
|
||||
|
||||
this.checker[index].compile(); // on génére la RegExp
|
||||
var RegExpByChar = this.checker[index].regexp.patternDecomposition; // on retire "/^" et "$/" de la RegExp
|
||||
var tmpValue = this.input[index].value; // on copie la "value" pour la modifier
|
||||
|
||||
|
||||
if( !this.check(pInputElement) ){ // si la chaîne n'est pas correcte
|
||||
|
||||
var lastChar = null;
|
||||
|
||||
/* [2] Cas 1 : vérification de la chaîne complète
|
||||
====================================================*/
|
||||
for( var i = 0 ; i < RegExpByChar.length ; i++ ){ // on parcours le pattern
|
||||
|
||||
// si on dépasse de la valeur saisie et qu'on doit pas aller jusqu'à la fin, on quitte le FOR
|
||||
if( !pToEnd && i >= this.input[index].value.length )
|
||||
break;
|
||||
|
||||
lastChar = tmpValue[i];
|
||||
|
||||
// RegExp sur le caractère en question
|
||||
var tmpRegExp = new RegExp( '^'+RegExpByChar[i]+'$' );
|
||||
|
||||
/* (1) Valeur inexistante (string.length < schéma.length)
|
||||
-----------------------------------------------------------*/
|
||||
if( tmpValue.length == 0 || tmpValue[i] == null )
|
||||
tmpValue = tmpValue.slice(0, i).concat( this.defval[index][i] ).concat( tmpValue.slice(i) );
|
||||
|
||||
/* (2) Valeur ne correspond pas au schéma du caractère
|
||||
-----------------------------------------------------------*/
|
||||
else if( tmpValue[i].match(tmpRegExp) == null ){
|
||||
// si le caractère suivant match, on décale d'une position
|
||||
if( tmpValue[i].match(new RegExp( '^'+RegExpByChar[i+1]+'$' )) != null )
|
||||
tmpValue = tmpValue.slice(0, i).concat( this.defval[index][i] ).concat( tmpValue.slice(i) );
|
||||
// sinon on remplace
|
||||
else
|
||||
tmpValue = tmpValue.slice(0, i).concat( this.defval[index][i] ).concat( tmpValue.slice(i+1) );
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// on tronque ce qui dépasse
|
||||
tmpValue = tmpValue.slice(0, RegExpByChar.length);
|
||||
|
||||
// on met à jour la valeur de l'élément input
|
||||
this.input[index].value = tmpValue;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
};
|
||||
|
|
@ -0,0 +1,49 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
enable-background="new 0 0 512 512"
|
||||
height="460.01199"
|
||||
id="Layer_1"
|
||||
version="1.1"
|
||||
viewBox="0 0 459.16379 460.01199"
|
||||
width="459.16379"
|
||||
xml:space="preserve"
|
||||
inkscape:version="0.48.4 r9939"
|
||||
sodipodi:docname="invalid.svg"><metadata
|
||||
id="metadata3869"><rdf:RDF><cc:Work
|
||||
rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" /><dc:title></dc:title></cc:Work></rdf:RDF></metadata><defs
|
||||
id="defs3867" /><sodipodi:namedview
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1"
|
||||
objecttolerance="10"
|
||||
gridtolerance="10"
|
||||
guidetolerance="10"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:window-width="1920"
|
||||
inkscape:window-height="1056"
|
||||
id="namedview3865"
|
||||
showgrid="false"
|
||||
inkscape:zoom="0.4609375"
|
||||
inkscape:cx="229.49059"
|
||||
inkscape:cy="229.69399"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="24"
|
||||
inkscape:window-maximized="1"
|
||||
inkscape:current-layer="Layer_1"
|
||||
fit-margin-top="0"
|
||||
fit-margin-left="0"
|
||||
fit-margin-right="0"
|
||||
fit-margin-bottom="0" /><polygon
|
||||
points="143.648,157.54 241.78,255.672 143.648,353.809 157.733,367.893 255.863,269.75 354.461,368.361 368.545,354.275 269.947,255.672 368.545,157.073 354.461,142.988 255.863,241.587 157.733,143.456 "
|
||||
id="polygon3863"
|
||||
style="fill:#f64507;fill-opacity:1;stroke:#f64507;stroke-width:18.22995377;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none"
|
||||
transform="matrix(1.8882658,0,0,1.8882658,-253.99118,-252.78893)" /></svg>
|
||||
|
After Width: | Height: | Size: 2.0 KiB |
|
Before Width: | Height: | Size: 5.8 KiB After Width: | Height: | Size: 5.8 KiB |
|
|
@ -0,0 +1,121 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
height="18.000025"
|
||||
version="1.1"
|
||||
width="18"
|
||||
id="svg2"
|
||||
inkscape:version="0.48.4 r9939"
|
||||
sodipodi:docname="save@hover.svg">
|
||||
<metadata
|
||||
id="metadata32">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
<dc:title />
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<defs
|
||||
id="defs30" />
|
||||
<sodipodi:namedview
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1"
|
||||
objecttolerance="10"
|
||||
gridtolerance="10"
|
||||
guidetolerance="10"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:window-width="1920"
|
||||
inkscape:window-height="1056"
|
||||
id="namedview28"
|
||||
showgrid="false"
|
||||
fit-margin-top="0"
|
||||
fit-margin-left="0"
|
||||
fit-margin-right="0"
|
||||
fit-margin-bottom="0"
|
||||
inkscape:zoom="18.986111"
|
||||
inkscape:cx="0.2919805"
|
||||
inkscape:cy="13.75954"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="24"
|
||||
inkscape:window-maximized="1"
|
||||
inkscape:current-layer="svg2" />
|
||||
<g
|
||||
transform="translate(-3,-1031.4)"
|
||||
id="g4">
|
||||
<path
|
||||
d="m 3,1037.4 v 2 2 6 c 0,1.1 0.8954,2 2,2 h 14 c 1.105,0 2,-0.9 2,-2 v -6 -2 -2 H 3 z"
|
||||
id="path6"
|
||||
inkscape:connector-curvature="0"
|
||||
style="fill:#2980b9" />
|
||||
<path
|
||||
d="M 5,3 C 3.8954,3 3,3.8954 3,5 v 2 2 1 2 6 c 0,1.105 0.8954,2 2,2 h 14 c 1.105,0 2,-0.895 2,-2 V 12 10 9 7 6 L 18,3 H 17 15 5 z"
|
||||
transform="translate(0,1028.4)"
|
||||
id="path8"
|
||||
inkscape:connector-curvature="0"
|
||||
style="fill:#3498db" />
|
||||
<path
|
||||
d="m 6,3 v 1 1 2 c 0,1.1046 0.8954,2 2,2 h 1 4 2 1 c 1.105,0 2,-0.8954 2,-2 V 5.1562 5 4 3 H 6 z"
|
||||
transform="translate(0,1028.4)"
|
||||
id="path10"
|
||||
inkscape:connector-curvature="0"
|
||||
style="fill:#2980b9" />
|
||||
<path
|
||||
d="m 8,1041.4 c -1.1046,0 -2,0.9 -2,2 v 1.8 3.2 h 12 v -3.2 -1.8 c 0,-1.1 -0.895,-2 -2,-2 H 13 8 z"
|
||||
id="path12"
|
||||
inkscape:connector-curvature="0"
|
||||
style="fill:#ecf0f1" />
|
||||
<rect
|
||||
height="1"
|
||||
width="12"
|
||||
x="6"
|
||||
y="1048.4"
|
||||
id="rect14"
|
||||
style="fill:#bdc3c7" />
|
||||
<path
|
||||
d="m 7,1031.4 v 1 2 c 0,1.1 0.8954,2 2,2 h 1 4 1 c 1.105,0 2,-0.9 2,-2 v -1.9 -0.1 -1 H 7 z"
|
||||
id="path16"
|
||||
inkscape:connector-curvature="0"
|
||||
style="fill:#ecf0f1" />
|
||||
<path
|
||||
d="m 8,4 v 2 c 0,0.5523 0.4477,1 1,1 h 1 1 c 0.552,0 1,-0.4477 1,-1 V 4 H 10 8 z"
|
||||
transform="translate(0,1028.4)"
|
||||
id="path18"
|
||||
inkscape:connector-curvature="0"
|
||||
style="fill:#95a5a6" />
|
||||
<g
|
||||
id="g20"
|
||||
style="fill:#bdc3c7">
|
||||
<rect
|
||||
height="1"
|
||||
transform="translate(0,1028.4)"
|
||||
width="8"
|
||||
x="8"
|
||||
y="15"
|
||||
id="rect22" />
|
||||
<rect
|
||||
height="1"
|
||||
width="8"
|
||||
x="8"
|
||||
y="1045.4"
|
||||
id="rect24" />
|
||||
<rect
|
||||
height="1"
|
||||
width="4"
|
||||
x="8"
|
||||
y="1031.4"
|
||||
id="rect26" />
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.4 KiB |
|
|
@ -0,0 +1,49 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
enable-background="new 0 0 512 512"
|
||||
height="353.54437"
|
||||
id="Layer_1"
|
||||
version="1.1"
|
||||
viewBox="0 0 501.78812 353.54437"
|
||||
width="501.78812"
|
||||
xml:space="preserve"
|
||||
inkscape:version="0.48.4 r9939"
|
||||
sodipodi:docname="validated.svg"><metadata
|
||||
id="metadata11"><rdf:RDF><cc:Work
|
||||
rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" /><dc:title /></cc:Work></rdf:RDF></metadata><defs
|
||||
id="defs9" /><sodipodi:namedview
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1"
|
||||
objecttolerance="10"
|
||||
gridtolerance="10"
|
||||
guidetolerance="10"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:window-width="1920"
|
||||
inkscape:window-height="1056"
|
||||
id="namedview7"
|
||||
showgrid="false"
|
||||
fit-margin-top="0"
|
||||
fit-margin-left="0"
|
||||
fit-margin-right="0"
|
||||
fit-margin-bottom="0"
|
||||
inkscape:zoom="0.65186406"
|
||||
inkscape:cx="199.25646"
|
||||
inkscape:cy="303.73443"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="24"
|
||||
inkscape:window-maximized="1"
|
||||
inkscape:current-layer="Layer_1" /><polygon
|
||||
points="113.72,250.624 216.919,353.803 398.28,172.334 384.235,158.192 216.919,325.518 127.862,236.481 "
|
||||
id="polygon5"
|
||||
style="fill:#1cc952;fill-opacity:1;stroke:#1cc952;stroke-width:11.59998226;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none"
|
||||
transform="matrix(1.6674164,0,0,1.6674164,-175.96454,-250.06035)" /></svg>
|
||||
|
After Width: | Height: | Size: 1.9 KiB |
Loading…
Reference in New Issue