From 7b3a885f66f8683628915a3a36147646947f9976 Mon Sep 17 00:00:00 2001
From: Madiator2011 <romanrex19@int.pl>
Date: Wed, 13 Nov 2024 12:09:17 +0100
Subject: [PATCH] Fixed instalation UI

---
 .../app/templates/index.html                  | 35 +++++++++++++++----
 1 file changed, 29 insertions(+), 6 deletions(-)

diff --git a/official-templates/better-ai-launcher/app/templates/index.html b/official-templates/better-ai-launcher/app/templates/index.html
index b984366..f834461 100644
--- a/official-templates/better-ai-launcher/app/templates/index.html
+++ b/official-templates/better-ai-launcher/app/templates/index.html
@@ -2403,6 +2403,7 @@
                             {% for app_key, app_info in apps.items() %}
                             <div class="app">
                                 <h2>{{ app_info.name }}</h2>
+                                {% if app_status[app_key]['installed'] %}
                                 <div class="button-group">
                                     <button onclick="startApp('{{ app_key }}')" id="start-{{ app_key }}" class="start-button" {% if app_status[app_key]['status'] == 'running' %}disabled{% endif %}>
                                         <i class="fas fa-play"></i> Start
@@ -2420,17 +2421,39 @@
                                         <i class="fas fa-times-circle"></i> Force Kill
                                     </button>
                                 </div>
-                                {% if app_key == 'bcomfy' and app_status[app_key]['installed'] %}
+                                {% if app_key == 'bcomfy' %}
                                 <button onclick="fixCustomNodes('{{ app_key }}')" id="fix-custom-nodes-{{ app_key }}" class="fix-custom-nodes-button">
                                     <i class="fas fa-wrench"></i> Fix Custom Nodes
                                 </button>
                                 {% endif %}
-                                {% if not app_status[app_key]['installed'] %}
-                                <button onclick="installApp('{{ app_key }}')" id="install-{{ app_key }}" class="install-button">
-                                    <i class="fas fa-download"></i> Install
-                                </button>
-                                {% endif %}
                                 <div class="status">Status: {{ app_status[app_key]['status'] }}</div>
+                                {% else %}
+                                <div class="install-container">
+                                    <button onclick="installApp('{{ app_key }}')" id="install-{{ app_key }}" class="install-button">
+                                        <i class="fas fa-download"></i> Install
+                                    </button>
+                                    <div id="install-progress-{{ app_key }}" class="install-progress" style="display: none;">
+                                        <div class="progress-container">
+                                            <div class="progress-label">Download Progress:</div>
+                                            <div class="progress-bar">
+                                                <div class="progress-bar-fill download-progress" style="width: 0%">0%</div>
+                                            </div>
+                                        </div>
+                                        <div class="progress-container">
+                                            <div class="progress-label">Unpack Progress:</div>
+                                            <div class="progress-bar">
+                                                <div class="progress-bar-fill unpack-progress" style="width: 0%">0%</div>
+                                            </div>
+                                        </div>
+                                        <div class="download-info">
+                                            <span class="download-speed"></span>
+                                            <span class="download-eta"></span>
+                                        </div>
+                                        <div class="install-stage"></div>
+                                    </div>
+                                    <div id="install-logs-{{ app_key }}" class="install-logs" style="display: none;"></div>
+                                </div>
+                                {% endif %}
                             </div>
                             {% endfor %}
                         </div>