updated for comfyui desktop and other ui updates

playbooks/core/comfyui-image-gen/README.md

@@ -13,11 +13,11 @@ SPDX-License-Identifier: MIT
 
 ComfyUI is a powerful, node-based interface for Stable Diffusion and other diffusion models. Unlike traditional text-to-image interfaces with simple prompt boxes, ComfyUI exposes the entire image generation pipeline as a visual graph, giving you fine-grained control over every step from text encoding to latent space manipulation to final decoding.
 
-This tutorial teaches you how to use ComfyUI with the Z Image Turbo model on your STX Halo™ GPU to generate high-quality AI images.
+This tutorial teaches you how to use ComfyUI with the Z-Image Turbo model on your STX Halo™ GPU to generate high-quality AI images.
 
 ## What You'll Learn
 
-- How to launch ComfyUI and load the Z Image Turbo template
+- How to launch ComfyUI and load the Z-Image Turbo template
 - Understanding diffusion pipeline components
 - Generating images and tuning generation parameters
 - Saving and sharing workflows
@@ -262,6 +262,37 @@ echo "OK: ComfyUI server is reachable!"
 
 ## Launching ComfyUI
 
+<!-- @device:halo_box -->
+<!-- @os:windows -->
+To launch ComfyUI on Windows, click the ComfyUI Desktop Launcher which is found on your Desktop. You will see the following page:
+
+<p align="center">
+  <img src="assets/installer.png" alt="Templates button in the left toolbar" width="600"/>
+</p>
+
+Click `Install ComfyUI` and follow the steps. Choose `AMD` as the version and use default install locations. When finished, you should see the following:
+
+<p align="center">
+  <img src="assets/installed.png" alt="Templates button in the left toolbar" width="600"/>
+</p>
+
+Click the blue `Launch` button to open ComfyUI in its own window.
+
+
+<!-- @os:end -->
+
+<!-- @os:linux -->
+To launch ComfyUI on Linux, click the ComfyUI shortcut in the taskbar. It should open by itself in a browser window.
+
+> Alternatively,
+> 1. Use the terminal to navigate to `/usr/local/bin/ComfyUI/` (or to the appropriate folder if installed manually)
+> 2. Run `python3 main.py --use-pytorch-cross-attention`
+> 3. The interface is accessible at `http://127.0.0.1:8188`. Keep the terminal window open while using ComfyUI.
+
+<!-- @os:end -->
+<!-- @device:end -->
+
+<!-- @device:halo,stx,krk,rx7900xt,rx9070xt -->
 <!-- @os:windows -->
 To launch ComfyUI on Windows, simply click the ComfyUI shortcut on your Desktop.
 <!-- @os:end -->
@@ -277,10 +308,12 @@ ComfyUI starts a local web server. Open your browser to `http://127.0.0.1:8188`
 
 > **Tip**: Keep the terminal window open while using ComfyUI. Closing it will stop the server.
 <!-- @os:end -->
+<!-- @device:end -->
+
 
-## Finding the Z Image Turbo Template
+## Finding the Z-Image Turbo Template
 
-Before generating images, you need to load the Z Image Turbo template. Here's how to find it:
+Before generating images, you need to load the Z-Image Turbo template. Here's how to find it:
 
 1. **Look at the far left edge of the screen**—there's a vertical toolbar running from top to bottom on the leftmost side of the app.
 
@@ -292,10 +325,10 @@ Before generating images, you need to load the Z Image Turbo template. Here's ho
 
 3. **Click the folder icon**—this opens the Templates panel.
 
-4. **Search for "Z Image Turbo"**—use the search bar or scroll through the available templates to find the Z Image Turbo Text To  Image workflow, then click to load it.
+4. **Search for "Z-Image Turbo"**—use the search bar or scroll through the available templates to find the Z-Image Turbo Text To  Image workflow, then click to load it.
 
 <p align="center">
-  <img src="assets/select-template.png" alt="Selecting the Z Image Turbo template" width="600"/>
+  <img src="assets/select-template.png" alt="Selecting the Z-Image Turbo template" width="600"/>
 </p>
 
 ## Downloading Models
@@ -304,39 +337,44 @@ Before generating images, you need to load the Z Image Turbo template. Here's ho
 
 ## Understanding the Interface
 
