Merge pull request #175 from griptape-ai:merge-black-forest-into-dev

Merge-black-forest-into-dev

README.md

@@ -104,6 +104,22 @@ You can previous and download more examples [here](examples/README.md).
 
 ## Recent Changelog
 
+### Nov 30, 2024
+* New Nodes:
+  * `Griptape Driver: Black Forest Labs Image Generation` - Now generate images with the incredible Flux models - `flux-pro-1.1`, `flux-pro`, `flux-dev`, and `flux-pro-1.1-ultra`. 
+    - Requires an API_KEY from Black Forest Labs (https://docs.bfl.ml/)
+    - Utilizes new Griptape Extension: https://github.com/griptape-ai/griptape-black-forest
+
+  ![Black Forest Labs - Create Image](examples/griptape_black_forest_labs_create_image.png)
+
+    - It also works with the `Griptape Create: Image Variation` node.
+
+    ![Black Forest Labs - Image Variation](examples/griptape_black_forest_labs_create_variation.png)
+
+  * `Griptape Create: Image Inpainting Variation` to the Griptape -> Image menu. Gives the ability to paint a mask and replace that part of the image.
+
+  ![Black Forest Labs - Inpainting](examples/griptape_black_forest_flux_inpainting.png)
+
 ### Nov 29, 2024
 * Iterating on configuration settings to improve compatibility with ComfyUI Desktop
 

__init__.py

@@ -118,6 +118,11 @@
     gtUIAzureOpenAiImageGenerationDriver,
 )
 
+# - BlackForest Labs
+from .nodes.drivers.gtUIBlackForestImageGenerationDriver import (
+    gtUIBlackForestImageGenerationDriver,
+)
+
 # - Cohere
 from .nodes.drivers.gtUICohereEmbeddingDriver import gtUICohereEmbeddingDriver
 from .nodes.drivers.gtUICoherePromptDriver import gtUICoherePromptDriver
@@ -357,6 +362,7 @@
     "Griptape Driver: Amazon Bedrock Stable Diffusion": gtUIAmazonBedrockStableDiffusionImageGenerationDriver,
     "Griptape Driver: Amazon Bedrock Titan": gtUIAmazonBedrockTitanImageGenerationDriver,
     "Griptape Driver: Azure OpenAI Image Generation": gtUIAzureOpenAiImageGenerationDriver,
+    "Griptape Driver: Black Forest Labs Image Generation": gtUIBlackForestImageGenerationDriver,
     "Griptape Driver: Leonardo.AI": gtUILeonardoImageGenerationDriver,
     "Griptape Driver: OpenAI Image Generation": gtUIOpenAiImageGenerationDriver,
     "Griptape Driver: OpenAI Compatible Image Generation": gtUIOpenAiCompatibleImageGenerationDriver,

examples/README.md

