← All changes | classes/Visualizer/Gutenberg/src/Components/Sidebar/GeneralSettings.js +27 -17 3.1.2 → 3.4.7 View file →

		@@ -4,9 +4,9 @@
4	4	const { __ } = wp.i18n;
5	5
6	6	const { Component } = wp.element;
7	7
8		-const { ColorPalette } = wp.editor;
	8	+const { ColorPalette } = wp.blockEditor || wp.editor;
9	9
10	10	const {
11	11	BaseControl,
12	12	CheckboxControl,
		@@ -33,8 +33,25 @@
33	33	}
34	34
35	35	tooltipTriggers[2] = { label: __( 'The tooltip will not be displayed' ), value: 'none' };
36	36
	37	+ let positions = [
	38	+ { label: __( 'Left of the chart' ), value: 'left' },
	39	+ { label: __( 'Right of the chart' ), value: 'right' },
	40	+ { label: __( 'Above the chart' ), value: 'top' },
	41	+ { label: __( 'Below the chart' ), value: 'bottom' },
	42	+ { label: __( 'Omit the legend' ), value: 'none' }
	43	+ ];
	44	+
	45	+ if ( 'pie' !== type ) {
	46	+ positions.push({ label: __( 'Inside the chart' ), value: 'in' });
	47	+ }
	48	+
	49	+ let titleHelp = __( 'Text to display above the chart.' );
	50	+ if ( 0 <= [ 'tabular', 'dataTable', 'gauge', 'geo', 'timeline' ].indexOf( type ) ) {
	51	+ titleHelp = __( 'Text to display in the back-end admin area' );
	52	+ }
	53	+
37	54	return (
38	55	<PanelBody
39	56	title={ __( 'General Settings' ) }
40	57	initialOpen={ false }
		@@ -48,9 +65,9 @@
48	65	>
49	66
50	67	<TextControl
51	68	label={ __( 'Chart Title' ) }
52		- help={ __( 'Text to display above the chart.' ) }
	69	+ help={ titleHelp }
53	70	value={ settings.title }
54	71	onChange={ e => {
55	72	settings.title = e;
56	73	this.props.edit( settings );
		@@ -56,9 +73,9 @@
56	73	this.props.edit( settings );
57	74	} }
58	75	/>
59	76
60		- { ( -1 >= [ 'table', 'gauge', 'geo', 'pie', 'timeline' ].indexOf( type ) ) && (
	77	+ { ( -1 >= [ 'tabular', 'dataTable', 'gauge', 'geo', 'pie', 'timeline' ].indexOf( type ) ) && (
61	78	<SelectControl
62	79	label={ __( 'Chart Title Position' ) }
63	80	help={ __( 'Where to place the chart title, compared to the chart area.' ) }
64	81	value={ settings.titlePosition ? settings.titlePosition : 'out' }
		@@ -73,9 +90,9 @@
73	90	} }
74	91	/>
75	92	) }
76	93
77		- { ( -1 >= [ 'table', 'gauge', 'geo', 'timeline' ].indexOf( type ) ) && (
	94	+ { ( -1 >= [ 'tabular', 'dataTable', 'gauge', 'geo', 'timeline' ].indexOf( type ) ) && (
78	95	<BaseControl
79	96	label={ __( 'Chart Title Color' ) }
80	97	>
81	98	<ColorPalette
		@@ -87,9 +104,9 @@
87	104	/>
88	105	</BaseControl>
89	106	) }
90	107
91		- { ( -1 >= [ 'table', 'gauge', 'geo', 'pie', 'timeline' ].indexOf( type ) ) && (
	108	+ { ( -1 >= [ 'tabular', 'dataTable', 'gauge', 'geo', 'pie', 'timeline' ].indexOf( type ) ) && (
92	109	<SelectControl
93	110	label={ __( 'Axes Titles Position' ) }
94	111	help={ __( 'Determines where to place the axis titles, compared to the chart area.' ) }
95	112	value={ settings.axisTitlesPosition ? settings.axisTitlesPosition : 'out' }
		@@ -106,9 +123,9 @@
106	123	) }
107	124
108	125	</PanelBody>
109	126
110		- { ( -1 >= [ 'table', 'gauge', 'geo', 'pie', 'timeline' ].indexOf( type ) ) && (
	127	+ { ( -1 >= [ 'tabular', 'dataTable', 'gauge', 'geo', 'pie', 'timeline' ].indexOf( type ) ) && (
111	128	<PanelBody
112	129	title={ __( 'Font Styles' ) }
113	130	className="visualizer-inner-sections"
114	131	initialOpen={ false }
		@@ -166,9 +183,9 @@
166	183
167	184	</PanelBody>
168	185	) }
169	186
170		- { ( -1 >= [ 'table', 'gauge', 'geo', 'timeline' ].indexOf( type ) ) && (
	187	+ { ( -1 >= [ 'tabular', 'dataTable', 'gauge', 'geo', 'timeline' ].indexOf( type ) ) && (
171	188	<PanelBody
172	189	title={ __( 'Legend' ) }
173	190	className="visualizer-inner-sections"
174	191	initialOpen={ false }
		@@ -177,16 +194,9 @@
177	194	<SelectControl
178	195	label={ __( 'Position' ) }
179	196	help={ __( 'Determines where to place the legend, compared to the chart area.' ) }
180	197	value={ settings.legend.position ? settings.legend.position : 'right' }
181		- options={ [
182		- { label: __( 'Left of the chart' ), value: 'left' },
183		- { label: __( 'Right of the chart' ), value: 'right' },
184		- { label: __( 'Above the chart' ), value: 'top' },
185		- { label: __( 'Below the chart' ), value: 'bottom' },
186		- { label: __( 'Inside the chart' ), value: 'in' },
187		- { label: __( 'Omit the legend' ), value: 'none' }
188		- ] }
	198	+ options={ positions }
189	199	onChange={ e => {
190	200	if ( 'pie' !== type ) {
191	201	let axis = 'left' === e ? 1 : 0;
192	202
		@@ -229,9 +239,9 @@
229	239
230	240	</PanelBody>
231	241	) }
232	242
233		- { ( -1 >= [ 'table', 'gauge', 'geo' ].indexOf( type ) ) && (
	243	+ { ( -1 >= [ 'tabular', 'gauge', 'geo', 'dataTable', 'timeline' ].indexOf( type ) ) && (
234	244	<PanelBody
235	245	title={ __( 'Tooltip' ) }
236	246	className="visualizer-inner-sections"
237	247	initialOpen={ false }
		@@ -281,9 +291,9 @@
281	291
282	292	</PanelBody>
283	293	) }
284	294
285		- { ( -1 >= [ 'table', 'gauge', 'geo', 'pie', 'timeline' ].indexOf( type ) ) && (
	295	+ { ( -1 >= [ 'tabular', 'dataTable', 'gauge', 'geo', 'pie', 'timeline' ].indexOf( type ) ) && (
286	296	<PanelBody
287	297	title={ __( 'Animation' ) }
288	298	className="visualizer-inner-sections"
289	299	initialOpen={ false }