add code generation trigger

ccp/js/executionformcontroller.js

@@ -75,22 +75,25 @@ class CCPExecutionForm extends HTMLElement{
                   </div>
                 </div>
               </div>
-              <!-- div class="card">
-                <div class="card-header">
-                  <h5>Notifications</h5>
-                </div>
-                <div class="card-body">
               <div class="form-row">
-                    <div class="col form-group">
+                <div class="col-6">
-                      <div class="col form-check">
+                  <button id="execute_method_button" class="btn btn-info" style="width:inherit">Execute</button>
-                        <input class="form-check-input" type="checkbox" name="emailnotification" alt="Request email notification" title="Request email notification"/>
+                </div>
-                          <label class="form-check-label">Email notification</label>
+                <div class="col-6">
+                  <div class="d-flex" style="gap: 3px;">
+                    <select name="language-selector" class="form-control" style="padding:2px">
+                      <option value="text/python" data-ext="py" title="Generate plain Python3">Python 3</option>
+                      <option value="text/plain+r" data-ext="r" title="Generate plain R">R</option>
+                      <option value="application/vnd.jupyter+python" data-ext="ipynb" title="Generate Jupyter notebook with Python 3 cells">Jupyter Python3</option>
+                    </select>
+                    <button name="codegen" title="Generate code" class="btn btn-primary ccp-toolbar-button ccp-toolbar-button-small">
+                      <svg viewBox="0 96 960 960">
+                        <path d="M320 814 80 574l242-242 43 43-199 199 197 197-43 43Zm318 2-43-43 199-199-197-197 43-43 240 240-242 242Z"/>
+                      </svg>
+                    </button>
                   </div>
                 </div>
               </div>
-                </div>
-              </div-->
-              <button id="execute_method_button" class="btn btn-info">Execute</button>
             </form>
           </div>    
         </template>
@@ -168,6 +171,25 @@ class CCPExecutionForm extends HTMLElement{
     }).catch(err => {alert("Unable to call execute: " + err); this.unlockRender()})
   }
   
+  generateCode(mime, filename){
+    const url = this.#serviceurl + "/methods/" + this.#method + "/code"
+    const req = this.buildRequest()
+    this.#boot.secureFetch(
+      url, { method : "POST", body : JSON.stringify(req), headers : { "Content-Type" : "application/json", "Accept" : mime}}
+    ).then(reply=>{
+      if(reply.status !== 200) throw "Error while requesting code:";
+      return reply.blob()
+    }).then(blob => {
+      const objectURL = URL.createObjectURL(blob)
+      var tmplnk = document.createElement("a")
+      tmplnk.download = filename
+      tmplnk.href = objectURL
+      document.body.appendChild(tmplnk)
+      tmplnk.click()
+      document.body.removeChild(tmplnk)
+    }).catch(err=>{ alert(err)})
+  }
+  
   buildRequest(){
     let request = { inputs : {}, outputs : {}, response : "raw"}
     
@@ -338,6 +360,18 @@ class CCPExecutionForm extends HTMLElement{
           return false;
         }
       },
+      {
+        target: "button[name=codegen]",
+        on_click : ev=>{
+          ev.preventDefault()
+          ev.stopPropagation()
+          const langsel = ev.target.parentElement.querySelector("select[name=language-selector]")
+          const lang = langsel.value
+          const ext = langsel.selectedOptions[0].getAttribute("data-ext")
+          this.generateCode(lang, `ccprequest.${ext}`)
+          return false
+        }
+      },
     ]
   }