| <!DOCTYPE html> |
| <html lang="ar" dir="rtl"> |
| <head> |
| <meta charset="UTF-8"> |
| <meta name="viewport" content="width=400"> |
| <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=Cairo:wght@400;500;600;700&display=swap" rel="stylesheet"> |
| <title>بيان</title> |
| <link rel="stylesheet" href="shared/css/tokens.css"> |
| <link rel="stylesheet" href="popup.css"> |
| </head> |
| <body> |
| |
| |
| |
| <header class="bayan-header"> |
| <a href="https://bayan10-bayan-api.hf.space/" target="_blank" rel="noopener noreferrer" class="bayan-header-brand" style="text-decoration:none;color:inherit;"> |
| <img src="assets/icons/icon48.png" alt="بيان" width="28" height="28" style="border-radius:6px;"> |
| <div style="height:24px; width:2px; background-color:var(--color-border-strong, #d1d5db); border-radius:9999px; flex-shrink:0;"></div> |
| <span class="bayan-header-title">بيان</span> |
| </a> |
|
|
| <div style="display: flex; align-items: center; gap: 12px;"> |
| <button id="ext-theme-toggle" class="theme-toggle-animated" aria-label="تبديل السمة" type="button"> |
| <svg class="theme-icon-sun" width="18" height="18" 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="18" height="18" 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 class="bayan-header-status" id="status-indicator"> |
| <span class="bayan-status-dot"></span> |
| <span class="bayan-status-text" id="status-text">جاهز</span> |
| </div> |
| <button id="btn-close-popup" class="bayan-btn-icon" type="button" title="إغلاق" style="margin-right:4px;"> |
| <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="M6 18L18 6M6 6l12 12"/></svg> |
| </button> |
| </div> |
| </header> |
|
|
| |
| |
| |
| <nav class="bayan-tabs" role="tablist"> |
| <button class="bayan-tab active" role="tab" aria-selected="true" data-tab="correct" id="tab-correct"> |
| <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="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"/></svg> |
| تصحيح |
| </button> |
| <button class="bayan-tab" role="tab" aria-selected="false" data-tab="summarize" id="tab-summarize"> |
| <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 6h16M4 12h10M4 18h14"/></svg> |
| تلخيص |
| </button> |
| <button class="bayan-tab" role="tab" aria-selected="false" data-tab="dialect" id="tab-dialect"> |
| <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="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> |
| <button class="bayan-tab" role="tab" aria-selected="false" data-tab="quran" id="tab-quran"> |
| <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 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> |
| </nav> |
|
|
| |
| |
| |
| <section class="bayan-panel active" id="panel-correct" role="tabpanel"> |
| |
| <div class="bayan-input-group"> |
| <div class="bayan-label-row"> |
| <label class="bayan-label" for="input-text">أدخل النص العربي</label> |
| <button class="bayan-btn-icon" id="btn-copy-text" type="button" title="نسخ النص"> |
| <svg width="14" height="14" fill="none" stroke="currentColor" viewBox="0 0 24 24"><rect x="9" y="9" width="13" height="13" rx="2" stroke-width="2"/><path d="M5 15H4a2 2 0 01-2-2V4a2 2 0 012-2h9a2 2 0 012 2v1" stroke-width="2"/></svg> |
| </button> |
| </div> |
| <textarea |
| id="input-text" |
| class="bayan-textarea" |
| dir="rtl" |
| placeholder="الصق أو اكتب النص هنا..." |
| rows="5" |
| maxlength="5000" |
| ></textarea> |
| <div class="bayan-input-meta"> |
| <span id="char-count">٠</span> حرف |
| <span class="bayan-separator">|</span> |
| <span id="word-count">٠</span> كلمة |
| </div> |
| </div> |
|
|
| |
| <div class="bayan-actions"> |
| <button class="bayan-btn bayan-btn-primary" id="btn-correct" type="button"> |
| <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="M9 12l2 2 4-4"/></svg> |
| تحليل وتصحيح |
| </button> |
| <button class="bayan-btn bayan-btn-ghost" id="btn-clear" type="button">مسح</button> |
| </div> |
|
|
| |
| <div class="bayan-suggestions is-hidden" id="suggestions-section"> |
| <span class="bayan-suggestions-title">الاقتراحات</span> |
| <div class="bayan-suggestions-list" id="suggestions-list" role="list"></div> |
| <button class="bayan-apply-all-btn is-hidden" id="btn-apply-all" type="button">تطبيق الكل</button> |
| </div> |
|
|
| |
| <div class="bayan-score-section is-hidden" id="score-section"> |
| <span class="bayan-score-title">تقييم الكتابة</span> |
| <div class="bayan-score-ring"> |
| <svg viewBox="0 0 160 160" width="120" height="120"> |
| <defs> |
| <linearGradient id="scoreGradient" x1="0%" y1="0%" x2="100%" y2="0%"> |
| <stop offset="0%" stop-color="var(--color-primary, #6BA3E0)"/> |
| <stop offset="100%" stop-color="var(--color-secondary, #A594E8)"/> |
| </linearGradient> |
| </defs> |
| <circle cx="80" cy="80" r="70" fill="none" stroke="var(--color-border)" stroke-width="10"/> |
| <circle cx="80" cy="80" r="70" fill="none" stroke="url(#scoreGradient)" stroke-width="10" |
| stroke-dasharray="440" stroke-dashoffset="440" stroke-linecap="round" |
| transform="rotate(-90 80 80)" id="score-circle"/> |
| </svg> |
| <span class="bayan-score-value" id="score-value">--</span> |
| </div> |
| <span class="bayan-score-hint" id="score-hint">ابدأ الكتابة لرؤية تقييمك</span> |
| <div class="bayan-counts" id="error-counts"> |
| <span class="bayan-count bayan-count-spelling"><span id="count-spelling">٠</span> إملائي</span> |
| <span class="bayan-count bayan-count-grammar"><span id="count-grammar">٠</span> نحوي</span> |
| <span class="bayan-count bayan-count-punctuation"><span id="count-punctuation">٠</span> ترقيم</span> |
| </div> |
| </div> |
|
|
| |
| <div class="bayan-timing is-hidden" id="timing-section"> |
| <span id="timing-text"></span> |
| </div> |
| </section> |
|
|
| |
| |
| |
| <section class="bayan-panel" id="panel-summarize" role="tabpanel"> |
| |
| <div class="bayan-input-group"> |
| <label class="bayan-label" for="summary-input-text">أدخل النص للتلخيص</label> |
| <textarea |
| id="summary-input-text" |
| class="bayan-textarea" |
| dir="rtl" |
| placeholder="الصق النص المراد تلخيصه..." |
| rows="5" |
| maxlength="5000" |
| ></textarea> |
| <div class="bayan-input-meta-row"> |
| <span class="bayan-input-meta"><span id="summary-word-count-input">٠</span> كلمة</span> |
| <label class="bayan-import-btn" 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="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="bayan-sr-only" accept=".txt,.docx"> |
| </label> |
| </div> |
| </div> |
|
|
| |
| <div class="bayan-mode-toggle"> |
| <button type="button" class="bayan-mode-btn active" id="summary-mode-paragraph" data-mode="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="bayan-mode-btn" id="summary-mode-bullets" data-mode="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="bayan-length-selector"> |
| <label class="bayan-label">طول الملخص</label> |
| <div class="bayan-radio-group"> |
| <label class="bayan-radio"><input type="radio" name="summary-length" value="1"> قصير</label> |
| <label class="bayan-radio"><input type="radio" name="summary-length" value="2" checked> متوسط</label> |
| <label class="bayan-radio"><input type="radio" name="summary-length" value="3"> طويل</label> |
| </div> |
| </div> |
|
|
| |
| <div class="bayan-actions"> |
| <button class="bayan-btn bayan-btn-primary" id="btn-summarize" type="button"> |
| <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 6h16M4 12h10M4 18h14"/></svg> |
| تلخيص |
| </button> |
| </div> |
|
|
| |
| <div class="bayan-result is-hidden" id="summary-result-section"> |
| |
| <div class="bayan-summary-stats is-hidden" id="summary-stats"> |
| <div class="bayan-summary-stat"><span>كلمات الملخص:</span> <span class="bayan-summary-stat-value" id="summary-word-count">٠</span></div> |
| <div class="bayan-summary-stat"><span>نسبة الاختصار:</span> <span class="bayan-summary-stat-value" id="summary-compression">٠٪</span></div> |
| </div> |
| <div class="bayan-result-header"> |
| <span class="bayan-result-title">الملخص</span> |
| <div class="bayan-result-actions"> |
| <button class="bayan-btn-icon" id="btn-copy-summary" type="button" title="نسخ"> |
| <svg width="14" height="14" fill="none" stroke="currentColor" viewBox="0 0 24 24"><rect x="9" y="9" width="13" height="13" rx="2" stroke-width="2"/><path d="M5 15H4a2 2 0 01-2-2V4a2 2 0 012-2h9a2 2 0 012 2v1" stroke-width="2"/></svg> |
| </button> |
| <div class="bayan-export-dropdown" id="summary-export-wrap"> |
| <button class="bayan-btn-icon" id="btn-export-summary" type="button" 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="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1M12 4v12m0 0l-4-4m4 4l4-4"/></svg> |
| </button> |
| <div class="bayan-export-menu is-hidden" id="summary-export-menu"> |
| <button type="button" class="bayan-export-item" data-format="txt">نصي (.txt)</button> |
| <button type="button" class="bayan-export-item" data-format="docx">Word (.docx)</button> |
| <button type="button" class="bayan-export-item" data-format="pdf">PDF (.pdf)</button> |
| </div> |
| </div> |
| </div> |
| </div> |
| <div class="bayan-result-text" id="summary-text" dir="rtl"></div> |
| </div> |
| </section> |
|
|
| |
| |
| |
| <section class="bayan-panel" id="panel-dialect" role="tabpanel"> |
| <div class="bayan-input-group"> |
| <label class="bayan-label" for="dialect-input-text">تحويل اللهجات للفصحى</label> |
| <p class="bayan-description">اكتب نصًا بأي لهجة عربية (مصرية، خليجية، شامية...) وسنحوّله إلى لغة عربية فصحى سليمة.</p> |
| <textarea |
| id="dialect-input-text" |
| class="bayan-textarea" |
| dir="rtl" |
| placeholder="اكتب النص باللهجة هنا..." |
| rows="5" |
| maxlength="5000" |
| ></textarea> |
| <div class="bayan-input-meta"><span id="dialect-char-count">٠</span> حرف</div> |
| </div> |
| <div class="bayan-actions"> |
| <button class="bayan-btn bayan-btn-primary" id="btn-dialect" type="button"> |
| <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="M14 5l7 7m0 0l-7 7m7-7H3"/></svg> |
| تحويل للفصحى |
| </button> |
| </div> |
| <div class="bayan-result is-hidden" id="dialect-result-section"> |
| <div class="bayan-result-header"> |
| <span class="bayan-result-title" style="color: var(--color-primary, #6BA3E0);">✓ النص بالعربية الفصحى</span> |
| <button class="bayan-btn-icon" id="btn-copy-dialect" type="button" title="نسخ"> |
| <svg width="16" height="16" fill="none" stroke="currentColor" viewBox="0 0 24 24"><rect x="9" y="9" width="13" height="13" rx="2" stroke-width="2"/><path d="M5 15H4a2 2 0 01-2-2V4a2 2 0 012-2h9a2 2 0 012 2v1" stroke-width="2"/></svg> |
| </button> |
| </div> |
| <div class="bayan-result-text" id="dialect-text" dir="rtl"></div> |
| </div> |
| </section> |
|
|
| |
| |
| |
| <section class="bayan-panel" id="panel-quran" role="tabpanel"> |
| <div class="bayan-input-group"> |
| <label class="bayan-label" for="quran-input-text">تدقيق الآيات القرآنية</label> |
| <textarea |
| id="quran-input-text" |
| class="bayan-textarea" |
| dir="rtl" |
| placeholder="أدخل آية أو جزءاً منها..." |
| rows="5" |
| maxlength="2000" |
| ></textarea> |
| <div class="bayan-input-meta"><span id="quran-char-count">٠</span> حرف</div> |
| </div> |
| <div class="bayan-actions"> |
| <button class="bayan-btn bayan-btn-primary" id="btn-quran" type="button"> |
| <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="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"/></svg> |
| بحث وتدقيق |
| </button> |
| </div> |
|
|
| |
| <div class="bayan-quran-result is-hidden" id="quran-result-section"> |
| <div id="quran-match-list" class="bayan-quran-match-list"></div> |
| </div> |
| </section> |
|
|
| |
| |
| |
| <div class="bayan-loading is-hidden" id="loading-overlay"> |
| <div class="bayan-spinner"></div> |
| <span class="bayan-loading-text" id="loading-text">جارٍ التحليل...</span> |
| </div> |
|
|
| |
| |
| |
| <div class="bayan-toast" id="toast" role="status" aria-live="polite"></div> |
|
|
| |
| <script src="shared/vendor/mammoth.browser.min.js"></script> |
| <script src="shared/vendor/docx.umd.js"></script> |
| <script src="shared/vendor/html2pdf.bundle.min.js"></script> |
| |
| <script src="shared/constants.js"></script> |
| <script src="shared/config.js"></script> |
| <script src="shared/bayan-renderer.js"></script> |
| <script src="shared/bayan-ui.js"></script> |
| <script src="shared/bayan-patches.js"></script> |
| <script src="shared/bayan-api.js"></script> |
| <script src="popup.js"></script> |
| </body> |
| </html> |
|
|
