کتاب مقدس آنلاین: تفاوت میان نسخهها
ظاهر
بدون خلاصۀ ویرایش |
بدون خلاصۀ ویرایش |
||
خط ۱: | خط ۱: | ||
<html lang="fa" dir="rtl"> | <html lang="fa" dir="rtl"> | ||
<head> | <head> | ||
خط ۵: | خط ۴: | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
<title>کتاب مقدس - مطالعه آنلاین</title> | <title>کتاب مقدس - مطالعه آنلاین</title> | ||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> | |||
<style> | <style> | ||
:root { | :root { | ||
--primary-color: #2c3e50; | --primary-color: #2c3e50; | ||
--secondary-color: # | --secondary-color: #8B4513; | ||
--accent-color: # | --accent-color: #A52A2A; | ||
--light-color: # | --light-color: #f8f5f2; | ||
--dark-color: # | --dark-color: #3E2723; | ||
--font-family: ' | --border-color: #D2B48C; | ||
--font-family: 'Times New Roman', serif; | |||
} | } | ||
خط ۲۴: | خط ۲۴: | ||
body { | body { | ||
font-family: var(--font-family); | font-family: var(--font-family); | ||
background-color: # | background-color: #f5f1eb; | ||
color: var(--dark-color); | color: var(--dark-color); | ||
line-height: 1.6; | line-height: 1.6; | ||
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" opacity="0.05"><path fill="%238B4513" d="M20,20 L80,20 L80,80 L20,80 Z" stroke="%238B4513" stroke-width="2"/></svg>'); | |||
} | } | ||
خط ۳۲: | خط ۳۳: | ||
max-width: 1200px; | max-width: 1200px; | ||
margin: 0 auto; | margin: 0 auto; | ||
padding: | padding: 15px; | ||
} | } | ||
header { | header { | ||
text-align: center; | text-align: center; | ||
margin-bottom: | margin-bottom: 25px; | ||
padding: 20px 0; | padding: 20px 0; | ||
border-bottom: | border-bottom: 2px solid var(--border-color); | ||
background: linear-gradient(to bottom, #f9f6f2, #f0e6d6); | |||
border-radius: 8px; | |||
box-shadow: 0 4px 12px rgba(0,0,0,0.1); | |||
} | } | ||
خط ۴۵: | خط ۴۹: | ||
color: var(--primary-color); | color: var(--primary-color); | ||
margin-bottom: 10px; | margin-bottom: 10px; | ||
font-size: 2.2rem; | |||
text-shadow: 1px 1px 2px rgba(0,0,0,0.1); | |||
} | } | ||
.description { | .description { | ||
color: | color: var(--accent-color); | ||
font-size: 1.1rem; | font-size: 1.1rem; | ||
font-style: italic; | |||
} | } | ||
. | .selector-container { | ||
display: flex; | display: flex; | ||
flex-wrap: wrap; | flex-wrap: wrap; | ||
gap: | gap: 15px; | ||
margin-bottom: | margin-bottom: 25px; | ||
background: white; | |||
padding: 20px; | |||
border-radius: 8px; | |||
box-shadow: 0 4px 8px rgba(0,0,0,0.08); | |||
border: 1px solid var(--border-color); | |||
justify-content: center; | |||
} | |||
.selector-group { | |||
display: flex; | |||
flex-wrap: wrap; | |||
gap: 15px; | |||
align-items: center; | |||
} | } | ||
.selector-box { | .selector-box { | ||
min-width: 180px; | |||
min-width: | |||
background: white; | background: white; | ||
border-radius: | border-radius: 6px; | ||
padding: 12px; | |||
padding: | border: 1px solid var(--border-color); | ||
} | } | ||
.selector-title { | .selector-title { | ||
font-size: | font-size: 1rem; | ||
margin-bottom: | margin-bottom: 8px; | ||
color: var(--primary-color); | color: var(--primary-color); | ||
border-bottom: | border-bottom: 1px solid var(--border-color); | ||
padding-bottom: | padding-bottom: 5px; | ||
text-align: center; | |||
} | } | ||
select { | select { | ||
width: 100%; | width: 100%; | ||
padding: 12px | padding: 10px 12px; | ||
border: 1px solid | border: 1px solid var(--border-color); | ||
border-radius: | border-radius: 4px; | ||
background-color: white; | background-color: white; | ||
font-size: | font-size: 0.95rem; | ||
color: var(--dark-color); | color: var(--dark-color); | ||
cursor: pointer; | cursor: pointer; | ||
transition: | transition: all 0.3s; | ||
font-family: var(--font-family); | |||
} | } | ||
select:focus { | select:focus { | ||
outline: none; | outline: none; | ||
border-color: var(-- | border-color: var(--accent-color); | ||
box-shadow: 0 0 0 2px rgba(165, 42, 42, 0.2); | |||
} | } | ||
خط ۱۰۱: | خط ۱۱۸: | ||
background: white; | background: white; | ||
border-radius: 8px; | border-radius: 8px; | ||
box-shadow: 0 4px | box-shadow: 0 4px 12px rgba(0,0,0,0.1); | ||
padding: | padding: 25px; | ||
min-height: | min-height: 400px; | ||
border: 1px solid var(--border-color); | |||
margin-bottom: 20px; | |||
} | } | ||
خط ۱۱۱: | خط ۱۳۰: | ||
color: var(--primary-color); | color: var(--primary-color); | ||
font-size: 1.5rem; | font-size: 1.5rem; | ||
padding-bottom: 10px; | |||
border-bottom: 2px solid var(--border-color); | |||
} | |||
.content-display { | |||
width: 100%; | |||
height: 550px; | |||
border: 1px solid var(--border-color); | |||
border-radius: 6px; | |||
background: white; | |||
} | } | ||
خط ۱۱۶: | خط ۱۴۵: | ||
display: flex; | display: flex; | ||
justify-content: space-between; | justify-content: space-between; | ||
margin-top: | align-items: center; | ||
margin-top: 25px; | |||
flex-wrap: wrap; | |||
gap: 10px; | |||
} | } | ||
.nav-btn { | .nav-btn { | ||
padding: | padding: 12px 20px; | ||
background-color: var(--secondary-color); | background-color: var(--secondary-color); | ||
color: white; | color: white; | ||
border: none; | border: none; | ||
border-radius: | border-radius: 6px; | ||
cursor: pointer; | cursor: pointer; | ||
transition: | transition: all 0.3s; | ||
font-size: 1rem; | font-size: 1rem; | ||
display: flex; | display: flex; | ||
align-items: center; | align-items: center; | ||
gap: | gap: 8px; | ||
font-family: var(--font-family); | |||
box-shadow: 0 2px 4px rgba(0,0,0,0.2); | |||
} | } | ||
.nav-btn:hover { | .nav-btn:hover { | ||
background-color: var(-- | background-color: var(--accent-color); | ||
transform: translateY(-2px); | |||
box-shadow: 0 4px 8px rgba(0,0,0,0.2); | |||
} | } | ||
.nav-btn:disabled { | .nav-btn:disabled { | ||
background-color: # | background-color: #b0a090; | ||
cursor: not-allowed; | cursor: not-allowed; | ||
transform: none; | |||
box-shadow: none; | |||
} | |||
.action-buttons { | |||
display: flex; | |||
gap: 10px; | |||
} | |||
.action-btn { | |||
padding: 12px 20px; | |||
background-color: var(--primary-color); | |||
color: white; | |||
border: none; | |||
border-radius: 6px; | |||
cursor: pointer; | |||
transition: all 0.3s; | |||
font-size: 1rem; | |||
display: flex; | |||
align-items: center; | |||
gap: 8px; | |||
font-family: var(--font-family); | |||
box-shadow: 0 2px 4px rgba(0,0,0,0.2); | |||
} | |||
.action-btn:hover { | |||
background-color: #1a252f; | |||
transform: translateY(-2px); | |||
box-shadow: 0 4px 8px rgba(0,0,0,0.2); | |||
} | } | ||
خط ۱۴۵: | خط ۲۱۰: | ||
display: inline-flex; | display: inline-flex; | ||
align-items: center; | align-items: center; | ||
gap: | justify-content: center; | ||
padding: | gap: 8px; | ||
padding: 12px 20px; | |||
background-color: var(--accent-color); | background-color: var(--accent-color); | ||
color: white; | color: white; | ||
text-decoration: none; | text-decoration: none; | ||
border-radius: | border-radius: 6px; | ||
transition: | transition: all 0.3s; | ||
font-size: 1rem; | |||
font-family: var(--font-family); | |||
box-shadow: 0 2px 4px rgba(0,0,0,0.2); | |||
} | } | ||
.wiki-link:hover { | .wiki-link:hover { | ||
background-color: # | background-color: #8B0000; | ||
transform: translateY(-2px); | |||
box-shadow: 0 4px 8px rgba(0,0,0,0.2); | |||
} | } | ||
خط ۱۶۸: | خط ۲۳۲: | ||
text-align: center; | text-align: center; | ||
color: #7f8c8d; | color: #7f8c8d; | ||
padding: 20px; | padding: 40px 20px; | ||
border: | border: 2px dashed var(--border-color); | ||
border-radius: | border-radius: 8px; | ||
margin-top: 20px; | margin-top: 20px; | ||
font-size: 1.1rem; | |||
background-color: var(--light-color); | |||
font-size: | |||
background-color: var(-- | |||
} | } | ||
خط ۲۲۹: | خط ۲۴۷: | ||
border: 2px solid #f5c6cb; | border: 2px solid #f5c6cb; | ||
color: #721c24; | color: #721c24; | ||
margin-top: 20px; | |||
} | } | ||
خط ۲۳۴: | خط ۲۵۳: | ||
color: #721c24; | color: #721c24; | ||
margin-bottom: 15px; | margin-bottom: 15px; | ||
font-size: 1.5rem; | |||
} | } | ||
/* استایلهای مخصوص موبایل */ | |||
@media (max-width: 768px) { | @media (max-width: 768px) { | ||
. | .container { | ||
padding: 10px; | |||
} | |||
header { | |||
margin-bottom: 20px; | |||
padding: 15px 0; | |||
} | |||
h1 { | |||
font-size: 1.8rem; | |||
margin-bottom: 8px; | |||
} | |||
.description { | |||
font-size: 1rem; | |||
} | |||
.selector-container { | |||
flex-direction: column; | |||
gap: 10px; | |||
margin-bottom: 20px; | |||
padding: 15px; | |||
} | |||
.selector-group { | |||
flex-direction: column; | flex-direction: column; | ||
width: 100%; | |||
} | } | ||
.selector-box { | .selector-box { | ||
min-width: 100%; | min-width: 100%; | ||
width: 100%; | |||
} | |||
.bible-content { | |||
padding: 15px; | |||
} | |||
.chapter-title { | |||
font-size: 1.3rem; | |||
margin-bottom: 15px; | |||
} | |||
.content-display { | |||
height: 400px; | |||
} | } | ||
خط ۲۵۰: | خط ۳۱۱: | ||
} | } | ||
. | .nav-btn, .action-btn, .wiki-link { | ||
width: 100%; | |||
justify-content: center; | |||
} | |||
.action-buttons { | |||
width: 100%; | |||
flex-direction: column; | flex-direction: column; | ||
} | |||
} | |||
@media (max-width: 480px) { | |||
.content-display { | |||
height: 350px; | |||
} | |||
.nav-btn, .action-btn, .wiki-link { | |||
padding: 10px 15px; | |||
font-size: 0.9rem; | |||
} | } | ||
. | .instructions { | ||
padding: 30px 15px; | |||
font-size: 1rem; | |||
} | } | ||
} | |||
/* استایل برای حالت انتخاب نشده */ | |||
.placeholder { | |||
display: flex; | |||
flex-direction: column; | |||
align-items: center; | |||
justify-content: center; | |||
height: 100%; | |||
color: #7f8c8d; | |||
text-align: center; | |||
} | |||
.placeholder i { | |||
font-size: 3rem; | |||
margin-bottom: 15px; | |||
color: var(--border-color); | |||
} | |||
.bible-icon { | |||
font-size: 2.5rem; | |||
color: var(--secondary-color); | |||
margin-bottom: 10px; | |||
} | } | ||
</style> | </style> | ||
خط ۲۶۶: | خط ۳۶۵: | ||
<div class="container"> | <div class="container"> | ||
<header> | <header> | ||
<div class="bible-icon"> | |||
<i class="fas fa-bible"></i> | |||
</div> | |||
<h1>کتاب مقدس</h1> | <h1>کتاب مقدس</h1> | ||
<p class="description">مطالعه آنلاین کتاب مقدس به زبان فارسی</p> | <p class="description">مطالعه آنلاین کتاب مقدس به زبان فارسی</p> | ||
خط ۳۰۶: | خط ۴۰۸: | ||
wrapper.innerHTML = ` | wrapper.innerHTML = ` | ||
<div class="access-denied"> | <div class="access-denied"> | ||
<h3> | <h3><i class="fas fa-ban"></i> دسترسی محدود شده</h3> | ||
<p>این صفحه فقط بر روی دامنه <strong>pediabible.com</strong> قابل دسترسی است.</p> | <p>این صفحه فقط بر روی دامنه <strong>pediabible.com</strong> قابل دسترسی است.</p> | ||
<p>دامنه فعلی: <code>${window.location.hostname}</code></p> | <p>دامنه فعلی: <code>${window.location.hostname}</code></p> | ||
خط ۳۳۱: | خط ۴۳۳: | ||
// ایجاد ساختار HTML برنامه | // ایجاد ساختار HTML برنامه | ||
wrapper.innerHTML = ` | wrapper.innerHTML = ` | ||
<div class=" | <div class="selector-container"> | ||
<div class="selector-group"> | |||
<div class="selector-box"> | |||
<h3 class="selector-title">عهد</h3> | |||
<select id="testament-select"> | |||
<option value="">انتخاب عهد</option> | |||
<option value="old">عهد قدیم</option> | |||
<option value="new">عهد جدید</option> | |||
</select> | |||
</div> | |||
<div class="selector-box"> | |||
<h3 class="selector-title">کتاب</h3> | |||
<select id="book-select" disabled> | |||
<option value="">انتخاب کتاب</option> | |||
</select> | |||
</div> | |||
<div class="selector-box"> | |||
<h3 class="selector-title">فصل</h3> | |||
<select id="chapter-select" disabled> | |||
</ | <option value="">انتخاب فصل</option> | ||
</select> | |||
</div> | |||
</div> | </div> | ||
</div> | </div> | ||
<div class="bible-content"> | <div class="bible-content"> | ||
<h2 class="chapter-title" id="chapter-title">لطفاً | <h2 class="chapter-title" id="chapter-title">لطفاً کتاب و فصل مورد نظر را انتخاب کنید</h2> | ||
<div id="verses-container"> | <div id="verses-container"> | ||
<div class="instructions"> | <div class="instructions"> | ||
<p>برای مطالعه کتاب مقدس، لطفاً ابتدا عهد، سپس کتاب و فصل مورد نظر خود را انتخاب کنید.</p> | <div class="placeholder"> | ||
<i class="fas fa-book-open"></i> | |||
<p>برای مطالعه کتاب مقدس، لطفاً ابتدا عهد، سپس کتاب و فصل مورد نظر خود را انتخاب کنید.</p> | |||
</div> | |||
</div> | </div> | ||
</div> | </div> | ||
<div class="navigation"> | <div class="navigation"> | ||
<button class="nav-btn" id="prev-chapter" disabled> | <button class="nav-btn" id="prev-chapter" disabled> | ||
<button class=" | <i class="fas fa-arrow-right"></i> | ||
فصل قبلی | |||
</button> | |||
<button class="nav-btn" id="next-chapter" disabled>فصل بعدی | |||
<div class="action-buttons"> | |||
<button class="action-btn" id="clean-view"> | |||
<i class="fas fa-eye"></i> | |||
نمایش تمیز | |||
</button> | |||
<button class="action-btn" id="full-view"> | |||
<i class="fas fa-expand"></i> | |||
صفحه کامل | |||
</button> | |||
<a href="#" class="wiki-link" id="wiki-page-link" target="_blank" style="display: none;"> | |||
<i class="fas fa-external-link-alt"></i> | |||
بازکردن در تب جدید | |||
</a> | |||
</div> | |||
<button class="nav-btn" id="next-chapter" disabled> | |||
فصل بعدی | |||
<i class="fas fa-arrow-left"></i> | |||
</button> | |||
</div> | </div> | ||
</div> | </div> | ||
خط ۳۸۸: | خط ۵۱۴: | ||
{ name: "اول سموئیل", chapters: 31, displayName: "اول سموئیل" }, | { name: "اول سموئیل", chapters: 31, displayName: "اول سموئیل" }, | ||
{ name: "دوم سموئیل", chapters: 24, displayName: "دوم سموئیل" } | { name: "دوم سموئیل", chapters: 24, displayName: "دوم سموئیل" } | ||
], | ], | ||
new: [ | new: [ | ||
خط ۴۰۱: | خط ۵۲۶: | ||
{ name: "غلاطیان", chapters: 6, displayName: "رساله به غلاطیان" }, | { name: "غلاطیان", chapters: 6, displayName: "رساله به غلاطیان" }, | ||
{ name: "افسسیان", chapters: 6, displayName: "رساله به افسسیان" } | { name: "افسسیان", chapters: 6, displayName: "رساله به افسسیان" } | ||
] | ] | ||
}; | }; | ||
خط ۴۲۹: | خط ۵۵۳: | ||
if (currentTestament) { | if (currentTestament) { | ||
bookSelect.disabled = false; | bookSelect.disabled = false; | ||
bookSelect.innerHTML = '<option value=""> | bookSelect.innerHTML = '<option value="">انتخاب کتاب</option>'; | ||
bibleData[currentTestament].forEach((book, index) => { | bibleData[currentTestament].forEach((book, index) => { | ||
خط ۴۳۹: | خط ۵۶۳: | ||
chapterSelect.disabled = true; | chapterSelect.disabled = true; | ||
chapterSelect.innerHTML = '<option value=""> | chapterSelect.innerHTML = '<option value="">انتخاب فصل</option>'; | ||
resetContent(); | resetContent(); | ||
} else { | } else { | ||
خط ۴۵۲: | خط ۵۷۶: | ||
if (currentBook !== '') { | if (currentBook !== '') { | ||
chapterSelect.disabled = false; | chapterSelect.disabled = false; | ||
chapterSelect.innerHTML = '<option value=""> | chapterSelect.innerHTML = '<option value="">انتخاب فصل</option>'; | ||
const bookIndex = parseInt(currentBook); | const bookIndex = parseInt(currentBook); | ||
خط ۴۶۶: | خط ۵۹۰: | ||
prevChapterBtn.disabled = true; | prevChapterBtn.disabled = true; | ||
nextChapterBtn.disabled = true; | nextChapterBtn.disabled = true; | ||
wikiPageLink.style.display = 'none'; | wikiPageLink.style.display = 'none'; | ||
} else { | } else { | ||
chapterSelect.disabled = true; | chapterSelect.disabled = true; | ||
chapterSelect.innerHTML = '<option value=""> | chapterSelect.innerHTML = '<option value="">انتخاب فصل</option>'; | ||
resetContent(); | resetContent(); | ||
} | } | ||
خط ۵۰۱: | خط ۶۲۳: | ||
versesContainer.innerHTML = ` | versesContainer.innerHTML = ` | ||
< | <iframe | ||
id="content-iframe" | |||
src="${getCurrentViewUrl()}" | |||
class="content-display" | |||
frameborder="0" | |||
loading="lazy" | |||
allowfullscreen> | |||
</iframe> | |||
`; | `; | ||
wikiPageLink.href = fullPageUrl; | wikiPageLink.href = fullPageUrl; | ||
wikiPageLink.style.display = ' | wikiPageLink.style.display = 'flex'; | ||
updateNavigationButtons(); | updateNavigationButtons(); | ||
} | } | ||
خط ۵۴۰: | خط ۶۴۸: | ||
} | } | ||
// رویداد دکمه نمایش تمیز | |||
// رویداد دکمه نمایش تمیز | |||
cleanViewBtn.addEventListener('click', function() { | cleanViewBtn.addEventListener('click', function() { | ||
currentViewMode = 'render'; | currentViewMode = 'render'; | ||
خط ۵۶۰: | خط ۶۵۵: | ||
iframe.src = getCurrentViewUrl(); | iframe.src = getCurrentViewUrl(); | ||
} | } | ||
}); | }); | ||
// رویداد دکمه نمایش کامل | // رویداد دکمه نمایش کامل | ||
fullViewBtn.addEventListener('click', function() { | fullViewBtn.addEventListener('click', function() { | ||
currentViewMode = 'full'; | currentViewMode = 'full'; | ||
خط ۵۷۵: | خط ۶۶۴: | ||
iframe.src = getCurrentViewUrl(); | iframe.src = getCurrentViewUrl(); | ||
} | } | ||
}); | }); | ||
خط ۶۱۱: | خط ۶۹۴: | ||
function resetContent() { | function resetContent() { | ||
chapterTitle.textContent = 'لطفاً | chapterTitle.textContent = 'لطفاً کتاب و فصل مورد نظر را انتخاب کنید'; | ||
versesContainer.innerHTML = | versesContainer.innerHTML = ` | ||
<div class="instructions"> | |||
<div class="placeholder"> | |||
<i class="fas fa-book-open"></i> | |||
<p>برای مطالعه کتاب مقدس، لطفاً ابتدا عهد، سپس کتاب و فصل مورد نظر خود را انتخاب کنید.</p> | |||
</div> | |||
</div> | |||
`; | |||
prevChapterBtn.disabled = true; | prevChapterBtn.disabled = true; | ||
nextChapterBtn.disabled = true; | nextChapterBtn.disabled = true; | ||
wikiPageLink.style.display = 'none'; | wikiPageLink.style.display = 'none'; | ||
} | } | ||
خط ۶۲۲: | خط ۷۱۰: | ||
function resetAll() { | function resetAll() { | ||
bookSelect.disabled = true; | bookSelect.disabled = true; | ||
bookSelect.innerHTML = '<option value=""> | bookSelect.innerHTML = '<option value="">انتخاب کتاب</option>'; | ||
chapterSelect.disabled = true; | chapterSelect.disabled = true; | ||
chapterSelect.innerHTML = '<option value=""> | chapterSelect.innerHTML = '<option value="">انتخاب فصل</option>'; | ||
resetContent(); | resetContent(); | ||
} | } | ||
خط ۶۳۷: | خط ۷۲۵: | ||
}); | }); | ||
// 🔒 جلوگیری از | // 🔒 جلوگیری از دسترسی به توابع از کنسول | ||
Object.defineProperty(window, 'bibleData', { | Object.defineProperty(window, 'bibleData', { | ||
value: null, | value: null, |
نسخهٔ ۸ اکتبر ۲۰۲۵، ساعت ۰۰:۲۷
کتاب مقدس
مطالعه آنلاین کتاب مقدس به زبان فارسی