351 lines
17 KiB
JavaScript
351 lines
17 KiB
JavaScript
/**
|
|
* Localization Engine for Intaleq Map SaaS
|
|
* Supports Arabic (RTL) and English (LTR)
|
|
* Handles both landing page and dashboard
|
|
*/
|
|
|
|
const i18n = {
|
|
currentLang: localStorage.getItem('intaleq_lang') || 'en',
|
|
|
|
translations: {
|
|
en: {
|
|
// Navbar (Landing)
|
|
'nav-features': 'Features',
|
|
'nav-why': 'Why Us?',
|
|
'nav-pricing': 'Pricing',
|
|
'nav-launch': 'Launch Dashboard',
|
|
|
|
// Hero (Landing)
|
|
'hero-badge': 'Now with 3D Buildings in Jordan & Syria',
|
|
'hero-title': 'The Map API That <br> <span class="text-blue-500">Doesn\'t Break</span> The Bank.',
|
|
'hero-desc': 'Build premium location-based apps with high-fidelity vector tiles, optimized routing, and 3D buildings. 85% cheaper than Google Maps.',
|
|
'hero-cta-start': 'Start Building Free',
|
|
'hero-cta-view': 'View Comparison',
|
|
|
|
// Features (Landing)
|
|
'feat-latency-title': 'Zero Latency',
|
|
'feat-latency-desc': 'Our infrastructure is optimized for MENA region, ensuring map tiles load in under 200ms.',
|
|
'feat-routing-title': 'Smart Routing',
|
|
'feat-routing-desc': 'Enterprise-grade routing engine with support for alternative paths and traffic awareness.',
|
|
'feat-geocoding-title': 'Local Geocoding',
|
|
'feat-geocoding-desc': 'Highly accurate search for local landmarks and neighborhoods in Jordan & Syria.',
|
|
|
|
// Sidebar (Dashboard)
|
|
'side-dashboard': 'Dashboard',
|
|
'side-playground': 'Playground',
|
|
'side-analytics': 'Analytics',
|
|
'side-billing': 'Billing',
|
|
'side-audit': 'Place Audit',
|
|
'side-docs': 'Documentation',
|
|
'side-upgrade': 'Upgrade Plan',
|
|
'side-beta': 'Beta Access',
|
|
'side-free-msg': "You're currently on the sandbox tier.",
|
|
|
|
// Header
|
|
'system-status': 'System Operational',
|
|
'lang-toggle': 'العربية',
|
|
'loading': 'Loading...',
|
|
|
|
// Login
|
|
'login-title': 'Intaleq Maps',
|
|
'login-subtitle': 'The premium developer platform for mapping services in Jordan & Syria.',
|
|
'login-google': 'Continue with Google',
|
|
'login-footer': 'Enterprise Ready · Secure Access',
|
|
|
|
// Home / Dashboard
|
|
'welcome': 'Welcome back',
|
|
'tagline': 'Everything you need to build with premium Jordan Map Platform API',
|
|
'kpi-total-req': 'Total Requests',
|
|
'kpi-success-rate': 'Success Rate',
|
|
'kpi-active-keys': 'Active Keys',
|
|
'kpi-latency': 'Avg Latency',
|
|
'quota-card-title': 'Monthly Quota',
|
|
'req-left': 'requests left',
|
|
'live': 'Live',
|
|
'chart-request-volume': 'Request Traffic',
|
|
'chart-subtitle': 'Live traffic across all API endpoints',
|
|
'full-analytics': 'Full Analytics',
|
|
'quick-start': 'Quick Start',
|
|
'quick-start-msg': 'Get started with our lightweight SDK in seconds.',
|
|
'install-npm': '# Install with npm',
|
|
'view-api-ref': 'View API Reference',
|
|
'try-playground': 'Try Maps Playground',
|
|
|
|
// Keys Table
|
|
'keys-title': 'Your API Keys',
|
|
'keys-subtitle': 'Manage keys for your applications',
|
|
'keys-create': 'Create New Key',
|
|
'keys-fetching': 'Fetching your secure keys...',
|
|
'table-name': 'Name',
|
|
'table-key': 'API Key',
|
|
'table-status': 'Status',
|
|
'table-restrictions': 'Restrictions',
|
|
'table-actions': 'Actions',
|
|
'table-loc-name': 'Location Name',
|
|
'table-match': 'Automated Match',
|
|
'table-spatial': 'Spatial Context',
|
|
'table-date': 'Date',
|
|
'table-amount': 'Amount',
|
|
'table-provider': 'Provider',
|
|
|
|
// Playground
|
|
'playground-subtitle': 'Test your API keys and visualize vector tiles in real-time',
|
|
'pg-config': 'Configuration',
|
|
'pg-active-key': 'Active API Key',
|
|
'pg-style': 'Map Style',
|
|
'pg-search-placeholder': 'Search Amman, Jordan...',
|
|
|
|
// Analytics
|
|
'analytics-subtitle': 'Deep insights into your API performance',
|
|
'chart-success-ratio': 'Success Ratio',
|
|
'chart-latency-breakdown': 'Latency Breakdown',
|
|
|
|
// Audit
|
|
'audit-subtitle': 'Review and approve user-suggested map locations',
|
|
'audit-empty': 'No pending location suggestions.',
|
|
|
|
// Billing
|
|
'billing-subtitle': 'Manage your plan, payment methods, and invoice history.',
|
|
'current-plan': 'Current Plan',
|
|
'billing-reset-msg': 'Your monthly usage resets on the 1st of each month.',
|
|
'active': 'Active',
|
|
'plan-sandbox': 'Sandbox',
|
|
'plan-starter-title': 'Starter',
|
|
'plan-pro-title': 'Professional',
|
|
'plan-ent-title': 'Enterprise',
|
|
'popular': 'Best Value',
|
|
'mo': 'mo',
|
|
'req-mo': 'requests /mo',
|
|
'req-min': 'requests / min',
|
|
'feature-tiles': 'Standard Map Tiles',
|
|
'feature-no-routing': 'No Routing API',
|
|
'feature-3d': '3D Building Data',
|
|
'feature-3d-ext': '3D Building Extrusion',
|
|
'feature-basic-geo': 'Basic Geocoding',
|
|
'feature-routing': 'Advanced Routing API',
|
|
'feature-priority': 'Priority Support',
|
|
'feature-custom': 'Custom Data Layers',
|
|
'feature-sla': 'SLA Guarantees',
|
|
'feature-dedicated': 'Dedicated Architect',
|
|
'plan-current': 'Current Plan',
|
|
'plan-upgrade-starter': 'Upgrade to Starter',
|
|
'pay-card': 'Pay with Card',
|
|
'contact-sales': 'Contact Sales',
|
|
'bill-transaction-history': 'Transaction History',
|
|
|
|
// Modals
|
|
'modal-key-title': 'Create API Key',
|
|
'modal-key-subtitle': 'Set up a new access point for your application.',
|
|
'modal-key-label': 'Key Name',
|
|
'cancel': 'Cancel',
|
|
'guides-title': 'Guides',
|
|
'side-sdks': 'SDKs & Libraries',
|
|
'docs-overview': 'Overview',
|
|
'docs-getting-started': 'Getting Started',
|
|
'docs-sdks-title': 'Client SDKs',
|
|
'docs-rest-title': 'REST APIs'
|
|
},
|
|
ar: {
|
|
// Navbar (Landing)
|
|
'nav-features': 'المميزات',
|
|
'nav-why': 'لماذا نحن؟',
|
|
'nav-pricing': 'الأسعار',
|
|
'nav-launch': 'لوحة التحكم',
|
|
|
|
// Hero (Landing)
|
|
'hero-badge': 'الآن مع المباني ثلاثية الأبعاد في الأردن وسوريا',
|
|
'hero-title': 'واجهة خرائط برمجية <br> <span class="text-blue-500">لا ترهق</span> ميزانيتك.',
|
|
'hero-desc': 'ابنِ تطبيقات خرائط فاخرة مع خرائط مجهزة، توجيه ذكي، ومباني ثلاثية الأبعاد. أوفر بنسبة 85% من خرائط جوجل.',
|
|
'hero-cta-start': 'ابدأ مجاناً',
|
|
'hero-cta-view': 'قارن الأسعار',
|
|
|
|
// Features (Landing)
|
|
'feat-latency-title': 'سرعة فائقة',
|
|
'feat-latency-desc': 'بنيتنا التحتية محسنة لمنطقة الشرق الأوسط، مما يضمن تحميل الخرائط في أقل من 200 مللي ثانية.',
|
|
'feat-routing-title': 'توجيه ذكي',
|
|
'feat-routing-desc': 'محرك توجيه من الفئة المؤسسية يدعم المسارات البديلة والوعي بحركة المرور.',
|
|
'feat-geocoding-title': 'بحث مكاني محلي',
|
|
'feat-geocoding-desc': 'دقة عالية جداً في البحث عن المعالم والأحياء في الأردن وسوريا.',
|
|
|
|
// Sidebar (Dashboard)
|
|
'side-dashboard': 'لوحة التحكم',
|
|
'side-playground': 'المختبر',
|
|
'side-analytics': 'التحليلات',
|
|
'side-billing': 'الفواتير',
|
|
'side-audit': 'تدقيق الأماكن',
|
|
'side-docs': 'التوثيق',
|
|
'side-upgrade': 'ترقية الخطة',
|
|
'side-beta': 'وصول تجريبي',
|
|
'side-free-msg': 'أنت حالياً على الخطة المجانية.',
|
|
|
|
// Header
|
|
'system-status': 'النظام يعمل بكفاءة',
|
|
'lang-toggle': 'English',
|
|
'loading': 'جاري التحميل...',
|
|
|
|
// Login
|
|
'login-title': 'انطلاق للخرائط',
|
|
'login-subtitle': 'منصة المطورين الأولى لخدمات الخرائط في الأردن وسوريا.',
|
|
'login-google': 'المتابعة باستخدام جوجل',
|
|
'login-footer': 'جاهز للمؤسسات · وصول آمن',
|
|
|
|
// Home / Dashboard
|
|
'welcome': 'مرحباً بك مجدداً',
|
|
'tagline': 'كل ما تحتاجه للبناء باستخدام واجهة خرائط الأردن المتطورة',
|
|
'kpi-total-req': 'إجمالي الطلبات',
|
|
'kpi-success-rate': 'نسبة النجاح',
|
|
'kpi-active-keys': 'المفاتيح النشطة',
|
|
'kpi-latency': 'متوسط الاستجابة',
|
|
'quota-card-title': 'الرصيد الشهري',
|
|
'req-left': 'طلب متبقي',
|
|
'live': 'مباشر',
|
|
'chart-request-volume': 'نشاط الطلبات',
|
|
'chart-subtitle': 'حركة البيانات المباشرة عبر جميع الواجهات',
|
|
'full-analytics': 'التحليلات الكاملة',
|
|
'quick-start': 'البداية السريعة',
|
|
'quick-start-msg': 'ابدأ الدمج باستخدام مكتبتنا البرمجية في ثوانٍ.',
|
|
'install-npm': '# التثبيت عبر npm',
|
|
'view-api-ref': 'عرض مرجع الـ API',
|
|
'try-playground': 'تجربة المختبر',
|
|
|
|
// Keys Table
|
|
'keys-title': 'مفاتيح الـ API الخاصة بك',
|
|
'keys-subtitle': 'إدارة مفاتيح الوصول لتطبيقاتك',
|
|
'keys-create': 'إنشاء مفتاح جديد',
|
|
'keys-fetching': 'جاري جلب مفاتيحك الآمنة...',
|
|
'table-name': 'الاسم',
|
|
'table-key': 'مفتاح الـ API',
|
|
'table-status': 'الحالة',
|
|
'table-restrictions': 'القيود',
|
|
'table-actions': 'الإجراءات',
|
|
'table-loc-name': 'اسم الموقع',
|
|
'table-match': 'المطابقة التلقائية',
|
|
'table-spatial': 'السياق المكاني',
|
|
'table-date': 'التاريخ',
|
|
'table-amount': 'المبلغ',
|
|
'table-provider': 'المزود',
|
|
|
|
// Playground
|
|
'playground-subtitle': 'اختبر مفاتيحك وعاين خرائط الـ Vector في الوقت الفعلي',
|
|
'pg-config': 'الإعدادات',
|
|
'pg-active-key': 'مفتاح الـ API النشط',
|
|
'pg-style': 'تنسيق الخريطة',
|
|
'pg-search-placeholder': 'ابحث في عمان، الأردن...',
|
|
|
|
// Analytics
|
|
'analytics-subtitle': 'رؤى عميقة حول أداء واجهات البرمجة الخاصة بك',
|
|
'chart-success-ratio': 'نسبة النجاح',
|
|
'chart-latency-breakdown': 'تفاصيل وقت الاستجابة',
|
|
|
|
// Audit
|
|
'audit-subtitle': 'مراجعة واعتماد المواقع المقترحة من المستخدمين',
|
|
'audit-empty': 'لا توجد مقترحات مواقع معلقة حالياً.',
|
|
|
|
// Billing
|
|
'billing-subtitle': 'إدارة خطتك، وسائل الدفع، وسجل الفواتير.',
|
|
'current-plan': 'الخطة الحالية',
|
|
'billing-reset-msg': 'يتم إعادة تعيين رصيدك في اليوم الأول من كل شهر.',
|
|
'active': 'نشط',
|
|
'plan-sandbox': 'تجريبية',
|
|
'plan-starter-title': 'مبتدئ',
|
|
'plan-pro-title': 'احترافي',
|
|
'plan-ent-title': 'مؤسسات',
|
|
'popular': 'الأكثر قيمة',
|
|
'mo': 'شهر',
|
|
'req-mo': 'طلب / شهر',
|
|
'req-min': 'طلب / دقيقة',
|
|
'feature-tiles': 'خرائط Vector القياسية',
|
|
'feature-no-routing': 'بدون خدمة المسارات',
|
|
'feature-3d': 'بيانات المباني ثلاثية الأبعاد',
|
|
'feature-3d-ext': 'مباني ثلاثية الأبعاد (Extrusion)',
|
|
'feature-basic-geo': 'تكويد جغرافي أساسي',
|
|
'feature-routing': 'واجهة مسارات متطورة',
|
|
'feature-priority': 'دعم فني ذو أولوية',
|
|
'feature-custom': 'طبقات بيانات مخصصة',
|
|
'feature-sla': 'ضمانات مستوى الخدمة',
|
|
'feature-dedicated': 'مهندس دعم مخصص',
|
|
'plan-current': 'الخطة الحالية',
|
|
'plan-upgrade-starter': 'ترقية إلى "مبتدئ"',
|
|
'pay-card': 'الدفع بالبطاقة',
|
|
'contact-sales': 'تواصل مع المبيعات',
|
|
'bill-transaction-history': 'سجل العمليات',
|
|
|
|
// Modals
|
|
'modal-key-title': 'إنشاء مفتاح API',
|
|
'modal-key-subtitle': 'إعداد نقطة وصول جديدة لتطبيقك.',
|
|
'modal-key-label': 'اسم المفتاح',
|
|
'cancel': 'إلغاء',
|
|
'guides-title': 'الأدلة برمجية',
|
|
'side-sdks': 'المكتبات البرمجية (SDKs)',
|
|
'docs-overview': 'نظرة عامة',
|
|
'docs-getting-started': 'البدء السريع',
|
|
'docs-sdks-title': 'المكتبات وحزم الـ SDK',
|
|
'docs-rest-title': 'واجهات الـ REST API'
|
|
}
|
|
},
|
|
|
|
init: () => {
|
|
console.log(`🌍 i18n Initializing: ${i18n.currentLang}`);
|
|
i18n.apply(i18n.currentLang);
|
|
},
|
|
|
|
toggle: () => {
|
|
i18n.currentLang = i18n.currentLang === 'en' ? 'ar' : 'en';
|
|
localStorage.setItem('intaleq_lang', i18n.currentLang);
|
|
location.reload();
|
|
},
|
|
|
|
apply: (lang) => {
|
|
const rtl = lang === 'ar';
|
|
document.documentElement.dir = rtl ? 'rtl' : 'ltr';
|
|
document.documentElement.lang = lang;
|
|
|
|
// Apply font families
|
|
if (rtl) {
|
|
document.body.style.fontFamily = "'Cairo', sans-serif";
|
|
document.body.classList.add('rtl-mode');
|
|
} else {
|
|
document.body.style.fontFamily = "'Plus Jakarta Sans', sans-serif";
|
|
document.body.classList.remove('rtl-mode');
|
|
}
|
|
|
|
// Sidebar mirroring logic
|
|
const sidebar = document.getElementById('main-sidebar');
|
|
if (sidebar) {
|
|
if (rtl) {
|
|
sidebar.classList.add('order-last', 'border-l', 'border-r-0');
|
|
sidebar.classList.remove('border-r');
|
|
} else {
|
|
sidebar.classList.remove('order-last', 'border-l');
|
|
sidebar.classList.add('border-r');
|
|
}
|
|
}
|
|
|
|
// Apply text content
|
|
document.querySelectorAll('[data-i18n]').forEach(el => {
|
|
const key = el.getAttribute('data-i18n');
|
|
const translation = i18n.translations[lang][key];
|
|
if (translation) {
|
|
if (el.tagName === 'INPUT' || el.tagName === 'TEXTAREA') {
|
|
el.placeholder = translation;
|
|
} else {
|
|
el.innerHTML = translation;
|
|
}
|
|
}
|
|
});
|
|
|
|
// Apply placeholders
|
|
document.querySelectorAll('[data-i18n-placeholder]').forEach(el => {
|
|
const key = el.getAttribute('data-i18n-placeholder');
|
|
const translation = i18n.translations[lang][key];
|
|
if (translation) el.placeholder = translation;
|
|
});
|
|
|
|
// Trigger icon re-render
|
|
if (window.lucide) lucide.createIcons();
|
|
}
|
|
};
|
|
|
|
// Auto-init
|
|
document.addEventListener('DOMContentLoaded', i18n.init);
|