تست: تفاوت میان نسخهها
ظاهر
بدون خلاصۀ ویرایش |
بدون خلاصۀ ویرایش |
||
خط ۱: | خط ۱: | ||
<!DOCTYPE html> | |||
<html lang="fa" dir="rtl"> | <html lang="fa" dir="rtl"> | ||
<head> | <head> | ||
خط ۴۸: | خط ۴۹: | ||
font-size: 16px; | font-size: 16px; | ||
box-sizing: border-box; | box-sizing: border-box; | ||
} | } | ||
button { | button { | ||
خط ۶۲: | خط ۵۸: | ||
cursor: pointer; | cursor: pointer; | ||
font-size: 16px; | font-size: 16px; | ||
margin: | margin-top: 10px; | ||
} | } | ||
button:hover { | button:hover { | ||
background-color: #0056b3; | background-color: #0056b3; | ||
} | } | ||
.iframe-container { | .iframe-container { | ||
خط ۹۶: | خط ۶۸: | ||
border-radius: 8px; | border-radius: 8px; | ||
overflow: hidden; | overflow: hidden; | ||
} | } | ||
iframe { | iframe { | ||
خط ۱۰۲: | خط ۷۳: | ||
height: 600px; | height: 600px; | ||
border: none; | border: none; | ||
} | } | ||
.help-text { | .help-text { | ||
خط ۱۱۱: | خط ۷۹: | ||
margin-top: 5px; | margin-top: 5px; | ||
} | } | ||
.admin- | .admin-section { | ||
background: #e8f5e8; | |||
background | border: 1px solid #28a745; | ||
border: 1px | |||
padding: 15px; | padding: 15px; | ||
border-radius: | border-radius: 6px; | ||
margin-top: | margin-top: 15px; | ||
} | } | ||
.admin- | .admin-title { | ||
color: # | color: #155724; | ||
font-weight: bold; | font-weight: bold; | ||
margin-bottom: 10px; | |||
margin-bottom | |||
} | } | ||
</style> | </style> | ||
خط ۱۴۰: | خط ۹۸: | ||
<div class="search-section"> | <div class="search-section"> | ||
<div class="form-group"> | <div class="form-group"> | ||
<label for="bookSelect">انتخاب کتاب | <label for="bookSelect">انتخاب کتاب:</label> | ||
<select id="bookSelect"> | <select id="bookSelect"> | ||
<option value="">-- لطفاً یک کتاب انتخاب کنید --</option> | <option value="">-- لطفاً یک کتاب انتخاب کنید --</option> | ||
</select> | </select> | ||
</div> | </div> | ||
< | <div class="admin-section"> | ||
<div class="admin-title">بخش مدیریت (برای افزودن کتاب جدید)</div> | |||
<div class="form-group"> | <div class="form-group"> | ||
<label for="bookSearch | <label for="bookSearch">نام کتاب جدید:</label> | ||
<input type="text" id="bookSearch" placeholder="نام کتاب جدید را وارد کنید..."> | <input type="text" id="bookSearch" placeholder="نام کتاب جدید را وارد کنید..."> | ||
<div class="help-text"> | <div class="help-text">برای افزودن کتاب جدید به لیست، نام آن را وارد کرده و Enter بزنید</div> | ||
</div> | </div> | ||
</div> | </div> | ||
</div> | </div> | ||
خط ۱۸۷: | خط ۱۱۷: | ||
<div class="iframe-container"> | <div class="iframe-container"> | ||
<iframe id="contentFrame" src="about:blank"></iframe> | <iframe id="contentFrame" src="about:blank"></iframe> | ||
</div> | </div> | ||
</div> | </div> | ||
خط ۲۰۱: | خط ۱۲۴: | ||
const bookSelect = document.getElementById('bookSelect'); | const bookSelect = document.getElementById('bookSelect'); | ||
const bookSearch = document.getElementById('bookSearch'); | const bookSearch = document.getElementById('bookSearch'); | ||
const contentFrame = document.getElementById('contentFrame'); | const contentFrame = document.getElementById('contentFrame'); | ||
const STORAGE_KEY = 'pediabible_books_list'; | |||
// | // بارگذاری لیست کتابها از localStorage | ||
function | function loadBooksList() { | ||
const | const savedBooks = localStorage.getItem(STORAGE_KEY); | ||
if (savedBooks) { | |||
const books = JSON.parse(savedBooks); | |||
books.forEach(book => { | |||
addBookToSelect(book); | |||
}); | |||
// اگر کتابی در لیست وجود دارد، اولین کتاب را نمایش بده | |||
if (books.length > 0) { | |||
bookSelect.value = books[0]; | |||
showBook(books[0]); | |||
} | |||
} | |||
} | } | ||
// | // ذخیره لیست کتابها در localStorage | ||
function | function saveBooksList() { | ||
const books = []; | |||
for (let i = 1; i < bookSelect.options.length; i++) { | |||
books.push(bookSelect.options[i].value); | |||
} | } | ||
localStorage.setItem(STORAGE_KEY, JSON.stringify(books)); | |||
} | } | ||
// | // اضافه کردن کتاب به لیست انتخاب | ||
function | function addBookToSelect(bookName) { | ||
// بررسی عدم تکراری بودن | |||
for (let i = 0; i < bookSelect.options.length; i++) { | |||
if (bookSelect.options[i].value === bookName) { | |||
return false; | |||
} | |||
} | |||
const option = document.createElement('option'); | |||
option.value = bookName; | |||
option.textContent = bookName; | |||
bookSelect.appendChild(option); | |||
return true; | |||
return | |||
} | } | ||
// | // نمایش کتاب در iframe | ||
function | function showBook(bookName) { | ||
if (! | if (!bookName) return; | ||
const encodedBookName = encodeURIComponent(bookName); | |||
const bookUrl = `https://www.pediabible.com/index.php/${encodedBookName}`; | |||
contentFrame.src = bookUrl; | |||
} | } | ||
// | // ایجاد کتاب جدید | ||
function createNewBook(bookName) { | |||
if ( | if (!bookName.trim()) { | ||
alert('لطفاً نام کتاب را وارد کنید'); | alert('لطفاً نام کتاب را وارد کنید'); | ||
return; | return; | ||
} | } | ||
// اضافه کردن به لیست | |||
if ( | if (addBookToSelect(bookName)) { | ||
bookSelect.value = | saveBooksList(); | ||
// نمایش کتاب جدید | |||
bookSelect.value = bookName; | |||
showBook(bookName); | |||
// پاک کردن فیلد جستجو | |||
bookSearch.value = ''; | |||
alert(`کتاب "${bookName}" به لیست اضافه شد`); | |||
} else { | } else { | ||
alert(`کتاب "${ | alert(`کتاب "${bookName}" قبلاً در لیست وجود دارد`); | ||
} | } | ||
} | } | ||
// رویدادها | |||
// | // وقتی کاربر از لیست کتابی انتخاب میکند | ||
bookSelect.addEventListener('change', function() { | |||
if (this.value) { | |||
showBook(this.value); | |||
} | } | ||
}); | }); | ||
// | // وقتی مدیر در فیلد جستجو Enter میزند | ||
bookSearch.addEventListener('keypress', function(e) { | |||
if (e.key === 'Enter') { | |||
createNewBook(this.value.trim()); | |||
} | } | ||
}); | }); | ||
// | // بارگذاری اولیه لیست کتابها | ||
loadBooksList(); | |||
}); | }); | ||
</script> | </script> | ||
</body> | </body> | ||
</html> | </html> |
نسخهٔ ۱۲ اکتبر ۲۰۲۵، ساعت ۱۷:۵۰
<!DOCTYPE html>
کتابخانه پدیا بایبل
بخش مدیریت (برای افزودن کتاب جدید)
برای افزودن کتاب جدید به لیست، نام آن را وارد کرده و Enter بزنید