Skip to content

Commit f7bcdda

Browse files
author
Kevin Nadro
committed
working version..
everything should be fine
1 parent 0dba50d commit f7bcdda

File tree

5 files changed

+137
-71
lines changed

5 files changed

+137
-71
lines changed

‎css/stylesheet.css

+23-21
Original file line numberDiff line numberDiff line change
@@ -675,7 +675,7 @@ input[type=number]::-webkit-outer-spin-button {
675675
}
676676
}
677677

678-
.buttonContainer{
678+
.buttonContainer {
679679
width: 75px;
680680
height: 25px;
681681
display: block;
@@ -684,42 +684,44 @@ input[type=number]::-webkit-outer-spin-button {
684684
background-color: white;
685685
}
686686

687-
.inputField{
687+
.inputField {
688688
width: 25px;
689689
border: 0;
690690
}
691691

692-
.sb-button{
692+
.sb-button {
693693
border: 1px solid #515151;
694694
height: 25px;
695695
margin: 0 auto;
696696
}
697697

698-
.auto-gen{
699-
height: 34%;
698+
.auto-gen {
699+
top: 30px;
700+
height: 100%;
701+
width: 100%;
700702
text-align: center;
701703
background-color: #262626;
702-
display: flex;
703704
align-items: center;
704705
}
705706

706-
.auto-gen-tracers{
707-
top: 30px;
708-
bottom: 66%;
709-
}
710-
711-
.auto-gen-options{
712-
top: 33%;
713-
bottom: 33%;
714-
}
715-
716-
.auto-gen-generate{
717-
top: 66%;
718-
}
719-
720-
.inputs{
707+
.inputs {
721708
display: inline-block;
722709
border: 0;
723710
background-color: #505050;
724711
height: 25px;
712+
width: 75px;
713+
}
714+
715+
.grid {
716+
width: 50%;
717+
height: 50%;
718+
float: left;
719+
-webkit-box-sizing: border-box;
720+
-moz-box-sizing: border-box;
721+
box-sizing: border-box;
722+
}
723+
724+
.fields {
725+
margin-top: 5px;
726+
margin-bottom: 5px;
725727
}

‎js/create/array1d.js

+45
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
'use strict';
2+
3+
const array2D = require('./array2d');
4+
const modules = require('../module');
5+
const util = require('./util');
6+
7+
const getTracerName = () =>{
8+
return document.getElementById("tracerName-1D").value;
9+
}
10+
11+
const getNumColumns = () => {
12+
var column_field = document.getElementById('numColumns-1D');
13+
return column_field.value;
14+
};
15+
16+
const setup = () => {
17+
var button_1DMatrix = document.getElementById("button-1DMatrix");
18+
var logger;
19+
var arr1DTracer;
20+
button_1DMatrix.addEventListener('click',function(){
21+
util.clearModules();
22+
arr1DTracer = new modules.Array1DTracer();
23+
var arrElem = document.querySelector('.module_wrapper');
24+
arrElem.addEventListener("mousewheel", array2D.mousescroll, false);
25+
arrElem.addEventListener("DOMMouseScroll", array2D.mousescroll, false);
26+
logger = new modules.LogTracer('Generated Javascript');
27+
28+
var numColumns = getNumColumns();
29+
var data = array2D.fauxData(1,numColumns)[0];
30+
console.log(data);
31+
arr1DTracer.setData(data);
32+
array2D.tableToInputFields(1, numColumns);
33+
util.positionModules();
34+
arr1DTracer.refresh();
35+
},false);
36+
var button_JS = document.getElementById('button-generateJS-1D');
37+
button_JS.addEventListener('click',function(){
38+
array2D.generateJS(logger, 'Array1DTracer');
39+
},false);
40+
};
41+
42+
43+
module.exports = {
44+
setup
45+
};

‎js/create/array2d.js

+22-13
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,18 @@
33
const modules = require('../module');
44
const util = require('./util');
55

6+
7+
const getTracerName = () =>{
8+
return document.getElementById("tracerName-2D").value;
9+
}
10+
611
const getNumRows = () => {
7-
var row_field = document.getElementById('numRows');
12+
var row_field = document.getElementById('numRows-2D');
813
return row_field.value;
914
}
1015

1116
const getNumColumns = () => {
12-
var column_field = document.getElementById('numColumns');
17+
var column_field = document.getElementById('numColumns-2D');
1318
return column_field.value;
1419
}
1520

@@ -24,12 +29,9 @@ const fauxData = (r, c) => {
2429
return D;
2530
}
2631

27-
const tableToInputFields = () => {
32+
const tableToInputFields = (numRows, numColumns) => {
2833
var table = document.querySelector('.mtbl-table');
2934

30-
var numRows = table.childNodes.length;
31-
var numColumns = table.childNodes[0].childNodes.length;
32-
3335
for(var i = 0; i < numRows; i++){
3436
for(var j = 0; j < numColumns; j++){
3537
var elem = document.createElement('input');
@@ -42,7 +44,9 @@ const tableToInputFields = () => {
4244
}
4345
}
4446

45-
const generateJS = (logger) => {
47+
const generateJS = (logger, tracer) => {
48+
if(!logger) return;
49+
4650
logger.clear();
4751
var table = document.querySelector('.mtbl-table');
4852

@@ -70,8 +74,10 @@ const generateJS = (logger) => {
7074
logger.print(']');
7175

7276

73-
logger.print("let myTableTracer = new Array2DTracer ('"+util.getTracerName()+"')");
77+
logger.print("let myTableTracer = new "+ tracer +" ('"+getTracerName()+"')");
7478
logger.print('myTableTracer._setData (myTable)');
79+
80+
util.enabledHightlighting();
7581
}
7682

7783
const mousescroll = (e) =>{
@@ -103,17 +109,20 @@ const setup = () => {
103109
var data = fauxData(numRows, numColumns);
104110

105111
arr2DTracer.setData(data);
106-
tableToInputFields();
112+
tableToInputFields(numRows, numColumns);
107113
util.positionModules();
108114
arr2DTracer.refresh();
109115
},false);
110-
var button_JS = document.getElementById('button-generateJS');
116+
var button_JS = document.getElementById('button-generateJS-2D');
111117
button_JS.addEventListener('click',function(){
112-
generateJS(logger);
113-
util.enabledHightlighting();
118+
generateJS(logger, 'Array2DTracer');
114119
},false);
115120
}
116121

117122
module.exports = {
118-
setup
123+
setup,
124+
mousescroll,
125+
fauxData,
126+
tableToInputFields,
127+
generateJS
119128
};

‎js/create/index.js

+46-30
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22

33
const modules = require('../module');
44
const array2d = require('./array2d');
5+
const array1d = require('./array1d');
56
const util = require('./util');
67
const Server = require('../server');
78
const DOM = require('../dom');
@@ -32,43 +33,58 @@ const reloadAlgorithm = () => {
3233
});
3334
};
3435

35-
36+
const createHTML = () => {
37+
$('.workspace').append("<div class='sandbox_container'>\
38+
<section class='close_bar'>\
39+
<div class='btn' id='btn_close'>\
40+
<div class='wrapper'>\
41+
<i class='fa fa-times' aria-hidden='true'></i>\
42+
</div>\
43+
</div>\
44+
</section>\
45+
<section class='auto-gen'>\
46+
<div class='grid' id='array1D-gen'>\
47+
<div> array1DTracer </div>\
48+
<i class='fa fa-ellipsis-h fa-5x' aria-hidden='true'></i>\
49+
<div class='fields'>\
50+
# of Columns: <input class='inputs'id='numColumns-1D' type='number' value='5'>\
51+
</div>\
52+
<div class='fields'>\
53+
Tracer Name: <input class='inputs'id='tracerName-1D' type='text' value='default'>\
54+
</div>\
55+
<button class='sb-button' id='button-1DMatrix'>Create 1DMatrix</button>\
56+
<button class='sb-button' id='button-generateJS-1D'>Generate Javascript</button>\
57+
</div>\
58+
<div class='grid' id='array2D-gen'>\
59+
<div> array2DTracer </div>\
60+
<i class='fa fa-th fa-5x' aria-hidden='true'></i>\
61+
<div class='fields'>\
62+
# of Rows: <input class='inputs'id='numRows-2D' type='number' value='5'>\
63+
</div>\
64+
<div class='fields'>\
65+
# of Columns: <input class='inputs'id='numColumns-2D' type='number' value='5'>\
66+
</div>\
67+
<div class='fields'>\
68+
Tracer Name: <input class='inputs'id='tracerName-2D' type='text' value='default'>\
69+
</div>\
70+
<button class='sb-button' id='button-2DMatrix'>Create 2DMatrix</button>\
71+
<button class='sb-button' id='button-generateJS-2D'>Generate Javascript</button>\
72+
</div>\
73+
<div class='grid' id='chart-gen'></div>\
74+
<div class='grid' id='graph-gen'></div>\
75+
</section>\
76+
</div>");
77+
};
3678

3779
const init = () => {
3880

3981
var check = $('.sandbox_container');
4082
if(!check.length){
4183
util.clearModules();
42-
43-
$('.workspace').append("<div class='sandbox_container'>\
44-
<section class='close_bar'>\
45-
<div class='btn' id='btn_close'>\
46-
<div class='wrapper'>\
47-
<i class='fa fa-times' aria-hidden='true'></i>\
48-
</div>\
49-
</div>\
50-
</section>\
51-
<section class='auto-gen auto-gen-tracers'>\
52-
<button class='sb-button' id='button-2DMatrix'>Create 2DMatrix</button>\
53-
</section>\
54-
<section class='auto-gen auto-gen-options'>\
55-
<div>\
56-
# of Rows: <input class='inputs'id='numRows' type='number' value='5'>\
57-
</div>\
58-
<div>\
59-
# of Columns: <input class='inputs'id='numColumns' type='number' value='5'>\
60-
</div>\
61-
<div>\
62-
Tracer Name: <input class='inputs'id='tracerName' type='text' value='default'>\
63-
</div>\
64-
</section>\
65-
<section class='auto-gen auto-gen-generate'>\
66-
<button class='sb-button' id='button-generateJS'>Generate Javascript</button>\
67-
</section>\
68-
</div>");
84+
createHTML();
6985
array2d.setup();
70-
71-
closeCreate(moduleWrappers);
86+
array1d.setup();
87+
closeCreate();
7288
}
7389
};
7490

‎js/create/util.js

+1-7
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,5 @@
11
'use strict';
22

3-
4-
const getTracerName = () =>{
5-
return document.getElementById("tracerName").value;
6-
}
7-
83
const positionModules = () =>{
94
var elems = document.getElementsByClassName('module_wrapper');
105
if(elems <= 0) return;
@@ -47,6 +42,5 @@ const enabledHightlighting = () =>{
4742
module.exports = {
4843
enabledHightlighting,
4944
positionModules,
50-
clearModules,
51-
getTracerName
45+
clearModules
5246
};

0 commit comments

Comments
 (0)