🚨 REQUIRED SETUP: You MUST add the following to your system prompt or character card:
-
You have access to a function called generateChatBubbleImage(text, character, bubble_type, style) that creates character-styled chat bubbles.
+
🚨 REQUIRED SETUP: You MUST add one of the following to your system prompt or character card (depending on your settings):
+
+
If "Let AI choose character" is disabled (default):
+
You have access to a function called generateChatBubbleImage(text, bubble_type) that creates styled chat bubbles.
+
+The function parameters are:
+- text: The text to display in the chat bubble (required string)
+- bubble_type: The type of bubble to use (optional string: "speech" or "thought")
+
+When you want to create a chat bubble, call this function with the text you want to display.
+Example usage:
+generateChatBubbleImage("Hello world!")
+generateChatBubbleImage("I'm thinking...", "thought")
+
+
If "Let AI choose character" is enabled:
+
You have access to a function called generateChatBubbleImage(text, character, bubble_type) that creates character-styled chat bubbles.
The function parameters are:
- text: The text to display in the chat bubble (required string)
- character: The character to use for the bubble (optional string: "Example", "Bianca", etc.)
- bubble_type: The type of bubble to use (optional string: "speech" or "thought")
-- style: Legacy parameter for visual style (optional string: "default", "modern", "retro", or "minimal")
When you want to create a chat bubble, call this function with the text you want to display.
Example usage:
generateChatBubbleImage("Hello world!")
generateChatBubbleImage("Hello from Bianca", "Bianca")
-generateChatBubbleImage("I'm thinking...", "Example", "thought")
-generateChatBubbleImage("Hello in retro style", null, null, "retro")
ALTERNATIVE: If the AI can't call the function directly, you can instruct it to respond with Markdown formatted like this:
diff --git a/index.js b/index.js
index 146b90c..52dd9bf 100644
--- a/index.js
+++ b/index.js
@@ -13,7 +13,8 @@ const defaultSettings = {
default_character: "Example",
default_bubble_type: "speech",
enabled: true,
- render_in_collapse: true // Setting to enable/disable rendering in collapsed tool calls
+ render_in_collapse: true, // Setting to enable/disable rendering in collapsed tool calls
+ use_character_param: false // Whether to expose the character parameter to the AI
};
// Make sure settings exist
@@ -87,6 +88,7 @@ function loadSettings() {
$("#sillybubble_default_character").val(extension_settings[extensionName].default_character).trigger("input");
$("#sillybubble_default_bubble_type").val(extension_settings[extensionName].default_bubble_type).trigger("input");
$("#sillybubble_render_in_collapse").prop("checked", extension_settings[extensionName].render_in_collapse).trigger("input");
+ $("#sillybubble_use_character_param").prop("checked", extension_settings[extensionName].use_character_param).trigger("input");
}
// Handle enable/disable toggle
@@ -142,18 +144,36 @@ function onRenderInCollapseInput(event) {
processToolCallMessages();
}
+// Handle use character parameter toggle
+function onUseCharacterParamInput(event) {
+ const value = Boolean($(event.target).prop("checked"));
+ extension_settings[extensionName].use_character_param = value;
+ saveSettingsDebounced();
+
+ // Re-register the function tool with updated schema when the setting is toggled
+ registerFunctionTool();
+}
+
// Test function to visualize a bubble
function onTestButtonClick() {
const testText = "This is a test chat bubble generated by SillyBubble!";
- const character = extension_settings[extensionName].default_character;
+ const useCharParam = extension_settings[extensionName].use_character_param;
+ const character = useCharParam ? extension_settings[extensionName].default_character : null;
const bubbleType = extension_settings[extensionName].default_bubble_type;
const markdown = generateChatBubbleImage(testText, null, character, bubbleType);
+
+ // Determine what parameters to display in the test popup
+ let paramInfo = `
Using bubble type: ${bubbleType}
`;
+ if (useCharParam) {
+ paramInfo = `
Using character: ${character}, bubble type: ${bubbleType}
`;
+ }
+
const testPopup = `
Generated Markdown:
${markdown.replace(//g, '>')}
-
Using character: ${character}, bubble type: ${bubbleType}
+ ${paramInfo}
Preview (if connected to image service):
${markdown}
@@ -173,28 +193,37 @@ function registerFunctionTool() {
// Check if registerFunctionTool exists in context
if (typeof context.registerFunctionTool === 'function') {
+ // Create properties object for schema
+ const properties = {
+ text: {
+ type: 'string',
+ description: 'The text to display in the chat bubble'
+ },
+ bubble_type: {
+ type: 'string',
+ description: 'The type of bubble to use (speech, thought). Defaults to speech.'
+ }
+ };
+
+ // Only add character parameter if enabled in settings
+ if (extension_settings[extensionName].use_character_param) {
+ properties.character = {
+ type: 'string',
+ description: 'The character to display (Example, Bianca, etc.). Each character has its own bubble style.'
+ };
+ }
+
+ // Always include style parameter for backward compatibility
+ properties.style = {
+ type: 'string',
+ description: 'Legacy parameter: The visual style of the chat bubble (default, modern, retro, minimal).'
+ };
+
// Define parameter schema following JSON schema format
const bubbleSchema = Object.freeze({
$schema: 'http://json-schema.org/draft-04/schema#',
type: 'object',
- properties: {
- text: {
- type: 'string',
- description: 'The text to display in the chat bubble'
- },
- style: {
- type: 'string',
- description: 'Legacy parameter: The visual style of the chat bubble (default, modern, retro, minimal). Prefer using character parameter instead.'
- },
- character: {
- type: 'string',
- description: 'The character to display (Example, Bianca, etc.). Each character has its own bubble style.'
- },
- bubble_type: {
- type: 'string',
- description: 'The type of bubble to use (speech, thought). Defaults to speech.'
- },
- },
+ properties: properties,
required: ['text']
});
@@ -202,11 +231,15 @@ function registerFunctionTool() {
context.registerFunctionTool({
name: 'generateChatBubbleImage',
displayName: 'Chat Bubble Image',
- description: 'Creates a markdown image link with the text displayed as a character-styled chat bubble. Use when you want to visually style messages or display text in a speech or thought bubble.',
+ description: 'Creates a markdown image link with the text displayed as a styled chat bubble. Use when you want to visually style messages or display text in a speech or thought bubble.',
parameters: bubbleSchema,
action: async (args) => {
if (!args?.text) return '';
- return generateChatBubbleImage(args.text, args.style, args.character, args.bubble_type);
+
+ // Only pass character if the setting is enabled
+ const character = extension_settings[extensionName].use_character_param ? args.character : null;
+
+ return generateChatBubbleImage(args.text, args.style, character, args.bubble_type);
},
formatMessage: () => '',
});
@@ -439,6 +472,7 @@ jQuery(async () => {
$("#sillybubble_default_character").on("input", onDefaultCharacterInput);
$("#sillybubble_default_bubble_type").on("input", onDefaultBubbleTypeInput);
$("#sillybubble_render_in_collapse").on("input", onRenderInCollapseInput);
+ $("#sillybubble_use_character_param").on("input", onUseCharacterParamInput);
$("#sillybubble_test_button").on("click", onTestButtonClick);
// Initial attempt to register the function tool