form refactoring

Author: melezhik

templates/build.crotmp

@@ -11,7 +11,7 @@
       </div>
       <div class="panel-block" id="notification"></div>
       <div class="panel-block">
-        <form method="post">
+        <form method="post" id="form01">
           <div class="field">
             <@vars: $i>
             <div class="control">
@@ -99,18 +99,32 @@
     function handleSubmit(event) {
       event.preventDefault();
       const data = new FormData(event.target);
-      const form_json = Object.fromEntries(data.entries());
-      // alert(form_json)
       var url = "<.http-root>/build-with-tags/project/<.project>";
       const tags = [];
-      // Create Base64 Object
-      <&HTML-AND-JAVASCRIPT('var Base64={_keyStr:"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=",encode:function(e){var t="";var n,r,i,s,o,u,a;var f=0;e=Base64._utf8_encode(e);while(f<e.length){n=e.charCodeAt(f++);r=e.charCodeAt(f++);i=e.charCodeAt(f++);s=n>>2;o=(n&3)<<4|r>>4;u=(r&15)<<2|i>>6;a=i&63;if(isNaN(r)){u=a=64}else if(isNaN(i)){a=64}t=t+this._keyStr.charAt(s)+this._keyStr.charAt(o)+this._keyStr.charAt(u)+this._keyStr.charAt(a)}return t},decode:function(e){var t="";var n,r,i;var s,o,u,a;var f=0;e=e.replace(/[^A-Za-z0-9\+\/\=]/g,"");while(f<e.length){s=this._keyStr.indexOf(e.charAt(f++));o=this._keyStr.indexOf(e.charAt(f++));u=this._keyStr.indexOf(e.charAt(f++));a=this._keyStr.indexOf(e.charAt(f++));n=s<<2|o>>4;r=(o&15)<<4|u>>2;i=(u&3)<<6|a;t=t+String.fromCharCode(n);if(u!=64){t=t+String.fromCharCode(r)}if(a!=64){t=t+String.fromCharCode(i)}}t=Base64._utf8_decode(t);return t},_utf8_encode:function(e){e=e.replace(/\r\n/g,"\n");var t="";for(var n=0;n<e.length;n++){var r=e.charCodeAt(n);if(r<128){t+=String.fromCharCode(r)}else if(r>127&&r<2048){t+=String.fromCharCode(r>>6|192);t+=String.fromCharCode(r&63|128)}else{t+=String.fromCharCode(r>>12|224);t+=String.fromCharCode(r>>6&63|128);t+=String.fromCharCode(r&63|128)}}return t},_utf8_decode:function(e){var t="";var n=0;var r=c1=c2=0;while(n<e.length){r=e.charCodeAt(n);if(r<128){t+=String.fromCharCode(r);n++}else if(r>191&&r<224){c2=e.charCodeAt(n+1);t+=String.fromCharCode((r&31)<<6|c2&63);n+=2}else{c2=e.charCodeAt(n+1);c3=e.charCodeAt(n+2);t+=String.fromCharCode((r&15)<<12|(c2&63)<<6|c3&63);n+=3}}return t}}')>
-      for (const t in form_json) {
-        const v = form_json[t]
+      <@vars: $i>
+      var e = document.getElementById("form01").elements["<$i.name>"];
+      var t = "<$i.name>";
+      <?{ $i.type eq 'select'}>
+      var v = e.value;
+      var v_text = e.options[e.selectedIndex].text;
+      tags.push(`${t}=${v_text}`);
+      console.log(`${t}: ${v}`);
+      </?>
+      <?{ $i.type eq 'textarea' or $i.type eq 'input' or $i.type eq 'password'}>
+      var v = e.value;
+      var v_safe = v.replace(/,/g,"___comma___");
+      v_safe = v_safe.replace(/,/g,"___eq___");
+      tags.push(`${t}=${v_safe}`);
+      console.log(`${t}: ${v}`);
+      </?>
+      <?{ $i.type eq 'checkbox'}>
+      var v = e.value;
+      if (e.checked){
+        tags.push(`${t}=${v}`);
         console.log(`${t}: ${v}`);
-        s_base64 = Base64.encode(`${t}=${v}`)
-        tags.push(s_base64)
       }
+      </?>
+      </@>
       var tags_s = tags.join(",");
       // https://developer.mozilla.org/en-US/docs/Web/API/fetch
       fetch(