| <!DOCTYPE html> |
| <html lang="ar" dir="rtl"> |
|
|
| <head> |
| <meta charset="utf-8" /> |
| <meta name="viewport" content="width=device-width,initial-scale=1" /> |
| <title>توليد المحتوى المعزز — منصة محرك GEO</title> |
| <link href="https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700;800&display=swap" rel="stylesheet"> |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css"> |
| <link rel="stylesheet" href="/theme.css"> |
| <style> |
| .reveal{opacity:0;transform:translateY(20px);transition:all .6s cubic-bezier(.16,1,.3,1)} |
| .reveal.show{opacity:1;transform:translateY(0)} |
| |
| |
| .bg-mesh{position:fixed;inset:0;z-index:-2; |
| background:radial-gradient(circle at 10% 10%,rgba(59,130,246,.12) 0%,transparent 40%), |
| radial-gradient(circle at 90% 90%,rgba(251,191,36,.1) 0%,transparent 40%), |
| radial-gradient(circle at 50% 50%,rgba(239,68,68,.06) 0%,transparent 60%); |
| filter:blur(100px);animation:meshMove 20s infinite alternate ease-in-out} |
| @keyframes meshMove{0%{transform:scale(1) translate(0,0)}100%{transform:scale(1.1) translate(2%,2%)}} |
| .bg-grid{position:fixed;inset:0;z-index:-1; |
| background-image:linear-gradient(rgba(255,255,255,0.02) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,0.02) 1px,transparent 1px); |
| background-size:40px 40px;pointer-events:none} |
| |
| nav{position:sticky;top:0;z-index:1000;border-bottom:1px solid var(--border);background:rgba(7,31,33,.85);backdrop-filter:blur(32px);height:80px;display:flex;align-items:center} |
| .nav-inner{max-width:1200px;margin:0 auto;padding:0 32px;width:100%;display:flex;justify-content:space-between;align-items:center} |
| .nav-logo{display:flex;align-items:center;gap:12px;text-decoration:none} |
| .logo-box{width:44px;height:40px;position:relative} |
| .gear-motif i{position:absolute;font-size:18px;animation:gearSpin 10s linear infinite} |
| .gear-blue{top:0;left:50%;translate:-50% 0;color:var(--accent2)} |
| .gear-gold{bottom:2px;left:4px;color:var(--accent);font-size:14px!important;animation-delay:-3s!important} |
| .gear-red{bottom:2px;right:4px;color:var(--danger);font-size:14px!important;animation-delay:-6s!important} |
| @keyframes gearSpin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}} |
| .nav-links{display:flex;gap:28px} |
| .nav-link{color:var(--text-muted);text-decoration:none;font-weight:700;font-size:14px;transition:.3s;position:relative} |
| .nav-link:hover,.nav-link.active{color:#fff} |
| .nav-link.active::after{content:'';position:absolute;bottom:-10px;left:0;right:0;height:2px;background:var(--accent2);border-radius:2px} |
| .nav-user{display:flex;align-items:center;gap:16px} |
| .user-info{text-align:right} |
| .user-name{font-weight:900;color:#fff;font-size:14px} |
| .user-email{font-size:11px;color:var(--text-muted)} |
| .user-avatar{width:40px;height:40px;border-radius:12px;background:var(--accent-grad);display:flex;align-items:center;justify-content:center;font-weight:900;color:#000} |
| .wrap{max-width:1200px;margin:0 auto;padding:40px 24px} |
| .logout-btn{background:rgba(239,68,68,0.1);border:1px solid rgba(239,68,68,0.3);color:var(--red);padding:8px 24px;border-radius:100px;font-size:13px;font-weight:700;cursor:pointer;transition:0.3s} |
| .logout-btn:hover{background:var(--red);color:#fff} |
| |
| .header-card{background:linear-gradient(165deg,rgba(15,20,25,0.9),rgba(5,7,10,0.95));border:1px solid var(--border);border-radius:24px;padding:60px;text-align:center;margin-bottom:40px;position:relative;overflow:hidden;backdrop-filter:blur(20px)} |
| .header-cardHeader{display:inline-block;padding:6px 16px;border-radius:100px;background:rgba(0,212,255,0.1);border:1px solid rgba(0,212,255,0.2);color:var(--blue);font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:2px;margin-bottom:20px} |
| .header-title{font-size:56px;font-weight:900;margin-bottom:16px;background:var(--hero-grad);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;letter-spacing:-1.5px} |
| .header-subtitle{font-size:18px;color:var(--muted);max-width:700px;margin:0 auto 30px} |
| |
| .kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-bottom:40px} |
| .kpi-card{background:var(--glass);border:1px solid var(--border);border-radius:20px;padding:24px;text-align:center;transition:0.3s cubic-bezier(0.4,0,0.2,1)} |
| .kpi-card:hover{transform:translateY(-5px);border-color:var(--blue);box-shadow:0 10px 30px rgba(0,212,255,0.1)} |
| .kpi-val{font-size:32px;font-weight:900;margin-bottom:4px;font-family:'Teko',sans-serif;letter-spacing:1px;background:var(--accent-grad);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent} |
| .kpi-label{font-size:12px;color:var(--muted);font-weight:700;text-transform:uppercase} |
| |
| .tools-wrapper{display:grid;grid-template-columns:350px 1fr;gap:30px} |
| .sidebar-tabs{background:var(--glass);border:1px solid var(--border);border-radius:20px;padding:15px;height:fit-content;display:flex;flex-direction:column;gap:8px} |
| .tab-btn{display:flex;align-items:center;gap:15px;padding:16px 20px;border-radius:12px;background:transparent;border:none;color:var(--muted);font-family:'Cairo';font-weight:700;font-size:14px;cursor:pointer;transition:0.3s;text-align:right;width:100%} |
| .tab-btn:hover{background:rgba(255,255,255,0.05);color:#fff} |
| .tab-btn.active{background:var(--accent-grad);color:#000;box-shadow:0 4px 15px rgba(59,130,246,0.2)} |
| |
| .workspace-panel{background:var(--glass);border:1px solid var(--border);border-radius:20px;padding:40px;min-height:600px} |
| .form-title{font-size:24px;font-weight:800;color:#fff;margin-bottom:24px} |
| .form-group{margin-bottom:20px} |
| .form-label{display:block;font-size:12px;font-weight:800;color:var(--blue);margin-bottom:8px} |
| .input,.select,.textarea{width:100%;background:rgba(0,0,0,0.3);border:1px solid var(--border);border-radius:10px;padding:14px 18px;color:#fff;font-family:'Cairo'} |
| .btn-main{width:100%;height:56px;border-radius:100px;border:none;background:var(--accent-grad);color:#000;font-weight:900;cursor:pointer;transition:0.3s} |
| .btn-main:hover{transform:scale(1.05);box-shadow:0 15px 40px rgba(59,130,246,0.4)} |
| .btn-main:disabled{opacity:0.5;cursor:not-allowed} |
| |
| .result-viewer{margin-top:30px;padding:30px;background:rgba(0,0,0,0.4);border-radius:16px;border:1px solid var(--border)} |
| .hidden{display:none!important} |
| .progress-container{margin-top:20px;display:none} |
| .progress-track{height:6px;background:rgba(255,255,255,0.05);border-radius:10px;overflow:hidden} |
| .progress-fill{height:6px;width:0%;background:var(--accent-grad);transition:width 0.4s ease;border-radius:10px} |
| .badge{padding:4px 10px;border-radius:6px;font-size:11px;font-weight:800;background:rgba(59,130,246,0.1);color:var(--blue);border:1px solid rgba(59,130,246,0.2)} |
| |
| .research-status-bar{background:rgba(59,130,246,0.1);border:1px solid rgba(59,130,246,0.3);border-radius:12px;padding:12px 20px;margin-bottom:30px;display:flex;justify-content:space-between;align-items:center} |
| .status-pill{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:var(--blue)} |
| .status-dot{width:8px;height:8px;border-radius:50%;background:var(--emerald);box-shadow:0 0 10px var(--emerald);animation:pulse 2s infinite} |
| |
| @keyframes pulse{0%{opacity:1}50%{opacity:0.5}100%{opacity:1}} |
| @keyframes fadeIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}} |
| .animate{animation:fadeIn 0.6s ease-out forwards} |
| |
| .spinner{width:20px;height:20px;border:2px solid rgba(255,255,255,0.3);border-top-color:#fff;border-radius:50%;animation:spin 0.8s linear infinite;display:inline-block;vertical-align:middle;margin-right:8px} |
| @keyframes spin{to{transform:rotate(360deg)}} |
| .btn-loading{position:relative;pointer-events:none;opacity:0.8} |
| </style> |
| </head> |
|
|
| <body> |
| <div class="bg-mesh"></div> |
| <div class="bg-grid"></div> |
|
|
| <nav> |
| <div class="nav-inner"> |
| <a href="/portal.html" class="nav-logo"> |
| <div class="logo-box" style="width:40px;height:40px;display:grid;place-items:center;overflow:hidden;border-radius:10px;background:transparent"> |
| <img src="moharek-logo-v2.svg" alt="Moharek" style="width:100%;height:100%;object-fit:contain"> |
| </div> |
| <div> |
| <div style="font-size:15px;font-weight:900;color:#fff">محرك GEO</div> |
| <div style="font-size:10px;color:var(--text-muted);font-weight:500">CONTENT INTEL · AI</div> |
| </div> |
| </a> |
| <div class="nav-links"> |
| <a href="/portal.html" class="nav-link">لوحة التحكم</a> |
| <a href="/jobs.html" class="nav-link">المهام</a> |
| <a href="/search.html" class="nav-link">الذكاء</a> |
| <a href="/content_v2_enhanced.html" class="nav-link active">المحتوى</a> |
| <a href="/recommendations.html" class="nav-link">العروض</a> |
| </div> |
| <div class="nav-user"> |
| <div class="user-info"> |
| <div class="user-name" id="userNameNav">مستخدم</div> |
| <div class="user-email" id="userEmailNav">user@mohrek.com</div> |
| </div> |
| <div class="user-avatar" id="userAvatarNav">M</div> |
| <button class="logout-btn" onclick="logout()">خروج</button> |
| </div> |
| </div> |
| </nav> |
|
|
| <div class="wrap"> |
| <header class="header-card animate"> |
| <span class="header-cardHeader">CONTENT INTELLIGENCE v2.5 ENHANCED</span> |
| <h1 class="header-title">توليد المحتوى الذكي (المعزز)</h1> |
| <p class="header-subtitle">تم دمج هذا المحرر مباشرة مع بيانات التحليلات الأخيرة لتوفير سياق فائق الدقة |
| ومحتوى متوافق 100% مع هويتك.</p> |
|
|
| <div id="active-research-bar" class="research-status-bar hidden"> |
| <div class="status-pill"> |
| <div class="status-dot"></div> |
| <span id="research-org-name">جاري تحميل بيانات الموقع...</span> |
| </div> |
| <div style="font-size: 11px; color: var(--muted); cursor: pointer; text-decoration: underline" |
| onclick="refreshAuditData()">تحديث البيانات الأساسية <i class="fas fa-sync-alt"></i></div> |
| </div> |
|
|
| <div class="kpi-grid"> |
| <div class="kpi-card"> |
| <div class="kpi-icon" style="color:var(--accent2); font-size: 20px; margin-bottom: 10px"><i class="fas fa-files"></i></div> |
| <div class="kpi-val" id="pagesAnalyzedCount">0</div> |
| <div class="kpi-label">صفحات تم تحليلها</div> |
| </div> |
| <div class="kpi-card"> |
| <div class="kpi-icon" style="color:var(--accent2); font-size: 20px; margin-bottom: 10px"><i class="fas fa-code-merge"></i></div> |
| <div class="kpi-val" id="entitiesCountStat">0</div> |
| <div class="kpi-label">كيانات دلالية مستخرجة</div> |
| </div> |
| <div class="kpi-card"> |
| <div class="kpi-icon" style="color:var(--accent); font-size: 20px; margin-bottom: 10px"><i class="fas fa-ranking-star"></i></div> |
| <div class="kpi-val" id="visibilityScoreStat">--</div> |
| <div class="kpi-label">درجة الظهور الحالية</div> |
| </div> |
| <div class="kpi-card"> |
| <div class="kpi-icon" style="color:var(--accent); font-size: 20px; margin-bottom: 10px"><i class="fas fa-tags"></i></div> |
| <div class="kpi-val" id="kpi-industry">عام</div> |
| <div class="kpi-label">تصنيف المجال</div> |
| </div> |
| </div> |
| </header> |
|
|
| <div class="tools-wrapper animate" style="animation-delay:0.2s"> |
| <div class="sidebar-tabs"> |
| <button class="tab-btn active" data-tab="generate" onclick="switchTab('generate')"><i class="fas fa-pen-nib"></i> محرر المقالات (سياقي)</button> |
| <button class="tab-btn" data-tab="optimize" onclick="switchTab('optimize')"><i class="fas fa-bolt"></i> محسّن المحتوى (GEO)</button> |
| <button class="tab-btn" data-tab="faqs" onclick="switchTab('faqs')"><i class="fas fa-question-circle"></i> الأسئلة الشائعة (الأبحاث)</button> |
| <button class="tab-btn" data-tab="semantic" onclick="switchTab('semantic')"><i class="fas fa-network-wired"></i> التحليل الدلالي</button> |
| <button class="tab-btn" data-tab="identity" onclick="switchTab('identity')"><i class="fas fa-palette"></i> الهوية الذكية</button> |
| <button class="tab-btn" data-tab="schema" onclick="switchTab('schema')"><i class="fas fa-list-check"></i> البيانات المنظمة</button> |
| </div> |
|
|
| <main class="workspace-panel"> |
| <div id="tab-generate" class="tab-content"> |
| <h2 class="form-title">إنشاء مقالة مدعومة ببيانات التدقيق</h2> |
| <div class="form-group"> |
| <label class="form-label">الكلمة المفتاحية المستهدفة</label> |
| <input type="text" class="input" id="gen-keyword" placeholder="مثلاً: أفضل العبايات الخليجية"> |
| <div id="keyword-suggestions" style="margin-top:10px; display:flex; gap:10px; flex-wrap:wrap"> |
| </div> |
| </div> |
|
|
| <div class="form-group"> |
| <label class="form-label">خيار السياق</label> |
| <div style="display:flex; gap:15px"> |
| <label |
| style="font-size:12px; color:var(--muted); display:flex; align-items:center; gap:5px"> |
| <input type="checkbox" id="use-audit-context" checked> استخدام بيانات التدقيق الحالية |
| </label> |
| </div> |
| </div> |
|
|
| <div style="display:grid; grid-template-columns:1fr 1fr; gap:20px"> |
| <div class="form-group"> |
| <label class="form-label">اللغة</label> |
| <select class="select" id="gen-lang"> |
| <option value="ar">العربية</option> |
| <option value="en">English</option> |
| </select> |
| </div> |
| <div class="form-group"> |
| <label class="form-label">المحرك</label> |
| <select class="select" id="gen-backend"> |
| <option value="groq">Groq (Ultra Fast)</option> |
| <option value="openai">OpenAI (Pro)</option> |
| </select> |
| </div> |
| </div> |
| <button class="btn btn-primary" id="gen-btn" style="width:100%;height:56px;font-size:16px">إنتاج محتوى ذكي معزز بالسياق 🚀</button> |
|
|
| <div id="gen-progress" class="progress-container"> |
| <div class="progress-track"> |
| <div class="progress-fill" id="gen-progressBar"></div> |
| </div> |
| <div style="font-size:11px; margin-top:8px" id="gen-stageLabel">جارٍ تحليل البيانات الأساسية |
| ودمجها مع المحتوى...</div> |
| </div> |
|
|
| <div id="gen-result" class="result-viewer hidden"> |
| <div |
| style="display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:15px"> |
| <div id="gen-title" style="font-weight:900; font-size:24px; color:var(--blue);"></div> |
| <span class="badge" id="gen-method-badge">AI + Audit Data</span> |
| </div> |
| <div id="gen-content" style="line-height:1.9; font-size:16px;"></div> |
| </div> |
| </div> |
|
|
| <div id="tab-optimize" class="tab-content hidden"> |
| <h2 class="form-title">تحسين المحتوى (GEO Optimization)</h2> |
| <div class="form-group"> |
| <label class="form-label">المحتوى المراد تحسينه</label> |
| <textarea class="textarea" id="opt-content" rows="10" |
| placeholder="أدخل هنا المحتوى الذي تريد تحسينه ليناسب محركات GEO..."></textarea> |
| </div> |
| <div class="form-group"> |
| <label class="form-label">الكلمة المفتاحية</label> |
| <input type="text" class="input" id="opt-keyword"> |
| </div> |
| <button class="btn-main" id="opt-btn">تحسين الآن وفق معايير GEO <i class="fas fa-bolt"></i></button> |
| <div id="opt-result" class="result-viewer hidden"> |
| <div id="opt-score" |
| style="font-size:24px; font-weight:900; margin-bottom:15px; color: var(--emerald)"></div> |
| <div id="opt-content-out" style="line-height:1.9"></div> |
| </div> |
| </div> |
|
|
| <div id="tab-faqs" class="tab-content hidden"> |
| <h2 class="form-title">توليد الأسئلة الشائعة من بيانات التدقيق</h2> |
| <p style="font-size: 13px; color: var(--muted); margin-bottom: 20px;">سيقوم الذكاء الاصطناعي بتحليل |
| محتوى موقعك والبحث الحالي لتوليد الأسئلة الأكثر صلة.</p> |
| <div class="form-group"> |
| <label class="form-label">الموضوع (اختياري)</label> |
| <input type="text" class="input" id="faq-topic" placeholder="مثال: خدمات الشحن، الخامة والجودة"> |
| </div> |
| <button class="btn-main" id="faq-btn">توليد الأسئلة الشائعة <i class="fas fa-question-circle"></i></button> |
| <div id="faq-result" class="result-viewer hidden"> |
| <div id="faq-list"></div> |
| </div> |
| </div> |
|
|
| <div id="tab-semantic" class="tab-content hidden"> |
| <h2 class="form-title">التحليل الدلالي المعمق</h2> |
| <textarea class="textarea" id="sem-content" rows="8"></textarea> |
| <button class="btn-main" id="sem-btn" style="margin-top:20px">استخراج الكيانات <i class="fas fa-network-wired"></i></button> |
| <div id="sem-result" class="result-viewer hidden"> |
| <h4 style="margin-bottom:15px; font-size:14px">الكيانات المكتشفة:</h4> |
| <div id="sem-entities" style="display:flex; gap:10px; flex-wrap:wrap"></div> |
| </div> |
| </div> |
|
|
| <div id="tab-identity" class="tab-content hidden"> |
| <h2 class="form-title">استخراج هوية العلامة التجارية</h2> |
| <p style="color:var(--muted); margin-bottom:20px; font-size:14px">سيتم تحليل نبرة الصوت والمصطلحات |
| المستخدمة في موقعك لتحديد هويتك التسويقية.</p> |
| <button class="btn-main" id="identity-btn">تحليل الهوية من الموقع <i class="fas fa-palette"></i></button> |
| <div id="identity-result" class="result-viewer hidden"> |
| <div id="identity-hook" |
| style="font-size:18px; font-weight:700; color:var(--gold); margin-bottom:20px"></div> |
| <div id="identity-details" style="color:var(--muted); line-height:1.7"></div> |
| </div> |
| </div> |
|
|
| <div id="tab-schema" class="tab-content hidden"> |
| <h2 class="form-title">توليد البيانات المنظمة (Schema Library)</h2> |
| <div id="schema-status" style="margin-bottom:20px; color:var(--muted)">لا توجد بيانات Schema متاحة |
| حالياً. يرجى تشغيل التدقيق أولاً.</div> |
| <div id="schema-viewer" class="result-viewer hidden" |
| style="font-family:monospace; font-size:12px; direction:ltr; text-align:left; color:#a8ff60; overflow-x:auto"> |
| </div> |
| </div> |
| </main> |
| </div> |
| </div> |
|
|
| <script> |
| const token = localStorage.getItem('token'); |
| |
| |
| let auditData = null; |
| |
| |
| async function loadUserInfo() { |
| try { |
| const res = await fetch('http://localhost:8001/api/users/me', { |
| headers: { 'Authorization': `Bearer ${token}` } |
| }); |
| const data = await res.json(); |
| if (data.ok && data.user) { |
| document.getElementById('userNameNav').textContent = data.user.email.split('@')[0]; |
| document.getElementById('userEmailNav').textContent = data.user.email; |
| document.getElementById('userAvatarNav').textContent = data.user.email[0].toUpperCase(); |
| } |
| } catch (e) { console.error('Failed to load user info:', e); } |
| } |
| |
| |
| async function refreshAuditData() { |
| try { |
| const res = await fetch('http://localhost:8001/api/results', { |
| headers: { 'Authorization': `Bearer ${token}` } |
| }); |
| const data = await res.json(); |
| if (data.audit) { |
| auditData = data.audit; |
| |
| if (data.schema && !auditData.schema) { |
| auditData.schema = data.schema; |
| } |
| renderAuditContext(); |
| } |
| } catch (e) { |
| console.error('Failed to fetch audit data:', e); |
| } |
| } |
| |
| function setLoading(btnId, isLoading) { |
| const btn = document.getElementById(btnId); |
| if (!btn) return; |
| if (isLoading) { |
| btn.classList.add('btn-loading'); |
| btn.dataset.oldText = btn.innerHTML; |
| btn.innerHTML = `<span class="spinner"></span> جاري المعالجة...`; |
| } else { |
| btn.classList.remove('btn-loading'); |
| btn.innerHTML = btn.dataset.oldText || btn.innerHTML; |
| } |
| } |
| |
| function renderAuditContext() { |
| if (!auditData) return; |
| |
| const bar = document.getElementById('active-research-bar'); |
| bar.classList.remove('hidden'); |
| |
| if (auditData.pages && auditData.pages.length > 0) { |
| const firstPage = auditData.pages[0]; |
| const siteName = firstPage.title || firstPage.url; |
| const cleanName = siteName.split('–')[0].split('|')[0].trim(); |
| |
| document.getElementById('research-org-name').textContent = `متصل ببيانات: ${cleanName}`; |
| document.getElementById('pagesAnalyzedCount').textContent = auditData.pages.length; |
| |
| |
| if (!auditData.org_name) auditData.org_name = cleanName; |
| if (!auditData.org_url) auditData.org_url = firstPage.url; |
| if (!auditData.url) auditData.url = firstPage.url; |
| } |
| |
| |
| let entityCount = 0; |
| if (auditData.audits) { |
| auditData.audits.forEach(a => { |
| if (a.entities && a.entities.entities) entityCount += a.entities.entities.length; |
| }); |
| } |
| document.getElementById('entitiesCountStat').textContent = entityCount; |
| |
| |
| if (auditData.ai_visibility) { |
| if (auditData.ai_visibility.score) { |
| document.getElementById('visibilityScoreStat').textContent = `${auditData.ai_visibility.score}/100`; |
| } else if (auditData.ai_visibility.results && auditData.ai_visibility.results.some(r => r.error)) { |
| document.getElementById('visibilityScoreStat').textContent = "خطأ في البحث"; |
| } else { |
| document.getElementById('visibilityScoreStat').textContent = "قيد التحليل"; |
| } |
| } else { |
| document.getElementById('visibilityScoreStat').textContent = "غير متاح"; |
| } |
| |
| |
| if (auditData.industry) { |
| document.getElementById('kpi-industry').textContent = auditData.industry; |
| } else if (auditData.audits && auditData.audits[0]?.industry) { |
| document.getElementById('kpi-industry').textContent = auditData.audits[0].industry; |
| } else { |
| document.getElementById('kpi-industry').textContent = "موضة وعبيات"; |
| } |
| |
| |
| let allText = []; |
| let allHeadings = []; |
| if (auditData.pages) { |
| auditData.pages.slice(0, 8).forEach(p => { |
| if (p.paragraphs) allText.push(...p.paragraphs); |
| if (p.headings) allHeadings.push(...p.headings.map(h => h.text || h.text || h)); |
| }); |
| } |
| auditData.page_content = allText.join(' ').substring(0, 8000); |
| auditData.headings = [...new Set(allHeadings)].slice(0, 30); |
| |
| |
| document.getElementById('pagesAnalyzedCount').textContent = auditData.pages?.length || 0; |
| document.getElementById('entitiesCountStat').textContent = entityCount; |
| |
| |
| const suggestions = document.getElementById('keyword-suggestions'); |
| suggestions.innerHTML = ''; |
| |
| const keywords = []; |
| if (auditData.audits) { |
| auditData.audits.forEach(a => { |
| if (a.entities && a.entities.entities) { |
| a.entities.entities.slice(0, 5).forEach(e => { |
| if (!keywords.includes(e.text)) keywords.push(e.text); |
| }); |
| } |
| }); |
| } |
| |
| keywords.slice(0, 8).forEach(kw => { |
| const badge = document.createElement('span'); |
| badge.className = 'badge'; |
| badge.style.cursor = 'pointer'; |
| badge.textContent = kw; |
| badge.onclick = () => { |
| document.getElementById('gen-keyword').value = kw; |
| document.getElementById('opt-keyword').value = kw; |
| }; |
| suggestions.appendChild(badge); |
| }); |
| |
| |
| if (!document.getElementById('gen-keyword').value && keywords.length > 0) { |
| document.getElementById('gen-keyword').value = keywords[0]; |
| } |
| |
| if (auditData.schema || auditData.schema_json) { |
| const schemaContent = auditData.schema_json ? JSON.stringify(auditData.schema_json, null, 2) : auditData.schema; |
| |
| |
| const isMismatch = schemaContent.includes('mohrek.com') || (schemaContent.includes('"name": "moharek"') && !auditData.org_name.toLowerCase().includes('moharek')); |
| |
| if (isMismatch) { |
| document.getElementById('schema-status').textContent = "تم اكتشاف Schema قديمة (لموقع آخر). يرجى توليد كود جديد."; |
| document.getElementById('schema-viewer').classList.add('hidden'); |
| } else { |
| document.getElementById('schema-status').textContent = "تم استخراج بيانات Schema بنجاح من التدقيق الأخير."; |
| document.getElementById('schema-viewer').classList.remove('hidden'); |
| document.getElementById('schema-viewer').textContent = schemaContent; |
| } |
| } else { |
| document.getElementById('schema-status').textContent = "لا توجد بيانات Schema متاحة حالياً. يرجى تشغيل التدقيق أولاً."; |
| document.getElementById('schema-viewer').classList.add('hidden'); |
| } |
| } |
| |
| function switchTab(id) { |
| document.querySelectorAll('.tab-btn').forEach(b => b.classList.toggle('active', b.dataset.tab === id)); |
| document.querySelectorAll('.tab-content').forEach(c => c.classList.toggle('hidden', c.id !== 'tab-' + id)); |
| } |
| |
| function logout() { localStorage.removeItem('token'); window.location.href = '/'; } |
| |
| async function apiCall(path, body) { |
| try { |
| const lang = document.getElementById('gen-lang') ? document.getElementById('gen-lang').value : 'ar'; |
| const useAudit = document.getElementById('use-audit-context').checked; |
| const finalBody = { ...body, lang: lang }; |
| |
| if (useAudit && auditData) { |
| finalBody.crawl_data = auditData; |
| |
| if (!finalBody.target_site) { |
| finalBody.target_site = auditData.org_name || ""; |
| } |
| } |
| |
| const res = await fetch(path, { |
| method: 'POST', |
| headers: { 'Content-Type': 'application/json', 'Authorization': `Bearer ${token}` }, |
| body: JSON.stringify({ |
| ...finalBody, |
| api_keys: { |
| groq: localStorage.getItem('geo_groq_key'), |
| openai: localStorage.getItem('geo_openai_key') |
| } |
| }) |
| }); |
| return await res.json(); |
| } catch (e) { |
| return { ok: false, error: e.message }; |
| } |
| } |
| |
| |
| document.getElementById('gen-btn').onclick = async () => { |
| const btn = document.getElementById('gen-btn'); |
| const keyword = document.getElementById('gen-keyword').value.trim(); |
| if (!keyword) { alert('يرجى إدخال كلمة مفتاحية'); return; } |
| |
| setLoading('gen-btn', true); |
| document.getElementById('gen-progress').style.display = 'block'; |
| document.getElementById('gen-progressBar').style.width = '20%'; |
| |
| const data = await apiCall('/api/content/generate', { |
| keyword: keyword, |
| lang: document.getElementById('gen-lang').value, |
| prefer_backend: document.getElementById('gen-backend').value |
| }); |
| |
| document.getElementById('gen-progressBar').style.width = '100%'; |
| setTimeout(() => { |
| setLoading('gen-btn', false); |
| document.getElementById('gen-progress').style.display = 'none'; |
| if (data.ok && data.result) { |
| document.getElementById('gen-result').classList.remove('hidden'); |
| document.getElementById('gen-title').textContent = data.result.title || 'بدون عنوان'; |
| document.getElementById('gen-content').innerHTML = (data.result.content || '').replace(/\n/g, '<br>'); |
| } else { |
| alert('خطأ: ' + (data.error || 'فشل التوليد')); |
| } |
| }, 500); |
| }; |
| |
| |
| document.getElementById('opt-btn').onclick = async () => { |
| const content = document.getElementById('opt-content').value.trim(); |
| const keyword = document.getElementById('opt-keyword').value.trim(); |
| if (!content || !keyword) { alert('يرجى إدخال المحتوى والكلمة المفتاحية'); return; } |
| |
| setLoading('opt-btn', true); |
| const data = await apiCall('/api/content/optimize', { content: content, keyword: keyword }); |
| setLoading('opt-btn', false); |
| |
| if (data.ok && data.result) { |
| document.getElementById('opt-result').classList.remove('hidden'); |
| document.getElementById('opt-score').textContent = `درجة التحسين: %${data.result.score || '85'}`; |
| document.getElementById('opt-content-out').innerHTML = (data.result.optimized_content || '').replace(/\n/g, '<br>'); |
| } else { |
| alert('خطأ: ' + (data.error || 'فشل التحسين')); |
| } |
| }; |
| |
| |
| document.getElementById('faq-btn').onclick = async () => { |
| const topic = document.getElementById('faq-topic').value.trim() || "عام"; |
| setLoading('faq-btn', true); |
| const data = await apiCall('/api/content/faqs', { topic: topic }); |
| setLoading('faq-btn', false); |
| |
| if (data.ok && data.result && data.result.faqs) { |
| document.getElementById('faq-result').classList.remove('hidden'); |
| document.getElementById('faq-list').innerHTML = data.result.faqs |
| .map(f => `<div style="margin-bottom:20px; padding:15px; background:rgba(255,255,255,0.05); border-radius:10px; border-right: 4px solid var(--blue)"><b>س: ${f.question}</b><br><br>ج: ${f.answer}</div>`) |
| .join(''); |
| } else { alert('خطأ: ' + (data.error || 'فشل التوليد')); } |
| }; |
| |
| |
| document.getElementById('sem-btn').onclick = async () => { |
| const content = document.getElementById('sem-content').value.trim(); |
| if (!content) return; |
| setLoading('sem-btn', true); |
| const data = await apiCall('/api/content/semantic', { content: content }); |
| setLoading('sem-btn', false); |
| if (data.ok && data.result) { |
| document.getElementById('sem-result').classList.remove('hidden'); |
| const entities = data.result.entities || []; |
| document.getElementById('sem-entities').innerHTML = entities |
| .map(e => `<span class="badge" style="margin:5px">${e.text || e}</span>`) |
| .join(''); |
| } |
| }; |
| |
| |
| document.getElementById('identity-btn').onclick = async () => { |
| setLoading('identity-btn', true); |
| const data = await apiCall('/api/content/identity', {}); |
| setLoading('identity-btn', false); |
| if (data.ok && data.result) { |
| document.getElementById('identity-result').classList.remove('hidden'); |
| document.getElementById('identity-hook').textContent = data.result.brand_hook || "هوية مكتشفة"; |
| |
| let details = ` |
| <div style="margin-bottom:10px"><b>نبرة الصوت:</b> ${data.result.voice_tone || 'غير محدد'}</div> |
| <div style="margin-bottom:10px"><b>التموضع الأساسي:</b> ${data.result.entity_proposition || 'غير محدد'}</div> |
| <div style="margin-bottom:10px"><b>الأعمدة الرئيسية:</b> ${(data.result.pillars || []).join(' | ')}</div> |
| <div style="margin-bottom:10px"><b>التموضع الجغرافي:</b> ${data.result.geo_positioning || 'غير محدد'}</div> |
| <div style="margin-top:10px; padding:10px; border-top:1px solid var(--border); font-style:italic">"${data.result.suggested_bio || ''}"</div> |
| `; |
| document.getElementById('identity-details').innerHTML = details; |
| } |
| }; |
| |
| |
| window.addEventListener('load', () => { |
| loadUserInfo(); |
| refreshAuditData(); |
| |
| |
| const observerOptions = { threshold: 0.1, rootMargin: '0px 0px -50px 0px' }; |
| const observer = new IntersectionObserver((entries) => { |
| entries.forEach(entry => { |
| if (entry.isIntersecting) { |
| entry.target.classList.add('show'); |
| observer.unobserve(entry.target); |
| } |
| }); |
| }, observerOptions); |
| document.querySelectorAll('.reveal').forEach(el => observer.observe(el)); |
| }); |
| </script> |
| </body> |
|
|
| </html> |
