progress on generating javascript code

got the logger to print the javascript code now

Author: Kevin Nadro

css/stylesheet.css

@@ -676,4 +676,5 @@ input[type=number]::-webkit-outer-spin-button {
 
 .inputField{
     width: 16px;
+    border: 0;
 }

index.html

@@ -139,8 +139,14 @@ <h3>
             <input id="numColumns" type="number" value="5">
             </div>
 
+            <div>
+            Tracer Name:
+            <input id="tracerName" type="text" value="default">
+            </div>
+
             <div>
                 <button id="button-2DMatrix">Create 2DMatrix</button>
+                <button id="button-generateJS">Generate Javascript</button>
             </div>
         </div>
     </div>

js/create/index.js

@@ -12,6 +12,10 @@ const getNumColumns = () => {
     return column_field.value;
 };
 
+const getTracerName = () =>{
+    return document.getElementById("tracerName").value;
+}
+
 const fauxData = (r, c) => {
     var arr = new Array(r);
     for (var i = 0; i < c; i++) {
@@ -46,21 +50,36 @@ const makeInputFields = () =>{
 
 };
 
-const generateJS = () =>{
-    var logger = new modules.LogTracer('Generated Javascript');
+const generateJS = (logger) =>{
+    logger.clear();
     var table = document.querySelector('.mtbl-table');
 
     var numRows = table.childNodes.length;
     var numColumns = table.childNodes[0].childNodes.length;
 
+    logger.print('Copy and paste this code in your data.js file!');
+    logger.print('');
+
+    logger.print('let myTable = [');
+
     var line = '';
-    for(var i = 0; i < numRows; i++){
-        line = '';
-        for(var j = 0; j < numColumns; j++){
+    var i;
+    var j;
+    var comma = ',';
+    for(i = 0; i < numRows; i++){
+        line = '[';
+        for(j = 0; j < numColumns-1; j++){
             line += table.childNodes[i].childNodes[j].childNodes[0].value + ',';
         }
+        if(i === numRows - 1){comma = '';}
+        line += table.childNodes[i].childNodes[j++].childNodes[0].value + ']' + comma;
         logger.print(line);
     }
+    logger.print(']');
+
+
+    logger.print("let myTableTracer = new Array2DTracer ('"+getTracerName()+"')");
+    logger.print('myTableTracer._setData (myTable)');
 
 };
 
@@ -86,16 +105,24 @@ const positionModules = () =>{
 const setupButtons = () => {
 
     var button_2DMatrix = document.getElementById("button-2DMatrix");
+    var logger;
+    var arr2DTracer;
     button_2DMatrix.addEventListener('click',function(){
-        var arr2DTracer = new modules.Array2DTracer();
+        arr2DTracer = new modules.Array2DTracer();
+        logger = new modules.LogTracer('Generated Javascript');
+
         var numRows = getNumRows();
         var numColumns = getNumColumns();
         var data = fauxData(numRows, numColumns);
 
         arr2DTracer.setData(data);
         makeInputFields();
-        generateJS();
         positionModules();
+        arr2DTracer.refresh();
+    },false);
+    var button_JS = document.getElementById('button-generateJS');
+    button_JS.addEventListener('click',function(){
+        generateJS(logger);
     },false);
 
 };