WEB-685 replace reporting flash pie chart by javascript

centreon · Aug 7, 2015 · 05d1c35 · 05d1c35
1 parent 54a7c05
commit 05d1c35
Show file tree

Hide file tree

Showing 11 changed files with 183 additions and 62 deletions.
diff --git a/www/include/common/javascript/c3.min.js b/www/include/common/javascript/c3.min.js
diff --git a/www/include/common/javascript/d3.min.js b/www/include/common/javascript/d3.min.js
diff --git a/www/include/reporting/dashboard/initReport.php b/www/include/reporting/dashboard/initReport.php
@@ -225,9 +225,11 @@
 	$formPeriod->addElement('submit', 'button', _("Apply"));
 	$formPeriod->setDefaults(array('period' => $period, "StartDate" => $get_date_start, "EndDate" => $get_date_end));
 ?>
+<script src="./include/common/javascript/d3.min.js" language="javascript"></script>
+<script src="./include/common/javascript/c3.min.js" language="javascript"></script>
 <script type='text/javascript'>
 function togglePeriodType()
 {
 	document.getElementById("presetPeriod").selectedIndex = 0;
 }
-</script>
+</script>
diff --git a/www/include/reporting/dashboard/template/viewHostGroupLog.ihtml b/www/include/reporting/dashboard/template/viewHostGroupLog.ihtml
@@ -29,17 +29,12 @@
 			<table style='width:100%'>
 			<tr>
 				<td rowspan=3 style='width:300px; padding:5px'>
-					<!-- flash chart drawing -->
+					<!-- chart drawing -->
 					{if $name}	
 						<table class="ListTable" >
 							<tr>
 								<td class="ListColCenter">
-								{php}
-									global $pie_chart_get_str;
-									//global $service_name;
-									include_once 'lib/ofc-library/open_flash_chart_object.php';
-									open_flash_chart_object( 300, 250, 'include/reporting/dashboard/imagesGenerations/pie-charts.php?host_name='.$name.$pie_chart_get_str );
-								{/php}
+                                                                    <div id="chart"></div>
 								</td>					
 							</tr>
 						</table>
@@ -168,4 +163,35 @@
 			</table>
 		</td>
 	</tr>
-</table>
+</table>
+
+<script>
+{literal}
+    jQuery(function () {
+        c3.generate({
+            bindto: d3.select('#chart'),
+            data: {
+                // iris data from R
+                columns: [
+                    ['Up', {/literal}{$hostgroup_up}{literal}],
+                    ['Down', {/literal}{$hostgroup_down}{literal}],
+                    ['Unreachable', {/literal}{$hostgroup_unreachable}{literal}],
+                    ['Downtime', {/literal}{$hostgroup_maintenance}{literal}],
+                    ['Undetermined', {/literal}{$hostgroup_undetermined}{literal}],
+                ],
+                type : 'pie',
+                colors : {
+                    'Up' : '#13EB3A',
+                    'Down' : '#F91D05',
+                    'Unreachable' : '#82CFD8',
+                    'Downtime' : '#CC99FF',
+                    'Undetermined' : '#F0F0F0'
+                }
+            },
+            size: {
+                height: 210
+            }
+        });
+    });
+{/literal}
+</script>
diff --git a/www/include/reporting/dashboard/template/viewHostLog.ihtml b/www/include/reporting/dashboard/template/viewHostLog.ihtml
@@ -28,17 +28,12 @@
 			<table style='width:100%'>
 			<tr>
 				<td rowspan=3 style='width:300px; padding:5px'>
-					<!-- flash chart drawing -->
+					<!-- chart drawing -->
 					{if $name}	
 						<table class="ListTable" >
 							<tr>
 								<td class="ListColCenter">
-								{php}
-									global $pie_chart_get_str;
-									global $service_name;
-									include_once 'lib/ofc-library/open_flash_chart_object.php';
-									open_flash_chart_object( 300, 250, 'include/reporting/dashboard/imagesGenerations/pie-charts.php?host_name='.$name.$pie_chart_get_str );
-								{/php}
+                                                                    <div id="chart"></div>
 								</td>					
 							</tr>
 						</table>
@@ -193,4 +188,36 @@
 			</table>
 		</td>
 	</tr>
