152 lines
3.3 KiB
PHP
152 lines
3.3 KiB
PHP
{{--
|
|
========================================
|
|
LOADING SCREEN MODULARE
|
|
========================================
|
|
Schermata di caricamento con animazioni e messaggi.
|
|
|
|
Autore: NetGesCon Development Team
|
|
Data: 2024
|
|
========================================
|
|
--}}
|
|
|
|
<div id="netgesconLoader" class="netgescon-loader">
|
|
<div class="loader-content">
|
|
<div class="loader-icon">
|
|
<i class="fas fa-building fa-3x text-primary"></i>
|
|
</div>
|
|
<div class="loader-spinner">
|
|
<div class="spinner-border text-primary" role="status">
|
|
<span class="visually-hidden">Caricamento...</span>
|
|
</div>
|
|
</div>
|
|
<div class="loader-text">
|
|
<h5 class="mb-1">NetGesCon</h5>
|
|
<p class="text-muted mb-0">Caricamento in corso...</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{{-- CSS per loader --}}
|
|
@push('styles')
|
|
<style>
|
|
.netgescon-loader {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
z-index: 9999;
|
|
transition: opacity 0.5s ease, visibility 0.5s ease;
|
|
}
|
|
|
|
.netgescon-loader.hidden {
|
|
opacity: 0;
|
|
visibility: hidden;
|
|
}
|
|
|
|
.loader-content {
|
|
text-align: center;
|
|
animation: fadeInUp 0.8s ease-out;
|
|
}
|
|
|
|
.loader-icon {
|
|
margin-bottom: 1rem;
|
|
animation: pulse 2s ease-in-out infinite;
|
|
}
|
|
|
|
.loader-spinner {
|
|
margin: 1rem 0;
|
|
}
|
|
|
|
.loader-text h5 {
|
|
font-weight: 600;
|
|
letter-spacing: -0.5px;
|
|
}
|
|
|
|
/* Animazioni */
|
|
@keyframes fadeInUp {
|
|
from {
|
|
opacity: 0;
|
|
transform: translateY(30px);
|
|
}
|
|
to {
|
|
opacity: 1;
|
|
transform: translateY(0);
|
|
}
|
|
}
|
|
|
|
@keyframes pulse {
|
|
0%, 100% {
|
|
transform: scale(1);
|
|
opacity: 1;
|
|
}
|
|
50% {
|
|
transform: scale(1.05);
|
|
opacity: 0.8;
|
|
}
|
|
}
|
|
|
|
/* Tema scuro */
|
|
.dark .netgescon-loader {
|
|
background: linear-gradient(135deg, #1a1a1a 0%, #2d3748 100%);
|
|
color: var(--bs-light);
|
|
}
|
|
|
|
.dark .loader-text .text-muted {
|
|
color: var(--bs-gray-400) !important;
|
|
}
|
|
</style>
|
|
@endpush
|
|
|
|
{{-- JavaScript per loader --}}
|
|
@push('scripts')
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
const loader = document.getElementById('netgesconLoader');
|
|
|
|
// Nascondi loader dopo caricamento pagina
|
|
function hideLoader() {
|
|
if (loader) {
|
|
loader.classList.add('hidden');
|
|
setTimeout(() => {
|
|
loader.style.display = 'none';
|
|
}, 500);
|
|
}
|
|
}
|
|
|
|
// Nascondi dopo caricamento completo
|
|
if (document.readyState === 'complete') {
|
|
hideLoader();
|
|
} else {
|
|
window.addEventListener('load', hideLoader);
|
|
}
|
|
|
|
// Timeout di sicurezza (massimo 10 secondi)
|
|
setTimeout(hideLoader, 10000);
|
|
});
|
|
|
|
// Funzione globale per mostrare/nascondere loader
|
|
window.showLoader = function() {
|
|
const loader = document.getElementById('netgesconLoader');
|
|
if (loader) {
|
|
loader.style.display = 'flex';
|
|
loader.classList.remove('hidden');
|
|
}
|
|
};
|
|
|
|
window.hideLoader = function() {
|
|
const loader = document.getElementById('netgesconLoader');
|
|
if (loader) {
|
|
loader.classList.add('hidden');
|
|
setTimeout(() => {
|
|
loader.style.display = 'none';
|
|
}, 500);
|
|
}
|
|
};
|
|
</script>
|
|
@endpush
|