add function to add new package

Author: risenW

notebookjs/src/public/javascripts/index.js

@@ -92,8 +92,7 @@ function add_new_code_cell(c_id, where) {
                 <i class="fas fa-sort-up"></i> Text
             </button>
             </div>
-
-            <button type="button" id="del_btn-${new_id}" class="btn btn-sm btn-danger del"><i
+            <button type="button" id="del-btn_${new_id}" class="btn btn-sm btn-danger del"><i
                     class="fas fa-trash-alt"></i>
                 </button>
         </div>
@@ -247,7 +246,6 @@ function delete_text_cell(id) {
 
 $(document).on("click", "button.run", function () {
     if (this.id.split("_").includes("md")) {
-        console.log("md");
         let id = this.id.split("-")[1]
         let val = document.getElementById(`text-box_${id}`).value
         show_md(id, val)
@@ -257,10 +255,8 @@ $(document).on("click", "button.run", function () {
 })
 
 $(document).on("click", "button.del", function () {
-    console.log(this.id);
-    let id = this.id.split("-")[1]
-    console.log(id);
-    // delete_cell(id)
+    let id = this.id.split("_")[1]
+    delete_cell(id)
 })
 
 

notebookjs/src/public/javascripts/utils.js

@@ -90,39 +90,39 @@ function viz(name, callback) {
     return cb
 }
 
-function table(df){
+function table(df) {
+
+    const { col_types, series, columns, index, values } = df;
 
-    const {col_types, series, columns, index, values} = df;
 
-    
     let head = ""
-    if(series){
+    if (series) {
         head += `<th class="${col_types[0]}">${columns}</th>`
-    }else{
+    } else {
 
-        columns.forEach((name,i)=>{
-            head +=`<th class="${col_types[i]}">${name}</th>`
+        columns.forEach((name, i) => {
+            head += `<th class="${col_types[i]}">${name}</th>`
         });
     }
 
     let body = ""
 
-    values.forEach((row,i)=>{
+    values.forEach((row, i) => {
 
         let b_String = `<tr><th>${index[i]}</th>`
 
-        if(series){
+        if (series) {
             b_String += `<td class="${col_types[0]}">${row}</td>`
-        }else{
+        } else {
 
-            row.forEach((v,j)=>{
-                b_String +=`<td class="${col_types[j]}">${v}</td>`
+            row.forEach((v, j) => {
+                b_String += `<td class="${col_types[j]}">${v}</td>`
             });
         }
 
-        b_String +="</tr>"
+        b_String += "</tr>"
 
-        body +=b_String;
+        body += b_String;
     });
 
     const table = `
@@ -140,29 +140,52 @@ function table(df){
     </div>
   `;
 
-  return table;
+    return table;
 
 }
 
-function notebook_json(scope){
+function notebook_json(scope) {
 
     var store = {}
 
-    for(let key in scope){
+    for (let key in scope) {
 
         let id = key.split("-")[1]
-        
+
         let cell_content = scope[key].getValue()
 
         let cell_output = $(`#out_${key}`).html()
 
         store[`cell-${id}`] = {
             "in": cell_content,
-             "out": cell_output
+            "out": cell_output
         }
     }
 
     store = JSON.stringify(store);
 
     return store
-}
+}
+
+
+//load package scripts
+function LoadPackage(array, callback) {
+    let loader = function (src, handler) {
+        let script = document.createElement("script");
+        script.src = src;
+        script.onload = script.onreadystatechange = function () {
+            script.onreadystatechange = script.onload = null;
+            handler();
+        }
+        let head = document.getElementsByTagName("head")[0];
+        (head || document.body).appendChild(script);
+    };
+    (function run() {
+        if (array.length != 0) {
+            loader(array.shift(), run);
+        } else {
+            callback && callback();
+        }
+    })();
+}
+

notebookjs/src/views/index.hbs

@@ -30,7 +30,7 @@
                         </button>
                     </div>
 
-                    <button type="button" id="del_btn-1" class="btn btn-sm btn-danger del"><i
+                    <button type="button" id="del-btn_1" class="btn btn-sm btn-danger del"><i
                             class="fas fa-trash-alt"></i>
                     </button>
                 </div>

notebookjs/src/views/layout.hbs

@@ -10,7 +10,8 @@
   <script type="text/javascript"
     src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.52.2/mode/javascript/javascript.min.js"></script>
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.52.2/theme/monokai.min.css">
-  <script src="https://cdn.jsdelivr.net/npm/danfojs@0.1.1/dist/index.min.js"></script>
+  {{!-- <script src="https://cdn.jsdelivr.net/npm/danfojs@0.1.1/dist/index.min.js"></script> --}}
+  {{!-- <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@latest"> </script> --}}
   <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css"
     integrity="sha384-JcKb8q3iqJ61gNV9KGb8thSsNjpSL0n8PARn9HuZOnIxN0hoP+VmmDGMN5t9UJ0Z" crossorigin="anonymous">
   <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"