# 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.