-When the Z Image Turbo template loads, you'll see a canvas with connected nodes. Each node represents an operation in the diffusion pipeline:
+When the Z-Image Turbo template loads, you'll see a canvas with 2 main nodes. The first node is called 'Text to Image (Z-Image-Turbo), and the second node is for viewing the image. 
 
 <p align="center">
-  <img src="assets/understanding-workflow.png" alt="ComfyUI Workflow Interface" width="600"/>
+  <img src="assets/zimagenode.png" alt="ComfyUI Main Node" width="600"/>
+</p>
+
+
+On the Z-Image node, click the top right button to expand the Node and see the subgraph.
+
+<p align="center">
+  <img src="assets/subgraph_good.png" alt="ComfyUI Node Subgraph" width="600"/>
 </p>
 
 ### Pipeline Components
 
-The Z Image Turbo workflow uses four key model components that work together:
+The Z-Image Turbo workflow uses four key model components that work together:
 
 | Component | Role |
 |-----------|------|
 | **Text Encoder** (Qwen 3 4B) | Converts your text prompt into embeddings the diffusion model understands |
-| **Diffusion Model** (Z Image Turbo) | The core neural network that iteratively denoises latent representations into images |
+| **Diffusion Model** (Z-Image Turbo) | The core neural network that iteratively denoises latent representations into images |
 | **VAE** (Variational Autoencoder) | Encodes images to/from latent space (decodes the final latents into pixels) |
 | **LoRA** (optional) | Lightweight adapters that modify style or subject without retraining the base model |
 
 Each node in the workflow corresponds to one of these components. Data flows left-to-right: text → embeddings → guided denoising → latents → final image.
 
 ## Generating Your First Image
 
-The Z Image Turbo model is already loaded. To generate an image:
-
-1. **Find the CLIP Text Encode node** labeled "Step 3" (your main prompt)
-2. **Enter your prompt**: be specific and descriptive:
+The Z-Image Turbo model is already loaded. To generate an image:
 
+1. **Enter your prompt** in the main Z-Image Node. Be descriptive. Here is an example:
    ```
    A photorealistic red fox sitting in a snowy forest clearing, 
    morning light filtering through pine trees, 
    detailed fur texture, bokeh background
    ```
-
-3. **Click the "Run Workflow"** in upper right corner (or press `Ctrl+Enter`)
+2. **(Optional)**: Confirm or tweak any other specific settings within the subgraph.
+3. **Click the blue "Run Workflow"** in the right corner (or press `Ctrl+Enter`)
 4. Watch the nodes highlight as each step executes
 
 The entire workflow execution should complete in less than 30 seconds. Your generated image appears in the **Save Image** node and is saved to the `output/` folder.
