Log Viewer

[sngazm]

Hi, I am building a log viewer for myself. It parses original log.html and creates smart viewer for images.

Features:

• One HTML file. no additional backend, no npm install (it loads React and others from CDN)
• Quick date switching
• Auto reload new image (if today)
• Group images by "Batch" of image generation
• Show Diff with prompts from previous batch
• Sort images (newest first, oldest first)
• Mobile friendly
• Can choose how many images to load at once (important for mobile users like me)
• Easy grid resizing

If you place the attached viewer.html under the output directory, you can use the viewer by accessing
/file=outputs/viewer.html on the local server. Of course it doesn't send any data to outside.

viewer.html.zip

[toutjavascript]

Hi

I was looking for that kind of tool.
I suppose log format has changed since october. So, at line 486,
const src = paragraphs[0].textContent;
must be now
const src = paragraphs[1].textContent;

And it works great without error at start

Seed is not displayed yet. But easy to add.

I will work on it to add some functionnalities.

[xhoxye]

Very much looking forward to it

[toutjavascript]

Work in progress.
I can copy seed to clipboard.
Next step is to integrate the log viewer in a new tab of fooocus. So it will be possible to drop all the datas (seed, prompt, models, ...) in the forms.

[sngazm]

Thanks for using and fixing it! I forgot to upload it here, but here's the latest version of my own code I was using. Feel free to tweak it as you like.

viewer_20231217.zip
(update: merged @toutjavascript 's fix)

[bsdesigner]

I don't understand how it works or what folder to put it in. Maybe I have a problem with it because I'm working in Fooocus from Stability Matrix...?

[toutjavascript]

I checked Fooocus running in Stability Matrix. Viewer is running well.
Put the viewer.html file in \Downloads\StabilityMatrix-win-x64\Data\Packages\Fooocus\outputs
And then open http://localhost:7865/file=outputs/viewer.html

[toutjavascript]

I will publish a first release this week end
as I can see, Fooocus from Stability Matrix is more advance with viewer UI already build in

[toutjavascript]

So. Here some recent pictures from the viewer. It shows resolution and filesize on mouseover.
Click on the wen to view full screen pictures and datas

The datas are displayed on bottom.
Click on each item to copy to clipboard. Paste every items in Fooocus UI and re-generate the very same image.

I will publish here the viewer.html file in few hours.
Full Integration in Fooocus seams hard. If @lllyasviel wants, I could work with him to add viewer and made a one click button to get back all parameters.

[toutjavascript]

Here we go.

viewer-20231216viewer.zip

Reminder : place the uncompressed viewer.html file in Fooocus/outputs directory (from run.bat)

You must open the viewer.html under Fooocus webserver (ie http://localhost:7860/file=outputs/viewer.html or http://localhost:7865/file=outputs/viewer.html )

I hope you will enjoy it.

[xhoxye]

Well done and thanks for contributing!

[R4290N]

Hi xhoxye!
how to make this log viewer open from Focus UI?

[xhoxye]

A minor issue is that the zoomed-in display is not complete, cannot be dragged and dropped, and opens in another tab

[toutjavascript]

Still working with styles preview on log viewer:

PS: same illustrations on models/loras would be great

[toutjavascript]

Working hard again

New release tomorrow i hope

[toutjavascript]

V1.3 is available
https://github.com/toutjavascript/Fooocus-Log-Viewer/releases/tag/v1.3

1.3.0 (thanks @ItsNoted for some of these ideas)

• Images of style are displayed on batch details
• Click on image thumbnail open zoomed image without targeting the magnifying glass
• Check for new image on today today's folder
• Could play sound when a new image is detected on today's folder
• Remember configuration choices (grid size, autoreload, sound on, display details, display metadata, ...)

[toutjavascript]

Hello

I am working again on log viewer with a Search Box to find images with text prompt, models and styles.
There is no need to navigate by day to find your work

Need some days to finish that work

[toutjavascript]

Here the V1.5 Release with search text into all prompts
https://github.com/toutjavascript/Fooocus-Log-Viewer/releases/tag/V1.5

Works very well, with over 10k images in outputs folder !

[R4290N]

Главный недостаток – установка модификации. Мы должны добавить только одну строку в файл .py, но каждый раз, когда Fooocus обновляется

Please provide instructions

[xhoxye]

The higher the number of images, the slower each click opens the load

[Amit30swgoh]

Thanks for all the help bro you and Manuel Schmid are helping alot!