Skip to content

Commit 67d1d4d

Browse files
contactashish13contactashish13
committed
Merge branch 'development' of https://github.com/codeinwp/visualizer into issue-524
2 parents e8596ed + 00621a5 commit 67d1d4d

File tree

12 files changed

+189
-27
lines changed

12 files changed

+189
-27
lines changed

‎bin/wp-init.sh

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -45,4 +45,3 @@ docker exec $args visualizer_wordpress wp --allow-root config set TI_CYPRESS_TES
4545
docker exec $args visualizer_wordpress wp --allow-root config set WP_DEBUG true --raw
4646
docker exec $args visualizer_wordpress wp --allow-root config set WP_DEBUG_LOG true --raw
4747
docker exec $args visualizer_wordpress wp --allow-root config set WP_DEBUG_DISPLAY false --raw
48-

‎classes/Visualizer/Gutenberg/build/block.js

Lines changed: 6 additions & 6 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎classes/Visualizer/Gutenberg/src/Components/ChartSelect.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -116,6 +116,7 @@ class ChartSelect extends Component {
116116

117117
<PanelButton
118118
label={ __( 'Advanced Options' ) }
119+
className="visualizer-advanced-options"
119120
icon="admin-tools"
120121
onClick={ () => this.setState({ route: 'showAdvanced' }) }
121122
/>

‎classes/Visualizer/Gutenberg/src/Components/Sidebar.js

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@ import RowCellSettings from './Sidebar/RowCellSettings.js';
2020
import ComboSettings from './Sidebar/ComboSettings.js';
2121
import SeriesSettings from './Sidebar/SeriesSettings.js';
2222
import SlicesSettings from './Sidebar/SlicesSettings.js';
23+
import BubbleSettings from './Sidebar/BubbleSettings.js';
2324
import ColumnSettings from './Sidebar/ColumnSettings.js';
2425
import LayoutAndChartArea from './Sidebar/LayoutAndChartArea.js';
2526
import FrontendActions from './Sidebar/FrontendActions.js';
@@ -114,10 +115,15 @@ class Sidebar extends Component {
114115
<ComboSettings chart={ this.props.chart } edit={ this.props.edit } />
115116
) }
116117

