wpDataTables Lite - Version 2.013

Version Description

  • Feature: Removed limitation for number of rows in tables
  • Feature: Added functionality for creating Google charts(Line, Column and Pie)
  • Feature: Added options for customizing Google charts(Line, Column and Pie)
  • Bug fixes and stability improvements.
Download this release

Release Info

Developer wpDataTables
Plugin Icon 128x128 wpDataTables Lite
Version 2.013
Comparing to
See all releases

Code changes from version 2.0.12 to 2.013

Files changed (39) hide show
  1. assets/css/admin/browse.css +2 -1
  2. assets/css/bootstrap/wpdatatables-bootstrap.css +18 -4
  3. assets/css/wpdatatables_admin.css +6 -7
  4. assets/js/gutenberg/wpdatacharts-gutenberg-block.js +156 -0
  5. assets/js/wpdatatables/admin/browse/wdt.browse.js +61 -18
  6. assets/js/wpdatatables/wdt.chartWizard.js +699 -5
  7. assets/js/wpdatatables/wdt.chartsRender.js +37 -0
  8. assets/js/wpdatatables/wdt.chartsRender.min.js +1 -0
  9. assets/js/wpdatatables/wdt.googleCharts.js +229 -0
  10. assets/js/wpdatatables/wdt.googleCharts.min.js +1 -0
  11. config/config.inc.php +1 -3
  12. controllers/wdt_admin.php +5 -3
  13. controllers/wdt_admin_ajax_actions.php +87 -0
  14. controllers/wdt_functions.php +1 -0
  15. license.txt +280 -0
  16. readme.txt +42 -33
  17. source/GutenbergBlock.php +94 -0
  18. source/WpDataChartsGutenbergBlock.php +61 -0
  19. source/WpDataTablesGutenbergBlock.php +11 -89
  20. source/class.sql.php +69 -57
  21. source/class.wdtbrowsechartstable.php +18 -119
  22. source/class.wdttools.php +75 -58
  23. source/class.wpdatachart.php +1102 -0
  24. source/class.wpdatatable.php +311 -181
  25. templates/admin/browse/chart/browse.inc.php +14 -4
  26. templates/admin/browse/chart/duplicate_chart_modal.inc.php +51 -0
  27. templates/admin/chart_wizard/chart_wizard.inc.php +65 -6
  28. templates/admin/chart_wizard/steps/charts_pick/chartjs.inc.php +9 -9
  29. templates/admin/chart_wizard/steps/charts_pick/google_charts.inc.php +28 -28
  30. templates/admin/chart_wizard/steps/charts_pick/highcharts.inc.php +19 -19
  31. templates/admin/chart_wizard/steps/step1.inc.php +8 -3
  32. templates/admin/chart_wizard/steps/step2.inc.php +27 -0
  33. templates/admin/chart_wizard/steps/step3.inc.php +99 -0
  34. templates/admin/chart_wizard/steps/step4.inc.php +546 -0
  35. templates/admin/chart_wizard/steps/step5.inc.php +9 -0
  36. templates/browse_charts.inc.php +0 -34
  37. templates/chart_js_template.inc.php +0 -8
  38. templates/wpdatachart.inc.php +14 -0
  39. wpdatatables.php +10 -11
assets/css/admin/browse.css CHANGED
@@ -104,7 +104,8 @@
104
  color: #cdcdcd
105
  }
106
 
107
- .wdt-datatables-admin-wrap .card.wdt-browse-table table .column-functions a.wdt-duplicate-table:before {
 
108
  font-family: WPDataTablesIcons;
109
  content:"\e900";
110
  font-size: 16px;
104
  color: #cdcdcd
105
  }
106
 
107
+ .wdt-datatables-admin-wrap .card.wdt-browse-table table .column-functions a.wdt-duplicate-table:before,
108
+ .wdt-datatables-admin-wrap .card.wdt-browse-table table .column-functions a.wdt-duplicate-chart:before {
109
  font-family: WPDataTablesIcons;
110
  content:"\e900";
111
  font-size: 16px;
assets/css/bootstrap/wpdatatables-bootstrap.css CHANGED
@@ -1398,6 +1398,21 @@
1398
  text-decoration: none;
1399
  }
1400
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1401
  .wpdt-c a:hover,
1402
  .wpdt-c a:focus {
1403
  color: #0a6ebd;
@@ -8163,7 +8178,7 @@ select.input-group-lg > .input-group-btn > .btn {
8163
  }
8164
 
8165
  .wpdt-c .waves-button,
8166
- .wpdt-c .waves-circle,
8167
  .wpdt-c .wpDataTablesWrapper .waves-button,
8168
  .wpdt-c .wpDataTablesWrapper .waves-circle {
8169
  -webkit-transform: translateZ(0);
@@ -8216,7 +8231,7 @@ select.input-group-lg > .input-group-btn > .btn {
8216
  }
8217
 
8218
  .wpdt-c .waves-circle,
8219
- .wpdt-c .wpDataTablesWrapper .waves-circle{
8220
  text-align: center;
8221
  width: 2.5em;
8222
  height: 2.5em;
@@ -10499,7 +10514,6 @@ select.input-group-lg > .input-group-btn > .btn {
10499
  }
10500
 
10501
 
10502
-
10503
  /*-------------------------
10504
  Picture List
10505
  --------------------------*/
@@ -13009,6 +13023,6 @@ input:focus {
13009
  font-size: 14px;
13010
  }
13011
 
13012
- .wdt-include-bootstrap-block,.wdt-include-bootstrap-back-end-block {
13013
  margin-bottom: 25px;
13014
  }
1398
  text-decoration: none;
1399
  }
1400
 
1401
+ .wpdt-c a.dark {
1402
+ color: #23282d;
1403
+ cursor: pointer;
1404
+ }
1405
+
1406
+ .wpdt-c .card.disabled,
1407
+ .wpdt-c .p-l-0.data-filtering.disabled,
1408
+ .wpdt-c .pull-right.p-r-0.disabled,
1409
+ .wpdt-c #chart-container-tabs .disabled,
1410
+ .wpdt-c .highcharts-charts-type .disabled,
1411
+ .wpdt-c .chartjs-charts-type .disabled {
1412
+ pointer-events: none;
1413
+ opacity: 0.5;
1414
+ }
1415
+
1416
  .wpdt-c a:hover,
1417
  .wpdt-c a:focus {
1418
  color: #0a6ebd;
8178
  }
8179
 
8180
  .wpdt-c .waves-button,
8181
+ .wpdt-c .waves-circle,
8182
  .wpdt-c .wpDataTablesWrapper .waves-button,
8183
  .wpdt-c .wpDataTablesWrapper .waves-circle {
8184
  -webkit-transform: translateZ(0);
8231
  }
8232
 
8233
  .wpdt-c .waves-circle,
8234
+ .wpdt-c .wpDataTablesWrapper .waves-circle {
8235
  text-align: center;
8236
  width: 2.5em;
8237
  height: 2.5em;
10514
  }
10515
 
10516
 
 
10517
  /*-------------------------
10518
  Picture List
10519
  --------------------------*/
13023
  font-size: 14px;
13024
  }
13025
 
13026
+ .wdt-include-bootstrap-block, .wdt-include-bootstrap-back-end-block {
13027
  margin-bottom: 25px;
13028
  }
assets/css/wpdatatables_admin.css CHANGED
@@ -224,8 +224,8 @@
224
  border-radius: 3px;
225
  background: rgb(255,255,255);
226
  background: -moz-linear-gradient(top, rgba(244,244,244,1) 0%, rgba(255,255,255,1) 100%);
227
- background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba255,255,255,1)), color-stop(100%,rgba(244,244,244,1)));
228
- background: -webkit-linear-gradient(top, rgba244,244,244,1) 0%,rgba(255,255,255,1) 100%);
229
  background: -o-linear-gradient(top, rgba(244,244,244,1) 0%,rgba(255,255,255,1) 100%);
230
  background: -ms-linear-gradient(top, rgba(244,244,244,1) 0%,rgba(255,255,255,1) 100%);
231
  background: linear-gradient(to bottom, rgba(244,244,244,1) 0%,rgba(255,255,255,1) 100%);