-</table>
+</table>
+
+<script>
+{literal}
+    jQuery(function () {
+        c3.generate({
+            bindto: d3.select('#chart'),
+            data: {
+                // iris data from R
+                columns: [
+                    ['Up', {/literal}{$host_up}{literal}],
+                    ['Down', {/literal}{$host_down}{literal}],
+                    ['Unreachable', {/literal}{$host_unreachable}{literal}],
+                    ['Downtime', {/literal}{$host_maintenance}{literal}],
+                    ['Undetermined', {/literal}{$host_undetermined}{literal}],
+                ],
+                type : 'pie',
+                colors : {
+                    'Up' : '#13EB3A',
+                    'Down' : '#F91D05',
+                    'Unreachable' : '#82CFD8',
+                    'Downtime' : '#CC99FF',
+                    'Undetermined' : '#F0F0F0'
+                }
+            },
+            size: {
+                height: 210
+            }
+        });
+    });
+{/literal}
+</script>
+
diff --git a/www/include/reporting/dashboard/template/viewServicesGroupLog.ihtml b/www/include/reporting/dashboard/template/viewServicesGroupLog.ihtml
@@ -29,16 +29,12 @@
 			<table style='width:100%'>
 			<tr>
 				<td rowspan=3 style='width:300px; padding:5px'>
-					<!-- flash chart drawing -->
+					<!-- chart drawing -->
 					{if $name}	
 						<table class="ListTable" >
 							<tr>
 								<td class="ListColCenter">
-								{php}
-									global $pie_chart_get_str;
-									include_once 'lib/ofc-library/open_flash_chart_object.php';
-									open_flash_chart_object( 300, 250, 'include/reporting/dashboard/imagesGenerations/pie-charts.php?service_name='.$name.$pie_chart_get_str );
-								{/php}
+                                                                    <div id="chart"></div>
 								</td>					
 							</tr>
 						</table>
@@ -180,4 +176,37 @@
 			</table>
 		</td>
 	</tr>
-</table>
+</table>
+
+<script>
+{literal}
+    jQuery(function () {
+        c3.generate({
+            bindto: d3.select('#chart'),
+            data: {
+                // iris data from R
+                columns: [
+                    ['Ok', {/literal}{$servicegroup_ok}{literal}],
+                    ['Warning', {/literal}{$servicegroup_warning}{literal}],
+                    ['Critical', {/literal}{$servicegroup_critical}{literal}],
+                    ['Unknown', {/literal}{$servicegroup_unknown}{literal}],
+                    ['Downtime', {/literal}{$servicegroup_maintenance}{literal}],
+                    ['Undetermined', {/literal}{$servicegroup_undetermined}{literal}]
+                ],
+                type : 'pie',
+                colors : {
+                    'Ok' : '#13EB3A',
+                    'Warning' : '#F8C706',
+                    'Critical' : '#F91D05',
+                    'Unknown' : '#DCDADA',
+                    'Downtime' : '#CC99FF',
+                    'Undetermined' : '#F0F0F0'
+                }
+            },
+            size: {
+                height: 210
+            }
+        });
+    });
+{/literal}
+</script>
diff --git a/www/include/reporting/dashboard/template/viewServicesLog.ihtml b/www/include/reporting/dashboard/template/viewServicesLog.ihtml
@@ -33,11 +33,7 @@
 						<tr class='ListHeader'></tr>
 						<tr>
 							<td class="ListColCenter">
-								{php}
-									global $items, $service_id, $host_name, $pie_chart_get_str, $service_name;
-									include_once 'lib/ofc-library/open_flash_chart_object.php';
-									open_flash_chart_object( 300, 250, 'include/reporting/dashboard/imagesGenerations/pie-charts.php?service_name='.$service_name.'&host_name='.$host_name.$pie_chart_get_str );
-								{/php}
+                                                            <div id="chart"></div>
 							</td>					
 						</tr>
 					</table>
@@ -136,4 +132,37 @@
 			</table>
 		</td>
 	</tr>
