qmldebugcontrol/qml/MainView.js

   1 /**************************************************************************
   2 **
   3 ** This file is part of Qt Creator
   4 **
   5 ** Copyright (c) 2011 Nokia Corporation and/or its subsidiary(-ies).
   6 **
   7 ** Contact: Nokia Corporation (info@qt.nokia.com)
   8 **
   9 ** No Commercial Usage
  10 **
  11 ** This file contains pre-release code and may not be distributed.
  12 ** You may use this file in accordance with the terms and conditions
  13 ** contained in the Technology Preview License Agreement accompanying
  14 ** this package.
  15 **
  16 ** GNU Lesser General Public License Usage
  17 **
  18 ** Alternatively, this file may be used under the terms of the GNU Lesser
  19 ** General Public License version 2.1 as published by the Free Software
  20 ** Foundation and appearing in the file LICENSE.LGPL included in the
  21 ** packaging of this file.  Please review the following information to
  22 ** ensure the GNU Lesser General Public License version 2.1 requirements
  23 ** will be met: http://www.gnu.org/licenses/old-licenses/lgpl-2.1.html.
  24 **
  25 ** In addition, as a special exception, Nokia gives you certain additional
  26 ** rights.  These rights are described in the Nokia Qt LGPL Exception
  27 ** version 1.1, included in the file LGPL_EXCEPTION.txt in this package.
  28 **
  29 ** If you have questions regarding the use of this file, please contact
  30 ** Nokia at info@qt.nokia.com.
  31 **
  32 **************************************************************************/
  33
  34 .pragma library
  35
  36 var values = [ ];   //events
  37 var ranges = [ ];
  38 var frameFps = [ ];
  39 var xmargin = 0;
  40 var ymargin = 0;
  41 var drawFpsGraph = false;
  42 var nestingDepth = [];
  43
  44 var names = [ "Painting", "Compiling", "Creating", "Binding", "Handling Signal"]
  45 //### need better way to manipulate color from QML. In the meantime, these need to be kept in sync.
  46 var colors = [ "#99CCB3", "#99CCCC", "#99B3CC", "#9999CC", "#CC99B3", "#CC99CC", "#CCCC99", "#CCB399" ];
  47 var origColors = [ "#99CCB3", "#99CCCC", "#99B3CC", "#9999CC", "#CC99B3", "#CC99CC", "#CCCC99", "#CCB399" ];
  48 var xRayColors = [ "#6699CCB3", "#6699CCCC", "#6699B3CC", "#669999CC", "#66CC99B3", "#66CC99CC", "#66CCCC99", "#66CCB399" ];
  49
  50 function reset()
  51 {
  52     values = [];
  53     ranges = [];
  54     frameFps = [];
  55     xmargin = 0;
  56     ymargin = 0;
  57     nestingDepth = [];
  58 }
  59
  60 function calcFps()
  61 {
  62     if (drawFpsGraph) {
  63         if (values.length)
  64             frameFps = new Array(values.length - 1);
  65         for (var i = 0; i < values.length - 1; ++i) {
  66             var frameTime = (values[i + 1] - values[i]) / 1000000;
  67             frameFps[i] = 1000 / frameTime;
  68         }
  69     }
  70 }
  71
  72 //draw background of the graph
  73 function drawGraph(canvas, ctxt, region)
  74 {
  75     var grad = ctxt.createLinearGradient(0, 0, 0, canvas.canvasSize.height);
  76     grad.addColorStop(0,   '#fff');
  77     grad.addColorStop(1, '#ccc');
  78     ctxt.fillStyle = grad;
  79
  80     ctxt.fillRect(0, 0, canvas.canvasSize.width + xmargin, canvas.canvasSize.height - ymargin);
  81 }
  82
  83 //draw the actual data to be graphed
  84 function drawData(canvas, ctxt, region)
  85 {
  86     if (values.length == 0 && ranges.length == 0)
  87         return;
  88
  89     var width = canvas.canvasSize.width - xmargin;
  90     var height = canvas.height - ymargin;
  91
  92     var sumValue = ranges[ranges.length - 1].start + ranges[ranges.length - 1].duration - ranges[0].start;
  93     var spacing = width / sumValue;
  94
  95     ctxt.fillStyle = "rgba(0,0,0,1)";
  96     var highest = [0,0,0,0,0];
  97
  98     //### only draw those in range
  99     for (var ii = 0; ii < ranges.length; ++ii) {
 100
 101         var xx = (ranges[ii].start - ranges[0].start) * spacing + xmargin;
 102         if (xx > region.x + region.width)
 103             continue;
 104
 105         var size = ranges[ii].duration * spacing;
 106         if (xx + size < region.x)
 107             continue;
 108
 109         if (size < 0.5)
 110             size = 0.5;
 111
 112         xx = Math.round(xx);
 113         if (xx + size > highest[ranges[ii].type]) {
 114             ctxt.fillRect(xx, ranges[ii].type*10, size, 10);
 115             highest[ranges[ii].type] = xx+size;
 116         }
 117     }
 118
 119     if (drawFpsGraph) {
 120         //draw fps overlay
 121         var heightScale = height / 60;
 122         ctxt.beginPath();
 123         ctxt.moveTo(0,0);
 124         for (var i = 1; i < values.length; ++i) {
 125             var xx = (values[i] - ranges[0].start) * spacing + xmargin;
 126             ctxt.lineTo(xx, height - frameFps[i-1]*heightScale)
 127         }
 128         ctxt.lineTo(width, 0);
 129         ctxt.closePath();
 130         var grad = ctxt.createLinearGradient(0, 0, 0, canvas.canvasSize.height);
 131         grad.addColorStop(0, "rgba(255,128,128,.5)");
 132         grad.addColorStop(1, "rgba(255,0,0,.5)");
 133         ctxt.fillStyle = grad;
 134         ctxt.fill();
 135     }
 136 }
 137
 138 function plot(canvas, ctxt, region)
 139 {
 140     drawGraph(canvas, ctxt, region);
 141     drawData(canvas, ctxt, region);
 142 }
 143
 144 function xScale(canvas)
 145 {
 146     if (values.length === 0 && ranges.length === 0)
 147         return;
 148
 149     var width = canvas.canvasSize.width - xmargin;
 150
 151     var sumValue = ranges[ranges.length - 1].start + ranges[ranges.length - 1].duration - ranges[0].start;
 152     var spacing = sumValue / width;
 153     return spacing;
 154 }