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
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
14 return new Date(Date.parse(input));
\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
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
29 // build the data according to dygraph
\r
30 for (i=0; i<data.dashboard[index_test].data_set.length; i++) {
\r
32 result = data.dashboard[index_test].data_set[i];
\r
33 d.push(format_date(result.x));
\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
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
49 if (test_unit.includes('nb'))
\r
51 else if (test_unit.includes('duration'))
\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
61 document.getElementById(scenario),
\r
64 colors: [opnfv_dashboard_graph_color_ok, opnfv_dashboard_graph_color_nok, opnfv_dashboard_graph_color_other],
\r
66 legend: opnfv_dashboard_graph_legend,
\r
68 titleHeight: opnfv_dashboard_graph_title_height,
\r
71 'text-align': opnfv_dashboard_graph_text_align,
\r
72 'background-color': opnfv_dashboard_graph_background_color
\r
74 axisLabelColor: opnfv_dashboard_graph_axis_label_color,
\r
76 highlightSeriesOpts: {strokeWidth: opnfv_dashboard_graph_stroke_width},
\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
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
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
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
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
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
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
154 html_testcases+='</ul>';
\r
155 $("#testcase").html(html_testcases);
\r
158 // generate installers buttons
\r
159 function show_installers(active_installer)
\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
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
172 // generate pods buttons
\r
173 function show_installers_pods(active_pod)
\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
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
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
198 // generate HTML menus and buttons
\r
199 $( document ).ready(function(){
\r
200 console.log( "ready!" );
\r
202 //show_installers('');
\r
204 on_ready_draw_graph();
\r