@@ -517,7 +555,7 @@ ls -1t ComfyUI/output/*.png | head -n 5
 
 The KSampler node controls the core diffusion process:
 
-| Parameter | What It Controls | Recommended for Z Image Turbo |
+| Parameter | What It Controls | Recommended for Z-Image Turbo |
 |-----------|------------------|-------------------------------|
 | **steps** | Number of denoising iterations | 4–10 (turbo models are distilled for fewer steps) |
 | **cfg** | Classifier-free guidance scale—how closely to follow the prompt | 1.0–2.0 (turbo models use very low guidance) |
@@ -531,7 +569,7 @@ To adjust output dimensions, find the **Empty Latent Image** node and modify **w
 
 ### ModelSamplingAuraFlow
 
-The **ModelSamplingAuraFlow** node is a specialized sampling modifier that adjusts how the diffusion process handles noise scheduling. You'll see this node connected to the model output in the Z Image Turbo workflow.
+The **ModelSamplingAuraFlow** node is a specialized sampling modifier that adjusts how the diffusion process handles noise scheduling. You'll see this node connected to the model output in the Z-Image Turbo workflow.
 
 | Parameter | What It Controls | Recommended Values |
 |-----------|------------------|-------------------|
@@ -542,7 +580,7 @@ When to adjust **shift**:
 - **Lower values (1.0–2.0)**: Faster convergence, good for simple compositions
 - **Higher values (3.0–4.0)**: More gradual refinement, can improve fine details in complex scenes
 
-The AuraFlow sampling method is specifically designed for flow-matching models like Z Image Turbo, ensuring proper noise distribution throughout the generation process.
+The AuraFlow sampling method is specifically designed for flow-matching models like Z-Image Turbo, ensuring proper noise distribution throughout the generation process.
 
 ## Working with Workflows
 
@@ -556,7 +594,7 @@ Click the **Save** button in the menu to export your workflow as a JSON file. Th
 
 ### Loading Workflows
 
-Drag a workflow JSON file onto the canvas, or use **Load** from the menu. The Z Image Turbo workflow you see by default is loaded from a saved workflow file.
+Drag a workflow JSON file onto the canvas, or use **Load** from the menu. The Z-Image Turbo workflow you see by default is loaded from a saved workflow file.
 
 ### Sharing Workflows
 

playbooks/dependencies/comfyui_models.md

@@ -7,7 +7,7 @@ SPDX-License-Identifier: MIT
 ### ComfyUI Models
 
 If you previously deleted pre-downloaded ComfyUI models or want to download those for the first time, simply press the `Download` button on each of the models when prompted that missing models have been detected.
-
+You may need to manually place the model files in the correct locations. 
 
 <p align="center">
   <img src="/api/dependencies/assets/comfy_download.png" alt="ComfyUI Download Models" width="600"/>

website/src/app/playbooks/[id]/page.tsx

@@ -12,7 +12,7 @@
 import ImageLightbox from "@/components/ImageLightbox";
 import CodeLightbox from "@/components/CodeLightbox";
 import type { Playbook, Platform, Device, DeviceCategory, TestCoverageInfo, TestResultInfo } from "@/types/playbook";
 import { formatTime, DEVICE_IDS, deviceNames, extractPlatforms, extractDevices, extractCategories, extractCategoryDevices, DEVICE_CATEGORY_MAP, categoryForDevice } from "@/types/playbook";
 
 // Global store for dropdown states - persists across re-renders without causing them
 const dropdownStateStore: Record<string, boolean> = {};
@@ -596,11 +596,16 @@
  * Tags supported:
  * <!-- @device:halo --> ... <!-- @device:end -->
  * <!-- @device:halo,stx --> ... <!-- @device:end -->
+ * <!-- @device:halo_box --> ... <!-- @device:end -->
  * <!-- @device:all --> ... <!-- @device:end -->
+ *
+ * @param devices - Active device identifiers for the current selection.
+ *   When the "reference" category is active with "halo", this includes
+ *   both "halo" and "halo_box" so that halo_box-specific blocks render.
  */
-function filterContentByDevice(content: string, device: Device | null): string {
+function filterContentByDevice(content: string, devices: string[]): string {
   if (!content) return "";
-  if (!device) return content;
+  if (devices.length === 0) return content;
 
   const innerDevicePattern = /<!-- @device:([\w,]+) -->((?:(?!<!-- @device:[\w,]+ -->|<!-- @device:end -->)[\s\S])*?)<!-- @device:end -->/g;
 
@@ -610,7 +615,7 @@
   do {
     prev = result;
     result = result.replace(innerDevicePattern, (_fullMatch, blockDevices: string, blockContent: string) => {
-      if (blockDevices === "all" || blockDevices.split(",").includes(device)) {
+      if (blockDevices === "all" || blockDevices.split(",").some(d => devices.includes(d))) {
         return blockContent;
       }
       return "";
@@ -1390,18 +1395,19 @@
     }
   }, [coverageViewActive, selectedTestDevice]);
 
-  const preinstalledDevice: string | null =
-    selectedCategory === "reference" && selectedDevice === "halo"
-      ? "halo_box"
-      : selectedDevice;
+  const isReferenceHalo = selectedCategory === "reference" && selectedDevice === "halo";
+  const preinstalledDevice: string | null = isReferenceHalo ? "halo_box" : selectedDevice;
+
+  const activeDevices: string[] = selectedDevice ? [selectedDevice] : [];
+  if (isReferenceHalo) activeDevices.push("halo_box");
 
   // Transform relative image paths to API routes, filter by OS/device, and transform preinstalled/setup blocks
   const filteredContent = playbook?.content
     ? transformSetupBlocks(
         transformPreinstalledBlocks(
           filterContentByDevice(
             filterContentByOS(playbook.content, selectedPlatform),
-            selectedDevice
+            activeDevices
           ),
           selectedPlatform,
           preinstalledDevice