redo ansible vault

cmason3 · Feb 10, 2025 · a046c2f · a046c2f
1 parent 23c1834
commit a046c2f
Show file tree

Hide file tree

Showing 7 changed files with 95 additions and 94 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,9 +1,9 @@
 ## CHANGELOG
 
-### [25.5.0] - In Development
--- Overhaul Ansible Vault encryption
--- Check jinjafx_input still works!
--- DIsabled drop downs are see through!
+### [25.5.0] - Feb 10, 2025
+- Disabled dropdowns for DataSets and Templates are now opaque and don't show text behind them
+- Overhauled how Ansible Vault works and added `jinjafx_vault_undefined` from JinjaFx
+- Updated Pandoc to 3.6.3 in Dockerfile
 
 ### [25.4.0] - Feb 3, 2025
 - Add the ability to hide the `Global.yml` pane via a toggle switch

diff --git a/jinjafx_server.py b/jinjafx_server.py
@@ -494,23 +494,42 @@ def do_POST(self):
 
               if 'vars' in dt and len(dt['vars'].strip()) > 0:
                 gyaml = self.d(dt['vars']).decode('utf-8')
+                vpw = self.d(dt['vpw']).decode('utf-8') if 'vpw' in dt else ''
+                vault_undef = False
 
-                if 'vpw' in dt:
-                  vpw = self.d(dt['vpw']).decode('utf-8')
+                if 'jinjafx_vault_undefined' in gyaml:
+                  yaml.add_constructor('!vault', lambda x, y: None, yaml.SafeLoader)
+                  if y := yaml.load(gyaml, Loader=yaml.SafeLoader):
+                    vault_undef = y.get('jinjafx_vault_undefined', vault_undef)
 
-                  if gyaml.lstrip().startswith('$ANSIBLE_VAULT;'):
-                    gyaml = jinjafx.AnsibleVault().decrypt(gyaml.encode('utf-8'), vpw).decode('utf-8')
+                def yaml_vault_tag(loader, node):
+                  x = jinjafx.AnsibleVault().decrypt(node.value.encode('utf-8'), vpw, vault_undef)
+                  if x is not None:
+                    return x.decode('utf-8')
 
-                  def yaml_vault_tag(loader, node):
-                    return jinjafx.AnsibleVault().decrypt(node.value.encode('utf-8'), vpw).decode('utf-8')
+                  else:
+                    return '_undef'
 
-                  yaml.add_constructor('!vault', yaml_vault_tag, yaml.SafeLoader)
+                yaml.add_constructor('!vault', yaml_vault_tag, yaml.SafeLoader)
 
-                y = yaml.load(gyaml, Loader=yaml.SafeLoader)
-                if y != None:
+                if y := yaml.load(gyaml, Loader=yaml.SafeLoader):
                   if isinstance(y, list):
                     y = {'_': y}
 
+                  s = [y]
+
+                  while s:
+                    c = s.pop()
+                    for key in list(c.keys()):
+                      if c[key] == '_undef':
+                        del c[key]
+                      elif isinstance(c[key], dict):
+                        s.append(c[key])
+                      elif isinstance(c[key], list):
+                        for item in c[key]:
+                          if isinstance(item, dict):
+                            s.append(item)
+
                   gvars.update(y)
 
               st = round(time.time() * 1000)

diff --git a/kubernetes/Dockerfile b/kubernetes/Dockerfile
@@ -7,8 +7,8 @@ RUN set -eux; \
 apt-get update; \
 apt-get install -y --no-install-recommends wget git build-essential; \
 
-wget -P /tmp https://github.com/jgm/pandoc/releases/download/3.6.2/pandoc-3.6.2-1-amd64.deb; \
-dpkg -i /tmp/pandoc-3.6.2-1-amd64.deb; \
+wget -P /tmp https://github.com/jgm/pandoc/releases/download/3.6.3/pandoc-3.6.3-1-amd64.deb; \
+dpkg -i /tmp/pandoc-3.6.3-1-amd64.deb; \
 
 python3 -m venv /opt/jinjafx; \
 /opt/jinjafx/bin/python3 -m pip install --upgrade git+https://github.com/cmason3/jinjafx_server.git@${BRANCH} lxml; \

