Skip to content

Releases: maoruibin/SlideNote

v0.0.8.1 - 修复扩展更新后右键菜单失效

06 Feb 14:46
@maoruibin maoruibin
v0.0.8.1
1a80526

Choose a tag to compare

View all tags
v0.0.8.1 - 修复扩展更新后右键菜单失效 Latest
Latest

v0.0.8.1 - 修复补丁 (2025-02-06)

修复

  • 扩展更新后右键菜单失效：修复 Chrome Service Worker 更新后旧代码仍运行的问题，确保每次 Service Worker 启动时重新创建右键菜单

问题说明

从 v0.0.7 更新到 v0.0.8 的用户可能遇到网页摘录功能不工作的问题，这是因为 Chrome 扩展更新时 Service Worker 不会自动重启。此修复确保右键菜单在 Service Worker 每次启动时都会重新创建。

安装

下载 SlideNote-v0.0.8.1.zip 后：

  1. 解压缩
  2. 打开 Chrome 扩展管理页面 `chrome://extensions/`
  3. 开启「开发者模式」
  4. 点击「加载已解压的扩展程序」
  5. 选择解压后的文件夹

Slide notes, always by your side
侧边笔记，常伴左右

Assets 3
Loading

v0.0.8 - 网页摘录功能

05 Feb 16:47
@maoruibin maoruibin
v0.0.8
7dfd134

Choose a tag to compare

View all tags
v0.0.8 - 网页摘录功能

v0.0.8 更新日志

发布日期: 2025-01-29
版本: v0.0.8
状态: 开发中

一、版本概述

本版本的核心功能是 网页摘录 — 用户可以右键保存网页选中内容到 SlideNote，实现快速信息收集。

同时修复了多个 Bug，并进行了界面优化。

二、新增功能

2.1 右键菜单保存选中内容 ✨

功能描述：在任意网页选中文字后，右键菜单显示"保存到 SlideNote"选项，点击后自动保存到笔记。

产品定位：

  • 快速收集网页碎片信息
  • 不打断当前浏览流程
  • 按日期聚合，同一天的摘录在同一条笔记

使用方式：

  1. 在网页选中文字
  2. 右键 → 点击"保存到 SlideNote"
  3. 内容自动保存，显示成功通知

保存格式：

23:33

目前这块大家都在烧钱，阿里更加财大气粗一些。

