async function initPopup() {
try {
// 初始化 marked.js
setupMarked();
// 获取旧公告的 DOM 元素
const notice = debugElement('notice');
const noticeContent = debugElement('notice-content');
// 获取新公告的 DOM 元素
const newNotice = debugElement('new-notice');
const newNoticeContent = debugElement('new-notice-content');
// 检查元素是否存在
if (!notice || !noticeContent || !newNotice || !newNoticeContent) {
console.error('找不到必要的DOM元素');
return;
}
// 从API获取旧公告内容和更新时间
const { content: oldContent, updatedAt: oldUpdatedAt } = await fetchNoticeContent();
// 使用API返回的更新时间更新旧公告发布时间
notice.setAttribute('data-publish-time', oldUpdatedAt);
// 添加 markdown-content 类
noticeContent.classList.add('markdown-content');
try {
// 直接使用 marked 解析内容，不再需要预处理
noticeContent.innerHTML = marked.parse(oldContent);
// 为所有 blockquote 添加 is-info 类
const blockquotes = noticeContent.querySelectorAll('blockquote');
blockquotes.forEach(blockquote => {
blockquote.classList.add('is-info');
});
} catch (e) {
// 如果失败，尝试先将 HTML 转换为 Markdown 文本
console.warn('直接解析失败，尝试转换为 Markdown:', e);
const markdownText = extractMarkdownFromHtml(oldContent);
noticeContent.innerHTML = marked.parse(markdownText);
// 为所有 blockquote 添加 is-info 类
const blockquotes = noticeContent.querySelectorAll('blockquote');
blockquotes.forEach(blockquote => {
blockquote.classList.add('is-info');
});
}
// 修改 GraphQL 查询以获取新公告内容
const newQuery = `
{
pages {
single(id: 16) { // 新页面 ID
content
updatedAt
}
}
}
`;
// 从API获取新公告内容和更新时间
const newResponse = await fetch('http://111.231.25.137:3000/graphql', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({ query: newQuery })
});
if (!newResponse.ok) {
throw new Error('API请求失败');
}
const newData = await newResponse.json();
const newContent = newData.data.pages.single.content;
const newUpdatedAt = newData.data.pages.single.updatedAt;
// 使用API返回的更新时间更新新公告发布时间
newNotice.setAttribute('data-publish-time', newUpdatedAt);
// 添加 markdown-content 类
newNoticeContent.classList.add('markdown-content');
try {
// 直接使用 marked 解析内容，不再需要预处理
newNoticeContent.innerHTML = marked.parse(newContent);
// 为所有 blockquote 添加 is-info 类
const blockquotes = newNoticeContent.querySelectorAll('blockquote');
blockquotes.forEach(blockquote => {
blockquote.classList.add('is-info');
});
} catch (e) {
// 如果失败，尝试先将 HTML 转换为 Markdown 文本
console.warn('直接解析失败，尝试转换为 Markdown:', e);
const markdownText = extractMarkdownFromHtml(newContent);
newNoticeContent.innerHTML = marked.parse(markdownText);
// 为所有 blockquote 添加 is-info 类
const blockquotes = newNoticeContent.querySelectorAll('blockquote');
blockquotes.forEach(blockquote => {
blockquote.classList.add('is-info');
});
}
// 获取旧公告的发布时间
const oldPublishTime = notice.getAttribute('data-publish-time');
// 获取新公告的发布时间
const newPublishTime = newNotice.getAttribute('data-publish-time');
// Cookie 操作函数
function getCookie(name) {
const value = `; ${document.cookie}`;
const parts = value.split(`; ${name}=`);
if (parts.length === 2) return parts.pop().split(';').shift();
return null;
}
function setCookie(name, value, days) {
let expires = "";
if (days) {
const date = new Date();
date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
expires = "; expires=" + date.toUTCString();
}
document.cookie = name + "=" + value + expires + "; path=/";
}
// 检查是否需要显示旧公告
function shouldShowOldNotice() {
const lastSeenNotice = getCookie("lastSeenNotice");
if (!lastSeenNotice || lastSeenNotice !== oldPublishTime) {
return true;
}
return false;
}
// 检查是否需要显示新公告
function shouldShowNewNotice() {
const lastSeenNewNotice = getCookie("lastSeenNewNotice");
if (!lastSeenNewNotice || lastSeenNewNotice !== newPublishTime) {
return true;
}
return false;
}
// 记录用户已查看旧公告
function markOldNoticeAsSeen() {
setCookie("lastSeenNotice", oldPublishTime, 30);
}
// 记录用户已查看新公告
function markNewNoticeAsSeen() {
setCookie("lastSeenNewNotice", newPublishTime, 30);
}
// 添加事件监听器 - 旧公告
const opener1 = debugElement('opener1');
const closeIcon = debugElement('closeIcon');
if (!opener1 || !closeIcon) {
console.error('找不到操作按钮元素');
return;
}
opener1.addEventListener('click', function () {
notice.showModal();
});
closeIcon.addEventListener('click', function () {
notice.close();
markOldNoticeAsSeen();
});
notice.addEventListener('click', function (event) {
if (event.target === notice) {
notice.close();
markOldNoticeAsSeen();
}
});
// 添加事件监听器 - 新公告
const newOpener1 = debugElement('new-opener1');
const newCloseIcon = debugElement('new-closeIcon');
if (!newOpener1 || !newCloseIcon) {
console.error('找不到操作按钮元素');
return;
}
newOpener1.addEventListener('click', function () {
newNotice.showModal();
});
newCloseIcon.addEventListener('click', function () {
newNotice.close();
markNewNoticeAsSeen();
});
newNotice.addEventListener('click', function (event) {
if (event.target === newNotice) {
newNotice.close();
markNewNoticeAsSeen();
}
});
// 自动检查并显示旧公告（如果需要）
if (shouldShowOldNotice()) {
requestAnimationFrame(function () {
setTimeout(function () {
notice.showModal();
}, 800);
});
}
// 自动检查并显示新公告（如果需要）
if (shouldShowNewNotice()) {
requestAnimationFrame(function () {
setTimeout(function () {
newNotice.showModal();
}, 800);
});
}
} catch (error) {
console.error('初始化弹窗时发生错误:', error);
}
}