diff --git a/setup.py b/setup.py
@@ -30,7 +30,7 @@
   packages=["jinjafx_server"],
   include_package_data=True,
   package_data={'': ['www/*', 'pandoc/reference.docx']},
-  install_requires=["jinjafx>=1.24.0", "requests", "cmarkgfm>=0.5.0", "emoji"],
+  install_requires=["jinjafx>=1.24.3", "requests", "cmarkgfm>=0.5.0", "emoji"],
   entry_points={
     "console_scripts": [
       "jinjafx_server=jinjafx_server:main",

diff --git a/www/index.html b/www/index.html
@@ -13,7 +13,7 @@
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.18/addon/display/fullscreen.min.css" integrity="sha512-T8xB3MmwpA77VK9lUH3UkdUTnkmpqOxHF8OceOKaHrvpcXMSNX0xtpa9FoLTDAVO1JnB2UiMdVeI2V0HTHjTWA==" crossorigin="anonymous" referrerpolicy="no-referrer">
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.18/addon/fold/foldgutter.min.css" integrity="sha512-YwkMTlTHn8dBnwa47IF+cKsS00HPiiVhQ4DpwT1KF2gUftfFR7aefepabSPLAs6zrMyD89M3w0Ow6mQ5XJEUCw==" crossorigin="anonymous" referrerpolicy="no-referrer">
     <link rel="stylesheet" href="/bb176715/jinjafx.css">
-    <link rel="stylesheet" href="/8876901a/jinjafx_m.css">
+    <link rel="stylesheet" href="/5ae811ff/jinjafx_m.css">
     <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.3/js/bootstrap.bundle.min.js" integrity="sha512-7Pi/otdlbbCR+LnW+F7PwFcSDJOuUJB3OxtEHbg4vSMvzvJjde4Po1v4BR9Gdc9aXNUNFVUY+SK51wWT8WF0Gg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.18/codemirror.min.js" integrity="sha512-6cPYokihlrofMNApz7OXVQNObWjLiKGIBBb7+UB+AuMiRCLKmFKgrwms21sHq3bdFFZWpfHYRJBJvMFMPj1S9g==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.18/addon/selection/mark-selection.min.js" integrity="sha512-XaS0JPIY5yDTDaYIMjkoXz+LF/DEVhRn1eq9QOhJPhMuJGGPOKZTulF+LY8/uwd18k00CIaSe4f8fCyp/5U7IQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
@@ -32,7 +32,7 @@
     <script src="https://cdnjs.cloudflare.com/ajax/libs/js-yaml/4.1.0/js-yaml.min.js" integrity="sha512-CSBhVREyzHAjAFfBlIBakjoRUKp5h7VSweP0InR/pAJyptH7peuhCsqAI/snV+TwZmXZqoUklpXp6R6wMnYf5Q==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/dayjs/1.11.13/dayjs.min.js" integrity="sha512-FwNWaxyfy2XlEINoSnZh1JQ5TRRtGow0D6XcmAWmYCRgvqOUTnzCxPc9uF35u5ZEpirk1uhlPVA19tflhvnW1g==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/dayjs/1.11.13/plugin/relativeTime.min.js" integrity="sha512-MVzDPmm7QZ8PhEiqJXKz/zw2HJuv61waxb8XXuZMMs9b+an3LoqOqhOEt5Nq3LY1e4Ipbbd/e+AWgERdHlVgaA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
-    <script src="/1a7e31b7/jinjafx_m.js"></script>
+    <script src="/b000c1ba/jinjafx_m.js"></script>
   </head>
   <body>
     <div id="overlay"></div>
@@ -57,7 +57,7 @@ <h5 id="title">
         <div id="buttons" class="btn-toolbar ms-auto d-flex d-none" role="group">
           <div class="btn-group me-2">
             <div class="btn-group">
-              <button id="select_ds" type="button" class="btn btn-warning text-black text-start mw-150" data-bs-toggle="dropdown" title="Select DataSet" disabled>
+              <button id="select_ds" type="button" class="btn btn-warning text-black text-start mw-150 btn-warn-opaque" data-bs-toggle="dropdown" title="Select DataSet" disabled>
                 <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                   <polygon points="12 2 2 7 12 12 22 7 12 2" />
                   <polyline points="2 17 12 22 22 17" />
@@ -66,8 +66,8 @@ <h5 id="title">
               </button>
               <div id="datasets" class="dropdown-menu"></div>
             </div>
-            <button id="delete_ds" type="button" class="btn btn-warning text-black" title="Delete DataSet" disabled>-</button>
-            <button id="add_ds" type="button" class="btn btn-warning text-black" title="Add DataSet">+</button>
+            <button id="delete_ds" type="button" class="btn btn-warning text-black btn-warn-opaque" title="Delete DataSet" disabled>-</button>
+            <button id="add_ds" type="button" class="btn btn-warning text-black btn-warn-opaque" title="Add DataSet">+</button>
           </div>
 
           <button id="encrypt" type="button" class="btn btn-secondary text-white me-2 d-none" title="Encrypt String with Ansible Vault">
@@ -170,7 +170,7 @@ <h5 id="title">
                 <div class="badge lb-vars float-start labels">V<br />A<br />R<br />S<br />.<br />Y<br />M<br />L<br /></div>
                 <textarea id="vars"></textarea>
                 <span id="ansible-vault" class="topright d-none">
-                  <div class="input-group">
+                  <div class="input-group mw-250">
                     <span class="input-group-text" title="Ansible Vault Password">
                       <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                         <rect x="3" y="11" width="18" height="11" rx="2" ry="2"></rect>
@@ -189,8 +189,8 @@ <h5 id="title">
             <span id="stemplates" class="topright">
               <div class="btn-group">
                 <div class="btn-group">
-                  <button id="select_t" type="button" class="btn btn-warning btn-sm text-start mw-150" data-bs-toggle="dropdown" title="Select Template" disabled>
-                    <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                  <button id="select_t" type="button" class="btn btn-warning btn-sm text-start mw-150 btn-warn-opaque" data-bs-toggle="dropdown" title="Select Template" disabled>
+                    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                       <rect x="3" y="3" width="7" height="7"></rect>
                       <rect x="14" y="3" width="7" height="7"></rect>
                       <rect x="14" y="14" width="7" height="7"></rect>
@@ -199,8 +199,8 @@ <h5 id="title">
                   </button>
                   <div id="templates" class="dropdown-menu"></div>
                 </div>
-                <button id="delete_t" type="button" class="btn btn-warning btn-sm" title="Delete Template" disabled>-</button>
-                <button id="add_t" type="button" class="btn btn-warning btn-sm" title="Add Template">+</button>
+                <button id="delete_t" type="button" class="btn btn-warning btn-sm btn-warn-opaque" title="Delete Template" disabled>-</button>
+                <button id="add_t" type="button" class="btn btn-warning btn-sm btn-warn-opaque" title="Add Template">+</button>
               </div>
             </span>
             <span id="template_info" class="info">
@@ -285,27 +285,6 @@ <h6 class="text-end">JinjaFx v{{ jinjafx.version }}<br /><a class="small" href="
         </div>
       </div>
     </div>
-    <!--
-    <div id="vault_input" class="modal fade" role="dialog">
-      <div class="modal-dialog modal-dialog-centered">
-        <div class="modal-content">
-          <div class="modal-header">
-            <h4 id="ml-title" class="mt-0">Ansible Vault</h4>
-          </div>
-          <div class="form-group row modal-body">
-            <label for="vault" class="col-sm-12 col-form-label">Vault Password</label>
-            <div class="col-sm-12">
-              <input type="password" class="form-control" id="vault">
-            </div>
-          </div>
-          <div class="modal-footer">
-            <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
-            <button id="ml-vault-ok" type="button" class="btn btn-primary" data-bs-dismiss="modal">OK</button>
-          </div>
-        </div>
-      </div>
-    </div>
-    -->
     <div id="vault_encrypt" class="modal fade" role="dialog">
       <div class="modal-dialog modal-dialog-centered">
         <div class="modal-content">

diff --git a/www/jinjafx_m.css b/www/jinjafx_m.css
@@ -52,9 +52,18 @@ body {
 textarea {
   resize: none;
 }
+.btn-warn-opaque:disabled {
+  color: #535353 !important;
+  border-color: #ffd75e !important;
+  background-color: #ffd75e !important;
+  opacity: 1 !important;
+}
 .mw-150 {
   min-width: 150px;
 }
+.mw-250 {
+  min-width: 250px;
+}
 .me-10 {
   margin-right: 10px;
 }

diff --git a/www/jinjafx_m.js b/www/jinjafx_m.js
@@ -161,6 +161,7 @@ function getStatusText(code) {
         }
       }
       dirty = true;
+      toggle_vault();
       document.getElementById('selected_ds').innerHTML = ds;
       current_ds = ds;
       onDataBlur();
@@ -397,7 +398,6 @@ function getStatusText(code) {
   }
 
   function jinjafx_generate() {
-    var vaulted_vars = dt.vars.indexOf('$ANSIBLE_VAULT;') > -1;
     dt.vars = e(dt.vars);
 
     if (Object.keys(templates).length === 1) {
@@ -418,20 +418,14 @@ function getStatusText(code) {
       set_status("darkred", "ERROR", 'Content Too Large');
     }
     else {
-      if (vaulted_vars) {
-        /*
-        new bootstrap.Modal(document.getElementById('vault_input'), {
-          keyboard: false
-        }).show();
-        */
+      if (document.getElementById('vault-password').value.trim() != '') {
+        dt.vpw = e(document.getElementById('vault-password').value);
+      }
+      if (dt_id != '') {
+        window.open("/output.html?dt=" + dt_id, "_blank");
       }
       else {
-        if (dt_id != '') {
-          window.open("/output.html?dt=" + dt_id, "_blank");
-        }
-        else {
-          window.open("/output.html", "_blank");
-        }
+        window.open("/output.html", "_blank");
       }
     }
   }
@@ -567,15 +561,6 @@ function getStatusText(code) {
           var global = window.cmgVars.getValue().replace(/\t/g, "  ");
 
           if (global.match(/\S/)) {
-            if (global.trimStart().startsWith('$ANSIBLE_VAULT;') && vars.match(/\S/)) {
-              set_status("darkred", "ERROR", "Ansible Vault not supported in 'global.yml' with 'vars.yml'");
-              return false;
-            }
-            if (vars.trimStart().startsWith('$ANSIBLE_VAULT;')) {
-              set_status("darkred", "ERROR", "Ansible Vault not supported in 'vars.yml' with 'global.yml'");
-              return false;
-            }
-
             try {
               jsyaml.load(global, jsyaml_schema);
               dt.vars += global.trimEnd() + "\n\n";
@@ -792,6 +777,10 @@ function getStatusText(code) {
           set_wait();
 
           if (method == "update_link") {
+            if (!vault_visible) {
+              document.getElementById('vault-password').value = '';
+              localStorage.removeItem('vault_' + dt_id);
+            }
             update_link(dt_id, false);
           }
           else {
@@ -878,6 +867,12 @@ function getStatusText(code) {
         }
         else {
           window.removeEventListener('beforeunload', onBeforeUnload);
+          if (document.getElementById('vault-password').value.trim() != '') {
+            localStorage.setItem('vault_' + this.responseText.trim(), document.getElementById('vault-password').value);
+          }
+          else {
+            localStorage.removeItem('vault_' + this.responseText.trim());
+          }
           window.location.href = '/dt/' + this.responseText.trim();
         }
         document.title = 'JinjaFx - Jinja2 Templating Tool';
@@ -994,6 +989,13 @@ function getStatusText(code) {
               }
               dt_id = qs.dt;
 
+              if (localStorage.getItem('vault_' + dt_id)) {
+                document.getElementById('vault-password').value = localStorage.getItem('vault_' + dt_id);
+              }
+              else {
+                document.getElementById('vault-password').value = '';
+              }
+
               document.getElementById('update').classList.remove('d-none');
               document.getElementById('get').classList.add('d-none');
               document.getElementById('mdd').disabled = false;
@@ -1094,7 +1096,18 @@ function getStatusText(code) {
       if (window.crypto.subtle) {
         document.getElementById('encrypt').classList.remove('d-none');
       }
-
+
+      document.getElementById("vault-password").addEventListener('change', function (e) {
+        if (dt_id != '') {
+          if (document.getElementById('vault-password').value.trim() != '') {
+            localStorage.setItem('vault_' + dt_id, document.getElementById('vault-password').value);
+          }
+          else {
+            localStorage.removeItem('vault_' + dt_id);
+          }
+        }
+      });
+
       if (window.showOpenFilePicker) {
         document.getElementById('import').onclick = async() => {
           clear_status();
@@ -1116,6 +1129,7 @@ function getStatusText(code) {
               if (obj != null) {
                 pending_dt = obj['dt'];
                 global_visible = true;
+                document.getElementById("vault-password").value = '';
                 apply_dt(false);
                 return true;
               }
@@ -1142,6 +1156,7 @@ function getStatusText(code) {
               if (obj != null) {
                 pending_dt = obj['dt'];
                 global_visible = true;
+                document.getElementById("vault-password").value = '';
                 apply_dt(false);
                 return true;
               }
@@ -1488,12 +1503,6 @@ function getStatusText(code) {
         fe.focus();
       });
 
-      /*
-      document.getElementById('vault_input').addEventListener('shown.bs.modal', function (e) {
-        document.getElementById("vault").focus();
-      });
-      */
-
       document.getElementById('vault_encrypt').addEventListener('shown.bs.modal', function (e) {
         document.getElementById("vault_string").focus();
       });
@@ -1517,24 +1526,6 @@ function getStatusText(code) {
         fe.focus();
       });
 
-      /*
-      document.getElementById('ml-vault-ok').onclick = function() {
-        dt.vpw = e(document.getElementById("vault").value);
-        if (dt_id != '') {
-          window.open("/output.html?dt=" + dt_id, "_blank");
-        }
-        else {
-          window.open("/output.html", "_blank");
-        }
-      };
-  
-      document.getElementById('vault').onkeyup = function(e) {
-        if (e.which == 13) {
-          document.getElementById('ml-vault-ok').click();
-        }
-      };
-      */
-
       document.getElementById('protect_dt').addEventListener('shown.bs.modal', function (e) {
         document.getElementById("password_open1").focus();
       });
@@ -2082,11 +2073,13 @@ function getStatusText(code) {
           if (dirty) {
             if (confirm("Are You Sure?") === true) {
               global_visible = true;
+              document.getElementById("vault-password").value = '';
               apply_dt(false);
             }
           }
           else {
             global_visible = true;
+            document.getElementById("vault-password").value = '';
             apply_dt(false);
           }
         }
@@ -2233,6 +2226,7 @@ function getStatusText(code) {
       window.cmgVars.getDoc().clearHistory();
       window.cmTemplate.getDoc().clearHistory();
 
+      toggle_vault();
       rebuild_datasets();
       rebuild_templates();
       remove_info();