diff --git a/Consultations.php b/Consultations.php index 71eb667..5454d7f 100755 --- a/Consultations.php +++ b/Consultations.php @@ -16,8 +16,10 @@ if(!Authentification::checkUser(0)){ + + @@ -41,33 +43,59 @@ if(!Authentification::checkUser(0)){ +
-
- Choix du patient -
- - Selection du médecin pour la consultation. - Médecin traitant du patient. -

- -

coucou +
+
+ +
+ Médecin traitant du patient. +
+ +
Date:   + + +
Heure: + + +
Durée: + + +
+ +
+
+ + + +
- + + + + + + + Clé de contrôle invalide.
diff --git a/Dashboard.php b/Dashboard.php index 72cae8d..ffbd46f 100755 --- a/Dashboard.php +++ b/Dashboard.php @@ -16,8 +16,10 @@ if(!Authentification::checkUser(0)){ + + @@ -47,5 +49,6 @@ if(!Authentification::checkUser(0)){ + diff --git a/css/global.css b/css/global.css index 2dbd5f2..140c925 100755 --- a/css/global.css +++ b/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 */ + 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{ /* */ -#CONTAINER > article span{ +#CONTAINER > article > form > span{ margin-left: 1em; } - -/* SPECIFIC */ -#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,13 +321,17 @@ body{ /* */ #CONTAINER > article input{ /* position */ - display: block; + display: inline-block; position: relative; margin: 1em; padding: .7em; /* border */ border: 1px solid #e5e5e5; + + /* background */ + background: center right 1.5em no-repeat; + background-size: 0em auto; /* animation */ transition: all .2s ease-in-out; @@ -345,4 +344,110 @@ body{ /* @focus */ #CONTAINER > article input:focus{ border-color: #999; -} \ No newline at end of file +} + +/* .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; +} + +/* après */ +#CONTAINER > article input.invalid + span.invalid{ + color: #ec111c; +} + +/* après */ +#CONTAINER > article input:not(.invalid) + span.invalid{ + display: none; + color: #ec111c; +} + + +/* [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; +} + diff --git a/css/responsive.css b/css/responsive.css new file mode 100755 index 0000000..8b771cc --- /dev/null +++ b/css/responsive.css @@ -0,0 +1,8 @@ +@media (max-width: 1024px){ + + #WRAPPER{ + left: calc( 50% - 50% - 1em ); + width: calc( 100% - 2em ); + } + +} \ No newline at end of file diff --git a/index.php b/index.php index 7feb6de..35bd17d 100755 --- a/index.php +++ b/index.php @@ -22,7 +22,7 @@ if(Authentification::checkUser(0)){ - Tests php + Connexion diff --git a/js/adjust.js b/js/adjust.js index ce85847..b3c7421 100755 --- a/js/adjust.js +++ b/js/adjust.js @@ -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; diff --git a/js/consultations.js b/js/consultations.js index ae43762..7e75d76 100755 --- a/js/consultations.js +++ b/js/consultations.js @@ -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 + 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++ ){ + 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 + } - // [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) ); + }else{ // si incorrect - // [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) ); + remClass(inSecu, 'validated'); // on désactive la classe + remClass(inSecu, 'invalid'); // on dis qu'il n'est pas invalide - // [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(); + 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); -}, false); \ No newline at end of file + +// inDate.value = 'x3 F3/a8'; +// inHeure.value = 'x3 F3/a8'; +inSecu.value = '1 96 01 31 555 861'; \ No newline at end of file diff --git a/js/input-checker.js b/js/input-checker.js new file mode 100755 index 0000000..f025c3e --- /dev/null +++ b/js/input-checker.js @@ -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 + defval: [], // contiendra les valeurs par défaut ou NULL si pas défini + checker: [], // contiendra les classes + + + /* Ajout d'un champ au vérificateur + * + * @pInputElement l'élément à vérifier + * @pFormatChecker l'instance associée à la valeur voulue du champ + * @pDefaultValue [OPT] Valeur par défaut pour l'input + * + * + * @return ajouté 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 , retourne FALSE + if( !(pFormatChecker instanceof formatChecker) ) return false; // si c'est pas un , retourne FALSE + + + /* [2] Référencement des nouvelles données + ====================================================*/ + // insertion du + var index = this.input.push( pInputElement ); + + // insertion du , 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 de rang spécifié + * + * @pInputElement L'élement qu'on veut vérifier + * + * + * @return verification 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 par la valeur actuelle de l'élément + ====================================================*/ + 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 + * + * @return verifications 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 l'élément concerné + * @pToEnd si on doit corriger jusqu'à la fin ou uniquement jusqu'à l'avancéé actuelle + * + * + * @return correctValue retourne la valeur corrigée + * retourne NULL si erreur + */ + correct: function(pInputElement, pToEnd){ + /* GESTION PARAMS */ + + // on retourne une erreur si l'élément 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 + ====================================================*/ + 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; + } + + + } + + +}; \ No newline at end of file diff --git a/src/invalid.svg b/src/invalid.svg new file mode 100644 index 0000000..e305f94 --- /dev/null +++ b/src/invalid.svg @@ -0,0 +1,49 @@ + +image/svg+xml \ No newline at end of file diff --git a/src/patient.svg b/src/patient.svg old mode 100644 new mode 100755 diff --git a/src/save.svg b/src/save.svg new file mode 100755 index 0000000..116425b --- /dev/null +++ b/src/save.svg @@ -0,0 +1,121 @@ + + + + + + image/svg+xml + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/validated.svg b/src/validated.svg new file mode 100755 index 0000000..67c7b48 --- /dev/null +++ b/src/validated.svg @@ -0,0 +1,49 @@ + +image/svg+xml \ No newline at end of file diff --git a/toBDD.php b/toBDD.php old mode 100644 new mode 100755