جاري تحميل المقالات...
Sitemap
by Tued |
|
No comments
You didn't understand a certain point;
Ask the smart assistant and it will answer you based on the content of this article.
<style>
/* كود تنسيق الفهرس */
#sitemap-container { font-family: 'Tajawal', sans-serif; }
.sitemap-tab { display: inline-block; padding: 10px 20px; margin: 0 5px 10px 0; background: var(--bg-hover, #f1f5f9); color: var(--text-secondary, #555); border-radius: 50px; cursor: pointer; font-weight: bold; transition: 0.3s; border: 1px solid var(--border-color, #eee); }
.sitemap-tab:hover, .sitemap-tab.active { background: var(--accent-blue, #3b82f6); color: #fff; border-color: var(--accent-blue, #3b82f6); }
.sitemap-content { display: none; margin-top: 20px; animation: fadeIn 0.5s; }
.sitemap-content.active { display: block; }
.sitemap-post { display: flex; align-items: center; padding: 10px 0; border-bottom: 1px dashed var(--border-color, #eee); }
.sitemap-post a { text-decoration: none; color: var(--text-primary, #333); font-weight: 600; flex: 1; transition: 0.2s; }
.sitemap-post a:hover { color: var(--accent-blue, #3b82f6); padding-right: 5px; }
.sitemap-date { font-size: 12px; color: var(--text-secondary, #999); margin-right: 10px; white-space: nowrap; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
</style>
<div id="sitemap-container">
<div id="sitemap-tabs"></div>
<div id="sitemap-results">جاري تحميل المقالات...</div>
</div>
<script>
//<![CDATA[
(function() {
var container = document.getElementById('sitemap-container');
var tabsContainer = document.getElementById('sitemap-tabs');
var resultsContainer = document.getElementById('sitemap-results');
var posts = [];
// جلب المقالات
fetch('/feeds/posts/summary?alt=json&max-results=500')
.then(res => res.json())
.then(data => {
if (data.feed.entry) {
posts = data.feed.entry;
createSitemap();
} else {
resultsContainer.innerHTML = 'لا توجد مقالات.';
}
});
function createSitemap() {
var categories = {};
// تصنيف المقالات
posts.forEach(post => {
if (post.category) {
post.category.forEach(cat => {
if (!categories[cat.term]) categories[cat.term] = [];
categories[cat.term].push(post);
});
}
});
// إنشاء التبويبات
var tabsHtml = '<span class="sitemap-tab active" onclick="filterSitemap(\'all\', this)">الكل</span>';
for (var cat in categories) {
tabsHtml += '<span class="sitemap-tab" onclick="filterSitemap(\'' + cat + '\', this)">' + cat + '</span>';
}
tabsContainer.innerHTML = tabsHtml;
// عرض الكل افتراضياً
filterSitemap('all', tabsContainer.firstChild);
}
window.filterSitemap = function(cat, btn) {
// تفعيل الزر
var tabs = document.querySelectorAll('.sitemap-tab');
tabs.forEach(t => t.classList.remove('active'));
btn.classList.add('active');
// فلترة المقالات
var filteredPosts = [];
if (cat === 'all') {
filteredPosts = posts;
} else {
filteredPosts = posts.filter(p => {
return p.category && p.category.some(c => c.term === cat);
});
}
// عرض النتائج
var html = '';
filteredPosts.forEach(p => {
var title = p.title.$t;
var link = p.link.find(l => l.rel === 'alternate').href;
var date = new Date(p.published.$t).toLocaleDateString('ar-EG');
html += '<div class="sitemap-post"><a href="' + link + '" target="_blank">' + title + '</a><span class="sitemap-date">' + date + '</span></div>';
});
resultsContainer.innerHTML = '<div class="sitemap-content active">' + html + '</div>';
};
})();
//]]>
</script>