| <!doctype html> |
| <html lang="ar" dir="rtl" class="h-full"> |
| <head> |
| <meta charset="UTF-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| <meta name="supabase-url" content=""> |
| <meta name="supabase-anon-key" content=""> |
| <title>بيان - مساعد الكتابة العربية الذكي</title> |
| <meta name="description" content="بيان — منصة ذكاء اصطناعي متكاملة لتصحيح الإملاء والنحو والترقيم وتلخيص النصوص والإكمال التلقائي وتدقيق القرآن الكريم وتحويل اللهجات — مصمّمة خصيصًا للغة العربية. جرّبه مجاناً!"> |
| <meta property="og:image" content="https://raw.githubusercontent.com/mohamedatef24/BAYAN/main/extension/assets/icons/icon128.png"> |
| <meta property="og:title" content="بيان — مساعدك الذكي للكتابة بالعربية"> |
| <meta property="og:description" content="تدقيق إملائي ونحوي وترقيم، تلخيص ذكي، إكمال تلقائي، تدقيق القرآن الكريم، وتحويل اللهجات"> |
| <meta name="twitter:card" content="summary_large_image"> |
| <meta name="twitter:image" content="https://raw.githubusercontent.com/mohamedatef24/BAYAN/main/extension/assets/icons/icon128.png"> |
| <link rel="icon" type="image/png" href="favicon.png"> |
| <script src="https://cdn.tailwindcss.com"></script> |
| <link rel="preconnect" href="https://fonts.googleapis.com"> |
| <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> |
| <link href="https://fonts.googleapis.com/css2?family=Amiri+Quran&family=Cairo:wght@400;500;600;700&display=swap" rel="stylesheet"> |
| <link rel="stylesheet" href="/css/tokens.css"> |
| <link rel="stylesheet" href="/css/base.css"> |
| <link rel="stylesheet" href="/css/components.css"> |
|
|
| <script src="/js/vendor/supabase.min.js"></script> |
| <script src="/js/auth/config.js"></script> |
| <script src="/js/auth/client.js"></script> |
| <script src="/js/auth/session.js"></script> |
| <script src="/js/auth/auth.js"></script> |
| <script src="/js/auth/auth-ui.js"></script> |
| <script src="/js/theme.js"></script> |
| <script src="/js/vendor/mammoth.browser.min.js"></script> |
| <script src="/js/vendor/docx.umd.js"></script> |
| <script src="/js/vendor/FileSaver.min.js"></script> |
| <script src="/js/vendor/html2pdf.bundle.min.js"></script> |
| <script src="/js/renderer.js"></script> |
| <script src="/js/selection.js"></script> |
| <script src="/js/ui.js"></script> |
| <script src="/js/documents/doc-utils.js"></script> |
| <script src="/js/editor.js"></script> |
| <script src="/js/autocomplete.js"></script> |
| <script src="/js/format.js"></script> |
| <script src="/js/documents/import.js"></script> |
| <script src="/js/documents/export.js?v=20260615d"></script> |
| <script src="/js/documents/documents.js"></script> |
| |
| <script src="/js/sync/sync-queue.js"></script> |
| <script src="/js/sync/sync-resolver.js"></script> |
| <script src="/js/sync/sync-manager.js"></script> |
| |
| <script src="/js/documents-cloud/documents-api.js"></script> |
| <script src="/js/documents-cloud/documents-state.js"></script> |
| <script src="/js/documents-cloud/documents-ui.js"></script> |
| <script src="/js/summaries/summaries-api.js"></script> |
| <script src="/js/summaries/summaries-ui.js"></script> |
| <script src="/js/settings-sync/settings-api.js"></script> |
| <script src="/js/settings-sync/settings-sync.js"></script> |
| </head> |
| <body class="h-full page-bg"> |
| <div class="h-full overflow-auto"> |
| <nav class="site-nav fixed top-0 right-0 left-0 z-[1000]" role="navigation" aria-label="التنقل الرئيسي"> |
| <div class="max-w-7xl mx-auto px-4 md:px-6 py-3"> |
| <div class="flex items-center justify-between gap-3"> |
| <div class="flex items-center gap-3"> |
| <button id="mobile-menu-btn" class="mobile-menu-btn md:hidden" aria-label="فتح القائمة" aria-expanded="false" aria-controls="mobile-drawer"> |
| <svg width="22" height="22" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"/></svg> |
| </button> |
| <button onclick="showPage('home')" class="flex items-center gap-2.5 md:gap-3" style="background:none;border:none;cursor:pointer;" aria-label="الرئيسية"><img src="data:image/png;base64,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" alt="بيان" width="28" height="28" style="flex-shrink:0; border-radius:4px;"><div class="h-6 w-0.5 bg-gray-300 dark:bg-gray-600 rounded-full shrink-0"></div><span id="nav-brand" class="text-xl md:text-2xl font-bold text-gradient">بيان</span></button> |
| </div> |
| <div class="hidden md:flex items-center gap-8"> |
| <button onclick="showPage('home')" class="nav-link active text-base font-medium" data-page="home">الرئيسية</button> |
| <button onclick="showPage('features')" class="nav-link text-base font-medium" data-page="features">الميزات</button> |
| <button onclick="showPage('pricing')" class="nav-link text-base font-medium" data-page="pricing">الأسعار</button> |
| <button onclick="showPage('editor')" class="nav-link text-base font-medium" data-page="editor">المحرر</button> |
| <a href="https://bayyinah-alpha.vercel.app/" class="nav-bayyinah-link" target="_blank" rel="noopener noreferrer" aria-label="بَيِّنَة — مساعد ذكي للإجابة عن أسئلة القرآن والحديث وقصص الأنبياء"><svg width="14" height="14" fill="none" stroke="currentColor" viewBox="0 0 24 24" style="flex-shrink:0;"><path d="M12 7v14"/><path d="M16 12h2"/><path d="M16 8h2"/><path d="M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"/><path d="M6 12h2"/><path d="M6 8h2"/></svg> بَيِّنَة <span class="nav-bayyinah-arrow">↗</span></a> |
| </div> |
| <div class="flex items-center gap-2 md:gap-3"> |
| <div id="auth-menu-wrap" class="auth-menu-wrap is-hidden"> |
| <div class="auth-dropdown"> |
| <button id="auth-menu-trigger" class="auth-menu-trigger" type="button" aria-label="قائمة الحساب" aria-haspopup="true" aria-expanded="false"> |
| <span id="auth-avatar" class="auth-avatar" aria-hidden="true"><svg width="18" height="18" fill="currentColor" viewBox="0 0 24 24"><path d="M12 12c2.7 0 4.8-2.1 4.8-4.8S14.7 2.4 12 2.4 7.2 4.5 7.2 7.2 9.3 12 12 12zm0 2.4c-3.2 0-9.6 1.6-9.6 4.8v2.4h19.2v-2.4c0-3.2-6.4-4.8-9.6-4.8z"/></svg></span> |
| <span id="auth-display-name" class="auth-display-name">ضيف</span> |
| <span class="auth-menu-chevron" aria-hidden="true">▾</span> |
| </button> |
| <div id="auth-account-menu" class="auth-account-menu" role="menu" aria-label="الحساب"> |
| <div class="auth-account-menu__header"> |
| <span id="auth-provider-label" class="auth-provider-label">ضيف</span> |
| </div> |
| <button id="auth-link-google-btn" type="button" class="auth-account-menu__item" role="menuitem">ربط حساب Google</button> |
| <button id="auth-logout-btn" type="button" class="auth-account-menu__item auth-account-menu__item--danger" role="menuitem">تسجيل الخروج</button> |
| </div> |
| </div> |
| </div> |
| <button id="theme-toggle" class="theme-toggle-animated" aria-label="تبديل السمة" aria-pressed="true" type="button"> |
| <svg class="theme-icon-sun" width="20" height="20" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z"/></svg> |
| <svg class="theme-icon-moon" width="20" height="20" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003 9.003 0 008.354-5.646z"/></svg> |
| </button> |
|
|
| </div> |
| </div> |
| </div> |
| </nav> |
| |
| <div id="mobile-drawer" class="mobile-drawer" aria-hidden="true"> |
| <div id="mobile-drawer-backdrop" class="mobile-drawer-backdrop"></div> |
| <div class="mobile-drawer-panel" role="dialog" aria-label="قائمة التنقل"> |
| <button id="mobile-drawer-close" class="mobile-drawer-link" style="text-align:left" aria-label="إغلاق القائمة">✕ إغلاق</button> |
| <button class="mobile-drawer-link active" data-page="home">الرئيسية</button> |
| <button class="mobile-drawer-link" data-page="features">الميزات</button> |
| <button class="mobile-drawer-link" data-page="pricing">الأسعار</button> |
| <button class="mobile-drawer-link" data-page="editor">المحرر</button> |
| <a href="https://bayyinah-alpha.vercel.app/" class="mobile-drawer-link mobile-drawer-link-external" target="_blank" rel="noopener noreferrer" aria-label="بَيِّنَة — مساعد ذكي للإجابة عن أسئلة القرآن والحديث وقصص الأنبياء">بَيِّنَة — القرآن والحديث والسيرة</a> |
| <div class="auth-drawer-section"> |
| <p class="auth-drawer-label">الحساب</p> |
| <p id="auth-drawer-name" class="auth-drawer-name">—</p> |
| <p id="auth-drawer-provider" class="auth-drawer-provider"></p> |
| <button id="auth-link-google-btn-mobile" type="button" class="mobile-drawer-link auth-drawer-action is-hidden">ربط حساب Google</button> |
| <button id="auth-logout-btn-mobile" type="button" class="mobile-drawer-link auth-drawer-action is-hidden">تسجيل الخروج</button> |
| </div> |
| </div> |
| </div> |
| <div id="auth-offline-banner" class="auth-offline-banner is-hidden" role="status" aria-live="polite"> |
| تعذر الاتصال بخدمة المصادقة. يمكنك متابعة استخدام المحرر والمحاولة لاحقاً. |
| </div> |
| |
| <div id="docs-sidebar" class="docs-sidebar" role="complementary" aria-label="مستنداتي"> |
| <div class="docs-sidebar__header"> |
| <span class="docs-sidebar__title">مستنداتي</span> |
| </div> |
| <div class="docs-sidebar__body"> |
| <button id="docs-new-btn-mobile" class="docs-new-btn" type="button" aria-label="مستند جديد"> |
| <svg width="16" height="16" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"/></svg> |
| مستند جديد |
| </button> |
| <div id="docs-list-mobile" role="list" aria-label="قائمة المستندات"></div> |
| </div> |
| </div> |
| |
| <div id="auth-gate" class="auth-gate" aria-hidden="true" role="dialog" aria-labelledby="auth-gate-title" aria-modal="true"> |
| <div id="auth-gate-backdrop" class="auth-gate-backdrop"></div> |
| <div class="auth-gate-panel auth-gate-panel--desktop"> |
| <h2 id="auth-gate-title" class="auth-gate-title">مرحباً بك في بيان</h2> |
| <p class="auth-gate-subtitle">اختر طريقة المتابعة للبدء في الكتابة والتحليل</p> |
| <div class="auth-gate-actions"> |
| <button id="auth-guest-btn" type="button" class="btn-primary auth-gate-btn">المتابعة كضيف</button> |
| <button id="auth-google-btn" type="button" class="btn-ghost auth-gate-btn auth-gate-btn--google"> |
| <svg width="20" height="20" viewBox="0 0 24 24" aria-hidden="true"><path fill="currentColor" d="M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z"/><path fill="currentColor" d="M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z"/><path fill="currentColor" d="M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z"/><path fill="currentColor" d="M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z"/></svg> |
| المتابعة باستخدام Google |
| </button> |
| </div> |
| </div> |
| <div id="auth-gate-sheet" class="auth-gate-panel auth-gate-panel--mobile"> |
| <div class="bottom-sheet-handle" aria-hidden="true"></div> |
| <h2 class="auth-gate-title">مرحباً بك في بيان</h2> |
| <p class="auth-gate-subtitle">اختر طريقة المتابعة</p> |
| <button id="auth-guest-btn-mobile" type="button" class="btn-primary auth-gate-btn w-full">المتابعة كضيف</button> |
| <button id="auth-google-btn-mobile" type="button" class="btn-ghost auth-gate-btn auth-gate-btn--google w-full">المتابعة باستخدام Google</button> |
| </div> |
| </div> |
| <div id="page-home" class="page"> |
| <section class="gradient-bg min-h-screen pt-28 pb-20 relative overflow-hidden"> |
| <div class="absolute inset-0 overflow-hidden pointer-events-none"> |
| <div class="absolute top-20 left-20 w-96 h-96 rounded-full opacity-20" style="background: radial-gradient(circle, var(--primary-color) 0%, transparent 70%); filter: blur(80px);"></div> |
| <div class="absolute bottom-20 right-20 w-96 h-96 rounded-full opacity-20" style="background: radial-gradient(circle, var(--secondary-color) 0%, transparent 70%); filter: blur(80px);"></div> |
| </div> |
| <div class="max-w-7xl mx-auto px-6 relative z-10"> |
| <div class="grid lg:grid-cols-2 gap-16 items-center"> |
| <div class="text-center lg:text-right animate-fade-in"> |
|
|
| <h1 id="hero-headline" class="text-5xl lg:text-7xl font-bold leading-tight mb-6" style="line-height: 1.4;">اكتب العربية<br><span class="text-gradient">بثقة واحتراف</span></h1> |
| <p id="hero-subheadline" class="text-xl lg:text-2xl leading-relaxed mb-10" style="color: var(--text-secondary); line-height: 1.9;">تدقيق إملائي ونحوي وترقيم، تلخيص ذكي، إكمال تلقائي، تدقيق القرآن الكريم، وتحويل اللهجات — كل ذلك بالذكاء الاصطناعي، وباللغة العربية.</p> |
| <div class="flex flex-col sm:flex-row gap-4 justify-center lg:justify-start mb-12"><button id="hero-cta-primary" onclick="showPage('editor')" class="px-8 py-4 rounded-2xl text-lg font-bold text-white gradient-accent transition-all hover:scale-105 hover:shadow-2xl">← ابدأ الكتابة مجانًا</button> <button onclick="showPage('features')" class="px-8 py-4 rounded-2xl text-lg font-bold transition-all hover:scale-105 border-2" style="border-color: rgba(255, 255, 255, 0.35); color: var(--text-color); box-shadow: 0 0 20px rgba(107, 163, 224, 0.12);">اكتشف الميزات</button> |
| </div> |
| <div class="flex items-center gap-8 justify-center lg:justify-start"> |
| <div class="text-center"> |
| <div class="text-3xl font-bold text-gradient"> |
| ٧ أدوات |
| </div> |
| <div class="text-sm mt-1" style="color: var(--text-secondary);"> |
| ذكاء اصطناعي |
| </div> |
| </div> |
| <div class="w-px h-12" style="background: rgba(255, 255, 255, 0.2);"></div> |
| <div class="text-center"> |
| <div class="text-3xl font-bold text-gradient"> |
| فوري |
| </div> |
| <div class="text-sm mt-1" style="color: var(--text-secondary);"> |
| تحليل لحظي |
| </div> |
| </div> |
| <div class="w-px h-12" style="background: rgba(255, 255, 255, 0.2);"></div> |
| <div class="text-center"> |
| <div class="text-3xl font-bold text-gradient"> |
| مجاني |
| </div> |
| <div class="text-sm mt-1" style="color: var(--text-secondary);"> |
| لا يحتاج تسجيل |
| </div> |
| </div> |
| </div> |
| </div> |
| <div class="relative animate-float"> |
| <div class="rounded-3xl overflow-hidden shadow-2xl" style="background: var(--surface-color); border: 1px solid rgba(255, 255, 255, 0.1);"> |
| <div class="flex items-center justify-between p-4 border-b" style="border-color: rgba(255, 255, 255, 0.1);"> |
| <div class="flex items-center gap-3"> |
| <div class="w-3 h-3 rounded-full" style="background: #ef4444;"></div> |
| <div class="w-3 h-3 rounded-full" style="background: #fbbf24;"></div> |
| <div class="w-3 h-3 rounded-full" style="background: #22c55e;"></div> |
| </div><span class="text-sm" style="color: var(--text-secondary);">محرر بيان</span> |
| <div class="w-20"></div> |
| </div> |
| <div class="p-8 editor-content text-right text-lg" dir="rtl" style="background: var(--surface-color); color: var(--text-color); min-height: 300px;"> |
| <p class="mb-4">تعتبر اللغة العربية من أجمل <span class="spelling-error">اللغاة</span> في العالم<span class="punctuation-suggestion">،</span> وهي لغة <span class="spelling-error">القرأن</span> الكريم<span class="punctuation-suggestion">.</span></p> |
| <p class="mb-4">الطالبات <span class="grammar-error">ذهبوا</span> إلى المكتبة لأن <span class="spelling-error">الأمتحان</span> قريب جداً<span class="punctuation-suggestion">.</span></p> |
| <p>محرر بيان يساعدك على كتابة نصوص عربية <span class="spelling-error">صحيحه</span> بكل <span style="color: var(--text-secondary); opacity: 0.4; font-style: italic; border-bottom: 1px dashed rgba(107,163,224,0.3);">سهولة ويسر وإتقان</span></p> |
| </div> |
| <div class="flex items-center justify-between p-4 border-t" style="border-color: rgba(255, 255, 255, 0.1);"> |
| <div class="flex items-center gap-6"> |
| <div class="flex items-center gap-2"> |
| <div class="w-3 h-3 rounded-full" style="background: #ef4444;"></div><span class="text-sm" style="color: var(--text-secondary);">٤ إملائي</span> |
| </div> |
| <div class="flex items-center gap-2"> |
| <div class="w-3 h-3 rounded-full" style="background: #fbbf24;"></div><span class="text-sm" style="color: var(--text-secondary);">١ نحوي</span> |
| </div> |
| <div class="flex items-center gap-2"> |
| <div class="w-3 h-3 rounded-full" style="background: #22c55e;"></div><span class="text-sm" style="color: var(--text-secondary);">٣ ترقيم</span> |
| </div> |
| </div> |
| <div class="flex items-center gap-2"><span class="text-2xl font-bold text-gradient">٧٥</span> <span class="text-sm" style="color: var(--text-secondary);">التقييم</span> |
| </div> |
| </div> |
| <div class="absolute -bottom-6 -left-6 p-4 rounded-2xl shadow-xl animate-fade-in" style="background: var(--surface-color); border: 1px solid rgba(34, 197, 94, 0.3); max-width: 280px;"> |
| <div class="flex items-start gap-3"> |
| <div class="w-10 h-10 rounded-xl flex items-center justify-center" style="background: rgba(34, 197, 94, 0.15);"><span style="color: #22c55e; font-size: 20px;">✓</span> |
| </div> |
| <div> |
| <div class="text-sm font-bold mb-1"> |
| تصحيح تلقائي |
| </div> |
| <div class="text-xs" style="color: var(--text-secondary);"> |
| تم إصلاح ٨ أخطاء في النص |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </section> |
| <section class="py-24" style="background: var(--background-color);"> |
| <div class="max-w-7xl mx-auto px-6"> |
| <div class="text-center mb-16"> |
| <h2 class="text-4xl lg:text-5xl font-bold mb-6">ميزات <span class="text-gradient">قوية ومتقدمة</span></h2> |
| <p class="text-xl max-w-3xl mx-auto" style="color: var(--text-secondary); line-height: 1.9;">كل ما تحتاجه لكتابة نصوص عربية احترافية وخالية من الأخطاء</p> |
| </div> |
| <div class="grid md:grid-cols-2 lg:grid-cols-4 gap-6"> |
| <div class="card-hover p-8 rounded-3xl" style="background: var(--surface-color); border: 1px solid rgba(255, 255, 255, 0.08);"> |
| <div class="feature-icon mb-6" style="background: rgba(239, 68, 68, 0.15); color: #ef4444;"> |
| <svg width="24" height="24" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 4H4a2 2 0 00-2 2v14a2 2 0 002 2h14a2 2 0 002-2v-7"/><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M18.5 2.5a2.121 2.121 0 013 3L12 15l-4 1 1-4 9.5-9.5z"/></svg> |
| </div> |
| <h3 class="text-xl font-bold mb-3">التدقيق الإملائي الذكي</h3> |
| <p class="text-sm leading-relaxed" style="color: var(--text-secondary); line-height: 1.8;">فهم الجذور الصرفية والسياق لتصحيح الأخطاء الإملائية بدقة عالية</p> |
| </div> |
| <div class="card-hover p-8 rounded-3xl" style="background: var(--surface-color); border: 1px solid rgba(255, 255, 255, 0.08);"> |
| <div class="feature-icon mb-6" style="background: rgba(251, 191, 36, 0.15); color: #fbbf24;"> |
| <svg width="24" height="24" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"/></svg> |
| </div> |
| <h3 class="text-xl font-bold mb-3">تصحيح القواعد النحوية</h3> |
| <p class="text-sm leading-relaxed" style="color: var(--text-secondary); line-height: 1.8;">توافق الفعل والفاعل واقتراح الإعراب الصحيح بشكل تلقائي</p> |
| </div> |
| <div class="card-hover p-8 rounded-3xl" style="background: var(--surface-color); border: 1px solid rgba(255, 255, 255, 0.08);"> |
| <div class="feature-icon mb-6" style="background: rgba(34, 197, 94, 0.15); color: #22c55e;"> |
| <svg width="24" height="24" fill="currentColor" viewBox="0 0 24 24"><path d="M14.017 21v-7.391c0-5.704 3.731-9.57 8.983-10.609l.995 2.151c-2.432.917-3.995 3.638-3.995 5.849h4v10H14.017zm-14.017 0v-7.391c0-5.704 3.748-9.57 9-10.609l.996 2.151c-2.433.917-3.996 3.638-3.996 5.849h3.983v10H0z"/></svg> |
| </div> |
| <h3 class="text-xl font-bold mb-3">تصحيح علامات الترقيم</h3> |
| <p class="text-sm leading-relaxed" style="color: var(--text-secondary); line-height: 1.8;">الفواصل والنقط وعلامات الاقتباس العربية في المكان الصحيح</p> |
| </div> |
| <div class="card-hover p-8 rounded-3xl" style="background: var(--surface-color); border: 1px solid rgba(255, 255, 255, 0.08);"> |
| <div class="feature-icon mb-6" style="background: rgba(139, 92, 246, 0.15); color: #8b5cf6;"> |
| <svg width="24" height="24" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/></svg> |
| </div> |
| <h3 class="text-xl font-bold mb-3">تلخيص النصوص العربية</h3> |
| <p class="text-sm leading-relaxed" style="color: var(--text-secondary); line-height: 1.8;">الحفاظ على المعنى والأسلوب مع تقليل طول النص بذكاء</p> |
| </div> |
| <div class="card-hover p-8 rounded-3xl" style="background: var(--surface-color); border: 1px solid rgba(255, 255, 255, 0.08);"> |
| <div class="feature-icon mb-6" style="background: rgba(236, 72, 153, 0.15); color: #ec4899;"> |
| <svg width="24" height="24" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"/></svg> |
| </div> |
| <h3 class="text-xl font-bold mb-3">الإكمال التلقائي الذكي</h3> |
| <p class="text-sm leading-relaxed" style="color: var(--text-secondary); line-height: 1.8;">اقتراحات فورية لإكمال الجمل والعبارات أثناء الكتابة بذكاء اصطناعي</p> |
| </div> |
| |
| <div class="card-hover p-8 rounded-3xl" style="background: var(--surface-color); border: 1px solid rgba(255, 255, 255, 0.08);"> |
| <div class="feature-icon mb-6" style="background: rgba(6, 182, 212, 0.15); color: #06b6d4;"> |
| <svg width="24" height="24" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z"/></svg> |
| </div> |
| <h3 class="text-xl font-bold mb-3">تدقيق النص القرآني</h3> |
| <p class="text-sm leading-relaxed" style="color: var(--text-secondary); line-height: 1.8;">تحقق من النص القرآني وعرضه بالتشكيل مع اسم السورة ورقم الآية وترجمته إلى ١٤ لغة</p> |
| </div> |
| <div class="card-hover p-8 rounded-3xl" style="background: var(--surface-color); border: 1px solid rgba(255, 255, 255, 0.08);"> |
| <div class="feature-icon mb-6" style="background: rgba(249, 115, 22, 0.15); color: #f97316;"> |
| <svg width="24" height="24" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5h12M9 3v2m1.048 9.5A18.022 18.022 0 016.412 9m6.088 9h7M11 21l5-10 5 10M12.751 5C11.783 10.77 8.07 15.61 3 18.129"/></svg> |
| </div> |
| <h3 class="text-xl font-bold mb-3">تحويل اللهجات للفصحى</h3> |
| <p class="text-sm leading-relaxed" style="color: var(--text-secondary); line-height: 1.8;">حوّل أي لهجة عربية إلى لغة عربية فصحى بذكاء اصطناعي</p> |
| </div> |
| <div class="card-hover p-8 rounded-3xl" style="background: var(--surface-color); border: 1px solid rgba(255, 255, 255, 0.08);"> |
| <div class="feature-icon mb-6" style="background: rgba(20, 145, 155, 0.15); color: #14919b;"> |
| <svg width="24" height="24" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path d="M12 7v14"/><path d="M16 12h2"/><path d="M16 8h2"/><path d="M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"/><path d="M6 12h2"/><path d="M6 8h2"/></svg> |
| </div> |
| <h3 class="text-xl font-bold mb-3">بَيِّنَة</h3> |
| <p class="text-sm leading-relaxed" style="color: var(--text-secondary); line-height: 1.8;">بوابتك للقرآن والتفسير والسنة والمصادر السردية الموثقة</p> |
| </div> |
| </div> |
| <div class="text-center mt-12"><button onclick="showPage('features')" class="px-8 py-4 rounded-2xl text-lg font-bold border-2 transition-all hover:scale-105" style="border-color: var(--primary-color); color: var(--primary-color);">← اكتشف جميع الميزات</button> |
| </div> |
| </div> |
| </section> |
| |
| <section class="py-24" style="background: var(--surface-color);"> |
| <div class="max-w-7xl mx-auto px-6"> |
| <div class="text-center mb-16"> |
| <h2 class="text-4xl lg:text-5xl font-bold mb-6">كيف <span class="text-gradient">يعمل بيان؟</span></h2> |
| <p class="text-xl max-w-3xl mx-auto" style="color: var(--text-secondary); line-height: 1.9;">ثلاث خطوات بسيطة للحصول على نص عربي مثالي</p> |
| </div> |
| <div class="grid md:grid-cols-3 gap-8"> |
| |
| <div class="text-center p-8 rounded-3xl" style="background: var(--background-color); border: 1px solid var(--color-border);"> |
| <div class="w-16 h-16 rounded-2xl flex items-center justify-center mx-auto mb-6" style="background: linear-gradient(135deg, rgba(107, 163, 224, 0.15), rgba(107, 163, 224, 0.05));"> |
| <svg width="28" height="28" fill="none" stroke="var(--color-primary)" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z"/></svg> |
| </div> |
| <div class="text-sm font-bold mb-2 text-gradient">الخطوة ١</div> |
| <h3 class="text-xl font-bold mb-3">اكتب نصّك</h3> |
| <p class="text-sm" style="color: var(--text-secondary); line-height: 1.8;">اكتب أو الصق نصك العربي في المحرر — يدعم جميع أنماط الكتابة</p> |
| </div> |
| |
| <div class="text-center p-8 rounded-3xl" style="background: var(--background-color); border: 1px solid var(--color-border);"> |
| <div class="w-16 h-16 rounded-2xl flex items-center justify-center mx-auto mb-6" style="background: linear-gradient(135deg, rgba(165, 148, 232, 0.15), rgba(165, 148, 232, 0.05));"> |
| <svg width="28" height="28" fill="none" stroke="var(--color-secondary)" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.663 17h4.673M12 3v1m6.364 1.636l-.707.707M21 12h-1M4 12H3m3.343-5.657l-.707-.707m2.828 9.9a5 5 0 117.072 0l-.548.547A3.374 3.374 0 0014 18.469V19a2 2 0 11-4 0v-.531c0-.895-.356-1.754-.988-2.386l-.548-.547z"/></svg> |
| </div> |
| <div class="text-sm font-bold mb-2 text-gradient">الخطوة ٢</div> |
| <h3 class="text-xl font-bold mb-3">تحليل تلقائي</h3> |
| <p class="text-sm" style="color: var(--text-secondary); line-height: 1.8;">يحلل بيان النص فورًا ويكتشف الأخطاء الإملائية والنحوية والترقيمية</p> |
| </div> |
| |
| <div class="text-center p-8 rounded-3xl" style="background: var(--background-color); border: 1px solid var(--color-border);"> |
| <div class="w-16 h-16 rounded-2xl flex items-center justify-center mx-auto mb-6" style="background: linear-gradient(135deg, rgba(107, 201, 138, 0.15), rgba(107, 201, 138, 0.05));"> |
| <svg width="28" height="28" fill="none" stroke="var(--color-success)" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"/></svg> |
| </div> |
| <div class="text-sm font-bold mb-2 text-gradient">الخطوة ٣</div> |
| <h3 class="text-xl font-bold mb-3">صحّح بضغطة</h3> |
| <p class="text-sm" style="color: var(--text-secondary); line-height: 1.8;">اختر الاقتراح المناسب وطبّقه بضغطة واحدة — أو طبّق الكل دفعة واحدة</p> |
| </div> |
| </div> |
| <div class="text-center mt-12"> |
| <button onclick="showPage('editor')" class="px-8 py-4 rounded-2xl text-lg font-bold text-white gradient-accent transition-all hover:scale-105 hover:shadow-2xl">← جرّب المحرر الآن</button> |
| </div> |
| </div> |
| </section> |
| </div> |
| <div id="page-features" class="page"> |
| <section class="pt-32 pb-24" style="background: var(--background-color);"> |
| <div class="max-w-7xl mx-auto px-6"> |
| <div class="text-center mb-20"> |
| <h1 class="text-5xl lg:text-6xl font-bold mb-6">ميزات <span class="text-gradient">شاملة ومتكاملة</span></h1> |
| <p class="text-xl max-w-3xl mx-auto" style="color: var(--text-secondary); line-height: 1.9;">أدوات متخصصة مصممة خصيصًا للغة العربية</p> |
| </div> |
| <div class="grid lg:grid-cols-2 gap-16 items-center mb-32"> |
| <div class="order-2 lg:order-1"> |
| <div class="p-8 rounded-3xl" style="background: var(--surface-color); border: 1px solid rgba(255, 255, 255, 0.08);"> |
| <div class="text-right text-xl editor-content" dir="rtl" style="color: var(--text-color); line-height: 2;"> |
| <p class="mb-4">الكتابة <span class="spelling-error">الصحيحه</span> مهمة جدًا في التواصل الفعّال.</p> |
| <div class="mt-6 p-4 rounded-xl" style="background: rgba(239, 68, 68, 0.1); border-right: 4px solid #ef4444;"> |
| <div class="text-sm font-bold mb-2" style="color: #ef4444;"> |
| خطأ إملائي |
| </div> |
| <div class="flex items-center justify-between text-base"> |
| <div><span style="text-decoration: line-through; color: var(--text-secondary);">الصحيحه</span> <span class="mx-3">←</span> <span style="color: #22c55e; font-weight: 600;">الصحيحة</span> |
| </div> |
| </div> |
| <div class="text-sm mt-3" style="color: var(--text-secondary);"> |
| التاء المربوطة (ة) تُستخدم مع الصفات المؤنثة |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| <div class="order-1 lg:order-2 text-right"> |
| <div class="feature-icon mb-6" style="background: rgba(239, 68, 68, 0.15); color: #ef4444; width: 64px; height: 64px; font-size: 32px;"> |
| <svg width="24" height="24" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 4H4a2 2 0 00-2 2v14a2 2 0 002 2h14a2 2 0 002-2v-7"/><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M18.5 2.5a2.121 2.121 0 013 3L12 15l-4 1 1-4 9.5-9.5z"/></svg> |
| </div> |
| <h2 class="text-4xl font-bold mb-6">التدقيق الإملائي الذكي</h2> |
| <p class="text-lg mb-8 leading-relaxed" style="color: var(--text-secondary); line-height: 2;">محرك ذكي يفهم الجذور الصرفية والسياق اللغوي لتصحيح الأخطاء الإملائية التي تفوتها البرامج التقليدية.</p> |
| <ul class="space-y-4"> |
| <li class="flex items-center gap-4"> |
| <div class="w-6 h-6 rounded-full flex items-center justify-center" style="background: rgba(34, 197, 94, 0.2);"><span style="color: #22c55e; font-size: 14px;">✓</span> |
| </div><span class="text-base">اقتراحات حسب السياق اللغوي</span></li> |
| <li class="flex items-center gap-4"> |
| <div class="w-6 h-6 rounded-full flex items-center justify-center" style="background: rgba(34, 197, 94, 0.2);"><span style="color: #22c55e; font-size: 14px;">✓</span> |
| </div><span class="text-base">التعرف على الجذور الصرفية العربية</span></li> |
| <li class="flex items-center gap-4"> |
| <div class="w-6 h-6 rounded-full flex items-center justify-center" style="background: rgba(34, 197, 94, 0.2);"><span style="color: #22c55e; font-size: 14px;">✓</span> |
| </div><span class="text-base">تصحيح فوري أثناء الكتابة</span></li> |
| </ul> |
| </div> |
| </div> |
| <div class="grid lg:grid-cols-2 gap-16 items-center mb-32"> |
| <div class="text-right"> |
| <div class="feature-icon mb-6" style="background: rgba(251, 191, 36, 0.15); color: #fbbf24; width: 64px; height: 64px; font-size: 32px;"> |
| <svg width="24" height="24" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253"/></svg> |
| </div> |
| <h2 class="text-4xl font-bold mb-6">تصحيح القواعد النحوية</h2> |
| <p class="text-lg mb-8 leading-relaxed" style="color: var(--text-secondary); line-height: 2;">فهم عميق لقواعد النحو العربي بما في ذلك الإعراب وتوافق الفعل مع الفاعل والصفات.</p> |
| <ul class="space-y-4"> |
| <li class="flex items-center gap-4"> |
| <div class="w-6 h-6 rounded-full flex items-center justify-center" style="background: rgba(34, 197, 94, 0.2);"><span style="color: #22c55e; font-size: 14px;">✓</span> |
| </div><span class="text-base">توافق الفعل والفاعل تلقائيًا</span></li> |
| <li class="flex items-center gap-4"> |
| <div class="w-6 h-6 rounded-full flex items-center justify-center" style="background: rgba(34, 197, 94, 0.2);"><span style="color: #22c55e; font-size: 14px;">✓</span> |
| </div><span class="text-base">اقتراح الإعراب الصحيح للكلمات</span></li> |
| <li class="flex items-center gap-4"> |
| <div class="w-6 h-6 rounded-full flex items-center justify-center" style="background: rgba(34, 197, 94, 0.2);"><span style="color: #22c55e; font-size: 14px;">✓</span> |
| </div><span class="text-base">شرح تفصيلي لكل تصحيح</span></li> |
| </ul> |
| </div> |
| <div> |
| <div class="p-8 rounded-3xl" style="background: var(--surface-color); border: 1px solid rgba(255, 255, 255, 0.08);"> |
| <div class="text-right text-xl editor-content" dir="rtl" style="color: var(--text-color); line-height: 2;"> |
| <p class="mb-4">الطلاب <span class="grammar-error">ذهبوا</span> إلى المدرسة صباحًا.</p> |
| <div class="mt-6 p-4 rounded-xl" style="background: rgba(251, 191, 36, 0.1); border-right: 4px solid #fbbf24;"> |
| <div class="text-sm font-bold mb-2" style="color: #fbbf24;"> |
| اقتراح نحوي |
| </div> |
| <div class="text-base mb-3"><span style="color: var(--text-secondary);">يُفضل:</span> <span style="color: #22c55e; font-weight: 600; margin-right: 8px;">ذهب الطلاب</span> |
| </div> |
| <div class="text-sm" style="color: var(--text-secondary); line-height: 1.7;"> |
| في اللغة العربية الفصحى، عندما يتقدم الفعل على الفاعل الجمع، يُفضل إفراد الفعل. |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| <div class="grid lg:grid-cols-2 gap-16 items-center mb-32"> |
| <div class="order-2 lg:order-1"> |
| <div class="p-8 rounded-3xl" style="background: var(--surface-color); border: 1px solid rgba(255, 255, 255, 0.08);"> |
| <div class="text-right text-xl editor-content" dir="rtl" style="color: var(--text-color); line-height: 2;"> |
| <p class="mb-4">قال المعلم<span class="punctuation-suggestion">:</span> <span class="punctuation-suggestion">«</span>الدرس مهم جدًا<span class="punctuation-suggestion">»</span><span class="punctuation-suggestion">.</span></p> |
| <div class="mt-6 p-4 rounded-xl" style="background: rgba(34, 197, 94, 0.1); border-right: 4px solid #22c55e;"> |
| <div class="text-sm font-bold mb-2" style="color: #22c55e;"> |
| ✓ تم إصلاح علامات الترقيم |
| </div> |
| <div class="text-sm" style="color: var(--text-secondary); line-height: 1.7;"> |
| • أُضيفت النقطتان بعد "قال المعلم"<br> |
| • استُخدمت علامات الاقتباس العربية «»<br> |
| • أُضيفت النقطة في نهاية الجملة |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| <div class="order-1 lg:order-2 text-right"> |
| <div class="feature-icon mb-6" style="background: rgba(34, 197, 94, 0.15); color: #22c55e; width: 64px; height: 64px; font-size: 32px;"> |
| <svg width="24" height="24" fill="currentColor" viewBox="0 0 24 24"><path d="M14.017 21v-7.391c0-5.704 3.731-9.57 8.983-10.609l.995 2.151c-2.432.917-3.995 3.638-3.995 5.849h4v10H14.017zm-14.017 0v-7.391c0-5.704 3.748-9.57 9-10.609l.996 2.151c-2.433.917-3.996 3.638-3.996 5.849h3.983v10H0z"/></svg> |
| </div> |
| <h2 class="text-4xl font-bold mb-6">تصحيح علامات الترقيم</h2> |
| <p class="text-lg mb-8 leading-relaxed" style="color: var(--text-secondary); line-height: 2;">كشف وتصحيح تلقائي لعلامات الترقيم العربية بما في ذلك الوضع الصحيح للفواصل والنقاط وعلامات الاقتباس.</p> |
| <ul class="space-y-4"> |
| <li class="flex items-center gap-4"> |
| <div class="w-6 h-6 rounded-full flex items-center justify-center" style="background: rgba(34, 197, 94, 0.2);"><span style="color: #22c55e; font-size: 14px;">✓</span> |
| </div><span class="text-base">علامات الترقيم العربية الأصيلة</span></li> |
| <li class="flex items-center gap-4"> |
| <div class="w-6 h-6 rounded-full flex items-center justify-center" style="background: rgba(34, 197, 94, 0.2);"><span style="color: #22c55e; font-size: 14px;">✓</span> |
| </div><span class="text-base">تحليل بنية الجمل والفقرات</span></li> |
| <li class="flex items-center gap-4"> |
| <div class="w-6 h-6 rounded-full flex items-center justify-center" style="background: rgba(34, 197, 94, 0.2);"><span style="color: #22c55e; font-size: 14px;">✓</span> |
| </div><span class="text-base">معالجة علامات الاقتباس والحوار</span></li> |
| </ul> |
| </div> |
| </div> |
| <div class="grid lg:grid-cols-2 gap-16 items-center mb-32"> |
| <div class="text-right"> |
| <div class="feature-icon mb-6" style="background: rgba(139, 92, 246, 0.15); color: #8b5cf6; width: 64px; height: 64px; font-size: 32px;"> |
| <svg width="24" height="24" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/></svg> |
| </div> |
| <h2 class="text-4xl font-bold mb-6">تلخيص النصوص العربية</h2> |
| <p class="text-lg mb-8 leading-relaxed" style="color: var(--text-secondary); line-height: 2;">توليد ملخصات دقيقة وموجزة للنصوص الطويلة مع الحفاظ على المعنى الأساسي والأسلوب العربي الأصيل.</p> |
| <ul class="space-y-4"> |
| <li class="flex items-center gap-4"> |
| <div class="w-6 h-6 rounded-full flex items-center justify-center" style="background: rgba(34, 197, 94, 0.2);"><span style="color: #22c55e; font-size: 14px;">✓</span> |
| </div><span class="text-base">طول ملخص قابل للتعديل</span></li> |
| <li class="flex items-center gap-4"> |
| <div class="w-6 h-6 rounded-full flex items-center justify-center" style="background: rgba(34, 197, 94, 0.2);"><span style="color: #22c55e; font-size: 14px;">✓</span> |
| </div><span class="text-base">استخراج النقاط الرئيسية</span></li> |
| <li class="flex items-center gap-4"> |
| <div class="w-6 h-6 rounded-full flex items-center justify-center" style="background: rgba(34, 197, 94, 0.2);"><span style="color: #22c55e; font-size: 14px;">✓</span> |
| </div><span class="text-base">الحفاظ على فصاحة اللغة</span></li> |
| </ul> |
| </div> |
| <div> |
| <div class="p-8 rounded-3xl" style="background: var(--surface-color); border: 1px solid rgba(255, 255, 255, 0.08);"> |
| <div class="text-right" dir="rtl"> |
| <div class="text-sm mb-4 p-4 rounded-xl" style="background: rgba(255, 255, 255, 0.05); color: var(--text-secondary); line-height: 1.8;"> |
| النص الأصلي: ١٥٠ كلمة...<br> |
| مقالة طويلة تتحدث عن أهمية التكنولوجيا في العصر الحديث وتأثيرها على المجتمع... |
| </div> |
| <div class="flex items-center justify-center my-4"> |
| <svg class="w-8 h-8" style="color: var(--secondary-color);" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 14l-7 7m0 0l-7-7m7 7V3" /> |
| </svg> |
| </div> |
| <div class="text-lg p-4 rounded-xl editor-content" style="background: rgba(139, 92, 246, 0.1); border-right: 4px solid #8b5cf6; line-height: 2;"> |
| <div class="text-sm font-bold mb-3" style="color: #8b5cf6;"> |
| الملخص: ٣٠ كلمة |
| </div> |
| <p style="color: var(--text-color);">التكنولوجيا الحديثة أحدثت ثورة في حياتنا اليومية، حيث سهّلت التواصل والتعلم والعمل، مما أدى إلى تطور المجتمعات وتحسين جودة الحياة.</p> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| <div class="grid lg:grid-cols-2 gap-16 items-center mt-32"> |
| <div class="order-2 lg:order-1"> |
| <div class="p-8 rounded-3xl" style="background: var(--surface-color); border: 1px solid rgba(255, 255, 255, 0.08);"> |
| <div class="text-right text-xl editor-content" dir="rtl" style="color: var(--text-color); line-height: 2;"> |
| <p class="mb-4">اللغة العربية هي لغة <span style="color: var(--text-secondary); opacity: 0.5;">|</span></p> |
| <div class="mt-6 p-4 rounded-xl" style="background: rgba(236, 72, 153, 0.1); border-right: 4px solid #ec4899;"> |
| <div class="text-sm font-bold mb-3" style="color: #ec4899;">⚡ اقتراحات الإكمال</div> |
| <div class="space-y-2"> |
| <div class="p-3 rounded-lg" style="background: rgba(236, 72, 153, 0.15); border: 1px solid rgba(236, 72, 153, 0.3);"><span class="text-base" style="color: var(--text-color);">القرآن الكريم والحضارة الإسلامية</span></div> |
| <div class="p-3 rounded-lg" style="background: rgba(255, 255, 255, 0.05);"><span class="text-base" style="color: var(--text-secondary);">الضاد وأقدم اللغات السامية</span></div> |
| <div class="p-3 rounded-lg" style="background: rgba(255, 255, 255, 0.05);"><span class="text-base" style="color: var(--text-secondary);">العلم والأدب والشعر العربي</span></div> |
| </div> |
| <div class="text-xs mt-3" style="color: var(--text-secondary);">اضغط <kbd style="background: rgba(255,255,255,0.1); padding: 2px 6px; border-radius: 4px; font-size: 11px;">Tab</kbd> لقبول الاقتراح</div> |
| </div> |
| </div> |
| </div> |
| </div> |
| <div class="order-1 lg:order-2 text-right"> |
| <div class="feature-icon mb-6" style="background: rgba(236, 72, 153, 0.15); color: #ec4899; width: 64px; height: 64px; font-size: 32px;"><svg width="24" height="24" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"/></svg></div> |
| <h2 class="text-4xl font-bold mb-6">الإكمال التلقائي الذكي</h2> |
| <p class="text-lg mb-8 leading-relaxed" style="color: var(--text-secondary); line-height: 2;">محرك ذكي يقترح إكمال الجمل والعبارات أثناء الكتابة، مدعوم بنماذج لغوية متقدمة تفهم السياق العربي.</p> |
| <ul class="space-y-4"> |
| <li class="flex items-center gap-4"><div class="w-6 h-6 rounded-full flex items-center justify-center" style="background: rgba(34, 197, 94, 0.2);"><span style="color: #22c55e; font-size: 14px;">✓</span></div><span class="text-base">اقتراحات ذكية حسب السياق</span></li> |
| <li class="flex items-center gap-4"><div class="w-6 h-6 rounded-full flex items-center justify-center" style="background: rgba(34, 197, 94, 0.2);"><span style="color: #22c55e; font-size: 14px;">✓</span></div><span class="text-base">قبول بضغطة زر واحدة (Tab)</span></li> |
| <li class="flex items-center gap-4"><div class="w-6 h-6 rounded-full flex items-center justify-center" style="background: rgba(34, 197, 94, 0.2);"><span style="color: #22c55e; font-size: 14px;">✓</span></div><span class="text-base">تسريع الكتابة بنسبة تصل إلى ٤٠٪</span></li> |
| </ul> |
| </div> |
| </div> |
| <div class="grid lg:grid-cols-2 gap-16 items-center mt-32"> |
| <div class="text-right"> |
| <div class="feature-icon mb-6" style="background: rgba(6, 182, 212, 0.15); color: #06b6d4; width: 64px; height: 64px; font-size: 32px;"><svg width="24" height="24" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253"/></svg></div> |
| <h2 class="text-4xl font-bold mb-6">تدقيق النص القرآني</h2> |
| <p class="text-lg mb-8 leading-relaxed" style="color: var(--text-secondary); line-height: 2;">علّم على أي نص قرآني واضغط زر التدقيق — يتحول تلقائيًا للرسم العثماني بالتشكيل الكامل مع اسم السورة ورقم الآية، مع إمكانية ترجمته إلى ١٤ لغة عالمية.</p> |
| <ul class="space-y-4"> |
| <li class="flex items-center gap-4"><div class="w-6 h-6 rounded-full flex items-center justify-center" style="background: rgba(34, 197, 94, 0.2);"><span style="color: #22c55e; font-size: 14px;">✓</span></div><span class="text-base">تشكيل كامل بالرسم العثماني</span></li> |
| <li class="flex items-center gap-4"><div class="w-6 h-6 rounded-full flex items-center justify-center" style="background: rgba(34, 197, 94, 0.2);"><span style="color: #22c55e; font-size: 14px;">✓</span></div><span class="text-base">اسم السورة ورقم الآية تلقائيًا</span></li> |
| <li class="flex items-center gap-4"><div class="w-6 h-6 rounded-full flex items-center justify-center" style="background: rgba(34, 197, 94, 0.2);"><span style="color: #22c55e; font-size: 14px;">✓</span></div><span class="text-base">ترجمة الآيات إلى ١٤ لغة (الإنجليزية، الفرنسية، التركية، الأردية...)</span></li> |
| <li class="flex items-center gap-4"><div class="w-6 h-6 rounded-full flex items-center justify-center" style="background: rgba(34, 197, 94, 0.2);"><span style="color: #22c55e; font-size: 14px;">✓</span></div><span class="text-base">زر في شريط الأدوات — علّم واضغط</span></li> |
| </ul> |
| </div> |
| <div> |
| <div class="p-8 rounded-3xl" style="background: var(--surface-color); border: 1px solid rgba(255, 255, 255, 0.08);"> |
| <div class="text-right" dir="rtl"> |
| <div class="text-sm mb-4 p-4 rounded-xl" style="background: rgba(255, 255, 255, 0.05); color: var(--text-secondary); line-height: 1.8;"><span style="font-size: 13px;">📝 النص المحدد:</span><br><span style="font-size: 16px;">انا انزلناه قرانا عربيا لعلكم تعقلون</span></div> |
| <div class="flex items-center justify-center my-4"><svg class="w-8 h-8" style="color: #06b6d4;" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 14l-7 7m0 0l-7-7m7 7V3" /></svg></div> |
| <div class="text-lg p-4 rounded-xl editor-content" style="background: rgba(6, 182, 212, 0.1); border-right: 4px solid #06b6d4; line-height: 2.2;"> |
| <div class="text-sm font-bold mb-3" style="color: #06b6d4;">✓ النص القرآني المدقق</div> |
| <p style="color: var(--text-color); font-size: 22px; font-family: 'Traditional Arabic', serif;">﴿إِنَّا أَنزَلْنَاهُ قُرْآنًا عَرَبِيًّا لَّعَلَّكُمْ تَعْقِلُونَ﴾</p> |
| <p class="mt-2" style="color: var(--text-secondary); font-size: 14px;">[يوسف: آية ٢]</p> |
| <div class="mt-4 pt-3" style="border-top: 1px solid rgba(6, 182, 212, 0.2);"> |
| <div class="flex items-center gap-2 mb-2"> |
| <svg width="14" height="14" fill="none" stroke="currentColor" viewBox="0 0 24 24" style="color: #06b6d4;"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5h12M9 3v2m1.048 9.5A18.022 18.022 0 016.412 9m6.088 9h7M11 21l5-10 5 10M12.751 5C11.783 10.77 8.07 15.61 3 18.129"/></svg> |
| <span class="text-xs font-bold" style="color: #06b6d4;">English Translation</span> |
| </div> |
| <p style="color: var(--text-secondary); font-size: 13px; font-style: italic; line-height: 1.7;">Indeed, We have sent it down as an Arabic Quran that you might understand.</p> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| <div class="grid lg:grid-cols-2 gap-16 items-center mt-32"> |
| <div class="order-2 lg:order-1"> |
| <div class="p-8 rounded-3xl" style="background: var(--surface-color); border: 1px solid rgba(255, 255, 255, 0.08);"> |
| <div class="text-right" dir="rtl"> |
| <div class="text-sm mb-4 p-4 rounded-xl" style="background: rgba(255, 255, 255, 0.05); line-height: 1.8;"><span style="font-size: 13px; color: var(--text-secondary);">🗣️ النص باللهجة:</span><br><span style="font-size: 16px; color: var(--text-color);">ازيك يا صاحبي، انت فين دلوقتي؟ انا مستنيك من بدري</span></div> |
| <div class="flex items-center justify-center my-4"><svg class="w-8 h-8" style="color: #f97316;" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 14l-7 7m0 0l-7-7m7 7V3" /></svg></div> |
| <div class="text-lg p-4 rounded-xl editor-content" style="background: rgba(249, 115, 22, 0.1); border-right: 4px solid #f97316; line-height: 2;"> |
| <div class="text-sm font-bold mb-3" style="color: #f97316;">✓ النص بالعربية الفصحى</div> |
| <p style="color: var(--text-color);">كيف حالك يا صديقي، أين أنت الآن؟ أنا أنتظرك منذ وقت مبكر</p> |
| <div class="flex items-center gap-2 mt-3"><span class="text-xs px-2 py-1 rounded-full" style="background: rgba(249, 115, 22, 0.15); color: #f97316;">🇪🇬 لهجة مصرية</span><span class="text-xs" style="color: var(--text-secondary);">→ عربية فصحى</span></div> |
| </div> |
| </div> |
| </div> |
| </div> |
| <div class="order-1 lg:order-2 text-right"> |
| <div class="feature-icon mb-6" style="background: rgba(249, 115, 22, 0.15); color: #f97316; width: 64px; height: 64px; font-size: 32px;"><svg width="24" height="24" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5h12M9 3v2m1.048 9.5A18.022 18.022 0 016.412 9m6.088 9h7M11 21l5-10 5 10M12.751 5C11.783 10.77 8.07 15.61 3 18.129"/></svg></div> |
| <h2 class="text-4xl font-bold mb-6">تحويل اللهجات للفصحى</h2> |
| <p class="text-lg mb-8 leading-relaxed" style="color: var(--text-secondary); line-height: 2;">اكتب بأي لهجة عربية — مصرية، خليجية، شامية، مغاربية — وحوّلها تلقائيًا إلى لغة عربية فصحى سليمة.</p> |
| <ul class="space-y-4"> |
| <li class="flex items-center gap-4"><div class="w-6 h-6 rounded-full flex items-center justify-center" style="background: rgba(34, 197, 94, 0.2);"><span style="color: #22c55e; font-size: 14px;">✓</span></div><span class="text-base">دعم جميع اللهجات العربية</span></li> |
| <li class="flex items-center gap-4"><div class="w-6 h-6 rounded-full flex items-center justify-center" style="background: rgba(34, 197, 94, 0.2);"><span style="color: #22c55e; font-size: 14px;">✓</span></div><span class="text-base">الحفاظ على المعنى والسياق</span></li> |
| <li class="flex items-center gap-4"><div class="w-6 h-6 rounded-full flex items-center justify-center" style="background: rgba(34, 197, 94, 0.2);"><span style="color: #22c55e; font-size: 14px;">✓</span></div><span class="text-base">تحويل فوري بضغطة واحدة</span></li> |
| </ul> |
| </div> |
| </div> |
| |
| <div class="grid lg:grid-cols-2 gap-16 items-center mt-32"> |
| <div class="text-right"> |
| <div class="feature-icon mb-6" style="background: rgba(20, 145, 155, 0.15); color: #14919b; width: 64px; height: 64px; font-size: 32px;"><svg width="24" height="24" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path d="M12 7v14"/><path d="M16 12h2"/><path d="M16 8h2"/><path d="M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"/><path d="M6 12h2"/><path d="M6 8h2"/></svg></div> |
| <h2 class="text-4xl font-bold mb-6">بَيِّنَة</h2> |
| <p class="text-lg mb-8 leading-relaxed" style="color: var(--text-secondary); line-height: 2;">بوابتك للقرآن والتفسير والسنة والمصادر السردية الموثقة — اسأل أي سؤال في الدين الإسلامي واحصل على إجابة مدعومة بالمصادر.</p> |
| <ul class="space-y-4"> |
| <li class="flex items-center gap-4"><div class="w-6 h-6 rounded-full flex items-center justify-center" style="background: rgba(34, 197, 94, 0.2);"><span style="color: #22c55e; font-size: 14px;">✓</span></div><span class="text-base">إجابات من القرآن الكريم والتفسير</span></li> |
| <li class="flex items-center gap-4"><div class="w-6 h-6 rounded-full flex items-center justify-center" style="background: rgba(34, 197, 94, 0.2);"><span style="color: #22c55e; font-size: 14px;">✓</span></div><span class="text-base">أحاديث نبوية وسيرة مع التخريج</span></li> |
| <li class="flex items-center gap-4"><div class="w-6 h-6 rounded-full flex items-center justify-center" style="background: rgba(34, 197, 94, 0.2);"><span style="color: #22c55e; font-size: 14px;">✓</span></div><span class="text-base">مصادر موثقة وقابلة للتحقق</span></li> |
| </ul> |
| <a href="https://bayyinah-alpha.vercel.app/" target="_blank" rel="noopener noreferrer" class="inline-block mt-8 px-6 py-3 rounded-xl text-base font-bold text-white transition-all hover:scale-105" style="background: linear-gradient(135deg, #14919b, #0e7c86);">جرّب بَيِّنَة الآن ↗</a> |
| </div> |
| <div> |
| <div class="p-8 rounded-3xl" style="background: var(--surface-color); border: 1px solid rgba(255, 255, 255, 0.08);"> |
| <div class="text-right" dir="rtl"> |
| <div class="p-4 rounded-xl mb-4" style="background: rgba(20, 145, 155, 0.08); border: 1px solid rgba(20, 145, 155, 0.2);"> |
| <div class="flex items-center gap-2 mb-3"><svg width="18" height="18" fill="none" stroke="#14919b" viewBox="0 0 24 24" style="flex-shrink:0;"><path d="M12 7v14"/><path d="M16 12h2"/><path d="M16 8h2"/><path d="M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"/><path d="M6 12h2"/><path d="M6 8h2"/></svg><span class="text-sm font-bold" style="color: #14919b;">بَيِّنَة</span></div> |
| <p class="text-base mb-2" style="color: var(--text-color);">ما حكم صلاة الضحى؟</p> |
| </div> |
| <div class="p-4 rounded-xl" style="background: rgba(20, 145, 155, 0.05); border-right: 4px solid #14919b; line-height: 2;"> |
| <div class="text-sm font-bold mb-3" style="color: #14919b;">📖 الإجابة من المصادر</div> |
| <p class="text-base mb-3" style="color: var(--text-color);">صلاة الضحى سنة مؤكدة، وأقلها ركعتان وأكثرها ثمان ركعات.</p> |
| <div class="space-y-2 mt-3"> |
| <div class="text-xs p-2 rounded-lg" style="background: rgba(20, 145, 155, 0.1);"><span style="color: #14919b; font-weight: 600;">📜 الحديث:</span> <span style="color: var(--text-secondary);">«يصبح على كل سُلامى من أحدكم صدقة...» رواه مسلم</span></div> |
| <div class="text-xs p-2 rounded-lg" style="background: rgba(20, 145, 155, 0.1);"><span style="color: #14919b; font-weight: 600;">📖 التفسير:</span> <span style="color: var(--text-secondary);">تفسير ابن كثير — سورة ص: آية ١٨</span></div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </section> |
| </div> |
| <div id="page-editor" class="page"> |
| <section class="pt-16 md:pt-20 min-h-screen page-bg"> |
| <div class="max-w-[1600px] mx-auto"> |
| <div class="editor-layout"> |
| |
| <div class="docs-panel docs-panel-desktop"> |
| <div class="docs-panel__header"> |
| <svg class="docs-panel__icon" width="18" height="18" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 7v10a2 2 0 002 2h14a2 2 0 002-2V9a2 2 0 00-2-2h-6l-2-2H5a2 2 0 00-2 2z"/></svg> |
| <span class="docs-panel__title">مستنداتي</span> |
| </div> |
| <div class="docs-panel__body"> |
| <button id="docs-new-btn" class="docs-new-btn" type="button" aria-label="مستند جديد"> |
| <svg width="16" height="16" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"/></svg> |
| مستند جديد |
| </button> |
| <div class="docs-search"> |
| <svg class="docs-search__icon" width="14" height="14" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"/></svg> |
| <input type="text" class="docs-search__input" id="docs-search-input" placeholder="بحث في المستندات..." autocomplete="off"> |
| </div> |
| <div id="docs-list" role="list" aria-label="قائمة المستندات"></div> |
| </div> |
| </div> |
| |
| <div> |
| <div class="editor-shell"> |
| <div class="editor-toolbar"> |
| <div class="flex items-center gap-4"> |
| <div class="window-dots" aria-hidden="true"> |
| <span class="dot dot--red"></span> |
| <span class="dot dot--yellow"></span> |
| <span class="dot dot--green"></span> |
| </div> |
| <div id="analyzing-indicator" class="analyzing-indicator" aria-live="polite"> |
| <span class="analyzing-spinner" aria-hidden="true"></span> |
| <span>جاري التحليل...</span> |
| </div> |
| <span id="auto-save-status" class="text-xs text-secondary" style="opacity:0;transition:opacity 0.3s;"></span> |
| </div> |
| <div class="editor-tabs-center"> |
| <button id="write-tab" onclick="switchTab('write')" class="editor-tab active" type="button"><svg class="tab-icon" width="15" height="15" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z"/></svg>كتابة</button> |
| <button id="summarize-tab" onclick="switchTab('summarize')" class="editor-tab" type="button"><svg class="tab-icon" width="15" height="15" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/></svg>تلخيص</button> |
| <button id="dialect-tab" onclick="switchTab('dialect')" class="editor-tab" type="button"><svg class="tab-icon" width="15" height="15" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 7h12m0 0l-4-4m4 4l-4 4m0 6H4m0 0l4 4m-4-4l4-4"/></svg>تحويل للفصحى</button> |
| <button id="quran-tab" onclick="switchTab('quran')" class="editor-tab" type="button"><svg class="tab-icon" width="15" height="15" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253"/></svg>تدقيق النص القرآني</button> |
| </div> |
| <div class="flex items-center gap-2"> |
| <span id="doc-current-title" class="doc-current-title" style="display:none;"></span> |
| </div> |
| </div> |
| <div class="format-toolbar" id="format-toolbar"> |
| <div class="fmt-section"><span class="fmt-label">الخط</span> |
| <div class="fmt-group fmt-group--font"> |
| <div class="fmt-dropdown" id="fmt-font-wrap"> |
| <button class="fmt-dropdown__trigger" type="button" id="fmt-font-trigger" aria-haspopup="true" aria-expanded="false" data-tooltip="نوع الخط"> |
| <svg class="fmt-dropdown__icon" width="14" height="14" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 7V4h16v3M9 20h6M12 4v16"/></svg> |
| <span id="fmt-font-label">Cairo</span> |
| <svg class="fmt-dropdown__chevron" width="10" height="10" fill="currentColor" viewBox="0 0 20 20"><path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z"/></svg> |
| </button> |
| <div class="fmt-dropdown__menu" id="fmt-font-menu" role="menu"> |
| <button class="fmt-dropdown__item" data-font="Cairo" role="menuitem" style="font-family:Cairo">Cairo</button> |
| <button class="fmt-dropdown__item" data-font="Arial" role="menuitem" style="font-family:Arial">Arial</button> |
| <button class="fmt-dropdown__item" data-font="Times New Roman" role="menuitem" style="font-family:'Times New Roman'">Times New Roman</button> |
| <button class="fmt-dropdown__item" data-font="Tahoma" role="menuitem" style="font-family:Tahoma">Tahoma</button> |
| <button class="fmt-dropdown__item" data-font="Simplified Arabic" role="menuitem" style="font-family:'Simplified Arabic'">Simplified Arabic</button> |
| <button class="fmt-dropdown__item" data-font="Traditional Arabic" role="menuitem" style="font-family:'Traditional Arabic'">Traditional Arabic</button> |
| <button class="fmt-dropdown__item" data-font="Courier New" role="menuitem" style="font-family:'Courier New'">Courier New</button> |
| </div> |
| </div> |
| <div class="fmt-dropdown" id="fmt-size-wrap"> |
| <button class="fmt-dropdown__trigger fmt-dropdown__trigger--size" type="button" id="fmt-size-trigger" aria-haspopup="true" aria-expanded="false" data-tooltip="حجم الخط"> |
| <span id="fmt-size-label">16</span> |
| <svg class="fmt-dropdown__chevron" width="10" height="10" fill="currentColor" viewBox="0 0 20 20"><path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z"/></svg> |
| </button> |
| <div class="fmt-dropdown__menu fmt-dropdown__menu--size" id="fmt-size-menu" role="menu"> |
| <button class="fmt-dropdown__item" data-size="12px" role="menuitem"><span class="fmt-size-preview" style="font-size:10px">بيان</span> 12</button> |
| <button class="fmt-dropdown__item fmt-dropdown__item--active" data-size="16px" role="menuitem"><span class="fmt-size-preview" style="font-size:12px">بيان</span> 16</button> |
| <button class="fmt-dropdown__item" data-size="20px" role="menuitem"><span class="fmt-size-preview" style="font-size:14px">بيان</span> 20</button> |
| <button class="fmt-dropdown__item" data-size="24px" role="menuitem"><span class="fmt-size-preview" style="font-size:16px">بيان</span> 24</button> |
| <button class="fmt-dropdown__item" data-size="32px" role="menuitem"><span class="fmt-size-preview" style="font-size:18px">بيان</span> 32</button> |
| <button class="fmt-dropdown__item" data-size="48px" role="menuitem"><span class="fmt-size-preview" style="font-size:22px">بيان</span> 48</button> |
| </div> |
| </div> |
| </div> |
| </div> |
| <div class="fmt-divider"></div> |
| <div class="fmt-section"><span class="fmt-label">التنسيق</span> |
| <div class="fmt-group"> |
| <button id="fmt-bold" class="fmt-btn" onclick="formatBold()" type="button" data-tooltip="غامق (Ctrl+B)"><b>B</b></button> |
| <button id="fmt-italic" class="fmt-btn" onclick="formatItalic()" type="button" data-tooltip="مائل (Ctrl+I)"><i>I</i></button> |
| <button id="fmt-underline" class="fmt-btn" onclick="formatUnderline()" type="button" data-tooltip="تحته خط (Ctrl+U)"><u>U</u></button> |
| <button id="fmt-strikethrough" class="fmt-btn" onclick="formatStrikethrough()" type="button" data-tooltip="يتوسطه خط"><s>S</s></button> |
| </div> |
| </div> |
| <div class="fmt-divider"></div> |
| <div class="fmt-section"><span class="fmt-label">المحاذاة</span> |
| <div class="fmt-group"> |
| <button id="fmt-align-right" class="fmt-btn fmt-active" onclick="formatAlignRight()" type="button" data-tooltip="محاذاة لليمين"><svg width="15" height="15" fill="currentColor" viewBox="0 0 24 24"><path d="M3 5h18v2H3V5zm4 4h14v2H7V9zm-4 4h18v2H3v-2zm4 4h14v2H7v-2z"/></svg></button> |
| <button id="fmt-align-center" class="fmt-btn" onclick="formatAlignCenter()" type="button" data-tooltip="توسيط"><svg width="15" height="15" fill="currentColor" viewBox="0 0 24 24"><path d="M3 5h18v2H3V5zm3 4h12v2H6V9zm-3 4h18v2H3v-2zm3 4h12v2H6v-2z"/></svg></button> |
| <button id="fmt-align-left" class="fmt-btn" onclick="formatAlignLeft()" type="button" data-tooltip="محاذاة لليسار"><svg width="15" height="15" fill="currentColor" viewBox="0 0 24 24"><path d="M3 5h18v2H3V5zm0 4h14v2H3V9zm0 4h18v2H3v-2zm0 4h14v2H3v-2z"/></svg></button> |
| </div> |
| </div> |
| <div class="fmt-divider"></div> |
| <div class="fmt-section"><span class="fmt-label">القوائم</span> |
| <div class="fmt-group"> |
| <button id="fmt-ul" class="fmt-btn" onclick="execFormat('insertUnorderedList')" type="button" data-tooltip="قائمة نقطية"><svg width="15" height="15" fill="currentColor" viewBox="0 0 24 24"><path d="M4 6.5a1.5 1.5 0 110-3 1.5 1.5 0 010 3zm0 7a1.5 1.5 0 110-3 1.5 1.5 0 010 3zm0 7a1.5 1.5 0 110-3 1.5 1.5 0 010 3zM8 5h13v2H8V5zm0 7h13v2H8v-2zm0 7h13v2H8v-2z"/></svg></button> |
| <button id="fmt-ol" class="fmt-btn" onclick="execFormat('insertOrderedList')" type="button" data-tooltip="قائمة مرقمة"><svg width="15" height="15" fill="currentColor" viewBox="0 0 24 24"><path d="M2 5h1V3h-.5v-.5h1V5h.5v.5H2V5zm0 5.5h1.5v.5H2v.5h2v-2H2.5V9H4V8H2v2.5zm0 5v.5h1v.5H2v.5h2V17H2.5v.5H4V14H2v1.5zM8 5h13v2H8V5zm0 7h13v2H8v-2zm0 7h13v2H8v-2z"/></svg></button> |
| </div> |
| </div> |
| <div class="fmt-divider"></div> |
| <div class="fmt-section"><span class="fmt-label">إضافي</span> |
| <div class="fmt-group"> |
| <button id="fmt-rtl" class="fmt-btn" onclick="setDirection('rtl')" type="button" data-tooltip="يمين لليسار"><svg width="15" height="15" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 5h6M11 5v14m4-14v14M3 8l4-3v6"/></svg></button> |
| <button id="fmt-ltr" class="fmt-btn" onclick="setDirection('ltr')" type="button" data-tooltip="يسار لليمين"><svg width="15" height="15" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 5H7a4 4 0 000 8h2m4-8v14m4-14v14M21 8l-4-3v6"/></svg></button> |
| <button id="fmt-link" class="fmt-btn" onclick="insertLink()" type="button" data-tooltip="إدراج رابط"><svg width="15" height="15" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1"/></svg></button> |
| <button id="fmt-line-height" class="fmt-btn" onclick="cycleLineHeight()" type="button" data-tooltip="ارتفاع السطر"><svg width="15" height="15" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"/><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M20 4v4m0-4l-1.5 1.5M20 4l1.5 1.5M20 20v-4m0 4l-1.5-1.5M20 20l1.5-1.5"/></svg></button> |
| </div> |
| </div> |
| <div class="fmt-divider"></div> |
| <div class="fmt-section"><span class="fmt-label">التراجع</span> |
| <div class="fmt-group"> |
| <button class="fmt-btn" onclick="formatUndo()" type="button" data-tooltip="تراجع (Ctrl+Z)"><svg width="15" height="15" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 10h10a5 5 0 015 5v2M3 10l4-4M3 10l4 4"/></svg></button> |
| <button class="fmt-btn" onclick="formatRedo()" type="button" data-tooltip="إعادة (Ctrl+Y)"><svg width="15" height="15" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 10H11a5 5 0 00-5 5v2M21 10l-4-4M21 10l-4 4"/></svg></button> |
| </div> |
| </div> |
| <div class="fmt-divider"></div> |
| <div class="fmt-section"><span class="fmt-label">الألوان</span> |
| <div class="fmt-group fmt-group--font"> |
| <div class="fmt-dropdown" id="fmt-textcolor-wrap"> |
| <button class="fmt-color-btn" type="button" id="fmt-textcolor-trigger" data-tooltip="لون النص"> |
| <svg width="15" height="15" fill="currentColor" viewBox="0 0 24 24"><path d="M11 2L5.5 16h2.25l1.12-3h6.25l1.12 3h2.25L13 2h-2zm-1.38 9L12 4.67 14.38 11H9.62z"/></svg> |
| <span class="fmt-color-indicator" id="fmt-textcolor-bar" style="background:#ECEEF2"></span> |
| </button> |
| <div class="fmt-dropdown__menu" id="fmt-textcolor-menu" role="menu"><div class="fmt-color-grid" id="fmt-textcolor-grid"></div></div> |
| </div> |
| <div class="fmt-dropdown" id="fmt-highlight-wrap"> |
| <button class="fmt-color-btn" type="button" id="fmt-highlight-trigger" data-tooltip="لون التظليل"> |
| <svg width="15" height="15" fill="currentColor" viewBox="0 0 24 24"><path d="M16.56 8.94L7.62 0 6.21 1.41l2.38 2.38-5.15 5.15a1.49 1.49 0 000 2.12l5.5 5.5c.29.29.68.44 1.06.44s.77-.15 1.06-.44l5.5-5.5c.59-.58.59-1.53 0-2.12zM5.21 10L10 5.21 14.79 10H5.21zM19 11.5s-2 2.17-2 3.5c0 1.1.9 2 2 2s2-.9 2-2c0-1.33-2-3.5-2-3.5zM2 20h20v4H2v-4z"/></svg> |
| <span class="fmt-color-indicator" id="fmt-highlight-bar" style="background:transparent"></span> |
| </button> |
| <div class="fmt-dropdown__menu" id="fmt-highlight-menu" role="menu"><div class="fmt-color-grid" id="fmt-highlight-grid"></div></div> |
| </div> |
| </div> |
| </div> |
| <div class="fmt-divider"></div> |
| <div class="fmt-group"> |
| <button class="fmt-btn" onclick="execFormat('removeFormat')" type="button" data-tooltip="مسح التنسيق"><svg width="15" height="15" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 4h12v3M12 4v16"/><path stroke-linecap="round" stroke-width="2.5" d="M5 19L19 5" opacity="0.6"/></svg></button> |
| </div> |
| </div> |
| <input type="file" id="doc-import-input" class="sr-only" accept=".txt,.docx,text/plain,application/vnd.openxmlformats-officedocument.wordprocessingml.document" aria-hidden="true"> |
| <div id="write-area"> |
| <div id="analysis-limit-banner" class="analysis-limit-banner is-hidden" role="status" aria-live="polite"></div> |
| <div id="editor-container" class="editor-surface editor-content" |
| role="textbox" aria-multiline="true" aria-label="محرر النص العربي" |
| aria-describedby="editor-hint" contenteditable="true" |
| data-placeholder="ابدأ الكتابة هنا... اكتب نصك العربي وسنساعدك في تصحيحه وتحسينه بشكل فوري"></div> |
| <p id="editor-hint" class="sr-only">اكتب نصاً عربياً. ستظهر الاقتراحات تلقائياً.</p> |
| <div id="editor-tooltip" class="suggestion-popover" role="dialog" aria-label="اقتراح تصحيح"> |
| <div id="tooltip-type" class="popover-type">خطأ</div> |
| <div class="popover-original-word"><span class="popover-label">الكلمة:</span> <span id="tooltip-original"></span></div> |
| <div id="tooltip-alternatives" class="popover-alternatives"></div> |
| <button type="button" class="popover-dismiss" onclick="if(window.currentApplySuggestion){dismissSuggestion(window.currentApplySuggestion);hideTooltip();}" title="تجاهل هذا الاقتراح">تجاهل</button> |
| <p class="popover-hint">اختر التصحيح المناسب · Escape للإغلاق</p> |
| </div> |
| <div class="editor-footer"> |
| <div class="editor-stats" role="status" aria-label="إحصائيات"> |
| <div class="flex items-center gap-2"><span class="stat-dot stat-dot--spelling" aria-hidden="true"></span><span class="text-sm text-secondary"><span id="spelling-count">٠</span> إملائي</span></div> |
| <div class="flex items-center gap-2"><span class="stat-dot stat-dot--grammar" aria-hidden="true"></span><span class="text-sm text-secondary"><span id="grammar-count">٠</span> نحوي</span></div> |
| <div class="flex items-center gap-2"><span class="stat-dot stat-dot--punctuation" aria-hidden="true"></span><span class="text-sm text-secondary"><span id="punctuation-count">٠</span> ترقيم</span></div> |
| <span class="stat-item--sep"></span> |
| <span class="stat-item"><span id="char-count">٠</span> حرف</span> |
| <span class="stat-item"><span id="sentence-count">٠</span> جملة</span> |
| <span class="stat-item" style="cursor:pointer;" onclick="setWordGoalUI()" title="اضغط لتحديد هدف عدد الكلمات"><span id="word-count" class="font-bold">٠</span> كلمة</span> |
| <span id="word-goal-indicator" class="word-goal-badge" style="display:none;cursor:pointer;" onclick="setWordGoalUI()" title="اضغط لتغيير الهدف"></span> |
| <span class="stat-item--sep"></span> |
| <span class="stat-item">⏱ <span id="reading-time">٠</span> د قراءة</span> |
| </div> |
| <div class="editor-actions"> |
| <button id="doc-save-btn" class="doc-save-btn-icon btn-ghost" type="button" aria-label="حفظ المستند" title="حفظ"> |
| <svg width="16" height="16" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 7H5a2 2 0 00-2 2v9a2 2 0 002 2h14a2 2 0 002-2V9a2 2 0 00-2-2h-3m-1 4l-3 3m0 0l-3-3m3 3V4"/></svg> |
| </button> |
| <button onclick="clearEditor()" class="btn-ghost" type="button" title="مسح الكل"> |
| <svg width="16" height="16" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"/></svg> |
| </button> |
| <button onclick="copyText()" class="btn-ghost" type="button" title="نسخ النص"> |
| <svg width="16" height="16" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"/></svg> |
| </button> |
| <button id="doc-import-btn" class="btn-ghost" type="button" aria-label="استيراد ملف" title="استيراد"> |
| <svg width="16" height="16" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-8l-4-4m0 0L8 8m4-4v12"/></svg> |
| </button> |
| <div class="doc-dropdown" style="display:inline-block;"> |
| <button id="doc-export-trigger" class="btn-ghost" type="button" aria-label="تصدير" title="تصدير" aria-haspopup="true" aria-expanded="false"> |
| <svg width="16" height="16" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4"/></svg> |
| </button> |
| <div id="doc-export-menu" class="doc-dropdown__menu" role="menu" aria-label="خيارات التصدير"> |
| <button type="button" class="doc-dropdown__item" role="menuitem" data-export-format="txt">نصي (.txt)</button> |
| <button type="button" class="doc-dropdown__item" role="menuitem" data-export-format="docx">Word (.docx)</button> |
| <button type="button" class="doc-dropdown__item" role="menuitem" data-export-format="pdf">PDF (.pdf)</button> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| <div id="summarize-area" class="summarize-panel is-hidden"> |
| |
| <div class="mb-4"> |
| <div class="flex items-center gap-2 mb-3"> |
| <svg width="18" height="18" fill="none" stroke="currentColor" viewBox="0 0 24 24" style="color: var(--color-primary);"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/></svg> |
| <span class="text-base font-bold">تلخيص النصوص</span> |
| </div> |
| <textarea id="summary-custom-input" class="w-full p-4 rounded-xl text-right text-lg editor-content" dir="rtl" rows="6" placeholder="الصق أو اكتب النص الذي تريد تلخيصه هنا..." oninput="updateSummaryWordCount()" style="background: var(--color-surface); border: 1px solid var(--color-border); color: var(--color-text-primary); resize: vertical; font-family: inherit;"></textarea> |
| <div class="flex items-center justify-between mt-2 mb-2" dir="rtl"> |
| <span id="summary-char-count" class="text-xs" style="color: var(--text-secondary);">٠ كلمة</span> |
| <label class="btn-ghost" style="cursor:pointer; display:inline-flex; align-items:center; gap:5px; padding:4px 12px; min-height:32px; font-size:12px;"> |
| <svg width="14" height="14" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-8l-4-4m0 0L8 8m4-4v12"/></svg> |
| استيراد ملف |
| <input type="file" id="summary-import-input" class="sr-only" accept=".txt,.docx" onchange="importSummaryFile(this)"> |
| </label> |
| </div> |
| </div> |
| |
| <div class="summary-mode-toggle"> |
| <button type="button" class="summary-mode-btn active" id="summary-mode-paragraph" onclick="setSummaryMode('paragraph')"> |
| <svg width="14" height="14" fill="currentColor" viewBox="0 0 24 24"><path d="M3 5h18v2H3V5zm0 8h18v2H3v-2zm0 4h12v2H3v-2z"/></svg> |
| فقرة |
| </button> |
| <button type="button" class="summary-mode-btn" id="summary-mode-bullets" onclick="setSummaryMode('bullets')"> |
| <svg width="14" height="14" fill="currentColor" viewBox="0 0 24 24"><path d="M4 6h2v2H4V6zm4 0h12v2H8V6zM4 11h2v2H4v-2zm4 0h12v2H8v-2zm-4 5h2v2H4v-2zm4 0h12v2H8v-2z"/></svg> |
| نقاط |
| </button> |
| </div> |
| <div class="mb-6"> |
| <label class="block text-base font-bold mb-3" for="summary-length">طول الملخص</label> |
| <div class="flex items-center gap-4"> |
| <span class="text-sm text-secondary">طويل</span> |
| <input type="range" id="summary-length" min="1" max="3" value="2" onchange="updateSummaryLength()" aria-valuetext="متوسط"> |
| <span class="text-sm text-secondary">قصير</span> |
| </div> |
| <div class="text-center mt-2"><span id="summary-length-text" class="text-sm font-bold text-brand">متوسط</span></div> |
| </div> |
| <button id="generate-summary-btn" onclick="generateSummary(event)" class="btn-primary w-full py-4 text-lg mb-6" type="button">توليد الملخص</button> |
| <div id="summary-preview" class="summary-preview"> |
| <div class="summary-card"> |
| |
| <div id="summary-stats" class="summary-stats" style="display:none"> |
| <div class="summary-stat"><span>كلمات الملخص:</span> <span class="summary-stat__value" id="summary-word-count">0</span></div> |
| <div class="summary-stat"><span>نسبة الاختصار:</span> <span class="summary-stat__value" id="summary-compression">0%</span></div> |
| </div> |
| <div class="flex items-center justify-between mb-4"> |
| <h3 class="text-lg font-bold summary-card__title">الملخص</h3> |
| <div class="flex items-center gap-2"> |
| <button onclick="copySummary()" class="btn-ghost" type="button">نسخ</button> |
| <button id="summary-apply-btn" onclick="applySummaryToEditor()" class="quran-apply-btn" type="button" style="display:none;">تطبيق في المحرر ✓</button> |
| <div class="doc-dropdown" style="display:inline-block;"> |
| <button id="summary-export-trigger" class="btn-ghost" type="button" aria-haspopup="true" aria-expanded="false">تصدير ▾</button> |
| <div id="summary-export-menu" class="doc-dropdown__menu" role="menu"> |
| <button type="button" class="doc-dropdown__item" role="menuitem" onclick="exportSummaryAs('txt')">نصي (.txt)</button> |
| <button type="button" class="doc-dropdown__item" role="menuitem" onclick="exportSummaryAs('docx')">Word (.docx)</button> |
| <button type="button" class="doc-dropdown__item" role="menuitem" onclick="exportSummaryAs('pdf')">PDF (.pdf)</button> |
| </div> |
| </div> |
| </div> |
| </div> |
| <div id="summary-text" class="text-right text-lg editor-content" dir="rtl"></div> |
| </div> |
| </div> |
| </div> |
| |
| <div id="dialect-area" class="summarize-panel is-hidden"> |
| <div class="mb-4"> |
| <div class="flex items-center gap-2 mb-3"> |
| <svg width="18" height="18" fill="none" stroke="currentColor" viewBox="0 0 24 24" style="color: var(--color-primary);"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5h12M9 3v2m1.048 9.5A18.022 18.022 0 016.412 9m6.088 9h7M11 21l5-10 5 10M12.751 5C11.783 10.77 8.07 15.61 3 18.129"/></svg> |
| <span class="text-base font-bold">تحويل اللهجات للفصحى</span> |
| </div> |
| <p class="text-sm mb-4" style="color: var(--text-secondary);">اكتب نصًا بأي لهجة عربية (مصرية، خليجية، شامية...) وسنحوّله إلى لغة عربية فصحى سليمة.</p> |
| </div> |
| <textarea id="dialect-input" class="w-full p-4 rounded-xl text-right text-lg editor-content" dir="rtl" rows="6" placeholder="اكتب النص باللهجة هنا..." oninput="updateDialectCharCount()" style="background: var(--color-surface); border: 1px solid var(--color-border); color: var(--color-text-primary); resize: vertical; font-family: inherit;"></textarea> |
| <div class="flex items-center justify-between mt-1 mb-2" dir="rtl"> |
| <span id="dialect-char-count" class="text-xs" style="color: var(--text-secondary);">٠ حرف</span> |
| </div> |
| <button id="dialect-convert-btn" onclick="convertDialect()" class="btn-primary w-full py-4 text-lg mt-4 mb-4" type="button">تحويل إلى الفصحى</button> |
| <div id="dialect-result-card" class="is-hidden" style="background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 1rem; padding: 1.5rem;"> |
| <div class="flex items-center justify-between mb-3"> |
| <h3 class="text-base font-bold" style="color: var(--color-primary);">✓ النص بالعربية الفصحى</h3> |
| <div class="flex items-center gap-2"> |
| <button onclick="copyDialectResult()" class="quran-copy-btn" type="button" title="نسخ">📋</button> |
| <button id="dialect-apply-btn" onclick="applyDialectResult()" class="quran-apply-btn is-hidden" type="button">تطبيق في المحرر ✓</button> |
| </div> |
| </div> |
| <div id="dialect-result" class="text-right text-lg editor-content" dir="rtl" style="line-height: 2;"></div> |
| </div> |
| </div> |
| |
| <div id="quran-area" class="summarize-panel is-hidden"> |
| <div class="mb-4"> |
| <div class="flex items-center gap-2 mb-3"> |
| <svg width="18" height="18" fill="none" stroke="#06b6d4" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253"/></svg> |
| <span class="text-base font-bold">تدقيق النص القرآني</span> |
| </div> |
| <p class="text-sm mb-4" style="color: var(--text-secondary);">اكتب أو الصق نصًا قرآنيًا وسنعرض لك النص الصحيح بالتشكيل مع اسم السورة ورقم الآية، مع إمكانية ترجمته إلى ١٤ لغة.</p> |
| </div> |
| <textarea id="quran-input" class="w-full p-4 rounded-xl text-right text-lg" dir="rtl" rows="4" placeholder="اكتب الآية أو جزءًا منها هنا..." style="background: var(--color-surface); border: 1px solid var(--color-border); color: var(--color-text-primary); resize: vertical; font-family: 'Amiri Quran', 'Cairo', serif; font-size: 20px; line-height: 2;"></textarea> |
| <button id="quran-search-btn" onclick="searchQuranStandalone()" class="btn-primary w-full py-4 text-lg mt-4 mb-4" type="button">بحث وتدقيق</button> |
| <div id="quran-inline-result" class="is-hidden"> |
| <div id="quran-inline-match-list" class="quran-inline-match-list"></div> |
| </div> |
| </div> |
| </div> |
| <button id="mobile-sheet-trigger" class="mobile-sheet-trigger" type="button" aria-expanded="false" aria-controls="bottom-sheet"> |
| <span>الاقتراحات (<span id="mobile-suggestion-count">٠</span>)</span> |
| <span aria-hidden="true">▲</span> |
| </button> |
| </div> |
| |
| <div class="sidebar-panel sidebar-desktop"> |
| <div class="surface-card sidebar-card"> |
| <h3 class="text-xl font-bold mb-4 text-right">الاقتراحات</h3> |
| <div id="suggestions-list" class="suggestions-scroll" role="list" aria-live="polite" aria-label="اقتراحات التصحيح"></div> |
| <button id="apply-all-btn" class="btn-primary apply-all-btn is-hidden" type="button">تطبيق الكل</button> |
| </div> |
| <div class="surface-card sidebar-card"> |
| <h3 class="text-xl font-bold mb-4 text-right">تقييم الكتابة</h3> |
| <div class="score-ring-wrap" role="img" aria-label="تقييم الكتابة"> |
| <svg class="w-full h-full transform -rotate-90" viewBox="0 0 160 160" aria-hidden="true"> |
| <circle cx="80" cy="80" r="70" fill="none" stroke="var(--color-border)" stroke-width="10"/> |
| <circle id="score-circle" cx="80" cy="80" r="70" fill="none" stroke="url(#scoreGradient)" stroke-width="10" stroke-linecap="round" stroke-dasharray="440" stroke-dashoffset="440" class="score-circle"/> |
| <defs><linearGradient id="scoreGradient" x1="0%" y1="0%" x2="100%" y2="0%"><stop offset="0%" stop-color="var(--primary-color)"/><stop offset="100%" stop-color="var(--secondary-color)"/></linearGradient></defs> |
| </svg> |
| <div class="score-value"><span id="score-value">--</span></div> |
| </div> |
| <p id="score-hint" class="text-center text-sm text-secondary">ابدأ الكتابة لرؤية تقييمك</p> |
| </div> |
| </div> |
| </div> |
| </div> |
| </section> |
| </div> |
| |
| <div id="bottom-sheet" class="bottom-sheet" aria-hidden="true"> |
| <div id="bottom-sheet-backdrop" class="bottom-sheet-backdrop"></div> |
| <div class="bottom-sheet-panel" role="dialog" aria-label="الاقتراحات"> |
| <div class="bottom-sheet-handle" aria-hidden="true"></div> |
| <div class="flex items-center justify-between mb-4"> |
| <h3 class="text-lg font-bold">الاقتراحات</h3> |
| <button id="bottom-sheet-close" class="btn-ghost" type="button" aria-label="إغلاق">إغلاق</button> |
| </div> |
| <div id="bottom-sheet-list" class="suggestions-scroll" role="list" aria-live="polite"></div> |
| <button id="apply-all-sheet" class="btn-primary apply-all-btn mt-4 is-hidden" type="button">تطبيق الكل</button> |
| </div> |
| </div> |
| |
| <div id="doc-export-sheet" class="bottom-sheet" aria-hidden="true"> |
| <div id="doc-export-sheet-backdrop" class="bottom-sheet-backdrop"></div> |
| <div class="bottom-sheet-panel" role="dialog" aria-label="تصدير المستند"> |
| <div class="bottom-sheet-handle" aria-hidden="true"></div> |
| <div class="flex items-center justify-between mb-4"> |
| <h3 class="text-lg font-bold">تصدير المستند</h3> |
| <button id="doc-export-sheet-close" class="btn-ghost" type="button" aria-label="إغلاق">إغلاق</button> |
| </div> |
| <div class="flex flex-col gap-2"> |
| <button type="button" class="doc-dropdown__item" data-export-format="txt">ملف نصي (.txt)</button> |
| <button type="button" class="doc-dropdown__item" data-export-format="docx">Word (.docx)</button> |
| <button type="button" class="doc-dropdown__item" data-export-format="pdf">PDF (.pdf)</button> |
| </div> |
| </div> |
| </div> |
| <div id="page-pricing" class="page"> |
| <section class="pt-32 pb-24" style="background: var(--background-color);"> |
| <div class="max-w-7xl mx-auto px-6"> |
| <div class="text-center mb-16"> |
| <h1 class="text-5xl lg:text-6xl font-bold mb-6">خطط <span class="text-gradient">واضحة ومرنة</span></h1> |
| <p class="text-xl max-w-3xl mx-auto" style="color: var(--text-secondary); line-height: 1.9;">جميع الميزات متاحة مجانًا خلال الإصدار التجريبي. الخطط المدفوعة قادمة قريبًا.</p> |
| </div> |
| |
| <div class="text-center mb-12 p-6 rounded-2xl beta-shimmer" style="background: linear-gradient(135deg, rgba(107, 163, 224, 0.1), rgba(165, 148, 232, 0.1)); border: 1px solid rgba(107, 163, 224, 0.2);"> |
| <div class="flex items-center justify-center gap-2 mb-2"> |
| <span class="text-sm font-bold px-3 py-1 rounded-full text-white gradient-accent">BETA</span> |
| <span class="text-lg font-bold">الإصدار التجريبي — مجاني بالكامل</span> |
| </div> |
| <p class="text-base" style="color: var(--text-secondary);">استمتع بجميع ميزات بيان بدون أي قيود أثناء فترة التطوير</p> |
| </div> |
| <div class="grid md:grid-cols-3 gap-8 max-w-6xl mx-auto"> |
| <div class="p-8 rounded-3xl transition-all hover:scale-105 relative shadow-2xl pricing-glow" style="background: linear-gradient(165deg, var(--surface-color) 0%, rgba(59, 130, 246, 0.1) 100%); border: 2px solid var(--primary-color);"> |
| <div class="pricing-badge gradient-accent text-white"> |
| متاح الآن |
| </div> |
| <div class="text-center mb-8"> |
| <h3 class="text-3xl font-bold mb-2">الإصدار التجريبي</h3> |
| <p class="text-base mb-6" style="color: var(--text-secondary);">جميع الميزات بدون قيود</p> |
| <div class="text-6xl font-bold mb-2"> |
| مجاني |
| </div> |
| <p class="text-base" style="color: var(--text-secondary);">لفترة محدودة</p> |
| </div> |
| <ul class="space-y-4 mb-8"> |
| <li class="flex items-center gap-3"> |
| <svg class="w-5 h-5" style="color: #22c55e;" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg><span class="text-base">تدقيق إملائي ونحوي متقدم</span></li> |
| <li class="flex items-center gap-3"> |
| <svg class="w-5 h-5" style="color: #22c55e;" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg><span class="text-base">تصحيح علامات الترقيم</span></li> |
| <li class="flex items-center gap-3"> |
| <svg class="w-5 h-5" style="color: #22c55e;" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg><span class="text-base">تلخيص النصوص بالذكاء الاصطناعي</span></li> |
| <li class="flex items-center gap-3"> |
| <svg class="w-5 h-5" style="color: #22c55e;" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg><span class="text-base">الإكمال التلقائي الذكي</span></li> |
| <li class="flex items-center gap-3"> |
| <svg class="w-5 h-5" style="color: #22c55e;" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg><span class="text-base">تصدير PDF و Word</span></li> |
| <li class="flex items-center gap-3"> |
| <svg class="w-5 h-5" style="color: #22c55e;" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg><span class="text-base">تدقيق النص القرآني + ترجمة</span></li> |
| <li class="flex items-center gap-3"> |
| <svg class="w-5 h-5" style="color: #22c55e;" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg><span class="text-base">تحويل اللهجات إلى الفصحى</span></li> |
| <li class="flex items-center gap-3"> |
| <svg class="w-5 h-5" style="color: #22c55e;" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg><span class="text-base">كلمات غير محدودة</span></li> |
| </ul><button onclick="showPage('editor')" class="w-full py-4 rounded-2xl text-lg font-bold text-white gradient-accent transition-all hover:scale-105 hover:shadow-2xl">← ابدأ الكتابة مجانًا</button> |
| </div> |
| <div class="p-8 rounded-3xl transition-all hover:scale-105 relative" style="background: var(--surface-color); border: 1px solid rgba(255, 255, 255, 0.08); opacity: 0.7;"> |
| <div class="pricing-badge" style="background: var(--color-surface-elevated); color: var(--color-text-secondary);"> |
| قريبًا |
| </div> |
| <div class="text-center mb-8"> |
| <h3 class="text-3xl font-bold mb-2">احترافي</h3> |
| <p class="text-base mb-6" style="color: var(--text-secondary);">للكُتّاب الجادين</p> |
| <div class="flex items-center justify-center gap-2"><span class="text-6xl font-bold">٩</span> |
| <div class="text-right"> |
| <div class="text-lg font-bold">دولار</div> |
| <div class="text-sm" style="color: var(--text-secondary);">شهريًا</div> |
| </div> |
| </div> |
| </div> |
| <ul class="space-y-4 mb-8"> |
| <li class="flex items-center gap-3"> |
| <svg class="w-5 h-5" style="color: #22c55e;" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg><span class="text-base">كل ميزات الإصدار التجريبي</span></li> |
| <li class="flex items-center gap-3"> |
| <svg class="w-5 h-5" style="color: #22c55e;" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg><span class="text-base">أولوية في التحليل</span></li> |
| <li class="flex items-center gap-3"> |
| <svg class="w-5 h-5" style="color: #22c55e;" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg><span class="text-base">تخزين سحابي للمستندات</span></li> |
| <li class="flex items-center gap-3"> |
| <svg class="w-5 h-5" style="color: #22c55e;" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg><span class="text-base">دعم فني مباشر</span></li> |
| </ul><button disabled class="w-full py-4 rounded-2xl text-lg font-bold border-2 transition-all" style="border-color: rgba(255, 255, 255, 0.2); color: var(--text-secondary); cursor: not-allowed;">قريبًا</button> |
| </div> |
| <div class="p-8 rounded-3xl transition-all hover:scale-105" style="background: var(--surface-color); border: 1px solid rgba(255, 255, 255, 0.08); opacity: 0.7;"> |
| <div class="pricing-badge" style="background: var(--color-surface-elevated); color: var(--color-text-secondary);"> |
| قريبًا |
| </div> |
| <div class="text-center mb-8"> |
| <h3 class="text-3xl font-bold mb-2">مؤسسات</h3> |
| <p class="text-base mb-6" style="color: var(--text-secondary);">للفرق والمنظمات</p> |
| <div class="flex items-center justify-center gap-2"><span class="text-6xl font-bold">٢٩</span> |
| <div class="text-right"> |
| <div class="text-lg font-bold">دولار</div> |
| <div class="text-sm" style="color: var(--text-secondary);">لكل مستخدم/شهر</div> |
| </div> |
| </div> |
| </div> |
| <ul class="space-y-4 mb-8"> |
| <li class="flex items-center gap-3"> |
| <svg class="w-5 h-5" style="color: #22c55e;" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg><span class="text-base">كل ميزات الاحترافي</span></li> |
| <li class="flex items-center gap-3"> |
| <svg class="w-5 h-5" style="color: #22c55e;" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg><span class="text-base">إدارة الفرق</span></li> |
| <li class="flex items-center gap-3"> |
| <svg class="w-5 h-5" style="color: #22c55e;" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg><span class="text-base">واجهة برمجية (API)</span></li> |
| <li class="flex items-center gap-3"> |
| <svg class="w-5 h-5" style="color: #22c55e;" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg><span class="text-base">تكامل مخصص</span></li> |
| <li class="flex items-center gap-3"> |
| <svg class="w-5 h-5" style="color: #22c55e;" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg><span class="text-base">دعم فني ذو أولوية</span></li> |
| </ul><button disabled class="w-full py-4 rounded-2xl text-lg font-bold border-2 transition-all" style="border-color: rgba(255, 255, 255, 0.2); color: var(--text-secondary); cursor: not-allowed;">قريبًا</button> |
| </div> |
| </div> |
| </div> |
| </section> |
| </div> |
| <div id="page-404" class="page"> |
| <section class="gradient-bg min-h-screen pt-28 pb-20 flex items-center justify-center"> |
| <div class="text-center"> |
| <div class="text-8xl font-bold text-gradient mb-6">٤٠٤</div> |
| <h2 class="text-3xl font-bold mb-4">الصفحة غير موجودة</h2> |
| <p class="text-lg mb-8" style="color: var(--text-secondary);">يبدو أن الصفحة التي تبحث عنها غير متاحة.</p> |
| <button onclick="showPage('home')" class="px-8 py-4 rounded-2xl text-lg font-bold text-white gradient-accent transition-all hover:scale-105">→ العودة للرئيسية</button> |
| </div> |
| </section> |
| </div> |
| <footer class="py-16 border-t footer-bar"> |
| <div class="max-w-7xl mx-auto px-6"> |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-12 mb-12" dir="rtl"> |
| <div> |
| <div class="flex items-center gap-2.5 md:gap-3 mb-4"> |
| <img src="data:image/png;base64,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" alt="بيان" width="28" height="28" style="flex-shrink:0; border-radius:4px;"><div class="h-7 w-0.5 bg-gray-300 dark:bg-gray-600 rounded-full shrink-0"></div><span id="footer-brand" class="text-2xl font-bold text-gradient">بيان</span> |
| </div> |
| <p class="text-sm leading-relaxed" style="color: var(--text-secondary); line-height: 1.8;">منصة ذكاء اصطناعي للكتابة العربية — تدقيق إملائي ونحوي، ترقيم، تلخيص، إكمال تلقائي، تدقيق القرآن، وتحويل اللهجات.</p> |
| </div> |
| <div> |
| <h4 class="text-base font-bold mb-4">المنتج</h4> |
| <ul class="space-y-3"> |
| <li><button onclick="showPage('editor')" class="text-sm transition-colors footer-link-hover" style="color: var(--text-secondary); background: none; border: none; cursor: pointer; font-family: inherit;">المحرر</button></li> |
| <li><button onclick="showPage('features')" class="text-sm transition-colors footer-link-hover" style="color: var(--text-secondary); background: none; border: none; cursor: pointer; font-family: inherit;">الميزات</button></li> |
| <li><button onclick="showPage('pricing')" class="text-sm transition-colors footer-link-hover" style="color: var(--text-secondary); background: none; border: none; cursor: pointer; font-family: inherit;">الأسعار</button></li> |
| </ul> |
| </div> |
| <div> |
| <h4 class="text-base font-bold mb-4">المزيد</h4> |
| <ul class="space-y-3"> |
| <li><a href="https://bayyinah-alpha.vercel.app/" class="footer-external-link text-sm transition-colors" target="_blank" rel="noopener noreferrer">بَيِّنَة — القرآن والحديث</a></li> |
| <li><a href="https://github.com/mohamedatef24/BAYAN" class="text-sm transition-colors hover:text-white" style="color: var(--text-secondary); display: flex; align-items: center; gap: 6px;" target="_blank" rel="noopener noreferrer"><svg width="16" height="16" fill="currentColor" viewBox="0 0 24 24"><path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23A11.509 11.509 0 0112 5.803c1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576C20.566 21.797 24 17.3 24 12c0-6.627-5.373-12-12-12z"/></svg>المستودع على GitHub</a></li> |
| </ul> |
| </div> |
| </div> |
| <div class="pt-8 border-t" style="border-color: var(--color-border);"> |
| <p class="text-sm text-center" style="color: var(--text-secondary);">© ٢٠٢٦ بيان. جميع الحقوق محفوظة.</p> |
| </div> |
| </div> |
| </footer> |
| |
| <div id="toast-container" class="toast-container"></div> |
| |
| <button id="scroll-top-btn" class="scroll-top-btn" type="button" aria-label="العودة للأعلى"> |
| <svg width="20" height="20" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 15l7-7 7 7"/></svg> |
| </button> |
| </div> |
| <script> |
| |
| function showToast(message, type = 'success', duration = 2500) { |
| const container = document.getElementById('toast-container'); |
| if (!container) return; |
| const toast = document.createElement('div'); |
| toast.className = 'toast toast--' + type; |
| toast.textContent = message; |
| container.appendChild(toast); |
| setTimeout(() => { |
| toast.classList.add('toast-out'); |
| setTimeout(() => toast.remove(), 300); |
| }, duration); |
| } |
| |
| |
| function showConfirmDialog(title, message, onConfirm) { |
| var overlay = document.createElement('div'); |
| overlay.className = 'confirm-dialog-overlay'; |
| overlay.innerHTML = |
| '<div class="confirm-dialog" dir="rtl">' + |
| '<div class="confirm-dialog__title">' + title + '</div>' + |
| '<div class="confirm-dialog__message">' + message + '</div>' + |
| '<div class="confirm-dialog__actions">' + |
| '<button class="confirm-dialog__btn" id="confirm-cancel">\u0625\u0644\u063a\u0627\u0621</button>' + |
| '<button class="confirm-dialog__btn confirm-dialog__btn--danger" id="confirm-ok">\u062a\u0623\u0643\u064a\u062f</button>' + |
| '</div>' + |
| '</div>'; |
| document.body.appendChild(overlay); |
| overlay.querySelector('#confirm-cancel').onclick = function() { overlay.remove(); }; |
| overlay.querySelector('#confirm-ok').onclick = function() { overlay.remove(); if (onConfirm) onConfirm(); }; |
| overlay.addEventListener('click', function(e) { if (e.target === overlay) overlay.remove(); }); |
| document.addEventListener('keydown', function _esc(e) { |
| if (e.key === 'Escape') { overlay.remove(); document.removeEventListener('keydown', _esc); } |
| }); |
| } |
| |
| |
| (function() { |
| const btn = document.getElementById('scroll-top-btn'); |
| const sc = document.querySelector('.h-full.overflow-auto') || document.documentElement; |
| if (!btn) return; |
| const target = sc === document.documentElement ? window : sc; |
| (sc === document.documentElement ? window : sc).addEventListener('scroll', () => { |
| const st = sc === document.documentElement ? window.scrollY : sc.scrollTop; |
| btn.classList.toggle('visible', st > 400); |
| const nav = document.querySelector('.site-nav'); |
| if (nav) nav.classList.toggle('nav-scrolled', st > 20); |
| }); |
| btn.addEventListener('click', () => { |
| (sc === document.documentElement ? window : sc).scrollTo({ top: 0, behavior: 'smooth' }); |
| }); |
| })(); |
| |
| |
| const defaultConfig = { |
| brand_name: 'بيان', |
| hero_headline: 'اكتب العربية بثقة واحتراف', |
| hero_subheadline: 'منصة ذكاء اصطناعي متكاملة لتصحيح الإملاء والنحو والترقيم وتلخيص النصوص والإكمال التلقائي — مصمّمة خصيصًا للغة العربية.', |
| cta_primary: 'ابدأ الكتابة مجانًا', |
| primary_color: '#6BA3E0', |
| secondary_color: '#A594E8', |
| font_family: 'Cairo', |
| font_size: 16 |
| }; |
| |
| let config = { ...defaultConfig }; |
| |
| |
| function showPage(pageId) { |
| document.querySelectorAll('.page').forEach(page => page.classList.remove('active')); |
| document.getElementById('page-' + pageId).classList.add('active'); |
| |
| document.querySelectorAll('.nav-link, .mobile-drawer-link').forEach(link => { |
| link.classList.remove('active'); |
| }); |
| |
| document.querySelectorAll(`[data-page="${pageId}"]`).forEach(link => { |
| link.classList.add('active'); |
| }); |
| |
| try { |
| sessionStorage.setItem('bayan_current_page', pageId); |
| } catch (e) {} |
| |
| window.scrollTo(0, 0); |
| } |
| |
| |
| function switchTab(tab) { |
| const tabs = ['write', 'summarize', 'dialect', 'quran']; |
| const formatToolbar = document.getElementById('format-toolbar'); |
| tabs.forEach(function(t) { |
| var tabEl = document.getElementById(t + '-tab'); |
| var areaEl = document.getElementById(t + '-area') || document.getElementById(t === 'write' ? 'write-area' : t + '-area'); |
| if (tabEl) tabEl.classList.remove('active'); |
| if (areaEl) areaEl.classList.add('is-hidden'); |
| }); |
| var activeTab = document.getElementById(tab + '-tab'); |
| var activeArea = document.getElementById(tab === 'write' ? 'write-area' : tab + '-area'); |
| if (activeTab) activeTab.classList.add('active'); |
| if (activeArea) activeArea.classList.remove('is-hidden'); |
| if (formatToolbar) formatToolbar.style.display = (tab === 'write') ? '' : 'none'; |
| |
| var sidebar = document.querySelector('.sidebar-panel.sidebar-desktop'); |
| if (sidebar) sidebar.style.display = (tab === 'write') ? '' : 'none'; |
| |
| var mobileTrigger = document.getElementById('mobile-sheet-trigger'); |
| if (mobileTrigger) mobileTrigger.style.display = (tab === 'write') ? '' : 'none'; |
| |
| var docsPanel = document.querySelector('.docs-panel-desktop'); |
| if (docsPanel) docsPanel.style.display = (tab === 'write') ? '' : 'none'; |
| |
| var editorLayout = document.querySelector('.editor-layout'); |
| if (editorLayout) { |
| if (tab === 'write') { |
| editorLayout.classList.remove('tools-mode'); |
| } else { |
| editorLayout.classList.add('tools-mode'); |
| } |
| } |
| } |
| |
| |
| |
| |
| window._summarySource = 'custom'; |
| function setSummarySource() {} |
| |
| function importSummaryFile(inputEl) { |
| if (!inputEl || !inputEl.files || !inputEl.files[0]) return; |
| var file = inputEl.files[0]; |
| var ta = document.getElementById('summary-custom-input'); |
| if (!ta) return; |
| |
| if (file.name.endsWith('.txt')) { |
| var reader = new FileReader(); |
| reader.onload = function(e) { |
| ta.value = e.target.result; |
| if (typeof showToast === 'function') showToast('✓ تم استيراد الملف'); |
| }; |
| reader.readAsText(file, 'UTF-8'); |
| } else if (file.name.endsWith('.docx')) { |
| |
| if (typeof mammoth !== 'undefined') { |
| var reader = new FileReader(); |
| reader.onload = function(e) { |
| mammoth.extractRawText({ arrayBuffer: e.target.result }) |
| .then(function(result) { ta.value = result.value; if (typeof showToast === 'function') showToast('✓ تم استيراد الملف'); }) |
| .catch(function() { if (typeof showToast === 'function') showToast('خطأ في قراءة الملف', 'error'); }); |
| }; |
| reader.readAsArrayBuffer(file); |
| } else { |
| if (typeof showToast === 'function') showToast('صيغة .docx غير مدعومة حاليًا — استخدم .txt', 'warning'); |
| } |
| } |
| inputEl.value = ''; |
| } |
| |
| |
| |
| |
| (function() { |
| var selBar = null; |
| var hideTimer = null; |
| function showSelectionBar() { |
| var sel = window.getSelection(); |
| if (!sel || sel.isCollapsed || !sel.toString().trim()) { hideSelectionBar(); return; } |
| var editor = document.getElementById('editor-container'); |
| if (!editor || !editor.contains(sel.anchorNode)) { hideSelectionBar(); return; } |
| if (!selBar) selBar = document.getElementById('selection-toolbar'); |
| if (!selBar) return; |
| var range = sel.getRangeAt(0); |
| var rect = range.getBoundingClientRect(); |
| selBar.style.top = (rect.top + window.scrollY - 48) + 'px'; |
| selBar.style.left = (rect.left + rect.width / 2) + 'px'; |
| selBar.classList.remove('is-hidden'); |
| } |
| function hideSelectionBar() { |
| if (!selBar) selBar = document.getElementById('selection-toolbar'); |
| if (selBar) selBar.classList.add('is-hidden'); |
| } |
| document.addEventListener('selectionchange', function() { |
| clearTimeout(hideTimer); |
| hideTimer = setTimeout(function() { |
| var sel = window.getSelection(); |
| if (sel && !sel.isCollapsed && sel.toString().trim().length > 2) { |
| var editor = document.getElementById('editor-container'); |
| if (editor && editor.contains(sel.anchorNode)) { showSelectionBar(); return; } |
| } |
| hideSelectionBar(); |
| }, 300); |
| }); |
| document.addEventListener('mousedown', function(e) { |
| if (!selBar) selBar = document.getElementById('selection-toolbar'); |
| if (selBar && !selBar.contains(e.target)) hideSelectionBar(); |
| }); |
| })(); |
| |
| function selectionToolAction(tool) { |
| var sel = window.getSelection(); |
| var text = sel ? sel.toString().trim() : ''; |
| if (!text) { if (typeof showToast === 'function') showToast('حدد نصًا أولاً', 'warning'); return; } |
| var selBar = document.getElementById('selection-toolbar'); |
| if (selBar) selBar.classList.add('is-hidden'); |
| if (tool === 'summarize') { |
| switchTab('summarize'); |
| var ta = document.getElementById('summary-custom-input'); |
| if (ta) { ta.value = text; } |
| } else if (tool === 'dialect') { |
| switchTab('dialect'); |
| var ta = document.getElementById('dialect-input'); |
| if (ta) { ta.value = text; if (typeof updateDialectCharCount === 'function') updateDialectCharCount(); } |
| } else if (tool === 'quran') { |
| switchTab('quran'); |
| var ta = document.getElementById('quran-input'); |
| if (ta) ta.value = text; |
| } |
| } |
| |
| |
| |
| |
| let _quranInlineQuery = ''; |
| |
| function _qEsc(t) { return t.replace(/&/g,'&').replace(/</g,'<').replace(/>/g,'>'); } |
| |
| function _qParseSegment(seg) { |
| var refMatch = seg.match(/【([^】]+)】/); |
| var verseText = seg.replace(/\s*【[^】]+】\s*$/, '').replace(/^\(/, '').replace(/\)$/, ''); |
| var reference = refMatch ? refMatch[1] : ''; |
| return { verseText: verseText, reference: reference }; |
| } |
| |
| function _qLangOptions() { |
| return '<option value="">— اختر لغة —</option>' |
| + '<option value="english">English</option>' |
| + '<option value="french">Français</option>' |
| + '<option value="turkish">Türkçe</option>' |
| + '<option value="persian">فارسی</option>' |
| + '<option value="russian">Русский</option>' |
| + '<option value="spanish">Español</option>' |
| + '<option value="german">Deutsch</option>' |
| + '<option value="indonesian">Indonesia</option>' |
| + '<option value="malay">Melayu</option>' |
| + '<option value="bengali">বাংলা</option>' |
| + '<option value="bosnian">Bosanski</option>' |
| + '<option value="portuguese">Português</option>' |
| + '<option value="uzbek">O\'zbek</option>'; |
| } |
| |
| function _qReplaceInEditor(newText, ref) { |
| var editor = document.getElementById('editor-container'); |
| if (!editor) return false; |
| var plain = editor.textContent || ''; |
| var query = _quranInlineQuery || ''; |
| var idx = plain.indexOf(query); |
| if (idx === -1) return false; |
| if (typeof pushUndoState === 'function') pushUndoState(); |
| var before = plain.substring(0, idx); |
| var after = plain.substring(idx + query.length); |
| var refHTML = ref ? ' <span class="quran-ref-inline">[' + _qEsc(ref) + ']</span>' : ''; |
| editor.innerHTML = _qEsc(before) + |
| '<span class="quran-applied" contenteditable="false" data-quran="true">' + |
| _qEsc(newText) + refHTML + '</span>' + _qEsc(after); |
| editor.focus(); |
| editor.dispatchEvent(new Event('input', { bubbles: true })); |
| return true; |
| } |
| |
| function _qRenderInlineCards(matches) { |
| var list = document.getElementById('quran-inline-match-list'); |
| list.innerHTML = ''; |
| matches.forEach(function(m, i) { |
| var p = _qParseSegment(m.matched_segment || ''); |
| var card = document.createElement('div'); |
| card.className = 'quran-inline-match-card'; |
| card.innerHTML = '<div class="flex items-center justify-between mb-3">' |
| + '<div class="text-sm font-bold" style="color:#06b6d4;">✓ نتيجة ' + (i + 1) + '</div>' |
| + '<div class="flex items-center gap-2">' |
| + '<button class="quran-copy-btn qic-copy" type="button" title="نسخ">📋</button>' |
| + '<button class="quran-apply-btn qic-apply" type="button">تطبيق في المحرر ✓</button>' |
| + '</div></div>' |
| + '<p class="quran-uthmani" style="font-size:24px;line-height:2.2;text-align:center;" dir="rtl">' + _qEsc(p.verseText) + '</p>' |
| + '<p class="quran-reference text-center mt-2">' + (p.reference ? '[' + _qEsc(p.reference) + ']' : '') + '</p>' |
| + '<div class="mt-4 pt-4" style="border-top:1px solid var(--color-border);">' |
| + '<div class="flex items-center gap-3 mb-3 flex-wrap">' |
| + '<span class="text-sm font-bold">ترجمة الآية</span>' |
| + '<select class="quran-lang-select qic-lang">' + _qLangOptions() + '</select>' |
| + '</div>' |
| + '<div class="qic-trans-section is-hidden p-4 rounded-xl" style="background:rgba(6,182,212,0.06);border:1px solid rgba(6,182,212,0.15);">' |
| + '<p class="qic-trans-text" style="font-size:18px;line-height:2;color:var(--color-text-primary);text-align:center;"></p>' |
| + '<div class="flex items-center justify-center gap-2 mt-3">' |
| + '<button class="quran-copy-btn qic-copy-trans" type="button" title="نسخ الترجمة">📋 نسخ</button>' |
| + '<button class="quran-apply-btn qic-apply-trans" type="button">تطبيق الترجمة ✓</button>' |
| + '</div></div></div>'; |
| |
| card.querySelector('.qic-copy').addEventListener('click', function() { |
| var txt = p.verseText + (p.reference ? ' [' + p.reference + ']' : ''); |
| navigator.clipboard.writeText(txt).then(function() { if (typeof showToast === 'function') showToast('✓ تم النسخ'); }); |
| }); |
| |
| card.querySelector('.qic-apply').addEventListener('click', function() { |
| if (_qReplaceInEditor(p.verseText, p.reference)) { |
| switchTab('write'); |
| if (typeof showToast === 'function') showToast('✓ تم استبدال النص بالنص القرآني المدقق'); |
| } else { |
| var editor = document.getElementById('editor-container'); |
| if (!editor) return; |
| if (typeof pushUndoState === 'function') pushUndoState(); |
| var refHTML = p.reference ? ' <span class="quran-ref-inline">[' + _qEsc(p.reference) + ']</span>' : ''; |
| var existing = editor.innerHTML; |
| editor.innerHTML = existing + (existing ? '<br>' : '') + |
| '<span class="quran-applied" contenteditable="false" data-quran="true">' + |
| _qEsc(p.verseText) + refHTML + '</span>'; |
| editor.dispatchEvent(new Event('input', { bubbles: true })); |
| switchTab('write'); |
| if (typeof showToast === 'function') showToast('✓ تم إضافة النص القرآني في المحرر'); |
| } |
| }); |
| |
| var langSel = card.querySelector('.qic-lang'); |
| var transSec = card.querySelector('.qic-trans-section'); |
| var transP = card.querySelector('.qic-trans-text'); |
| var copyTransBtn = card.querySelector('.qic-copy-trans'); |
| var applyTransBtn = card.querySelector('.qic-apply-trans'); |
| |
| langSel.addEventListener('change', async function() { |
| var lang = langSel.value; |
| if (!lang || !_quranInlineQuery) return; |
| transSec.classList.remove('is-hidden'); |
| transP.innerHTML = '<span class="text-secondary">⏳ جاري الترجمة...</span>'; |
| var ctrl = new AbortController(); |
| var tmo = setTimeout(function(){ ctrl.abort(); }, 30000); |
| try { |
| var res = await fetch('/api/quran', { |
| method: 'POST', headers: { 'Content-Type': 'application/json' }, |
| body: JSON.stringify({ text: _quranInlineQuery, language: lang }), |
| signal: ctrl.signal |
| }); |
| var data = await res.json(); |
| if (data.error) { transP.innerHTML = '<span class="text-secondary">' + _qEsc(data.error) + '</span>'; return; } |
| var seg = data.matched_segment || ''; |
| var tp = _qParseSegment(seg); |
| transP.textContent = tp.verseText; |
| } catch (err) { |
| transP.innerHTML = '<span class="text-secondary">' + (err.name === 'AbortError' ? 'انتهى وقت الانتظار' : 'حدث خطأ في الترجمة') + '</span>'; |
| } finally { clearTimeout(tmo); } |
| }); |
| |
| copyTransBtn.addEventListener('click', function() { |
| navigator.clipboard.writeText(transP.textContent || '').then(function() { |
| if (typeof showToast === 'function') showToast('✓ تم نسخ الترجمة'); |
| }); |
| }); |
| |
| applyTransBtn.addEventListener('click', function() { |
| var txt = transP.textContent || ''; |
| if (!txt) return; |
| var editor = document.getElementById('editor-container'); |
| if (!editor) return; |
| if (typeof pushUndoState === 'function') pushUndoState(); |
| var existing = editor.innerHTML; |
| editor.innerHTML = existing + (existing ? '<br>' : '') + _qEsc(txt); |
| editor.dispatchEvent(new Event('input', { bubbles: true })); |
| switchTab('write'); |
| if (typeof showToast === 'function') showToast('✓ تم تطبيق الترجمة في المحرر'); |
| }); |
| |
| list.appendChild(card); |
| }); |
| } |
| |
| async function searchQuranStandalone() { |
| var input = document.getElementById('quran-input').value.trim(); |
| if (!input) { if (typeof showToast === 'function') showToast('الرجاء كتابة نص قرآني أولاً', 'warning'); return; } |
| _quranInlineQuery = input; |
| var resultDiv = document.getElementById('quran-inline-result'); |
| var matchList = document.getElementById('quran-inline-match-list'); |
| var searchBtn = document.getElementById('quran-search-btn'); |
| matchList.innerHTML = '<p class="text-secondary text-center" style="padding:1rem;">⏳ جاري البحث...</p>'; |
| resultDiv.classList.remove('is-hidden'); |
| if (searchBtn) { searchBtn.disabled = true; searchBtn.textContent = '⏳ جاري البحث...'; } |
| var _abortCtrl = new AbortController(); |
| var _timeout = setTimeout(function(){ _abortCtrl.abort(); }, 30000); |
| try { |
| var res = await fetch('/api/quran', { |
| method: 'POST', |
| headers: { 'Content-Type': 'application/json' }, |
| body: JSON.stringify({ text: input, language: 'تدقيق الايات', top_n: 5 }), |
| signal: _abortCtrl.signal |
| }); |
| var data = await res.json(); |
| if (data.error) { |
| matchList.innerHTML = '<p class="text-secondary text-center" style="padding:1rem;">' + _qEsc(data.error) + '</p>'; |
| return; |
| } |
| var matches = data.matches || [data]; |
| _qRenderInlineCards(matches); |
| } catch (err) { |
| var msg = err.name === 'AbortError' ? 'انتهى وقت الانتظار — حاول مرة أخرى' : 'حدث خطأ أثناء البحث — تأكد من الاتصال'; |
| matchList.innerHTML = '<p class="text-secondary text-center" style="padding:1rem;">' + msg + '</p>'; |
| } finally { |
| clearTimeout(_timeout); |
| if (searchBtn) { searchBtn.disabled = false; searchBtn.textContent = 'بحث وتدقيق'; } |
| } |
| } |
| let _dialectResult = ''; |
| let _dialectInput = ''; |
| async function convertDialect() { |
| var input = document.getElementById('dialect-input').value.trim(); |
| if (!input) { if (typeof showToast === 'function') showToast('الرجاء كتابة نص أولاً', 'warning'); return; } |
| _dialectInput = input; |
| |
| var resultCard = document.getElementById('dialect-result-card'); |
| var resultDiv = document.getElementById('dialect-result'); |
| var applyBtn = document.getElementById('dialect-apply-btn'); |
| var convertBtn = document.getElementById('dialect-convert-btn'); |
| resultDiv.innerHTML = '<p class="text-secondary text-center">⏳ جاري التحويل...</p>'; |
| resultCard.classList.remove('is-hidden'); |
| if (applyBtn) applyBtn.classList.add('is-hidden'); |
| if (convertBtn) { convertBtn.disabled = true; convertBtn.textContent = '⏳ جاري التحويل...'; } |
| |
| var _abortCtrl = new AbortController(); |
| var _timeout = setTimeout(function(){ _abortCtrl.abort(); }, 30000); |
| try { |
| var resp = await fetch('/api/dialect', { |
| method: 'POST', |
| headers: { 'Content-Type': 'application/json' }, |
| body: JSON.stringify({ text: input }), |
| signal: _abortCtrl.signal |
| }); |
| var data = await resp.json(); |
| if (data.status === 'success' && data.converted_text) { |
| _dialectResult = data.converted_text; |
| var esc = function(t) { return t.replace(/&/g,'&').replace(/</g,'<').replace(/>/g,'>'); }; |
| resultDiv.innerHTML = '<p style="font-size:20px; line-height:2; direction:rtl; text-align:center;">' + esc(data.converted_text) + '</p>'; |
| if (applyBtn) applyBtn.classList.remove('is-hidden'); |
| } else { |
| _dialectResult = ''; |
| var errMsg = (data.error || 'حدث خطأ أثناء التحويل').replace(/&/g,'&').replace(/</g,'<').replace(/>/g,'>'); |
| resultDiv.innerHTML = '<p class="text-secondary text-center">' + errMsg + '</p>'; |
| } |
| } catch (err) { |
| _dialectResult = ''; |
| var msg = err.name === 'AbortError' ? 'انتهى وقت الانتظار — حاول مرة أخرى' : 'حدث خطأ — تأكد من الاتصال'; |
| resultDiv.innerHTML = '<p class="text-secondary text-center">' + msg + '</p>'; |
| } finally { |
| clearTimeout(_timeout); |
| if (convertBtn) { convertBtn.disabled = false; convertBtn.textContent = 'تحويل إلى الفصحى'; } |
| } |
| } |
| |
| function copyDialectResult() { |
| if (!_dialectResult) { var t = document.getElementById('dialect-result'); if (t) navigator.clipboard.writeText(t.innerText); } |
| else navigator.clipboard.writeText(_dialectResult); |
| if (typeof showToast === 'function') showToast('✓ تم النسخ'); |
| } |
| |
| function applyDialectResult() { |
| if (!_dialectResult) return; |
| var editor = document.getElementById('editor-container'); |
| if (!editor) return; |
| pushUndoState(); |
| var esc = function(t) { return t.replace(/&/g,'&').replace(/</g,'<').replace(/>/g,'>'); }; |
| |
| if (_dialectInput) { |
| var plain = editor.textContent || ''; |
| var idx = plain.indexOf(_dialectInput); |
| if (idx !== -1) { |
| var before = plain.substring(0, idx); |
| var after = plain.substring(idx + _dialectInput.length); |
| editor.innerHTML = esc(before) + esc(_dialectResult) + esc(after); |
| editor.focus(); |
| editor.dispatchEvent(new Event('input', { bubbles: true })); |
| switchTab('write'); |
| if (typeof showToast === 'function') showToast('✓ تم استبدال النص بالفصحى'); |
| return; |
| } |
| } |
| |
| editor.innerHTML = esc(_dialectResult); |
| editor.dispatchEvent(new Event('input', { bubbles: true })); |
| switchTab('write'); |
| if (typeof showToast === 'function') showToast('✓ تم تطبيق النص الفصيح في المحرر'); |
| } |
| |
| function updateSummaryWordCount() { |
| var input = document.getElementById('summary-custom-input'); |
| var counter = document.getElementById('summary-char-count'); |
| if (!input || !counter) return; |
| var text = input.value.trim(); |
| var words = text ? text.split(/\s+/).length : 0; |
| counter.textContent = words.toLocaleString('ar-EG') + ' كلمة'; |
| } |
| |
| function updateDialectCharCount() { |
| var input = document.getElementById('dialect-input'); |
| var counter = document.getElementById('dialect-char-count'); |
| if (!input || !counter) return; |
| var len = input.value.length; |
| var arabicLen = len.toLocaleString('ar-EG'); |
| counter.textContent = arabicLen + ' حرف'; |
| counter.style.color = len > 5000 ? '#ef4444' : 'var(--text-secondary)'; |
| } |
| |
| |
| |
| |
| let _quranCurrentQuery = ''; |
| let _quranSavedRange = null; |
| let _quranVerseClean = ''; |
| let _quranTransClean = ''; |
| let _quranRef = ''; |
| let _quranTransRef = ''; |
| |
| async function verifyQuranText() { |
| const sel = window.getSelection(); |
| const text = sel ? sel.toString().trim() : ''; |
| if (!text) { |
| if (typeof showToast === 'function') showToast('علّم على النص القرآني أولاً', 'warning'); |
| return; |
| } |
| |
| _quranSavedRange = (sel.rangeCount > 0) ? sel.getRangeAt(0).cloneRange() : null; |
| _quranCurrentQuery = text; |
| _quranVerseClean = ''; |
| |
| |
| const modal = document.getElementById('quran-modal'); |
| document.getElementById('quran-input-display').textContent = text; |
| document.getElementById('quran-uthmani-text').innerHTML = '<span class="text-secondary">⏳ جاري البحث...</span>'; |
| document.getElementById('quran-reference').textContent = ''; |
| document.getElementById('quran-translation-result').classList.add('is-hidden'); |
| document.getElementById('quran-lang-select').value = ''; |
| |
| var _applyBtn = document.getElementById('quran-apply-btn'); |
| var _copyBtn = document.getElementById('quran-copy-btn'); |
| if (_applyBtn) _applyBtn.classList.add('is-hidden'); |
| if (_copyBtn) _copyBtn.classList.add('is-hidden'); |
| modal.classList.remove('is-hidden'); |
| document.body.style.overflow = 'hidden'; |
| |
| var _qAbort = new AbortController(); |
| var _qTimeout = setTimeout(function(){ _qAbort.abort(); }, 30000); |
| try { |
| const res = await fetch('/api/quran', { |
| method: 'POST', |
| headers: { 'Content-Type': 'application/json' }, |
| body: JSON.stringify({ text: text, language: 'تدقيق الايات' }), |
| signal: _qAbort.signal |
| }); |
| const data = await res.json(); |
| |
| if (data.error) { |
| var _escErr = data.error.replace(/&/g,'&').replace(/</g,'<').replace(/>/g,'>'); |
| document.getElementById('quran-uthmani-text').innerHTML = |
| '<span class="text-secondary">' + _escErr + '</span>'; |
| return; |
| } |
| |
| |
| const seg = data.matched_segment || ''; |
| const refMatch = seg.match(/【([^】]+)】/); |
| const verseText = seg.replace(/\s*【[^】]+】\s*$/, '').replace(/^\(/, '').replace(/\)$/, ''); |
| const reference = refMatch ? refMatch[1] : ''; |
| |
| _quranVerseClean = verseText; |
| _quranRef = reference; |
| document.getElementById('quran-uthmani-text').textContent = verseText; |
| document.getElementById('quran-reference').textContent = reference ? '[' + reference + ']' : ''; |
| |
| document.getElementById('quran-apply-btn').classList.remove('is-hidden'); |
| document.getElementById('quran-copy-btn').classList.remove('is-hidden'); |
| |
| } catch (err) { |
| var _qMsg = err.name === 'AbortError' ? 'انتهى وقت الانتظار — حاول مرة أخرى' : 'حدث خطأ أثناء البحث — تأكد من الاتصال'; |
| document.getElementById('quran-uthmani-text').innerHTML = |
| '<span class="text-secondary">' + _qMsg + '</span>'; |
| } finally { |
| clearTimeout(_qTimeout); |
| } |
| } |
| |
| async function translateQuranVerse() { |
| const lang = document.getElementById('quran-lang-select').value; |
| if (!lang || !_quranCurrentQuery) return; |
| |
| const resultDiv = document.getElementById('quran-translation-result'); |
| const textEl = document.getElementById('quran-translation-text'); |
| textEl.innerHTML = '<span class="text-secondary">⏳ جاري الترجمة...</span>'; |
| resultDiv.classList.remove('is-hidden'); |
| |
| var _applyTransBtn = document.getElementById('quran-apply-trans-btn'); |
| var _copyTransBtn = document.getElementById('quran-copy-trans-btn'); |
| if (_applyTransBtn) _applyTransBtn.classList.add('is-hidden'); |
| if (_copyTransBtn) _copyTransBtn.classList.add('is-hidden'); |
| |
| var _tAbort = new AbortController(); |
| var _tTimeout = setTimeout(function(){ _tAbort.abort(); }, 30000); |
| try { |
| const res = await fetch('/api/quran', { |
| method: 'POST', |
| headers: { 'Content-Type': 'application/json' }, |
| body: JSON.stringify({ text: _quranCurrentQuery, language: lang }), |
| signal: _tAbort.signal |
| }); |
| const data = await res.json(); |
| |
| if (data.error) { |
| var _escTErr = data.error.replace(/&/g,'&').replace(/</g,'<').replace(/>/g,'>'); |
| textEl.innerHTML = '<span class="text-secondary">' + _escTErr + '</span>'; |
| return; |
| } |
| |
| |
| const seg = data.matched_segment || ''; |
| const refMatch = seg.match(/【([^】]+)】/); |
| const transText = seg.replace(/\s*【[^】]+】\s*$/, '').replace(/^\(/, '').replace(/\)$/, ''); |
| const transRef = refMatch ? refMatch[1] : ''; |
| |
| textEl.textContent = transText; |
| _quranTransClean = transText; |
| _quranTransRef = transRef; |
| |
| const refEl = document.getElementById('quran-translation-ref'); |
| if (refEl) { |
| refEl.textContent = transRef ? '[' + transRef + ']' : ''; |
| refEl.style.display = transRef ? '' : 'none'; |
| } |
| |
| document.getElementById('quran-apply-trans-btn').classList.remove('is-hidden'); |
| document.getElementById('quran-copy-trans-btn').classList.remove('is-hidden'); |
| |
| } catch (err) { |
| var _tMsg = err.name === 'AbortError' ? 'انتهى وقت الانتظار — حاول مرة أخرى' : 'حدث خطأ في الترجمة'; |
| textEl.innerHTML = '<span class="text-secondary">' + _tMsg + '</span>'; |
| } finally { |
| clearTimeout(_tTimeout); |
| } |
| } |
| |
| function closeQuranModal() { |
| document.getElementById('quran-modal').classList.add('is-hidden'); |
| document.body.style.overflow = ''; |
| } |
| |
| function copyQuranResult() { |
| const verse = _quranVerseClean || ''; |
| const ref = _quranRef ? ' [' + _quranRef + ']' : ''; |
| const text = verse + ref; |
| if (!text.trim()) return; |
| navigator.clipboard.writeText(text).then(() => { |
| if (typeof showToast === 'function') showToast('✓ تم نسخ النص المدقق'); |
| const btn = document.getElementById('quran-copy-btn'); |
| if (btn) { btn.textContent = '✅'; setTimeout(() => { btn.textContent = '📋'; }, 1500); } |
| }); |
| } |
| |
| |
| |
| document.addEventListener('keydown', (e) => { |
| if ((e.ctrlKey || e.metaKey) && e.code === 'KeyQ') { |
| e.preventDefault(); |
| |
| var sel = window.getSelection(); |
| var text = sel ? sel.toString().trim() : ''; |
| switchTab('quran'); |
| if (text) { |
| var ta = document.getElementById('quran-input'); |
| if (ta) ta.value = text; |
| } |
| } |
| if (e.key === 'Escape') { |
| var modal = document.getElementById('quran-modal'); |
| if (modal && !modal.classList.contains('is-hidden')) { |
| closeQuranModal(); |
| } |
| } |
| }); |
| |
| function copyQuranTranslation() { |
| const trans = _quranTransClean || ''; |
| const ref = _quranTransRef ? ' [' + _quranTransRef + ']' : ''; |
| const text = trans + ref; |
| if (!text.trim()) return; |
| navigator.clipboard.writeText(text).then(() => { |
| if (typeof showToast === 'function') showToast('✓ تم نسخ الترجمة'); |
| const btn = document.getElementById('quran-copy-trans-btn'); |
| if (btn) { btn.textContent = '✅'; setTimeout(() => { btn.textContent = '📋'; }, 1500); } |
| }); |
| } |
| |
| function _replaceInEditor(newText, ref) { |
| var editor = document.getElementById('editor-container'); |
| if (!editor || !_quranCurrentQuery) return false; |
| pushUndoState(); |
| closeQuranModal(); |
| |
| var plain = editor.textContent || ''; |
| var idx = plain.indexOf(_quranCurrentQuery); |
| if (idx === -1) return false; |
| var before = plain.substring(0, idx); |
| var after = plain.substring(idx + _quranCurrentQuery.length); |
| |
| var esc = function(t) { return t.replace(/&/g,'&').replace(/</g,'<').replace(/>/g,'>'); }; |
| var refHTML = ref ? ' <span class="quran-ref-inline">[' + esc(ref) + ']</span>' : ''; |
| editor.innerHTML = esc(before) + |
| '<span class="quran-applied" contenteditable="false" data-quran="true">' + |
| esc(newText) + refHTML + '</span>' + |
| esc(after); |
| editor.focus(); |
| editor.dispatchEvent(new Event('input', { bubbles: true })); |
| return true; |
| } |
| |
| function applyQuranText() { |
| if (!_quranVerseClean || !_quranCurrentQuery) { |
| if (typeof showToast === 'function') showToast('لا يوجد نص للتطبيق', 'warning'); |
| return; |
| } |
| if (_replaceInEditor(_quranVerseClean, _quranRef)) { |
| if (typeof showToast === 'function') showToast('✓ تم تطبيق النص القرآني المدقق'); |
| } else { |
| if (typeof showToast === 'function') showToast('لم يتم العثور على النص الأصلي', 'error'); |
| } |
| } |
| |
| function applyQuranTranslation() { |
| if (!_quranTransClean || !_quranCurrentQuery) { |
| if (typeof showToast === 'function') showToast('لا يوجد ترجمة للتطبيق', 'warning'); |
| return; |
| } |
| if (_replaceInEditor(_quranTransClean, _quranTransRef)) { |
| if (typeof showToast === 'function') showToast('✓ تم تطبيق الترجمة'); |
| } else { |
| if (typeof showToast === 'function') showToast('لم يتم العثور على النص الأصلي', 'error'); |
| } |
| } |
| |
| |
| |
| |
| function updateSummaryLength() { |
| |
| } |
| |
| let _summaryInput = ''; |
| let _summaryResult = ''; |
| |
| async function generateSummary(event) { |
| var customInput = document.getElementById('summary-custom-input'); |
| let text = customInput ? customInput.value.trim() : ''; |
| |
| if (!text) { |
| const summaryText = document.getElementById('summary-text'); |
| summaryText.innerHTML = '<p class="text-secondary text-center">الرجاء كتابة أو لصق نص في مربع الإدخال أولاً</p>'; |
| document.getElementById('summary-preview').classList.add('show'); |
| return; |
| } |
| _summaryInput = text; |
| |
| const lengthValue = document.getElementById('summary-length').value; |
| const isFullText = false; |
| const generateButton = event ? event.target : document.getElementById('generate-summary-btn'); |
| const summaryText = document.getElementById('summary-text'); |
| const summaryPreview = document.getElementById('summary-preview'); |
| |
| |
| const originalButtonText = generateButton.textContent; |
| generateButton.textContent = 'جاري التوليد...'; |
| generateButton.disabled = true; |
| summaryText.innerHTML = '<div class="summary-loading"><span class="summary-loading__spinner" aria-hidden="true"></span><p class="summary-loading__text">جاري توليد الملخص...</p></div>'; |
| summaryPreview.classList.add('show'); |
| |
| |
| |
| try { |
| |
| const response = await fetch('/api/summarize', { |
| method: 'POST', |
| headers: { |
| 'Content-Type': 'application/json', |
| }, |
| body: JSON.stringify({ |
| text: text, |
| length: parseInt(lengthValue), |
| full_text: isFullText |
| }) |
| }); |
| |
| const data = await response.json(); |
| |
| if (!response.ok) { |
| throw new Error(data.error || 'حدث خطأ أثناء توليد الملخص'); |
| } |
| |
| if (data.status === 'success' && data.summary) { |
| let summaryContent = data.summary; |
| |
| |
| if (window._summaryMode === 'bullets') { |
| const sentences = summaryContent.split(/[.،؛]\s*/).filter(s => s.trim().length > 2); |
| const ul = document.createElement('ul'); |
| ul.style.cssText = 'list-style: disc; padding-right: 1.5rem; direction: rtl; text-align: right;'; |
| sentences.forEach(s => { |
| const li = document.createElement('li'); |
| li.textContent = s.trim(); |
| li.style.marginBottom = '8px'; |
| ul.appendChild(li); |
| }); |
| summaryText.textContent = ''; |
| summaryText.appendChild(ul); |
| } else { |
| const p = document.createElement('p'); |
| p.textContent = summaryContent; |
| summaryText.textContent = ''; |
| summaryText.appendChild(p); |
| } |
| |
| |
| if (typeof updateSummaryStats === 'function') { |
| updateSummaryStats(summaryContent); |
| } |
| _summaryResult = summaryContent; |
| var applyBtn = document.getElementById('summary-apply-btn'); |
| if (applyBtn) applyBtn.style.display = ''; |
| } else { |
| throw new Error(data.error || 'لم يتم توليد ملخص'); |
| } |
| |
| } catch (error) { |
| console.error('Error generating summary:', error); |
| const safeMsg = typeof escapeHtml === 'function' |
| ? escapeHtml(error.message || 'تعذر توليد الملخص. يرجى المحاولة مرة أخرى.') |
| : String(error.message || 'تعذر توليد الملخص. يرجى المحاولة مرة أخرى.'); |
| summaryText.innerHTML = ` |
| <div class="summary-loading"> |
| <p class="summary-error">⚠️ حدث خطأ</p> |
| <p class="text-secondary text-caption">${safeMsg}</p> |
| <p class="text-muted text-label mt-2">تأكد من أن الخادم يعمل وأن النموذج محمّل بشكل صحيح.</p> |
| </div> |
| `; |
| } finally { |
| |
| generateButton.textContent = originalButtonText; |
| generateButton.disabled = false; |
| } |
| } |
| |
| function copySummary() { |
| const text = document.getElementById('summary-text').innerText; |
| navigator.clipboard.writeText(text).then(() => { |
| const btn = document.querySelector('[onclick="copySummary()"]'); |
| if (btn) { |
| const originalText = btn.textContent; |
| btn.textContent = 'تم النسخ!'; |
| if (typeof showToast === 'function') showToast('✓ تم نسخ الملخص'); |
| setTimeout(() => btn.textContent = originalText, 2000); |
| } |
| }).catch(() => { |
| |
| const ta = document.createElement('textarea'); |
| ta.value = text; |
| document.body.appendChild(ta); |
| ta.select(); |
| document.execCommand('copy'); |
| document.body.removeChild(ta); |
| }); |
| } |
| |
| function applySummaryToEditor() { |
| if (!_summaryResult) return; |
| var editor = document.getElementById('editor-container'); |
| if (!editor) return; |
| if (typeof pushUndoState === 'function') pushUndoState(); |
| var esc = function(t) { return t.replace(/&/g,'&').replace(/</g,'<').replace(/>/g,'>'); }; |
| |
| if (_summaryInput) { |
| var plain = editor.textContent || ''; |
| var idx = plain.indexOf(_summaryInput); |
| if (idx !== -1) { |
| var before = plain.substring(0, idx); |
| var after = plain.substring(idx + _summaryInput.length); |
| editor.innerHTML = esc(before) + esc(_summaryResult) + esc(after); |
| editor.focus(); |
| editor.dispatchEvent(new Event('input', { bubbles: true })); |
| switchTab('write'); |
| if (typeof showToast === 'function') showToast('✓ تم استبدال النص بالملخص'); |
| return; |
| } |
| } |
| |
| var existing = editor.innerHTML; |
| editor.innerHTML = existing + (existing ? '<br>' : '') + esc(_summaryResult); |
| editor.dispatchEvent(new Event('input', { bubbles: true })); |
| switchTab('write'); |
| if (typeof showToast === 'function') showToast('✓ تم إضافة الملخص في المحرر'); |
| } |
| |
| function exportSummaryAsTxt() { |
| exportSummaryAs('txt'); |
| } |
| |
| function getSummaryText() { |
| return (document.getElementById('summary-text')?.innerText || '').trim(); |
| } |
| |
| async function exportSummaryAs(format) { |
| const text = getSummaryText(); |
| if (!text) { |
| if (typeof showToast === 'function') showToast('لا يوجد ملخص للتصدير', 'error'); |
| return; |
| } |
| |
| if (format === 'txt') { |
| const blob = new Blob([text], { type: 'text/plain;charset=utf-8' }); |
| const url = URL.createObjectURL(blob); |
| const a = document.createElement('a'); |
| a.href = url; |
| a.download = 'ملخص-بيان.txt'; |
| document.body.appendChild(a); |
| a.click(); |
| document.body.removeChild(a); |
| URL.revokeObjectURL(url); |
| if (typeof showToast === 'function') showToast('✓ تم تصدير الملخص'); |
| } else if (format === 'docx') { |
| if (typeof docx === 'undefined') { |
| if (typeof showToast === 'function') showToast('مكتبة Word غير محمّلة', 'error'); |
| return; |
| } |
| try { |
| const paragraphs = text.split(/\n+/).filter(p => p.trim()); |
| const children = paragraphs.map(block => |
| new docx.Paragraph({ |
| bidirectional: true, |
| alignment: docx.AlignmentType.RIGHT, |
| children: [new docx.TextRun({ text: block, rightToLeft: true, font: 'Arial' })] |
| }) |
| ); |
| const doc = new docx.Document({ sections: [{ properties: { rightToLeft: true }, children }] }); |
| const blob = await docx.Packer.toBlob(doc); |
| const url = URL.createObjectURL(blob); |
| const a = document.createElement('a'); |
| a.href = url; |
| a.download = 'ملخص-بيان.docx'; |
| document.body.appendChild(a); |
| a.click(); |
| document.body.removeChild(a); |
| URL.revokeObjectURL(url); |
| if (typeof showToast === 'function') showToast('✓ تم تصدير الملخص كـ Word'); |
| } catch (err) { |
| console.error('Summary DOCX export error:', err); |
| if (typeof showToast === 'function') showToast('تعذر تصدير ملف Word', 'error'); |
| } |
| } else if (format === 'pdf') { |
| if (typeof html2pdf === 'undefined') { |
| if (typeof showToast === 'function') showToast('مكتبة PDF غير محمّلة', 'error'); |
| return; |
| } |
| try { |
| if (typeof showToast === 'function') showToast('جاري تصدير PDF...'); |
| const html = buildPdfHtmlString(text); |
| await html2pdf().set({ |
| margin: [15, 15, 15, 15], |
| filename: 'ملخص-بيان.pdf', |
| image: { type: 'jpeg', quality: 0.95 }, |
| html2canvas: { scale: 1.5, useCORS: true, backgroundColor: '#ffffff', logging: false, foreignObjectRendering: false }, |
| jsPDF: { unit: 'mm', format: 'a4', orientation: 'portrait' } |
| }).from(html, 'string').save(); |
| if (typeof showToast === 'function') showToast('✓ تم تصدير الملخص كـ PDF'); |
| } catch (err) { |
| console.error('Summary PDF export error:', err); |
| if (typeof showToast === 'function') showToast('تعذر تصدير PDF', 'error'); |
| } |
| } |
| |
| |
| const menu = document.getElementById('summary-export-menu'); |
| if (menu) menu.classList.remove('show'); |
| } |
| |
| |
| function showAutoSaveStatus(msg) { |
| const el = document.getElementById('auto-save-status'); |
| if (!el) return; |
| el.textContent = msg; |
| el.style.opacity = '1'; |
| clearTimeout(el._timer); |
| el._timer = setTimeout(() => { el.style.opacity = '0'; }, 3000); |
| } |
| |
| |
| function setWordGoalUI() { |
| const current = localStorage.getItem('bayan_word_goal') || '0'; |
| const input = prompt('حدد هدف عدد الكلمات (أدخل ٠ لإلغاء الهدف):', current); |
| if (input === null) return; |
| const goal = parseInt(input, 10); |
| if (isNaN(goal) || goal < 0) return; |
| localStorage.setItem('bayan_word_goal', String(goal)); |
| if (typeof updateEditorStats === 'function') updateEditorStats(); |
| if (goal > 0) { |
| if (typeof showToast === 'function') showToast('✓ تم تحديد الهدف: ' + goal + ' كلمة'); |
| } else { |
| if (typeof showToast === 'function') showToast('تم إلغاء هدف الكلمات'); |
| const el = document.getElementById('word-goal-indicator'); |
| if (el) el.style.display = 'none'; |
| } |
| } |
| |
| |
| async function onConfigChange(cfg) { |
| config = { ...defaultConfig, ...cfg }; |
| |
| |
| const primary = config.primary_color || defaultConfig.primary_color; |
| const secondary = config.secondary_color || defaultConfig.secondary_color; |
| document.documentElement.style.setProperty('--color-primary', primary); |
| document.documentElement.style.setProperty('--color-secondary', secondary); |
| document.documentElement.style.setProperty('--primary-color', primary); |
| document.documentElement.style.setProperty('--secondary-color', secondary); |
| |
| const brandName = config.brand_name || defaultConfig.brand_name; |
| const navBrand = document.getElementById('nav-brand'); |
| const footerBrand = document.getElementById('footer-brand'); |
| if (navBrand) navBrand.textContent = brandName; |
| if (footerBrand) footerBrand.textContent = brandName; |
| |
| const heroHeadline = config.hero_headline || defaultConfig.hero_headline; |
| const headlineEl = document.getElementById('hero-headline'); |
| if (headlineEl) { |
| const parts = heroHeadline.split('\n'); |
| if (parts.length > 1) { |
| headlineEl.innerHTML = parts[0] + '<br/><span class="text-gradient">' + parts[1] + '</span>'; |
| } else { |
| headlineEl.innerHTML = heroHeadline.replace('بثقة واحتراف', '<span class="text-gradient">بثقة واحتراف</span>'); |
| } |
| } |
| |
| const heroSubheadline = document.getElementById('hero-subheadline'); |
| if (heroSubheadline) { |
| heroSubheadline.textContent = config.hero_subheadline || defaultConfig.hero_subheadline; |
| } |
| |
| const ctaPrimary = config.cta_primary || defaultConfig.cta_primary; |
| const navCta = document.getElementById('nav-cta'); |
| const heroCta = document.getElementById('hero-cta-primary'); |
| if (navCta) navCta.textContent = ctaPrimary; |
| if (heroCta) heroCta.textContent = ctaPrimary; |
| |
| const fontFamily = config.font_family || defaultConfig.font_family; |
| const fontSize = config.font_size || defaultConfig.font_size; |
| document.body.style.fontFamily = `${fontFamily}, 'Cairo', sans-serif`; |
| document.body.style.fontSize = `${fontSize}px`; |
| } |
| |
| function mapToCapabilities(cfg) { |
| return { |
| recolorables: [ |
| { |
| get: () => cfg.primary_color || defaultConfig.primary_color, |
| set: (value) => { cfg.primary_color = value; window.elementSdk.setConfig({ primary_color: value }); } |
| }, |
| { |
| get: () => cfg.secondary_color || defaultConfig.secondary_color, |
| set: (value) => { cfg.secondary_color = value; window.elementSdk.setConfig({ secondary_color: value }); } |
| } |
| ], |
| borderables: [], |
| fontEditable: { |
| get: () => cfg.font_family || defaultConfig.font_family, |
| set: (value) => { cfg.font_family = value; window.elementSdk.setConfig({ font_family: value }); } |
| }, |
| fontSizeable: { |
| get: () => cfg.font_size || defaultConfig.font_size, |
| set: (value) => { cfg.font_size = value; window.elementSdk.setConfig({ font_size: value }); } |
| } |
| }; |
| } |
| |
| function mapToEditPanelValues(cfg) { |
| return new Map([ |
| ['brand_name', cfg.brand_name || defaultConfig.brand_name], |
| ['hero_headline', cfg.hero_headline || defaultConfig.hero_headline], |
| ['hero_subheadline', cfg.hero_subheadline || defaultConfig.hero_subheadline], |
| ['cta_primary', cfg.cta_primary || defaultConfig.cta_primary] |
| ]); |
| } |
| |
| |
| if (window.elementSdk) { |
| window.elementSdk.init({ |
| defaultConfig, |
| onConfigChange, |
| mapToCapabilities, |
| mapToEditPanelValues |
| }); |
| } else { |
| onConfigChange(defaultConfig); |
| } |
| |
| document.addEventListener('DOMContentLoaded', async () => { |
| await initAuth(); |
| initTheme(); |
| initUI(); |
| initEditor(); |
| if (typeof initFormatToolbar === 'function') initFormatToolbar(); |
| if (typeof initDocSearch === 'function') initDocSearch(); |
| initDocuments(); |
| updateSuggestionsList([]); |
| |
| if (typeof SyncManager !== 'undefined') SyncManager.init(); |
| |
| |
| await initSettingsSync(); |
| initDocumentsCloud(); |
| initSummaries(); |
| |
| try { |
| const savedPage = sessionStorage.getItem('bayan_current_page'); |
| if (savedPage) { |
| showPage(savedPage); |
| } else if (window.location.hash === '#/editor') { |
| showPage('editor'); |
| } else { |
| showPage('home'); |
| } |
| } catch (e) { |
| if (window.location.hash === '#/editor') { |
| showPage('editor'); |
| } else { |
| showPage('home'); |
| } |
| } |
| }); |
| </script> |
| |
| <div id="quran-modal" class="quran-modal is-hidden" role="dialog" aria-label="نتيجة التدقيق القرآني" aria-modal="true"> |
| <div class="quran-modal-backdrop" onclick="closeQuranModal()"></div> |
| <div class="quran-modal-panel" dir="rtl"> |
| |
| <div class="flex items-center justify-between mb-4"> |
| <div class="flex items-center gap-2"> |
| <svg width="20" height="20" fill="none" stroke="#06b6d4" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253"/></svg> |
| <span class="text-lg font-bold">تدقيق النص القرآني</span> |
| </div> |
| <button onclick="closeQuranModal()" class="btn-ghost" style="font-size:18px;padding:4px 8px;" aria-label="إغلاق">✕</button> |
| </div> |
| |
| <div class="p-3 rounded-xl mb-4" style="background: rgba(255,255,255,0.04); border: 1px solid var(--color-border);"> |
| <span class="text-xs" style="color:var(--text-secondary);">📝 النص المحدد:</span> |
| <p id="quran-input-display" class="text-base mt-1" style="color:var(--color-text-primary);"></p> |
| </div> |
| |
| <div class="quran-result-card"> |
| <div class="flex items-center justify-between mb-3"> |
| <div class="text-sm font-bold" style="color:#06b6d4;">✓ النص القرآني المدقق</div> |
| <div class="flex items-center gap-2"> |
| <button id="quran-copy-btn" onclick="copyQuranResult()" class="quran-copy-btn is-hidden" type="button" title="نسخ النص المدقق">📋</button> |
| <button id="quran-apply-btn" onclick="applyQuranText()" class="quran-apply-btn is-hidden" type="button">تطبيق ✓</button> |
| </div> |
| </div> |
| <p id="quran-uthmani-text" class="quran-uthmani"></p> |
| <p id="quran-reference" class="quran-reference"></p> |
| </div> |
| |
| <div class="mt-4 pt-4" style="border-top:1px solid var(--color-border);"> |
| <div class="flex items-center gap-3 mb-3 flex-wrap"> |
| <svg width="16" height="16" fill="none" stroke="#06b6d4" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5h12M9 3v2m1.048 9.5A18.022 18.022 0 016.412 9m6.088 9h7M11 21l5-10 5 10M12.751 5C11.783 10.77 8.07 15.61 3 18.129"/></svg> |
| <span class="text-sm font-bold">ترجمة الآية</span> |
| <select id="quran-lang-select" onchange="translateQuranVerse()" class="quran-lang-select"> |
| <option value="">— اختر لغة —</option> |
| <option value="english">🇬🇧 English</option> |
| <option value="french">🇫🇷 Français</option> |
| <option value="turkish">🇹🇷 Türkçe</option> |
| <option value="persian">🇮🇷 فارسی</option> |
| <option value="russian">🇷🇺 Русский</option> |
| <option value="spanish">🇪🇸 Español</option> |
| <option value="german">🇩🇪 Deutsch</option> |
| <option value="indonesian">🇮🇩 Indonesia</option> |
| <option value="malay">🇲🇾 Melayu</option> |
| <option value="bengali">🇧🇩 বাংলা</option> |
| <option value="bosnian">🇧🇦 Bosanski</option> |
| <option value="portuguese">🇵🇹 Português</option> |
| <option value="uzbek">🇺🇿 O'zbek</option> |
| </select> |
| </div> |
| <div id="quran-translation-result" class="is-hidden p-4 rounded-xl" style="background:rgba(6,182,212,0.06); border:1px solid rgba(6,182,212,0.15);"> |
| <p id="quran-translation-text" style="font-size:20px; line-height:2; color:var(--color-text-primary); text-align:center;"></p> |
| <p id="quran-translation-ref" class="quran-reference" style="display:none;"></p> |
| <div class="flex items-center justify-center gap-2 mt-3"> |
| <button id="quran-copy-trans-btn" onclick="copyQuranTranslation()" class="quran-copy-btn is-hidden" type="button" title="نسخ الترجمة">📋</button> |
| <button id="quran-apply-trans-btn" onclick="applyQuranTranslation()" class="quran-apply-btn is-hidden" type="button">تطبيق الترجمة ✓</button> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| |
| <div id="selection-toolbar" class="selection-toolbar is-hidden" role="toolbar" aria-label="أدوات النص المحدد"> |
| <button type="button" class="sel-tool-btn" onclick="selectionToolAction('summarize')" title="تلخيص النص المحدد"> |
| <svg width="14" height="14" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/></svg> |
| تلخيص |
| </button> |
| <span class="sel-tool-sep"></span> |
| <button type="button" class="sel-tool-btn" onclick="selectionToolAction('dialect')" title="تحويل النص المحدد للفصحى"> |
| <svg width="14" height="14" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5h12M9 3v2m1.048 9.5A18.022 18.022 0 016.412 9m6.088 9h7M11 21l5-10 5 10M12.751 5C11.783 10.77 8.07 15.61 3 18.129"/></svg> |
| فصحى |
| </button> |
| <span class="sel-tool-sep"></span> |
| <button type="button" class="sel-tool-btn" onclick="selectionToolAction('quran')" title="تدقيق النص القرآني المحدد"> |
| <svg width="14" height="14" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253"/></svg> |
| تدقيق قرآني |
| </button> |
| </div> |
| </body> |
| </html> |
|
|
