← All changes | classes/Visualizer/Gutenberg/src/Components/ChartSelect.js +19 -82 3.10.14 → 3.2.0 View file →

		@@ -2,10 +2,8 @@
2	2	* External dependencies
3	3	*/
4	4	import { Chart } from 'react-google-charts';
5	5
6		-import DataTable from './DataTable.js';
7		-
8	6	import FileImport from './Import/FileImport.js';
9	7
10	8	import RemoteImport from './Import/RemoteImport.js';
11	9
		@@ -10,10 +8,8 @@
10	8	import RemoteImport from './Import/RemoteImport.js';
11	9
12	10	import ChartImport from './Import/ChartImport.js';
13	11
14		-import DataImport from './Import/DataImport.js';
15		-
16	12	import ManualData from './Import/ManualData.js';
17	13
18	14	import Sidebar from './Sidebar.js';
19	15
		@@ -22,9 +18,9 @@
22	18	import PanelButton from './PanelButton.js';
23	19
24	20	import merge from 'merge';
25	21
26		-import { compact, formatDate, isValidJSON, formatData, googleChartPackages } from '../utils.js';
	22	+import { compact, formatDate, isValidJSON } from '../utils.js';
27	23
28	24	/**
29	25	* WordPress dependencies
30	26	*/
		@@ -36,9 +32,9 @@
36	32	Component,
37	33	Fragment
38	34	} = wp.element;
39	35
40		-const { InspectorControls } = wp.blockEditor || wp.editor;
	36	+const { InspectorControls } = wp.editor;