@@ -544,8 +544,8 @@ div.chart_wizard_breadcrumbs_block:hover {
544
 
545
  div.chart_wizard_breadcrumbs_block.active {
546
  background: -moz-linear-gradient(top, rgba(230,230,230,1) 0%, rgba(250,250,250,1) 100%); /* FF3.6+ */
547
- background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(230,230,230,1)), color-stop(100%,rgba250,250,250,1))); /* Chrome,Safari4+ */
548
- background: -webkit-linear-gradient(top, rgba(230,230,230,1) 0%,rgba250,250,250,1) 100%); /* Chrome10+,Safari5.1+ */
549
  background: -o-linear-gradient(top, rgba(230,230,230,1) 0%,rgba(250,250,250,1) 100%); /* Opera 11.10+ */
550
  background: -ms-linear-gradient(top, rgba(230,230,230,1) 0%,rgba(250,250,250,1) 100%); /* IE10+ */
551
  background: linear-gradient(to bottom, rgba(230,230,230,1) 0%,rgba(250,250,250,1) 100%); /* W3C */
@@ -621,8 +621,8 @@ div.chart_column_picker_container div.chart_column_block:hover {
621
  border-radius: 3px;
622
  background: rgb(255,255,255); /* Old browsers */
623
  background: -moz-linear-gradient(top, rgba(244,244,244,1) 0%, rgba(255,255,255,1) 100%); /* FF3.6+ */
624
- background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba255,255,255,1)), color-stop(100%,rgba(244,244,244,1))); /* Chrome,Safari4+ */
625
- background: -webkit-linear-gradient(top, rgba244,244,244,1) 0%,rgba(255,255,255,1) 100%); /* Chrome10+,Safari5.1+ */
626
  background: -o-linear-gradient(top, rgba(244,244,244,1) 0%,rgba(255,255,255,1) 100%); /* Opera 11.10+ */
627
  background: -ms-linear-gradient(top, rgba(244,244,244,1) 0%,rgba(255,255,255,1) 100%); /* IE10+ */
628
  background: linear-gradient(to bottom, rgba(244,244,244,1) 0%,rgba(255,255,255,1) 100%); /* W3C */
@@ -699,7 +699,6 @@ div.wpDataTables div.max_columns_error {
699
  border-radius: 3px;
700
  border: 1px solid #dda;
701
  font-weight: bold;
702
- font: 400 20px/1;
703
  text-align: center;
704
  }
705
 
224
  border-radius: 3px;
225
  background: rgb(255,255,255);
226
  background: -moz-linear-gradient(top, rgba(244,244,244,1) 0%, rgba(255,255,255,1) 100%);
227
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(244,244,244,1)));
228
+ background: -webkit-linear-gradient(top, rgba(244,244,244,1) 0%,rgba(255,255,255,1) 100%);
229
  background: -o-linear-gradient(top, rgba(244,244,244,1) 0%,rgba(255,255,255,1) 100%);
230
  background: -ms-linear-gradient(top, rgba(244,244,244,1) 0%,rgba(255,255,255,1) 100%);
231
  background: linear-gradient(to bottom, rgba(244,244,244,1) 0%,rgba(255,255,255,1) 100%);
544
 
545
  div.chart_wizard_breadcrumbs_block.active {
546
  background: -moz-linear-gradient(top, rgba(230,230,230,1) 0%, rgba(250,250,250,1) 100%); /* FF3.6+ */
547
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(230,230,230,1)), color-stop(100%,rgba(250,250,250,1))); /* Chrome,Safari4+ */
548
+ background: -webkit-linear-gradient(top, rgba(230,230,230,1) 0%,rgba(250,250,250,1) 100%); /* Chrome10+,Safari5.1+ */
549
  background: -o-linear-gradient(top, rgba(230,230,230,1) 0%,rgba(250,250,250,1) 100%); /* Opera 11.10+ */
550
  background: -ms-linear-gradient(top, rgba(230,230,230,1) 0%,rgba(250,250,250,1) 100%); /* IE10+ */
551
  background: linear-gradient(to bottom, rgba(230,230,230,1) 0%,rgba(250,250,250,1) 100%); /* W3C */
621
  border-radius: 3px;
622
  background: rgb(255,255,255); /* Old browsers */
623
  background: -moz-linear-gradient(top, rgba(244,244,244,1) 0%, rgba(255,255,255,1) 100%); /* FF3.6+ */
624
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(244,244,244,1))); /* Chrome,Safari4+ */
625
+ background: -webkit-linear-gradient(top, rgba(244,244,244,1) 0%,rgba(255,255,255,1) 100%); /* Chrome10+,Safari5.1+ */
626
  background: -o-linear-gradient(top, rgba(244,244,244,1) 0%,rgba(255,255,255,1) 100%); /* Opera 11.10+ */
627
  background: -ms-linear-gradient(top, rgba(244,244,244,1) 0%,rgba(255,255,255,1) 100%); /* IE10+ */
628
  background: linear-gradient(to bottom, rgba(244,244,244,1) 0%,rgba(255,255,255,1) 100%); /* W3C */
699
  border-radius: 3px;
700
  border: 1px solid #dda;
701
  font-weight: bold;
 
702
  text-align: center;
703
  }
704
 
assets/js/gutenberg/wpdatacharts-gutenberg-block.js ADDED
@@ -0,0 +1,156 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ (function (wp) {
2
+
3
+ var el = wp.element.createElement;
4
+ var components = wp.components;
5
+ var blockControls = wp.editor.BlockControls;
6
+ var inspectorControls = wp.editor.InspectorControls;
7
+ var allCharts = wpdatacharts.data;
8
+
9
+ var charts = [];
10
+
11
+ if (allCharts !== null) {
12
+ for (var i = 0; i < allCharts.length; i++) {
13
+ charts.push({
14
+ value: allCharts[i].id,
15
+ text: allCharts[i].name + ' (id: ' + allCharts[i].id + ')'
16
+ })
17
+ }
18
+ } else {
19
+ charts = []
20
+ }
21
+
22
+ // Registering the Block for catalog shortcode
23
+ wp.blocks.registerBlockType('wpdatatables/wpdatacharts-gutenberg-block', {
24
+ title: wpdatacharts.title,
25
+ description: wpdatacharts.description,
26
+ icon: el('svg', {width: '45', height: '50', viewBox: '0 0 45 50'},
27
+ el('rect', {
28
+ style: {fill: '#0089FF', x: '0', y: '0', width: '9', height: '50'},
29
+ transform: 'translate(3.000000, 0.000000)',
30
+
31
+ }),
32
+ el('rect', {
33
+ style: {fill: '#56D2FF', x: '12', y: '11', width: '9', height: '39'},
34
+ transform: 'translate(3.000000, 0.000000)',
35
+
36
+ }),
37
+ el('rect', {
38
+ style: {fill: '#00A3FF', x: '24', y: '21', width: '9', height: '29'},
39
+ transform: 'translate(3.000000, 0.000000)',
40
+ }),
41
+ el('rect', {
42
+ style: {fill: '#061972', x: '36', y: '29', width: '9', height: '21'},
43
+ transform: 'translate(3.000000, 0.000000)',
44
+ })
45
+ ),
46
+ category: 'wpdatatables-blocks',
47
+ keywords: [
48
+ 'wpdatacharts',
49
+ 'charts'
50
+ ],
51
+ supports: {
52
+ customClassName: false,
53
+ html: false
54
+ },
55
+ attributes: {
56
+ short_code: {
57
+ type: 'string',
58
+ default: ''
59
+ },
60
+ chartID: {
61
+ type: 'string',
62
+ default: ''
63
+ }
64
+ },
65
+ edit: function (props) {
66
+ var inspectorElements = [];
67
+ var attributes = props.attributes;
68
+ var options = [];
69
+
70
+ options['charts'] = [];
71
+
72
+ function getOptions(data) {
73
+ var options = [];
74
+ data = Object.keys(data).map(function (key) {
75
+ return data[key]
76
+ });
77
+
78
+ data.sort(function (a, b) {
79
+ if (parseInt(a.value) < parseInt(b.value))
80
+ return -1;
81
+ if (parseInt(a.value) > parseInt(b.value))
82
+ return 1;
83
+ return 0
84
+ });
85
+
86
+ data.forEach(function (element) {
87
+ options.push({value: element.value, label: element.text})
88
+ });
89
+
90
+ return options;
91
+ }
92
+
93
+ getOptions(charts)
94
+ .forEach(function (element) {
95
+ options['charts'].push(element);
96
+ });
97
+
98
+ function getShortCode(props, attributes) {
99
+ var short_code = '';
100
+
101
+ if (attributes.chartID !== '') {
102
+ short_code += '[wpdatachart id=' + attributes.chartID + ']'
103
+ } else if (charts.length !== 0) {
104
+ short_code = '[wpdatachart id=' + charts[0].value + ']'
105
+ } else {
106
+ short_code += 'Please create wpdatachart first.';
107
+ }
108
+
109
+ props.setAttributes({short_code: short_code});
110
+
111
+ return short_code
112
+ }
113
+
114
+ if (charts.length !== 0) {
115
+ inspectorElements.push(el(components.SelectControl, {
116
+ id: 'wpdatatables-js-select-chart',
117
+ label: 'Select wpdatachart:',
118
+ value: attributes.chartID,
119
+ options: options.charts,
120
+ onChange: function (selectControl) {
121
+ return props.setAttributes({chartID: selectControl})
122
+ }
123
+ }));
124
+ } else {
125
+ inspectorElements.push(el('p', {style: {'margin-bottom': '1em'}}, 'Please create wpdatachart first. You can check how to do that on link below.'));
126
+ inspectorElements.push(el('a', {
127
+ href: 'https://wpdatatables.com/documentation/wpdatacharts/creating-charts-wordpress-wpdatachart-wizard/',
128
+ target: '_blank',
129
+ style: {'margin-bottom': '1em'}
130
+ }, 'How to create chart in wpdatatables?'));
131
+ }
132
+
133
+ return [
134
+ el(blockControls, {key: 'controls'}),
135
+ el(inspectorControls, {key: 'inspector'},
136
+ el(components.PanelBody, {initialOpen: true},
137
+ inspectorElements
138
+ )
139
+ ),
140
+ el('div', {},
141
+ getShortCode(props, props.attributes)
142
+ )
143
+ ]
144
+ },
145
+
146
+ save: function (props) {
147
+ return (
148
+ el('div', {},
149
+ props.attributes.short_code
150
+ )
151
+ )
152
+ }
153
+ })
154
+ })(
155
+ window.wp
156
+ );
assets/js/wpdatatables/admin/browse/wdt.browse.js CHANGED
@@ -1,12 +1,12 @@
1
  var duplicate_table_id = '';
