how to report a bug and more docs

README.md

@@ -1,23 +1,31 @@
 # CG Image Filter
 
-A set of four nodes designed to pause execution of the workflow to allow you to make selections and/or edits before continuing.
+---
+
+**If you are reporting a bug, please read [how to report a bug well](#how-to-report-a-bug-well) first!**
+
+---
+
+A set of nodes designed to pause execution of the workflow to allow you to make selections and/or edits before continuing.
 There's an example workflow that illustrates all of them at the end.
 
 - ['Image Filter'](#image-filter) - pause the flow and pick which images from a set you want to proceed with
 - ['Mask Image Filter'](#mask-image-filter) - launch the mask editor for the image, and return the image and mask
-- ['Text Image Filter'](#text-image-filter) - show the image with some editable text which is returned
 - ['Text Image Filter with Extras'](#text-image-filter-with-extras) - as 'Text Image Filter' but with three extra single line texts fields that are also returned
 
-*Update* 'Text Image Filter' and 'Text Image Filter with Extras' are now identical, and the extra text fields have been added to 'Image Filter' as well
+There are also some helper nodes.
 
-There's also a helper node, 'Split String by Commas' that can be used if you want more extra values.
+If you prefer trying a workflow to reading docs, use of the nodes is illustrated in this seahorse (drag the image into Comfy):
 
-*New in 1.2*
+<img src="https://github.com/chrisgoringe/cg-image-filter/raw/main/images/seahorse.png" alt="Seahorse" width="200" height="200">
+
+
+## New in 1.2 ##
 
 - Options have all moved to the main settings
 - New option to show a miniature window instead of taking over the screen - click on it to go into full screen mode
 
-*New in 1.1.6* 
+## New in 1.1.6 ## 
 
 - `Pick from List` to allow you to select matching items from any list
 - `Batch from Image List` and `Image List from Batch` to work with image batches
@@ -37,11 +45,13 @@ There's also a helper node, 'Split String by Commas' that can be used if you wan
 
 ![image](images/options.png)
 
-- **AutosendIdentical** In the ImageFilter node, if all images are identical (including if there is just one image) then send
+- `AutosendIdentical` In the ImageFilter node, if all images are identical (including if there is just one image) then send
 an image without user interaction. 
-- **ClickSends** In the ImageFilter node, clicking an image sends it instead of selecting it. Useful if you know you only ever want to send one image at most.
-- **PlaySound** Play a 'ding' sound when any of the filter nodes becomes active.
-- **SmallWindow** Instead of taking over the whole screen immediately, display a tiny version of the image in the top left. Click that image to go into the full screen mode.
+- `ClickSends` In the ImageFilter node, clicking an image sends it instead of selecting it. Useful if you know you only ever want to send one image at most.
+- `PlaySound` Play a 'ding' sound when any of the filter nodes becomes active.
+- `SmallWindow` Instead of taking over the whole screen immediately, display a tiny version of the image in the top left. Click that image to go into the full screen mode.
+
+---
 
 ## Image Filter
 
@@ -66,11 +76,6 @@ Here's a simple use: generate a batch of images and pick which ones you want to
 
 ![workflow](images/workflow.png)
 
-### Checkboxes
-
-- 'Click to send': clicking an image also sends it
-- 'autosend one if identical': automatically send a single image if all the images are identical
-
 ### Optional inputs
 
 The Latent and Mask inputs are optional. If used, they should have the same number of latents (or masks) as the image batch, 
@@ -78,6 +83,8 @@ and the latents (or masks) corresponding to the selected images will be output.
 select from a batch of images, but the next stage uses the latent - that way you avoid the decode-recode loss, or if you want
 to pick a mask (perhaps from options automatically generated)
 
+Other things (like prompts, segs etc.) that have been used can be selected using the `Pick from List` helper node.
+
 ---
 
 ## Mask Image Filter
@@ -115,13 +122,23 @@ generated. Here's a trivial workflow:
 
 'Text Image Filter' and 'Image Filter', each provide three extra text fields, intended for short form - like specifying the denoising you want on the next step, or a prefix to save the file with.
 
-Some helpers are provided - a node that splits a string by a divider, and nodes to convert the string to an int or a float.
-
 If you use the optional 'tip' input, the contents will be displayed under the extras input fields, so you can remind yourself what they are for!
 
 ---
 
-## Pick from List
+## Helper Nodes
+
+### String handling
+
+- `Split String by Commas` allows you to split a text string into up to five pieces, splitting on `,`, `|`, or `^`. It also strips whitespace, so that the strings can be easily parsed, especially by...
+- `String to Int` and `String to Float` convert a string to an int or a float, with a fallback default 
+
+Together, these nodes allow you to specify lots of information in the `extras` fields. For instance, if doing an inpaint, you might have an extras field that takes the format `0.4, 20` meaning 'denoise 0.4, 20 steps'. Split the string, feed the pieces into the converters, and feed that into other nodes. Like this:
+
+![extras](images/extras.png)
+
+
+### Pick from List
 
 The `Image Filter` node outputs a string, `indexes`, which is a comma separated list of the indexes (0 based) of the images selected. Connect this to a `Pick from List` node, and connect a list of anything to the `anything` input, and the `Pick from List` node will output a list corresponding to the selected images.
 
@@ -133,7 +150,7 @@ So something like this:
 
 ---
 
-## Batch and List
+### Batch <-> List
 
 If you are using lists, each node will run once for each list. This means that normally you will want a single batch of images for the `Image Filter` (so if you generate a load of images using lists of, for instance, prompts, you will want to combine them with the helper node `Batch from Image List`)
 
@@ -152,11 +169,23 @@ This workflow:
 - inpaints
 - uses 'Image Filter' to choose which, if either, of the two images (before and after inpaint) to save
 
-The workflow is embedded in this seahorse in a bottle:
+The workflow is embedded in the seahorse in a bottle:
 
-![image](images/seahorse.png)
+<img src="https://github.com/chrisgoringe/cg-image-filter/raw/main/images/seahorse.png" alt="Seahorse" width="200" height="200">
 
 # Bugs, Ideas, and the future
 
 Take a look at the [issues list](https://github.com/chrisgoringe/cg-image-filter/issues) to see what I'm thinking of,
-to report problems, or to make suggestions.
+to report problems, or to make suggestions.
+
+## How to report a bug well
+
+If you are having problems, the better information you give me, the more chance I can fix it! Here are some steps you can take:
+
+- describe what you did, what you expected, and what happened
+- press f12 and see if there are any errors in the javascript console. If there are, screenshot them
+- let me know the comfy version information in Settings - About. It looks like this:
+
+![Screenshot 2025-03-27 122309](images/versions.png)
+- include what browser you are using
+- if you have a simple workflow that recreates the problem, that's a huge help