PluginProbe
Visualizer – Tables & Charts Manager with Built-in AI Generator / 3.11.10
Visualizer – Tables & Charts Manager with Built-in AI Generator v3.11.10
4.0.8 4.0.7 4.0.6 4.0.5 4.0.4 4.0.3 3.0.5 3.0.6 3.0.7 3.0.8 3.0.9 3.1.0 3.1.1 3.1.2 3.1.3 3.10.0 3.10.1 3.10.10 3.10.11 3.10.12 3.10.13 3.10.14 3.10.15 3.10.2 3.10.3 All 149 releases
← All changes | classes/Visualizer/Gutenberg/src/Editor.js +50 -11 3.10.143.11.10 View file →
@@ -6,9 +6,9 @@
6 6 import ChartSelect from './Components/ChartSelect.js';
7 7
8 8 import ChartRender from './Components/ChartRender.js';
9 9
10 -import { CSVToArray } from './utils.js';
10 +import { CSVToArray, buildChartPopup, tryGetPublishedChartData } from './utils.js';
11 11
12 12 /**
13 13 * WordPress dependencies
14 14 */
@@ -55,8 +55,9 @@
55 55 this.uploadData = this.uploadData.bind( this );
56 56 this.getChartData = this.getChartData.bind( this );
57 57 this.editChartData = this.editChartData.bind( this );
58 58 this.updateChart = this.updateChart.bind( this );
59 + this.createChart = this.createChart.bind( this );
59 60
60 61 this.state = {
61 62
62 63 /**
@@ -100,13 +101,19 @@
100 101 await this.setState({
101 102 isLoading: 'getChart'
102 103 });
103 104
104 - let result = await apiFetch({ path: `wp/v2/visualizer/${id}` });
105 + const chartDataRequest = await tryGetPublishedChartData( id );
105 106
107 + if ( 'publish' !== chartDataRequest.chartStatus ) {
108 + this.setState({ route: 'showCharts', isLoading: false });
109 + this.props.setAttributes({ route: 'showCharts' });
110 + return;
111 + }
112 +
106 113 this.setState({
107 114 route: 'chartSelect',
108 - chart: result['chart_data'],
115 + chart: chartDataRequest.result['chart_data'],
109 116 isLoading: true,
110 117 isModified: true
111 118 });
112 119
@@ -420,21 +427,24 @@
420 427 if ( false === this.state.isScheduled ) {
421 428 data['visualizer-chart-schedule'] = '';
422 429 }
423 430
424 - let fieldName = 'series';
431 + let dataChartStylingOption = 'series';
425 432
426 433 if ( 'pie' === data['visualizer-chart-type']) {
427 - fieldName = 'slices';
434 + dataChartStylingOption = 'slices';
428 435 }
429 436
430 437 // no series for bubble and timeline charts.
431 - if ( -1 >= [ 'bubble', 'timeline' ].indexOf( data['visualizer-chart-type']) ) {
432 - Object.keys( data['visualizer-settings'][fieldName])
438 + if (
439 + undefined !== data['visualizer-settings'][dataChartStylingOption] &&
440 + -1 >= [ 'bubble', 'timeline' ].indexOf( data['visualizer-chart-type'])
441 + ) {
442 + Object.keys( data['visualizer-settings'][dataChartStylingOption])
433 443 .map( i => {
434 - if ( data['visualizer-settings'][fieldName][i] !== undefined ) {
435 - if ( data['visualizer-settings'][fieldName][i].temp !== undefined ) {
436 - delete data['visualizer-settings'][fieldName][i].temp;
444 + if ( data['visualizer-settings'][dataChartStylingOption][i] !== undefined ) {
445 + if ( data['visualizer-settings'][dataChartStylingOption][i].temp !== undefined ) {
446 + delete data['visualizer-settings'][dataChartStylingOption][i].temp;
437 447 }
438 448 }
439 449 }
440 450 );
@@ -455,8 +465,37 @@
455 465 }
456 466 );
457 467 }
458 468
469 + /**
470 + * Create a new chart via popup.
471 + *
472 + * @returns {void}
473 + */
474 + async createChart() {
475 +
476 + // Use the same popup like in Chart Library.
477 + const createChartPopup = new ( buildChartPopup() )({
478 + action: visualizerLocalize.createChart
479 + });
480 +
481 + // eslint-disable-next-line camelcase
482 + window.send_to_editor = () => {
483 + createChartPopup.close();
484 + };
485 +
486 + window.parent.addEventListener( 'message', ( event ) => {
487 + if ( 'visualizer:mediaframe:close' === event.data ) {
488 + createChartPopup.close();
489 + } else if ( event.data.chartID && null === this.state.chart ) {
490 + const chartID = parseInt( event.data.chartID, 10 );
491 + this.getChart( chartID );
492 + }
493 + }, false );
494 +
495 + createChartPopup.open();
496 + }
497 +
459 498 render() {
460 499 if ( 'error' === this.state.route ) {
461 500 return (
462 501 <Notice
@@ -510,9 +549,9 @@
510 549
511 550 { /* You can apply "locked" class to lock any of the following list items. */ }
512 551
513 552 <a
514 - href={ visualizerLocalize.adminPage }
553 + onClick={ this.createChart }
515 554 target="_blank"
516 555 className="visualizer-settings__content-option"
517 556 >
518 557