# WXRead/resources 文件说明

## 目录结构

```
resources/
├── js/
│   ├── Text/                    # 文本编辑/展示相关
│   │   ├── WeReadApi.js
│   │   ├── rich_editor.js
│   │   ├── rich_display.js
│   │   ├── correctArticle.js
│   │   └── style_html.js
│   ├── Readability.js
│   ├── weread-highlighter.js
│   ├── rangy-core.js
│   ├── rangy-classapplier.js
│   ├── rangy-highlighter.js
│   ├── rangy-textrange.js
│   ├── highlight.min.js
│   ├── cssInjector.js
│   └── patch_6.2.1.4.js
├── css/
│   ├── Style/
│   │   ├── style.css
│   │   ├── preview.css
│   │   └── normalize.css
│   ├── default.css
│   ├── dark.css
│   ├── replace.css
│   ├── replaceForLatinLanguageBook.css
│   ├── replaceForMPChapter.css
│   ├── MPExtra.css
│   ├── MediaPlatform.css
│   ├── WREpubMPVideo.css
│   └── xcode.min.css
└── fonts/                       # 字体文件
```

---

## JS 文件

### 核心功能

#### `Readability.js`
Arc90 的 Readability 库 (v1.7.1)，用于从网页中提取正文内容。通过正则匹配和 DOM 分析算法，从杂乱的 HTML 中识别出文章主体，过滤导航、广告、侧栏等非内容元素。是读书解析公众号文章内容的基础依赖。

#### `weread-highlighter.js`
读书的划线/高亮核心模块。依赖 Rangy 库实现以下功能：
- 初始化 Rangy 高亮器，注册 `highlight`（划线）、`review`（自己的想法）、`friend-review`（好友想法）、`reference`（想法圈划线）、`tts`（朗读高亮）等样式
- 监听 `selectionchange` 事件，将选区位置信息通过 `wereadBridge` 通知原生层
- 提供 `getShareAbstractText()` 从文章段落中提取分享摘要文本
- 字体缩放 `changeFontSizeWithScale()` 支持
- 图片点击事件绑定和 H5 链接转换

#### `cssInjector.js`
CSS 动态注入/移除工具。提供 `inject(json)` 和 `remove(identifier)` 两个方法，通过创建/删除 `<style>` 元素实现运行时样式切换。

#### `patch_6.2.1.4.js`
版本补丁脚本。修改 `WRAboutViewController` 的 `viewDidLoad`，将版权信息文案中的 "rights" 和 "reserved" 首字母改为大写。

### Rangy 库系列 (第三方)

#### `rangy-core.js`
Rangy 核心库 (v1.3.0, MIT License)。跨浏览器的 Range 和 Selection 操作库，提供统一的 API 处理 DOM 选区。

#### `rangy-classapplier.js`
Rangy ClassApplier 模块。对 Range 和 Selection 添加/移除/切换 CSS 类，是实现划线高亮的基础。

#### `rangy-highlighter.js`
Rangy Highlighter 模块。依赖 core 和 ClassApplier，提供更高层的文本高亮 API，支持序列化/反序列化高亮位置。

#### `rangy-textrange.js`
Rangy TextRange 模块。支持按字符/词偏移移动选区边界、文本搜索、选区保存/恢复等功能。

#### `highlight.min.js`
highlight.js 代码语法高亮库（压缩版）。用于在阅读器中高亮显示 `<pre><code>` 代码块。

### Text 子目录

#### `Text/WeReadApi.js`
读书 WebView Bridge。定义 `WeReadBridge` 类，通过隐藏 iframe + 自定义 URL scheme（`wereadapijs://`）实现 JS 与原生层的双向通信。支持回调机制和可用功能查询。

#### `Text/rich_editor.js`
富文本编辑器核心模块。定义 `RE` 对象，管理编辑器 DOM 引用和编辑操作。

#### `Text/rich_display.js`
富文本展示模块。定义 `RDisplay` 对象，处理展示模式下的交互（书籍卡片触摸反馈、点击高亮等）。

#### `Text/correctArticle.js`
文章内容校正脚本。用于对公众号文章的 HTML 结构进行清洗和修正。

#### `Text/style_html.js`
JS Beautifier 库。HTML/JS/CSS 代码格式化工具（MIT License），用于代码块的美化显示。

