Skip to content

Commit 291d07f

Browse files
contactashish13contactashish13
committed
Merge branch 'development' of https://github.com/codeinwp/visualizer into issue-688
2 parents 5cf6d21 + 843e95b commit 291d07f

File tree

14 files changed

+455
-236
lines changed

14 files changed

+455
-236
lines changed

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

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

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

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,7 @@ class FrontendActions extends Component {
3131
render() {
3232

3333
const settings = this.props.chart['visualizer-settings'];
34+
const type = this.props.chart['visualizer-chart-type'];
3435

3536
return (
3637
<PanelBody
@@ -111,6 +112,25 @@ class FrontendActions extends Component {
111112
} }
112113
/>
113114

115+
{ ( -1 >= [ 'dataTable', 'tabular', 'gauge', 'table' ].indexOf( type ) ) && (
116+
<CheckboxControl
117+
label={ __( 'Download Image' ) }
118+
help={ __( 'To download the chart as an image.' ) }
119+
checked={ ( 0 <= settings.actions.indexOf( 'image' ) ) }
120+
onChange={ e => {
121+
if ( 0 <= settings.actions.indexOf( 'image' ) ) {
122+
const index = settings.actions.indexOf( 'image' );
123+
if ( -1 !== index ) {
124+
settings.actions.splice( index, 1 );
125+
}
126+
} else {
127+
settings.actions.push( 'image' );
128+
}
129+
this.props.edit( settings );
130+
} }
131+
/>
132+
) }
133+
114134
</Fragment>
115135

116136
) }

‎classes/Visualizer/Module/Frontend.php

