From 02444b5b4e7c282259c884e37ccec0e12dca7aed Mon Sep 17 00:00:00 2001 From: baigner <benedikt.aigner@rwth-aachen.de> Date: Fri, 4 May 2018 08:27:28 +0200 Subject: [PATCH] Manual merge of master into dev_vistoms_try_Benedikt Former-commit-id: dc3651e753f0c54edee0d766230cfa6b2d422dd4 --- kadmos/vistoms/templates/VISTOMS.html | 72 ++++++++++++++++----------- 1 file changed, 43 insertions(+), 29 deletions(-) diff --git a/kadmos/vistoms/templates/VISTOMS.html b/kadmos/vistoms/templates/VISTOMS.html index 730d62f80..de4254ed7 100644 --- a/kadmos/vistoms/templates/VISTOMS.html +++ b/kadmos/vistoms/templates/VISTOMS.html @@ -50,6 +50,14 @@ } }); }; + + /** + * Returns a random integer between min (inclusive) and max (inclusive) + * Using Math.round() will give you a non-uniform distribution! + */ + function getRandomInt(min, max) { + return Math.floor(Math.random() * (max - min + 1)) + min; + } //aigner: General functions communicating with the user via bootbox after kadmos requests @@ -20066,14 +20074,15 @@ { var headLine = "Tree Layout for category:\" " + category + "\", subcategory:\" " + sub_category + "\""; var d3_body = d3.select("body"); - - var treeLayoutdiv = d3_body.append("div").attr("class","treeDiv panel-default") + var lobiID = String(getRandomInt(0,1000)) + var divClassName = "treeDiv" + lobiID; + var treeLayoutdiv = d3_body.append("div").attr("class",divClassName+ " panel-default") .style("left","200px") .style("top","200px") .style("position", "absolute") treeLayoutdiv.append("div").attr("class","panel-heading") .append("div").attr("class","panel_title").append("h4").text(headLine) - $('.treeDiv').lobiPanel({ + $('.' + divClassName).lobiPanel({ reload: false, editTitle: false, unpin: false, @@ -20082,10 +20091,10 @@ minHeight: 200, maxHeight: 100000, }); - $('.treeDiv').lobiPanel('unpin'); + $('.'+divClassName).lobiPanel('unpin'); var treeLayoutSVG = treeLayoutdiv.append("svg").attr("class","treeLayoutSVG") var treeLayout = treeLayoutSVG.append("g").attr("class","treeLayout"); - maketreeLayout(array, treeLayout, treeLayoutSVG, treeLayoutdiv, headLine, varCategories[0].description); + maketreeLayout(array, treeLayout, treeLayoutSVG, treeLayoutdiv, divClassName, headLine, varCategories[0].description); show_bootBox_listMessage(functions,nodeMenu); } if (result.includes("List")) @@ -21282,14 +21291,15 @@ { var headLine = "Full data model tree view; Categorization: " + categoryDescr; var d3_body = d3.select("body"); - - var treeLayoutdiv = d3_body.append("div").attr("class","treeDiv panel-default") + var lobiID = String(getRandomInt(0,1000)) + var divClassName = 'treeDiv' + lobiID; + var treeLayoutdiv = d3_body.append("div").attr("class",divClassName+" panel-default") .style("left",(d3.event.pageX) + "px") .style("top",(d3.event.pageY - 28) + "px") .style("position", "absolute") treeLayoutdiv.append("div").attr("class","panel-heading") .append("div").attr("class","panel_title").append("h4").text(headLine) - $('.treeDiv').lobiPanel({ + $('.' + divClassName).lobiPanel({ reload: false, editTitle: false, unpin: false, @@ -21298,11 +21308,10 @@ minHeight: 200, maxHeight: 100000, }); - $('.treeDiv').lobiPanel('unpin'); - + $('.'+divClassName).lobiPanel('unpin'); var treeLayoutSVG = treeLayoutdiv.append("svg").attr("class","treeLayoutSVG") var treeLayout = treeLayoutSVG.append("g").attr("class","treeLayout"); - maketreeLayout(emptyArray, treeLayout, treeLayoutSVG, treeLayoutdiv, headLine, aCategory); + maketreeLayout(emptyArray, treeLayout, treeLayoutSVG, treeLayoutdiv, divClassName, headLine, aCategory); } var childrenItems = []; @@ -21411,7 +21420,8 @@ var headLine = name; var d3_body = d3.select("body"); - var divClassName = "treeDiv"; + var lobiID = String(getRandomInt(0,1000)) + var divClassName = "treeDiv" + lobiID; var treeLayoutdiv = d3_body.append("div").attr("class",divClassName + " panel-default") .style("left",(d3.event.pageX) + "px") .style("top",(d3.event.pageY - 28) + "px") @@ -21430,7 +21440,7 @@ $('.'+divClassName).lobiPanel('unpin'); var treeLayoutSVG = treeLayoutdiv.append("svg").attr("class","treeLayoutSVG") var treeLayout = treeLayoutSVG.append("g").attr("class","treeLayout"); - maketreeLayout(array, treeLayout, treeLayoutSVG, treeLayoutdiv, headLine, aCategory); + maketreeLayout(array, treeLayout, treeLayoutSVG, treeLayoutdiv, divClassName, headLine, aCategory); } //############################################################ @@ -21820,8 +21830,8 @@ { var headLine = "Tree view: " + data.from + " → " + data.to + "; Categorization: " + categoryDescr; var d3_body = d3.select("body"); - - var divClassName = "treeDiv"; + var lobiID = String(getRandomInt(0,1000)) + var divClassName = "treeDiv" + lobiID; var treeLayoutdiv = d3_body.append("div").attr("class",divClassName + " panel-default") .style("left",(d3.event.pageX) + "px") .style("top",(d3.event.pageY - 28) + "px") @@ -21840,7 +21850,7 @@ $('.'+divClassName).lobiPanel('unpin'); var treeLayoutSVG = treeLayoutdiv.append("svg").attr("class","treeLayoutSVG") var treeLayout = treeLayoutSVG.append("g").attr("class","treeLayout"); - maketreeLayout(data.name, treeLayout, treeLayoutSVG, treeLayoutdiv, headLine, aVarCategory); + maketreeLayout(data.name, treeLayout, treeLayoutSVG, treeLayoutdiv, divClassName, headLine, aVarCategory); } function showEdgeTable(anEdge) @@ -22040,7 +22050,7 @@ } - function maketreeLayout(pipeData, layout, svg, div, aName, aVarCategory) + function maketreeLayout(pipeData, layout, svg, div, aLobiID, aName, aVarCategory) { var treeData = (JSON.parse(JSON.stringify(currentGraph.variableSchemes[aVarCategory]))); //aigner: Build the tree layout @@ -22283,8 +22293,8 @@ newWidth=Math.max(newWidth,getTextWidth(aName,"Arial 12pt")); //aigner: Adjust height and width of the frame - $('.treeDiv').lobiPanel('setWidth', newWidth + margin.top + margin.bottom +400+maxLabelLength*25+offset_tmp); - $('.treeDiv').lobiPanel('setHeight', newHeight + margin.top + 2*margin.bottom+offset_tmp); + $('.' + aLobiID).lobiPanel('setWidth', newWidth + margin.top + margin.bottom +400+maxLabelLength*25+offset_tmp); + $('.' + aLobiID).lobiPanel('setHeight', newHeight + margin.top + 2*margin.bottom+offset_tmp); div = div.attr("height", newHeight + margin.top + margin.bottom+offset_tmp) div = div.attr("width", newWidth + margin.top + margin.bottom +400+maxLabelLength*25+offset_tmp) .on("mousedown", function(d) { @@ -23619,13 +23629,15 @@ //aigner: Here the tree layout is created var d3_body = d3.select("body") - var treeLayoutdiv = d3_body.append("div").attr("class","treeDiv panel-default") + var lobiID = String(getRandomInt(0,1000)) + var divClassName = "treeDiv"+lobiID + var treeLayoutdiv = d3_body.append("div").attr("class",divClassName+" panel-default") .style("left","200px") .style("top","200px") .style("position", "absolute") treeLayoutdiv.append("div").attr("class","panel-heading") .append("div").attr("class","panel_title").append("h4").text(theName) - $('.treeDiv').lobiPanel({ + $('.'+divClassName).lobiPanel({ reload: false, editTitle: false, unpin: false, @@ -23634,7 +23646,7 @@ minHeight: 200, maxHeight: 100000, }); - $('.treeDiv').lobiPanel('unpin'); + $('.'+divClassName).lobiPanel('unpin'); var treeLayoutSVG = treeLayoutdiv.append("svg").attr("class","treeLayoutSVG") var treeGroup = treeLayoutSVG.append("g").attr("class","treeGroup").style("position","absolute") .attr("transform", "translate(50,0)"); @@ -23792,8 +23804,8 @@ newWidth=Math.max(newWidth,getTextWidth(theName,"Arial 12pt")); //aigner: Adjust height and width of the frame - $('.treeDiv').lobiPanel('setWidth', newWidth + margin.top + margin.bottom +400+maxLabelLength*25+offset_tmp); - $('.treeDiv').lobiPanel('setHeight', newHeight + margin.top + 2*margin.bottom+offset_tmp); + $('.'+divClassName).lobiPanel('setWidth', newWidth + margin.top + margin.bottom +400+maxLabelLength*25+offset_tmp); + $('.'+divClassName).lobiPanel('setHeight', newHeight + margin.top + 2*margin.bottom+offset_tmp); treeLayoutSVG = treeLayoutSVG.attr("height", newHeight + margin.top + margin.bottom+offset_tmp) treeLayoutSVG = treeLayoutSVG.attr("width", newWidth + margin.top + margin.bottom +300+maxLabelLength*25+offset_tmp) frame = frame.attr("height", newHeight + margin.top + margin.bottom) @@ -26177,13 +26189,15 @@ //aigner: Here the tree layout is created var d3_body = d3.select("body") - var treeLayoutdiv = d3_body.append("div").attr("class","treeDiv panel-default") + var lobiID = String(getRandomInt(0,1000)) + var divClassName = "treeDiv"+lobiID + var treeLayoutdiv = d3_body.append("div").attr("class",divClassName+" panel-default") .style("left","200px") .style("top","200px") .style("position", "absolute") treeLayoutdiv.append("div").attr("class","panel-heading") .append("div").attr("class","panel_title").append("h4").text(theName) - $('.treeDiv').lobiPanel({ + $('.'+divClassName).lobiPanel({ reload: false, editTitle: false, unpin: false, @@ -26192,7 +26206,7 @@ minHeight: 200, maxHeight: 100000, }); - $('.treeDiv').lobiPanel('unpin'); + $('.'+divClassName).lobiPanel('unpin'); var treeLayoutSVG = treeLayoutdiv.append("svg").attr("class","treeLayoutSVG") var treeGroup = treeLayoutSVG.append("g").attr("class","treeGroup").style("position","absolute") @@ -26351,8 +26365,8 @@ newWidth=Math.max(newWidth,getTextWidth(theName,"Arial 12pt")); //aigner: Adjust height and width of the frame - $('.treeDiv').lobiPanel('setWidth', newWidth + margin.top + margin.bottom +400+maxLabelLength*25+offset_tmp); - $('.treeDiv').lobiPanel('setHeight', newHeight + margin.top + 2*margin.bottom+offset_tmp); + $('.'+divClassName).lobiPanel('setWidth', newWidth + margin.top + margin.bottom +400+maxLabelLength*25+offset_tmp); + $('.'+divClassName).lobiPanel('setHeight', newHeight + margin.top + 2*margin.bottom+offset_tmp); treeLayoutSVG = treeLayoutSVG.attr("height", newHeight + margin.top + margin.bottom+offset_tmp) treeLayoutSVG = treeLayoutSVG.attr("width", newWidth + margin.top + margin.bottom +300+maxLabelLength*25+offset_tmp) frame = frame.attr("height", newHeight + margin.top + margin.bottom) -- GitLab