41	37
42	38	class ChartSelect extends Component {
43	39	constructor() {
44	40	super( ...arguments );
		@@ -55,32 +51,19 @@
55	51	};
56	52	}
57	53
58	54	render() {
59		- let chartVersion = 'undefined' !== typeof google.visualization ? google.visualization.Version : 'current';
60	55
61		- let chart, footer;
	56	+ let chart;
62	57
63	58	let data = formatDate( JSON.parse( JSON.stringify( this.props.chart ) ) );
64	59
65		- if ( 0 <= [ 'gauge', 'tabular', 'timeline' ].indexOf( this.props.chart['visualizer-chart-type']) ) {
66		- if ( 'DataTable' === data['visualizer-chart-library']) {
67		- chart = data['visualizer-chart-type'];
68		- } else {
69		- chart = this.props.chart['visualizer-chart-type'];
70		- if ( 'tabular' === chart ) {
71		- chart = 'table';
72		- }
73		- chart = startCase( chart );
74		- }
	60	+ if ( 0 <= [ 'gauge', 'table', 'timeline' ].indexOf( this.props.chart['visualizer-chart-type']) ) {
	61	+ chart = startCase( this.props.chart['visualizer-chart-type']);
75	62	} else {
76	63	chart = `${ startCase( this.props.chart['visualizer-chart-type']) }Chart`;
77	64	}
78	65
79		- if ( data['visualizer-data-exploded']) {
80		- footer = __( 'Annotations in this chart may not display here but they will display in the front end.' );
81		- }
82		-
83	66	return (
84	67	<Fragment>
85	68	{ 'home' === this.state.route &&
86	69	<InspectorControls>
		@@ -90,35 +73,21 @@
90	73	readUploadedFile={ this.props.readUploadedFile }
91	74	/>
92	75
93	76	<RemoteImport
94		- id={ this.props.id }
95	77	chart={ this.props.chart }
96	78	editURL={ this.props.editURL }
97	79	isLoading={ this.props.isLoading }
98	80	uploadData={ this.props.uploadData }
99	81	editSchedule={ this.props.editSchedule }
100		- editJSONSchedule={ this.props.editJSONSchedule }
101		- editJSONURL={ this.props.editJSONURL }
102		- editJSONHeaders={ this.props.editJSONHeaders }
103		- editJSONRoot={ this.props.editJSONRoot }
104		- editJSONPaging={ this.props.editJSONPaging }
105		- JSONImportData={ this.props.JSONImportData }
106	82	/>
107	83
108	84	<ChartImport getChartData={ this.props.getChartData } isLoading={ this.props.isLoading } />
109	85
110		- <DataImport
111		- chart={ this.props.chart }
112		- editSchedule={ this.props.editDatabaseSchedule }
113		- databaseImportData={ this.props.databaseImportData }
114		- />
115		-
116	86	<ManualData chart={ this.props.chart } editChartData={ this.props.editChartData } />
117	87
118	88	<PanelButton
119	89	label={ __( 'Advanced Options' ) }
120		- className="visualizer-advanced-options"
121	90	icon="admin-tools"
122	91	onClick={ () => this.setState({ route: 'showAdvanced' }) }
123	92	/>
124	93
		@@ -138,9 +107,9 @@
138	107	isBack={ true }
139	108	/>
140	109
141	110	{ 'showAdvanced' === this.state.route &&
142		- <Sidebar chart={ this.props.chart } attributes={ this.props.attributes } edit={ this.props.editSettings } />
	111	+ <Sidebar chart={ this.props.chart } edit={ this.props.editSettings } />
143	112	}
144	113
145	114	{ 'showPermissions' === this.state.route &&
146	115	<ChartPermissions chart={ this.props.chart } edit={ this.props.editPermissions } />
		@@ -147,55 +116,23 @@
147	116	}
148	117	</InspectorControls>
149	118	}
150	119
151		- <div className="visualizer-settings__chart" data-chart-type={ chart }>
	120	+ <div className="visualizer-settings__chart">
152	121
153	122	{ ( null !== this.props.chart ) &&
154		-
155		- ( 'DataTable' === data['visualizer-chart-library']) ? (
156		- <DataTable
157		- id={ this.props.id }
158		- rows={ data['visualizer-data'] }
159		- columns={ data['visualizer-series'] }
160		- options={ data['visualizer-settings'] }
161		- />
162		- ) : ( '' !== data['visualizer-data-exploded'] ? (
163		- <Chart
164		- chartVersion={ chartVersion }
165		- chartType={ chart }
166		- rows={ data['visualizer-data'] }
167		- columns={ data['visualizer-series'] }
168		- options={
169		- isValidJSON( this.props.chart['visualizer-settings'].manual ) ?
170		- merge( compact( this.props.chart['visualizer-settings']), JSON.parse( this.props.chart['visualizer-settings'].manual ) ) :
171		- compact( this.props.chart['visualizer-settings'])
172		- }
173		- height="500px"
174		- formatters={ formatData( data ) }
175		- chartPackages={ googleChartPackages }
176		- />
177		- ) : (
178		- <Chart
179		- chartVersion={ chartVersion }
180		- chartType={ chart }
181		- rows={ data['visualizer-data'] }
182		- columns={ data['visualizer-series'] }
183		- options={
184		- isValidJSON( this.props.chart['visualizer-settings'].manual ) ?
185		- merge( compact( this.props.chart['visualizer-settings']), JSON.parse( this.props.chart['visualizer-settings'].manual ) ) :
186		- compact( this.props.chart['visualizer-settings'])
187		- }
188		- height="500px"
189		- formatters={ formatData( data ) }
190		- chartPackages={ googleChartPackages }
191		- />
192		- )
193		- ) }
194		-
195		- <div className="visualizer-settings__charts-footer"><sub>
196		- { footer }
197		- </sub></div>
	123	+ <Chart
	124	+ chartType={ chart }
	125	+ rows={ data['visualizer-data'] }
	126	+ columns={ data['visualizer-series'] }
	127	+ options={
	128	+ isValidJSON( this.props.chart['visualizer-settings'].manual ) ?
	129	+ merge( compact( this.props.chart['visualizer-settings']), JSON.parse( this.props.chart['visualizer-settings'].manual ) ) :
	130	+ compact( this.props.chart['visualizer-settings'])
	131	+ }
	132	+ height="500px"
	133	+ />
	134	+ }
198	135
199	136	</div>
200	137	</Fragment>
201	138	);