117-
{ ( -1 >= [ 'timeline', 'gauge', 'geo', 'pie' ].indexOf( type ) ) && ( 'DataTable' !== library ) && (
118+
{ ( -1 >= [ 'timeline', 'bubble', 'gauge', 'geo', 'pie', 'dataTable' ].indexOf( type ) ) && (
118119
<SeriesSettings chart={ this.props.chart } edit={ this.props.edit } />
119120
) }
120121

122+
{ ( 0 <= [ 'bubble' ].indexOf( type ) ) && (
123+
<BubbleSettings chart={ this.props.chart } edit={ this.props.edit } />
124+
) }
125+
126+
121127
{ ( 0 <= [ 'pie' ].indexOf( type ) ) && (
122128
<SlicesSettings chart={ this.props.chart } edit={ this.props.edit } />
123129
) }

‎classes/Visualizer/Gutenberg/src/Components/Sidebar/BubbleSettings.js

Lines changed: 116 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,116 @@
1+
/**
2+
* WordPress dependencies
3+
*/
4+
const { __ } = wp.i18n;
5+
6+
const { Component } = wp.element;
7+
8+
const { ColorPalette } = wp.blockEditor || wp.editor;
9+
10+
import { isChecked } from '../../utils.js';
11+
12+
const {
13+
CheckboxControl,
14+
BaseControl,
15+
PanelBody,
16+
TextControl
17+
} = wp.components;
18+
19+
class BubbleSettings extends Component {
20+
constructor() {
21+
super( ...arguments );
22+
}
23+
24+
componentDidMount() {
25+
26+
}
27+
28+
render() {
29+
30+
const settings = this.props.chart['visualizer-settings'];
31+
32+
return (
33+
<PanelBody
34+
title={ __( 'Bubble Settings' ) }
35+
initialOpen={ false }
36+
className="visualizer-advanced-panel"
37+
>
38+
39+
<TextControl
40+
label={ __( 'Opacity' ) }
41+
help={ __( 'The default opacity of the bubbles, where 0.0 is fully transparent and 1.0 is fully opaque.' ) }
42+
type="number"
43+
min="0"
44+
max="1"
45+
step="0.1"
46+
value={ settings.bubble.opacity }
47+
onChange={ e => {
48+
if ( ! settings.bubble ) {
49+
settings.bubble = {};
50+
}
51+
settings.bubble.opacity = e;
52+
this.props.edit( settings );
53+
} }
54+
/>
55+
56+
<BaseControl
57+
label={ __( 'Stroke Color' ) }
58+
>
59+
<ColorPalette
60+
value={ settings.bubble.stroke }
61+
onChange={ e => {
62+
if ( ! settings.bubble ) {
63+
settings.bubble = {};
64+
}
65+
settings.bubble.stroke = e;
66+
this.props.edit( settings );
67+
} }
68+
/>
69+
</BaseControl>
70+
71+
<CheckboxControl
72+
label={ __( 'Sort Bubbles by Size' ) }
73+
help={ __( 'If checked, sorts the bubbles by size so the smaller bubbles appear above the larger bubbles. If unchecked, bubbles are sorted according to their order in the table.' ) }
74+
checked={ isChecked( settings, 'sortBubblesBySize' ) }
75+
onChange={ e => {
76+
settings.sortBubblesBySize = e;
77+
this.props.edit( settings );
78+
} }
79+
/>
80+
81+
<TextControl
82+
label={ __( 'Size (max)' ) }
83+
help={ __( 'The size value (as appears in the chart data) to be mapped to sizeAxis.maxSize. Larger values will be cropped to this value.' ) }
84+
type="number"
85+
step="1"
86+
value={ settings.sizeAxis.maxValue }
87+
onChange={ e => {
88+
if ( ! settings.sizeAxis ) {
89+
settings.sizeAxis = {};
90+
}
91+
settings.sizeAxis.maxValue = e;
92+
this.props.edit( settings );
93+
} }
94+
/>
95+
96+
<TextControl
97+
label={ __( 'Size (min)' ) }
98+
help={ __( 'The size value (as appears in the chart data) to be mapped to sizeAxis.minSize. Smaller values will be cropped to this value.' ) }
99+
type="number"
100+
step="1"
101+
value={ settings.sizeAxis.minValue }
102+
onChange={ e => {
103+
if ( ! settings.sizeAxis ) {
104+
settings.sizeAxis = {};
105+
}
106+
settings.sizeAxis.minValue = e;
107+
this.props.edit( settings );
108+
} }
109+
/>
110+
111+
</PanelBody>
112+
);
113+
}
114+
}
115+
116+
export default BubbleSettings;

‎classes/Visualizer/Gutenberg/src/Components/Sidebar/GeneralSettings.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -230,7 +230,7 @@ class GeneralSettings extends Component {
230230
</PanelBody>
231231
) }
232232

233-
{ ( -1 >= [ 'tabular', 'dataTable', 'gauge', 'geo' ].indexOf( type ) ) && (
233+
{ ( -1 >= [ 'tabular', 'gauge', 'geo', 'dataTable', 'timeline' ].indexOf( type ) ) && (
234234
<PanelBody
235235
title={ __( 'Tooltip' ) }
236236
className="visualizer-inner-sections"

‎classes/Visualizer/Gutenberg/src/Editor.js

Lines changed: 29 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -341,19 +341,30 @@ class Editor extends Component {
341341
if ( 'pie' === type ) {
342342
map = chartData;
343343
fieldName = 'slices';
344-
}
344+
345+
// pie charts are finicky about a number being a number
346+
// and editing a number makes it a string
347+
// so let's convert it back into a number.
348+
chartData.map( ( i, index ) => {
349+
switch ( series[1].type ) {
350+
case 'number':
351+
i[1] = parseFloat( i[1]);
352+
break;
353+
}
354+
});
355+
}
345356

346357
map.map( ( i, index ) => {
347358
if ( 'pie' !== type && 0 === index ) {
348-
return;
359+
return;
349360
}
350361

351362
const seriesIndex = 'pie' !== type ? index - 1 : index;
352363

353364
if ( settings[fieldName][seriesIndex] === undefined ) {
354-
settings[fieldName][seriesIndex] = {};
365+
settings[fieldName][seriesIndex] = {};
355366
settings[fieldName][seriesIndex].temp = 1;
356-
}
367+
}
357368
});
358369

359370
settings[fieldName] = settings[fieldName].filter( ( i, index ) => {
@@ -390,15 +401,18 @@ class Editor extends Component {
390401
fieldName = 'slices';
391402
}
392403

393-
Object.keys( data['visualizer-settings'][fieldName])
394-
.map( i => {
395-
if ( data['visualizer-settings'][fieldName][i] !== undefined ) {
396-
if ( data['visualizer-settings'][fieldName][i].temp !== undefined ) {
397-
delete data['visualizer-settings'][fieldName][i].temp;
398-
}
399-
}
400-
}
401-
);
404+
// no series for bubble and timeline charts.
405+
if ( -1 >= [ 'bubble', 'timeline' ].indexOf( data['visualizer-chart-type']) ) {
406+
Object.keys( data['visualizer-settings'][fieldName])
407+
.map( i => {
408+
if ( data['visualizer-settings'][fieldName][i] !== undefined ) {
409+
if ( data['visualizer-settings'][fieldName][i].temp !== undefined ) {
410+
delete data['visualizer-settings'][fieldName][i].temp;
411+
}
412+
}
413+
}
414+
);
415+
}
402416

403417
apiRequest({ path: `/visualizer/v1/update-chart?id=${ this.props.attributes.id }`, method: 'POST', data: data }).then(
404418
( data ) => {
@@ -557,6 +571,7 @@ class Editor extends Component {
557571
<Button
558572
isDefault
559573
isLarge
574+
className="visualizer-bttn-done"
560575
onClick={ () => {
561576
this.setState({ route: 'renderChart' });
562577
this.props.setAttributes({ route: 'renderChart' });
@@ -567,6 +582,7 @@ class Editor extends Component {
567582
<Button
568583
isPrimary
569584
isLarge
585+
className="visualizer-bttn-save"
570586
isBusy={ 'updateChart' === this.state.isLoading }
571587
disabled={ 'updateChart' === this.state.isLoading }
572588
onClick={ this.updateChart }

‎classes/Visualizer/Gutenberg/src/utils.js

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -98,3 +98,8 @@ export const CSVToArray = ( strData, strDelimiter ) => {
9898

9999
return ( arrData );
100100
};
101+
102+
103+
export const isChecked = ( settings, param ) => {
104+
return true === settings[param] || 'true' === settings[param] || '1' === settings[param] || 1 === settings[param];
105+
};

‎classes/Visualizer/Render/Sidebar/Type/GoogleCharts/Bubble.php

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -81,7 +81,7 @@ protected function _renderBubbleSettings() {
8181
self::_renderColorPickerItem(
8282
esc_html__( 'Stroke Color', 'visualizer' ),
8383
'bubble[stroke]',
84-
isset( $this->bubble[ $index ]['stroke'] ) ? $this->bubble[ $index ]['stroke'] : null,
84+
isset( $this->bubble['stroke'] ) ? $this->bubble['stroke'] : null,
8585
null
8686
);
8787

@@ -90,7 +90,7 @@ protected function _renderBubbleSettings() {
9090
'sortBubblesBySize',
9191
$this->sortBubblesBySize ? 1 : 0,
9292
1,
93-
esc_html__( 'If true, sorts the bubbles by size so the smaller bubbles appear above the larger bubbles. If false, bubbles are sorted according to their order in the DataTable.', 'visualizer' )
93+
esc_html__( 'If checked, sorts the bubbles by size so the smaller bubbles appear above the larger bubbles. If unchecked, bubbles are sorted according to their order in the table.', 'visualizer' )
9494
);
9595

9696
self::_renderTextItem(

‎cypress/integration/free-gutenberg.js

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -39,13 +39,33 @@ describe('Test Free - gutenberg', function() {
3939
cy.get('div[data-type="visualizer/chart"]').should('have.length', (i + 2));
4040

4141
cy.get('div[data-type="visualizer/chart"]:nth-child(' + (i + 1) + ')').then( ($block) => {
42+
// 2 rows - create and insert
4243
cy.wrap($block).find('.visualizer-settings__content-option').should('have.length', 2);
44+
45+
// click insert
4346
cy.wrap($block).find('.visualizer-settings__content-option').last().click({force:true});
4447

48+
// insert chart
4549
cy.wrap($block).find('.visualizer-settings .visualizer-settings__charts-single:nth-child(' + (i + 1) + ') .visualizer-settings__charts-controls').click();
50+
4651
cy.wrap($block).find('.visualizer-settings .visualizer-settings__chart').should('have.length', 1);
52+
53+
// chart and footer divs
4754
cy.wrap($block).find('.visualizer-settings .visualizer-settings__chart > div').should('have.length', 2);
55+
56+
// 2 buttons, one of them "done"
4857
cy.wrap($block).find('.visualizer-settings .components-button-group button').should('have.length', 2);
58+
cy.wrap($block).find('.visualizer-settings .components-button-group button.visualizer-bttn-done').should('have.length', 1);
59+
60+
// click advanced options
61+
cy.get('.visualizer-advanced-options button.components-button').click({force:true});
62+
63+
// done button disappears, save button appears
64+
cy.wrap($block).find('.visualizer-settings .components-button-group button.visualizer-bttn-done').should('have.length', 0);
65+
cy.wrap($block).find('.visualizer-settings .components-button-group button.visualizer-bttn-save').should('have.length', 1);
66+
67+
// click save button
68+
cy.wrap($block).find('.visualizer-settings .components-button-group button.visualizer-bttn-save').click({force:true});
4969
});
5070
});
5171
});

0 commit comments

Comments
 (0)