-</table>
+</table>
+
+<script>
+{literal}
+    jQuery(function () {
+        c3.generate({
+            bindto: d3.select('#chart'),
+            data: {
+                // iris data from R
+                columns: [
+                    ['Ok', {/literal}{$service_ok}{literal}],
+                    ['Warning', {/literal}{$service_warning}{literal}],
+                    ['Critical', {/literal}{$service_critical}{literal}],
+                    ['Unknown', {/literal}{$service_unknown}{literal}],
+                    ['Downtime', {/literal}{$service_maintenance}{literal}],
+                    ['Undetermined', {/literal}{$service_undetermined}{literal}]
+                ],
+                type : 'pie',
+                colors : {
+                    'Ok' : '#13EB3A',
+                    'Warning' : '#F8C706',
+                    'Critical' : '#F91D05',
+                    'Unknown' : '#DCDADA',
+                    'Downtime' : '#CC99FF',
+                    'Undetermined' : '#F0F0F0'
+                }
+            },
+            size: {
+                height: 210
+            }
+        });
+    });
+{/literal}
+</script>
diff --git a/www/include/reporting/dashboard/viewHostGroupLog.php b/www/include/reporting/dashboard/viewHostGroupLog.php
@@ -101,19 +101,18 @@
 		$hostgroupStats = getLogInDbForHostGroup($id, $start_date, $end_date, $reportingTimePeriod) ;
 
 		/*
-		 * Flash chart datas
+		 * Chart datas
 		 */
-		$pie_chart_get_str =  "&value[down]=".$hostgroupStats["average"]["DOWN_TP"].
-							"&value[up]=".$hostgroupStats["average"]["UP_TP"].
-							"&value[unreachable]=".$hostgroupStats["average"]["UNREACHABLE_TP"].
-							"&value[maintenance]=".$hostgroupStats["average"]["MAINTENANCE_TP"].
-							"&value[undetermined]=".$hostgroupStats["average"]["UNDETERMINED_TP"];
+                $tpl->assign('hostgroup_up', $hostgroupStats["average"]["UP_TP"]);
+                $tpl->assign('hostgroup_down', $hostgroupStats["average"]["DOWN_TP"]);
+                $tpl->assign('hostgroup_unreachable', $hostgroupStats["average"]["UNREACHABLE_TP"]);
+                $tpl->assign('hostgroup_undetermined', $hostgroupStats["average"]["UNDETERMINED_TP"]);
+                $tpl->assign('hostgroup_maintenance', $hostgroupStats["average"]["MAINTENANCE_TP"]);
 
 		/*
 		 * Exporting variables for ihtml
 		 */
 		$tpl->assign('name', $items[$id]);
-		$tpl->assign('pie_chart_get_str', $pie_chart_get_str);
 		$tpl->assign('totalAlert', $hostgroupStats["average"]["TOTAL_ALERTS"]);
 		$tpl->assign('summary',  $hostgroupStats["average"]);
 
@@ -180,4 +179,4 @@
 	}
 
 	$tpl->display("template/viewHostGroupLog.ihtml");
-?>
+?>
diff --git a/www/include/reporting/dashboard/viewHostLog.php b/www/include/reporting/dashboard/viewHostLog.php
@@ -100,19 +100,18 @@
 		$hostServicesStats =  getLogInDbForHostSVC($id, $start_date, $end_date, $reportingTimePeriod);
 
 		/*
-		 * Flash chart datas
+		 * Chart datas
 		 */
-		$pie_chart_get_str =  "&value[down]=".$hostStats["DOWN_TP"].
-							"&value[up]=".$hostStats["UP_TP"].
-							"&value[unreachable]=".$hostStats["UNREACHABLE_TP"].
-							"&value[undetermined]=".$hostStats["UNDETERMINED_TP"].
-							"&value[maintenance]=".$hostStats["MAINTENANCE_TP"];
+                $tpl->assign('host_up', $hostStats["UP_TP"]);
+                $tpl->assign('host_down', $hostStats["DOWN_TP"]);
+                $tpl->assign('host_unreachable', $hostStats["UNREACHABLE_TP"]);
+                $tpl->assign('host_undetermined', $hostStats["UNDETERMINED_TP"]);
+                $tpl->assign('host_maintenance', $hostStats["MAINTENANCE_TP"]);
 
 		/*
 		 * Exporting variables for ihtml
 		 */
 		$tpl->assign("name", $hosts[$id]);
-		$tpl->assign("pie_chart_get_str", $pie_chart_get_str);
 		$tpl->assign("totalAlert", $hostStats["TOTAL_ALERTS"]);
 		$tpl->assign("totalTime",  $hostStats["TOTAL_TIME_F"]);
 		$tpl->assign("summary",  $hostStats);
@@ -166,4 +165,4 @@
 		?><script type="text/javascript"> function initTimeline() {;} </script> <?php
 	}
 	$tpl->display("template/viewHostLog.ihtml");
