Création et implémentation de <formatChecker> + <inputChecker> ainsi que les applications

This commit is contained in:
xdrm-brackets 2015-12-08 23:24:22 +01:00
parent 8ecbb14729
commit 8afd55351a
11 changed files with 817 additions and 69 deletions

View File

@ -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>
@ -42,27 +44,38 @@ if(!Authentification::checkUser(0)){
<div id='BREADCRUMB'><a href='Dashboard.php'>Accueil</a> <a href='Consultations.php'>Consultations</a></a> </div>
<article data-title="Saisir un rendez-vous">
<div>
<select id='newRDVPatient'>
<option value='*'>Patients:</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
</div><div>
<select id='newRDVMedecin'>
<option value='*'>Medecins:</option>
<?php
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
<form>
<div>
<select id='newRDVPatient'>
<option value='*'>Patients:</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
</div><div>
<select id='newRDVMedecin'>
<option value='*'>Medecins:</option>
<?php
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><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>
<article data-title="Numéro de sécurité sociale">

View File

@ -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%;
}
@ -307,7 +307,7 @@ body{
/* <SPAN> */
#CONTAINER > article span{
#CONTAINER > article > form > span{
margin-left: 1em;
}
@ -326,7 +326,7 @@ body{
/* <INPUT> */
#CONTAINER > article input{
/* position */
display: block;
display: inline-block;
position: relative;
margin: 1em;
padding: .7em;
@ -345,4 +345,39 @@ body{
/* @focus */
#CONTAINER > article input:focus{
border-color: #999;
}
}
/* .validated */
#CONTAINER > article input.validated{
border-color: #1cc952;
}
/* <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;
background-image: url(../src/save@hover.svg);
/* foreground */
color: #fff;
}

8
css/responsive.css Executable file
View File

@ -0,0 +1,8 @@
@media (max-width: 1024px){
#WRAPPER{
left: calc( 50% - 50% - 1em );
width: calc( 100% - 2em );
}
}

View File

@ -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'/>

View File

@ -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;

View File

