// Initialize mobile app when DOM is loaded document.addEventListener('DOMContentLoaded', function() { // Initialize app functionality initializeApp(); // Add touch feedback for buttons addTouchFeedback(); // Initialize swipe gestures initializeSwipeGestures(); // Add haptic feedback simulation addHapticFeedback(); // Initialize balance animation animateBalance(); }); // Initialize app function initializeApp() { console.log('LibyaPay App Initialized'); // Check if app is running on mobile if (isMobileDevice()) { document.body.classList.add('mobile-device'); } // Initialize touch events initializeTouchEvents(); } // Check if device is mobile function isMobileDevice() { return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent); } // Add touch feedback for buttons function addTouchFeedback() { document.querySelectorAll('button').forEach(button => { button.addEventListener('touchstart', function() { this.style.transform = 'scale(0.95)'; this.style.opacity = '0.8'; }); button.addEventListener('touchend', function() { this.style.transform = 'scale(1)'; this.style.opacity = '1'; }); }); } // Initialize swipe gestures function initializeSwipeGestures() { let touchStartX = 0; let touchEndX = 0; document.addEventListener('touchstart', function(e) { touchStartX = e.changedTouches[0].screenX; }); document.addEventListener('touchend', function(e) { touchEndX = e.changedTouches[0].screenX; handleSwipe(); }); function handleSwipe() { const swipeThreshold = 50; const diff = touchStartX - touchEndX; if (Math.abs(diff) > swipeThreshold) { if (diff > 0) { // Swipe left console.log('Swipe left detected'); } else { // Swipe right console.log('Swipe right detected'); } } } } // Add haptic feedback simulation function addHapticFeedback() { document.querySelectorAll('button').forEach(button => { button.addEventListener('click', function() { // Vibrate if supported if (navigator.vibrate) { navigator.vibrate(50); } }); }); } // Initialize balance animation function animateBalance() { const balanceElement = document.querySelector('.text-3xl'); if (balanceElement) { const finalBalance = 1234.56; let currentBalance = 0; const increment = finalBalance / 50; const animation = setInterval(() => { currentBalance += increment; if (currentBalance >= finalBalance) { balanceElement.textContent = finalBalance.toFixed(2) + ' د.ل'; clearInterval(animation); } else { balanceElement.textContent = currentBalance.toFixed(2) + ' د.ل'; } }, 20); } } // Initialize touch events for better mobile experience function initializeTouchEvents() { // Prevent default touch behaviors document.addEventListener('touchmove', function(e) { if (e.target.closest('.overflow-y-auto')) { // Allow scrolling in scrollable areas return; } e.preventDefault(); }, { passive: false }); // Add active state styling on touch document.addEventListener('touchstart', function(e) { if (e.target.closest('button')) { e.target.closest('button').classList.add('touch-active'); } }); document.addEventListener('touchend', function(e) { document.querySelectorAll('.touch-active').forEach(el => { el.classList.remove('touch-active'); }); }); } // Simulate notification updates function showNotification(message) { const notification = document.createElement('div'); notification.className = 'fixed top-20 right-4 bg-libyana-600 text-white px-4 py-3 rounded-lg shadow-lg z-50 animate-slide-up'; notification.textContent = message; document.body.appendChild(notification); setTimeout(() => { notification.remove(); }, 3000); } // Handle online/offline status function updateConnectionStatus() { const isOnline = navigator.onLine; if (!isOnline) { showNotification('أنت الآن في وضع عدم الاتصال - يمكنك استخدام الخدمات الأساسية'); } } window.addEventListener('online', updateConnectionStatus); window.addEventListener('offline', updateConnectionStatus); // Initialize payment functions function initiatePayment(amount, recipient) { console.log(`Initiating payment: ${amount} د.ل to ${recipient}`); showNotification(`جاري إرسال ${amount} د.ل إلى ${recipient}`); // Simulate payment processing setTimeout(() => { showNotification('تم إرسال المبلغ بنجاح'); updateBalance(); }, 2000); } // Update balance after transaction function updateBalance() { const balanceElement = document.querySelector('.text-3xl'); if (balanceElement) { const currentBalance = parseFloat(balanceElement.textContent.replace(' د.ل', '')); const newBalance = currentBalance - 100; // Example deduction balanceElement.textContent = newBalance.toFixed(2) + ' د.ل'; } } // QR Scanner simulation function openQRScanner() { showNotification('جاري فتح الماسح الضوئي...'); // In a real app, this would open the camera for QR scanning }