来自：[微博正文 - 微博](https://weibo.com/...)

多条摘录格式（用 --- 分隔）：

23:33

目前这块大家都在烧钱...

来自：[微博正文 - 微博](https://weibo.com/...)

---

23:45

另一条摘录内容...

来自：[另一个页面](https://example.com)

限制：

  • 单次保存最大 3000 字符
  • 超过限制会提示"内容过长，请手动保存"

三、问题修复

3.1 夜间模式置顶笔记颜色问题 🔧

问题：夜间模式下置顶笔记使用硬编码的亮橙色（#fff9f0），导致背景过亮刺眼。

修复：为夜间模式定义专用颜色变量

元素 亮色模式 深色模式
背景 #fff9f0 #2d1f0f
悬停 #fff3e0 #3a2a14
选中 #ffe8cc #4a351a
竖条 #f59e0b #f59e0b

修改文件：src/sidepanel/styles.css

3.2 导航按钮置顶笔记问题 🔧

问题：右键菜单的"向上/向下/移到顶部/移到底部"按钮使用 state.notes.length 判断边界，但实际显示顺序是 getSortedNotes()（置顶笔记在前），导致边界判断错误。

修复：统一使用 getSortedNotes() 获取正确的笔记数量和顺序

修改文件：src/sidepanel/components/NoteList.js

3.3 Chrome 扩展报错 🔧

问题：在 chrome:// 页面点击插件图标时报错 Unchecked runtime.lastError: Cannot access a chrome:// URL

修复：在 background.js 中提前检查并忽略 chrome:// 页面

修改文件：src/background.js

3.4 编辑器 Header 固定问题 🔧

问题：笔记内容过长时，顶部的标题和导航按钮（上一篇/下一篇）会被顶出视野

原因：NoteEditor 组件和 app.js 中使用了相同的类名 note-content-section，导致嵌套布局样式冲突

修复：

  1. 将 NoteEditor 的容器类名改为 note-editor-wrapper
  2. 新增对应的 CSS 样式，确保 Header 固定，内容区域滚动

修改文件：

  • src/sidepanel/components/NoteEditor.js
  • src/sidepanel/styles.css

四、界面优化

4.1 简化右键菜单

移除：

  • ⇧ 移动到顶部
  • ⇩ 移到底部

保留：

  • ↑ 上移
  • ↓ 下移
  • 📌 置顶 / ○ 取消置顶
  • × 删除

理由：置顶功能已实现"放顶部"的需求，"移动到底部"很少使用

修改文件：

  • src/sidepanel/components/ContextMenu.js
  • src/sidepanel/components/NoteList.js

五、技术变更

5.1 新增权限

manifest.json / manifest.dev.json：

"permissions": [
  "storage",
  "sidePanel",
  "contextMenus",  // 新增：右键菜单
  "notifications"  // 新增：保存成功通知
]

5.2 国际化新增

新增文案（中英文）：

  • saveToSlideNote: 保存到 SlideNote / Save to SlideNote
  • savedToSlideNote: 已保存到 SlideNote / Saved to SlideNote
  • webSelectionsTitle: 网页摘录 / Web Selections
  • selectionTooLong: 内容过长，请手动保存 / Selection too long
  • storageFull: 存储空间不足 / Storage full

修改文件：

  • _locales/zh_CN/messages.json
  • _locales/en/messages.json

5.3 Background.js 重构

新增功能：

  • 创建右键菜单（chrome.contextMenus）
  • 处理菜单点击事件
  • 按日期聚合保存逻辑
  • 显示保存成功通知

核心逻辑：

// 保存到当天的"网页摘录"笔记
async function saveSelectionToDateNote(content, sourceTitle, sourceUrl) {
  const today = getTodayDateString(); // YYYY-MM-DD
  const dateNoteTitle = `${today} ${webSelectionsTitle}`;

  // 查找或创建今天的笔记
  let targetNote = notes.find(n => n.title === dateNoteTitle);
  // ... 追加或创建
}

六、文件变更清单

文件 类型 说明
manifest.json 修改 新增权限
manifest.dev.json 修改 新增权限
src/background.js 重写 添加右键菜单和保存逻辑
src/sidepanel/components/NoteEditor.js 修改 修复类名冲突
src/sidepanel/components/NoteList.js 修改 修复导航按钮边界判断；移除顶部/底部操作
src/sidepanel/components/ContextMenu.js 修改 移除移动到顶部/底部选项
src/sidepanel/styles.css 修改 深色模式置顶颜色；新增 note-editor-wrapper
_locales/zh_CN/messages.json 修改 新增文案
_locales/en/messages.json 修改 新增文案

七、测试验收

  • 右键菜单：选中文字后能显示"保存到 SlideNote"选项
  • 右键菜单：点击后笔记成功创建
  • 右键菜单：保存成功通知正常显示
  • 摘录格式：时间、内容、来源链接格式正确
  • 摘录聚合：同一天的摘录在同一条笔记中
  • 摘录分隔：多条摘录用 --- 正确分隔
  • 长度限制：超过 3000 字有提示
  • 夜间模式：置顶笔记颜色正常
  • 导航按钮：在置顶笔记间导航正常
  • 编辑器 Header：长内容时 Header 保持固定在顶部
  • 右键菜单：移除了"移动到顶部/底部"选项

八、已知问题

无

九、后续规划

  • 考虑添加摘录来源页面标题的智能截断
  • 考虑支持保存图片（右键图片）
  • 考虑摘录支持标签分类
Loading

v0.0.7

24 Jan 00:19
@maoruibin maoruibin
v0.0.7
bd8c159

Choose a tag to compare

View all tags
v0.0.7

🎉 SlideNote v0.0.7 发布

✨ 本期亮点

  • 📤📥 导入导出功能 - 数据备份与迁移
  • 📌 置顶功能 - 常用笔记快速访问（橙色主题）
  • ℹ️ 关于弹窗 - 产品信息展示
  • ⋯ 更多菜单 - 功能入口整合
  • 🛠️ 发布自动化系统

📝 更新内容

新增

  • 导入导出功能：支持 JSON 格式备份与恢复
  • 置顶笔记：右键菜单可置顶/取消置顶，置顶笔记显示橙色标识
  • 关于弹窗：显示版本信息、Slogan、作者信息、更多作品链接
  • Footer 更多菜单：整合导出、导入、反馈、GitHub、关于功能

优化

  • 置顶笔记排序优先
  • 橙色主题设计（#fff9f0 背景，#f59e0b 竖条）
  • 菜单交互优化（鼠标悬停触发）

修复

  • 导航按钮现在正确遵循置顶笔记的排序
  • 删除笔记后正确切换到下一条笔记

📥 安装方式

Chrome Web Store: 搜索「SlideNote」
手动安装: 下载 zip 包，解压后加载到 Chrome 扩展管理页面

链接

完整更新日志: CHANGELOG.md

Loading

v0.0.6

19 Jan 08:25
@maoruibin maoruibin
v0.0.6
9a0bc23

Choose a tag to compare

View all tags
v0.0.6

🌙 Dark Mode Release

New Features

  • 🌙 Dark Mode: Automatically follows system dark mode setting
    • Pure CSS implementation with @media (prefers-color-scheme: dark)
    • Seamless theme switching

Bug Fixes

  • 🐛 Fixed editor not updating after deleting a note
  • 🎨 Fixed social icons color not adapting in dark mode

Improvements

  • 🎨 Redesigned Toolbar
    • Borderless search/back buttons for cleaner look
    • New note button now fills the middle space
    • Unified button icon size to 16px
    • Balanced spacing on both sides

Technical Changes

  • Dark mode CSS variables system
  • Delete now emits note:select event via global bus
  • CSS filter for icon color adaptation in dark mode

Download: SlideNote-v0.0.6.zip

Contributors

media
Loading

v0.0.5

15 Jan 14:07
@maoruibin maoruibin
v0.0.5
5077c42

Choose a tag to compare

View all tags
v0.0.5

新增

  • 双击进入编辑模式：预览模式下双击内容区域即可进入编辑模式，交互更直观

优化

  • 产品名称显示：完整显示品牌「SlideNote 侧边笔记 常伴左右」
  • 英文名称优化：英文显示「SlideNote - Always by your side」
  • 开发体验优化：默认构建改为 dev 模式，发版本使用 npm run build:prod
  • 交互提示：预览区鼠标指针改为 pointer，提示可双击编辑

Simple notes, always by your side
侧边笔记，常伴左右

Full Changelog: https://github.com/maoruibin/SlideNote/commits/v0.0.5

Loading