@ -1,58 +1,218 @@
/* [1] On récupère les 2 <select> de création de RDV
===============================================================*/
var newRDVPatient = document.getElementById('newRDVPatient');
var newRDVMedecin = document.getElementById('newRDVMedecin');
// /* [1] On récupère les 2 <select> de création de RDV
// ===============================================================*/
// var newRDVPatient = document.getElementById('newRDVPatient');
// var newRDVMedecin = document.getElementById('newRDVMedecin');
/* [2] Si on a récupéré les 2 <select>, on créé l'évènement de selection dynamique
===============================================================*/
if( newRDVPatient != null && newRDVMedecin != null ){
// /* [2] Si on a récupéré les 2 <select>, on créé l'évènement de selection dynamique
// ===============================================================*/
// if( newRDVPatient != null && newRDVMedecin != null ){
/* [1] On selectionne dynamiquement le médecin traitant associé
=======================================================================*/
newRDVPatient.addEventListener('change', function(e){
var child = document.querySelector("#newRDVPatient > option[value='"+newRDVPatient.value+"'][data-medecin]");
// /* [1] On selectionne dynamiquement le médecin traitant associé
// =======================================================================*/
// newRDVPatient.addEventListener('change', function(e){
// var child = document.querySelector("#newRDVPatient > option[value='"+newRDVPatient.value+"'][data-medecin]");
// on selectionne le medecin associé
newRDVMedecin.value = child.dataset.medecin;
addClass(newRDVMedecin, 'associated');
}, false);
// // on selectionne le medecin associé
// newRDVMedecin.value = child.dataset.medecin;
// addClass(newRDVMedecin, 'associated');
// }, false);
// [1] On met en valeur le médecin traitant associé (class=associated)
// =======================================================================
newRDVMedecin.addEventListener('change', function(e){
var child = document.querySelector("#newRDVPatient > option[value='"+newRDVPatient.value+"'][data-medecin]");
if( newRDVMedecin.value == child.dataset.medecin ) // si c'est le medecin traitant, on met en valeur l'association
addClass(newRDVMedecin, 'associated');
else
remClass(newRDVMedecin, 'associated');
// // [1] On met en valeur le médecin traitant associé (class=associated)
// // =======================================================================
// newRDVMedecin.addEventListener('change', function(e){
// var child = document.querySelector("#newRDVPatient > option[value='"+newRDVPatient.value+"'][data-medecin]");
// if( newRDVMedecin.value == child.dataset.medecin ) // si c'est le medecin traitant, on met en valeur l'association
// addClass(newRDVMedecin, 'associated');
// else
// remClass(newRDVMedecin, 'associated');
}, false);
}
// }, false);
// }
/* 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
// /* 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
// inSecu.addEventListener('keyup', function(e){
// // 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();
// }
// // si input complet
// if( inSecu.value.length == ftSecu.length )
// addClass(inSecu, 'validated');
// else
// remClass(inSecu, 'validated');
// }, false);
// /* GESTION DE LA DATE */
// var inDate = document.getElementById('inDate'); // input de la date
// var ftDate = 'dd/dd/dddd'; // format de la date
// inDate.addEventListener('keyup', function(e){
// // pour chaque caractère
// for( var i = 0 ; i < inDate.value.length ; i++ ){
// // [1] si le caractère n'est pas un nombre, on le supprime
// if( isNaN(inDate.value[i]) )
// inDate.value = inDate.value.slice(0, i).concat( inDate.value.slice(i+1) );
// // [2] si c'est pas un espace mais qu'il en faut un, on met en forme
// if( inDate.value[i] != '/' && ftDate[i] == '/' )
// inDate.value = inDate.value.slice(0, i).concat('/').concat( inDate.value.slice(i) );
// // [3] Le numéro saisi est trop long, on le coupe + enlève les espaces alentours
// inDate.value = inDate.value.slice(0, ftDate.length).trim();
// }
// // [4] vérification de cohérence
// var pJour = inDate.value.slice(0,2);
// var pMois = inDate.value.slice(3,5);
// var pAnnee = inDate.value.slice(6,11);
// // test de la validité
// var pDate = new Date(pJour+'/'+pMois+'/'+pAnnee);
// // if( pDate.toString() != 'Invalid Date' ){
// // var pDateObj = {
// // jour: (''+(pDate.getDate()-1)).length != 2 ? '0'+(pDate.getDate()-1) : ''+(pDate.getDate()-1),
// // mois: (''+(pDate.getMonth()+1)).length != 2 ? '0'+(pDate.getMonth()+1) : ''+(pDate.getMonth()+1),
// // annee: (''+(pDate.getFullYear())).length != 4 ? '0'+(pDate.getFullYear()) : ''+(pDate.getFullYear()),
// // }
// // inDate.value = pDateObj.jour +'/'+ pDateObj.mois +'/'+ pDateObj.annee;
// // }
// }, false);
// /* GESTION DE L'HEURE */
// var inHeure = document.getElementById('inHeure'); // input de la date
// var ftHeure = 'dd:dd'; // format de la date
// inHeure.addEventListener('keyup', function(e){
// // pour chaque caractère
// for( var i = 0 ; i < inHeure.value.length ; i++ ){
// // [1] si le caractère n'est pas un nombre, on le supprime
// if( isNaN(inHeure.value[i]) )
// inHeure.value = inHeure.value.slice(0, i).concat( inHeure.value.slice(i+1) );
// // [2] si c'est pas un espace mais qu'il en faut un, on met en forme
// if( inHeure.value[i] != ':' && ftHeure[i] == ':' )
// inHeure.value = inHeure.value.slice(0, i).concat(':').concat( inHeure.value.slice(i) );
// // [3] Le numéro saisi est trop long, on le coupe + enlève les espaces alentours
// inHeure.value = inHeure.value.slice(0, ftHeure.length).trim();
// }
// // [4] vérification de cohérence
// var pHeures = inHeure.value.slice(0,2);
// var pMinuts = inHeure.value.slice(3,5);
// // on borne les valeurs
// if( pHeures.length == 2 ) pHeures = (pHeures>=24) ? '23' : pHeures;
// if( pMinuts.length == 2 ) pMinuts = (pMinuts>=60) ? '59' : pMinuts;
// // on met au bon format dans tous les cas
// if( pHeures.length == 2 && pMinuts.length == 2 ){
// addClass(inHeure, 'validated');
// inHeure.value = pHeures+':'+pMinuts;
// }else
// remClass(inHeure, 'validated');
// }, false);
/* 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 ii ii iii iii ii',
{ 'S': '[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, '1 23 45 67 890 123 45' );
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);
inSecu.addEventListener('keyup', function(e){
if( inCk.check(inSecu) ) addClass(inSecu, 'validated'); // on active la classe
else{ // si incorrect
// 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();
remClass(inSecu, 'validated'); // on désactive la classe
inCk.correct(inSecu, false); // on corrige partiellement
if( inCk.check(inSecu) ) addClass(inSecu, 'validated'); // mise à jour de la classe après correction
}
}, false);
}, false);
// inDate.value = 'x3 F3/a8';
// inHeure.value = 'x3 F3/a8';
// inSecu.value = 'x3 F3/a8';

286
js/input-checker.js Executable file
View File

@ -0,0 +1,286 @@
// __ _ _ _
// / _| ___ _ __ _ __ ___ __ _| |_ ___| |__ ___ ___| | _____ _ __
// | |_ / _ \| '__| '_ ` _ \ / _` | __|____ / __| '_ \ / _ \/ __| |/ / _ \ '__|
// | _| (_) | | | | | | | | (_| | ||_____| (__| | | | __/ (__| < __/ |
// |_| \___/|_| |_| |_| |_|\__,_|\__| \___|_| |_|\___|\___|_|\_\___|_|
//
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
/* [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;
// 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) );
i++; // on incrémente car on décale la valeur
/* (2) Valeur ne correspond pas au schéma du caractère
-----------------------------------------------------------*/
}else if( tmpValue[i].match(tmpRegExp) == null )
tmpValue = tmpValue.slice(0, i).concat( this.defval[index][i] ).concat( tmpValue.slice(i) );
// Remarque. Ici on ne décale pas (i++) car le décalage fait correspondre au schéma
}
// 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
src/patient.svg Normal file → Executable file
View File

Before

Width:  |  Height:  |  Size: 5.8 KiB

After

Width:  |  Height:  |  Size: 5.8 KiB

121
src/save.svg Executable file
View File

@ -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.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.3544805"
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:#cccccc" />
<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:#b3e3ff;fill-opacity:1" />
<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:#cccccc" />
<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

121
src/save@hover.svg Executable file
View File

@ -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
toBDD.php Normal file → Executable file
View File