Merge branch '3.4.0' of https://github.com/codeinwp/visualizer into issue-525

Author: contactashish13

classes/Visualizer/Gutenberg/.eslintrc

@@ -16,11 +16,11 @@
     ],
     "rules": {
         "indent": [
-            "error",
+            "warn",
             "tab"
         ],
         "linebreak-style": [
-            "error",
+            "warn",
             "unix"
         ],
         "quotes": [

classes/Visualizer/Gutenberg/Block.php

@@ -75,7 +75,7 @@ public function enqueue_gutenberg_scripts() {
 		$handsontableCSS = VISUALIZER_ABSURL . 'classes/Visualizer/Gutenberg/build/handsontable.css';
 
 		if ( VISUALIZER_TEST_JS_CUSTOMIZATION ) {
-			$version = filemtime( VISUALIZER_ABSPATH . 'classes/Visualizer/Gutenberg/build/block.js' );
+			$version = filemtime( VISUALIZER_ABSPATH . '/classes/Visualizer/Gutenberg/build/block.js' );
 		} else {
 			$version = $this->version;
 		}
@@ -299,7 +299,8 @@ public function get_visualizer_data( $post ) {
 
 		$data['visualizer-chart-type'] = get_post_meta( $post_id, Visualizer_Plugin::CF_CHART_TYPE, true );
 
-		$data['visualizer-chart-library'] = get_post_meta( $post_id, Visualizer_Plugin::CF_CHART_LIBRARY, true );
+		$library = get_post_meta( $post_id, Visualizer_Plugin::CF_CHART_LIBRARY, true );
+		$data['visualizer-chart-library'] = $library;
 
 		$data['visualizer-source'] = get_post_meta( $post_id, Visualizer_Plugin::CF_SOURCE, true );
 
@@ -317,6 +318,52 @@ public function get_visualizer_data( $post ) {
 		// handle data filter hooks
 		$data['visualizer-data'] = apply_filters( Visualizer_Plugin::FILTER_GET_CHART_DATA, unserialize( html_entity_decode( get_the_content( $post_id ) ) ), $post_id, $data['visualizer-chart-type'] );
 
+		$data['visualizer-data-exploded'] = '';
+		// handle annotations for google charts
+		if ( 'GoogleCharts' === $library ) {
+			// this will contain the data of both axis.
+			$settings = $data['visualizer-settings'];
+			// this will contain data only of Y axis.
+			$series = $data['visualizer-series'];
+			$annotations = array();
+			if ( isset( $settings['series'] ) ) {
+				foreach ( $settings['series'] as $index => $serie ) {
+					// skip X axis data.
+					if ( $index === 0 ) {
+						continue;
+					}
+					if ( ! empty( $serie['role'] ) ) {
+						// this series is some kind of annotation, so let's collect its index.
+						// the index will be +1 because the X axis value is index 0, which is being ignored.
+						$annotations[ 'role' . ( intval( $index ) + 1 ) ] = $serie['role'];
+					}
+				}
+			}
+			if ( ! empty( $annotations ) ) {
+				$exploded_data = array();
+				$series_names = array();
+				foreach ( $series as $index => $serie ) {
+					// skip X axis data.
+					if ( $index === 0 ) {
+						continue;
+					}
+					if ( array_key_exists( 'role' . $index, $annotations ) ) {
+						$series_names[] = (object) array( 'role' => $annotations[ 'role' . $index ], 'type' => $serie['type'] );
+					} else {
+						$series_names[] = $serie['label'];
+					}
+				}
+				$exploded_data[] = $series_names;
+
+				foreach ( $data['visualizer-data'] as $datum ) {
+					// skip X axis data.
+					unset( $datum[0] );
+					$exploded_data[] = $datum;
+				}
+				$data['visualizer-data-exploded'] = array( $exploded_data );
+			}
+		}
+
 		$import = get_post_meta( $post_id, Visualizer_Plugin::CF_CHART_URL, true );
 
 		$schedule = get_post_meta( $post_id, Visualizer_Plugin::CF_CHART_SCHEDULE, true );

classes/Visualizer/Gutenberg/build/block.css

@@ -36,7 +36,7 @@ class ChartRender extends Component {
 	}
 
 	render() {
-		let chart;
+		let chart, footer;
 
 		let data = formatDate( JSON.parse( JSON.stringify( this.props.chart ) ) );
 
@@ -50,6 +50,10 @@ class ChartRender extends Component {
 			chart = `${ startCase( this.props.chart['visualizer-chart-type']) }Chart`;
 		}
 
+        if ( data['visualizer-data-exploded']) {
+            footer = __( 'Annotations in this chart may not display here but they will display in the front end.' );
+        }
+
 		return (
 			<div className={ this.props.className }>
 
@@ -78,7 +82,7 @@ class ChartRender extends Component {
 								columns={ data['visualizer-series'] }
 								options={ data['visualizer-settings'] }
 							/>
-						) : (
+						) : ( '' !== data['visualizer-data-exploded'] ? (
 							<Chart
 								chartType={ chart }
 								rows={ data['visualizer-data'] }
@@ -90,7 +94,23 @@ class ChartRender extends Component {
 								}
 								height="500px"
 							/>
-						) }
+                        ) : (
+							<Chart
+								chartType={ chart }
+								rows={ data['visualizer-data'] }
+								columns={ data['visualizer-series'] }
+								options={
+									isValidJSON( this.props.chart['visualizer-settings'].manual ) ?
+										merge( compact( this.props.chart['visualizer-settings']), JSON.parse( this.props.chart['visualizer-settings'].manual ) ) :
+										compact( this.props.chart['visualizer-settings'])
+								}
+								height="500px"
+							/>
+						) ) }
+
+                         <div className="visualizer-settings__charts-footer"><sub>
+                            { footer }
+                         </sub></div>
 
 					</Fragment>
 				}