');
// 清理内容中的收藏相关元素
const tempDiv = document.createElement('div');
tempDiv.innerHTML = contentHTML;
tempDiv.querySelectorAll('div[style*="width: 100%; text-align: center"]').forEach(div => {
if (div.textContent.includes('收藏') ||
div.textContent.includes('投诉') ||
div.textContent.includes('插入书签') ||
div.textContent.includes('免费得晋江币')) {
div.parentNode.removeChild(div);
}
});
tempDiv.querySelectorAll('div[style*="float:right"]').forEach(div => {
const img = div.querySelector('img[src*="bookmark.gif"]');
if (img) {
div.parentNode.removeChild(div);
}
});
contentDiv.innerHTML = tempDiv.innerHTML;
// 创建导航区域
const navDiv = document.createElement('div');
navDiv.className = 'jj-chapter-nav';
// 添加上一章按钮
if (prevChapterLink) {
const prevLink = document.createElement('a');
prevLink.href = prevChapterLink.href;
prevLink.className = 'jj-nav-link';
prevLink.textContent = prevChapterLink.text;
navDiv.appendChild(prevLink);
}
// 添加章节选择下拉列表
if (chapterSelect) {
// 为防止原始事件丢失，直接从DOM中移除并重新添加到我们的导航区域
const originalParent = chapterSelect.parentNode;
chapterSelect.classList.add('jj-chapter-select');
navDiv.appendChild(chapterSelect);
// 保险起见，如果原始select没有事件监听器，添加一个
if (chapterSelect.getAttribute('onchange') === null) {
chapterSelect.addEventListener('change', function() {
if (this.value) {
window.location.href = this.value;
}
});
}
}
// 添加下一章按钮
if (nextChapterLink) {
const nextLink = document.createElement('a');
nextLink.href = nextChapterLink.href;
nextLink.className = 'jj-nav-link';
nextLink.textContent = nextChapterLink.text;
navDiv.appendChild(nextLink);
}
// 如果有目录按钮但没找到章节选择器，添加目录按钮
if (tocLink && !chapterSelect) {
const tocLinkElement = document.createElement('a');
tocLinkElement.href = tocLink.href;
tocLinkElement.className = 'jj-nav-link';
tocLinkElement.textContent = tocLink.text;
navDiv.appendChild(tocLinkElement);
}
// 组装页面
container.appendChild(headerDiv);
container.appendChild(contentDiv);
container.appendChild(navDiv);
// 清除原有内容，但要确保保留必要的脚本和样式
const elementsToHide = document.querySelectorAll('body > *:not(#sitetop):not(style):not(script):not(.back-to-top)');
elementsToHide.forEach(el => {
if (el !== container && !el.classList.contains('jj-container')) {
el.style.display = 'none';
}
});
// 添加新布局
document.body.appendChild(container);
// 再次移除收藏相关元素，确保完全清除
removeElements();
// 监听DOM变化，以便在动态添加的元素中也移除收藏相关元素
const observer = new MutationObserver(function(mutations) {
removeElements();
});
observer.observe(document.body, {
childList: true,
subtree: true
});
// 创建工具栏
createToolbar();
// 初始化主题
initializeSettings();
}
// 延迟执行，确保页面内容已加载
setTimeout(createNewLayout, 500);
});
// 字体大小调整函数
function adjustFontSize(delta) {
const content = document.querySelector('.jj-novel-content');
if (!content) return;
// 获取当前字体大小
let currentSize = parseInt(localStorage.getItem('jj-font-size')) || 18;
const newSize = Math.min(Math.max(currentSize + delta * 2, 14), 28);
// 更新所有可能包含文本的元素的字体大小
const textElements = content.querySelectorAll('p, div:not(.note_main):not(.note_content):not(#note_danmu_wrapper), span, font');
textElements.forEach(el => {
// 跳过作者有话说相关的元素
if (el.closest('.note_main, .note_content, #note_danmu_wrapper')) {
return;
}
el.style.setProperty('font-size', `${newSize}px`, 'important');
el.style.setProperty('line-height', '2', 'important');
});
// 保存设置
localStorage.setItem('jj-font-size', newSize);
// 更新UI状态
updateFontSizeUI(newSize);
}
// 更新字体大小按钮和进度点状态
function updateFontSizeUI(currentSize) {
// 更新进度点
const dots = document.querySelectorAll('.jj-font-size-dot');
const activeIndex = Math.floor((currentSize - 14) / 2);
dots.forEach((dot, index) => {
if (index <= activeIndex) {
dot.classList.add('active');
} else {
dot.classList.remove('active');
}
});
// 更新按钮状态
const decreaseBtn = document.querySelector('.jj-font-size-btn:first-child');
const increaseBtn = document.querySelector('.jj-font-size-btn:last-child');
if (decreaseBtn) {
decreaseBtn.disabled = currentSize <= 14;
decreaseBtn.style.opacity = currentSize <= 14 ? '0.5' : '1';
}
if (increaseBtn) {
increaseBtn.disabled = currentSize >= 28;
increaseBtn.style.opacity = currentSize >= 28 ? '0.5' : '1';
}
}
// 主题切换函数
function setTheme(theme) {
// 移除所有主题类
document.body.classList.remove('theme-default', 'theme-eye-care', 'theme-focus', 'theme-dark');
// 添加新主题类
document.body.classList.add(`theme-${theme}`);
// 更新按钮状态
document.querySelectorAll('.jj-toolbar-btn').forEach(btn => {
btn.classList.remove('active');
if (btn.textContent === getThemeName(theme)) {
btn.classList.add('active');
}
});
// 保存设置
localStorage.setItem('jj-theme', theme);
}
// 获取主题名称
function getThemeName(theme) {
const themeMap = {
'default': '默认',
'eye-care': '护眼',
'focus': '专注',
'dark': '夜间'
};
return themeMap[theme] || '默认';
}
// 字体切换函数
function setFontFamily(fontFamily) {
const content = document.querySelector('.jj-novel-content');
if (!content) return;
// 更新所有文本元素的字体
const textElements = content.querySelectorAll('p, div:not(.note_main):not(.note_content):not(#note_danmu_wrapper), span, font');
textElements.forEach(el => {
if (el.closest('.note_main, .note_content, #note_danmu_wrapper')) {
return;
}
el.style.setProperty('font-family', fontFamily, 'important');
});
// 更新主题预览的字体
document.querySelectorAll('.jj-theme-preview, .jj-theme-preview .preview-text, .jj-theme-preview .preview-name').forEach(el => {
el.style.setProperty('font-family', fontFamily, 'important');
});
// 保存设置
localStorage.setItem('jj-font-family', fontFamily);
// 更新UI状态
updateFontFamilyUI(fontFamily);
}
// 更新字体选择按钮状态
function updateFontFamilyUI(currentFont) {
document.querySelectorAll('.jj-font-family-btn').forEach(btn => {
btn.classList.toggle('active', btn.dataset.font === currentFont);
});
}
// 初始化设置
function initializeSettings() {
// 恢复主题设置
const savedTheme = localStorage.getItem('jj-theme') || 'default';
setTheme(savedTheme);
// 恢复字体大小设置
const savedFontSize = parseInt(localStorage.getItem('jj-font-size')) || 18;
// 恢复字体设置
const savedFontFamily = localStorage.getItem('jj-font-family') || '"PingFang SC", "Hiragino Sans GB", "Microsoft YaHei"';
const content = document.querySelector('.jj-novel-content');
if (content) {
const textElements = content.querySelectorAll('p, div:not(.note_main):not(.note_content):not(#note_danmu_wrapper), span, font');
textElements.forEach(el => {
if (el.closest('.note_main, .note_content, #note_danmu_wrapper')) {
return;
}
el.style.setProperty('font-size', `${savedFontSize}px`, 'important');
el.style.setProperty('line-height', '2', 'important');
el.style.setProperty('font-family', savedFontFamily, 'important');
});
}
// 更新UI状态
updateFontSizeUI(savedFontSize);
updateFontFamilyUI(savedFontFamily);
}
// 创建工具栏
function createToolbar() {
// 创建触发按钮
const trigger = document.createElement('div');
trigger.className = 'jj-toolbar-trigger';
// 使用大小文字
trigger.innerHTML = `
大
小
`;
document.body.appendChild(trigger);
const toolbar = document.createElement('div');
toolbar.className = 'jj-toolbar';
// 工具栏标题
const title = document.createElement('div');
title.className = 'jj-toolbar-title';
title.textContent = '字体与主题';
toolbar.appendChild(title);
// 字体大小调整组
const fontSizeGroup = document.createElement('div');
fontSizeGroup.className = 'jj-font-size-group';
// 字体大小按钮组
const fontSizeButtons = document.createElement('div');
fontSizeButtons.className = 'jj-font-size-buttons';
// 小号字体按钮
const decreaseBtn = document.createElement('button');
decreaseBtn.className = 'jj-font-size-btn';
decreaseBtn.textContent = '小';
decreaseBtn.onclick = () => adjustFontSize(-1);
// 大号字体按钮
const increaseBtn = document.createElement('button');
increaseBtn.className = 'jj-font-size-btn';
increaseBtn.textContent = '大';
increaseBtn.onclick = () => adjustFontSize(1);
fontSizeButtons.appendChild(decreaseBtn);
fontSizeButtons.appendChild(increaseBtn);
fontSizeGroup.appendChild(fontSizeButtons);
// 字体大小进度点
const fontSizeDots = document.createElement('div');
fontSizeDots.className = 'jj-font-size-dots';
// 创建8个进度点（14px到28px，每2px一个点）
for (let i = 0; i < 8; i++) {
const dot = document.createElement('div');
dot.className = 'jj-font-size-dot';
fontSizeDots.appendChild(dot);
}
fontSizeGroup.appendChild(fontSizeDots);
toolbar.appendChild(fontSizeGroup);
// 字体选择组
const fontFamilyGroup = document.createElement('div');
fontFamilyGroup.className = 'jj-font-family-group';
const fonts = [
{ name: '黑体', value: '"PingFang SC", "Hiragino Sans GB", "Microsoft YaHei"' },
{ name: '宋体', value: '"Songti SC", SimSun, "宋体"' }
];
fonts.forEach(font => {
const button = document.createElement('button');
button.className = 'jj-font-family-btn';
button.textContent = font.name;
button.dataset.font = font.value;
if (localStorage.getItem('jj-font-family') === font.value) {
button.classList.add('active');
}
button.onclick = () => setFontFamily(font.value);
fontFamilyGroup.appendChild(button);
});
toolbar.appendChild(fontFamilyGroup);
// 主题选择组
const themeGroup = document.createElement('div');
themeGroup.className = 'jj-theme-group';
const themes = [
{ name: '纸张', value: 'default', previewClass: 'default', bgColor: '#EEEDED', textColor: '#333333' },
{ name: '护眼', value: 'eye-care', previewClass: 'eye-care', bgColor: '#E6EFD5', textColor: '#2C3E50' },
{ name: '专注', value: 'focus', previewClass: 'focus', bgColor: '#FFFCF4', textColor: '#3C3C3C' },
{ name: '夜间', value: 'dark', previewClass: 'dark', bgColor: '#4A4A4D', textColor: '#FFFFFF' }
];
themes.forEach(theme => {
const card = document.createElement('div');
card.className = 'jj-theme-card';
if (localStorage.getItem('jj-theme') === theme.value) {
card.classList.add('active');
}
const preview = document.createElement('div');
preview.className = `jj-theme-preview ${theme.previewClass}`;
preview.style.backgroundColor = theme.bgColor;
preview.style.color = theme.textColor;
preview.textContent = theme.name;
card.appendChild(preview);
card.onclick = () => {
document.querySelectorAll('.jj-theme-card').forEach(c => c.classList.remove('active'));
card.classList.add('active');
setTheme(theme.value);
};
themeGroup.appendChild(card);
});
toolbar.appendChild(themeGroup);
document.body.appendChild(toolbar);
// 添加点击事件
trigger.addEventListener('click', () => {
toolbar.classList.toggle('expanded');
trigger.classList.toggle('expanded');
});
// 点击其他区域关闭工具栏
document.addEventListener('click', (e) => {
if (!toolbar.contains(e.target) && !trigger.contains(e.target)) {
toolbar.classList.remove('expanded');
trigger.classList.remove('expanded');
}
});
// 夜间模式下的样式调整
const observer = new MutationObserver((mutations) => {
mutations.forEach((mutation) => {
if (mutation.target.classList.contains('theme-dark')) {
trigger.style.backgroundColor = 'rgba(74, 74, 77, 0.95)';
trigger.querySelector('svg').style.stroke = '#FFFFFF';
} else {
trigger.style.backgroundColor = 'rgba(255, 255, 255, 0.98)';
trigger.querySelector('svg').style.stroke = '#666666';
}
});
});
observer.observe(document.body, {
attributes: true,
attributeFilter: ['class']
});
}
})();