---

## CSS 文件

### 默认/基础样式

#### `default.css`
公众号文章的基础阅读样式。覆盖微信原生样式，定义：
- 文章区域布局（`rich_media_area_primary`：padding、字号 18px、行高 30px）
- 标题样式（`rich_media_title`：24px/36px）
- 内容区域溢出处理、blockquote 样式
- 隐藏工具栏（`rich_media_tool`）
- 划线/想法/高亮样式（`.highlight` 橙色、`.review` 红色虚线、`.friend-review` 灰色虚线）
- 隐藏 iPad 上的 PC 二维码
- TTS 朗读高亮（`.tts` 蓝色背景）
- 公众号图片链接禁用点击

#### `dark.css`
深色模式样式。全局覆盖为纯黑背景（`rgba(0,0,0,1)`），文字颜色设为灰色（`rgba(180,180,182,1)`），链接为蓝色，blockquote 为深色背景。适配搜狗百科和百度搜索的特殊元素。

#### `xcode.min.css`
代码语法高亮配色方案（highlight.js 的 Xcode 主题），白色背景，关键字紫色、字符串红色、注释绿色等。

### 内容替换样式

#### `replace.css`
EPUB 书籍的主要排版样式。定义：
- 代码块字体（Menlo/Consolas）、版权标题、图片说明文字
- 六级标题样式（`.firstTitle` ~ `.sixthTitle`，1.0em~1.5em）
- 首字下沉（`.ftext`）、引用（`.conQuot`）、副标题（`.subHead`）
- 图片垂直居中（`wr-vertical-center-style`）、翻译行高
- 章节工具栏高度（`.book-chapter-tool`：78px）

#### `replaceForLatinLanguageBook.css`
拉丁语系书籍的排版样式。与 `replace.css` 类似，但标题使用 `Source Han Serif CN` 字体并加粗（而非 `SourceHanSerifCN-Medium` normal），适配西文排版习惯。

#### `replaceForMPChapter.css`
公众号文集（小文章）的排版样式。在 `replace.css` 基础上增加了：
- `.weread-page-relate` 跨页关联标记
- `.chapter-reward` 打赏区域（120px）
- `.chapter-tool` 工具栏（140px）
- `.re_bookItem` 书籍卡片间距
- `img[data-image-size="large"]` 大图全宽
- `.unsupported_iframe` 不支持控件的提示样式
- 强制清除 `<p>`、`<strong>`、`<span>`、`<section>` 的背景色

### 公众号专用样式

#### `MPExtra.css`
公众号文章的完整样式表（从微信 CSS 复制并修改）。包含：
- 微信 UI 组件样式（`.rich_media_*`、`.weui-*`）
- 小程序卡片样式（`.weapp_*`）
- GIF 图片播放提示
- 全局消息提示栏
- 对话框组件（`.weui-dialog`）
- 公众号音频播放器样式（`.audio_*`，含 Retina 适配）
- 被删公众号链接隐藏处理
- iPhone 横屏适配

#### `MediaPlatform.css`
公众号文章阅读的精简样式。覆盖微信原生样式中的关键属性：背景色、字号、行高、blockquote、QQ 音乐区域、分享图片等。主要用于非文集场景的公众号阅读。

#### `WREpubMPVideo.css`
腾讯视频播放器的自定义样式。完全重写视频控制器 UI：
- 自定义播放/暂停、全屏按钮图标（使用 CDN sprite 图）
- 进度条、时间显示器布局
- 隐藏广告和下载提示
- 响应式适配（iPhone 6/6P 尺寸）

### Style 子目录

#### `Style/style.css`
笔记/想法的编辑和展示样式（EPUB 基准 1em=16px）。定义：
- 编辑器容器（`.re`）基础样式
- 段落、标题、列表、blockquote 样式
- 书籍卡片组件（`.re_bookItem`，含 Retina 边框）
- 图片样式（`.re_img`、`.bodyPic`）
- QQ 表情样式
- 深色模式（`.re_Night`）

#### `Style/preview.css`
想法/笔记的预览样式。与 `style.css` 类似但适用于阅读展示场景，字号 18px，行高 30px，使用 `-apple-system` 字体。

#### `Style/normalize.css`
normalize.css v3.0.2（MIT License）。标准化各浏览器的默认样式差异。