2
 
3
- (function($) {
4
- $(document).ready(function() {
5
 
6
  /**
7
  * Delete item action alert
8
  */
9
- $('.wdt-submit-delete').click(function(e) {
10
  e.preventDefault();
11
  e.stopImmediatePropagation();
12
 
@@ -19,19 +19,19 @@ var duplicate_table_id = '';
19
  });
20
  });
21
 
22
- /**
23
- * Search tables and charts in backend by enter
24
- */
25
- $("input#search_id-search-input").on("keydown",function (e) {
26
- if(e.keyCode == 13) {
27
- $("button#search-submit").click();
28
- }
29
- });
30
 
31
  /**
32
  * Bulk action alert
33
  */
34
- $('#doaction, #doaction2').click( function(e) {
35
  e.preventDefault();
36
  e.stopImmediatePropagation();
37
 
@@ -55,7 +55,7 @@ var duplicate_table_id = '';
55
  /**
56
  * Display a duplicate table modal
57
  */
58
- $('.wdt-duplicate-table').click(function(e) {
59
  e.preventDefault();
60
  e.stopImmediatePropagation();
61
 
@@ -66,7 +66,7 @@ var duplicate_table_id = '';
66
  $('.wdt-duplicate-manual-table').hide();
67
  }
68
 
69
- $('input.wdt-duplicate-table-name').val($(this).data('table_name')+ '_' + wpdatatablesStrings.copy.toLowerCase());
70
 
71
  $('#wdt-duplicate-table-modal').modal('show');
72
  });
@@ -74,7 +74,7 @@ var duplicate_table_id = '';
74
  /**
75
  * A duplicate table action
76
  */
77
- $(document).on('click','button.duplicate-table-button',function(e) {
78
  e.preventDefault();
79
  e.stopImmediatePropagation();
80
 
@@ -93,7 +93,50 @@ var duplicate_table_id = '';
93
  manual_duplicate_input: manual_duplicate_input,
94
  wdtNonce: wdtNonce
95
  },
96
- success: function() {
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
97
  window.location.reload();
98
  }
99
  });
@@ -105,7 +148,7 @@ var duplicate_table_id = '';
105
  /**
106
  * Highlight a row when checkbox is active
107
  */
108
- $(document).on('click','.wdt-datatables-admin-wrap .card.wdt-browse-table table tbody :checkbox',function() {
109
  var parent_tr = $(this).closest('tr');
110
 
111
  if ($(this).is(':checked')) {
@@ -118,7 +161,7 @@ var duplicate_table_id = '';
118
  /**
119
  * Highlight all rows when the select all checkbox is active
120
  */
121
- $(document).on('click','.wdt-datatables-admin-wrap .card.wdt-browse-table table thead :checkbox, .wdt-datatables-admin-wrap .card.wdt-browse-table table tfoot :checkbox',function() {
122
  var all_tr = $(this).closest('table').find('tbody tr');
123
 
124
  if ($(this).is(':checked')) {
1
  var duplicate_table_id = '';
2
 
3
+ (function ($) {
4
+ $(document).ready(function () {
5
 
6
  /**
7
  * Delete item action alert
8
  */
9
+ $('.wdt-submit-delete').click(function (e) {
10
  e.preventDefault();
11
  e.stopImmediatePropagation();
12
 
19
  });
20
  });
21
 
22
+ /**
23
+ * Search tables and charts in backend by enter
24
+ */
25
+ $("input#search_id-search-input").on("keydown", function (e) {
26
+ if (e.keyCode == 13) {
27
+ $("button#search-submit").click();
28
+ }
29
+ });
30
 
31
  /**
32
  * Bulk action alert
33
  */
34
+ $('#doaction, #doaction2').click(function (e) {
35
  e.preventDefault();
36
  e.stopImmediatePropagation();
37
 
55
  /**
56
  * Display a duplicate table modal
57
  */
58
+ $('.wdt-duplicate-table').click(function (e) {
59
  e.preventDefault();
60
  e.stopImmediatePropagation();
61
 
66
  $('.wdt-duplicate-manual-table').hide();
67
  }
68
 
69
+ $('input.wdt-duplicate-table-name').val($(this).data('table_name') + '_' + wpdatatablesStrings.copy.toLowerCase());
70
 
71
  $('#wdt-duplicate-table-modal').modal('show');
72
  });
74
  /**
75
  * A duplicate table action
76
  */
77
+ $(document).on('click', 'button.duplicate-table-button', function (e) {
78
  e.preventDefault();
79
  e.stopImmediatePropagation();
80
 
93
  manual_duplicate_input: manual_duplicate_input,
94
  wdtNonce: wdtNonce
95
  },
96
+ success: function () {
97
+ window.location.reload();
98
+ }
99
+ });
100
+
101
+ $('#wdt-duplicate-table-modal').modal('hide');
102
+
103
+ });
104
+
105
+ /**
106
+ * Display a duplicate chart modal
107
+ */
108
+ $('.wdt-duplicate-chart').click(function (e) {
109
+ e.preventDefault();
110
+ e.stopImmediatePropagation();
111
+
112
+ duplicate_chart_id = $(this).data('chart_id');
113
+
114
+ $('input.wdt-duplicate-chart-name').val($(this).data('chart_name') + '_' + wpdatatablesStrings.copy.toLowerCase());
115
+
116
+ $('#wdt-duplicate-chart-modal').modal('show');
117
+ });
118
+
119
+ /**
120
+ * A duplicate chart action
121
+ */
122
+ $(document).on('click', 'button.duplicate-chart-button', function (e) {
123
+ e.preventDefault();
124
+ e.stopImmediatePropagation();
125
+
126
+ $('#wdt-preload-layer').show();
127
+ var new_chart_name = $(this).closest('.modal-content').find('input.wdt-duplicate-chart-name').val();
128
+ var wdtNonce = $('#wdt-duplicate-chart-modal #wdtNonce').val();
129
+
130
+ $.ajax({
131
+ url: ajaxurl,
132
+ type: 'POST',
133
+ data: {
134
+ action: 'wpdatatables_duplicate_chart',
135
+ chart_id: duplicate_chart_id,
136
+ new_chart_name: new_chart_name,
137
+ wdtNonce: wdtNonce
138
+ },
139
+ success: function () {
140
  window.location.reload();
141
  }
142
  });
148
  /**
149
  * Highlight a row when checkbox is active
150
  */
151
+ $(document).on('click', '.wdt-datatables-admin-wrap .card.wdt-browse-table table tbody :checkbox', function () {
152
  var parent_tr = $(this).closest('tr');
153
 
154
  if ($(this).is(':checked')) {
161
  /**
162
  * Highlight all rows when the select all checkbox is active
163
  */
164
+ $(document).on('click', '.wdt-datatables-admin-wrap .card.wdt-browse-table table thead :checkbox, .wdt-datatables-admin-wrap .card.wdt-browse-table table tfoot :checkbox', function () {
165
  var all_tr = $(this).closest('table').find('tbody tr');
166
 
167
  if ($(this).is(':checked')) {
assets/js/wpdatatables/wdt.chartWizard.js CHANGED
@@ -15,11 +15,699 @@ var wdtChartColumnsData = {};
15
  $('.wdt-chart-wizard-chart-selecter-block .card').on('click', function () {
16
  $('.wdt-chart-wizard-chart-selecter-block .card').removeClass('selected').addClass('not-selected');
17
  $(this).addClass('selected').removeClass('not-selected');
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
18
 
19
-
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
20
  });
21
 
22
-
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
23
 
24
  /**
25
  * Pick the chart type
@@ -27,23 +715,29 @@ var wdtChartColumnsData = {};
27
  $('#chart-render-engine').change(function (e) {
28
  e.preventDefault();
29
 
30
-
31
-
32
  $('.wdt-chart-wizard-chart-selecter-block .card').removeClass('selected').removeClass('not-selected');
33
  $('div.charts-type').hide();
34
  if ($(this).val() != '') {
35
  constructedChartData.chart_engine = $(this).val();
36
  if ($(this).val() == 'google') {
37
  $('div.google-charts-type').show();
 
 
38
  } else if ($(this).val() == 'highcharts') {
39
  $('div.highcharts-charts-type').show();
 
 
40
  } else if ($(this).val() == 'chartjs') {
41
  $('div.chartjs-charts-type').show();
 
 
42
  }
 
 
 
43
  }
44
  });
45
 
46
-
47
 
48
  })(jQuery);
49
 
15
  $('.wdt-chart-wizard-chart-selecter-block .card').on('click', function () {
16
  $('.wdt-chart-wizard-chart-selecter-block .card').removeClass('selected').addClass('not-selected');
17
  $(this).addClass('selected').removeClass('not-selected');
18
+ if (this.dataset.type == 'google_line_chart' || this.dataset.type == 'google_pie_chart' || this.dataset.type == 'google_column_chart') {
19
+ nextStepButton.prop('disabled', false);
20
+ } else {
21
+ nextStepButton.prop('disabled', true);
22
+ }
23
+ });
24
+
25
+ nextStepButton.click(function (e) {
26
+ e.preventDefault();
27
+
28
+ var curStep = $('div.chart-wizard-step:visible').data('step');
29
+ $('div.chart-wizard-step').hide();
30
+ $('li.chart_wizard_breadcrumbs_block').removeClass('active');
31
+ $('.wdt-preload-layer').animateFadeIn();
32
+
33
+ switch (curStep) {
34
+ case 'step1':
35
+ // Data source
36
+ constructedChartData.chart_type = $('.wdt-chart-wizard-chart-selecter-block .card.selected').data('type');
37
+ constructedChartData.min_columns = parseInt($('.card.selected').data('min_columns'));
38
+ constructedChartData.max_columns = parseInt($('.card.selected').data('max_columns'));
39
+ $('div.chart-wizard-step.step2').show();
40
+ $('li.chart_wizard_breadcrumbs_block.step2').addClass('active');
41
+ constructedChartData.chart_title = $('#chart-name').val();
42
+ constructedChartData.engine = 'google';
43
+ $("#chart-js-container").hide();
44
+ $("#google-chart-container").show();
45
+
46
+ $(".highcharts").hide();
47
+ $(".chartjs").hide();
48
+ $(".google").show();
49
+
50
+ $('#curve-type-row').hide();
51
+ $('#three-d-row').hide();
52
+ $('#background_color_row').show();
53
+ $('#border_width_row').show();
54
+ $('#border_color_row').show();
55
+ $('#border_radius_row').show();
56
+ $('#plot_background_color_row').show();
57
+ $('#plot-border-width-row').show();
58
+ $('#plot_border_color_row').show();
59
+ $('#font-size-row').show();
60
+ $('#font-name-row').show();
61
+ $('.series').show();
62
+ $('.axes').show();
63
+ $('#show-grid-row').show();
64
+ $('#horizontal-axis-crosshair-row').show();
65
+ $('#vertical-axis-crosshair-row').show();
66
+ $('.title').show();
67
+ $('#title-floating-row').show();
68
+ $('.tooltip').show();
69
+ $('.legend').show();
70
+ $('#inverted-row').show();
71
+
72
+ switch (constructedChartData.chart_type) {
73
+ case 'google_column_chart':
74
+ $('#horizontal-axis-crosshair-row').hide();
75
+ $('#vertical-axis-crosshair-row').hide();
76
+ break;
77
+ case 'google_line_chart':
78
+ $('#curve-type-row').show();
79
+ break;
80
+ case 'google_pie_chart':
81
+ $('#plot_background_color_row').hide();
82
+ $('#plot-border-width-row').hide();
83
+ $('#plot_border_color_row').hide();
84
+ $('#three-d-row').show();
85
+ $('.axes').hide();
86
+ $('#title-floating-row').hide();
87
+ $('.series').hide();
88
+ break;
89
+ }
90
+
91
+ $('#wdt-chart-wizard-previous-step').prop('disabled', false);
92
+ $('#wpdatatables-chart-source').change();
93
+ $('.wdt-preload-layer').animateFadeOut();
94
+ break;
95
+ case 'step2':
96
+ // Data range
97
+ applyDragula();
98
+ nextStepButton.prop('disabled', true);
99
+ constructedChartData.wpdatatable_id = $('#wpdatatables-chart-source').val();
100
+ $('div.chart-wizard-step.step3').show();
101
+ $('li.chart_wizard_breadcrumbs_block.step3').addClass('active');
102
+
103
+ $.ajax({
104
+ url: ajaxurl,
105
+ type: 'post',
106
+ dataType: 'json',
107
+ data: {
108
+ action: 'wpdatatables_get_columns_data_by_table_id',
109
+ table_id: constructedChartData.wpdatatable_id,
110
+ wdtNonce: $('#wdtNonce').val(),
111
+ },
112
+ success: function (columns) {
113
+ wdtChartColumnsData = columns;
114
+ var columnChartTemplate = $.templates("#wdt-chart-column-block");
115
+ var columnChartBlockHtml = columnChartTemplate.render({columns: columns});
116
+ $('div.wdt-chart-column-picker-container div.wdt-chart-wizart-existing-columns-container').html(columnChartBlockHtml);
117
+
118
+ if ((typeof constructedChartData.selected_columns !== 'undefined')
119
+ || (typeof editing_chart_data !== 'undefined')) {
120
+ var columns = (typeof editing_chart_data !== 'undefined') ? editing_chart_data.selected_columns : constructedChartData.selected_columns;
121
+ $('div.wdt-chart-column-picker-container div.wdt-chart-wizard-chosen-columns-container .chart-column-block').remove();
122
+ for (var i in columns) {
123
+ $('div.wdt-chart-column-picker-container div.wdt-chart-wizart-existing-columns-container div.chart-column-block[data-orig_header="' + columns[i] + '"]')
124
+ .appendTo('div.wdt-chart-column-picker-container div.wdt-chart-wizard-chosen-columns-container');
125
+ }
126
+ }
127
+ $('#wdt-add-chart-columns').click();
128
+ $('div.alert-warning').show();
129
+ $('.wdt-preload-layer').animateFadeOut();
130
+ }
131
+ });
132
+ break;
133
+ case 'step3':
134
+ // Formatting
135
+ if (typeof constructedChartData.selected_columns == 'undefined') {
136
+ constructedChartData.selected_columns = {};
137
+ }
138
+
139
+ // Move string column on first place
140
+ if ($('div.chosen_columns div.chart-column-block.string,' +
141
+ 'div.chosen_columns div.chart-column-block.date,' +
142
+ 'div.chosen_columns div.chart-column-block.datetime,' +
143
+ 'div.chosen_columns div.chart-column-block.time').length
144
+ && (!$('div.chosen_columns div.chart-column-block:eq(0)').hasClass('float')
145
+ || !$('div.chosen_columns div.chart-column-block:eq(0)').hasClass('int'))) {
146
+ $('div.chosen_columns div.chart-column-block.string,' +
147
+ 'div.chosen_columns div.chart-column-block.date,' +
148
+ 'div.chosen_columns div.chart-column-block.datetime,' +
149
+ 'div.chosen_columns div.chart-column-block.time')
150
+ .eq(0)
151
+ .prependTo('div.wdt-chart-wizard-chosen-columns-container')
152
+ }
153
+
154
+ constructedChartData.selected_columns = {};
155
+ constructedChartData.series_data = {};
156
+ $('div.wdt-chart-wizard-chosen-columns-container div.chart-column-block').each(function () {
157
+ constructedChartData.selected_columns[parseInt($(this).index())] = $(this).data('orig_header');
158
+ });
159
+
160
+ if (typeof editing_chart_data !== 'undefined') {
161
+ if (!_.isEqual(constructedChartData.selected_columns, editing_chart_data.selected_columns)) {
162
+ editing_chart_data.render_data.series = editing_chart_data.render_data.series.filter(function (editColumns) {
163
+ return Object.values(constructedChartData.selected_columns).indexOf(editColumns.orig_header) !== -1;
164
+ });
165
+ }
166
+ }
167
+
168
+
169
+ // Set initial width for preview
170
+ if (constructedChartData.width == null) {
171
+ constructedChartData.width = 400;
172
+ }
173
+
174
+ $('#wdt-chart-row-range-type').change();
175
+
176
+ $('#series-settings-container').empty();
177
+
178
+ getInputData();
179
+
180
+ // Render chart first time in preview
181
+ $.ajax({
182
+ url: ajaxurl,
183
+ data: {
184
+ action: 'wpdatatable_show_chart_from_data',
185
+ chart_data: constructedChartData,
186
+ wdtNonce: $('#wdtNonce').val(),
187
+ },
188
+ dataType: 'json',
189
+ type: 'post',
190
+ success: function (data) {
191
+ $('div.chart-wizard-step.step4').show();
192
+ $('li.chart_wizard_breadcrumbs_block.step4').addClass('active');
193
+
194
+ //Series
195
+ var seriesBlockTemplate = $.templates("#wdt-chart-series-setting-block");
196
+
197
+ if (constructedChartData.engine == 'google') {
198
+ if (typeof editing_chart_data != 'undefined') {
199
+ for (i = 0; i < data.series.length; i++) {
200
+ for (j = 0; j < editing_chart_data.render_data.series.length; j++) {
201
+ if (data.series[i].orig_header === editing_chart_data.render_data.series[j].orig_header) {
202
+ data.series[i].label = data.columns[i + 1].label = editing_chart_data.render_data.series[j].label;
203
+ }
204
+ }
205
+ }
206
+ }
207
+ seriesBlockTemplateHtml = seriesBlockTemplate.render({series: data.series});
208
+
209
+ }
210
+ $('#series-settings-container').html(seriesBlockTemplateHtml);
211
+
212
+ if (constructedChartData.engine == 'google') {
213
+ if (typeof editing_chart_data != 'undefined') {
214
+ for (i in data.series) {
215
+ for (j in editing_chart_data.render_data.series) {
216
+ if (data.series[i].orig_header === editing_chart_data.render_data.series[j].orig_header &&
217
+ typeof (editing_chart_data.render_data.options.series[j]) !== 'undefined') {
218
+ $('#series-settings-container div.chart-series-block:eq(' + i + ')').find('div.chart-series-color input').val(editing_chart_data.render_data.options.series[j].color);
219
+ data.options.series[i] = {
220
+ color: editing_chart_data.render_data.options.series[j].color
221
+ }
222
+ }
223
+ }
224
+ }
225
+ } else {
226
+ for (i in data.series) {
227
+ $('#series-settings-container div.chart-series-block:eq(' + i + ')').find('div.chart-series-color input').val(data.series[i].color);
228
+ }
229
+ }
230
+ }
231
+
232
+ $(".color-picker").each(function () {
233
+ wdtApplyColorPicker(this);
234
+ });
235
+
236
+
237
+ if (constructedChartData.engine == 'google') {
238
+ wdtChart = new wpDataTablesGoogleChart();
239
+ wdtChart.setType(data.type);
240
+ wdtChart.setColumns(data.columns);
241
+ wdtChart.setRows(data.rows);
242
+ wdtChart.setOptions(data.options);
243
+ wdtChart.setContainer('google-chart-container');
244
+ wdtChart.setColumnIndexes(data.column_indexes);
245
+ }
246
+ wdtChart.render();
247
+
248
+ $('.selectpicker').selectpicker('refresh');
249
+
250
+ var eTop = $('.chart-preview-container').offset().top;
251
+ var eWidth = $('.chart-preview-container').width();
252
+
253
+ $(window).scroll(function () {
254
+ if (eTop - $(window).scrollTop() <= 30) {
255
+ $('.chart-preview-container').css('position', 'fixed').css('right', 48).css('top', 30).css('width', eWidth);
256
+ } else {
257
+ eWidth = $('.chart-preview-container').width();
258
+ $('.chart-preview-container').css('position', 'relative').css('right', '').css('top', '').css('width', '');
259
+ }
260
+ });
261
+
262
+ $('#chart-series-color,' +
263
+ '#background-color-container,' +
264
+ '#border-color-container,' +
265
+ '#plot-background-color-container,' +
266
+ '#plot-border-color-container,' +
267
+ '#font-color-container,' +
268
+ '#title-font-color-container input.title-font-color,' +
269
+ '#tooltip-background-color-container,' +
270
+ '#tooltip-border-color-container,' +
271
+ '#legend_background_color,' +
272
+ '#legend_border_color,' +
273
+ '#exporting_button_color_container input.exporting-button-color'
274
+ ).on('changeColor', function (e, ui) {
275
+ renderChart(false);
276
+ });
277
+
278
+ // Render chart on changing chart options
279
+ $('div.step4 input:not(#group-chart), div.step4 select')
280
+ .on('change', function () {
281
+ renderChart(false);
282
+ });
283
+
284
+ $('.wdt-preload-layer').animateFadeOut();
285
+ }
286
+ });
287
+ break;
288
+ case 'step4':
289
+ getInputData();
290
+ // Save and get shortcode
291
+ $.ajax({
292
+ url: ajaxurl,
293
+ data: {
294
+ action: 'wpdatatable_save_chart_get_shortcode',
295
+ chart_data: constructedChartData,
296
+ wdtNonce: $('#wdtNonce').val(),
297
+ },
298
+ type: 'post',
299
+ dataType: 'json',
300
+ success: function (data) {
301
+ $('div.chart-wizard-step.step5').show();
302
+ $('li.chart_wizard_breadcrumbs_block.step5').addClass('active');
303
+ $('#wdt-chart-shortcode-container').html(data.shortcode);
304
+ constructedChartData.chart_id = data.id;
305
+ $('#wp-data-chart-id').val(data.id);
306
+ $('.wdt-preload-layer').animateFadeOut();
307
+ nextStepButton.prop('disabled', true);
308
+ $('#finishButton').show();
309
+ }
310
+ });
311
+ break;
312
+ }
313
+ });
314
+
315
+ function renderChart(reloadNeeded) {
316
+ if (typeof reloadNeeded == 'undefined') {
317
+ reloadNeeded = true;
318
+ }
319
+
320
+ getInputData();
321
+
322
+ if (reloadNeeded) {
323
+ $.ajax({
324
+ url: ajaxurl,
325
+ data: {
326
+ action: 'wpdatatable_show_chart_from_data',
327
+ chart_data: constructedChartData,
328
+ wdtNonce: $('#wdtNonce').val(),
329
+ },
330
+ dataType: 'json',
331
+ type: 'post',
332
+ success: function (data) {
333
+ if (constructedChartData.engine == 'google') {
334
+ wdtChart = new wpDataTablesGoogleChart();
335
+ wdtChart.setType(data.type);
336
+ wdtChart.setColumns(data.columns);
337
+ wdtChart.setRows(data.rows);
338
+ wdtChart.setOptions(data.options);
339
+ wdtChart.setContainer('google-chart-container');
340
+ wdtChart.setColumnIndexes(data.column_indexes);
341
+ }
342
+ wdtChart.render();
343
+ $('.wdt-preload-layer').animateFadeOut();
344
+
345
+ }
346
+ });
347
+ } else {
348
+ wdtChart.setChartConfig(constructedChartData);
349
+ wdtChart.render();
350
+ }
351
+
352
+ }
353
+
354
+ // Get input fields data
355
+ function getInputData() {
356
+ //Chart
357
+ constructedChartData.width = parseInt($('#chart-width').val());
358
+ constructedChartData.height = parseInt($('#chart-height').val());
359
+ constructedChartData.background_color = $('input.background-color').val();
360
+ constructedChartData.border_width = parseInt($('#border-width').val() ? $('#border-width').val() : 0);
361
+ constructedChartData.border_color = $('input.border_color').val();
362
+ constructedChartData.border_radius = parseInt($('#border-radius').val() ? $('#border-radius').val() : 0);
363
+ constructedChartData.plot_background_color = $('input.plot-background-color').val();
364
+ constructedChartData.plot_background_image = $('#plot-background-image').val();
365
+ constructedChartData.plot_border_width = $('#plot-border-width').val();
366
+ constructedChartData.plot_border_color = $('input.plot-border-color').val();
367
+ // Series
368
+ if (typeof constructedChartData.series_data == 'undefined') {
369
+ constructedChartData.series_data = {};
370
+ }
371
+ if (constructedChartData.engine == 'google') {
372
+ $('div.chart-series-block').each(function (e) {
373
+ constructedChartData.series_data[$(this).data('orig_header')] = {
374
+ label: $(this).find('input.series-label').val(),
375
+ color: $(this).find('input.series-color').val()
376
+ }
377
+ });
378
+ }
379
+
380
+ // Axes
381
+ constructedChartData.show_grid = $('#show-grid').is(':checked') ? 1 : 0;
382
+ constructedChartData.horizontal_axis_label = $('#horizontal-axis-label').val();
383
+ constructedChartData.vertical_axis_label = $('#vertical-axis-label').val();
384
+ // Title
385
+ constructedChartData.show_title = $('#show-chart-title').is(':checked') ? 1 : 0;
386
+ constructedChartData.title_floating = $('#title-floating').is(':checked') ? 1 : 0;
387
+ // Legend
388
+ constructedChartData.legend_position = $('#legend_position').val();
389
+ constructedChartData.legend_vertical_align = $('#legend_vertical_align').val();
390
+ }
391
+
392
+ /**
393
+ * Steps switcher (Prev)
394
+ */
395
+ $('#wdt-chart-wizard-previous-step').click(function (e) {
396
+ e.preventDefault();
397
+
398
+ $('.wdt-preload-layer').animateFadeIn();
399
+ var curStep = $('div.chart-wizard-step:visible').data('step');
400
+
401
+ switch (curStep) {
402
+ case 'step2':
403
+ $('#wdt-chart-wizard-previous-step').prop('disabled', true);
404
+ $('div.chart-wizard-step.step1').show();
405
+ $('div.chart-wizard-step.step2').hide();
406
+ $('li.chart_wizard_breadcrumbs_block.step2').removeClass('active');
407
+ $('li.chart_wizard_breadcrumbs_block.step1').addClass('active');
408
+ $('#chart-render-engine').change();
409
+ $('.wdt-preload-layer').animateFadeOut();
410
+ break;
411
+ case 'step3':
412
+ $('div.chart-wizard-step.step2').show();
413
+ $('div.chart-wizard-step.step3').hide();
414
+ $('li.chart_wizard_breadcrumbs_block.step3').removeClass('active');
415
+ $('li.chart_wizard_breadcrumbs_block.step2').addClass('active');
416
+ $('.wdt-preload-layer').animateFadeOut();
417
+ break;
418
+ case 'step4':
419
+ $('div.chart-wizard-step.step3').show();
420
+ $('div.chart-wizard-step.step4').hide();
421
+ $('li.chart_wizard_breadcrumbs_block.step4').removeClass('active');
422
+ $('li.chart_wizard_breadcrumbs_block.step3').addClass('active');
423
+ $('.wdt-preload-layer').animateFadeOut();
424
+ break;
425
+ case 'step5':
426
+ $('div.chart-wizard-step.step4').show();
427
+ $('div.chart-wizard-step.step5').hide();
428
+ $('li.chart_wizard_breadcrumbs_block.step5').removeClass('active');
429
+ $('li.chart_wizard_breadcrumbs_block.step4').addClass('active');
430
+ nextStepButton.prop('disabled', false);
431
+ $('#finishButton').hide();
432
+ $('.wdt-preload-layer').animateFadeOut();
433
+ break;
434
+ }
435
+ });
436
+
437
+ /**
438
+ * Open chart browser on finish
439
+ */
440
+ $('#finishButton').click(function (e) {
441
+ e.preventDefault();
442
+ window.location = $('#wdt-browse-charts-url').val();
443
+ });
444
+
445
+
446
+ /**
447
+ * Pick the data type
448
+ */
449
+ $('#wpdatatables-chart-source').change(function (e) {
450
+ e.preventDefault();
451
+ if ($(this).val() == '') {
452
+ nextStepButton.prop('disabled', true);
453
+ } else {
454
+ nextStepButton.prop('disabled', false);
455
+ }
456
+ });
457
+
458
 
459
+ /**
460
+ * Select all columns in the column selecter
461
+ */
462
+ $('button.select-all-columns, button.deselect-all-columns').click(function (e) {
463
+ e.preventDefault();
464
+ e.stopImmediatePropagation();
465
+ if ($(this).hasClass('select-all-columns')) {
466
+ $(this).closest('.card').find('div.chart-column-block').addClass('selected');
467
+ $(this).text('Deselect All');
468
+ } else {
469
+ $(this).closest('.card').find('div.chart-column-block').removeClass('selected');
470
+ $(this).text('Select All');
471
+ }
472
+ $(this).toggleClass('select-all-columns deselect-all-columns');
473
+
474
+ });
475
+
476
+ /**
477
+ * Select a column in chart row range picker
478
+ */
479
+ $(document).on('click', 'div.wdt-chart-column-picker-container div.chart-column-block', function (e) {
480
+ e.preventDefault();
481
+ e.stopImmediatePropagation();
482
+ if ($(this).hasClass('selected')) {
483
+ $(this).removeClass('selected');
484
+ } else {
485
+ $(this).addClass('selected');
486
+ }
487
+ });
488
+
489
+ /**
490
+ * Check for limit of string columns
491
+ */
492
+ function checkColumnsLimit() {
493
+ // 1 - Checking for string columns
494
+ var string_columns = 0;
495
+ var valid = true;
496
+ $('div.wdt-chart-wizard-chosen-columns-container div.chart-column-block').each(function () {
497
+ if (
498
+ $(this).hasClass('string')
499
+ || $(this).hasClass('link')
500
+ || $(this).hasClass('email')
501
+ || $(this).hasClass('image')
502
+ || $(this).hasClass('date')
503
+ || $(this).hasClass('datetime')
504
+ || $(this).hasClass('time')
505
+ ) {
506
+ string_columns++;
507
+ }
508
+ });
509
+ if (string_columns > 1) {
510
+ $('div.chosen_columns div.strings-error').show();
511
+ valid = false;
512
+ } else {
513
+ $('div.chosen_columns div.strings-error').hide();
514
+ }
515
+ // 2 - Checking for min and max columns limit
516
+ var totalColumnCount = $('div.wdt-chart-wizard-chosen-columns-container div.chart-column-block').length;
517
+ if (totalColumnCount < constructedChartData.min_columns) {
518
+ $('div.chosen_columns div.min-columns-error').show();
519
+ $('div.chosen_columns div.min-columns-error span.columns').html(constructedChartData.min_columns);
520
+ valid = false;
521
+ } else {
522
+ $('div.chosen_columns div.min-columns-error').hide();
523
+ }
524
+ if ((constructedChartData.max_columns > 0)
525
+ && (totalColumnCount > constructedChartData.max_columns)) {
526
+ $('div.chosen_columns div.max-columns-error').show();
527
+ $('div.chosen_columns div.max-columns-error span.columns').html(constructedChartData.max_columns);
528
+ valid = false;
529
+ } else {
530
+ $('div.chosen_columns div.max-columns-error').hide();
531
+ }
532
+ if (!valid) {
533
+ nextStepButton.prop('disabled', true);
534
+ } else {
535
+ nextStepButton.prop('disabled', false);
536
+ }
537
+ }
538
+
539
+ /**
540
+ * Add columns to chart
541
+ */
542
+ $('#wdt-add-chart-columns').click(function (e) {
543
+ e.preventDefault();
544
+ e.stopImmediatePropagation();
545
+ $('div.wdt-chart-column-picker-container div.wdt-chart-wizart-existing-columns-container div.chart-column-block.selected').each(function () {
546
+ $(this).appendTo('div.wdt-chart-column-picker-container div.wdt-chart-wizard-chosen-columns-container');
547
+ });
548
+ checkColumnsLimit();
549
+ });
550
+
551
+ /**
552
+ * Add all columns to chart
553
+ */
554
+ $('#wdt-add-all-chart-columns').click(function (e) {
555
+ e.preventDefault();
556
+ e.stopImmediatePropagation();
557
+ $('div.wdt-chart-column-picker-container div.wdt-chart-wizart-existing-columns-container div.chart-column-block').addClass('selected');
558
+ $('#wdt-add-chart-columns').click();
559
+ $('div.wdt-chart-column-picker-container div.wdt-chart-wizard-chosen-columns-container div.chart-column-block').removeClass('selected');
560
+ checkColumnsLimit();
561
+ });
562
+
563
+ /**
564
+ * Remove columns from chart series
565
+ */
566
+ $('#wdt-remove-chart-columns').click(function (e) {
567
+ e.preventDefault();
568
+ e.stopImmediatePropagation();
569
+ $('div.wdt-chart-column-picker-container div.wdt-chart-wizard-chosen-columns-container div.chart-column-block.selected').each(function () {
570
+ $(this).appendTo('div.wdt-chart-column-picker-container div.wdt-chart-wizart-existing-columns-container ');
571
+ });
572
+ checkColumnsLimit();
573
  });
574
 
575
+ /**
576
+ * Remove all columns from chart
577
+ */
578
+ $('#wdt-remove-all-chart-columns').click(function (e) {
579
+ e.preventDefault();
580
+ e.stopImmediatePropagation();
581
+ $('div.wdt-chart-column-picker-container div.wdt-chart-wizard-chosen-columns-container div.chart-column-block').addClass('selected');
582
+ $('#wdt-remove-chart-columns').click();
583
+ $('div.wdt-chart-column-picker-container div.wdt-chart-wizart-existing-columns-container div.chart-column-block').removeClass('selected');
584
+ });
585
+
586
+
587
+ /**
588
+ * Load data for editing existing charts
589
+ */
590
+ $(document).ready(function () {
591
+ if ($('#wp-data-chart-id').val() != '') {
592
+
593
+ $('#chart-render-engine').change();
594
+ constructedChartData.chart_id = $('#wp-data-chart-id').val();
595
+ constructedChartData.chart_title = editing_chart_data.title;
596
+ // General settings
597
+ $('.charts-type').find("[data-type='" + editing_chart_data.type + "']").click();
598
+ $('#wpdatatables-chart-source').val(editing_chart_data.wpdatatable_id);
599
+
600
+ if (editing_chart_data.range_type == 'picked_range') {
601
+ $('#wdt-chart-row-range-type').val('pick_rows').change();
602
+ constructedChartData.range_data = editing_chart_data.row_range;
603
+ $('#range_picked_info span').html(constructedChartData.range_data.length);
604
+ }
605
+
606
+
607
+ // Chart
608
+ if (typeof editing_chart_data.render_data.options.width !== 'undefined') {
609
+ $('#chart-width').val(editing_chart_data.render_data.options.width);
610
+ $('#chart-responsive-width').prop('checked', '');
611
+ }
612
+ $('#chart-height').val(editing_chart_data.render_data.options.height);
613
+
614
+
615
+ // Axes
616
+ if (editing_chart_data.render_data.show_grid == null) {
617
+ $('#show-grid').prop('checked', 'checked');
618
+ } else {
619
+ if (editing_chart_data.render_data.show_grid) {
620
+ $('#show-grid').prop('checked', 'checked');
621
+ } else {
622
+ $('#show-grid').prop('checked', '');
623
+ }
624
+ }
625
+ $('#horizontal-axis-label').val(editing_chart_data.render_data.options.hAxis.title);
626
+ $('#vertical-axis-label').val(editing_chart_data.render_data.options.vAxis.title);
627
+
628
+ // Title
629
+ if (editing_chart_data.render_data.options.title) {
630
+ $('#show-chart-title').prop('checked', 'checked');
631
+ } else {
632
+ $('#show-chart-title').prop('checked', '');
633
+ }
634
+
635
+ if (editing_chart_data.engine == 'google') {
636
+ // Chart
637
+ if (editing_chart_data.render_data.options.backgroundColor == null) {
638
+ $('input.background-color').val('');
639
+ $('#border-width').val('');
640
+ $('input.border_color').val('');
641
+ $('#border-radius').val('');
642
+
643
+ } else {
644
+ if (editing_chart_data.render_data.options.backgroundColor.fill) {
645
+ $('#background-color-container').colorpicker('setValue', editing_chart_data.render_data.options.backgroundColor.fill);
646
+ }
647
+ $('#border-width').val(editing_chart_data.render_data.options.backgroundColor.strokeWidth);
648
+ if (editing_chart_data.render_data.options.backgroundColor.stroke) {
649
+ $('#border-color-container').colorpicker('setValue', editing_chart_data.render_data.options.backgroundColor.stroke);
650
+ }
651
+ $('#border-radius').val(editing_chart_data.render_data.options.backgroundColor.rx);
652
+ }
653
+
654
+ if (editing_chart_data.render_data.options.chartArea == null) {
655
+ $('input.plot-background-color').val('');
656
+ $('#plot-border-width').val('');
657
+ $('input.plot-border-color').val('');
658
+ } else {
659
+ if (editing_chart_data.render_data.options.chartArea.backgroundColor.fill) {
660
+ $('#plot-background-color-container').colorpicker('setValue', editing_chart_data.render_data.options.chartArea.backgroundColor.fill);
661
+ }
662
+ $('#plot-border-width').val(editing_chart_data.render_data.options.chartArea.backgroundColor.strokeWidth);
663
+ if (editing_chart_data.render_data.options.chartArea.backgroundColor.stroke) {
664
+ $('#plot-border-color-container').colorpicker('setValue', editing_chart_data.render_data.options.chartArea.backgroundColor.stroke);
665
+ }
666
+ }
667
+
668
+
669
+ // Title
670
+ if (editing_chart_data.render_data.options.titlePosition == null) {
671
+ $('#title-floating').prop('checked', '');
672
+ } else {
673
+ if (editing_chart_data.render_data.options.titlePosition == 'in') {
674
+ $('#title-floating').prop('checked', 'checked');
675
+ }
676
+ }
677
+
678
+
679
+ // Legend
680
+ if (editing_chart_data.render_data.options.legend == null) {
681
+ $('#legend_position').val('right');
682
+ $('#legend_vertical_align').val("bottom");
683
+ } else {
684
+ $('#legend_position').val(editing_chart_data.render_data.options.legend.position);
685
+ if (editing_chart_data.render_data.options.legend.alignment == 'end') {
686
+ $('#legend_vertical_align').val("bottom");
687
+ } else if (editing_chart_data.render_data.options.legend.alignment == 'center') {
688
+ $('#legend_vertical_align').val("middle");
689
+ } else {
690
+ $('#legend_vertical_align').val("top");
691
+ }
692
+ }
693
+ }
694
+
695
+ }
696
+ });
697
+
698
+ function applyDragula() {
699
+ var drake = dragula([document.querySelector('.wdt-chart-wizart-existing-columns-container'), document.querySelector('.wdt-chart-wizard-chosen-columns-container')], {
700
+ invalid: function (el, target) {
701
+ if (el.classList.contains('alert')) {
702
+ return true;
703
+ }
704
+ }
705
+ });
706
+ drake.on('drop', function () {
707
+ checkColumnsLimit();
708
+ });
709
+ }
710
+
711
 
712
  /**
713
  * Pick the chart type
715
  $('#chart-render-engine').change(function (e) {
716
  e.preventDefault();
717
 
 
 
718
  $('.wdt-chart-wizard-chart-selecter-block .card').removeClass('selected').removeClass('not-selected');
719
  $('div.charts-type').hide();
720
  if ($(this).val() != '') {
721
  constructedChartData.chart_engine = $(this).val();
722
  if ($(this).val() == 'google') {
723
  $('div.google-charts-type').show();
724
+ $('div.alert-info').show();
725
+ $('div.alert-warning').hide();
726
  } else if ($(this).val() == 'highcharts') {
727
  $('div.highcharts-charts-type').show();
728
+ $('div.alert-info').hide();
729
+ $('div.alert-warning').show();
730
  } else if ($(this).val() == 'chartjs') {
731
  $('div.chartjs-charts-type').show();
732
+ $('div.alert-info').hide();
733
+ $('div.alert-warning').show();
734
  }
735
+ } else {
736
+ $('div.alert-info').hide();
737
+ $('div.alert-warning').hide();
738
  }
739
  });
740
 
 
741
 
742
  })(jQuery);
743
 
assets/js/wpdatatables/wdt.chartsRender.js ADDED
@@ -0,0 +1,37 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ (function ($) {
2
+ $(window).on('load', function () {
3
+
4
+ var wdtGoogleCharts = [];
5
+
6
+ if (typeof wpDataCharts !== 'undefined') {
7
+
8
+ for (var chart_id in wpDataCharts) {
9
+
10
+ var wdtChart = new wpDataTablesGoogleChart();
11
+ wdtChart.setType(wpDataCharts[chart_id].render_data.type);
12
+ wdtChart.setColumns(wpDataCharts[chart_id].render_data.columns);
13
+ wdtChart.setRows(wpDataCharts[chart_id].render_data.rows);
14
+ wdtChart.setOptions(wpDataCharts[chart_id].render_data.options);
15
+ wdtChart.setContainer(wpDataCharts[chart_id].container);
16
+ wdtChart.setColumnIndexes(wpDataCharts[chart_id].render_data.column_indexes);
17
+ if (typeof wpDataChartsCallbacks !== 'undefined' && typeof wpDataChartsCallbacks[chart_id] !== 'undefined') {
18
+ wdtChart.setRenderCallback(wpDataChartsCallbacks[chart_id]);
19
+ }
20
+ wdtGoogleCharts.push(wdtChart);
21
+
22
+ }
23
+ }
24
+
25
+ // Setting the callback for rendering Google Charts
26
+ if (wdtGoogleCharts.length) {
27
+ var wdtGoogleRenderCallback = function () {
28
+ for (var i in wdtGoogleCharts) {
29
+ wdtGoogleCharts[i].render();
30
+ }
31
+ }
32
+ google.charts.setOnLoadCallback(wdtGoogleRenderCallback);
33
+ }
34
+
35
+ })
36
+
37
+ })(jQuery);
assets/js/wpdatatables/wdt.chartsRender.min.js ADDED
@@ -0,0 +1 @@
 
1
+ jQuery(window).on("load",function(){var a=[];if("undefined"!=typeof wpDataCharts)for(var t in wpDataCharts){var e=new wpDataTablesGoogleChart;e.setType(wpDataCharts[t].render_data.type),e.setColumns(wpDataCharts[t].render_data.columns),e.setRows(wpDataCharts[t].render_data.rows),e.setOptions(wpDataCharts[t].render_data.options),e.setContainer(wpDataCharts[t].container),e.setColumnIndexes(wpDataCharts[t].render_data.column_indexes),"undefined"!=typeof wpDataChartsCallbacks&&void 0!==wpDataChartsCallbacks[t]&&e.setRenderCallback(wpDataChartsCallbacks[t]),a.push(e)}a.length&&google.charts.setOnLoadCallback(function(){for(var t in a)a[t].render()})});
assets/js/wpdatatables/wdt.googleCharts.js ADDED
@@ -0,0 +1,229 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ google.charts.load('current', {packages: ['corechart', 'bar', 'gauge', 'scatter']});
2
+
3
+ var wpDataTablesGoogleChart = function () {
4
+
5
+ var obj = {
6
+ rows: [],
7
+ columns: [],
8
+ type: 'column',
9
+ containerId: 'google-chart-container',
10
+ columnIndexes: [],
11
+ connectedWPDataTable: null,
12
+ chart: null,
13
+ googleDataTable: null,
14
+ renderCallback: null,
15
+ options: {
16
+ animation: 'none',
17
+ backgroundColor: {
18
+ fill: '#FFFFFF',
19
+ strokeWidth: 0,
20
+ stroke: '#666',
21
+ rx: 0
22
+ },
23
+ chartArea: {
24
+ backgroundColor: {}
25
+
26
+ },
27
+ crosshair: {},
28
+ height: 400,
29
+ legend: {
30
+ position: 'right'
31
+ },
32
+ orientation: 'horizontal',
33
+ titlePosition: 'out',
34
+ tooltip: {
35
+ trigger: 'none'
36
+ },
37
+ vAxis: {
38
+ direction: 1,
39
+ viewWindow: {}
40
+ }
41
+ },
42
+ setRows: function (rows) {
43
+ this.rows = rows;
44
+ },
45
+ enableDateTimeAxis: function () {
46
+ this.options.hAxis.gridlines = {
47
+ count: -1,
48
+ units: {
49
+ days: {format: ['MMM dd']},
50
+ hours: {format: ['HH:mm', 'ha']}
51
+ }
52
+ }
53
+ },
54
+ detectDates: function () {
55
+ for (var i in this.columns) {
56
+ if (this.columns[i].type == 'date' || this.columns[i].type == 'datetime') {
57
+ for (var j in this.rows) {
58
+ var remDate = Date.parse(this.rows[j][i]);
59
+ if (isNaN(remDate)) {
60
+ this.rows[j][i] = new Date();
61
+ } else {
62
+ this.rows[j][i] = new Date(remDate);
63
+ if (this.connectedWPDataTable == null) {
64
+ var timeVal = this.rows[j][i].getTime();
65
+ if (this.columns[i].type == 'datetime') {
66
+ timeVal += this.rows[j][i].getTimezoneOffset() * 60 * 1000;
67
+ }
68
+ this.rows[j][i].setTime(timeVal);
69
+ } else {
70
+ this.rows[j][i].setTime(this.rows[j][i].getTime());
71
+ }
72
+ }
73
+ if (this.columns[i].type == 'datetime') {
74
+ this.enableDateTimeAxis();
75
+ }
76
+ }
77
+ }
78
+ }
79
+ },
80
+ setColumns: function (columns) {
81
+ this.columns = columns;
82
+ },
83
+ getColumns: function () {
84
+ return this.columns;
85
+ },
86
+ setOptions: function (options) {
87
+ for (var i in options) {
88
+ if (i == 'responsive_width' && options[i] == '1') {
89
+ obj.options.animation = false;
90
+ jQuery(window).resize(function () {
91
+ obj.chart.draw(obj.googleDataTable, obj.options);
92
+ });
93
+ continue;
94
+ }
95
+ this.options[i] = options[i];
96
+ }
97
+ },
98
+ getOptions: function () {
99
+ return this.options;
100
+ },
101
+ setType: function (type) {
102
+ this.type = type;
103
+ },
104
+ getType: function () {
105
+ return this.type;
106
+ },
107
+ setContainer: function (containerId) {
108
+ this.containerId = containerId;
109
+ },
110
+ getContainer: function () {
111
+ return this.containerId;
112
+ },
113
+ setRenderCallback: function (callback) {
114
+ this.renderCallback = callback;
115
+ },
116
+ render: function () {
117
+ this.googleDataTable = new google.visualization.DataTable();
118
+ for (var i in this.columns) {
119
+ this.googleDataTable.addColumn(this.columns[i]);
120
+ }
121
+ this.detectDates();
122
+
123
+ this.googleDataTable.addRows(this.rows);
124
+ switch (this.type) {
125
+ case 'google_column_chart':
126
+ this.chart = new google.visualization.ColumnChart(document.getElementById(this.containerId));
127
+ break;
128
+ case 'google_line_chart':
129
+ this.chart = new google.visualization.LineChart(document.getElementById(this.containerId));
130
+ break;
131
+ case 'google_pie_chart':
132
+ this.chart = new google.visualization.PieChart(document.getElementById(this.containerId));
133
+ break;
134
+ }
135
+ if (this.renderCallback !== null) {
136
+ this.renderCallback(this);
137
+ }
138
+ this.chart.draw(this.googleDataTable, this.options);
139
+ },
140
+ refresh: function () {
141
+ if (typeof google.visualization.DataTable !== 'undefined' && this.chart != null) {
142
+ this.googleDataTable = new google.visualization.DataTable();
143
+ for (var i in this.columns) {
144
+ this.googleDataTable.addColumn(this.columns[i]);
145
+ }
146
+ this.detectDates();
147
+ this.googleDataTable.addRows(this.rows);
148
+ if (this.renderCallback !== null) {
149
+ this.renderCallback(this);
150
+ }
151
+ this.chart.draw(this.googleDataTable, this.options);
152
+ }
153
+ },
154
+
155
+ setChartConfig: function (chartConfig) {
156
+ // Chart
157
+ if (chartConfig.responsive_width == 1) {
158
+ this.options.animation = false;
159
+ delete this.options.width;
160
+ jQuery(window).resize(function () {
161
+ obj.chart.draw(obj.googleDataTable, obj.options);
162
+ });
163
+ } else {
164