add inpaint with live preview

README.md

@@ -107,7 +107,10 @@ http://127.0.0.1:8188/flow
 
 ### Feature Support
 - [x] Canvas / Masking / Inpainting Functionality
-- - [ ] Improved Canvas / Masking / Inpainting Functionality
+- - [x] Improved Canvas / Masking / Inpainting Functionality
+- - [ ] Outpainting Functionality
+- - Improving Inpainting Functionality
+
 - [ ] Enhanced Media Handling
 - [x] Live Preview
 - [ ] Prompt Tracking

__init__.py

@@ -38,7 +38,7 @@
 NODE_DISPLAY_NAME_MAPPINGS: Dict[str, str] = {}
 APP_CONFIGS: List[AppConfig] = []
 APP_NAME: str = "Flow"
-APP_VERSION: str = "0.3.3"
+APP_VERSION: str = "0.4.0"
 PURPLE = "\033[38;5;129m"
 RESET = "\033[0m"
 FLOWMSG = f"{PURPLE}Flow{RESET}"
@@ -743,7 +743,8 @@ def download_or_update_flows() -> None:
         "afl_mochi2v",
         "afl_pulid_flux",
         "afl_pulid_flux_GGUF",
-        "afl_reactor",
+        "afl_reactor"
+        "5otvy-cogvideox-orbit-left-lora",
     ]
 
     try:

pyproject.toml

@@ -1,7 +1,7 @@
 [project]
 name = "comfyui-disty-flow"
 description = "Flow is a custom node designed to provide a more user-friendly interface for ComfyUI by acting as an alternative user interface for running workflows. It is not a replacement for workflow creation.\nFlow is currently in the early stages of development, so expect bugs and ongoing feature enhancements. With your support and feedback, Flow will settle into a steady stream."
-version = "0.3.3"
+version = "0.4.0"
 license = {file = "LICENSE"}
 
 [project.urls]

web/core/content.html

@@ -1,28 +1,51 @@
-<header></header>
-<div class="content" >
-    <div class="left-col" style="display: block;">
-        <div id="side-workflow-controls" class="custom-scrollbar"></div>
-    </div>
-    <div class="mid-col">
+    <!-- <div id="responsive-indicator"></div> -->
+    <div id="container" class="container">
+        <header></header>
+        <main class="content">
+            <aside class="left-col" id="left-col">
+                <button id="toggle-left" class="toggle-button left-toggle" aria-label="Toggle Left Panel">
+                <svg class="arrow" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+                    <path d="M16 19V5l-11 7z"/>
+                </svg>
+                </button>
+                <div class="left-panel-content">
+                    <div id="side-workflow-controls" class="custom-scrollbar"></div>
+
+                </div>
+            </aside>
+
+            <section class="main-area mid-col">
                 <div id="display-media-main">
                     <div id="canvasWrapper" style="display: none;">
                         <canvas id="imageCanvas"></canvas>
                     </div>
                     <div id="image-container" class="custom-scrollbar"></div>
                 </div>
-            <div id="controls">
-                <div id="pluginUIContainer" class="plugin-ui-container" style="display: none;"></div>
-                <div id="progressbar"></div>
-                <div id="prompts"></div>
-            </div>
-    </div>
-    <div class="right-col" >
-        <div id="history" class="custom-scrollbar">
-            <h2>Recent</h2>
-            <div id="images-container">
-            </div>
-        </div>
-    </div>
+                <div id="controls" class="custom-scrollbar">
+                    <div id="progressbar"></div>
+                    <div id="quick-controls"></div>
+                    <div id="pluginUIContainer" class="plugin-ui-container">
+                    </div>
+                    <div id="prompts"></div>
+                </div>
+            </section>
+
+            <aside class="sidebar right-col" id="right-col">
+                <button id="toggle-right" class="toggle-button right-toggle" aria-label="Toggle Right Panel">
+                    <svg class="arrow" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+                        <path d="M8 5v14l11-7z"/>
+                    </svg>
+                </button>
+                <div class="right-panel-content">
+                    <div id="history" class="custom-scrollbar">
+                        <div id="header"><h2>Recent</h2></div>
+                        <div id="images-container" class="custom-scrollbar">
+                        </div>
+                    </div>
+                </div>
+            </aside>
+        </main>
+    <footer></footer>    
 </div>
-</div> 
-<footer></footer>    
+</body>
+</html>