Lines changed: 48 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -120,15 +120,40 @@ function endpoint_register() {
120120
* @access private
121121
*/
122122
private function get_actions() {
123-
return apply_filters(
123+
$actions = apply_filters(
124124
'visualizer_action_buttons',
125125
array(
126-
'print' => __( 'Print', 'visualizer' ),
127-
'csv' => __( 'CSV', 'visualizer' ),
128-
'xls' => __( 'Excel', 'visualizer' ),
129-
'copy' => __( 'Copy', 'visualizer' ),
126+
'print' => array(
127+
'label' => esc_html__( 'Print', 'visualizer' ),
128+
'title' => esc_html__( 'Print Chart', 'visualizer' ),
129+
),
130+
'csv' => array(
131+
'label' => esc_html__( 'CSV', 'visualizer' ),
132+
'title' => esc_html__( 'Download as a CSV', 'visualizer' ),
133+
),
134+
'xls' => array(
135+
'label' => esc_html__( 'Excel', 'visualizer' ),
136+
'title' => esc_html__( 'Download as a spreadsheet', 'visualizer' ),
137+
),
138+
'copy' => array(
139+
'label' => esc_html__( 'Copy', 'visualizer' ),
140+
'title' => esc_html__( 'Copy data', 'visualizer' ),
141+
),
142+
'image' => array(
143+
'label' => esc_html__( 'Download', 'visualizer' ),
144+
'title' => esc_html__( 'Download as an image', 'visualizer' ),
145+
),
130146
)
131147
);
148+
149+
// backward compatibility before label and title attributes were introduced.
150+
if ( isset( $actions['edit'] ) && is_string( $actions['edit'] ) ) {
151+
$actions['edit'] = array(
152+
'label' => esc_html__( 'Edit', 'visualizer' ),
153+
'title' => esc_html__( 'Edit data', 'visualizer' ),
154+
);
155+
}
156+
return $actions;
132157
}
133158

134159
/**
@@ -161,6 +186,21 @@ public function perform_action( WP_REST_Request $params ) {
161186
case 'xls':
162187
$data = $this->_getDataAs( $chart_id, 'xls' );
163188
break;
189+
case 'image':
190+
$settings = get_post_meta( $chart_id, Visualizer_Plugin::CF_SETTINGS, true );
191+
$title = 'visualizer#' . $chart_id;
192+
if ( ! empty( $settings['title'] ) ) {
193+
$title = $settings['title'];
194+
}
195+
// for ChartJS, title is an array.
196+
if ( is_array( $title ) && isset( $title['text'] ) ) {
197+
$title = $title['text'];
198+
}
199+
if ( empty( $title ) ) {
200+
$title = 'visualizer#' . $chart_id;
201+
}
202+
$data = array( 'name' => $title );
203+
break;
164204
default:
165205
$data = apply_filters( 'visualizer_action_data', $data, $chart_id, $type, $params, $this );
166206
break;
@@ -296,8 +336,9 @@ public function renderChart( $atts ) {
296336
$key = $array[0];
297337
$mime = end( $array );
298338
}
299-
$label = $actions[ $key ];
300-
$actions_div .= '<a href="#" class="visualizer-action visualizer-action-' . $key . '" data-visualizer-type="' . $key . '" data-visualizer-chart-id="' . $atts['id'] . '" data-visualizer-container-id="' . $id . '" data-visualizer-mime="' . $mime . '" title="' . $label . '" ';
339+
$label = $actions[ $key ]['label'];
340+
$title = $actions[ $key ]['title'];
341+
$actions_div .= sprintf( '<a href="#" class="visualizer-action visualizer-action-%s" data-visualizer-type="%s" data-visualizer-chart-id="%s" data-visualizer-container-id="%s" data-visualizer-mime="%s" title="%s"', $key, $key, $atts['id'], $id, $mime, $title );
301342

302343
if ( 'copy' === $key ) {
303344
$copy = $this->_getDataAs( $atts['id'], 'csv' );

‎classes/Visualizer/Render.php

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -171,4 +171,50 @@ protected function is_request_from_gutenberg() {
171171
return false;
172172
}
173173

174+
/**
175+
* Gets the type of chart that is being rendered.
176+
*
177+
* This is useful if some type-specific functionality needs to be added.
178+
*
179+
* @since ?
180+
*
181+
* @access protected
182+
* @return string
183+
*/
184+
protected function get_chart_type( $with_library = false ) {
185+
$lib_type = str_replace( 'Visualizer_Render_Sidebar_Type_', '', get_class( $this ) );
186+
if ( $with_library ) {
187+
return $lib_type;
188+
}
189+
190+
$array = explode( '_', $lib_type );
191+
return end( $array );
192+
}
193+
194+
/**
195+
* Determines if the type of chart can have a particular action.
196+
*
197+
* @since ?
198+
*
199+
* @access protected
200+
* @return bool
201+
*/
202+
protected function can_chart_have_action( $action, $chart_id = null ) {
203+
$type = null;
204+
if ( ! $chart_id ) {
205+
$type = $this->get_chart_type( false );
206+
} else {
207+
$type = get_post_meta( $chart_id, Visualizer_Plugin::CF_CHART_TYPE, true );
208+
$type = ucwords( $type );
209+
}
210+
211+
switch ( $action ) {
212+
case 'image':
213+
return ! in_array( $type, array( 'Gauge', 'Tabular', 'DataTable', 'Table' ), true );
214+
}
215+
216+
return true;
217+
}
218+
219+
174220
}

‎classes/Visualizer/Render/Library.php

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -336,6 +336,9 @@ private function _renderChartBox( $placeholder_id, $chart_id ) {
336336
echo '<a class="visualizer-chart-action visualizer-chart-clone" href="', $clone_url, '" title="', esc_attr__( 'Clone', 'visualizer' ), '"></a>';
337337
echo '<a class="visualizer-chart-action visualizer-chart-edit" href="javascript:;" title="', esc_attr__( 'Edit', 'visualizer' ), '" data-chart="', $chart_id, '"></a>';
338338
echo '<a class="visualizer-chart-action visualizer-chart-export" href="javascript:;" title="', esc_attr__( 'Export', 'visualizer' ), '" data-chart="', $export_link, '"></a>';
339+
if ( $this->can_chart_have_action( 'image', $chart_id ) ) {
340+
echo '<a class="visualizer-chart-action visualizer-chart-image" href="javascript:;" title="', esc_attr__( 'Download as image', 'visualizer' ), '" data-chart="visualizer-', $chart_id, '" data-chart-title="', $title, '"></a>';
341+
}
339342
echo '<span class="visualizer-chart-shortcode" title="', esc_attr__( 'Click to select', 'visualizer' ), '">';
340343
echo '&nbsp;[visualizer id=&quot;', $chart_id, '&quot;]&nbsp;';
341344
echo '</span>';

‎classes/Visualizer/Render/Sidebar.php

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -260,6 +260,17 @@ protected function _renderActionSettings() {
260260
$disable_actions ? '<span class="viz-section-error">' . esc_html__( 'Upgrade to at least WordPress 4.7 to use this.', 'visualizer' ) . '</span>' : esc_html__( 'To enable copying the data to the clipboard.', 'visualizer' ),
261261
$disable_actions
262262
);
263+
264+
// not all charts support downloading as an image.
265+
$disabled = ! $this->can_chart_have_action( 'image' );
266+
self::_renderCheckboxItem(
267+
esc_html__( 'Download Image', 'visualizer' ),
268+
'actions[]',
269+
isset( $this->actions ) && in_array( 'image', $this->actions, true ) ? true : false,
270+
'image',
271+
$disable_actions ? '<span class="viz-section-error">' . esc_html__( 'Upgrade to at least WordPress 4.7 to use this.', 'visualizer' ) . '</span>' : ( $disabled ? '<span class="viz-section-error">' . esc_html__( 'Not supported for this chart type.', 'visualizer' ) . '</span>' : esc_html__( 'To download the chart as an image.', 'visualizer' ) ),
272+
$disable_actions || $disabled
273+
);
263274
self::_renderSectionEnd();
264275
}
265276

‎css/library.css

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -107,6 +107,10 @@
107107
background-position: -46px -64px;
108108
}
109109

