Spaces:

AnesKAM
/

s

Running

App Files Files Community

AnesKAM commited on 16 days ago

Commit

d8ed607

verified ·

1 Parent(s): 7840538

Update results.html

Browse files

Files changed (1) hide show

results.html +41 -36

results.html CHANGED Viewed

@@ -10,23 +10,21 @@
         @media (prefers-color-scheme: dark) { :root { --bg: #202124; --card: #202124; --text: #bdc1c6; --muted: #9aa0a6; --link: #8ab4f8; --border: #3c4043; } }
         body { font-family: 'Tajawal', sans-serif; background: var(--bg); color: var(--text); margin: 0; }
-        header { background: var(--card); padding: 15px 5%; border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: 20px; position: sticky; top: 0; z-index: 10; }
-        .logo-s { font-size: 24px; font-weight: 800; color: var(--primary); text-decoration: none; }
         .search-bar { flex-grow: 1; max-width: 600px; }
-        .search-bar input { width: 100%; padding: 10px 20px; border-radius: 24px; border: 1px solid var(--border); background: var(--bg); color: var(--text); outline: none; }
-        .container { max-width: 700px; margin: 20px 5% 20px auto; padding: 0 15px; }
-        .stats { font-size: 13px; color: var(--muted); margin-bottom: 20px; }
-        .result-item { margin-bottom: 28px; animation: fadeIn 0.5s ease; }
-        .result-item a { text-decoration: none; }
-        .result-item cite { font-style: normal; font-size: 14px; color: var(--text); display: block; margin-bottom: 4px; }
-        .result-item h3 { margin: 0; color: var(--link); font-weight: 400; font-size: 20px; }
-        .result-item h3:hover { text-decoration: underline; }
-        .result-item p { margin: 5px 0 0; line-height: 1.58; font-size: 14px; }
         #loader { text-align: center; margin-top: 50px; color: var(--muted); }
-        .error { display: none; background: #fff8f8; border: 1px solid #ffebeb; padding: 20px; border-radius: 8px; color: #d93025; }
-        @keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
     </style>
 </head>
 <body>
@@ -41,63 +39,70 @@
 </header>
 <div class="container">
-    <div id="stats" class="stats">جاري البحث...</div>
-    <div id="loader">يرجى الانتظار، جاري سحب النتائج...</div>
-    <div id="results"></div>
-    <div id="error" class="error">
-        <b>عذراً! حدث خطأ في جلب البيانات.</b><br>
-        تأكد أن سيرفر OpenShift قيد التشغيل وأن بروكسي جوجل يعمل.
-    </div>
 </div>
 <script>
     const params = new URLSearchParams(window.location.search);
     const query = params.get('q');
-    // --- إعداداتك الخاصة ---
-    const GOOGLE_PROXY_URL = "https://script.google.com/macros/s/AKfycbzeOZLfw61_OnwsyF9mOMGyeCULb73TbjHEIfpFJkP88rt9nfNit26DXvwabkP63nNW/exec";
     const SEARXNG_API = "https://searxng-anesnt-dev.apps.rm1.0a51.p1.openshiftapps.com/search";
     if (query) {
         document.getElementById('q-input').value = query;
-        performSearch(query);
     }
-    async function performSearch(q) {
-        const resultsDiv = document.getElementById('results');
         const loader = document.getElementById('loader');
-        const stats = document.getElementById('stats');
-        const target = `${SEARXNG_API}?q=${encodeURIComponent(q)}&format=json&language=ar`;
-        const finalUrl = `${GOOGLE_PROXY_URL}?url=${encodeURIComponent(target)}`;
         try {
             const response = await fetch(finalUrl);
-            const text = await response.text(); // نستلم نصاً لتجنب مشاكل جوجل
-            const data = JSON.parse(text); // نحوله لـ JSON
             loader.style.display = 'none';
             if (!data.results || data.results.length === 0) {
-                stats.innerText = "لم يتم العثور على نتائج.";
                 return;
             }
-            stats.innerText = `حوالي ${data.results.length} من النتائج لـ "${q}"`;
             data.results.forEach(item => {
-                resultsDiv.innerHTML += `
                     <div class="result-item">
                         <cite>${item.url}</cite>
                         <a href="${item.url}" target="_blank"><h3>${item.title}</h3></a>
-                        <p>${item.content || 'لا يوجد وصف متاح.'}</p>
                     </div>
                 `;
             });
         } catch (e) {
-            console.error(e);
             loader.style.display = 'none';
-            document.getElementById('error').style.display = 'block';
         }
     }
 </script>

         @media (prefers-color-scheme: dark) { :root { --bg: #202124; --card: #202124; --text: #bdc1c6; --muted: #9aa0a6; --link: #8ab4f8; --border: #3c4043; } }
         body { font-family: 'Tajawal', sans-serif; background: var(--bg); color: var(--text); margin: 0; }
+        header { background: var(--card); padding: 12px 5%; border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: 20px; position: sticky; top: 0; z-index: 10; }
+        .logo-s { font-size: 22px; font-weight: 800; color: var(--primary); text-decoration: none; }
         .search-bar { flex-grow: 1; max-width: 600px; }
+        .search-bar input { width: 100%; padding: 8px 20px; border-radius: 24px; border: 1px solid var(--border); background: var(--bg); color: var(--text); outline: none; font-family: 'Tajawal'; }
+        .container { max-width: 700px; margin: 20px auto; padding: 0 20px; }
+        #stats { font-size: 13px; color: var(--muted); margin-bottom: 20px; }
+        .result-item { margin-bottom: 25px; }
+        .result-item cite { font-style: normal; font-size: 13px; color: var(--muted); display: block; margin-bottom: 2px; overflow: hidden; text-overflow: ellipsis; }
+        .result-item h3 { margin: 0; color: var(--link); font-weight: 500; font-size: 19px; }
+        .result-item h3:hover { text-decoration: underline; cursor: pointer; }
+        .result-item p { margin: 4px 0 0; line-height: 1.5; font-size: 14px; color: var(--text); opacity: 0.9; }
         #loader { text-align: center; margin-top: 50px; color: var(--muted); }
+        .error-box { display: none; background: #fff5f5; border: 1px solid #feb2b2; padding: 15px; border-radius: 8px; color: #c53030; font-size: 14px; }
     </style>
 </head>
 <body>
 </header>
 <div class="container">
+    <div id="stats">جاري البحث...</div>
+    <div id="loader">جاري جلب النتائج من OpenShift...</div>
+    <div id="results-list"></div>
+    <div id="error" class="error-box"></div>
 </div>
 <script>
     const params = new URLSearchParams(window.location.search);
     const query = params.get('q');
+    // --- الإعدادات ---
+    const GOOGLE_PROXY = "https://script.google.com/macros/s/AKfycbxMgy-ecIdzeIWvbL_ASNzWBcQJODEGkJ5MZn3JCWR0IMTFC48JrAY6kxcyXT5KceFB/exec";
     const SEARXNG_API = "https://searxng-anesnt-dev.apps.rm1.0a51.p1.openshiftapps.com/search";
     if (query) {
         document.getElementById('q-input').value = query;
+        search(query);
     }
+    async function search(q) {
+        const list = document.getElementById('results-list');
         const loader = document.getElementById('loader');
+        const errDiv = document.getElementById('error');
+        // بناء رابط البحث الأصلي
+        const apiCall = `${SEARXNG_API}?q=${encodeURIComponent(q)}&format=json&language=ar`;
+        // إرساله عبر بروكسي جوجل
+        const finalUrl = `${GOOGLE_PROXY}?url=${encodeURIComponent(apiCall)}`;
         try {
             const response = await fetch(finalUrl);
+            const rawText = await response.text();
+            // فحص إذا كان الرد HTML (يعني خطأ من جوجل)
+            if (rawText.includes("<!DOCTYPE") || rawText.includes("<html")) {
+                throw new Error("جوجل أرجع صفحة ويب بدلاً من بيانات. تأكد من إعداد 'Anyone' في الـ Script.");
+            }
+            const data = JSON.parse(rawText);
             loader.style.display = 'none';
             if (!data.results || data.results.length === 0) {
+                document.getElementById('stats').innerText = "لم يتم العثور على نتائج.";
                 return;
             }
+            document.getElementById('stats').innerText = `تم العثور على ${data.results.length} نتيجة لـ "${q}"`;
             data.results.forEach(item => {
+                const itemHtml = `
                     <div class="result-item">
                         <cite>${item.url}</cite>
                         <a href="${item.url}" target="_blank"><h3>${item.title}</h3></a>
+                        <p>${item.content || 'لا يوجد وصف.'}</p>
                     </div>
                 `;
+                list.innerHTML += itemHtml;
             });
         } catch (e) {
             loader.style.display = 'none';
+            errDiv.style.display = 'block';
+            errDiv.innerHTML = `<b>فشل في عرض النتائج:</b><br>${e.message}`;
+            console.error(e);
         }
     }
 </script>