Spaces:
Running
Running
File size: 19,102 Bytes
18f561f |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 |
<!DOCTYPE html>
<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> |