Skip to content

Commit

Permalink
The DOE designer table is working
Browse files Browse the repository at this point in the history
The designer UI loads the CSV and populates the entire table.
  • Loading branch information
rkrishnasanka committed Jan 25, 2019
1 parent 6264ae3 commit 2c6933a
Show file tree
Hide file tree
Showing 6 changed files with 236 additions and 2 deletions.
23 changes: 23 additions & 0 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -14,11 +14,13 @@
<link rel="stylesheet" href="lib/material/material.min.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Roboto:300,400,500,700" type="text/css">
<link rel="stylesheet" href="lib/handsontable/handsontable.full.min.css">

<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<link rel="icon" href="favicon.ico" type="image/x-icon">
<link rel="stylesheet" href="modified.css">
<link rel="stylesheet" href="animations.css">

</head>

<body>
Expand Down Expand Up @@ -587,6 +589,27 @@ <h2 class="mdl-card__title-text">Drag and drop the DXF file on the canvas</h2>
</div>
</dialog>

<dialog id="doe_dialog" class="mdl-dialog">
<div class="mdl-card__title">
<h2 class="mdl-card__title-text">Generate Design of Experiments for a Single Component</h2>
</div>
<div class="mdl-dialog__content">
<input type="file" class="upload" id="doe_input" />
<div id="taguchi-table"></div>
</div>
<!--<form action="#">-->
<!--<div class="mdl-textfield mdl-js-textfield" width="300px">-->
<!--<input class="mdl-textfield__input" type="text" id="new_component_name">-->
<!--<label class="mdl-textfield__label" for="new_component_name">Name...</label>-->
<!--</div>-->
<!--</form>-->
<br />
<div class="mdl-dialog__actions mdl-dialog__actions--full-width">
<button id="download_doe" type="button" class="mdl-button">Download Designs</button>
<button type="button" class="mdl-button close">Cancel</button>
</div>
</dialog>

<dialog id="edit_device_dialog" class="mdl-dialog">
<div class="mdl-dialog__content">
<!-- Textfield with Floating Label -->
Expand Down
37 changes: 37 additions & 0 deletions lib/handsontable/handsontable.full.min.css

Large diffs are not rendered by default.

5 changes: 3 additions & 2 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -23,13 +23,14 @@
"dependencies": {
"@dagrejs/graphlib": "^2.1.4",
"dxf-parser": "^0.6.1",
"install": "^0.12.1",
"handsontable": "^6.2.2",
"install": "^0.12.2",
"jszip": "^2.6.1",
"knockout": "^3.4.2",
"md5": "^2.2.1",
"node-uuid": ">=1.4.3",
"nouislider": "^11.1.0",
"npm": "^6.4.1",
"npm": "^6.7.0",
"paper": "^0.11.5",
"wnumb": "^1.1.0"
},
Expand Down
16 changes: 16 additions & 0 deletions src/app/core/device.js
Original file line number Diff line number Diff line change
Expand Up @@ -613,6 +613,22 @@ export default class Device {
}
}

/**
* Returns the component given by the user friendly name parameter
* return null if nothing is found
* @param name
* @return {*}
*/
getComponentByName(name){
let components = this.getComponents();
for(let i in components){
if(name == components[i].getName()){
return components[i];
}
}
return null;
}

/**
* Returns a list of connections that have not been routed yet
* @return {Array}
Expand Down
155 changes: 155 additions & 0 deletions src/app/view/ui/taguchiDesigner.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,155 @@
import Handsontable from "handsontable";

export default class TaguchiDesigner{
constructor(viewmanager){

this.__viewManagerDelegate = viewmanager;

this.__numberOfParameters = 0;
this.__numberOfLevels = 0;
this.__orthogonalArray = null;
this.__parameterHeaders = [];

//Setup the Dialog
this.__dialog = document.getElementById("doe_dialog");
this.__doeFileInput = document.getElementById("doe_input");

if(! this.__dialog.showModal){
dialogPolyfill.registerDialog(this.__dialog);
}

let ref = this;
this.__dialog.querySelector('.close').addEventListener('click', function () {
ref.__dialog.close();
});

//Setup the tableview

this.__tablecontainer = document.getElementById("taguchi-table");

if(this.__tablecontainer == null || this.__tablecontainer ==undefined){
throw new Error("Cannot find table element");
}


this.__handsonTableObject = null;

let reader = new FileReader();
reader.onload = function (e) {
//console.log(reader.result);
ref.loadCSVData(reader.result);
};

if(this.__doeFileInput){
this.__doeFileInput.addEventListener('change', function(){
let file = this.files[0];
reader.readAsText(file);
}, false);
}

}

openDialog(componentName){
let component = this.__viewManagerDelegate.currentDevice.getComponentByName(componentName);
this.__selectedComponent = component;

this.__dialog.showModal();
}

loadCSVData(text) {

this.parseCSV(text);

this.__initializeTable()


//TODO: Initialize the table based on the data in the CSV
}

parseCSV(text) {
// console.log(text);

let lines = text.split("\n");

console.log(lines);

let headers = lines[0].split(",");
this.__parameterHeaders = headers;
this.__numberOfParameters = headers.length;
console.log(headers);
let max = 0;
//Find the highest value for the parameter values
for(let i in lines){
let line = lines[i];
let items = line.split(",");
for(let ii in items){
let val = parseInt(items[ii]);
if(val > max){
max = val;
}
}
}

this.__numberOfLevels = max;
console.log("Max number of values = ", max);

//Number of parameters
console.log("# parameters", headers.length);

this.__orthogonalArray = lines.splice(1,lines.length-1);

}

__initializeTable() {
let heritables = this.__selectedComponent.getParams().heritable;
let paramoptions = [];
for(let key in heritables){
paramoptions.push(key);
}
let blank_column_format = {type:'numeric'};

let data = [];
let rowdata;

//fill out blank data
for(let y=0; y<this.__numberOfParameters; y++){
rowdata = [];
rowdata.push(paramoptions[y]);
for(let x=0; x<this.__numberOfLevels; x++){
rowdata.push(0);
}
data.push(rowdata);
}

let selectionboxcell =
{
editor: 'select',
selectOptions: paramoptions
};

let column_data = [];
column_data.push(selectionboxcell);

let col_header = ['Parameter'];

for(let i=0; i<this.__numberOfLevels; i++){
let blank = {};
column_data.push(blank_column_format);
col_header.push(i+1);
}



this.__handsonTableObject = new Handsontable(this.__tablecontainer, {
data:data,
// dataSchema: {id: null, name: {first: null, last: null}, address: null},
// startRows: 10,
colHeaders: col_header,
rowHeaders: this.__parameterHeaders,
columns: column_data,
minSpareCols: 0,
colWidths: 150
});
}

}
2 changes: 2 additions & 0 deletions src/app/view/viewManager.js
Original file line number Diff line number Diff line change
Expand Up @@ -43,6 +43,7 @@ import PaperView from "./paperView";
import AdaptiveGrid from "./grid/adaptiveGrid";
import Feature from "../core/feature";
import RatsNestRenderer2D from "./render2D/ratsNestRenderer2D";
import TaguchiDesigner from "./ui/taguchiDesigner";

export default class ViewManager {

Expand All @@ -69,6 +70,7 @@ export default class ViewManager {
this.messageBox = document.querySelector('.mdl-js-snackbar');
this.editDeviceDialog = new EditDeviceDialog(this);
this.helpDialog = new HelpDialog();
this.taguchiDesigner = new TaguchiDesigner(this);

this.__currentDevice = null;

Expand Down

0 comments on commit 2c6933a

Please sign in to comment.