// Defer non-critical operations window.addEventListener('load', function() { // Mark when the page is fully loaded if (window.performance && window.performance.mark) { window.performance.mark('app-loaded'); window.performance.measure('app-startup', 'app-start', 'app-loaded'); } // Initialize lazy loading for images if ('IntersectionObserver' in window) { const lazyImages = document.querySelectorAll('img[data-src]'); const imageObserver = new IntersectionObserver((entries) => { entries.forEach(entry => { if (entry.isIntersecting) { const img = entry.target; img.src = img.dataset.src; img.removeAttribute('data-src'); imageObserver.unobserve(img); } }); }); lazyImages.forEach(img => imageObserver.observe(img)); } // Register service worker for PWA support if ('serviceWorker' in navigator) { navigator.serviceWorker.register('/sw.js', { scope: '/' }) .then(registration => { console.log('Service Worker registered with scope:', registration.scope); // Check for updates every hour setInterval(() => { registration.update(); console.log('Checking for Service Worker updates...'); }, 60 * 60 * 1000); // Listen for updates registration.addEventListener('updatefound', () => { const newWorker = registration.installing; console.log('New service worker installing...'); newWorker.addEventListener('statechange', () => { if (newWorker.state === 'installed' && navigator.serviceWorker.controller) { console.log('New content is available, please refresh the page.'); // Show update notification showUpdateNotification(); } }); }); }) .catch(error => { console.error('Service Worker registration failed:', error); }); // Listen for messages from service worker navigator.serviceWorker.addEventListener('message', event => { const { type, payload } = event.data; switch (type) { case 'CACHE_UPDATED': console.log('New content is available, please refresh the page.'); showUpdateNotification(); break; case 'OFFLINE_READY': console.log('Content is cached for offline use.'); break; } }); // Handle online/offline events window.addEventListener('online', updateOnlineStatus); window.addEventListener('offline', updateOnlineStatus); updateOnlineStatus(); // Initial check } }); // Show update notification function showUpdateNotification() { // Create notification element const notification = document.createElement('div'); notification.className = 'sw-update-notification'; notification.innerHTML = '

Nova verzija stranice je dostupna!

'; // Add styles const style = document.createElement('style'); style.textContent = ' .sw-update-notification { position: fixed; bottom: 20px; right: 20px; background-color: #D4AF37; color: #fff; padding: 15px; border-radius: 4px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); z-index: 9999; animation: slide-in 0.3s ease-out; } .sw-update-content { display: flex; align-items: center; gap: 10px; } .sw-update-content p { margin: 0; font-weight: 500; } .sw-update-button { background-color: #fff; color: #D4AF37; border: none; padding: 5px 10px; border-radius: 3px; cursor: pointer; font-weight: 500; } .sw-dismiss-button { background: none; border: none; color: #fff; text-decoration: underline; cursor: pointer; } @keyframes slide-in { from { transform: translateY(100px); opacity: 0; } to { transform: translateY(0); opacity: 1; } } '; document.head.appendChild(style); document.body.appendChild(notification); // Add event listeners notification.querySelector('.sw-update-button').addEventListener('click', () => { window.location.reload(); }); notification.querySelector('.sw-dismiss-button').addEventListener('click', () => { document.body.removeChild(notification); }); } // Update online status function updateOnlineStatus() { const isOnline = navigator.onLine; if (!isOnline) { showOfflineNotification(); } else { const wasOffline = sessionStorage.getItem('wasOffline'); if (wasOffline === 'true') { showOnlineNotification(); } } sessionStorage.setItem('wasOffline', !isOnline ? 'true' : 'false'); } // Show offline notification function showOfflineNotification() { const notification = document.createElement('div'); notification.className = 'connection-notification offline'; notification.innerHTML = '

Trenutno ste offline. Neki sadržaji možda neće biti dostupni.

'; addConnectionStyles(); document.body.appendChild(notification); setTimeout(() => { if (document.body.contains(notification)) { notification.classList.add('fade-out'); setTimeout(() => { if (document.body.contains(notification)) { document.body.removeChild(notification); } }, 500); } }, 5000); } // Show online notification function showOnlineNotification() { const notification = document.createElement('div'); notification.className = 'connection-notification online'; notification.innerHTML = ' {/* Google Analytics is in head */}

{children}

Katalog Proizvoda

Kategorije proizvoda

Kategorije