110+
.visualizer-chart-image {
111+
background-position: -206px -129px;
112+
}
113+
110114
.visualizer-nochart-clone,
111115
.visualizer-nochart-delete,
112116
.visualizer-nochart-edit {

‎css/upsell.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
margin: 0 0 0 20px;
1010
padding: 0 0 0 70px;
1111
color: #3c3c3c;
12-
background: url(../img/wppr-logo.png) no-repeat left center;
12+
background: url(../images/icon.png) no-repeat left center;
1313
font-family: "Open Sans", sans-serif;
1414
font-size: 2em;
1515
font-weight: 700;

‎js/library.js

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -139,6 +139,11 @@
139139
return false;
140140
});
141141

142+
$(".visualizer-chart-image").on("click", function () {
143+
$('body').trigger('visualizer:action:specificchart', {action: 'image', id: $(this).attr("data-chart"), data: null, dataObj: {name: $(this).attr("data-chart-title")}});
144+
return false;
145+
});
146+
142147
// if vaction=addnew is found as a GET request parameter, show the modal.
143148
if(location.href.indexOf('vaction=addnew') !== -1){
144149
$('.add-new-chart').trigger('click');

‎js/render-chartjs.js

Lines changed: 19 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -406,19 +406,33 @@
406406
});
407407

408408
// front end actions
409+
// 'image' is also called from the library
409410
$('body').on('visualizer:action:specificchart', function(event, v){
411+
var id = v.id;
412+
if(typeof rendered_charts[id] === 'undefined'){
413+
return;
414+
}
415+
var canvas = $('#' + id + ' canvas');
410416
switch(v.action){
411417
case 'print':
412-
var id = v.id;
413-
if(typeof rendered_charts[id] === 'undefined'){
414-
return;
415-
}
416-
var canvas = $('#' + id + ' canvas');
417418
var win = window.open();
418419
win.document.write("<br><img src='" + canvas[0].toDataURL() + "'/>");
419420
win.document.close();
420421
win.onload = function () { win.print(); setTimeout(win.close, 500); };
421422
break;
423+
case 'image':
424+
var img = canvas[0].toDataURL();
425+
if(img !== ''){
426+
var $a = $("<a>"); // jshint ignore:line
427+
$a.attr("href", img);
428+
$("body").append($a);
429+
$a.attr("download", v.dataObj.name);
430+
$a[0].click();
431+
$a.remove();
432+
}else{
433+
console.warn("No image generated");
434+
}
435+
break;
422436
}
423437
});
424438

0 commit comments

Comments
 (0)