@@ -17,6 +17,26 @@ Uses `Griptape Load: Text` node to import a PDF of a robot resume, then the `Gri
 
 ![Profile Pic](pdf_to_profile_pic.png)
 Download: [pdf_to_profile_pic.png](pdf_to_profile_pic.png)
+## Black Forest Labs - Flux Pro 1.1 Image Generation
+Use Black Forest Labs Flux models with Griptape!
+
+![BFL Flux-Pro-1.1](griptape_black_forest_labs_create_image.png)
+Download: [griptape_black_forest_labs_create_image.png](griptape_black_forest_labs_create_image.png)
+
+## Black Forest Labs - Flux Pro 1.0-Canny - Image Variation
+
+Use Black Forest Labs Flux-Pro-1.0-canny with Griptape to create a variation on an image.
+
+![BFL flux-pro-1.0-canny](griptape_black_forest_labs_create_variation.png)
+Download: [griptape_black_forest_labs_create_variation.png](griptape_black_forest_labs_create_variation.png)
+
+## Black Forest Labs - Flux Pro 1.0-Fill - Image Inpainting
+
+Use Black Forest Labs Flux-Pro-1.0-fill with Griptape to perform inpainting on an image.
+
+![BFL flux-pro-1.0-fill](griptape_black_forest_flux_inpainting.png)
+Download: [griptape_black_forest_flux_inpainting.png](griptape_black_forest_flux_inpainting.png)
+
 
 ## Griptape Expert Photographers
 Use Agents as experts in their field to help provide feedback that will generate more advanced outputs. Utilizes multiple models - including Ollama running locally. If you don't have Ollama installed, feel free to use another `prompt_driver`.

js/NodesWithVisibilityToggles.js

@@ -4,8 +4,97 @@ import { formatAndDisplayJSON } from "./gtUIUtils.js";
 import { hideWidget, showWidget } from "./utils.js";
 import { app } from "../../../scripts/app.js";
 export function setupVisibilityToggles(nodeType, nodeData, app) {
-  // if (nodeData.name.includes("Black Forest Labs Image Generation")) {
-  //   setupBlackForestLabsImageGenerationNode(nodeType, nodeData, app);
-  // }
+  if (nodeData.name.includes("Black Forest Labs Image Generation")) {
+    setupBlackForestLabsImageGenerationNode(nodeType, nodeData, app);
+  }
 }
 
+function setupBlackForestLabsImageGenerationNode(nodeType, nodeData, app) {
+  const onNodeCreated = nodeType.prototype.onNodeCreated;
+  nodeType.prototype.onNodeCreated = function () {
+    const me = onNodeCreated?.apply(this);
+    const widget_model = this.widgets.find(
+      (w) => w.name === "image_generation_model"
+    );
+
+    const width_widget = this.widgets.find((w) => w.name === "width");
+    const height_widget = this.widgets.find((w) => w.name === "height");
+    const aspect_ratio_width_widget = this.widgets.find(
+      (w) => w.name === "aspect_ratio_width"
+    );
+    const aspect_ratio_height_widget = this.widgets.find(
+      (w) => w.name === "aspect_ratio_height"
+    );
+
+    const raw_widget = this.widgets.find((w) => w.name === "raw");
+    const guidance_widget = this.widgets.find((w) => w.name === "guidance");
+    const steps_widget = this.widgets.find((w) => w.name === "steps");
+    const interval_widget = this.widgets.find((w) => w.name === "interval");
+    const prompt_upsampling_widget = this.widgets.find(
+      (w) => w.name === "prompt_upsampling"
+    );
+    const image_prompt_strength_widget = this.widgets.find((w) => w.name === "image_prompt_strength");
+
+    // Hide both widgets
+    widget_model.callback = async () => {
+      hideWidget(this, width_widget);
+      hideWidget(this, height_widget);
+      hideWidget(this, aspect_ratio_width_widget);
+      hideWidget(this, aspect_ratio_height_widget);
+      hideWidget(this, raw_widget);
+      hideWidget(this, guidance_widget);
+      hideWidget(this, steps_widget);
+      hideWidget(this, interval_widget);
+      hideWidget(this, prompt_upsampling_widget);
+      hideWidget(this, image_prompt_strength_widget);
+
+      switch (widget_model.value) {
+        case "flux-pro-1.1-ultra":
+          showWidget(aspect_ratio_height_widget);
+          showWidget(aspect_ratio_width_widget);
+          showWidget(raw_widget);
+          showWidget(image_prompt_strength_widget);
+          break;
+        case "flux-pro-1.1":
+          showWidget(width_widget);
+          showWidget(height_widget);
+          showWidget(prompt_upsampling_widget);
+          break;
+        case "flux-pro":
+          showWidget(width_widget);
+          showWidget(height_widget);
+          showWidget(prompt_upsampling_widget);
+          showWidget(interval_widget);
+          showWidget(guidance_widget);
+          showWidget(steps_widget);
+          break;
+        case "flux-dev":
+          showWidget(width_widget);
+          showWidget(height_widget);
+          showWidget(guidance_widget);
+          showWidget(steps_widget);
+          showWidget(prompt_upsampling_widget);
+          break;
+        case "flux-pro-1.0-depth":
+        case "flux-pro-1.0-canny":
+          showWidget(guidance_widget);
+          showWidget(steps_widget);
+          showWidget(prompt_upsampling_widget);
+          break;
+        case "flux-pro-1.0-fill":
+          showWidget(guidance_widget);
+          showWidget(steps_widget);
+          showWidget(prompt_upsampling_widget);
+          break;
+        default:
+          break;
+      }
+      fitHeight(this, true);
+    };
+
+    setTimeout(() => {
+      widget_model.callback();
+    }, 5);
+    return me;
+  };
+}

js/griptape_api_keys.js

@@ -9,6 +9,8 @@ export const keys_organized = {
     "AMAZON_OPENSEARCH_INDEX_NAME",
   ],
   "Anthropic": ["ANTHROPIC_API_KEY"],
+  "BlackForest Labs": ["BFL_API_KEY"],
+
   "Microsoft Azure": [
     "AZURE_OPENAI_ENDPOINT",
     "AZURE_OPENAI_DALL_E_3_ENDPOINT",