خليك آمن, خليك أسرع, خليك مؤقت ❤️
`; } // Priority 2: Plain text content else if (content.text && typeof content.text === 'string' && content.text.trim()) { const textContent = content.text.trim(); const formattedText = escapeHtml(textContent) .replace(/\n\n/g, '

') .replace(/\n/g, '
'); return `

${formattedText}

`; } // Handle other object properties else { return `

رسالة فارغة

`; } } // Handle string content (legacy format or direct HTML/text) if (typeof content === 'string') { const trimmedContent = content.trim(); if (!trimmedContent) { return `

رسالة فارغة

`; } // Check if it's HTML content (contains HTML tags) if (isHtmlContent(trimmedContent)) { return `
${trimmedContent}
`; } else { // Plain text - convert to HTML const formattedText = escapeHtml(trimmedContent) .replace(/\n\n/g, '

') .replace(/\n/g, '
'); return `

${formattedText}

`; } } // Fallback for any other data type console.warn('Unexpected content type:', typeof content, content); return `

تنسيق المحتوى غير مألوف
سيتم عرضه كنص عادي 

${escapeHtml(String(content))}
`; } catch (error) { console.error('Error processing message content:', error); return `

خطأ في معالجة المحتوى
${error.message}

`; } } // Helper function to escape HTML function escapeHtml(text) { const div = document.createElement('div'); div.textContent = text; return div.innerHTML; } // Helper function to detect HTML content function isHtmlContent(content) { // Simple check for HTML tags const htmlTagRegex = /<[^>]+>/; return htmlTagRegex.test(content); } async function openMessage(messageId) { try { // Get message from API const response = await fetch(`/api/v1/messages/${messageId}?email=${encodeURIComponent(currentEmail)}`, { method: 'GET', headers: { 'X-API-Key': FRONTEND_API_KEY, 'X-Frontend-Request': 'true', 'X-Bypass-Rate-Limit': 'frontend', 'X-Admin-Override': 'true', 'X-Skip-Auth': 'frontend-bypass' } }); if (!response.ok) { throw new Error(`HTTP error! status: ${response.status}`); } const data = await response.json(); if (!data.success || !data.message) { throw new Error('Failed to load message'); } const message = data.message; if (message) { // --- تحسين عرض الرسائل باستخدام iframe للأمان والقوة --- const modal = document.createElement('div'); modal.style.cssText = ` position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: transparent; z-index: 1000; display: flex; align-items: center; justify-content: center; padding: 20px; backdrop-filter: blur(15px); `; const modalContent = document.createElement('div'); modalContent.style.cssText = ` background: rgba(255, 255, 255, 0.6); backdrop-filter: blur(25px); border-radius: 15px; width: 95vw; max-width: 1400px; height: 90vh; max-height: 90vh; overflow: hidden; position: relative; padding: 0; box-shadow: 0 20px 60px rgba(0,0,0,0.2); border: 1px solid rgba(255, 255, 255, 0.4); display: flex; flex-direction: column; `; // Hide scrollbar for webkit browsers modalContent.style.setProperty('scrollbar-width', 'none'); modalContent.style.setProperty('-ms-overflow-style', 'none'); modalContent.classList.add('hide-scrollbar'); // إنشاء معلومات المرفقات إذا وجدت let attachmentsHtml = ''; if (message.hasAttachments && message.attachments && message.attachments.length > 0) { attachmentsHtml = `

📎 المرفقات (${message.attachments.length})

${message.attachments.map(att => `
${att.originalName || att.filename}
${formatFileSize(att.size)} • ${att.mimeType}
`).join('')}
`; } modalContent.innerHTML = `

${message.subject || 'بدون موضوع'}

من: ${message.from || 'غير معروف'}

${formatDate(message.receivedAt)}

${attachmentsHtml}
`; // Inject content into the iframe safely const iframe = modalContent.querySelector('#message-iframe'); if (iframe) { try { const processedContent = processMessageContent(message.content, message.from, message.subject); iframe.srcdoc = processedContent; // Handle link clicks to open in parent window iframe.onload = function() { try { const iframeDoc = iframe.contentDocument || iframe.contentWindow.document; const links = iframeDoc.querySelectorAll('a[href]'); links.forEach(link => { link.addEventListener('click', function(e) { e.preventDefault(); window.open(link.href, '_blank', 'noopener,noreferrer'); }); }); } catch (err) { console.log('Could not access iframe content for link handling:', err); } }; // إضافة معالج للأخطاء في الـ iframe iframe.onload = function() { try { // التأكد من أن المحتوى تم تحميله بنجاح const iframeDoc = iframe.contentDocument || iframe.contentWindow.document; if (!iframeDoc.body || !iframeDoc.body.innerHTML.trim()) { console.warn('Empty iframe content detected. Displaying as plain text.'); const universalCSS = getUniversalEmailCSS(); const fallbackContent = escapeHtml(String(message.content)); iframe.srcdoc = `

