235 lines
7.4 KiB
JavaScript
235 lines
7.4 KiB
JavaScript
|
||
var showAnalysis = function() {
|
||
//console.log("showAnalysis test")
|
||
var isAnalysis = document.getElementById("analysis").style.display;
|
||
var isResize = document.getElementById("resize").style.display;
|
||
//console.log(isAnalysis);
|
||
var top = document.getElementById("contractCode");
|
||
var down = document.getElementById("analysis");
|
||
var box = document.getElementById("box");
|
||
|
||
if (isAnalysis == "none") {
|
||
document.getElementById("analysis").style.display = "block";
|
||
document.getElementById("resize").style.display = "block";
|
||
var moveLen=300;
|
||
top.style.height = moveLen + "px";
|
||
$("#contractCode .CodeMirror").css("height",moveLen + "px");
|
||
down.style.height = (box.clientHeight - moveLen - 10) + "px";
|
||
staticAnalysis();
|
||
} else {
|
||
document.getElementById("analysis").style.display = "none";
|
||
document.getElementById("resize").style.display = "none";
|
||
top.style.height="100%";
|
||
$("#contractCode .CodeMirror").css("height","100%");
|
||
}
|
||
//document.getElementById("analysis").style.display = "";
|
||
};
|
||
|
||
var staticAnalysis = function() {
|
||
var req = {};
|
||
req.action = "getControlFlowByFileName";
|
||
req.isPrivate = global.currentFile.isPrivate;
|
||
var path = global.currentFile.path;
|
||
if (path.startsWith("/"))
|
||
path = path.substr(1);
|
||
path = path.replace(/\/.*$/g,"");
|
||
req.projectName = path;
|
||
array = $("#form").serializeArray();
|
||
req.formData=JSON.stringify(array);
|
||
global.wssocket.send(JSON.stringify(req));
|
||
};
|
||
|
||
window.onload = function(){
|
||
var resize = document.getElementById("resize");
|
||
var top = document.getElementById("contractCode");
|
||
var down = document.getElementById("analysis");
|
||
var box = document.getElementById("box");
|
||
resize.onmousedown = function(e){
|
||
var startY = e.clientY;
|
||
resize.top = resize.offsetTop;
|
||
|
||
document.onmousemove = function(e){
|
||
var endY = e.clientY;
|
||
var moveLen = resize.top + (endY - startY);
|
||
var maxT = box.clientHeight - resize.offsetHeight;
|
||
if(moveLen<150) moveLen = 150;
|
||
if(moveLen>maxT-150) moveLen = maxT-150;
|
||
resize.style.top = moveLen;
|
||
top.style.height = moveLen + "px";
|
||
$("#contractCode .CodeMirror").css("height",top.style.height);
|
||
down.style.height = (box.clientHeight - moveLen - 5) + "px";
|
||
}
|
||
document.onmouseup = function(evt){
|
||
document.onmousemove = null;
|
||
document.onmouseup = null;
|
||
resize.releaseCapture && resize.releaseCapture();
|
||
}
|
||
resize.setCapture && resize.setCapture();
|
||
return false;
|
||
}
|
||
}
|
||
|
||
|
||
var onGetControlFlow = function(obj) {
|
||
var data = {};
|
||
data.name = data.path = "/tmp/result_" + (new Date().getTime() % 1000)
|
||
+ ".txt";
|
||
obj = JSON.parse(obj.result);
|
||
global.analysisResult = obj;
|
||
$("#analysisFunction").html("<option value=''>选择方法</option>");
|
||
for (var key in obj){
|
||
$("#analysisFunction").append("<option value='"+key+"'>"+key+"</option>");
|
||
};
|
||
|
||
|
||
|
||
data.val = JSON.stringify(obj, null, 4);
|
||
mainVue.openedFiles.push(data);
|
||
setTimeout(function() {
|
||
clickTab(data.path);
|
||
}, 100);
|
||
}
|
||
var showAnalysisResult = function(){
|
||
var functionName = $("#analysisFunction")[0].value;
|
||
if (global.analysisResult[functionName]!=undefined){
|
||
drawMethod(global.analysisResult[functionName]);
|
||
}
|
||
};
|
||
|
||
var drawMethod = function(method) {
|
||
var states = {};
|
||
for (var i = 0; i < method.blocks.length; i++) {
|
||
var block = method.blocks[i];
|
||
var desp = {};
|
||
desp.description = "字节码指令："+"<br/>"+ stmt2Str(block.stmts);
|
||
desp.description += "<br/><br/>" + "后续分析结果：" +"<br/>" + block.result;
|
||
desp.description += "<br/><br/>" + "源码："+"<br/>"+ block.original;
|
||
desp.description += "<br/><br/>" + "数据依赖："+"<br/>"+ block.blockDep;
|
||
if (block.type != "Continuous")
|
||
desp.fill = "#f77";
|
||
states[block.name] = desp;
|
||
}
|
||
drawCFGraph(states, method.edges);
|
||
var retDesp = "数据值传递依赖：";
|
||
//retDesp += method.ret;
|
||
var tmp1 = method.ret;
|
||
retDesp += tmp1.split(":")[tmp1.split(',').length];
|
||
retDesp += "\n";
|
||
retDesp += "数据控制依赖：";
|
||
var tmp2= method.blocks[method.blocks.length-1].blockDep;
|
||
//retDesp += tmp.split(":")[tmp.split(',').length];
|
||
retDesp += tmp2;
|
||
retDesp += "\n";
|
||
retDesp += method.finalRet;
|
||
document.getElementById("ret").value = retDesp;
|
||
};
|
||
|
||
var stmt2Str = function(l) {
|
||
var str = "";
|
||
for (var i = 0; i < l.length; i++)
|
||
str += "<span style='text-overflow:ellipsis'>"
|
||
+ l[i].replace(/\//g, ".") + "</span>" + "<br/>";
|
||
return str;
|
||
}
|
||
|
||
var drawCFGraph = function(states, edges) {
|
||
var g = new dagreD3.graphlib.Graph().setGraph({});
|
||
// Add states to the graph, set labels, and style
|
||
Object.keys(states).forEach(function(state) {
|
||
var value = states[state];
|
||
value.label = state;
|
||
value.rx = value.ry = 5;
|
||
value.style = "fill:white;stroke:"+primaryColor;
|
||
g.setNode(state, value);
|
||
});
|
||
for (var i = 0; i < edges.length; i++){
|
||
edges[i].label.style= "fill:#fff;stroke:"+primaryColor+";stroke-width:2px";
|
||
if (edges[i].label.label=='e')
|
||
edges[i].label.label = "";
|
||
g.setEdge(edges[i].from, edges[i].to,edges[i].label);
|
||
}
|
||
// Set up the edges
|
||
|
||
// Create the renderer
|
||
var render = new dagreD3.render();
|
||
$("svg").html("");
|
||
// Set up an SVG group so that we can translate the final graph.
|
||
var svg = d3.select("svg"), inner = svg.append("g");
|
||
|
||
// Set up zoom support
|
||
var zoom = d3.zoom().on("zoom", function() {
|
||
inner.attr("transform", d3.event.transform);
|
||
});
|
||
svg.call(zoom);
|
||
|
||
// Simple function to style the tooltip for the given node.
|
||
var styleTooltip = function(name, description) {
|
||
return "<p class='name'>" + name + "</p><p class='description'>"
|
||
+ description + "</p>";
|
||
};
|
||
|
||
// Run the renderer. This is what draws the final graph.
|
||
render(inner, g);
|
||
|
||
inner.selectAll("g.node").attr("title", function(v) {
|
||
return styleTooltip(v, g.node(v).description)
|
||
}).each(function(v) {
|
||
$(this).tipsy({
|
||
gravity : "w",
|
||
opacity : 1,
|
||
html : true
|
||
});
|
||
});
|
||
|
||
// Center the graph
|
||
var initialScale = 0.75;
|
||
var width =$("#svgCanvas").css("width").replace("px","")/1;
|
||
svg.call(zoom.transform, d3.zoomIdentity.translate(
|
||
(width - g.graph().width * initialScale) / 2, 20)
|
||
.scale(initialScale));
|
||
svg.attr('height', g.graph().height * initialScale + 40);
|
||
}
|
||
|
||
|
||
var downloadAnalysis = function() {
|
||
var pdf = new jsPDF('p', 'pt', 'a4');
|
||
//page1
|
||
/*
|
||
pdf.addFont('NotoSansCJKtc-Regular.ttf', 'NotoSansCJKtc', 'normal');
|
||
pdf.setFont('NotoSansCJKtc');
|
||
*/
|
||
pdf.text('Analysis Report', 10, 20);
|
||
var res = document.getElementById("ret").value;
|
||
pdf.text(res, 10, 20);
|
||
//page2
|
||
pdf.addPage();
|
||
//method1：add text
|
||
//get svg
|
||
var svg = $("#svgCanvas")[0].outerHTML;
|
||
if (svg)
|
||
svg = svg.replace(/\r?\n|\r/g, '').trim();
|
||
//change svg to canvas
|
||
var canvas = document.createElement('canvas');
|
||
ctx = canvas.getContext('2d');
|
||
var v = canvg.Canvg.fromString(ctx, svg);
|
||
|
||
//create image
|
||
var imgData = canvas.toDataURL('image/png');
|
||
pdf.addImage(imgData, 'PNG', 0, 0, 595.28, 841.89);
|
||
|
||
/*
|
||
//method2：add text to image
|
||
var canvas = document.createElement('canvas');
|
||
const ctx = canvas.getContext('2d');
|
||
var svg = document.getElementById('svg-container').innerHTML;
|
||
var v = canvg.Canvg.fromString(ctx, svg);
|
||
v.start();
|
||
ctx.font="20px Georgia";
|
||
ctx.fillText(res, 10, 20);
|
||
var imgData = canvas.toDataURL('image/png');
|
||
pdf.addImage(imgData, 'PNG', 0, 0, 595.28, 841.89);
|
||
*/
|
||
pdf.save('report.pdf');
|
||
}
|
||
|