File size: 2,818 Bytes
13f4749 7abe35f 13f4749 7abe35f 13f4749 7abe35f 13f4749 7abe35f 13f4749 | 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 | document.addEventListener('DOMContentLoaded', () => {
const container = document.getElementById('posts-container');
const dialog = document.getElementById('post-dialog');
const closeBtn = document.getElementById('close-dialog');
const contentDiv = document.getElementById('post-content');
const dialogTitle = document.getElementById('dialog-title');
const script = document.createElement('script');
script.src = 'https://cdn.jsdelivr.net/npm/marked/marked.min.js';
document.head.appendChild(script);
fetch('sad.json')
.then(response => {
if (!response.ok) throw new Error('Failed to load sad.json');
return response.json();
})
.then(data => {
data.posts.forEach(post => {
const postDiv = document.createElement('div');
postDiv.classList.add('post');
const button = document.createElement('button');
button.classList.add('post-btn');
button.textContent = post['post-title'];
const preview = document.createElement('p');
preview.classList.add('post-preview');
preview.textContent = 'Loading preview...';
postDiv.appendChild(button);
postDiv.appendChild(preview);
container.appendChild(postDiv);
// Fetch markdown file for preview
fetch(post.file)
.then(response => response.text())
.then(mdText => {
// Create preview from first 200 chars of the markdown
preview.textContent = mdText.slice(0, 200) + '...';
// Store full text for button click
button.addEventListener('click', () => {
contentDiv.innerHTML = marked.parse(mdText);
dialogTitle.textContent = post['post-title'];
dialog.showModal();
});
})
.catch(error => {
preview.textContent = 'Preview unavailable';
button.addEventListener('click', () => {
contentDiv.innerHTML = `<p>Error loading post: ${error.message}</p>`;
dialogTitle.textContent = post['post-title'];
dialog.showModal();
});
});
});
})
.catch(error => {
console.error('Error loading posts:', error);
container.innerHTML = '<p>Failed to load posts. Check console for details.</p>';
});
closeBtn.addEventListener('click', () => {
dialog.close();
});
}); |