Skip to content
Snippets Groups Projects
Commit feed0353 authored by baigner's avatar baigner
Browse files

VISTOMS.html is on state of commit 0a0adeb now. Right click options for list view can be continued! 

Former-commit-id: f78c64778e7ea9de88e8bb7450a596e90cb5a193
parent 8dde2fa8
No related branches found
No related tags found
No related merge requests found
Pipeline #192836 canceled
Stage: build
Stage: test
Hide whitespace changes
Inline Side-by-side
kadmos/vistoms/templates/VISTOMS.html
+ 675
− 661
View file @ feed0353
...@@ -18749,7 +18749,622 @@ ...@@ -18749,7 +18749,622 @@
//aigner: Here, the data is read and the XDSM is created //aigner: Here, the data is read and the XDSM is created
//#####################################################################// //#####################################################################//
function startXDSM(data, graphID) function startXDSM(data, graphID)
{ {
//Highlight function, that shows usage of a node in the XDSM
function highlight(data,aText)
{
console.log(data)
console.log(aText)
aText = "/"+data.data.name+aText;
if (data.parent){highlight(data.parent,aText)}
else
{
scenarioKeys.forEach(function(k)
{
var xdsm_tmp;
xdsm_tmp = xdsms[k];
if (xdsm_tmp)
{
xdsm_tmp.svg.selectAll(".edge").each(function(p)
{
var firstElement_tmp = p.name.split("/")[1]
var text_fromFirst = "/"+firstElement_tmp+aText.split(firstElement_tmp)[1]
if (include(p.name,text_fromFirst))
{
var highlightEdge = d3.select(this).select("polygon");
highlightEdge
.style("stroke-width",5.)
.style("stroke","#CC0000")
d3.selectAll(".treeFrame")
.attr("fill-opacity", 0.5)
.attr("stroke-opacity", 0.5);
d3.selectAll(".nodeText").style("fill-opacity",0.5);
}
})
}
})
}
}
//Unhighlight function again
function unhighlight(data,aText)
{
aText = "/"+data.data.name+aText;
if (data.parent){unhighlight(data.parent,aText)}
else
{
scenarioKeys.forEach(function(k)
{
var xdsm_tmp;
xdsm_tmp = xdsms[k];
if (xdsm_tmp)
{
xdsm_tmp.svg.selectAll(".edge").each(function(p)
{
var firstElement_tmp = p.name.split("/")[1]
var text_fromFirst = "/"+firstElement_tmp+aText.split(firstElement_tmp)[1]
if (include(p.name,text_fromFirst))
{
var highlightEdge = d3.select(this).select("polygon");
highlightEdge
.style("stroke-width",1.)
.style("stroke","black");
d3.selectAll(".treeFrame")
.attr("fill-opacity", 0.8)
.attr("stroke-opacity", 0.8);
d3.selectAll(".nodeText").style("fill-opacity",1);
}
})
}
})
}
}
function showVariableTable(aVariable)
{
var headLine = "Node Information (" + aVariable.data.name + ")";
var data = [];
// render the table(s)
data.push({ "name" : "Name", "value" : "\""+aVariable.data.name+"\"" })
data.push({ "name" : "xPath", "value" : aVariable.data.xPath })
if (aVariable.data.type){data.push({ "name" : "Type", "value" : aVariable.data.type })}
if (aVariable.data.level){data.push({ "name" : "Level", "value" : aVariable.data.level })}
if (aVariable.data.children){data.push({ "name" : "Number of children", "value" : aVariable.data.children.length })}
if (aVariable.data.dimension){data.push({ "name" : "Dimension", "value" : aVariable.data.dimension })}
else if(aVariable.data.dimension===null){data.push({ "name" : "Dimension", "value" : "undefined" })}
if (aVariable.data.value){data.push({ "name" : "Value(s)", "value" : aVariable.data.value })}
var d3_body = d3.select("body");
var panel_div = d3_body.append("div").attr("class", "myPanel panel-default")
panel_div.append("div").attr("class","panel-heading")
.append("div").attr("class","panel_title").append("h4").text(headLine)
var listGroup = panel_div.append("div").attr("class","panel-body")
.append("table").attr("id","myTable")
.append("tbody")
data.forEach(function(listElement)
{
var row = listGroup.append("tr")
row.append("td").text(listElement.name)
row.append("td").text(listElement.value)
})
$('.myPanel').lobiPanel({
reload: false,
editTitle: false,
expand: false,
unpin: false,
resize: "none",
minWidth: 200,
minHeight: 200,
maxWidth: 1100,
maxHeight: 1200,
});
$('.myPanel').lobiPanel('unpin');
}
function markVariable(aNode,variableData)
{
function getFullXPath(data,aText)
{
aText = "/"+data.data.name+aText;
if (data.parent){return getFullXPath(data.parent,aText)}
else{return aText}
}
var path="";
var xPath = getFullXPath(aNode, path);
d3.select('.d3-context-menu').style('display', 'none');
var bootboxContent = {title: 'Marking variable as ' + variableData.variableType, message: '<p>Please be patient...</p>'};
var xhr = $.ajax({
type: 'POST',
url: '/kadmosMarkVariable',
data: {
'graphID':graphID,
'xPath':xPath,
'variableType':variableData.variableType,
'upperBound':variableData.upperBound,
'lowerBound':variableData.lowerBound,
'nominalValue':variableData.nominalValue,
'operator':variableData.operator,
'currentOrder':nodeOrder
},
success: function(result)
{
if (result.includes("ERROR:"))
{
bootboxContent.message = result
kadmosErrorMessage(bootboxContent);
}
else
{
var updatedData = {};
updatedData = data;
var graphData = JSON.parse(result);
for (var i = 0; i < updatedData.graphs.length; i++)
{
if (graphID == updatedData.graphs[i].id)
{
updatedData.graphs[i] = graphData.graphs[0];
}
}
clearView();
makeKadmosMenu(updatedData);
xdsm_script(updatedData,graphID);
bootboxContent.message = "Success!"
kadmosSuccessMessage(bootboxContent)
}
},
error: function(result)
{
bootboxContent.message = result
kadmosErrorMessage(bootboxContent);
}
});
kadmosHavePatience(xhr, bootboxContent)
}
function unmarkVariable(aNode)
{
var firstFromSchema = currentGraph.variableSchemes["schema"].name
function getFullXPath(data,aText)
{
aText = "/"+data.data.name+aText;
if (data.parent){return getFullXPath(data.parent,aText)}
else{return aText}
}
var path="";
var xPath = getFullXPath(aNode, path);
var xPath_split = xPath.split(firstFromSchema)[1]
xPath = "/"+firstFromSchema+xPath_split;
d3.select('.d3-context-menu').style('display', 'none');
var bootboxContent = {title: 'Unmarking variable<p>Please be patient...</p>'};
var xhr = $.ajax({
type: 'POST',
url: '/kadmosUnmarkVariable',
data: {
'graphID':graphID,
'xPath':xPath,
'currentOrder':nodeOrder
},
success: function(result)
{
if (result.includes("ERROR:"))
{
bootboxContent.message = result
kadmosErrorMessage(bootboxContent);
}
else
{
var updatedData = {};
updatedData = data;
var graphData = JSON.parse(result);
for (var i = 0; i < updatedData.graphs.length; i++)
{
if (graphID == updatedData.graphs[i].id)
{
updatedData.graphs[i] = graphData.graphs[0];
}
}
clearView();
makeKadmosMenu(updatedData);
xdsm_script(updatedData,graphID);
bootboxContent.message = "Success!"
kadmosSuccessMessage(bootboxContent)
}
},
error: function(result)
{
bootboxContent.message = result
kadmosErrorMessage(bootboxContent);
}
});
kadmosHavePatience(xhr, bootboxContent)
}
//aigner: Marking variables as ... in KADMOS
var markingOptions = [
{
title: 'design variable',
onMouseClick: function(elm, d, i) {
var theVariableData = {};
theVariableData.variableType = "designVariable";
theVariableData.operator = "";
theVariableData.upperBound = 0.;
theVariableData.lowerBound = 0.;
theVariableData.nominalValue = 0.;
bootbox.hideAll();
bootbox.confirm({
title: 'Marking variable as ' + theVariableData.variableType,
message:"<form id='infos' action=''>"
+"\Nominal Value: <input type='text' id='nominalValue' name='nominalValue' /><br/>"
+"\Upper Bound: <input type='text' id='upperBound' name='upperBound' /><br/>"
+"\Lower Bound: <input type='text' id='lowerBound' name='lowerBound' />\</form>",
callback: function(result){
if(result){
theVariableData.nominalValue = $('#nominalValue').submit()[0].value;
theVariableData.upperBound = $('#upperBound').submit()[0].value;
theVariableData.lowerBound = $('#lowerBound').submit()[0].value;
markVariable(elm.__data__, theVariableData);
}
}
});
},
onMouseOver: function(elm,d,i){}
},
{
title: 'objective',
onMouseClick: function(elm, d, i) {
var theVariableData = {};
theVariableData.variableType = "objective";
theVariableData.operator = "";
theVariableData.upperBound = 0.;
theVariableData.lowerBound = 0.;
theVariableData.nominalValue = 0.;
markVariable(elm.__data__, theVariableData);
},
onMouseOver: function(elm,d,i){}
},
{
title: 'constraint',
onMouseClick: function(elm, d, i) {
var theVariableData = {};
theVariableData.variableType = "constraint";
theVariableData.operator = "";
theVariableData.upperBound = 0.;
theVariableData.lowerBound = 0.;
theVariableData.nominalValue = 0.;
bootbox.hideAll();
bootbox.confirm({
title: 'Marking variable as ' + theVariableData.variableType,
message:"<form id='infos' action=''>"
+"\Nominal Value: <input type='text' id='nominalValue' name='nominalValue' /><br/>"
+"\Mathematical operator (<, <=, = ,>=, >): <input type='text' id='operator' name='operator' />\</form>",
callback: function(result){
if(result){
theVariableData.nominalValue = $('#nominalValue').submit()[0].value;
theVariableData.operator = $('#operator').submit()[0].value;
markVariable(elm.__data__, theVariableData);
}
}
});
},
onMouseOver: function(elm,d,i){}
},
{
title: 'quantity of interest',
onMouseClick: function(elm, d, i) {
var theVariableData = {};
theVariableData.variableType = "quantityOfInterest";
theVariableData.operator = "";
theVariableData.upperBound = 0.;
theVariableData.lowerBound = 0.;
theVariableData.nominalValue = 0.;
markVariable(elm.__data__, theVariableData);
},
onMouseOver: function(elm,d,i){}
},
];
//menu --> functions for right click options
var nodeMenu = [
{
title: 'Show node information',
onMouseDown: function(elm, d, i) {
console.log(elm)
console.log(d)
showVariableTable(d);
},
onMouseUp: function(elm, d, i) {},
onMouseOver: function(elm, d, i) {},
childrenItems: []
},
{
title: 'Show usage of node in XDSM',
onMouseDown: function(elm, d, i) {
var theText="";
highlight(d,theText);
},
onMouseUp: function(elm, d, i) {
var theText="";
unhighlight(d,theText);
},
onMouseOver: function(elm, d, i) {
},
childrenItems: []
},
{
title: 'Copy x-path to clipboard',
onMouseDown: function(elm, d, i) {
function copyToClipboard(text)
{
window.prompt("Copy to clipboard: Ctrl+C, Enter", text);
}
function copyXPathToClipboard(data,aText)
{
aText = "/"+data.data.name+aText;
if (data.parent){copyXPathToClipboard(data.parent,aText)}
else{copyToClipboard(aText);}
}
var copyText="";
copyXPathToClipboard(d,copyText);
d3.select('.d3-context-menu').style('display', 'none');
},
onMouseUp: function(elm, d, i) {
},
onMouseOver: function(elm, d, i) {
},
childrenItems: []
},
{
title: 'Download full tree as XML-file',
onMouseDown: function(elm, d, i) {
//Begin xml structure with the first element
var xmlString = "<"+nodes[0].data.name+">"+"</"+nodes[0].data.name+">";
//Create a new xml document
var parser = new DOMParser();
var xmlDocument = parser.parseFromString(xmlString, "text/xml"); //important to use "text/xml"
//Get initial xPath of the tree and pass it to the function "writeTreeToXML"
var initialXPath = "/"+nodes[0].data.name;
writeTreeToXML(nodes[0],xmlDocument,initialXPath);
//remove all attributes dummyID
removeAttributeInAllElements(xmlDocument,'dummyID');
//Make the xml document a string
var serializer = new XMLSerializer();
var xmlString = serializer.serializeToString(xmlDocument);
xmlString = vkbeautify.xml(xmlString);
//Download a document with the xml-schema
download(aName+'_full.xml',xmlString);
},
onMouseUp: function(elm, d, i) {
},
onMouseOver: function(elm, d, i) {
},
childrenItems: []
},
{
title: 'Download tree as XML-file from current node',
onMouseDown: function(elm, d, i) {
var xmlString = putAncestorsInXMLString({ val : '' }, d).val;
var initialXPath = putAncestorsInXPath({ val : '' }, d).val;
//Create a new xml document
var parser = new DOMParser();
var xmlDocument = parser.parseFromString(xmlString, "text/xml"); //important to use "text/xml"
//Get initial xPath of the tree and pass it to the function "writeCurrentTreeToXML"
writeTreeToXML(d,xmlDocument,initialXPath);
//remove all attributes dummyID
removeAttributeInAllElements(xmlDocument,'dummyID');
//Make the xml document a string
var serializer = new XMLSerializer();
xmlString = serializer.serializeToString(xmlDocument);
xmlString = vkbeautify.xml(xmlString);
//Download a document with the xml-schema
download(aName+"_"+d.data.name+'.xml',xmlString);
},
onMouseUp: function(elm, d, i) {
},
onMouseOver: function(elm, d, i) {
},
childrenItems: []
},
{
title: 'Mark variable',
onMouseDown: function(elm, d, i) {},
onMouseUp: function(elm, d, i) {},
onMouseOver: function(elm, d, i) {},
childrenItems: markingOptions
},
{
title: 'Unmark variable',
onMouseDown: function(elm, d, i) {
bootbox.hideAll();
bootbox.confirm("Are you sure you want to do this?", function(sure)
{
if (sure)
{unmarkVariable(elm.__data__)}
})
},
onMouseUp: function(elm, d, i) {},
onMouseOver: function(elm, d, i) {},
childrenItems: []
}
]
//Function writeTreeToXML goes through tree nodes and puts the into an xml document
function writeTreeToXML(aNode,anXMLDoc,anXPath)
{
//Variable "children"
//--> One children variable, no matter whether a node has "_children" (collapsed) or "children" (expanded)
var children;
if (aNode._children){children = aNode._children;}
else if (aNode.children){children = aNode.children;}
//Get current xml element with its xPath
var element = anXMLDoc.evaluate(anXPath,anXMLDoc, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null ).singleNodeValue;
if (element != null) {element.value = '...';}
//If a node has children (collapsed or expanded), loop through them
if (children)
{
for (var i=0; i < children.length;i++)
{
//Name of the new XML element --> childName
var child = children[i];
var childName = child.data.name.split(/[\[\]]+/);//Split childName at "[]" which is the uID
var cleanChildName = childName[0].split(/[\+\*\^\-\ \#]+/);//Split childName all special characters
var newNode = anXMLDoc.createElement(String(cleanChildName[0]));
//The children are appended to the xPath --> newXPath
var newXPath = anXPath+"/"+cleanChildName[0];
//If childName contains a uID, make the uID an attribute
if (childName[1])
{
if (parseInt(childName[1]))
{
var dummyID = childName[1];
newNode.setAttribute("dummyID", dummyID)
newXPath = newXPath+"[@dummyID='"+dummyID+"']";
}
else
{
var uID = childName[1];
newNode.setAttribute("uID", uID)
newXPath = newXPath+"[@uID='"+uID+"']";
}
}
if (cleanChildName.length>1) {newNode.setAttribute("elementName", childName[0])};
//Append the newNode to the xml structure
element.appendChild(newNode);
////aigner: Sorting of XML elements according to "uID"
// var items = element.children;
// var itemsArr = [];
// for (var j in items) {
// if (items[j].nodeType == 1) { // get rid of the whitespace text nodes
// itemsArr.push(items[j]);
// }
// }
// itemsArr.sort(function(a,b){
// if (a.getAttribute("uID") < b.getAttribute("uID"))
// return -1;
// if (a.getAttribute("uID") > b.getAttribute("uID"))
// return 1;
// return 0;
// });
// for (j = 0; j < itemsArr.length; ++j) {
// element.appendChild(itemsArr[j]);
// }
//call function writeTreeToXML recursively for all children
writeTreeToXML(child,anXMLDoc,newXPath)
}
}
else
{
if (aNode.data.value){element.innerHTML = String(aNode.data.value);}
else{element.innerHTML = " ";}
}
//return the xml document
return anXMLDoc;
}
function removeAttributeInAllElements(aDocument,attribute)
{
var matchingElements = [];
var allElements = aDocument.getElementsByTagName('*');
for (var i = 0, n = allElements.length; i < n; i++)
{
if (allElements[i].getAttribute(attribute) !== null)
{
allElements[i].removeAttribute(attribute);
}
}
return matchingElements;
}
function putAncestorsInXMLString(strWrapper, aNode)
{
//Name of the new XML element
var nodeName = aNode.data.name.split(/[\[\]]+/);//Split name at "[]" which is the uID
var cleanNodeName = nodeName[0].split(/[\+\*\^\-\ \#]+/);//Split nodeName all special characters
//If nodeName contains a uID, make the uID an attribute
if (nodeName[1])
{
var uID = nodeName[1];
strWrapper.val = "<"+cleanNodeName[0]+" uID='"+ uID +"'>"+strWrapper.val+"</"+cleanNodeName[0]+">";;
}
else
{
strWrapper.val = "<"+cleanNodeName[0]+">"+strWrapper.val+"</"+cleanNodeName[0]+">";;
}
var aParent = aNode.parent;
if (aParent)
{
return putAncestorsInXMLString(strWrapper, aParent);
}
else
{
return strWrapper;
}
}
function putAncestorsInXPath(strWrapper, aNode)
{
//Name of the new XML element
var nodeName = aNode.data.name.split(/[\[\]]+/);//Split name at "[]" which is the uID
var cleanNodeName = nodeName[0].split(/[\+\*\^\-\ \#]+/);//Split nodeName all special characters
//If nodeName contains a uID, make the uID an attribute
if (nodeName[1])
{
var uID = nodeName[1];
strWrapper.val = "/"+cleanNodeName[0]+"[@uID='"+uID+"']"+strWrapper.val;
}
else
{
strWrapper.val = "/"+cleanNodeName[0]+strWrapper.val;
}
var aParent = aNode.parent;
if (aParent)
{
return putAncestorsInXPath(strWrapper, aParent);
}
else
{
return strWrapper;
}
}
var graphs, currentGraph, varCategories, entireData; var graphs, currentGraph, varCategories, entireData;
entireData = data; entireData = data;
...@@ -19407,15 +20022,43 @@ ...@@ -19407,15 +20022,43 @@
else else
{ {
bootbox.hideAll(); bootbox.hideAll();
var schema = currentGraph.variableSchemes[varCategories[0].description]; var treeData = (JSON.parse(JSON.stringify(currentGraph.variableSchemes[varCategories[0].description])));
var treeData = (JSON.parse(JSON.stringify(schema))); var firstEl = treeData[0].xPath.split("/")[1]
var graphElements = JSON.parse(result) var graphElements = JSON.parse(result)
var message = ""; var message = "";
if (result.includes("/"+treeData.name)) var variables = [];
var functions = [];
if (result.includes("/"+firstEl))
{ {
bootbox.prompt( var pipeData = [];
//There are variables in the result
graphElements.forEach(function(graphElement)
{
if (graphElement.includes("/"+firstEl))
{
pipeData += ","+graphElement;
}
else
{
functions.push({name:graphElement,type:"function"})
}
})
variables = JSON.parse(JSON.stringify(treeData))
prune_tree(pipeData,variables)
//aigner: HIER WEITER! evtl. treeData aufbauen (buildTree) um nodeMenu einfacher zu machen
variables.forEach(function(variable)
{
variable.name = variable.xPath
//work around because nodeMenu expexts the data, to have a "data" object inside
variable.data = variable
variable.data.name = variable.xPath.split("/")[variable.xPath.split("/").length-1]
})
bootbox.prompt(
{ {
title: "The graph elements you requested contain variables. How do you want them displayed?", title: "The graph elements you requested contain variables. How do you want them displayed?",
inputType: 'checkbox', inputType: 'checkbox',
...@@ -19425,30 +20068,9 @@ ...@@ -19425,30 +20068,9 @@
if (result) if (result)
{ {
var message1 = "", message2 = ""; var message1 = "", message2 = "";
var array
var array = "" bootbox.hideAll();
var list = []; if(result.includes("Tree View"))
graphElements.forEach(function(graphElement)
{
if (graphElement.includes("/"+treeData.name))
{
if (result.includes("Tree View"))
{
if (array == ""){array += graphElement}
else{array += "," + graphElement}
}
if (result.includes("List"))
{
list.push({name:graphElement,type:"variable"});
}
}
else
{
list.push({name:graphElement,type:"function"});
}
})
if(array!="")
{ {
var headLine = "Tree Layout for category:\" " + category + "\", subcategory:\" " + sub_category + "\""; var headLine = "Tree Layout for category:\" " + category + "\", subcategory:\" " + sub_category + "\"";
var d3_body = d3.select("body"); var d3_body = d3.select("body");
...@@ -19473,24 +20095,28 @@ ...@@ -19473,24 +20095,28 @@
var treeLayoutSVG = treeLayoutdiv.append("svg").attr("class","treeLayoutSVG") var treeLayoutSVG = treeLayoutdiv.append("svg").attr("class","treeLayoutSVG")
var treeLayout = treeLayoutSVG.append("g").attr("class","treeLayout"); var treeLayout = treeLayoutSVG.append("g").attr("class","treeLayout");
maketreeLayout(array, treeLayout, treeLayoutSVG, treeLayoutdiv, divClassName, headLine, varCategories[0].description); maketreeLayout(array, treeLayout, treeLayoutSVG, treeLayoutdiv, divClassName, headLine, varCategories[0].description);
show_bootBox_listMessage(functions,nodeMenu);
} }
if (result.includes("List"))
show_bootBox_listMessage(list); {
show_bootBox_listMessage(variables,nodeMenu);
show_bootBox_listMessage(functions,nodeMenu);
}
} }
} }
}) })
} }
else else
{ {
var list = []; var functions = [];
graphElements.forEach(function(graphElement) graphElements.forEach(function(graphElement)
{ {
list.push({name:graphElement,type:"function"}) functions.push({name:graphElement,type:"function"})
}) })
show_bootBox_listMessage(list) show_bootBox_listMessage(functions,toolMenu)
} }
function show_bootBox_listMessage(aList) function show_bootBox_listMessage(aList,aMenu)
{ {
if (aList.length != 0) if (aList.length != 0)
{ {
...@@ -19512,22 +20138,12 @@ ...@@ -19512,22 +20138,12 @@
.append("table").attr("id","myTable") .append("table").attr("id","myTable")
.append("tbody") .append("tbody")
aList.forEach(function(listElement) var tr = listGroup
{ .selectAll('tr')
var td = listGroup.append("tr").append("td") .data(aList).enter()
.text(listElement.name) .append('tr')
.on("mouseover",function(){ var td = tr.append("td").html(function(d) { return d.xPath; })
d3.select(this).style("cursor", "pointer") tr.on('contextmenu', d3.contextMenu(aMenu));
})
if (listElement.type=="variable")
{
td.on("mousedown",function(){bootbox.alert("I'm a variable!")})
}
else if (listElement.type=="function")
{
td.on("mousedown",function(){bootbox.alert("I'm a function!")})
}
})
$('.myPanel').lobiPanel({ $('.myPanel').lobiPanel({
reload: false, reload: false,
editTitle: false, editTitle: false,
...@@ -21760,609 +22376,7 @@ ...@@ -21760,609 +22376,7 @@
return d.children || d._children ? "end" : "start"; return d.children || d._children ? "end" : "start";
}) })
//.text(function(d) { return d.data.text; }); //.text(function(d) { return d.data.text; });
//Highlight function, that shows usage of a node in the XDSM
function highlight(data,aText)
{
aText = "/"+data.data.name+aText;
if (data.parent){highlight(data.parent,aText)}
else
{
scenarioKeys.forEach(function(k)
{
var xdsm_tmp;
xdsm_tmp = xdsms[k];
if (xdsm_tmp)
{
xdsm_tmp.svg.selectAll(".edge").each(function(p)
{
var firstElement_tmp = p.name.split("/")[1]
var text_fromFirst = "/"+firstElement_tmp+aText.split(firstElement_tmp)[1]
if (include(p.name,text_fromFirst))
{
var highlightEdge = d3.select(this).select("polygon");
highlightEdge
.style("stroke-width",5.)
.style("stroke","#CC0000")
d3.selectAll(".treeFrame")
.attr("fill-opacity", 0.5)
.attr("stroke-opacity", 0.5);
d3.selectAll(".nodeText").style("fill-opacity",0.5);
}
})
}
})
}
}
//Unhighlight function again
function unhighlight(data,aText)
{
aText = "/"+data.data.name+aText;
if (data.parent){unhighlight(data.parent,aText)}
else
{
scenarioKeys.forEach(function(k)
{
var xdsm_tmp;
xdsm_tmp = xdsms[k];
if (xdsm_tmp)
{
xdsm_tmp.svg.selectAll(".edge").each(function(p)
{
var firstElement_tmp = p.name.split("/")[1]
var text_fromFirst = "/"+firstElement_tmp+aText.split(firstElement_tmp)[1]
if (include(p.name,text_fromFirst))
{
var highlightEdge = d3.select(this).select("polygon");
highlightEdge
.style("stroke-width",1.)
.style("stroke","black");
d3.selectAll(".treeFrame")
.attr("fill-opacity", 0.8)
.attr("stroke-opacity", 0.8);
d3.selectAll(".nodeText").style("fill-opacity",1);
}
})
}
})
}
}
function showVariableTable(aVariable)
{
var headLine = "Node Information (" + aVariable.data.name + ")";
var data = [];
// render the table(s)
data.push({ "name" : "Name", "value" : "\""+aVariable.data.name+"\"" })
data.push({ "name" : "xPath", "value" : aVariable.data.xPath })
if (aVariable.data.type){data.push({ "name" : "Type", "value" : aVariable.data.type })}
if (aVariable.data.level){data.push({ "name" : "Level", "value" : aVariable.data.level })}
if (aVariable.data.children){data.push({ "name" : "Number of children", "value" : aVariable.data.children.length })}
if (aVariable.data.dimension){data.push({ "name" : "Dimension", "value" : aVariable.data.dimension })}
else if(aVariable.data.dimension===null){data.push({ "name" : "Dimension", "value" : "undefined" })}
if (aVariable.data.value){data.push({ "name" : "Value(s)", "value" : aVariable.data.value })}
var d3_body = d3.select("body");
var panel_div = d3_body.append("div").attr("class", "myPanel panel-default")
panel_div.append("div").attr("class","panel-heading")
.append("div").attr("class","panel_title").append("h4").text(headLine)
var listGroup = panel_div.append("div").attr("class","panel-body")
.append("table").attr("id","myTable")
.append("tbody")
data.forEach(function(listElement)
{
var row = listGroup.append("tr")
row.append("td").text(listElement.name)
row.append("td").text(listElement.value)
})
$('.myPanel').lobiPanel({
reload: false,
editTitle: false,
expand: false,
unpin: false,
resize: "none",
minWidth: 200,
minHeight: 200,
maxWidth: 1100,
maxHeight: 1200,
});
$('.myPanel').lobiPanel('unpin');
}
function markVariable(aNode,variableData)
{
function getFullXPath(data,aText)
{
aText = "/"+data.data.name+aText;
if (data.parent){return getFullXPath(data.parent,aText)}
else{return aText}
}
var path="";
var xPath = getFullXPath(aNode, path);
d3.select('.d3-context-menu').style('display', 'none');
var bootboxContent = {title: 'Marking variable as ' + variableData.variableType, message: '<p>Please be patient...</p>'};
var xhr = $.ajax({
type: 'POST',
url: '/kadmosMarkVariable',
data: {
'graphID':graphID,
'xPath':xPath,
'variableType':variableData.variableType,
'upperBound':variableData.upperBound,
'lowerBound':variableData.lowerBound,
'nominalValue':variableData.nominalValue,
'operator':variableData.operator,
'currentOrder':nodeOrder
},
success: function(result)
{
if (result.includes("ERROR:"))
{
bootboxContent.message = result
kadmosErrorMessage(bootboxContent);
}
else
{
var updatedData = {};
updatedData = data;
var graphData = JSON.parse(result);
for (var i = 0; i < updatedData.graphs.length; i++)
{
if (graphID == updatedData.graphs[i].id)
{
updatedData.graphs[i] = graphData.graphs[0];
}
}
clearView();
makeKadmosMenu(updatedData);
xdsm_script(updatedData,graphID);
bootboxContent.message = "Success!"
kadmosSuccessMessage(bootboxContent)
}
},
error: function(result)
{
bootboxContent.message = result
kadmosErrorMessage(bootboxContent);
}
});
kadmosHavePatience(xhr, bootboxContent)
}
function unmarkVariable(aNode)
{
var firstFromSchema = currentGraph.variableSchemes["schema"].name
function getFullXPath(data,aText)
{
aText = "/"+data.data.name+aText;
if (data.parent){return getFullXPath(data.parent,aText)}
else{return aText}
}
var path="";
var xPath = getFullXPath(aNode, path);
var xPath_split = xPath.split(firstFromSchema)[1]
xPath = "/"+firstFromSchema+xPath_split;
d3.select('.d3-context-menu').style('display', 'none');
var bootboxContent = {title: 'Unmarking variable<p>Please be patient...</p>'};
var xhr = $.ajax({
type: 'POST',
url: '/kadmosUnmarkVariable',
data: {
'graphID':graphID,
'xPath':xPath,
'currentOrder':nodeOrder
},
success: function(result)
{
if (result.includes("ERROR:"))
{
bootboxContent.message = result
kadmosErrorMessage(bootboxContent);
}
else
{
var updatedData = {};
updatedData = data;
var graphData = JSON.parse(result);
for (var i = 0; i < updatedData.graphs.length; i++)
{
if (graphID == updatedData.graphs[i].id)
{
updatedData.graphs[i] = graphData.graphs[0];
}
}
clearView();
makeKadmosMenu(updatedData);
xdsm_script(updatedData,graphID);
bootboxContent.message = "Success!"
kadmosSuccessMessage(bootboxContent)
}
},
error: function(result)
{
bootboxContent.message = result
kadmosErrorMessage(bootboxContent);
}
});
kadmosHavePatience(xhr, bootboxContent)
}
//aigner: Marking variables as ... in KADMOS
var markingOptions = [
{
title: 'design variable',
onMouseClick: function(elm, d, i) {
var theVariableData = {};
theVariableData.variableType = "designVariable";
theVariableData.operator = "";
theVariableData.upperBound = 0.;
theVariableData.lowerBound = 0.;
theVariableData.nominalValue = 0.;
bootbox.hideAll();
bootbox.confirm({
title: 'Marking variable as ' + theVariableData.variableType,
message:"<form id='infos' action=''>"
+"\Nominal Value: <input type='text' id='nominalValue' name='nominalValue' /><br/>"
+"\Upper Bound: <input type='text' id='upperBound' name='upperBound' /><br/>"
+"\Lower Bound: <input type='text' id='lowerBound' name='lowerBound' />\</form>",
callback: function(result){
if(result){
theVariableData.nominalValue = $('#nominalValue').submit()[0].value;
theVariableData.upperBound = $('#upperBound').submit()[0].value;
theVariableData.lowerBound = $('#lowerBound').submit()[0].value;
markVariable(elm.__data__, theVariableData);
}
}
});
},
onMouseOver: function(elm,d,i){}
},
{
title: 'objective',
onMouseClick: function(elm, d, i) {
var theVariableData = {};
theVariableData.variableType = "objective";
theVariableData.operator = "";
theVariableData.upperBound = 0.;
theVariableData.lowerBound = 0.;
theVariableData.nominalValue = 0.;
markVariable(elm.__data__, theVariableData);
},
onMouseOver: function(elm,d,i){}
},
{
title: 'constraint',
onMouseClick: function(elm, d, i) {
var theVariableData = {};
theVariableData.variableType = "constraint";
theVariableData.operator = "";
theVariableData.upperBound = 0.;
theVariableData.lowerBound = 0.;
theVariableData.nominalValue = 0.;
bootbox.hideAll();
bootbox.confirm({
title: 'Marking variable as ' + theVariableData.variableType,
message:"<form id='infos' action=''>"
+"\Nominal Value: <input type='text' id='nominalValue' name='nominalValue' /><br/>"
+"\Mathematical operator (<, <=, = ,>=, >): <input type='text' id='operator' name='operator' />\</form>",
callback: function(result){
if(result){
theVariableData.nominalValue = $('#nominalValue').submit()[0].value;
theVariableData.operator = $('#operator').submit()[0].value;
markVariable(elm.__data__, theVariableData);
}
}
});
},
onMouseOver: function(elm,d,i){}
},
{
title: 'quantity of interest',
onMouseClick: function(elm, d, i) {
var theVariableData = {};
theVariableData.variableType = "quantityOfInterest";
theVariableData.operator = "";
theVariableData.upperBound = 0.;
theVariableData.lowerBound = 0.;
theVariableData.nominalValue = 0.;
markVariable(elm.__data__, theVariableData);
},
onMouseOver: function(elm,d,i){}
},
];
//menu --> functions for right click options
var nodeMenu = [
{
title: 'Show node information',
onMouseDown: function(elm, d, i) {
showVariableTable(d);
},
onMouseUp: function(elm, d, i) {},
onMouseOver: function(elm, d, i) {},
childrenItems: []
},
{
title: 'Show usage of node in XDSM',
onMouseDown: function(elm, d, i) {
var theText="";
highlight(d,theText);
},
onMouseUp: function(elm, d, i) {
var theText="";
unhighlight(d,theText);
},
onMouseOver: function(elm, d, i) {
},
childrenItems: []
},
{
title: 'Copy x-path to clipboard',
onMouseDown: function(elm, d, i) {
function copyToClipboard(text)
{
window.prompt("Copy to clipboard: Ctrl+C, Enter", text);
}
function copyXPathToClipboard(data,aText)
{
aText = "/"+data.data.name+aText;
if (data.parent){copyXPathToClipboard(data.parent,aText)}
else{copyToClipboard(aText);}
}
var copyText="";
copyXPathToClipboard(d,copyText);
d3.select('.d3-context-menu').style('display', 'none');
},
onMouseUp: function(elm, d, i) {
},
onMouseOver: function(elm, d, i) {
},
childrenItems: []
},
{
title: 'Download full tree as XML-file',
onMouseDown: function(elm, d, i) {
//Begin xml structure with the first element
var xmlString = "<"+nodes[0].data.name+">"+"</"+nodes[0].data.name+">";
//Create a new xml document
var parser = new DOMParser();
var xmlDocument = parser.parseFromString(xmlString, "text/xml"); //important to use "text/xml"
//Get initial xPath of the tree and pass it to the function "writeTreeToXML"
var initialXPath = "/"+nodes[0].data.name;
writeTreeToXML(nodes[0],xmlDocument,initialXPath);
//remove all attributes dummyID
removeAttributeInAllElements(xmlDocument,'dummyID');
//Make the xml document a string
var serializer = new XMLSerializer();
var xmlString = serializer.serializeToString(xmlDocument);
xmlString = vkbeautify.xml(xmlString);
//Download a document with the xml-schema
download(aName+'_full.xml',xmlString);
},
onMouseUp: function(elm, d, i) {
},
onMouseOver: function(elm, d, i) {
},
childrenItems: []
},
{
title: 'Download tree as XML-file from current node',
onMouseDown: function(elm, d, i) {
var xmlString = putAncestorsInXMLString({ val : '' }, d).val;
var initialXPath = putAncestorsInXPath({ val : '' }, d).val;
//Create a new xml document
var parser = new DOMParser();
var xmlDocument = parser.parseFromString(xmlString, "text/xml"); //important to use "text/xml"
//Get initial xPath of the tree and pass it to the function "writeCurrentTreeToXML"
writeTreeToXML(d,xmlDocument,initialXPath);
//remove all attributes dummyID
removeAttributeInAllElements(xmlDocument,'dummyID');
//Make the xml document a string
var serializer = new XMLSerializer();
xmlString = serializer.serializeToString(xmlDocument);
xmlString = vkbeautify.xml(xmlString);
//Download a document with the xml-schema
download(aName+"_"+d.data.name+'.xml',xmlString);
},
onMouseUp: function(elm, d, i) {
},
onMouseOver: function(elm, d, i) {
},
childrenItems: []
},
{
title: 'Mark variable',
onMouseDown: function(elm, d, i) {},
onMouseUp: function(elm, d, i) {},
onMouseOver: function(elm, d, i) {},
childrenItems: markingOptions
},
{
title: 'Unmark variable',
onMouseDown: function(elm, d, i) {
bootbox.hideAll();
bootbox.confirm("Are you sure you want to do this?", function(sure)
{
if (sure)
{unmarkVariable(elm.__data__)}
})
},
onMouseUp: function(elm, d, i) {},
onMouseOver: function(elm, d, i) {},
childrenItems: []
}
]
//Function writeTreeToXML goes through tree nodes and puts the into an xml document
function writeTreeToXML(aNode,anXMLDoc,anXPath)
{
//Variable "children"
//--> One children variable, no matter whether a node has "_children" (collapsed) or "children" (expanded)
var children;
if (aNode._children){children = aNode._children;}
else if (aNode.children){children = aNode.children;}
//Get current xml element with its xPath
var element = anXMLDoc.evaluate(anXPath,anXMLDoc, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null ).singleNodeValue;
if (element != null) {element.value = '...';}
//If a node has children (collapsed or expanded), loop through them
if (children)
{
for (var i=0; i < children.length;i++)
{
//Name of the new XML element --> childName
var child = children[i];
var childName = child.data.name.split(/[\[\]]+/);//Split childName at "[]" which is the uID
var cleanChildName = childName[0].split(/[\+\*\^\-\ \#]+/);//Split childName all special characters
var newNode = anXMLDoc.createElement(String(cleanChildName[0]));
//The children are appended to the xPath --> newXPath
var newXPath = anXPath+"/"+cleanChildName[0];
//If childName contains a uID, make the uID an attribute
if (childName[1])
{
if (parseInt(childName[1]))
{
var dummyID = childName[1];
newNode.setAttribute("dummyID", dummyID)
newXPath = newXPath+"[@dummyID='"+dummyID+"']";
}
else
{
var uID = childName[1];
newNode.setAttribute("uID", uID)
newXPath = newXPath+"[@uID='"+uID+"']";
}
}
if (cleanChildName.length>1) {newNode.setAttribute("elementName", childName[0])};
//Append the newNode to the xml structure
element.appendChild(newNode);
////aigner: Sorting of XML elements according to "uID"
// var items = element.children;
// var itemsArr = [];
// for (var j in items) {
// if (items[j].nodeType == 1) { // get rid of the whitespace text nodes
// itemsArr.push(items[j]);
// }
// }
// itemsArr.sort(function(a,b){
// if (a.getAttribute("uID") < b.getAttribute("uID"))
// return -1;
// if (a.getAttribute("uID") > b.getAttribute("uID"))
// return 1;
// return 0;
// });
// for (j = 0; j < itemsArr.length; ++j) {
// element.appendChild(itemsArr[j]);
// }
//call function writeTreeToXML recursively for all children
writeTreeToXML(child,anXMLDoc,newXPath)
}
}
else
{
if (aNode.data.value){element.innerHTML = String(aNode.data.value);}
else{element.innerHTML = " ";}
}
//return the xml document
return anXMLDoc;
}
function removeAttributeInAllElements(aDocument,attribute)
{
var matchingElements = [];
var allElements = aDocument.getElementsByTagName('*');
for (var i = 0, n = allElements.length; i < n; i++)
{
if (allElements[i].getAttribute(attribute) !== null)
{
allElements[i].removeAttribute(attribute);
}
}
return matchingElements;
}
function putAncestorsInXMLString(strWrapper, aNode)
{
//Name of the new XML element
var nodeName = aNode.data.name.split(/[\[\]]+/);//Split name at "[]" which is the uID
var cleanNodeName = nodeName[0].split(/[\+\*\^\-\ \#]+/);//Split nodeName all special characters
//If nodeName contains a uID, make the uID an attribute
if (nodeName[1])
{
var uID = nodeName[1];
strWrapper.val = "<"+cleanNodeName[0]+" uID='"+ uID +"'>"+strWrapper.val+"</"+cleanNodeName[0]+">";;
}
else
{
strWrapper.val = "<"+cleanNodeName[0]+">"+strWrapper.val+"</"+cleanNodeName[0]+">";;
}
var aParent = aNode.parent;
if (aParent)
{
return putAncestorsInXMLString(strWrapper, aParent);
}
else
{
return strWrapper;
}
}
function putAncestorsInXPath(strWrapper, aNode)
{
//Name of the new XML element
var nodeName = aNode.data.name.split(/[\[\]]+/);//Split name at "[]" which is the uID
var cleanNodeName = nodeName[0].split(/[\+\*\^\-\ \#]+/);//Split nodeName all special characters
//If nodeName contains a uID, make the uID an attribute
if (nodeName[1])
{
var uID = nodeName[1];
strWrapper.val = "/"+cleanNodeName[0]+"[@uID='"+uID+"']"+strWrapper.val;
}
else
{
strWrapper.val = "/"+cleanNodeName[0]+strWrapper.val;
}
var aParent = aNode.parent;
if (aParent)
{
return putAncestorsInXPath(strWrapper, aParent);
}
else
{
return strWrapper;
}
}
nodeEnter = nodeEnter nodeEnter = nodeEnter
.on('contextmenu', d3.contextMenu(nodeMenu)); .on('contextmenu', d3.contextMenu(nodeMenu));
...@@ -22456,7 +22470,7 @@ ...@@ -22456,7 +22470,7 @@
} }
startXDSM(data,graphID); startXDSM(data,graphID);
   
////aigner: Unused funcktions --> Could be helpful at some point ////aigner: Unused functions --> Could be helpful at some point
////aigner: clone function, so that original object is not overwritten but deep copied ////aigner: clone function, so that original object is not overwritten but deep copied
// function clone(obj) { // function clone(obj) {
// if (null == obj || "object" != typeof obj) return obj; // if (null == obj || "object" != typeof obj) return obj;
...@@ -25861,7 +25875,7 @@ ...@@ -25861,7 +25875,7 @@
{ {
if (theLink.to == theNode.id) if (theLink.to == theNode.id)
{ {
array = array + "," + theLink.name; array = array + ", " + theLink.name;
} }
name_tmp = "Input tree view:" + theNode.id + "; Categorization: " + categoryDescr; name_tmp = "Input tree view:" + theNode.id + "; Categorization: " + categoryDescr;
} }
...@@ -25869,7 +25883,7 @@ ...@@ -25869,7 +25883,7 @@
{ {
if (theLink.from == theNode.id) if (theLink.from == theNode.id)
{ {
array = array + "," + theLink.name; array = array + ", " + theLink.name;
} }
name_tmp = "Output tree view:" + theNode.id + "; Categorization: " + categoryDescr; name_tmp = "Output tree view:" + theNode.id + "; Categorization: " + categoryDescr;
} }
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment