# browser-snopt

**Repository Path**: moty/browser-snopt

## Basic Information

- **Project Name**: browser-snopt
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2026-06-22
- **Last Updated**: 2026-06-23

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# Browser Snopt

网页截图工具扩展 — 支持可见区域截图、长截图、选区截图，内置图片编辑器。

## 安装

### 方式 1：开发者模式加载

1. 打开 Chrome 浏览器，访问 `chrome://extensions/`
2. 右上角开启「开发者模式」
3. 点击「加载已解压的扩展程序」
4. 选择本项目目录

### 方式 2：Chrome for Testing（命令行）

```bash
path/to/chrome --load-extension="/path/to/browser-snopt"
```

> Google Chrome stable 149+ 不支持 `--load-extension` 参数，需要用 Chrome for Testing 或手动加载。

## 使用

页面右侧边缘出现蓝色浮动按钮：

| 操作 | 说明 |
|------|------|
| 悬停按钮 | 展开截图面板 |
| 截图可见区域 | 捕获当前视口 |
| 长截图 | 自动滚动拼接全页 |
| 选区截图 | 拖拽选择区域后自动裁剪 |

也可点击 Chrome 工具栏扩展图标使用 popup 触发。

## 编辑器

截图后自动打开编辑器：

| 工具栏 | 快捷键 |
|--------|--------|
| 保存 / 复制 | `Ctrl+S` |
| 裁剪 / 矩形 / 箭头 / 文字 / 马赛克 | — |
| 撤销 / 重做 | `Ctrl+Z` / `Ctrl+Shift+Z` 或 `Ctrl+Y` |
| 删除选中标注 | `Delete` 或 `Backspace` |
| 取消当前工具 | `Esc` |

选中已放置的标注（矩形/箭头/文字/马赛克）后可拖拽移动。

## 项目结构

```
browser-snopt/
├── manifest.json            # MV3 配置文件
├── background/
│   └── service-worker.js    # 后台服务，处理截图/下载/编辑器消息
├── content_scripts/
│   ├── screenshot-core.js   # 三种截图模式核心逻辑
│   ├── floating.js          # 浮动按钮和面板 UI
│   └── floating.css         # 浮动按钮与选区样式
├── editor/
│   ├── editor.html          # 编辑器页面
│   ├── editor.js            # Canvas 编辑器（标注/裁剪/模糊/撤销）
│   └── editor.css           # 编辑器暗色主题样式
├── popup/
│   ├── popup.html           # 扩展弹出菜单
│   ├── popup.js             # popup 交互逻辑
│   └── popup.css            # popup 样式
└── icons/
    └── icon.svg             # 扩展图标
```

## 权限说明

| 权限 | 用途 |
|------|------|
| `activeTab` | 捕获当前标签页截图 |
| `scripting` | 向页面注入内容脚本 |
| `downloads` | 保存截图到本地 |
| `storage` | 传递截图数据到编辑器 |
| `host_permissions` `<all_urls>` | 在所有页面注入浮动按钮 |