☰

GlanceBrief: Instant Multi-AI Article Summarizer

Instant multi-AI article summarizer

当前为 2025-05-04 提交的版本，查看 最新版本。

作者
gumob
评分
0 0 0
版本
0.1.0
创建于
2025-05-03
更新于
2025-05-04
大小
37.3 KB
许可证
暂无
适用于
所有网站

GlanceBrief

A userscript that adds AI-powered summarization to any webpage. Uses OpenAI's ChatGPT, Google's Grok, Anthropic's Claude, or Google's Gemini with custom prompts.

Overview

This project is a repository for developing a Tampermonkey script that summarizes web page content using AI, built with TypeScript and vanilla JavaScript. The script adds a floating button to web pages that allows users to quickly generate summaries of the content using various AI services.

Features

  • Single floating button for AI summarization
  • Support for multiple AI services:
    • OpenAI ChatGPT
    • Google Grok
    • Anthropic Claude
    • Google Gemini
  • No API key required - Uses built-in AI capabilities
  • Customizable prompts with variables support:
    • {title} - Page title
    • {content} - Page content
    • {url} - Page URL
  • Theme options:
    • System (follows system preference)
    • Light mode
    • Dark mode
  • Configurable button position (8 positions)
  • Option to open summaries in new tab or current tab

Development Environment Setup

Requirements

  • Node.js (v20.17.31 or higher)
  • pnpm (v10.9.0)

Installing Dependencies

pnpm install

Development

# Start development server with hot reload
pnpm dev

# Run linting
pnpm lint

# Run formatting
pnpm format

Building the Tampermonkey Script

# Build for production
pnpm build

# Build for development
pnpm build:dev

The build process will generate the userscript in the dist directory.

Project Structure

src/                          # Source directory
├── assets/                   # Static assets
├── components/               # UI Components
├── services/                 # Business logic services
├── ui/                       # UI utilities
├── constants.ts              # Constant values and configurations
├── index.ts                  # Entry point
├── meta.ts                   # Userscript metadata
├── styles.ts                # CSS styles
├── types.ts                 # Type definitions
└── utils.ts                 # Utility functions

Settings

Theme Options

  • System (follows system preference)
  • Light
  • Dark

AI Service Configuration

  • OpenAI ChatGPT
  • Google Grok
  • Anthropic Claude
  • Google Gemini

Button Position

8 configurable positions:

  • Top Left
  • Top Center
  • Top Right
  • Middle Left
  • Middle Right
  • Bottom Left
  • Bottom Center
  • Bottom Right

Customization Options

  • Custom prompt templates with variable support
  • Summary display preferences (new tab/current tab)
  • UI theme customization

Development

Scripts

  • pnpm dev: Start development server
  • pnpm build: Production build
  • pnpm build:dev: Development build
  • pnpm lint: Run ESLint
  • pnpm format: Run Prettier
  • pnpm clean: Clean build artifacts

Technology Stack

For detailed information about the technology stack, please refer to TECHNOLOGSTACK.md.

Directory Structure

For detailed information about the project structure, please refer to DIRECTORYSTRUCTURE.md.

License

MIT

Author

Kojiro Futamura [email protected]

QingJ © 2025

镜像随时可能失效，请加Q群300939539或关注我们的公众号极客氢云获取最新地址