Spaces:
Running
Running
| <html lang="en" dir="ltr" id="html"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title data-en="All Dashboards | Rasd Intelligence Platform" data-ar="جميع لوحات الذكاء | منصة رصد الذكية">All Dashboards | Rasd Intelligence Platform</title> | |
| <link href="https://fonts.googleapis.com/css2?family=Tajawal:wght@200;300;400;500;700;800;900&display=swap" rel="stylesheet"> | |
| <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet"> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <script> | |
| tailwind.config = { | |
| theme: { | |
| extend: { | |
| colors: { 'saudi-green': '#006C35', 'saudi-gold': '#C9A646', 'saudi-dark': '#1A2E44' }, | |
| fontFamily: { 'tajawal': ['Tajawal', 'sans-serif'] } | |
| } | |
| } | |
| } | |
| </script> | |
| <style> | |
| body { font-family: 'Tajawal', sans-serif; background-color: #f8f9fa; } | |
| .gradient-bg { background: linear-gradient(135deg, #006C35 0%, #004d26 100%); } | |
| .rtl { direction: rtl; } .ltr { direction: ltr; } | |
| .dashboard-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(400px, 1fr)); gap: 2rem; } | |
| .dashboard-card { background: white; border-radius: 20px; padding: 1.5rem; box-shadow: 0 10px 30px rgba(0,0,0,0.05); transition: transform 0.3s ease, box-shadow 0.3s ease; } | |
| .dashboard-card:hover { transform: translateY(-5px); box-shadow: 0 15px 40px rgba(0,0,0,0.1); } | |
| .dashboard-preview { width: 100%; height: 250px; border-radius: 15px; margin-bottom: 1rem; overflow: hidden; position: relative; } | |
| .dashboard-preview img { width: 100%; height: 100%; object-fit: cover; border-radius: 15px; } | |
| .dashboard-placeholder { | |
| width: 100%; height: 100%; | |
| background: linear-gradient(135deg, #f0f0f0, #e0e0e0); | |
| display: flex; align-items: center; justify-content: center; | |
| color: #999; font-size: 14px; border-radius: 15px; | |
| position: absolute; top: 0; left: 0; z-index: 1; | |
| } | |
| .dashboard-preview img[data-loaded="true"] + .dashboard-placeholder { display: none; } | |
| </style> | |
| </head> | |
| <body class="font-tajawal"> | |
| <!-- Header --> | |
| <header class="gradient-bg text-white shadow-lg"> | |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-6 flex items-center justify-between"> | |
| <div> | |
| <h1 class="text-3xl font-bold" data-en="All Intelligence Dashboards" data-ar="جميع لوحات الذكاء">All Intelligence Dashboards</h1> | |
| <p class="opacity-80" data-en="Explore specialized modules for deep analysis" data-ar="استكشف الوحدات المتخصصة للتحليل العميق">Explore specialized modules for deep analysis</p> | |
| </div> | |
| <div class="flex items-center space-x-4"> | |
| <button onclick="toggleLanguage()" class="flex items-center space-x-2 px-3 py-2 rounded-lg border-2 border-saudi-gold text-saudi-gold hover:bg-saudi-gold hover:text-saudi-dark transition-all"> | |
| <i class="fas fa-globe"></i> | |
| <span id="lang-toggle">العربية</span> | |
| </button> | |
| <a href="index.html" class="px-4 py-2 bg-white/20 hover:bg-white/30 rounded-lg transition-all"> | |
| <i class="fas fa-arrow-left mr-2"></i> | |
| <span data-en="Back to News Analysis" data-ar="العودة لتحليل الخبر">Back to News Analysis</span> | |
| </a> | |
| </div> | |
| </div> | |
| </header> | |
| <main class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12"> | |
| <div class="dashboard-grid"> | |
| <!-- Card 1: Real-time News Feed --> | |
| <div class="dashboard-card"> | |
| <div class="dashboard-preview"> | |
| <img src="./dashboard-realtime-feed.gif" alt="Real-time Feed" loading="lazy" onload="this.setAttribute('data-loaded', 'true')"> | |
| <div class="dashboard-placeholder" data-en="Real-time News Feed" data-ar="التغذية الإخبارية المباشرة">Real-time News Feed</div> | |
| </div> | |
| <h4 class="text-xl font-bold text-saudi-dark" data-en="Real-time News Feed" data-ar="التغذية الإخبارية المباشرة">Real-time News Feed</h4> | |
| <p class="text-gray-600 mt-2 text-base leading-relaxed" data-en="Provides a live, minute-by-minute feed of where your news is being published globally, enabling rapid response and tracking of its spread." data-ar="توفر تغذية حية دقيقة بدقيقة لأماكن نشر أخبارك عالميًا، مما يتيح الاستجابة السريعة وتتبع انتشارها لحظة بلحظة.">Provides a live, minute-by-minute feed of where your news is being published globally, enabling rapid response and tracking of its spread.</p> | |
| </div> | |
| <!-- Card 2: Global Impact Summary --> | |
| <div class="dashboard-card"> | |
| <div class="dashboard-preview"> | |
| <img src="./dashboard-global-summary.gif" alt="Global Summary" loading="lazy" onload="this.setAttribute('data-loaded', 'true')"> | |
| <div class="dashboard-placeholder" data-en="Global Impact Summary" data-ar="ملخص التأثير العالمي">Global Impact Summary</div> | |
| </div> | |
| <h4 class="text-xl font-bold text-saudi-dark" data-en="Global Impact Summary" data-ar="ملخص التأثير العالمي">Global Impact Summary</h4> | |
| <p class="text-gray-600 mt-2 text-base leading-relaxed" data-en="A high-level overview of news reach, showing the number of countries and media outlets covering the story for a quick impact assessment." data-ar="نظرة عامة شاملة على مدى وصول الأخبار، تعرض عدد الدول والمنافذ الإعلامية التي تغطي القصة لتقييم سريع وموجز للتأثير الكلي.">A high-level overview of news reach, showing the number of countries and media outlets covering the story for a quick impact assessment.</p> | |
| </div> | |
| <!-- Card 3: News Content Analysis --> | |
| <div class="dashboard-card"> | |
| <div class="dashboard-preview"> | |
| <img src="./dashboard-news.gif" alt="News Analysis" loading="lazy" onload="this.setAttribute('data-loaded', 'true')"> | |
| <div class="dashboard-placeholder" data-en="News Content Analysis" data-ar="تحليل محتوى الأخبار">News Content Analysis</div> | |
| </div> | |
| <h4 class="text-xl font-bold text-saudi-dark" data-en="News Content Analysis" data-ar="تحليل محتوى الأخبار">News Content Analysis</h4> | |
| <p class="text-gray-600 mt-2 text-base leading-relaxed" data-en="Uses NLP to detect paraphrased or translated versions of your news, ensuring you track all forms of your content across the web." data-ar="تستخدم معالجة اللغات الطبيعية (NLP) لاكتشاف النسخ المعاد صياغتها أو المترجمة من أخبارك، لضمان تتبع جميع أشكال المحتوى الخاص بك عبر الويب.">Uses NLP to detect paraphrased or translated versions of your news, ensuring you track all forms of your content across the web.</p> | |
| </div> | |
| <!-- Card 4: Automated Reports --> | |
| <div class="dashboard-card"> | |
| <div class="dashboard-preview"> | |
| <img src="./dashboard-reports.gif" alt="Reports" loading="lazy" onload="this.setAttribute('data-loaded', 'true')"> | |
| <div class="dashboard-placeholder" data-en="Automated Reports" data-ar="التقارير التلقائية">Automated Reports</div> | |
| </div> | |
| <h4 class="text-xl font-bold text-saudi-dark" data-en="Automated Reports" data-ar="التقارير التلقائية">Automated Reports</h4> | |
| <p class="text-gray-600 mt-2 text-base leading-relaxed" data-en="Generates comprehensive performance reports automatically, saving time and providing key insights for management and stakeholders." data-ar="تنشئ تقارير أداء شاملة وتلقائية، مما يوفر الوقت ويقدم رؤى أساسية للإدارة وأصحاب المصلحة لاتخاذ قرارات مستنيرة.">Generates comprehensive performance reports automatically, saving time and providing key insights for management and stakeholders.</p> | |
| </div> | |
| <!-- Card 5: Sentiment Analysis --> | |
| <div class="dashboard-card"> | |
| <div class="dashboard-preview"> | |
| <img src="./dashboard-sentiment.gif" alt="Sentiment Analysis" loading="lazy" onload="this.setAttribute('data-loaded', 'true')"> | |
| <div class="dashboard-placeholder" data-en="Sentiment Analysis" data-ar="تحليل المشاعر">Sentiment Analysis</div> | |
| </div> | |
| <h4 class="text-xl font-bold text-saudi-dark" data-en="Sentiment Analysis" data-ar="تحليل المشاعر">Sentiment Analysis</h4> | |
| <p class="text-gray-600 mt-2 text-base leading-relaxed" data-en="Analyzes public comments and reactions to classify the overall sentiment (positive, negative, neutral) towards the news content, aiding in public perception management." data-ar="تحلل تعليقات وردود أفعال الجمهور لتصنيف المشاعر العامة (إيجابية، سلبية، محايدة) تجاه المحتوى الإخباري بدقة عالية، مما يساعد في إدارة الانطباع العام.">Analyzes public comments and reactions to classify the overall sentiment (positive, negative, neutral) towards the news content, aiding in public perception management.</p> | |
| </div> | |
| <!-- Card 6: Topic Intelligence --> | |
| <div class="dashboard-card"> | |
| <div class="dashboard-preview"> | |
| <img src="./dashboard-topic-analysis.gif" alt="Topic Analysis" loading="lazy" onload="this.setAttribute('data-loaded', 'true')"> | |
| <div class="dashboard-placeholder" data-en="Topic Intelligence" data-ar="ذكاء المواضيع">Topic Intelligence</div> | |
| </div> | |
| <h4 class="text-xl font-bold text-saudi-dark" data-en="Topic Intelligence" data-ar="ذكاء المواضيع">Topic Intelligence</h4> | |
| <p class="text-gray-600 mt-2 text-base leading-relaxed" data-en="Identifies the main topics and themes being discussed in relation to your news, revealing the core of the public conversation and trending subjects." data-ar="تحدد المواضيع والمحاور الرئيسية التي تتم مناقشتها فيما يتعلق بأخبارك، مما يكشف عن جوهر المحادثة العامة واتجاهاتها والمواضيع الرائجة.">Identifies the main topics and themes being discussed in relation to your news, revealing the core of the public conversation and trending subjects.</p> | |
| </div> | |
| <!-- Card 7: Predictive Analytics --> | |
| <div class="dashboard-card"> | |
| <div class="dashboard-preview"> | |
| <img src="./dashboard-prediction.gif" alt="Prediction" loading="lazy" onload="this.setAttribute('data-loaded', 'true')"> | |
| <div class="dashboard-placeholder" data-en="Predictive Analytics" data-ar="التحليلات التنبؤية">Predictive Analytics</div> | |
| </div> | |
| <h4 class="text-xl font-bold text-saudi-dark" data-en="Predictive Analytics" data-ar="التحليلات التنبؤية">Predictive Analytics</h4> | |
| <p class="text-gray-600 mt-2 text-base leading-relaxed" data-en="Forecasts which news stories are likely to go viral, allowing for proactive content strategy and effective resource allocation based on future trends." data-ar="تتنبأ بالأخبار التي من المحتمل أن تنتشر بشكل واسع، مما يسمح باستراتيجية محتوى استباقية وتخصيص الموارد بشكل فعال بناءً على الاتجاهات المستقبلية.">Forecasts which news stories are likely to go viral, allowing for proactive content strategy and effective resource allocation based on future trends.</p> | |
| </div> | |
| <!-- Card 8: Influencers Impact --> | |
| <div class="dashboard-card"> | |
| <div class="dashboard-preview"> | |
| <img src="./dashboard-influencers.gif" alt="Influencers" loading="lazy" onload="this.setAttribute('data-loaded', 'true')"> | |
| <div class="dashboard-placeholder" data-en="Influencers Impact" data-ar="تأثير المؤثرين">Influencers Impact</div> | |
| </div> | |
| <h4 class="text-xl font-bold text-saudi-dark" data-en="Influencers Impact" data-ar="تأثير المؤثرين">Influencers Impact</h4> | |
| <p class="text-gray-600 mt-2 text-base leading-relaxed" data-en="Identifies key opinion leaders and influencers who are amplifying your news and precisely measures their impact on reach and public discourse." data-ar="تحدد قادة الرأي والمؤثرين الرئيسيين الذين يساهمون في نشر أخبارك وتقيس بدقة مدى تأثيرهم على الوصول والانتشار والخطاب العام.">Identifies key opinion leaders and influencers who are amplifying your news and precisely measures their impact on reach and public discourse.</p> | |
| </div> | |
| <!-- Card 9: Viral Content Tracker --> | |
| <div class="dashboard-card"> | |
| <div class="dashboard-preview"> | |
| <img src="./dashboard-virality.gif" alt="Virality" loading="lazy" onload="this.setAttribute('data-loaded', 'true')"> | |
| <div class="dashboard-placeholder" data-en="Viral Content Tracker" data-ar="متتبع المحتوى الفيروسي">Viral Content Tracker</div> | |
| </div> | |
| <h4 class="text-xl font-bold text-saudi-dark" data-en="Viral Content Tracker" data-ar="متتبع المحتوى الفيروسي">Viral Content Tracker</h4> | |
| <p class="text-gray-600 mt-2 text-base leading-relaxed" data-en="Detects news stories that are spreading exceptionally fast, providing deep insights into the mechanics and patterns of virality to understand why content becomes popular." data-ar="يكتشف الأخبار التي تنتشر بسرعة استثنائية، ويقدم رؤى عميقة حول آليات وأنماط الانتشار الفيروسي لفهم أسباب شعبية المحتوى.">Detects news stories that are spreading exceptionally fast, providing deep insights into the mechanics and patterns of virality to understand why content becomes popular.</p> | |
| </div> | |
| <!-- Card 10: Image Tracking --> | |
| <div class="dashboard-card"> | |
| <div class="dashboard-preview"> | |
| <img src="./dashboard-image-tracking.gif" alt="Image Tracking" loading="lazy" onload="this.setAttribute('data-loaded', 'true')"> | |
| <div class="dashboard-placeholder" data-en="Image Tracking" data-ar="تتبع الصور">Image Tracking</div> | |
| </div> | |
| <h4 class="text-xl font-bold text-saudi-dark" data-en="Image Tracking" data-ar="تتبع الصور">Image Tracking</h4> | |
| <p class="text-gray-600 mt-2 text-base leading-relaxed" data-en="Uses Computer Vision to find where your photos are being reused across the web, even if they are cropped, edited, or altered, ensuring full control over visual content." data-ar="تستخدم رؤية الحاسوب للعثور على أماكن إعادة استخدام صورك عبر الويب، حتى لو تم قصها أو تعديلها أو تغيير ألوانها، لضمان التحكم الكامل بالمحتوى البصري.">Uses Computer Vision to find where your photos are being reused across the web, even if they are cropped, edited, or altered, ensuring full control over visual content.</p> | |
| </div> | |
| </div> | |
| </main> | |
| <script> | |
| let currentLanguage = 'en'; | |
| function toggleLanguage() { | |
| currentLanguage = currentLanguage === 'en' ? 'ar' : 'en'; | |
| updatePageLanguage(); | |
| } | |
| function updatePageLanguage() { | |
| const isArabic = currentLanguage === 'ar'; | |
| const htmlEl = document.getElementById('html'); | |
| htmlEl.setAttribute('lang', currentLanguage); | |
| htmlEl.setAttribute('dir', isArabic ? 'rtl' : 'ltr'); | |
| document.body.classList.toggle('rtl', isArabic); | |
| document.body.classList.toggle('ltr', !isArabic); | |
| document.getElementById('lang-toggle').textContent = isArabic ? 'English' : 'العربية'; | |
| document.querySelectorAll('[data-en]').forEach(el => { | |
| const text = el.getAttribute(`data-${currentLanguage}`); | |
| if (text) { | |
| el.textContent = text; | |
| } | |
| }); | |
| document.querySelectorAll('title[data-en]').forEach(el => { | |
| const text = el.getAttribute(`data-${currentLanguage}`); | |
| if (text) { | |
| el.textContent = text; | |
| } | |
| }); | |
| document.querySelectorAll('.dashboard-placeholder[data-en]').forEach(el => { | |
| const text = el.getAttribute(`data-${currentLanguage}`); | |
| if (text) { | |
| el.textContent = text; | |
| } | |
| }); | |
| } | |
| // Initialize page on load | |
| document.addEventListener('DOMContentLoaded', function() { | |
| updatePageLanguage(); | |
| // Add additional error handling for images | |
| document.querySelectorAll('.dashboard-preview img').forEach(img => { | |
| img.addEventListener('error', function() { | |
| this.style.display = 'none'; | |
| const placeholder = this.nextElementSibling; | |
| if (placeholder) { | |
| placeholder.style.display = 'flex'; | |
| } | |
| }); | |
| img.addEventListener('load', function() { | |
| this.setAttribute('data-loaded', 'true'); | |
| const placeholder = this.nextElementSibling; | |
| if (placeholder) { | |
| placeholder.style.display = 'none'; | |
| } | |
| }); | |
| }); | |
| }); | |
| </script> | |
| </body> | |
| </html> |