Spaces:
Sleeping
Sleeping
File size: 10,681 Bytes
168fa52 a628887 168fa52 53bdec8 a628887 16713ac a628887 e8ddb95 53bdec8 e8ddb95 53bdec8 e8ddb95 53bdec8 e8ddb95 a628887 e8ddb95 53bdec8 e8ddb95 a628887 e8ddb95 a628887 e8ddb95 a628887 e8ddb95 53bdec8 a628887 e8ddb95 53bdec8 e8ddb95 53bdec8 e8ddb95 53bdec8 e8ddb95 a628887 53bdec8 e8ddb95 a628887 e8ddb95 a628887 e8ddb95 a628887 e8ddb95 a628887 e8ddb95 a628887 e8ddb95 a628887 16713ac e8ddb95 a628887 e8ddb95 a628887 e8ddb95 a628887 e8ddb95 168fa52 53bdec8 16713ac c4c877b e8ddb95 c4c877b e8ddb95 168fa52 e8ddb95 53bdec8 a628887 e8ddb95 a628887 16713ac 168fa52 16713ac e8ddb95 a628887 e8ddb95 168fa52 e8ddb95 a628887 e8ddb95 a628887 16713ac e8ddb95 168fa52 a628887 16713ac c4c877b 168fa52 e8ddb95 c4c877b a628887 168fa52 b9995e7 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 |
<!DOCTYPE html>
<html lang="fa" dir="rtl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>خاطره خوان پهلوی (نسخه آزمایشی)</title> <link href="./fonts/vazirmatn.css" rel="stylesheet" type="text/css"/>
<link rel="stylesheet" href="style.css">
<style>
/* این بلوک استایل می تواند حذف شود اگر تمام استایل ها به style.css منتقل شده اند */
body {
font-family: 'Vazirmatn', sans-serif; /* استفاده از فونت وزیرمتن */
line-height: 1.6; /* فاصله خطوط */
margin: 0;
padding: 20px;
background-color: #f4f4f4; /* رنگ پس زمینه ملایم */
color: #333; /* رنگ متن اصلی */
direction: rtl; /* جهت متن راست به چپ */
text-align: right; /* تراز متن به راست */
}
.container {
max-width: 800px; /* حداکثر عرض کانتینر */
margin: 20px auto; /* فاصله از بالا و پایین و مرکز افقی */
background-color: #fff; /* رنگ پس زمینه کانتینر */
padding: 30px; /* پدینگ داخلی */
border-radius: 10px; /* گوشه های گرد */
box-shadow: 0 0 15px rgba(0, 0, 0, 0.1); /* سایه ملایم */
}
/* استایل های بخش ها */
.book-selection, .search-area, .results-per-page, .similarity-threshold-control {
margin-bottom: 20px;
padding: 15px;
background-color: #e9e9e9; /* رنگ پس زمینه ملایم برای بخش ها */
border-radius: 8px; /* گوشه های گرد بخش ها */
border: 1px solid #ddd; /* حاشیه بخش ها */
}
.book-selection label {
margin-left: 10px; /* فاصله بین لیبل و چک باکس در RTL */
}
.search-area input[type="text"] {
width: calc(100% - 100px); /* عرض کادر ورودی منهای دکمه و فاصله */
padding: 10px;
margin-left: 10px; /* فاصله بین کادر و دکمه در RTL */
border: 1px solid #ccc;
border-radius: 5px;
font-size: 1em;
font-family: 'Vazirmatn', sans-serif; /* اعمال فونت */
box-sizing: border-box; /* برای جلوگیری از سرریز شدن عرض */
direction: rtl; /* برای تایپ فارسی */
}
.search-area button {
padding: 10px 20px;
background-color: #5cb85c; /* رنگ سبز */
color: white;
border: none;
border-radius: 5px;
cursor: pointer;
font-size: 1em;
font-family: 'Vazirmatn', sans-serif; /* اعمال فونت */
transition: background-color 0.3s ease; /* انیمیشن تغییر رنگ */
}
.search-area button:hover:not(:disabled) {
background-color: #4cae4c; /* سبز تیره تر */
}
.search-area button:disabled {
background-color: #cccccc; /* خاکستری */
cursor: not-allowed; /* نشانگر عدم اجازه */
}
.results-per-page label { margin-left: 10px; }
.results-per-page select {
padding: 8px;
border-radius: 5px;
border: 1px solid #ccc;
font-family: 'Vazirmatn', sans-serif;
direction: rtl;
}
.similarity-threshold-control { text-align: center; }
.similarity-threshold-control label { margin-left: 10px; }
.similarity-threshold-control input[type="number"] {
padding: 8px;
border-radius: 5px;
border: 1px solid #ccc;
font-size: 1em;
width: 80px;
text-align: center;
font-family: 'Vazirmatn', sans-serif;
direction: ltr; /* برای نمایش عدد از چپ به راست */
}
.similarity-threshold-control p { margin-top: 5px; font-size: 0.8em; color: #555; }
/* استایل پیام های وضعیت و خطا (به style.css منتقل شود) */
.status-message, .error-message {
font-weight: bold;
margin-bottom: 15px;
text-align: center;
/* color و background-color توسط script در style.css مدیریت می شوند */
}
#searchResults { margin-top: 20px; }
#searchResults p:first-child { text-align: center; } /* پیام اولیه */
.result-item {
background-color: #f9f9f9;
border: 1px solid #eee;
border-radius: 8px;
padding: 15px;
margin-bottom: 15px;
box-shadow: 0 0 8px rgba(0, 0, 0, 0.05);
}
.result-item p { margin-bottom: 8px; word-wrap: break-word; }
.result-passage { font-size: 1em; color: #333; text-align: justify; }
.result-reference { font-size: 0.9em; color: #555; margin-top: 10px; word-wrap: break-word; }
.result-book-title { font-size: 0.85em; color: #777; font-style: italic; margin-top: 5px; word-wrap: break-word; }
.result-similarity {
font-size: 0.85em;
color: #007bff;
font-weight: bold;
float: right;
margin-right: 10px;
direction: ltr; /* برای نمایش عدد شباهت از چپ به راست */
}
.explanation-text {
margin-bottom: 20px; padding: 15px; background-color: #f9f9f9;
border: 1px solid #eee;
border-radius: 8px;
text-align: justify;
line-height: 1.6;
font-size: 0.95em;
color: #333;
}
.explanation-text p { margin-bottom: 10px; }
.explanation-text p:last-child { margin-bottom: 0; }
.explanation-text strong { font-weight: bold; color: #333; }
.app-footer {
margin-top: 40px; text-align: center; font-size: 0.9em; color: #555;
padding-top: 20px; border-top: 1px solid #eee;
}
.copy-button {
padding: 5px 10px; background-color: #007bff; color: white;
border: none; border-radius: 4px; cursor: pointer;
font-size: 0.85em; font-family: 'Vazirmatn', sans-serif;
transition: background-color 0.2s ease;
display: block; margin-top: 15px; width: fit-content;
margin-left: auto; margin-right: 0; /* راست چین کردن */
}
.copy-button:hover { background-color: #0056b3; }
.copy-button:active { background-color: #004085; }
</style>
</head>
<body>
<div class="container">
<h1>خاطره خوان پهلوی (نسخه آزمایشی)</h1> <div class="explanation-text">
<p>
<strong>خاطره‌خوان پهلوی چیه و به چه کار میاد؟</strong>
یه دستیار خوب برای بچه‌های <strong>جهاد تبیین</strong> که کمک می‌کنه راحت‌تر بین <strong>خاطرات مستند دوران پهلوی</strong> بگردن و مطلب به‌دردبخور پیدا کنن.
</p>
<p>
این ابزار، دنبال کلمه نمی‌گرده، دنبال <strong>معنا</strong> می‌گرده! یعنی شما مفهوم کلی رو وارد می‌کنی، اون می‌گرده ببینه کجاها حرفش زده شده.
</p>
<p>
فقط حواست باشه که جستجو توی همین <strong>مجموعه‌ی خاطرات</strong> انجام می‌شه، نه توی کل اینترنت.
</p>
<p>
اگه خیلی خاص بنویسی مثل "خودکار هویدا"، ممکنه چیزی گیرت نیاد! پس بهتره <strong>مفهومی‌تر</strong> بنویسی، مثلاً "وضع اقتصاد دوران پهلوی" یا "گرونی".
</p>
</div>
<div class="book-selection">
<h2>انتخاب کتاب(نسخه آزمایشی - فعلاً فقط کتاب جعبه سیاه)</h2> <div>
<input type="checkbox" id="select_all_books" checked>
<label for="select_all_books">انتخاب همه</label>
</div>
<div>
<input type="checkbox" class="book-checkbox" id="book_jabe_siah" value="jabe_siah.json" checked>
<label for="book_jabe_siah">جعبه سیاه (منتخب خاطرات اسدالله علم)</label>
</div>
</div>
<div class="search-area">
<h2>جستجو در خاطرات انتخاب شده</h2>
<input type="text" id="userQuestion" placeholder="عبارت مورد نظر برای جستجو را وارد کنید...">
<button id="searchButton" disabled>جستجو</button> </div>
<div class="similarity-threshold-control">
<label for="similarityThresholdInput">آستانه شباهت:</label>
<input type="number" id="similarityThresholdInput" value="0.15" min="0.0" max="1.0" step="0.01">
<p>نتایجی که امتیاز شباهت آنها بیشتر یا مساوی این مقدار باشد نمایش داده می‌شوند (بین 0 تا 1).</p>
</div>
<div class="results-per-page">
<label for="resultsPerPage">تعداد نتایج نمایش داده شده:</label>
<select id="resultsPerPage">
<option value="5">5</option>
<option value="10" selected>10</option> <option value="20">20</option>
<option value="50">50</option>
</select>
</div>
<p id="loadingStatus" class="status-message">
<span class="loading-spinner"></span> </p>
<p id="selectionError" class="error-message"></p> <div id="searchResults">
<p>در حال بارگذاری اطلاعات کتاب‌ها. لطفاً صبر کنید تا دکمه جستجو فعال شود...</p>
</div>
<footer class="app-footer">
<p>امتیاز این وب افزار متعلق به موسسه تخصصی تبلیغ سیدالشهداء علیه السلام است.</p>
</footer>
</div>
<script src="script.js"></script>
</body>
</html> |