-?>
+?>
diff --git a/www/include/reporting/dashboard/viewServicesGroupLog.php b/www/include/reporting/dashboard/viewServicesGroupLog.php
@@ -92,20 +92,19 @@
 		$servicesgroupStats = getLogInDbForServicesGroup($id, $start_date, $end_date, $reportingTimePeriod) ;
 
 		/*
-		 * Flash chart datas
+		 * Chart datas
 		 */
-		$pie_chart_get_str =  "&value[ok]=".$servicesgroupStats["average"]["OK_TP"].
-							"&value[warning]=".$servicesgroupStats["average"]["WARNING_TP"].
-							"&value[critical]=".$servicesgroupStats["average"]["CRITICAL_TP"].
-							"&value[unknown]=".$servicesgroupStats["average"]["UNKNOWN_TP"].
-							"&value[maintenance]=".$servicesgroupStats["average"]["MAINTENANCE_TP"].
-							"&value[undetermined]=".$servicesgroupStats["average"]["UNDETERMINED_TP"];
+                $tpl->assign('servicegroup_ok', $servicesgroupStats["average"]["OK_TP"]);
+                $tpl->assign('servicegroup_warning', $servicesgroupStats["average"]["WARNING_TP"]);
+                $tpl->assign('servicegroup_critical', $servicesgroupStats["average"]["CRITICAL_TP"]);
+                $tpl->assign('servicegroup_unknown', $servicesgroupStats["average"]["UNKNOWN_TP"]);
+                $tpl->assign('servicegroup_undetermined', $servicesgroupStats["average"]["UNDETERMINED_TP"]);
+                $tpl->assign('servicegroup_maintenance', $servicesgroupStats["average"]["MAINTENANCE_TP"]);
 
 		/*
 		 * Exporting variables for ihtml
 		 */
 		$tpl->assign('name', $items[$id]);
-		$tpl->assign('pie_chart_get_str', $pie_chart_get_str);
 		$tpl->assign('totalAlert', $servicesgroupStats["average"]["TOTAL_ALERTS"]);
 		$tpl->assign('summary',  $servicesgroupStats["average"]);
 
@@ -172,4 +171,4 @@
 	}
 
 	$tpl->display("template/viewServicesGroupLog.ihtml");
-?>
+?>
diff --git a/www/include/reporting/dashboard/viewServicesLog.php b/www/include/reporting/dashboard/viewServicesLog.php
@@ -101,19 +101,20 @@
 		$serviceStats = getLogInDbForOneSVC($host_id, $service_id, $start_date, $end_date, $reportingTimePeriod) ;
 
 		/*
-		 * Flash chart datas
+		 * Chart datas
 		 */
-		$pie_chart_get_str =  "&value[ok]=".$serviceStats["OK_TP"]."&value[warning]=".
-					$serviceStats["WARNING_TP"]."&value[critical]=".$serviceStats["CRITICAL_TP"].
-					"&value[unknown]=".$serviceStats["UNKNOWN_TP"]."&value[undetermined]=".$serviceStats["UNDETERMINED_TP"].
-					"&value[maintenance]=".$serviceStats["MAINTENANCE_TP"];
+                $tpl->assign('service_ok', $serviceStats["OK_TP"]);
+                $tpl->assign('service_warning', $serviceStats["WARNING_TP"]);
+                $tpl->assign('service_critical', $serviceStats["CRITICAL_TP"]);
+                $tpl->assign('service_unknown', $serviceStats["UNKNOWN_TP"]);
+                $tpl->assign('service_undetermined', $serviceStats["UNDETERMINED_TP"]);
+                $tpl->assign('service_maintenance', $serviceStats["MAINTENANCE_TP"]);
 
 		/*
 		 * Exporting variables for ihtml
 		 */
 		$tpl->assign('host_name', $host_name);
 		$tpl->assign('name', $itemsForUrl[$service_id]);
-		$tpl->assign('pie_chart_get_str', $pie_chart_get_str);
 		$tpl->assign('totalAlert', $serviceStats["TOTAL_ALERTS"]);
 		$tpl->assign('totalTime',  $serviceStats["TOTAL_TIME_F"]);
 		$tpl->assign('summary',  $serviceStats);
@@ -165,4 +166,4 @@
 		?><script type="text/javascript"> function initTimeline() {;} </script> <?php
 	}
 	$tpl->display("template/viewServicesLog.ihtml");
-?>
+?>