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.