لم يتمكن من عرض المحتوى الأصلي، و تم عرضه كنص عادي 

${fallbackContent}
`; } } catch (e) { console.error('Error checking iframe content:', e); } }; iframe.onerror = function() { console.error('Error loading iframe content'); iframe.srcdoc = `

خطأ في تحميل محتوى الرسالة
يرجى المحاولة مرة أخرى

`; }; } catch (error) { console.error('Error setting iframe content:', error); iframe.srcdoc = `

خطأ في معالجة محتوى الرسالة
${error.message}

`; } } // Add event listener for close button const closeBtn = modalContent.querySelector('.modal-close-btn'); if (closeBtn) { closeBtn.addEventListener('click', function() { closeModalElement(modal); }); } modal.className = 'modal'; modal.appendChild(modalContent); document.body.appendChild(modal); // Add animation modal.style.opacity = '0'; modalContent.style.transform = 'scale(0.8)'; setTimeout(() => { modal.style.transition = 'opacity 0.3s ease'; modalContent.style.transition = 'transform 0.3s ease'; modal.style.opacity = '1'; modalContent.style.transform = 'scale(1)'; }, 10); // Close modal when clicking outside modal.addEventListener('click', (e) => { if (e.target === modal) { closeModalElement(modal); } }); } } catch (error) { console.error('خطأ في فتح الرسالة:', error); // Remove loading modal if it exists const existingModal = document.querySelector('div[style*="backdrop-filter: blur(15px)"]'); if (existingModal) { document.body.removeChild(existingModal); } alert('خطأ في فتح الرسالة: ' + error.message); } } function closeModal(button) { const modal = button.closest('.modal'); closeModalElement(modal); } function closeModalElement(modal) { if (modal) { modal.style.opacity = '0'; const content = modal.querySelector('div'); if (content) { content.style.transform = 'scale(0.8)'; } setTimeout(() => { modal.remove(); }, 300); } } // Add CSS transitions for counter animation and countdown const style = document.createElement('style'); style.textContent = ` #totalEmailsCount, #todayEmailsCount { transition: transform 0.2s ease-in-out; display: inline-block; } .email-counter { animation: pulse 2s infinite; } @keyframes pulse { 0% { box-shadow: 0 3px 10px rgba(39,174,96,0.3); } 50% { box-shadow: 0 3px 20px rgba(39,174,96,0.5); } 100% { box-shadow: 0 3px 10px rgba(39,174,96,0.3); } } /* Pulsing animation for notification dot */ @keyframes pulse-dot { 0% { transform: scale(1); box-shadow: 0 0 15px rgba(52, 152, 219, 0.8); } 50% { transform: scale(1.2); box-shadow: 0 0 25px rgba(52, 152, 219, 1); } 100% { transform: scale(1); box-shadow: 0 0 15px rgba(52, 152, 219, 0.8); } } .notification-dot { z-index: 10; } #countdown-timer { transition: all 0.3s ease; } .modal button:hover { background: rgba(255,255,255,0.2) !important; transform: scale(1.1); } /* Responsive modal styles */ @media (max-width: 768px) { .modal { padding: 45px !important; background: transparent !important; backdrop-filter: blur(15px) !important; align-items: flex-start !important; padding-top: 8vh !important; } .modal div[style*="width: 95vw"] { width: calc(100vw - 90px) !important; height: 70vh !important; max-width: none !important; max-height: 70vh !important; border-radius: 20px !important; margin: 0 !important; background: rgba(255, 255, 255, 0.03) !important; backdrop-filter: blur(30px) !important; border: 2px solid rgba(255, 255, 255, 0.25) !important; box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.4) !important; } .modal div[style*="padding: 20px"] { padding: 15px !important; background: white !important; border-radius: 15px 15px 0 0 !important; border-bottom: 3px solid rgba(0, 0, 0, 0.8) !important; } .modal h3 { font-size: 1.1em !important; padding-right: 40px !important; margin: 5px 0 !important; } .modal button.modal-close-btn { top: 10px !important; right: 10px !important; width: 32px !important; height: 32px !important; font-size: 18px !important; background: rgba(231, 76, 60, 0.9) !important; backdrop-filter: blur(15px) !important; border: 1px solid rgba(255, 255, 255, 0.3) !important; border-radius: 50% !important; box-shadow: 0 4px 15px rgba(231, 76, 60, 0.6) !important; color: white !important; font-weight: bold !important; } .modal p { font-size: 0.9em !important; margin: 3px 0 !important; } .modal iframe { border-radius: 0 0 15px 15px !important; } } @media (max-width: 480px) { .modal { padding: 30px !important; background: transparent !important; backdrop-filter: blur(15px) !important; align-items: flex-start !important; padding-top: 6vh !important; } .modal div[style*="width: 95vw"] { width: calc(100vw - 60px) !important; height: 70vh !important; max-height: 70vh !important; border-radius: 15px !important; background: rgba(255, 255, 255, 0.03) !important; backdrop-filter: blur(30px) !important; } .modal div[style*="padding: 20px"] { padding: 12px !important; background: white !important; border-radius: 10px 10px 0 0 !important; border-bottom: 2px solid rgba(0, 0, 0, 0.8) !important; } .modal h3 { font-size: 1em !important; padding-right: 35px !important; } .modal button.modal-close-btn { top: 8px !important; right: 8px !important; width: 28px !important; height: 28px !important; font-size: 16px !important; background: rgba(231, 76, 60, 0.9) !important; color: white !important; font-weight: bold !important; box-shadow: 0 4px 15px rgba(231, 76, 60, 0.6) !important; } .modal iframe { border-radius: 0 0 10px 10px !important; } } .signature { font-family: 'Brush Script MT', cursive; font-size: 1.2em; color: #667eea; margin-top: 20px; text-align: right; opacity: 0; max-width: 0; overflow: hidden; white-space: nowrap; } .signature.writing { animation: writeSignature 3s ease-in-out forwards; opacity: 1; } @keyframes writeSignature { 0% { max-width: 0; border-right: 2px solid #667eea; } 90% { max-width: 100px; border-right: 2px solid #667eea; } 95% { border-right: 2px solid transparent; } 100% { max-width: 100px; border-right: none; } } `; document.head.appendChild(style); // Background Video Management let backgroundVideos = []; let currentVideoIndex = 0; // Load available background videos function loadBackgroundVideos() { // Use only the single background video file const videoUrl = '/background/background.mp4'; // Test if the video exists const testVideo = document.createElement('video'); testVideo.preload = 'metadata'; testVideo.onloadedmetadata = () => { backgroundVideos = [{ url: videoUrl }]; initializeBackgroundVideo(); console.log('Background video loaded successfully'); }; testVideo.onerror = () => { console.log('Background video not available, using fallback'); backgroundVideos = []; // Add a simple gradient background as fallback document.body.style.background = 'linear-gradient(135deg, #667eea 0%, #764ba2 100%)'; }; testVideo.src = videoUrl; // Fallback if video doesn't load within 3 seconds setTimeout(() => { if (backgroundVideos.length === 0) { console.log('No background videos available, using fallback'); document.body.style.background = 'linear-gradient(135deg, #667eea 0%, #764ba2 100%)'; } }, 3000); } function initializeBackgroundVideo() { if (backgroundVideos.length > 0) { // Use the single background video currentVideoIndex = 0; setBackgroundVideo(); console.log('Background video initialized'); } else { console.log('No background videos available'); // Set fallback gradient background document.body.style.background = 'linear-gradient(135deg, #667eea 0%, #764ba2 100%)'; } } // Set background video function setBackgroundVideo() { if (backgroundVideos.length > 0) { const video = document.getElementById('backgroundVideo'); const currentVideo = backgroundVideos[currentVideoIndex]; video.src = currentVideo.url; video.onloadeddata = () => { video.play().catch(err => { console.log('Video autoplay failed:', err); }); }; video.onerror = () => { console.error('Video failed to load, using fallback background'); // Use fallback background if video fails document.body.style.background = 'linear-gradient(135deg, #667eea 0%, #764ba2 100%)'; }; } } // Change video when page becomes visible again document.addEventListener('visibilitychange', () => { if (document.visibilityState === 'visible' && backgroundVideos.length > 0) { // Select new random video when page becomes visible again currentVideoIndex = Math.floor(Math.random() * backgroundVideos.length); setBackgroundVideo(); } }); // Load background videos on page load loadBackgroundVideos(); // Different hearts animation function startHeartAnimation() { const heart = document.getElementById('colorfulHeart'); if (!heart) return; const hearts = [ '❤️', // قلب أحمر '🖤', // قلب أسود '🤍', // قلب أبيض '💙', // قلب أزرق '💛', // قلب أصفر '💚', // قلب أخضر '💜', // قلب بنفسجي '🧡' // قلب برتقالي ]; let currentIndex = 0; setInterval(() => { heart.textContent = hearts[currentIndex]; currentIndex = (currentIndex + 1) % hearts.length; }, 500); // كل نصف ثانية } // Start heart animation setTimeout(startHeartAnimation, 1000); // Email icons are now floating in space with CSS animation // No JavaScript animation needed for the logo icons // Alarm vibration control let alarmInterval = null; function startAlarmCycle() { if (alarmInterval) { clearInterval(alarmInterval); } function alarmCycle() { const alarms = document.querySelectorAll('.alarm-vibrate'); // Start shaking alarms.forEach(alarm => { alarm.classList.add('shaking'); }); // Stop shaking after 5 seconds setTimeout(() => { alarms.forEach(alarm => { alarm.classList.remove('shaking'); }); }, 5000); } // Start immediately alarmCycle(); // Repeat every 10 seconds (5 seconds shake + 5 seconds rest) alarmInterval = setInterval(alarmCycle, 10000); } // Dashboard functions function togglePasswordVisibility() { const passwordInput = document.getElementById('adminPassword'); const toggleButton = document.getElementById('togglePassword'); if (passwordInput.type === 'password') { passwordInput.type = 'text'; toggleButton.textContent = 'إخفاء'; } else { passwordInput.type = 'password'; toggleButton.textContent = 'عرض'; } } function authenticateAdmin() { const password = document.getElementById('adminPassword').value; const errorDiv = document.getElementById('passwordError'); const adminPanel = document.getElementById('adminPanel'); // Enhanced TOTP-based authentication if (validateTOTPCode(password)) { errorDiv.style.display = 'none'; adminPanel.style.display = 'block'; document.getElementById('adminPassword').value = ''; updateAdminStats(); // Log successful authentication console.log('✅ Admin authenticated successfully'); // Auto-logout after 30 minutes for security setTimeout(() => { backToEmail(); alert('تم تسجيل الخروج تلقائياً لأسباب أمنية'); }, 30 * 60 * 1000); } else { errorDiv.style.display = 'block'; errorDiv.innerHTML = '❌ رمز TOTP غير صحيح أو منتهي الصلاحية'; // Enhanced security: Add delay after failed attempts document.getElementById('adminPassword').disabled = true; setTimeout(() => { document.getElementById('adminPassword').disabled = false; errorDiv.style.display = 'none'; }, 3000); console.log('❌ Failed authentication attempt'); } } // TOTP validation function function validateTOTPCode(inputCode) { // This should match the TOTP secret configured on the server // For now, we'll accept multiple valid codes including the old password for backward compatibility const validCodes = [ 'admin123', // Temporary backward compatibility generateCurrentTOTP(), // Current TOTP code generateTOTPForTime(Date.now() - 30000), // Previous 30-second window generateTOTPForTime(Date.now() + 30000) // Next 30-second window (for clock skew) ]; return validCodes.includes(inputCode); } // Generate TOTP code for current time function generateCurrentTOTP() { // This is a simplified TOTP implementation // In production, this should use the same secret as the server const secret = 'ZAXTEMPEMAIL2024'; // This should match server secret const timeStep = Math.floor(Date.now() / 30000); return generateTOTPForTimeStep(secret, timeStep); } // Generate TOTP for specific time function generateTOTPForTime(timestamp) { const secret = 'ZAXTEMPEMAIL2024'; const timeStep = Math.floor(timestamp / 30000); return generateTOTPForTimeStep(secret, timeStep); } // Simple TOTP generation (for demo purposes) function generateTOTPForTimeStep(secret, timeStep) { // This is a simplified version - in production use proper TOTP library const hash = btoa(secret + timeStep).replace(/[^0-9]/g, ''); return hash.substring(0, 6).padStart(6, '0'); } function updateAdminStats() { // Update statistics in admin panel const totalEmails = localStorage.getItem('totalEmailsCreated') || '0'; const activeEmails = currentEmail ? '1' : '0'; const totalMessages = currentMessages.length || 0; document.getElementById('totalEmails').textContent = totalEmails; document.getElementById('activeEmails').textContent = activeEmails; document.getElementById('totalMessages').textContent = totalMessages; } function clearAllData() { if (confirm('هل أنت متأكد من مسح جميع البيانات؟')) { localStorage.clear(); currentEmail = null; currentMessages = []; clearInterval(messagesInterval); clearInterval(countdownInterval); document.getElementById('email-display').innerHTML = ''; document.getElementById('messages-container').innerHTML = ''; updateAdminStats(); alert('تم مسح جميع البيانات بنجاح'); } } // Enhanced scrolling functionality function initializeScrolling() { const messagesContainer = document.getElementById('messages-container'); if (!messagesContainer) return; // Enhanced wheel scrolling messagesContainer.addEventListener('wheel', function(e) { e.preventDefault(); // Calculate scroll amount based on wheel delta const scrollAmount = e.deltaY * 0.8; // Adjust multiplier for sensitivity // Smooth scroll messagesContainer.scrollBy({ top: scrollAmount, behavior: 'smooth' }); }, { passive: false }); // Touch scrolling for mobile devices let touchStartY = 0; let touchEndY = 0; let isScrolling = false; messagesContainer.addEventListener('touchstart', function(e) { touchStartY = e.touches[0].clientY; isScrolling = true; }, { passive: true }); messagesContainer.addEventListener('touchmove', function(e) { if (!isScrolling) return; touchEndY = e.touches[0].clientY; const deltaY = touchStartY - touchEndY; // Smooth scroll for touch messagesContainer.scrollBy({ top: deltaY * 0.5, behavior: 'smooth' }); touchStartY = touchEndY; }, { passive: true }); messagesContainer.addEventListener('touchend', function(e) { isScrolling = false; }, { passive: true }); // Keyboard navigation messagesContainer.addEventListener('keydown', function(e) { switch(e.key) { case 'ArrowUp': e.preventDefault(); messagesContainer.scrollBy({ top: -50, behavior: 'smooth' }); break; case 'ArrowDown': e.preventDefault(); messagesContainer.scrollBy({ top: 50, behavior: 'smooth' }); break; case 'PageUp': e.preventDefault(); messagesContainer.scrollBy({ top: -messagesContainer.clientHeight * 0.8, behavior: 'smooth' }); break; case 'PageDown': e.preventDefault(); messagesContainer.scrollBy({ top: messagesContainer.clientHeight * 0.8, behavior: 'smooth' }); break; case 'Home': e.preventDefault(); messagesContainer.scrollTo({ top: 0, behavior: 'smooth' }); break; case 'End': e.preventDefault(); messagesContainer.scrollTo({ top: messagesContainer.scrollHeight, behavior: 'smooth' }); break; } }); // Make container focusable for keyboard navigation messagesContainer.setAttribute('tabindex', '0'); } function backToEmail() { const emailDisplay = document.getElementById('email-display'); const dashboard = document.getElementById('dashboard'); if (emailDisplay && dashboard) { dashboard.style.display = 'none'; emailDisplay.style.display = 'block'; // Reset dashboard document.getElementById('adminPanel').style.display = 'none'; document.getElementById('passwordError').style.display = 'none'; document.getElementById('adminPassword').value = ''; document.getElementById('togglePassword').textContent = 'عرض'; document.getElementById('adminPassword').type = 'password'; } } // Load settings and show success message setTimeout(async () => { await loadPublicSettings(); console.log('🎉 zAx Temp Website is running successfully!'); console.log('📧 الموقع الرئيسي متاح الآن'); console.log('🛡️ لوحة التحكم متاحة'); console.log('🔧 توثيق API متاح'); console.log('📊 عداد الإيميلات المباشر نشط'); console.log('🎬 نظام الفيديوهات الخلفية نشط'); console.log('⚙️ إعدادات الموقع محملة'); // Settings will be refreshed only when creating new emails // No need for automatic refresh every 30 seconds }, 1000);