add function to print table

steveoni · steveoni · commit aaad1a0ed7bb · 2020-08-19T18:25:14.000+01:00
diff --git a/notebookjs/src/public/javascripts/index.js b/notebookjs/src/public/javascripts/index.js
@@ -24,7 +24,7 @@ function exec_cell(c_id) {
         if (Array.isArray(global_scope)) {
             global_scope = print_val(global_scope)
         }
-        $(`#out_${id}`).html(global_scope || "");
+        $(`#out_${id}`).html(global_scope);
 
         count = parseInt(count) + 1
         let div_count = `div-${count}`
diff --git a/notebookjs/src/public/javascripts/utils.js b/notebookjs/src/public/javascripts/utils.js
@@ -87,4 +87,58 @@ function viz(name,callback){
     // $("#ploty").remove(`${name}`)
 
     return cb
+}
+
+function table(df){
+
+    const {col_types, series, columns, index, values} = df;
+
+    
+    let head = ""
+    if(series){
+        head += `<th class="${col_types[0]}">${columns}</th>`
+    }else{
+
+        columns.forEach((name,i)=>{
+            head +=`<th class="${col_types[i]}">${name}</th>`
+        });
+    }
+
+    let body = ""
+
+    values.forEach((row,i)=>{
+
+        let b_String = `<tr><th>${index[i]}</th>`
+
+        if(series){
+            b_String += `<td class="${col_types[0]}">${row}</td>`
+        }else{
+
+            row.forEach((v,j)=>{
+                b_String +=`<td class="${col_types[j]}">${v}</td>`
+            });
+        }
+
+        b_String +="</tr>"
+
+        body +=b_String;
+    });
+
+    const table = `
+    <div style="overflow: auto; max-height: 300px;"><table class="df-table" border="1">
+      <thead>
+        <tr>
+          <th></th>
+          ${head}
+        </tr>
+      </thead>
+      <tbody>
+        ${body}
+      </tbody>
+    </table>
+    </div>
+  `;
+
+  return table;
+
 }
diff --git a/notebookjs/src/views/index.hbs b/notebookjs/src/views/index.hbs
@@ -4,6 +4,11 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
+     <style>
+      table.df-table { white-space: pre; }
+      table.df-table th, td { padding: 2px 5px; font-variant-numeric: tabular-nums; }
+      table.df-table .float32, .int32 { text-align: right; }
+    </style>
     <title>Document</title>
 </head>
 

Original file line number	Diff line number	Diff line change
`@@ -24,7 +24,7 @@ function exec_cell(c_id) {`
`24`	`24`	`if (Array.isArray(global_scope)) {`
`25`	`25`	`global_scope = print_val(global_scope)`
`26`	`26`	`}`
`27`		- $(`#out_${id}`).html(global_scope \|\| "");
	`27`	+ $(`#out_${id}`).html(global_scope);
`28`	`28`
`29`	`29`	`count = parseInt(count) + 1`
`30`	`30`	let div_count = `div-${count}`