--- /dev/null
+/* Page CSS*/\r
+body {\r
+ background-color:#000000;\r
+ font: 10px "Comic Sans MS" ;\r
+ color: orange;\r
+}\r
+#title {\r
+ font-size: 30px;\r
+}\r
+\r
+#tests {\r
+ font-size: 20px;\r
+ color: white;\r
+}\r
+\r
+#test_unit {\r
+ position: relative;\r
+ left: 200px;\r
+}\r
+\r
+/* Chart CSS */\r
+.chart {\r
+ border: 1px dashed orange;\r
+ margin: 5px;\r
+ padding: 2px;\r
+ width: 600px;\r
+ height:300px;\r
+ float:left;\r
+}\r
+\r
+/* Dygraph CSS */\r
+/* This applies to the title, x-axis label and y-axis label */\r
+#div_g .dygraph-label {\r
+ font-family: Arial, Helvetica, sans-serif;\r
+}\r
+/* This rule only applies to the chart title */\r
+#div_g .dygraph-title {\r
+ font-size: 12px;\r
+ color : orange;\r
+}\r
+ /* This rule only applies to the y-axis label */\r
+#div_g .dygraph-ylabel {\r
+ font-size: 10px;\r
+ color : orange;\r
+}\r
+\r
+/* Overrides dygraph-legend */\r
+.dygraph-legend {\r
+ font-size: 10px !important;\r
+ width: 400px !important;\r
+ text-align: left !important;\r
+ left: 200px !important;\r
+}\r
--- /dev/null
+<!--\r
+##############################################################################\r
+# All rights reserved. This program and the accompanying materials\r
+# are made available under the terms of the Apache License, Version 2.0\r
+# which accompanies this distribution, and is available at\r
+# http://www.apache.org/licenses/LICENSE-2.0\r
+##############################################################################\r
+-->\r
+<!DOCTYPE html>\r
+<html>\r
+ <head>\r
+ <meta charset="utf-8">\r
+ <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7; IE=EmulateIE9">\r
+ <title>OPNFV Functest</title>\r
+ <script type="text/javascript" src="http://dygraphs.com/dygraph-combined.js"></script>\r
+ <script type="text/javascript" src="https://code.jquery.com/jquery-2.2.0.min.js"></script>\r
+ <script type="text/javascript" src="opnfv_dashboard_tests_conf.json"></script>\r
+ <link rel="stylesheet" href="opnfv_dashboard_tests.css">\r
+ </head>\r
+ <body>\r
+ <div id="title">FuncTest</div>\r
+ <div id="tests"></div>\r
+ <script type="text/javascript" src="opnfv_dashboard_tests.js"></script>\r
+ </body>\r
+</html>\r
--- /dev/null
+/*#############################################################################\r
+# All rights reserved. This program and the accompanying materials\r
+# are made available under the terms of the Apache License, Version 2.0\r
+# which accompanies this distribution, and is available at\r
+# http://www.apache.org/licenses/LICENSE-2.0\r
+##############################################################################\r
+*/\r
+\r
+// Function to sort data to be ordered according to the time\r
+function sortFunction(a,b){\r
+ var dateA = new Date(a.date).getTime();\r
+ var dateB = new Date(b.date).getTime();\r
+ return dateA > dateB ? 1 : -1;\r
+};\r
+\r
+// Function to format date according to JS\r
+function formatDate(inputDate){\r
+ var input=inputDate.slice(0,-7);\r
+ input=input.replace(' ','T');\r
+ input+='Z';\r
+ return new Date(Date.parse(input));\r
+}\r
+\r
+// Draw a single graph for a specific test for a specific installer\r
+function drawGraph(filename,installer,test_unit){\r
+ $.getJSON( filename, function(data) {\r
+ var serie=[];\r
+ index_test=0;\r
+ // find index mapping to the test_unit\r
+ for (var i=0;i<data.dashboard.length;i++)\r
+ if (data.dashboard[i].name==test_unit){index_test=i; break;}\r
+\r
+ // build the data according to dygraph\r
+ for (i=0;i<data.dashboard[index_test].data_set.length;i++) {\r
+ var d=[];\r
+ result=data.dashboard[index_test].data_set[i];\r
+ d.push(formatDate(result.x));\r
+\r
+ // push y data if available\r
+ var keys=Object.keys(result);\r
+ for (var y in opnfv_dashboard_ys)\r
+ if ($.inArray(opnfv_dashboard_ys[y], keys)!=-1) d.push(result[opnfv_dashboard_ys[y]]); \r
+ serie.push(d);\r
+ };\r
+\r
+ // sort by date/time\r
+ serie.sort(function(a,b){\r
+ return new Date(a[0]).getTime()-new Date(b[0]).getTime()\r
+ });\r
+\r
+ // Label management\r
+ var yLabel='';\r
+ if (test_unit.includes('nb'))\r
+ yLabel='number';\r
+ else if (test_unit.includes('duration'))\r
+ yLabel='seconds';\r
+ var labels=[];\r
+ labels.push('time');\r
+ var keys=Object.keys(data.dashboard[index_test].info);\r
+ for (var y in opnfv_dashboard_y_labels)\r
+ if ($.inArray(opnfv_dashboard_y_labels[y], keys)!=-1) labels.push(data.dashboard[index_test].info[opnfv_dashboard_y_labels[y]]); \r
+\r
+ // Draw the graph\r
+ g=new Dygraph(\r
+ document.getElementById(installer),\r
+ serie,\r
+ {\r
+ colors:[opnfv_dashboard_graph_color_ok, opnfv_dashboard_graph_color_nok, opnfv_dashboard_graph_color_other],\r
+ fillGraph:true,\r
+ legend:opnfv_dashboard_graph_legend,\r
+ title:installer,\r
+ titleHeight:opnfv_dashboard_graph_title_height,\r
+ ylabel:yLabel,\r
+ labelsDivStyles:{\r
+ 'text-align': opnfv_dashboard_graph_text_align,\r
+ 'background-color': opnfv_dashboard_graph_background_color\r
+ },\r
+ axisLabelColor:opnfv_dashboard_graph_axis_label_color,\r
+ labels:labels,\r
+ highlightSeriesOpts:{strokeWidth:opnfv_dashboard_graph_stroke_width},\r
+ stepPlot:true\r
+ }\r
+ );\r
+});\r
+}\r
+\r
+// function to generate all the graphs for all installers\r
+function drawGraphsSerie(project,test,test_unit) {\r
+ for (i=0;i<opnfv_dashboard_installers.length;i++){\r
+ var filename='./'+opnfv_dashboard_file_directory+'/'+project+'/'+opnfv_dashboard_file_prefix+project+'_'+test+'_'+opnfv_dashboard_installers[i]+opnfv_dashboard_file_suffix;\r
+ drawGraph(filename,opnfv_dashboard_installers[i],test_unit);\r
+ }\r
+}\r
+\r
+// generate text and buttons for each test and unit test\r
+var text_html='';\r
+for (var i in opnfv_dashboard_projects)\r
+ for (var project in opnfv_dashboard_projects[i])\r
+ for (var test in opnfv_dashboard_projects[i][project]){\r
+ text_html+=test+' ';\r
+ for (var t in opnfv_dashboard_projects[i][project][test]){\r
+ test_unit=opnfv_dashboard_projects[i][project][test][t];\r
+ text_html+='<button onClick="drawGraphsSerie(\''+project+'\',\''+test +'\',\''+test_unit+'\')">'+test_unit+'</button>';\r
+ }\r
+ text_html+='<br>';\r
+ }\r
+document.getElementById('tests').innerHTML=text_html;\r
+\r
+// debug\r
+console.log(text_html);\r
+\r
+// generate a div per installer (to host the graph)\r
+for (var i in opnfv_dashboard_installers){\r
+ var div_installer='<div class= "chart" id="'+opnfv_dashboard_installers[i]+'"/>'\r
+ var $newdiv=$(div_installer);\r
+ $("body").append($newdiv);\r
+}\r
--- /dev/null
+var opnfv_dashboard_installers=['apex','compass','fuel','joid'];\r
+var opnfv_dashboard_projects=[\r
+ {\r
+ 'functest':{\r
+ 'tempest':['Tempest duration','Tempest nb tests/nb failures'],\r
+ 'vPing':['vPing duration'],\r
+ 'vPing_userdata':['vPing_userdata duration'],\r
+ 'vIMS':['vIMS nb tests passed/failed/skipped','vIMS orchestrator/VNF/test duration']\r
+ }\r
+ }\r
+];\r
+\r
+var opnfv_dashboard_file_directory='res';\r
+var opnfv_dashboard_file_prefix='res_';\r
+var opnfv_dashboard_file_suffix='.json';\r
+\r
+var opnfv_dashboard_ys=['y','y1','y2','y3'];\r
+var opnfv_dashboard_y_labels=['ylabel','y1label','y2label','y3label'];\r
+\r
+var opnfv_dashboard_graph_color_ok="#00FF00";\r
+var opnfv_dashboard_graph_color_nok="#FF0000";\r
+var opnfv_dashboard_graph_color_other="#0000FF";\r
+\r
+var opnfv_dashboard_graph_legend='always'; // legend print\r
+var opnfv_dashboard_graph_title_height=30; // height for the graph title\r
+var opnfv_dashboard_graph_stroke_width=5; // line stroke when mouse over\r
+var opnfv_dashboard_graph_axis_label_color='orange';\r
+var opnfv_dashboard_graph_text_align='right';\r
+var opnfv_dashboard_graph_background_color='transparent';\r
Code Review / releng.git / commitdiff