Add tooltips to metrics showing the exact value of the data point

Dependencies

• [2] UMEKGOSY Update flot to 0.8.3
• [3] PPAE3Z3D plain-reload: Constrain tail output to 50 lines.
• [4] OMSOKS2A Move chart code to common.js
• [*] IK53RV4V
• [*] ZB3JV52W Add a "My jobsets" tab to the dashboard
• [*] J5UVLXOK * Start of a basic Catalyst web interface.
• [*] U2X3Y53G make sure status images always display for a list of builds
• [*] 2P7VNAAC Move common Javascript code into a separate file

Change contents

• edit in src/root/common.tt at line 564
  [2.347]

  [7.3447]
  + <div id="flot-tooltip" class="flot-tooltip"></div>
• edit in src/root/static/css/hydra.css at line 131
  [3.160]

  [9.1098]
  + }

  +

  + div.flot-tooltip {

  + display: none;

  + position: absolute;

  + border: 1px solid #fdd;

  + padding: 2px;

  + background-color: #fee;

  + opacity: 0.80;

  + z-index: 100;
• edit in src/root/static/js/common.js at line 232
  [4.2422]

  [4.2422]
  + $("#" + id + "-chart").bind("plothover", function (event, pos, item) {

  + if (item) {

  + var i = data[item.dataIndex];

  + var date = new Date(i.timestamp * 1000);

  + var s =

  + "Build <em>" + i.id + "</em><br/>"

  + + "on " + date.getFullYear() + "-" + (date.getMonth() + 1) + "-" + date.getDate() + ""

  + + ":<br/><strong>" + i.value

  + + (i.unit != null ? " " + i.unit : "") + "</strong>";

  + $("#flot-tooltip")

  + .html(s)

  + .css({top: item.pageY + 10, left: item.pageX + 10})

  + .show();

  + } else

  + $("#flot-tooltip").hide();

  + });

  +