Hugging Face's logo

Spaces:
AnesKAM
/
s
Running

App Files Community
AnesKAM commited on
Commit
4ad647c
·
verified ·
1 Parent(s): 72401eb

Update results.html

Browse files
Files changed (1) hide show
  1. results.html +46 -42
results.html CHANGED
@@ -3,101 +3,105 @@
3
  <head>
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>SurfGO - النتائج</title>
7
  <link href="https://fonts.googleapis.com/css2?family=Tajawal:wght@400;500;700&display=swap" rel="stylesheet">
8
  <style>
9
  :root { --primary: #4285f4; --bg: #ffffff; --text: #202124; --border: #ebebeb; --link: #1a0dab; }
10
  @media (prefers-color-scheme: dark) { :root { --bg: #202124; --text: #bdc1c6; --border: #3c4043; --link: #8ab4f8; } }
11
 
12
  body { font-family: 'Tajawal', sans-serif; background: var(--bg); color: var(--text); margin: 0; }
13
- header { background: var(--bg); padding: 15px 5%; border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: 20px; position: sticky; top: 0; z-index: 100; }
14
- .logo-s { font-size: 24px; font-weight: 800; color: var(--primary); text-decoration: none; }
15
- .top-search { flex-grow: 1; max-width: 600px; padding: 10px 20px; border-radius: 24px; border: 1px solid var(--border); background: var(--bg); color: var(--text); outline: none; font-family: 'Tajawal'; }
16
 
17
- .results-container { max-width: 700px; margin: 20px 5%; padding-right: 20px; }
18
- .stats { font-size: 13px; color: #70757a; margin-bottom: 20px; }
19
- .card { margin-bottom: 30px; }
20
- .card cite { font-style: normal; font-size: 13px; color: var(--text); display: block; margin-bottom: 4px; opacity: 0.8; }
21
- .card h3 { margin: 0; font-size: 19px; font-weight: 500; color: var(--link); }
22
- .card h3:hover { text-decoration: underline; cursor: pointer; }
23
- .card a { text-decoration: none; }
24
- .card p { margin: 5px 0 0; font-size: 14px; line-height: 1.5; }
25
 
26
- #loader { text-align: center; margin: 50px 0; font-weight: bold; color: var(--primary); }
27
- .error { display: none; padding: 20px; border-radius: 8px; background: #fff5f5; border: 1px solid #feb2b2; color: #c53030; }
 
28
  </style>
29
  </head>
30
  <body>
31
 
32
  <header>
33
- <a href="index.html" class="logo-s">SurfGO</a>
34
- <input type="text" id="q-box" class="top-search">
35
  </header>
36
 
37
- <div class="results-container">
38
  <div id="stats" class="stats"></div>
39
- <div id="loader">جاري البحث في سحابة OpenShift...</div>
40
  <div id="results-list"></div>
41
- <div id="error-box" class="error"></div>
42
  </div>
43
 
44
  <script>
45
- const GOOGLE_PROXY = "https://script.google.com/macros/s/AKfycbz1OegNUe1sOevQGt5OOA3SRTDJJ5Q_9_yonL7tHl5ry-7ySKqK4hCZ99lmtkav46KS/exec";
46
- const SEARXNG_API = "https://searxng-anesnt-dev.apps.rm1.0a51.p1.openshiftapps.com/search";
 
47
 
48
  const params = new URLSearchParams(window.location.search);
49
  const query = params.get('q');
50
 
51
  if (query) {
52
- document.getElementById('q-box').value = query;
53
- doSearch(query);
54
  }
55
 
56
- async function doSearch(q) {
57
  const list = document.getElementById('results-list');
58
  const loader = document.getElementById('loader');
59
- const error = document.getElementById('error-box');
 
60
 
61
- const target = `${SEARXNG_API}?q=${encodeURIComponent(q)}&format=json&language=ar`;
62
- const finalUrl = `${GOOGLE_PROXY}?url=${encodeURIComponent(target)}`;
 
63
 
64
  try {
65
- const resp = await fetch(finalUrl);
66
- const text = await resp.text();
67
 
68
- if (text.includes("<!DOCTYPE") || text.includes("google-signin")) {
69
- throw new Error("تحذير: جوجل يطلب تسجيل الدخول. يرجى التأكد من تفعيل خيار Anyone في إعدادات النشر.");
 
70
  }
71
 
72
  const data = JSON.parse(text);
73
  loader.style.display = 'none';
74
 
75
  if (!data.results || data.results.length === 0) {
76
- document.getElementById('stats').innerText = "لم يتم العثور على نتائج.";
77
  return;
78
  }
79
 
80
- document.getElementById('stats').innerText = `تم العثور على حوالي ${data.results.length} نتيجة`;
81
 
82
  data.results.forEach(res => {
83
  list.innerHTML += `
84
- <div class="card">
85
  <cite>${res.url}</cite>
86
  <a href="${res.url}" target="_blank"><h3>${res.title}</h3></a>
87
- <p>${res.content || 'لا يوجد وصف متاح.'}</p>
88
- </div>
89
- `;
90
  });
91
 
92
- } catch (err) {
93
  loader.style.display = 'none';
94
- error.style.display = 'block';
95
- error.innerHTML = `<b>فشل جلب البيانات:</b><br>${err.message}`;
96
- console.error(err);
97
  }
98
  }
99
 
100
- document.getElementById('q-box').addEventListener('keypress', (e) => {
 
101
  if (e.key === 'Enter') {
102
  window.location.href = `results.html?q=${encodeURIComponent(e.target.value)}`;
103
  }
 
3
  <head>
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>SurfGO - نتائج البحث</title>
7
  <link href="https://fonts.googleapis.com/css2?family=Tajawal:wght@400;500;700&display=swap" rel="stylesheet">
8
  <style>
9
  :root { --primary: #4285f4; --bg: #ffffff; --text: #202124; --border: #ebebeb; --link: #1a0dab; }
10
  @media (prefers-color-scheme: dark) { :root { --bg: #202124; --text: #bdc1c6; --border: #3c4043; --link: #8ab4f8; } }
11
 
12
  body { font-family: 'Tajawal', sans-serif; background: var(--bg); color: var(--text); margin: 0; }
13
+ header { background: var(--bg); padding: 12px 5%; border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: 20px; position: sticky; top: 0; z-index: 100; }
14
+ .logo { font-size: 24px; font-weight: 800; color: var(--primary); text-decoration: none; }
15
+ .search-input { flex-grow: 1; max-width: 600px; padding: 10px 20px; border-radius: 24px; border: 1px solid var(--border); background: var(--bg); color: var(--text); outline: none; font-family: 'Tajawal'; }
16
 
17
+ .container { max-width: 700px; margin: 20px auto; padding: 0 20px; }
18
+ .stats { font-size: 13px; color: gray; margin-bottom: 20px; }
19
+ .result-item { margin-bottom: 30px; animation: fadeIn 0.3s ease; }
20
+ .result-item cite { font-style: normal; font-size: 13px; color: #70757a; display: block; margin-bottom: 2px; }
21
+ .result-item h3 { margin: 0; font-size: 19px; font-weight: 500; }
22
+ .result-item a { color: var(--link); text-decoration: none; }
23
+ .result-item a:hover { text-decoration: underline; }
24
+ .result-item p { margin: 5px 0 0; font-size: 14px; line-height: 1.5; opacity: 0.9; }
25
 
26
+ #loader { text-align: center; margin: 50px 0; color: var(--primary); font-weight: bold; }
27
+ .error-msg { display: none; padding: 15px; background: #fff5f5; border: 1px solid #feb2b2; border-radius: 8px; color: #c53030; }
28
+ @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
29
  </style>
30
  </head>
31
  <body>
32
 
33
  <header>
34
+ <a href="index.html" class="logo">SurfGO</a>
35
+ <input type="text" id="top-search" class="search-input">
36
  </header>
37
 
38
+ <div class="container">
39
  <div id="stats" class="stats"></div>
40
+ <div id="loader">جاري جلب النتائج من باتنة...</div>
41
  <div id="results-list"></div>
42
+ <div id="error" class="error-msg"></div>
43
  </div>
44
 
45
  <script>
46
+ // الإعدادات
47
+ const PROXY_URL = "https://script.google.com/macros/s/AKfycbjeBvaYPii1RKJUM62us9AZndZORwS7yWoTKaWddW43FrIwyobcLj5AWO88TR-95ww/exec";
48
+ const API_BASE = "https://searxng-anesnt-dev.apps.rm1.0a51.p1.openshiftapps.com/search";
49
 
50
  const params = new URLSearchParams(window.location.search);
51
  const query = params.get('q');
52
 
53
  if (query) {
54
+ document.getElementById('top-search').value = query;
55
+ performSearch(query);
56
  }
57
 
58
+ async function performSearch(q) {
59
  const list = document.getElementById('results-list');
60
  const loader = document.getElementById('loader');
61
+ const errDiv = document.getElementById('error');
62
+ const stats = document.getElementById('stats');
63
 
64
+ // بناء الرابط
65
+ const target = `${API_BASE}?q=${encodeURIComponent(q)}&format=json&language=ar`;
66
+ const finalUrl = `${PROXY_URL}?url=${encodeURIComponent(target)}`;
67
 
68
  try {
69
+ const response = await fetch(finalUrl);
70
+ const text = await response.text();
71
 
72
+ // فحص إذا كان الرد HTML (يعني فشل البروكسي في الصلاحيات)
73
+ if (text.trim().startsWith("<")) {
74
+ throw new Error("تلقى الموقع رد HTML بدلاً من بيانات. يرجى مراجعة إعدادات Anyone في Google Script.");
75
  }
76
 
77
  const data = JSON.parse(text);
78
  loader.style.display = 'none';
79
 
80
  if (!data.results || data.results.length === 0) {
81
+ stats.innerText = "لم يتم العثور على نتائج لهذه الكلمة.";
82
  return;
83
  }
84
 
85
+ stats.innerText = `تم العثور على حوالي ${data.results.length} نتيجة لـ "${q}"`;
86
 
87
  data.results.forEach(res => {
88
  list.innerHTML += `
89
+ <div class="result-item">
90
  <cite>${res.url}</cite>
91
  <a href="${res.url}" target="_blank"><h3>${res.title}</h3></a>
92
+ <p>${res.content || 'وصف غير متوفر.'}</p>
93
+ </div>`;
 
94
  });
95
 
96
+ } catch (e) {
97
  loader.style.display = 'none';
98
+ errDiv.style.display = 'block';
99
+ errDiv.innerHTML = `<b>عذراً! حدث خطأ في الاتصال:</b><br>${e.message}`;
 
100
  }
101
  }
102
 
103
+ // السماح بالبحث بالضغط على Enter
104
+ document.getElementById('top-search').addEventListener('keypress', (e) => {
105
  if (e.key === 'Enter') {
106
  window.location.href = `results.html?q=${encodeURIComponent(e.target.value)}`;
107
  }