test
This commit is contained in:
parent
6b805c26b4
commit
063af445bb
|
|
@ -1,441 +1,59 @@
|
|||
<?php
|
||||
$this->titre = "INTER-SANTÉ - Connexion";
|
||||
$this->titre = "INTER-SANTE - Connexion" ;
|
||||
|
||||
// Gestion des cookies de session
|
||||
if (isset($_COOKIE['codeUtilisateur'])) {
|
||||
$_SESSION['lang'] = $_COOKIE['lang'] ?? 'fr_FR';
|
||||
$codeUtilisateur = $_COOKIE['codeUtilisateur'];
|
||||
} else {
|
||||
$_SESSION['lang'] = "fr_FR";
|
||||
$codeUtilisateur = "";
|
||||
}
|
||||
|
||||
// Déterminer l'URL de base
|
||||
$baseUrl = isset($racineWeb) ? $racineWeb : '/';
|
||||
if (isset($_COOKIE['codeUtilisateur']))
|
||||
{
|
||||
$_SESSION['lang'] = $_COOKIE['lang'];
|
||||
$codeUtilisateur = $_COOKIE['codeUtilisateur'];
|
||||
}
|
||||
else
|
||||
{
|
||||
$_SESSION['lang'] = "fr_FR";
|
||||
$codeUtilisateur = "";
|
||||
}
|
||||
?>
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="fr" data-bs-theme="light">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title><?= htmlspecialchars($this->titre) ?></title>
|
||||
|
||||
<!-- Meta pour optimisation -->
|
||||
<meta name="description" content="Portail de connexion INTER-SANTÉ">
|
||||
<meta name="theme-color" content="#b7472a">
|
||||
|
||||
<!-- Préchargement des ressources critiques -->
|
||||
<link rel="preconnect" href="https://cdn.jsdelivr.net">
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
|
||||
<!-- Bootstrap 5 (version unique) -->
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet"
|
||||
integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN"
|
||||
crossorigin="anonymous">
|
||||
|
||||
<!-- Bootstrap Icons -->
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css">
|
||||
|
||||
<!-- Font Awesome -->
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
|
||||
|
||||
<!-- Styles de connexion spécifiques -->
|
||||
<link rel="stylesheet" type="text/css" href="<?= $baseUrl ?>Bootstrap/login/vendor/bootstrap/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" type="text/css" href="<?= $baseUrl ?>Bootstrap/login/fonts/font-awesome-4.7.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" type="text/css" href="<?= $baseUrl ?>Bootstrap/login/fonts/iconic/css/material-design-iconic-font.min.css">
|
||||
<link rel="stylesheet" type="text/css" href="<?= $baseUrl ?>Bootstrap/login/vendor/animate/animate.css">
|
||||
<link rel="stylesheet" type="text/css" href="<?= $baseUrl ?>Bootstrap/login/vendor/css-hamburgers/hamburgers.min.css">
|
||||
<link rel="stylesheet" type="text/css" href="<?= $baseUrl ?>Bootstrap/login/vendor/animsition/css/animsition.min.css">
|
||||
<link rel="stylesheet" type="text/css" href="<?= $baseUrl ?>Bootstrap/login/vendor/select2/select2.min.css">
|
||||
<link rel="stylesheet" type="text/css" href="<?= $baseUrl ?>Bootstrap/login/vendor/daterangepicker/daterangepicker.css">
|
||||
<link rel="stylesheet" type="text/css" href="<?= $baseUrl ?>Bootstrap/login/css/util.css">
|
||||
<link rel="stylesheet" type="text/css" href="<?= $baseUrl ?>Bootstrap/login/css/main.css">
|
||||
|
||||
<!-- Styles optimisés pour les polices -->
|
||||
<style>
|
||||
/* Fallback immédiat pour éviter le FOUT */
|
||||
@font-face {
|
||||
font-family: 'Play Fallback';
|
||||
src: local('Arial'), local('Segoe UI');
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: 'Play Fallback', 'Play', 'Segoe UI', sans-serif;
|
||||
}
|
||||
|
||||
/* Masquer les éléments masqués proprement */
|
||||
.sr-only {
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
padding: 0;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
white-space: nowrap;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
/* Optimisation réseau lent */
|
||||
.slow-network .animated-element {
|
||||
animation: none !important;
|
||||
transition: none !important;
|
||||
}
|
||||
|
||||
/* Loader pour connexion */
|
||||
.login-loader {
|
||||
display: none;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: rgba(255,255,255,0.9);
|
||||
z-index: 9999;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.login-loader.active {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.loader-spinner {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
border: 5px solid #f3f3f3;
|
||||
border-top: 5px solid #b7472a;
|
||||
border-radius: 50%;
|
||||
animation: spin 1s linear infinite;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
0% { transform: rotate(0deg); }
|
||||
100% { transform: rotate(360deg); }
|
||||
}
|
||||
</style>
|
||||
|
||||
<!-- Favicon -->
|
||||
<link rel="icon" href="<?= $baseUrl ?>Bootstrap_new/images/new/favicon.png" type="image/png">
|
||||
</head>
|
||||
<INPUT class="sr-only" TYPE="text" id="vue" name="vue" value="Connexion"/>
|
||||
|
||||
<body>
|
||||
<!-- Loader de connexion -->
|
||||
<div class="login-loader" id="loginLoader">
|
||||
<div class="loader-spinner"></div>
|
||||
<p class="mt-3 text-muted">Connexion en cours...</p>
|
||||
</div>
|
||||
<?php if (isset($msgErreur) ): ?>
|
||||
<input class="sr-only" type="text" id="msgErreur" name="msgErreur" value="<?= $msgErreur ?>">
|
||||
<?php else : ?>
|
||||
<input class="sr-only" type="text" id="msgErreur" name="msgErreur" value="">
|
||||
<?php endif; ?>
|
||||
|
||||
<!-- Champs cachés pour données PHP -->
|
||||
<input class="sr-only" type="text" id="vue" name="vue" value="Connexion">
|
||||
<input class="sr-only" type="text" id="msgErreur" name="msgErreur" value="<?= isset($msgErreur) ? htmlspecialchars($msgErreur) : '' ?>">
|
||||
<input class="sr-only" type="text" id="baseUrl" value="<?= $baseUrl ?>">
|
||||
<input class="sr-only" type="text" id="codeUtilisateur" value="<?= htmlspecialchars($codeUtilisateur) ?>">
|
||||
<input class="sr-only" type="text" id="currentLang" value="<?= $_SESSION['lang'] ?>">
|
||||
<div id="div_ajaxconnexion">
|
||||
</div>
|
||||
|
||||
<!-- Conteneur principal -->
|
||||
<div id="div_ajaxconnexion">
|
||||
<!-- Le contenu de connexion sera injecté ici -->
|
||||
</div>
|
||||
<script src="Bootstrap/js/jquery.min.js"></script>
|
||||
<script src="Bootstrap/js/jquery-ui.js"></script>
|
||||
<script src="Bootstrap/js/bootstrap.min.js"></script>
|
||||
<script src="Js/datepicker-fr.js"></script>
|
||||
<script src="Js/fonctions.js?ver=connexion_2025.09.25.04"></script>
|
||||
<script src="Bootstrap/js/timer.jquery.js"></script>
|
||||
<script src="Bootstrap/js/jquery.timer.js"></script>
|
||||
<script src="Bootstrap/js/ajaxmask.js"></script>
|
||||
<script src="Bootstrap/js/custom.js"></script>
|
||||
|
||||
<!-- ============================================
|
||||
SCRIPTS OPTIMISÉS - Version unique et moderne
|
||||
============================================ -->
|
||||
|
||||
<!-- jQuery 3.7.1 (version unique et moderne) -->
|
||||
<script src="https://code.jquery.com/jquery-3.7.1.min.js"
|
||||
integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo="
|
||||
crossorigin="anonymous"></script>
|
||||
|
||||
<!-- jQuery UI -->
|
||||
<script src="https://code.jquery.com/ui/1.13.2/jquery-ui.min.js"
|
||||
integrity="sha256-lSjKY0/srUM9BE3dPm+c4fBo1dky2v27Gdjm2uoZaL0="
|
||||
crossorigin="anonymous"></script>
|
||||
|
||||
<!-- Bootstrap 5 Bundle (remplace toutes les versions Bootstrap) -->
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"
|
||||
integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL"
|
||||
crossorigin="anonymous"></script>
|
||||
|
||||
<!-- Bibliothèques de connexion spécifiques (version optimisée) -->
|
||||
<script src="<?= $baseUrl ?>Bootstrap/login/vendor/animsition/js/animsition.min.js"></script>
|
||||
<script src="<?= $baseUrl ?>Bootstrap/login/vendor/select2/select2.min.js"></script>
|
||||
<script src="<?= $baseUrl ?>Bootstrap/login/vendor/daterangepicker/moment.min.js"></script>
|
||||
<script src="<?= $baseUrl ?>Bootstrap/login/vendor/daterangepicker/daterangepicker.js"></script>
|
||||
|
||||
<!-- Bibliothèques applicatives -->
|
||||
<script src="<?= $baseUrl ?>Js/fonctions.js?ver=2025.12.21.01"></script>
|
||||
<script src="<?= $baseUrl ?>Bootstrap/js/ajaxmask.js?ver=2025.12.21.01"></script>
|
||||
|
||||
<!-- Datepicker selon la langue -->
|
||||
<?php if ($_SESSION['lang'] === 'en_US'): ?>
|
||||
<script src="<?= $baseUrl ?>Js/datepicker-eng.js?ver=2025.12.21.01"></script>
|
||||
<?php else: ?>
|
||||
<script src="<?= $baseUrl ?>Js/datepicker-fr.js?ver=2025.12.21.01"></script>
|
||||
<?php endif; ?>
|
||||
|
||||
<!-- Script principal de connexion -->
|
||||
<script src="<?= $baseUrl ?>Bootstrap/login/js/main.js?ver=2025.12.21.01"></script>
|
||||
<!--===============================================================================================-->
|
||||
<script src="Bootstrap/login/vendor/jquery/jquery-3.2.1.min.js"></script>
|
||||
<!--===============================================================================================-->
|
||||
<script src="Bootstrap/login/vendor/animsition/js/animsition.min.js"></script>
|
||||
<!--===============================================================================================-->
|
||||
<script src="Bootstrap/login/vendor/bootstrap/js/popper.js"></script>
|
||||
<script src="Bootstrap/login/vendor/bootstrap/js/bootstrap.min.js"></script>
|
||||
<!--===============================================================================================-->
|
||||
<script src="Bootstrap/login/vendor/select2/select2.min.js"></script>
|
||||
<!--===============================================================================================-->
|
||||
<script src="Bootstrap/login/vendor/daterangepicker/moment.min.js"></script>
|
||||
<script src="Bootstrap/login/vendor/daterangepicker/daterangepicker.js"></script>
|
||||
<!--===============================================================================================-->
|
||||
<script src="Bootstrap/login/vendor/countdowntime/countdowntime.js"></script>
|
||||
<!--===============================================================================================-->
|
||||
<script src="Bootstrap/login/js/main.js"></script>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap-select@1.13.14/dist/js/bootstrap-select.min.js"></script>
|
||||
|
||||
<!-- ============================================
|
||||
SCRIPT D'INITIALISATION OPTIMISÉ
|
||||
============================================ -->
|
||||
<script>
|
||||
(function() {
|
||||
'use strict';
|
||||
|
||||
console.log('Initialisation page connexion...');
|
||||
|
||||
// Variables globales pour cette page
|
||||
window.loginConfig = {
|
||||
baseUrl: '<?= $baseUrl ?>',
|
||||
currentLang: '<?= $_SESSION['lang'] ?>',
|
||||
codeUtilisateur: '<?= $codeUtilisateur ?>',
|
||||
debugMode: true
|
||||
};
|
||||
|
||||
// Détection réseau lent
|
||||
function detectSlowNetwork() {
|
||||
if ('connection' in navigator) {
|
||||
const conn = navigator.connection;
|
||||
if (conn && (conn.effectiveType === 'slow-2g' || conn.effectiveType === '2g')) {
|
||||
console.log('Réseau lent détecté, optimisation en cours...');
|
||||
document.body.classList.add('slow-network');
|
||||
|
||||
// Optimisations pour réseau lent
|
||||
optimizeForSlowNetwork();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function optimizeForSlowNetwork() {
|
||||
// Désactiver les animations non critiques
|
||||
const style = document.createElement('style');
|
||||
style.textContent = `
|
||||
.slow-network * {
|
||||
animation-duration: 0.01ms !important;
|
||||
animation-iteration-count: 1 !important;
|
||||
transition-duration: 0.01ms !important;
|
||||
}
|
||||
|
||||
.slow-network [data-lazy] {
|
||||
display: none;
|
||||
}
|
||||
`;
|
||||
document.head.appendChild(style);
|
||||
}
|
||||
|
||||
// Gestion du loader
|
||||
function showLoader() {
|
||||
document.getElementById('loginLoader').classList.add('active');
|
||||
}
|
||||
|
||||
function hideLoader() {
|
||||
document.getElementById('loginLoader').classList.remove('active');
|
||||
}
|
||||
|
||||
// Vérification des cookies
|
||||
function checkCookies() {
|
||||
const cookies = document.cookie.split(';');
|
||||
let hasSessionCookie = false;
|
||||
|
||||
cookies.forEach(cookie => {
|
||||
if (cookie.trim().startsWith('codeUtilisateur=')) {
|
||||
hasSessionCookie = true;
|
||||
}
|
||||
});
|
||||
|
||||
return hasSessionCookie;
|
||||
}
|
||||
|
||||
// Initialisation principale
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
console.log('DOM chargé, initialisation en cours...');
|
||||
|
||||
// Détection réseau
|
||||
detectSlowNetwork();
|
||||
|
||||
// Vérifier les cookies
|
||||
const hasCookies = checkCookies();
|
||||
|
||||
// Gestion des erreurs
|
||||
const errorMsg = document.getElementById('msgErreur').value;
|
||||
if (errorMsg && errorMsg.trim() !== '') {
|
||||
console.warn('Message d\'erreur détecté:', errorMsg);
|
||||
|
||||
// Afficher l'erreur après un délai
|
||||
setTimeout(function() {
|
||||
if (typeof Swal !== 'undefined') {
|
||||
Swal.fire({
|
||||
title: 'Erreur',
|
||||
text: errorMsg,
|
||||
icon: 'error',
|
||||
confirmButtonText: 'OK'
|
||||
});
|
||||
} else {
|
||||
alert(errorMsg);
|
||||
}
|
||||
}, 1000);
|
||||
}
|
||||
|
||||
// Appeler la fonction de connexion cookie
|
||||
if (typeof connexion_cookie === 'function') {
|
||||
console.log('Appel de connexion_cookie()');
|
||||
connexion_cookie();
|
||||
} else {
|
||||
console.error('Fonction connexion_cookie() non trouvée');
|
||||
}
|
||||
|
||||
// Configurer les écouteurs d'événements
|
||||
setupEventListeners();
|
||||
|
||||
// Optimiser les performances
|
||||
optimizePerformance();
|
||||
});
|
||||
|
||||
function setupEventListeners() {
|
||||
// Écouter les soumissions de formulaire
|
||||
document.addEventListener('submit', function(e) {
|
||||
if (e.target.matches('form[action*="connecter"]')) {
|
||||
showLoader();
|
||||
|
||||
// Timeout de sécurité
|
||||
setTimeout(hideLoader, 30000); // 30 secondes max
|
||||
}
|
||||
});
|
||||
|
||||
// Écouter les clics sur les liens de connexion
|
||||
document.addEventListener('click', function(e) {
|
||||
if (e.target.closest('a[href*="connecter"]')) {
|
||||
showLoader();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function optimizePerformance() {
|
||||
// Précharger les images critiques
|
||||
const criticalImages = [
|
||||
'<?= $baseUrl ?>Bootstrap/login/images/bg-01.jpg',
|
||||
'<?= $baseUrl ?>Bootstrap_new/images/new/favicon.png'
|
||||
];
|
||||
|
||||
criticalImages.forEach(src => {
|
||||
const img = new Image();
|
||||
img.src = src;
|
||||
});
|
||||
|
||||
// Lazy loading pour les images non critiques
|
||||
if ('loading' in HTMLImageElement.prototype) {
|
||||
const images = document.querySelectorAll('img[data-src]');
|
||||
images.forEach(img => {
|
||||
img.loading = 'lazy';
|
||||
img.src = img.dataset.src;
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// Exposer des fonctions pour débogage
|
||||
window.loginDebug = {
|
||||
showLoader: showLoader,
|
||||
hideLoader: hideLoader,
|
||||
getConfig: () => window.loginConfig
|
||||
};
|
||||
|
||||
console.log('Initialisation terminée');
|
||||
|
||||
})();
|
||||
|
||||
// Fonction globale de connexion cookie
|
||||
function connexion_cookie() {
|
||||
console.log('connexion_cookie() exécutée');
|
||||
|
||||
const codeUtilisateur = document.getElementById('codeUtilisateur').value;
|
||||
const currentLang = document.getElementById('currentLang').value;
|
||||
const baseUrl = document.getElementById('baseUrl').value;
|
||||
|
||||
if (codeUtilisateur && codeUtilisateur.trim() !== '') {
|
||||
console.log('Cookie utilisateur trouvé:', codeUtilisateur);
|
||||
|
||||
// Préparer les données
|
||||
const formData = new FormData();
|
||||
formData.append('login', codeUtilisateur);
|
||||
formData.append('langue', currentLang);
|
||||
|
||||
// Afficher le loader
|
||||
if (window.loginDebug) {
|
||||
window.loginDebug.showLoader();
|
||||
}
|
||||
|
||||
// Envoyer la requête AJAX
|
||||
fetch(baseUrl + 'Connexion/connecter', {
|
||||
method: 'POST',
|
||||
body: formData,
|
||||
credentials: 'same-origin'
|
||||
})
|
||||
.then(response => {
|
||||
if (response.redirected) {
|
||||
window.location.href = response.url;
|
||||
} else {
|
||||
return response.text();
|
||||
}
|
||||
})
|
||||
.then(html => {
|
||||
if (html) {
|
||||
document.getElementById('div_ajaxconnexion').innerHTML = html;
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Erreur connexion cookie:', error);
|
||||
if (window.loginDebug) {
|
||||
window.loginDebug.hideLoader();
|
||||
}
|
||||
})
|
||||
.finally(() => {
|
||||
// Cacher le loader après un délai
|
||||
setTimeout(() => {
|
||||
if (window.loginDebug) {
|
||||
window.loginDebug.hideLoader();
|
||||
}
|
||||
}, 1000);
|
||||
});
|
||||
} else {
|
||||
console.log('Aucun cookie utilisateur trouvé, affichage du formulaire normal');
|
||||
|
||||
// Charger le formulaire de connexion normal
|
||||
fetch(baseUrl + 'Connexion/formulaire')
|
||||
.then(response => response.text())
|
||||
.then(html => {
|
||||
document.getElementById('div_ajaxconnexion').innerHTML = html;
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Erreur chargement formulaire:', error);
|
||||
document.getElementById('div_ajaxconnexion').innerHTML =
|
||||
'<div class="alert alert-danger">Erreur de chargement du formulaire</div>';
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// Assurer que la fonction est disponible globalement
|
||||
window.connexion_cookie = connexion_cookie;
|
||||
|
||||
</script>
|
||||
|
||||
<!-- Analytics et monitoring (optionnel) -->
|
||||
<script>
|
||||
// Monitoring des performances
|
||||
window.addEventListener('load', function() {
|
||||
const timing = performance.timing;
|
||||
const loadTime = timing.loadEventEnd - timing.navigationStart;
|
||||
|
||||
console.log('Temps de chargement total:', loadTime + 'ms');
|
||||
|
||||
if (loadTime > 3000) {
|
||||
console.warn('Chargement lent détecté');
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
<script type="text/javascript">
|
||||
connexion_cookie();
|
||||
</script>
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user