53db325bb2
- Create image.php script for generating bubble images - Add example usage HTML page for testing - Update README with documentation - Support multiple bubble styles - Gracefully handle missing fonts 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
76 lines
2.5 KiB
Markdown
76 lines
2.5 KiB
Markdown
# SillyBubble Chat Bubble Generator
|
|
|
|
SillyBubble is a package that includes both a SillyTavern extension for generating chat bubble images from AI responses and a PHP script for rendering those bubbles.
|
|
|
|
## Components
|
|
|
|
1. **SillyTavern Extension**: JavaScript extension that registers a function tool for AIs to generate bubble images
|
|
2. **PHP Image Generator**: Server-side script that creates the actual images
|
|
|
|
## Chat Bubble Image Generator (image.php)
|
|
|
|
The `image.php` script is a standalone PHP application that generates chat bubble images from text. It uses the GD library to create PNG images dynamically.
|
|
|
|
### Requirements
|
|
|
|
- PHP 7.0+ with GD extension enabled
|
|
- Web server (Apache, Nginx, etc.)
|
|
|
|
### Usage
|
|
|
|
The script accepts the following GET parameters:
|
|
|
|
- `q`: The text to display (URL-encoded)
|
|
- `style`: (Optional) The bubble style: `default`, `modern`, `retro`, or `minimal`
|
|
|
|
Example URLs:
|
|
```
|
|
image.php?q=Hello%20World
|
|
image.php?q=Hello%20World&style=modern
|
|
```
|
|
|
|
### Styles
|
|
|
|
The image generator comes with several built-in styles:
|
|
|
|
- **default**: Light gray background with dark text
|
|
- **modern**: Blue background with white text
|
|
- **retro**: Yellow background with dark text
|
|
- **minimal**: White background with black text and no rounded corners
|
|
|
|
### Integrating with SillyBubble Extension
|
|
|
|
1. Place the `image.php` script on your web server
|
|
2. Configure the SillyBubble extension to use the correct URL to your image.php script
|
|
3. In the extension settings, set the "Image Service URL" to the path to your image.php script
|
|
|
|
### Customizing
|
|
|
|
You can customize the styles by editing the `$styles` array in the PHP script. Each style has parameters for:
|
|
|
|
- `bg_color`: Background color [R, G, B]
|
|
- `text_color`: Text color [R, G, B]
|
|
- `border_color`: Border color [R, G, B]
|
|
- `padding`: Padding around the text
|
|
- `rounded`: Corner radius (0 for square corners)
|
|
- `font_size`: Text size
|
|
- `max_width`: Maximum bubble width
|
|
- `line_height`: Spacing between lines
|
|
- `font`: Path to a TTF font file
|
|
|
|
### Fonts
|
|
|
|
The script will look for TTF fonts in the `fonts` directory. If no fonts are found, it will fall back to using the built-in GD fonts.
|
|
|
|
To add custom fonts:
|
|
1. Create a `fonts` directory in the same location as the script
|
|
2. Add `.ttf` font files to this directory
|
|
3. Update the font paths in the `$styles` array if needed
|
|
|
|
## Example/Demo Page
|
|
|
|
The included `example-usage.html` file provides a simple interface for testing the image generator with different styles and messages.
|
|
|
|
## License
|
|
|
|
This project is licensed under the MIT License. |