JS cleanup

ansibleguy · Feb 9, 2024 · 1a3472b · 1a3472b
1 parent 12dc5bb
commit 1a3472b
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 22 deletions.
diff --git a/README.md b/README.md
@@ -76,7 +76,7 @@ There are multiple Ansible WebUI products - how do they compare to this product?
 
    As Ansible already requires Python3 - I chose it as primary language.
 
-   The backend stack is built of [gunicorn](https://gunicorn.org/)/[Django](https://www.djangoproject.com/) and the frontend consists of Django templates and basic JS.
+   The backend stack is built of [gunicorn](https://gunicorn.org/)/[Django](https://www.djangoproject.com/) and the frontend consists of Django templates and basic/vanilla JS.
 
    Ansible job execution is done using the official [ansible-runner](https://ansible.readthedocs.io/projects/runner/en/latest/python_interface/) library!
 

diff --git a/src/ansible-webui/aw/static/js/aw.js b/src/ansible-webui/aw/static/js/aw.js
@@ -129,9 +129,9 @@ function apiActionFullError() {
 }
 
 function apiBrowseDirUpdateChoices(inputElement, choicesElement, searchType, result) {
-    console.log(result);
     choices = result[searchType];
     inputElement.attr("pattern", '(.*\\/|^)(' + choices.join('|') + ')$');
+
     let title = "";
     if (choices.length == 0) {
         title += "No available " + searchType + " found."
@@ -142,20 +142,20 @@ function apiBrowseDirUpdateChoices(inputElement, choicesElement, searchType, res
     if (searchType != 'directories' && dirs.length > 0) {
         title += " Available directories: '" + dirs.join(', ') + "'";
     }
-
     inputElement.attr("title", title);
 
-    choicesElement.innerHTML = ""
+    choicesHtml = "";
     for (i = 0, len = choices.length; i < len; i++) {
         let choice = choices[i];
-        choicesElement.innerHTML += "<li>" + choice + "</li>";
+        choicesHtml += "<li>" + choice + "</li>";
     }
     if (searchType != 'directories') {
         for (i = 0, len = dirs.length; i < len; i++) {
             let dir = dirs[i];
-            choicesElement.innerHTML += '<li><i class="fa fa-folder" aria-hidden="true"></i> ' + dir + "</li>";
+            choicesHtml += '<li><i class="fa fa-folder" aria-hidden="true"></i> ' + dir + "</li>";
         }
     }
+    choicesElement.innerHTML = choicesHtml;
 }
 
 function apiBrowseDirRemoveChoices(inputElement, choicesElement, searchType, exception) {
@@ -165,7 +165,6 @@ function apiBrowseDirRemoveChoices(inputElement, choicesElement, searchType, exc
 }
 
 function apiBrowseDir(inputElement, choicesElement, selector, base, searchType) {
-    console.log("/api/fs/browse/" + selector + "?base=" + base + ' | searching for ' + searchType);
     $.ajax({
         url: "/api/fs/browse/" + selector + "?base=" + base,
         type: "GET",
@@ -186,7 +185,6 @@ $( document ).ready(function() {
     $(".aw-main").on("click", ".aw-btn-autorefresh", function(){
         sleep(50);
         if ($(this).attr("value") == "ON") {
-            console.log("OK");
             autoReloadData(2);
         }
     });
@@ -245,23 +243,22 @@ $( document ).ready(function() {
     $(".aw-main").on("input", ".aw-fs-browse", function(){
         let searchType = $(this).attr("aw-fs-type");
         let apiSelector = $(this).attr("aw-fs-selector");
-        let apiChoices = $(this).attr("aw-fs-choices");
+        let apiChoices = document.getElementById($(this).attr("aw-fs-choices"));
 
-        // check if highest level of user-input is in choices; go to next depth
-        let userInput = $(this).val();
-        if (typeof(userInput) == 'undefined' || userInput == null) {
-            userInput = "";
-        }
+        if (this.checkValidity() == false) {
+
+            let userInput = $(this).val();
+            if (typeof(userInput) == 'undefined' || userInput == null) {
+                userInput = "";
+            }
 
-        userInputLevels = userInput.split('/');
-        selected = userInputLevels.pop();
-        apiBase = userInputLevels.join('/');
+            userInputLevels = userInput.split('/');
+            userInputLevels.pop();
+            apiBase = userInputLevels.join('/');
 
-        apiChoicesElement = document.getElementById(apiChoices);
-        if (this.checkValidity() == false) {
-            apiBrowseDir(jQuery(this), apiChoicesElement, apiSelector, apiBase, searchType);
+            apiBrowseDir(jQuery(this), apiChoices, apiSelector, apiBase, searchType);
         } else {
-            apiChoicesElement.innerHTML = ""
+            apiChoices.innerHTML = ""
         }
     });
 });
diff --git a/src/ansible-webui/aw/templates/button/icon/edit.html b/src/ansible-webui/aw/templates/button/icon/edit.html
@@ -1 +1 @@
-<i class="fas fa-pen-square fa-2x ga-btn-action-icon"></i>
+<i class="fas fa-pen-square fa-2x aw-btn-action-icon"></i>