From 28936fa6bcf1e41433d3330a50002463c6c93d12 Mon Sep 17 00:00:00 2001
From: Chester Enright <amunchet@gmail.com>
Date: Thu, 7 Nov 2024 11:27:54 -0600
Subject: [PATCH] feat: working scrolling ansible output

---
 backend/serve.py                        | 36 ++++++++++++-------------
 frontend/labyrinth/src/helper.js        |  2 +-
 frontend/labyrinth/src/views/Deploy.vue | 22 +++++++++------
 3 files changed, 32 insertions(+), 28 deletions(-)

diff --git a/backend/serve.py b/backend/serve.py
index 0edef94..e827c97 100755
--- a/backend/serve.py
+++ b/backend/serve.py
@@ -1200,10 +1200,6 @@ def run_ansible(inp_data=""):  # pragma: no cover
     else:  # pragma: no cover
         return "Invalid data", 481
     
-    print("DDDD")
-    print(data)
-    print(request.data)
-    print("DDDD")
     data = json.loads(data)
     if (
         "hosts" not in data
@@ -1230,6 +1226,7 @@ def run_ansible(inp_data=""):  # pragma: no cover
             private_data_dir=RUN_DIR,
             playbook="{}.yml".format(playbook),
             cmdline="-vvvvv --vault-password-file ../vault.pass",
+            quiet=True
         )
     except Exception as e:
         # Delete Vault Password
@@ -1242,21 +1239,22 @@ def run_ansible(inp_data=""):  # pragma: no cover
         return f"Error: {e}", 200
 
     def ansible_stream():
-        while thread.is_alive():
-            line = runner.stdout.readline()
-            if line:
-                yield line
-            else:
-                time.sleep(0.1)  # Prevent busy waiting
-        
-
-        if os.path.exists("/vault.pass"):
-            os.remove("/vault.pass")
-
-        # Delete all files
-        shutil.rmtree(RUN_DIR)
-
-    return Response(ansible_stream(), mimetype='text/plain')
+        try:
+            while thread.is_alive():
+                try:
+                    for event in runner.events:
+                        yield ("<div>" + str(event["stdout"]) + "</div>").encode("utf-8")
+                        time.sleep(0.1)
+                except Exception as e:
+                    yield f"Error: {e}".encode("utf-8")
+        finally:
+            if os.path.exists("/vault.pass"):
+                os.remove("/vault.pass")
+
+            # Delete all files
+            shutil.rmtree(RUN_DIR)
+
+    return ansible_stream(), {"Content-Type" : "text/plain"}
 
 
 @app.route("/mac/<old_mac>/<new_mac>/")
diff --git a/frontend/labyrinth/src/helper.js b/frontend/labyrinth/src/helper.js
index ccdcf53..e735149 100644
--- a/frontend/labyrinth/src/helper.js
+++ b/frontend/labyrinth/src/helper.js
@@ -177,7 +177,7 @@ export default {
         Email: profile,
       };
 
-      if (isUpload !== undefined) {
+      if (isUpload == true) {
         headers["Content-Type"] = "multipart/form-data";
       }
 
diff --git a/frontend/labyrinth/src/views/Deploy.vue b/frontend/labyrinth/src/views/Deploy.vue
index 132c4b9..c106778 100644
--- a/frontend/labyrinth/src/views/Deploy.vue
+++ b/frontend/labyrinth/src/views/Deploy.vue
@@ -495,10 +495,9 @@
         >Deploy to host<span v-if="ips.length != 0">s</span></b-button
       >
       <hr />
-      AAAA:
-      {{playbook_result}}
       <div
         class="playbook_result mb-4"
+        ref="playbookResultDiv"
         v-html="$sanitize(playbook_result)"
         v-if="running && playbook_result && playbook_loaded && ips.length == 0"
       ></div>
@@ -799,11 +798,10 @@ export default {
         );
 
         // Handle the streaming response
-        console.log(response)
         const reader = response.body.getReader();
         const decoder = new TextDecoder("utf-8");
         let result = "";
-        let truth = 1 
+        let truth = 1;
 
         // Read the response stream
         while (truth) {
@@ -811,15 +809,19 @@ export default {
           if (done) break; // End of stream
           result += decoder.decode(value, { stream: true });
           this.playbook_result = result; // Update the result
+          this.$nextTick(() => {
+            // Scroll to the bottom of the div
+            const div = this.$refs.playbookResultDiv;
+            if (div) {
+              div.scrollTop = div.scrollHeight;
+            }
+          });
           this.$forceUpdate(); // Re-render the component
         }
       } catch (error) {
         // Handle any errors
-        console.log(error)
+        console.log(error);
         this.$store.commit("updateError", error);
-      } finally {
-        this.running = false;
-        this.playbook_loaded = true;
       }
     },
 
@@ -959,6 +961,10 @@ export default {
   padding: 1rem;
 }
 
+.playbook_result div{
+  margin-top: 0.5rem;
+  margin-bottom:0.5rem;
+}
 .text-underline {
   font-weight: bold;
 }