utils/test/dashboard/js/opnfv_dashboard_tests.js

   1 /*#############################################################################\r
   2 # All rights reserved. This program and the accompanying materials\r
   3 # are made available under the terms of the Apache License, Version 2.0\r
   4 # which accompanies this distribution, and is available at\r
   5 # http://www.apache.org/licenses/LICENSE-2.0\r
   6 ##############################################################################\r
   7 */\r
   8 \r
   9 // Function to format date according to JS\r
  10 function format_date(inputDate){\r
  11     var input = inputDate.slice(0,-7);\r
  12     input=input.replace(' ','T');\r
  13     input+='Z';\r
  14     return new Date(Date.parse(input));\r
  15 }\r
  16 \r
  17 // Draw a single graph for a specific test for a specific installer\r
  18 function draw_graph_per_scenario_per_installer (filename, installer, pod, scenario, test_unit){\r
  19     $.getJSON(filename, function(data) {\r
  20     var serie = [];\r
  21     index_test = 0;\r
  22     // find index mapping to the test_unit\r
  23     for (var i=0; i<data.dashboard.length; i++)\r
  24         if (data.dashboard[i].name==test_unit){\r
  25            index_test=i;\r
  26            break;\r
  27         }\r
  28 \r
  29     // build the data according to dygraph\r
  30     for (i=0; i<data.dashboard[index_test].data_set.length; i++) {\r
  31         var d = [];\r
  32         result = data.dashboard[index_test].data_set[i];\r
  33         d.push(format_date(result.x));\r
  34 \r
  35         // push y data if available\r
  36         var keys = Object.keys(result);\r
  37         for (var y in opnfv_dashboard_ys)\r
  38            if ($.inArray(opnfv_dashboard_ys[y], keys)!=-1) d.push(result[opnfv_dashboard_ys[y]]);\r
  39                serie.push(d);\r
  40     };\r
  41 \r
  42     // sort by date/time\r
  43     serie.sort(function(a,b){\r
  44         return new Date(a[0]).getTime()-new Date(b[0]).getTime()\r
  45     });\r
  46 \r
  47     // Label management\r
  48     var yLabel = '';\r
  49     if (test_unit.includes('nb'))\r
  50         yLabel = 'number';\r
  51     else if (test_unit.includes('duration'))\r
  52         yLabel = 'seconds';\r
  53     var labels = [];\r
  54     labels.push('time');\r
  55     var keys = Object.keys(data.dashboard[index_test].info);\r
  56     for (var y in opnfv_dashboard_y_labels)\r
  57         if ($.inArray(opnfv_dashboard_y_labels[y], keys)!=-1) labels.push(data.dashboard[index_test].info[opnfv_dashboard_y_labels[y]]);\r
  58 \r
  59     // Draw the graph\r
  60     g = new Dygraph(\r
  61         document.getElementById(scenario),\r
  62         serie,\r
  63         {\r
  64             colors: [opnfv_dashboard_graph_color_ok, opnfv_dashboard_graph_color_nok, opnfv_dashboard_graph_color_other],\r
  65             fillGraph: true,\r
  66             legend: opnfv_dashboard_graph_legend,\r
  67             title: scenario,\r
  68             titleHeight: opnfv_dashboard_graph_title_height,\r
  69             ylabel: yLabel,\r
  70             labelsDivStyles: {\r
  71                 'text-align': opnfv_dashboard_graph_text_align,\r
  72                 'background-color': opnfv_dashboard_graph_background_color\r
  73             },\r
  74             axisLabelColor: opnfv_dashboard_graph_axis_label_color,\r
  75             labels: labels,\r
  76             highlightSeriesOpts: {strokeWidth: opnfv_dashboard_graph_stroke_width},\r
  77             stepPlot: true\r
  78         }\r
  79     );\r
  80 });\r
  81 }\r
  82 \r
  83 // function to generate all the graphs for all installers\r
  84 function draw_graphs_all_scenarios_per_installer () {\r
  85     installer = opnfv_dashboard_installer;\r
  86     project = opnfv_dashboard_project;\r
  87     test = opnfv_dashboard_test;\r
  88     test_unit = opnfv_dashboard_test_unit;\r
  89     for (i=0; i<opnfv_dashboard_installers_scenarios[installer].length; i++){\r
  90         var filename = './' + opnfv_dashboard_file_directory + '/' + installer + '/' + project + '/' + opnfv_dashboard_file_prefix + project+'_'+test+'_'+opnfv_dashboard_installers_scenarios[installer][i];\r
  91         if (opnfv_dashboard_pod!='all')\r
  92             filename += '_' + opnfv_dashboard_pod;\r
  93         filename += opnfv_dashboard_file_suffix;\r
  94         console.log(filename);\r
  95         draw_graph_per_scenario_per_installer(filename, installer, opnfv_dashboard_pod, opnfv_dashboard_installers_scenarios[installer][i], test_unit);\r
  96     }\r
  97 }\r
  98 \r
  99 function on_testcase_draw_graph(test, test_unit){\r
 100     opnfv_dashboard_test = test;\r
 101     opnfv_dashboard_test_unit = test_unit;\r
 102     show_divs(opnfv_dashboard_installer);\r
 103     draw_graphs_all_scenarios_per_installer();\r
 104     $("#testcase_selected").html(test_unit);\r
 105 }\r
 106 \r
 107 function on_installer_draw_graph(installer){\r
 108    opnfv_dashboard_installer = installer;\r
 109    show_installers(installer);\r
 110    opnfv_dashboard_pod = 'all';  // force the new pod to 'all' because there is # pods per installer\r
 111    show_installers_pods(opnfv_dashboard_pod);\r
 112    show_divs(installer);\r
 113    draw_graphs_all_scenarios_per_installer ();\r
 114 }\r
 115 \r
 116 function on_pod_draw_graph(pod){\r
 117    opnfv_dashboard_pod = pod;\r
 118    show_installers_pods(pod);\r
 119    show_divs(opnfv_dashboard_installer);\r
 120    draw_graphs_all_scenarios_per_installer ();\r
 121 }\r
 122 \r
 123 function on_ready_draw_graph(){\r
 124    opnfv_dashboard_test = 'vPing';\r
 125    opnfv_dashboard_test_unit = 'vPing duration';\r
 126    opnfv_dashboard_installer = opnfv_dashboard_installers[Math.round((Math.random(opnfv_dashboard_installers.length-1)))];\r
 127    show_installers_pods(opnfv_dashboard_installers_pods[opnfv_dashboard_installer][0]);\r
 128    show_installers(opnfv_dashboard_installer);\r
 129    show_divs(opnfv_dashboard_installer);\r
 130    $("#testcase_selected").html(opnfv_dashboard_test_unit);\r
 131    draw_graphs_all_scenarios_per_installer ();\r
 132 }\r
 133 \r
 134 // generate test case selection\r
 135 function show_testcases(){\r
 136     var html_testcases = '<button class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown">Select a test case';\r
 137     html_testcases += '<span class="caret"></span></button>';\r
 138     html_testcases += '<ul class="dropdown-menu">';\r
 139 \r
 140     var family_testcases = Object.keys(opnfv_dashboard_testcases)\r
 141     for (var i in family_testcases){\r
 142         html_testcases += '<li class="dropdown-header">' + family_testcases[i] + '</li>';\r
 143         var testcase = family_testcases[i];\r
 144         family_tests = Object.keys(opnfv_dashboard_testcases[testcase]);\r
 145         for (var j in family_tests){\r
 146             var test = family_tests[j];\r
 147             family_tests_units = Object.keys(opnfv_dashboard_testcases[testcase][test]);\r
 148             for (var k in family_tests_units){\r
 149                 test_unit = opnfv_dashboard_testcases[testcase][test][k];\r
 150                 html_testcases += '<li><a href="#"  onClick="on_testcase_draw_graph(\''+ test +'\',\''+test_unit +'\')">' + opnfv_dashboard_testcases[testcase][test][k] + '</a></li>';\r
 151             }\r
 152         }\r
 153     }\r
 154     html_testcases+='</ul>';\r
 155     $("#testcase").html(html_testcases);\r
 156 }\r
 157 \r
 158 // generate installers buttons\r
 159 function show_installers(active_installer)\r
 160 {\r
 161     var html_installers = '';\r
 162     html_installers += '<ul class="nav nav-pills">';\r
 163     for (var i in opnfv_dashboard_installers)\r
 164         if (opnfv_dashboard_installers[i]==active_installer)\r
 165             html_installers += '<li class="active"><a href="#" onClick="on_installer_draw_graph(\''+opnfv_dashboard_installers[i]+'\')">'+opnfv_dashboard_installers[i]+'</a></li>';         \r
 166         else\r
 167             html_installers += '<li><a href="#" onClick="on_installer_draw_graph(\''+opnfv_dashboard_installers[i]+'\')">'+opnfv_dashboard_installers[i]+'</a></li>';\r
 168     html_installers += '</ul>';\r
 169     $("#installers").html(html_installers);\r
 170 }\r
 171 \r
 172 // generate pods buttons\r
 173 function show_installers_pods(active_pod)\r
 174 {\r
 175     var html_pods = '';\r
 176     html_pods += '<ul class="nav nav-pills">';\r
 177     for (var i in opnfv_dashboard_installers_pods[opnfv_dashboard_installer])\r
 178         if (opnfv_dashboard_installers_pods[opnfv_dashboard_installer][i]==active_pod)\r
 179             html_pods += '<li class="active"><a href="#" onClick="on_pod_draw_graph(\''+opnfv_dashboard_installers_pods[opnfv_dashboard_installer][i]+'\')">'+opnfv_dashboard_installers_pods_print[opnfv_dashboard_installer][i]+'</a></li>';\r
 180         else\r
 181             html_pods += '<li><a href="#" onClick="on_pod_draw_graph(\''+opnfv_dashboard_installers_pods[opnfv_dashboard_installer][i]+'\')">'+opnfv_dashboard_installers_pods_print[opnfv_dashboard_installer][i]+'</a></li>';\r
 182     html_pods += '</ul>';\r
 183     $("#pods").html(html_pods);\r
 184 }\r
 185 \r
 186 // generate a div per installer (to host the graph)\r
 187 function show_divs(installer){\r
 188   $("#graphs").remove();\r
 189   $("body").append('<div id="graphs">');\r
 190   for (var i in opnfv_dashboard_installers_scenarios[installer]){\r
 191     var div_scenario = '<div class= "chart" id="' + opnfv_dashboard_installers_scenarios[installer][i] + '"/>';\r
 192 console.log(div_scenario);\r
 193     var $newdiv = $(div_scenario);\r
 194     $("#graphs").append($newdiv);\r
 195   }\r
 196 }\r
 197 \r
 198 // generate HTML menus and buttons\r
 199 $( document ).ready(function(){\r
 200   console.log( "ready!" );\r
 201 \r
 202   //show_installers('');\r
 203   show_testcases();\r
 204   on_ready_draw_graph();\r
 205 });\r