_display_cfg: function()

in lnt/server/ui/static/lnt_profile.js [489:624]


    _display_cfg: function(instructionSet) {
        this.instructionSet = instructionSet; 
        this.element.empty();
        var profiledDisassembly = this.data;
        var instructionParser;
        if (this.instructionSet == 'aarch64') 
            instructionParser = new InstructionSetParser(
                InstructionSetParser.prototype.AArch64JumpTargetRegexps);
        else if (this.instructionSet == 'aarch32t32')
            instructionParser = new InstructionSetParser(
                InstructionSetParser.prototype.AArch32T32JumpTargetRegexps);
        else {
            // Do not try to continue if we don't have support for
            // the requested instruction set.
            $(this.element).html(
                '<center><i>There is no support (yet?) for reconstructing ' +
                'the CFG for the<br>' +
                this.instructionSet+' instruction set. :(.</i></center>');
            return;
        }
        var cfg = new CFG(profiledDisassembly, instructionParser, this.counter_name);
        var d3cfg = new D3CFG(cfg);
        d3cfg.compute_layout();
        var d3data = [d3cfg];
        var d3cfg_dom = d3.select(this.element.get(0))
            .selectAll("svg")
            .data(d3data)
            .enter().append("svg");
        var profile = this;

        // add circle and arrow marker definitions
        var svg_defs = d3cfg_dom.append("defs");
        svg_defs.append("marker")
            .attr("id", "markerCircle")
            .attr("markerWidth", "7").attr("markerHeight", "7")
            .attr("refX", "3").attr("refY", "3")
            .append("circle")
            .attr("cx","3").attr("cy", "3").attr("r","3")
            .attr("style","stroke: none; fill: #000000;");
        svg_defs.append("marker")
            .attr("id", "markerArrow")
            .attr("markerWidth", "11").attr("markerHeight", "7")
            .attr("refX", "10").attr("refY", "3")
            .attr("orient", "auto")
            .append("path")
            .attr("d","M0,0 L0,6 L10,3 L0,0")
            .attr("style","fill: #000000;");
        d3cfg_dom
            .attr('width', d3data[0].width)
            .attr('height', d3data[0].height);
        var d3bbs_dom = d3cfg_dom.selectAll("g .bbgroup")
            .data(function (d,i) { return d.d3bbs; })
            .enter().append("g").attr('class', 'bbgroup');
        d3bbs_dom
            .attr("transform", function (d) {
              return "translate(" + d.x + "," + d.y + ")"});
        d3bbs_dom.append("rect")
            .attr('class', 'basicblock')
            .attr("x", function(d) { return d3cfg.bb_weight_width; })
            .attr("y", function (d) { return 0; })
            .attr("height", function (d) { return d.height; })
            .attr("width", function (d) {
                return d.width-d3cfg.bb_weight_width; });
        // draw weight of basic block in a rectangle on the left.
        d3bbs_dom.append("rect")
            .attr('class', 'basicblocksidebar')
            .attr("x", function(d) { return 0; })
            .attr("y", function (d) { return 0; })
            .attr("height", function (d) { return d.height; })
            .attr("width", function (d) { return d3cfg.bb_weight_width; })
            .attr("style", function (d) {
                var lData = profile._label(d.bb.weight, true /*littleSpace*/);
                return "fill: "+lData.background_color;
            });
        d3bbs_dom.append("g")
            .attr('transform', function (d) {
                return "translate("
                    +(d.x+d3cfg.bb_weight_width-3)
                    +","
                    +(d.height/2)
                    +")"; })
            .append("text")
            .attr('class', 'basicblockweight')
            .attr("transform", "rotate(-90)")
            .attr("text-anchor", "middle")
            .text(function (d,i) {
                var lData = profile._label(d.bb.weight, true /*littleSpace*/);
                return lData.text; //d.bb.weight.toFixed(0)+"%"; 
            });
        var d3inst_dom = d3bbs_dom.selectAll("text:root")
            .data(function (d,i) { return d.d3instructions; })
            .enter();
        // draw disassembly text
        d3inst_dom.append("text")
            .attr('class', 'instruction instructiontext')
            .attr("x", function (d,i) { return d.x+d3cfg.x_offset_instruction_text; })
            .attr("y", function (d,i) { return d.y+10; })
            .text(function (d,i) { return d.instruction.text; });
        // draw address of instruction
        d3inst_dom.append("text")
            .attr('class', 'instruction instructionaddress')
            .attr("x", function (d,i) { return d.x+d3cfg.bb_weight_width+50; })
            .attr("y", function (d,i) { return d.y+10; })
            .text(function (d,i) { return d.instruction.address.toString(16); });
        // draw profile weight of instruction
        d3inst_dom.append("text")
            .attr('class', 'instruction instructionweight')
            .attr("x", function (d,i) { return d.x+d3cfg.bb_weight_width+0; })
            .attr("y", function (d,i) { return d.y+10; })
            .text(function (d,i) {
                if (d.instruction.weight == 0)
                    return "";
                else
                    return d.instruction.weight.toFixed(2)+"%";
                });
        var d3edges_dom = d3cfg_dom.selectAll("g .edgegroup")
            .data(function (d,i) { return d.d3edges; })
            .enter().append("g").attr('class', 'edgegroup');
        d3edges_dom.append("polyline")
            .attr("points", function (d,i) {
                if (d.fallthru) {
                    return d.start_x+","+d.start_y+" "+
                           d.end_x+","+d.end_y;
                }
                var lane_x = d.d3cfg.vlane_offset + d.d3cfg.vlane_gap*d.vlane;
                return d.start_x+","+d.start_y+" "+
                       lane_x+","+d.start_y+" "+
                       lane_x+","+d.end_y+" "+
                       d.end_x+","+d.end_y; })
            .attr('class', function (d) {
                return d.downward?'edge':'backedge';
            })
            .attr('style',
                  'marker-start: url(#markerCircle); '+
                  'marker-end: url(#markerArrow);');
    },