Update to Version 3.3, use Bulletin Board instead of c3

Author: TheWitness

CHANGELOG.md

@@ -1,10 +1,12 @@
 # Changelog
 
---- develop ---
+--- 3.3 ---
 
 * issue#61: IPFIX Errors in Cacti Log
 * issue#62: Problem with ` symbol in SQL queries
-* issue: Upgrade was running repeatedly due upgrade using legacy variable
+* issue: Upgrade was running repeatedly due upgrade using legacy variable
+* feature: Update FlowView to use Bulletin Board Charts
+* feature: Minimum Cacti requirement 1.2.17 for Bulletin Board
 
 --- 3.2 ---
 

INFO

@@ -1,9 +1,9 @@
 [info]
 name = flowview
-version = 3.2
+version = 3.3
 longname = FlowView
 author = The Cacti Group
 email = 
 homepage = http://www.cacti.net
-compat = 1.2.14
+compat = 1.2.17
 capabilities = online_view:0, online_mgmt:0, offline_view:0, offline_mgmt:0, remote_collect:0

flow_collector.php

@@ -420,8 +420,8 @@ function process_fv5($p, $peer) {
 		$retime = ($data['Last'] - $header['sysuptime']) / 1000;
 		$remsec = substr($data['Last'] - $header['sysuptime'], -3);
 
-		$start_time = date('Y-m-d H:i:s', $flowtime + $rstime) . '.' . $rsmsec;
-		$end_time   = date('Y-m-d H:i:s', $flowtime + $retime) . '.' . $remsec;
+		$start_time = date('Y-m-d H:i:s.v', $flowtime + $rstime) . '.' . $rsmsec;
+		$end_time   = date('Y-m-d H:i:s.v', $flowtime + $retime) . '.' . $remsec;
 
 		$sql_prefix = get_sql_prefix($flowtime);
 
@@ -1006,8 +1006,8 @@ function process_v9_v10($data, $peer, $flowtime, $sysuptime = 0) {
 		$retime = ($data[$fieldname['end_time']] - $data[$fieldname['sysuptime']]) / 1000;
 		$remsec = substr($data[$fieldname['end_time']] - $data[$fieldname['sysuptime']], -3);
 
-		$start_time = date('Y-m-d H:i:s', $flowtime + $rstime) . '.' . $rsmsec;
-		$end_time   = date('Y-m-d H:i:s', $flowtime + $retime) . '.' . $remsec;
+		$start_time = date('Y-m-d H:i:s.v', $flowtime + $rstime) . '.' . $rsmsec;
+		$end_time   = date('Y-m-d H:i:s.v', $flowtime + $retime) . '.' . $remsec;
 		$sysuptime = $data[$fieldname['sysuptime']];
 	} elseif ($sysuptime > 0) {
 		$rsmsec = $rstime = $remsec = $retime = 0;
@@ -1022,11 +1022,11 @@ function process_v9_v10($data, $peer, $flowtime, $sysuptime = 0) {
 			$remsec = substr($data[$fieldname['end_time']] - $sysuptime, -3);
 		}
 
-		$start_time = date('Y-m-d H:i:s', $flowtime + $rstime) . '.' . $rsmsec;
-		$end_time   = date('Y-m-d H:i:s', $flowtime + $retime) . '.' . $remsec;
+		$start_time = date('Y-m-d H:i:s.v', $flowtime + $rstime) . '.' . $rsmsec;
+		$end_time   = date('Y-m-d H:i:s.v', $flowtime + $retime) . '.' . $remsec;
 	} else {
-		$start_time = date('Y-m-d H:i:s', $flowtime);
-		$end_time   = date('Y-m-d H:i:s', $flowtime);
+		$start_time = date('Y-m-d H:i:s.v', $flowtime);
+		$end_time   = date('Y-m-d H:i:s.v', $flowtime);
 	}
 
 	$src_domain  = flowview_get_dns_from_ip($src_addr, 100);

functions.php

@@ -870,7 +870,7 @@ function flowview_display_filter($data) {
 						'&date1='        + $('#date1').val()  +
 						'&date2='        + $('#date2').val(), function(data) {
 
-						var chartBytes = c3.generate({
+						var chartBytes = bb.generate({
 							bindto: '#chartbytes',
 							size: {
 								height: 400,
@@ -926,7 +926,7 @@ function flowview_display_filter($data) {
 						'&date1='        + $('#date1').val()   +
 						'&date2='        + $('#date2').val(), function(data) {
 
-						var chartFlows = c3.generate({
+						var chartFlows = bb.generate({
 							bindto: '#chartflows',
 							size: {
 								height: 400,
@@ -982,7 +982,7 @@ function flowview_display_filter($data) {
 						'&date1='        + $('#date1').val()   +
 						'&date2='        + $('#date2').val(), function(data) {
 
-						var chartPackets = c3.generate({
+						var chartPackets = bb.generate({
 							bindto: '#chartpackets',
 							size: {
 								height: 400,

setup.php

@@ -123,7 +123,7 @@ function plugin_flowview_check_upgrade() {
 					if (db_index_exists($t['TABLE_NAME'], 'keycol')) {
 						db_execute('ALTER TABLE ' . $t['TABLE_NAME'] . '
 							DROP INDEX `keycol`,
-							ADD UNIQUE INDEX `keycol` (`listener_id`, `src_addr`, `src_port`, `src_if`,`dst_addr`,`dst_port`, `dst_if`, `start_time`, `end_time`)');
+							ADD UNIQUE INDEX `keycol` (`listener_id`, `src_addr`, `src_port`, `src_if`, `dst_addr`, `dst_port`, `dst_if`, `start_time`, `end_time`)');
 					} else {
 						db_execute('ALTER TABLE ' . $t['TABLE_NAME'] . '
 							ADD UNIQUE INDEX `keycol` (`listener_id`, `src_addr`, `src_port`, `src_if`,`dst_addr`,`dst_port`, `dst_if`, `start_time`, `end_time`)');

themes/dark.css

@@ -1,31 +1,31 @@
-.c3-chart {
+.bb-chart {
 }
 
-.c3-chart-arc path {
+.bb-chart-arc path {
 	fill: #A8A8A8;
 }
 
-.c3-tooltip {
+.bb-tooltip {
 }
 
-.c3-legend-item {
+.bb-legend-item {
 	fill: #A8A8A8;
 }
 
-.c3-grid {
+.bb-grid {
 	fill: #A8A8A8;
 }
 
-.c3-axis {
+.bb-axis {
 	fill: #A8A8A8;
 }
 
 /*-- Tooltip --*/
-.c3-tooltip-container {
+.bb-tooltip-container {
   z-index: 10;
 }
 
-.c3-tooltip {
+.bb-tooltip {
   border-collapse: collapse;
   border-spacing: 0;
   background-color: #161616;
@@ -36,192 +36,192 @@
   opacity: 0.9;
 }
 
-.c3-tooltip tr {
+.bb-tooltip tr {
   border: 1px solid #050505;
 }
 
-.c3-tooltip th {
+.bb-tooltip th {
   background-color: #161616;
   font-size: 14px;
   padding: 2px 5px;
   text-align: left;
   color: #FFFFFF;
 }
 
-.c3-tooltip td {
+.bb-tooltip td {
   font-size: 13px;
   padding: 3px 6px;
   background-color: #050505;
   border-left: 1px dotted #999;
 }
 
-.c3-tooltip td > span {
+.bb-tooltip td > span {
   display: inline-block;
   width: 10px;
   height: 10px;
   margin-right: 6px;
 }
 
-.c3-tooltip td.value {
+.bb-tooltip td.value {
   text-align: right;
 }
 
 /*-- Chart --*/
-.c3 svg {
+.bb svg {
   font: 10px sans-serif;
   -webkit-tap-highlight-color: transparent;
 }
 
-.c3 path, .c3 line {
+.bb path, .bb line {
   fill: none;
   stroke: #E0E0E0;
 }
 
-.c3 text {
+.bb text {
   -webkit-user-select: none;
   -moz-user-select: none;
   user-select: none;
 }
 
-.c3-legend-item-tile,
-.c3-xgrid-focus,
-.c3-ygrid,
-.c3-event-rect,
-.c3-bars path {
+.bb-legend-item-tile,
+.bb-xgrid-focus,
+.bb-ygrid,
+.bb-event-rect,
+.bb-bars path {
   shape-rendering: crispEdges;
 }
 
-.c3-chart-arc path {
+.bb-chart-arc path {
   stroke: #fff;
 }
 
-.c3-chart-arc text {
+.bb-chart-arc text {
   fill: #fff;
   font-size: 13px;
 }
 
 /*-- Axis --*/
 /*-- Grid --*/
-.c3-grid line {
+.bb-grid line {
   stroke: #aaa;
 }
 
-.c3-grid text {
+.bb-grid text {
   fill: #aaa;
 }
 
-.c3-xgrid, .c3-ygrid {
+.bb-xgrid, .bb-ygrid {
   stroke-dasharray: 3 3;
 }
 
 /*-- Text on Chart --*/
-.c3-text.c3-empty {
+.bb-text.bb-empty {
   fill: #808080;
   font-size: 2em;
 }
 
 /*-- Line --*/
-.c3-line {
+.bb-line {
   stroke-width: 1px;
 }
 
 /*-- Point --*/
-.c3-circle._expanded_ {
+.bb-circle._expanded_ {
   stroke-width: 1px;
   stroke: white;
 }
 
-.c3-selected-circle {
+.bb-selected-circle {
   fill: white;
   stroke-width: 2px;
 }
 
 /*-- Bar --*/
-.c3-bar {
+.bb-bar {
   stroke-width: 0;
 }
 
-.c3-bar._expanded_ {
+.bb-bar._expanded_ {
   fill-opacity: 0.75;
 }
 
 /*-- Focus --*/
-.c3-target.c3-focused {
+.bb-target.bb-focused {
   opacity: 1;
 }
 
-.c3-target.c3-focused path.c3-line, .c3-target.c3-focused path.c3-step {
+.bb-target.bb-focused path.bb-line, .bb-target.bb-focused path.bb-step {
   stroke-width: 2px;
 }
 
-.c3-target.c3-defocused {
+.bb-target.bb-defocused {
   opacity: 0.3 !important;
 }
 
 /*-- Region --*/
-.c3-region {
+.bb-region {
   fill: steelblue;
   fill-opacity: .1;
 }
 
 /*-- Brush --*/
-.c3-brush .extent {
+.bb-brush .extent {
   fill-opacity: .1;
 }
 
 /*-- Select - Drag --*/
 /*-- Legend --*/
-.c3-legend-item {
+.bb-legend-item {
   font-size: 12px;
 }
 
-.c3-legend-item-hidden {
+.bb-legend-item-hidden {
   opacity: 0.15;
 }
 
-.c3-legend-background {
+.bb-legend-background {
   opacity: 0.75;
   fill: white;
   stroke: lightgray;
   stroke-width: 1;
 }
 
 /*-- Title --*/
-.c3-title {
+.bb-title {
   font: 14px sans-serif;
 }
 
 /*-- Area --*/
-.c3-area {
+.bb-area {
   stroke-width: 0;
   opacity: 0.2;
 }
 
 /*-- Arc --*/
-.c3-chart-arcs-title {
+.bb-chart-arcs-title {
   dominant-baseline: middle;
   font-size: 1.3em;
 }
 
-.c3-chart-arcs .c3-chart-arcs-background {
+.bb-chart-arcs .bb-chart-arcs-background {
   fill: #E0E0E0;
   stroke: none;
 }
 
-.c3-chart-arcs .c3-chart-arcs-gauge-unit {
+.bb-chart-arcs .bb-chart-arcs-gauge-unit {
   fill: #000;
   font-size: 16px;
 }
 
-.c3-chart-arcs .c3-chart-arcs-gauge-max {
+.bb-chart-arcs .bb-chart-arcs-gauge-max {
   fill: #777;
 }
 
-.c3-chart-arcs .c3-chart-arcs-gauge-min {
+.bb-chart-arcs .bb-chart-arcs-gauge-min {
   fill: #777;
 }
 
-.c3-chart-arc .c3-gauge-value {
+.bb-chart-arc .bb-gauge-value {
   fill: #000;
   /*  font-size: 28px !important;*/
 }

themes/default.css

@@ -1,3 +1,3 @@
-.c3-chart {
+.bb-chart {
 	background-color: green;
 }