|
|
@@ -74,12 +74,12 @@ layui.config({
|
|
|
|
|
|
// 工具函数
|
|
|
const utils = {
|
|
|
- showError: function(title, msg) {
|
|
|
+ showError: function (title, msg) {
|
|
|
console.error(title, msg);
|
|
|
// 这里可以添加更友好的错误提示,如使用layer
|
|
|
},
|
|
|
|
|
|
- getFontFamily: function(font) {
|
|
|
+ getFontFamily: function (font) {
|
|
|
const fontMap = {
|
|
|
'serif': "'Noto Serif SC', 'Times New Roman', serif",
|
|
|
'sans-serif': "'Segoe UI', 'Microsoft YaHei', sans-serif",
|
|
|
@@ -89,7 +89,7 @@ layui.config({
|
|
|
return fontMap[font] || fontMap.system;
|
|
|
},
|
|
|
|
|
|
- debounce: function(func, wait) {
|
|
|
+ debounce: function (func, wait) {
|
|
|
let timeout;
|
|
|
return function executedFunction(...args) {
|
|
|
const later = () => {
|
|
|
@@ -105,7 +105,7 @@ layui.config({
|
|
|
// 章节管理
|
|
|
const chapterManager = {
|
|
|
// 加载章节数据
|
|
|
- loadChapters: function() {
|
|
|
+ loadChapters: function () {
|
|
|
if (state.isChaptersLoaded) {
|
|
|
return Promise.resolve(state.chapters);
|
|
|
}
|
|
|
@@ -127,7 +127,7 @@ layui.config({
|
|
|
id: chapter.id,
|
|
|
number: chapter.chapterNumber,
|
|
|
title: chapter.chapterTitle,
|
|
|
- content: chapter.contentHtml
|
|
|
+ content: chapter.contentHtml ? chapter.contentHtml : chapter.contentText
|
|
|
}));
|
|
|
state.isChaptersLoaded = true;
|
|
|
resolve(state.chapters);
|
|
|
@@ -146,7 +146,7 @@ layui.config({
|
|
|
},
|
|
|
|
|
|
// 渲染章节列表(只渲染一次,后续只更新激活状态)
|
|
|
- renderChaptersList: function() {
|
|
|
+ renderChaptersList: function () {
|
|
|
if (state.isRendering || !state.isChaptersLoaded) return;
|
|
|
|
|
|
state.isRendering = true;
|
|
|
@@ -163,7 +163,7 @@ layui.config({
|
|
|
},
|
|
|
|
|
|
// 更新章节激活状态(避免重新渲染整个列表)
|
|
|
- updateActiveChapter: function() {
|
|
|
+ updateActiveChapter: function () {
|
|
|
if (!DOM.chaptersList) return;
|
|
|
|
|
|
// 移除所有激活状态
|
|
|
@@ -184,7 +184,7 @@ layui.config({
|
|
|
},
|
|
|
|
|
|
// 显示指定章节
|
|
|
- showChapter: function(index) {
|
|
|
+ showChapter: function (index) {
|
|
|
if (index < 0 || index >= state.chapters.length) return;
|
|
|
|
|
|
state.currentChapterIndex = index;
|
|
|
@@ -207,7 +207,7 @@ layui.config({
|
|
|
},
|
|
|
|
|
|
// 更新阅读进度
|
|
|
- updateProgress: function() {
|
|
|
+ updateProgress: function () {
|
|
|
const progress = ((state.currentChapterIndex + 1) / state.chapters.length * 100).toFixed(0);
|
|
|
DOM.progressPercent.textContent = `${progress}%`;
|
|
|
}
|
|
|
@@ -216,7 +216,7 @@ layui.config({
|
|
|
// 阅读设置管理
|
|
|
const settingsManager = {
|
|
|
// 应用阅读设置
|
|
|
- applyReadingSettings: function() {
|
|
|
+ applyReadingSettings: function () {
|
|
|
// 字体大小
|
|
|
DOM.readingArea.className = DOM.readingArea.className.replace(/\bfont-\w+\b/g, '');
|
|
|
DOM.readingArea.classList.add(`font-${state.fontSize}`);
|
|
|
@@ -239,10 +239,10 @@ layui.config({
|
|
|
},
|
|
|
|
|
|
// 初始化设置面板
|
|
|
- initSettingsPanel: function() {
|
|
|
+ initSettingsPanel: function () {
|
|
|
// 字体大小设置
|
|
|
document.querySelectorAll('.font-size-btn').forEach(btn => {
|
|
|
- btn.addEventListener('click', function() {
|
|
|
+ btn.addEventListener('click', function () {
|
|
|
document.querySelectorAll('.font-size-btn').forEach(b => b.classList.remove('active'));
|
|
|
this.classList.add('active');
|
|
|
state.fontSize = this.getAttribute('data-size');
|
|
|
@@ -252,7 +252,7 @@ layui.config({
|
|
|
|
|
|
// 主题设置
|
|
|
document.querySelectorAll('.theme-btn').forEach(btn => {
|
|
|
- btn.addEventListener('click', function() {
|
|
|
+ btn.addEventListener('click', function () {
|
|
|
document.querySelectorAll('.theme-btn').forEach(b => b.classList.remove('active'));
|
|
|
this.classList.add('active');
|
|
|
state.theme = this.getAttribute('data-theme');
|
|
|
@@ -262,7 +262,7 @@ layui.config({
|
|
|
|
|
|
// 行高设置
|
|
|
document.querySelectorAll('[data-lineheight]').forEach(btn => {
|
|
|
- btn.addEventListener('click', function() {
|
|
|
+ btn.addEventListener('click', function () {
|
|
|
document.querySelectorAll('[data-lineheight]').forEach(b => b.classList.remove('active'));
|
|
|
this.classList.add('active');
|
|
|
state.lineHeight = this.getAttribute('data-lineheight');
|
|
|
@@ -271,7 +271,7 @@ layui.config({
|
|
|
});
|
|
|
|
|
|
// 字体设置
|
|
|
- DOM.fontSelect.addEventListener('change', function() {
|
|
|
+ DOM.fontSelect.addEventListener('change', function () {
|
|
|
state.fontFamily = this.value;
|
|
|
settingsManager.applyReadingSettings();
|
|
|
});
|
|
|
@@ -280,9 +280,9 @@ layui.config({
|
|
|
|
|
|
// 事件处理
|
|
|
const eventHandler = {
|
|
|
- initEvents: function() {
|
|
|
+ initEvents: function () {
|
|
|
// 切换侧边栏
|
|
|
- DOM.toggleSidebar.addEventListener('click', function() {
|
|
|
+ DOM.toggleSidebar.addEventListener('click', function () {
|
|
|
DOM.sidebar.classList.toggle('collapsed');
|
|
|
DOM.mainContent.classList.toggle('expanded');
|
|
|
});
|
|
|
@@ -313,7 +313,7 @@ layui.config({
|
|
|
});
|
|
|
|
|
|
// 章节列表点击事件(使用事件委托)
|
|
|
- DOM.chaptersList.addEventListener('click', utils.debounce(function(e) {
|
|
|
+ DOM.chaptersList.addEventListener('click', utils.debounce(function (e) {
|
|
|
const chapterItem = e.target.closest('.chapter-item');
|
|
|
if (chapterItem) {
|
|
|
const index = parseInt(chapterItem.getAttribute('data-index'));
|
|
|
@@ -327,29 +327,29 @@ layui.config({
|
|
|
}, 100));
|
|
|
|
|
|
// 设置面板
|
|
|
- DOM.settingsBtn.addEventListener('click', function() {
|
|
|
+ DOM.settingsBtn.addEventListener('click', function () {
|
|
|
DOM.settingsPanel.classList.add('open');
|
|
|
});
|
|
|
|
|
|
- DOM.closeSettings.addEventListener('click', function() {
|
|
|
+ DOM.closeSettings.addEventListener('click', function () {
|
|
|
DOM.settingsPanel.classList.remove('open');
|
|
|
});
|
|
|
|
|
|
// 书签功能
|
|
|
- DOM.bookmarkBtn.addEventListener('click', function() {
|
|
|
+ DOM.bookmarkBtn.addEventListener('click', function () {
|
|
|
const chapter = state.chapters[state.currentChapterIndex];
|
|
|
layer.msg(`已将 "${chapter.number} ${chapter.title}" 添加到书签`);
|
|
|
});
|
|
|
|
|
|
// 搜索功能
|
|
|
- DOM.searchBtn.addEventListener('click', function() {
|
|
|
+ DOM.searchBtn.addEventListener('click', function () {
|
|
|
layer.msg('搜索功能即将推出');
|
|
|
});
|
|
|
}
|
|
|
};
|
|
|
|
|
|
// 添加CSS类来处理字体大小和行高
|
|
|
- const addStyle = function() {
|
|
|
+ const addStyle = function () {
|
|
|
const style = document.createElement('style');
|
|
|
style.textContent = `
|
|
|
.font-small { font-size: 0.9rem; }
|
|
|
@@ -372,7 +372,7 @@ layui.config({
|
|
|
};
|
|
|
|
|
|
// 初始化
|
|
|
- const init = function() {
|
|
|
+ const init = function () {
|
|
|
addStyle();
|
|
|
|
|
|
// 加载章节数据
|