Changeset 3349519 – WordPress Plugin Repository (original) (raw)
| r3242372 | r3349519 | |
|---|---|---|
| 4 | 4 | Requires at least: 3.0 |
| 5 | 5 | Tested up to: 6.7.2 |
| 6 | Stable tag: 1.2. |
|
| 6 | Stable tag: 1.2.5 | |
| 7 | 7 | License: GPLv2 or later |
| 8 | 8 | License URI: http://www.gnu.org/licenses/gpl-2.0.html |
| … | … | |
| 78 | 78 | == Changelog == |
| 79 | 79 | |
| 80 | = 1.2.5 = | |
| 81 | *Release Date - 25th Aug, 2025* | |
| 82 | ||
| 83 | * Replace handsontable with jspreadsheet js | |
| 84 | ||
| 80 | 85 | = 1.2.4 = |
| 81 | 86 | *Release Date - 18th Feb, 2025* |
| r3081203 | r3349519 | |
|---|---|---|
| 82 | 82 | wp_enqueue_style( this−>pluginname,plugindirurl(FILE).′css/easy−charts−admin.css′,array(),this->plugin_name, plugin_dir_url( __FILE__ ) . 'css/easy-charts-admin.css', array(), this−>pluginname,plugindirurl(FILE).′css/easy−charts−admin.css′,array(),this->version, 'all' ); |
| 83 | 83 | |
| 84 | wp_enqueue_style( 'handsontable-css', plugin_dir_url( __FILE__ ) . 'css/handsontable/handsontable.full.css', array(), $this->version, 'all' ); | |
| 84 | wp_enqueue_style( 'jsuites-css', plugin_dir_url( __FILE__ ) . 'js/jspreadsheet/jsuites.min.css', array(), $this->version, 'all' ); | |
| 85 | ||
| 86 | wp_enqueue_style( 'jspreadsheet-css', plugin_dir_url( __FILE__ ) . 'js/jspreadsheet/jspreadsheet.css', array( 'jsuites-css' ), $this->version, 'all' ); | |
| 85 | 87 | |
| 86 | 88 | wp_enqueue_style( 'jquery-ui-css', plugin_dir_url( __FILE__ ) . 'css/jquery-ui.min.css', array(), $this->version, 'all' ); |
| … | … | |
| 117 | 119 | if ( 'post-new.php' === pagenow∥∣′post.php′===pagenow | |
| 118 | 120 | |
| 119 | wp_enqueue_script( 'easy-charts-admin-js', plugin_dir_url( __FILE__ ) . 'js/easy-charts-admin.js', array( 'jquery' ), $this->version, true ); | |
| 120 | ||
| 121 | wp_enqueue_script( 'handsontable-js', plugin_dir_url( __FILE__ ) . 'js/handsontable/handsontable.full.js', array( 'jquery' ), $this->version, false ); | |
| 121 | wp_enqueue_script( 'easy-charts-admin-js', plugin_dir_url( __FILE__ ) . 'js/easy-charts-admin.js', array( 'jquery', 'jsuites-js', 'jspreadsheet-js' ), $this->version, true ); | |
| 122 | ||
| 123 | wp_enqueue_script( 'jsuites-js', plugin_dir_url( __FILE__ ) . 'js/jspreadsheet/jsuites.min.js', array(), $this->version, false ); | |
| 124 | ||
| 125 | wp_enqueue_script( 'jspreadsheet-js', plugin_dir_url( __FILE__ ) . 'js/jspreadsheet/jspreadsheet.js', array(), $this->version, false ); | |
| 126 | ||
| 122 | 127 | wp_enqueue_script( 'd3-js', plugins_url( 'includes/js/d3.min.js', __DIR__ ), array( 'jquery' ), $this->version, false ); |
| 123 | 128 | |
| … | … | |
| 337 | 342 | return; |
| 338 | 343 | } |
| 339 | } else { | |
| 340 | ||
| 341 | if ( ! current_user_can( 'edit_post', $post_id ) ) { | |
| 344 | } elseif ( ! current_user_can( 'edit_post', $post_id ) ) { | |
| 345 | ||
| 342 | 346 | return; |
| 343 | ||
| 344 | 347 | } |
| 345 | 348 |
| r2908758 | r3349519 | |
|---|---|---|
| 3 | 3 | * included in this file. |
| 4 | 4 | */ |
| 5 | #easy-charts-data-metabox-wrap #easy-data-chart-box .ec-data-container . |
|
| 5 | #easy-charts-data-metabox-wrap #easy-data-chart-box .ec-data-container .jspreadsheet-controls { | |
| 6 | 6 | text-align: center; |
| 7 | 7 | padding: 30px 0; |
| 8 | 8 | border: 1px solid #000; |
| 9 | 9 | } |
| 10 | #easy-charts-data-metabox-wrap #easy-data-chart-box .ec-data-container . |
|
| 10 | #easy-charts-data-metabox-wrap #easy-data-chart-box .ec-data-container .jspreadsheet-controls .button-group { | |
| 11 | 11 | margin: 0 5px; |
| 12 | 12 | } |
| 13 | #easy-charts-data-metabox-wrap #easy-data-chart-box .ec-data-container . |
|
| 13 | #easy-charts-data-metabox-wrap #easy-data-chart-box .ec-data-container .jspreadsheet-controls .button-group button { | |
| 14 | 14 | /*display: block;*/ |
| 15 | 15 | } |
| 16 | #easy-charts-data-metabox-wrap #easy-data-chart-box .ec-data-container . |
|
| 16 | #easy-charts-data-metabox-wrap #easy-data-chart-box .ec-data-container .jspreadsheet-controls .button-group button .dashicons { | |
| 17 | 17 | line-height: 26px; |
| 18 | 18 | height: 28px; |
| r2908758 | r3349519 | |
|---|---|---|
| 7 | 7 | .ec-data-container{ |
| 8 | 8 | |
| 9 | . |
|
| 9 | .jspreadsheet-container{ | |
| 10 | 10 | } |
| 11 | 11 | |
| 12 | . |
|
| 12 | .jspreadsheet-controls{ | |
| 13 | 13 | text-align: center; |
| 14 | 14 | padding: 30px 0; |
| r1944243 | r3349519 | |
|---|---|---|
| 1 | (function($) { | |
| 2 | 'use strict'; | |
| 3 | $('document').ready(function() { | |
| 1 | // phpcs:disable | |
| 4 | 2 | |
| 5 | var data = [ | |
| 6 | ['', 'Kia', 'Nissan', 'Toyota', 'Honda'], | |
| 7 | ['2008', 10, 11, 12, 13], | |
| 8 | ['2009', 20, 11, 14, 13], | |
| 9 | ['2010', 30, 15, 12, 13] | |
| 10 | ]; | |
| 3 | document.addEventListener( 'DOMContentLoaded', function () { | |
| 11 | 4 | |
| 5 | if (typeof(ec_chart_data) != 'undefined') { | |
| 6 | var graphdef = { | |
| 7 | categories: [], | |
| 8 | dataset: {} | |
| 9 | }; | |
| 12 | 10 | |
| 13 | if (typeof(ec_chart) != 'undefined') { | |
| 14 | if (ec_chart.chart_data != null) { | |
| 15 | data = ec_chart.chart_data; | |
| 16 | } | |
| 17 | } | |
| 11 | var chartType = ec_chart_data.chart_type; | |
| 12 | var chartCategories = ec_chart_data.chart_categories; | |
| 13 | var chartDataset = ec_chart_data.chart_data; | |
| 14 | var chartConfiguration = ec_chart_data.chart_configuration; | |
| 18 | 15 | |
| 19 | $('.ec-color-picker').wpColorPicker(); | |
| 20 | $(".ec-field-buttonset").buttonset(); | |
| 16 | graphdef = { | |
| 17 | categories: chartCategories, | |
| 18 | dataset: chartDataset, | |
| 19 | }; | |
| 21 | 20 | |
| 22 | $('.ec-field-slider').each(function(index, el) { | |
| 21 | var chartObject = uv.chart(chartType, graphdef, chartConfiguration); | |
| 22 | } | |
| 23 | 23 | |
| 24 | $(this).slider({ | |
| 25 | range: "max", | |
| 26 | min: 0, | |
| 27 | max: 1, | |
| 28 | value: ((((this).data('attach')).val(), | |
| 29 | step: 0.1, | |
| 30 | slide: function(event, ui) { | |
| 31 | ((((this).data('attach')).val(ui.value); | |
| 32 | } | |
| 33 | }); | |
| 34 | }); | |
| 24 | var jspreadsheetid = document.getElementById("jspreadsheet"); | |
| 25 | var data = [ | |
| 26 | ['', 'Kia', 'Nissan', 'Toyota', 'Honda'], | |
| 27 | ['2008', 10, 11, 12, 13], | |
| 28 | ['2009', 20, 11, 14, 13], | |
| 29 | ['2010', 30, 15, 12, 13] | |
| 30 | ]; | |
| 35 | 31 | |
| 32 | if (typeof(ec_chart) != 'undefined') { | |
| 33 | if (ec_chart.chart_data != null) { | |
| 34 | data = ec_chart.chart_data; | |
| 35 | } | |
| 36 | } | |
| 36 | 37 | |
| 37 | ||
| 38 | tabsPosition: 'vertical', | |
| 39 | ||
| 40 | ||
| 41 | ||
| 42 | effect: 'slidedown' | |
| 43 | }); | |
| 38 | let spreadsheet = jspreadsheet(jspreadsheetid, { | |
| 39 | worksheets: [{ | |
| 40 | data: data, | |
| 41 | }], | |
| 42 | tableOverflow: true, | |
| 43 | tableWidth: "200px", | |
| 44 | }); | |
| 44 | 45 | |
| 45 | function ec_save_chart_data_ajax(table) { | |
| 46 | $.ajax({ | |
| 47 | url: ajaxurl, | |
| 48 | type: 'POST', | |
| 49 | dataType: 'json', | |
| 50 | data: { | |
| 51 | 'action': 'easy_charts_save_chart_data', | |
| 52 | 'chart_id': ec_chart.chart_id, | |
| 53 | '_nonce_check': ec_chart.ec_ajax_nonce, | |
| 54 | 'chart_data': JSON.stringify(table.getData()) | |
| 55 | }, | |
| 56 | }) | |
| 57 | .done(function(updated_data) { | |
| 58 | $('.uv-div-' + ec_chart.chart_id).html(''); | |
| 46 | document.getElementById("ec-button-add-col").onclick = (event) => { event.preventDefault(); spreadsheet[0].insertColumn() }; | |
| 47 | document.getElementById("ec-button-remove-col").onclick = (event) => { event.preventDefault(); spreadsheet[0].deleteColumn() }; | |
| 48 | document.getElementById("ec-button-add-row").onclick = (event) => { event.preventDefault(); spreadsheet[0].insertRow() }; | |
| 49 | document.getElementById("ec-button-remove-row").onclick = (event) => { event.preventDefault(); spreadsheet[0].deleteRow() }; | |
| 59 | 50 | |
| 60 | var graphdef = { | |
| 61 | categories: updated_data.chart_categories, | |
| 62 | dataset: updated_data.chart_data, | |
| 63 | }; | |
| 51 | document.getElementById("ec-button-save-data").addEventListener('click', function (event) { | |
| 52 | event.preventDefault(); | |
| 53 | let data = spreadsheet[0].getData(); | |
| 64 | 54 | |
| 65 | var chartObject = uv.chart(updated_data.chart_type, graphdef, chartConfiguration); | |
| 66 | }) | |
| 67 | .fail(function() {}) | |
| 68 | .always(function() {}); | |
| 69 | } | |
| 55 | if (data.flat().every(cell => cell === "" | | |
| 56 | jQuery("#dialog-confirm").dialog({ | |
| 57 | resizable: false, | |
| 58 | height: 400, | |
| 59 | modal: true, | |
| 60 | buttons: { | |
| 61 | "Ok": function() { | |
| 62 | jQuery(this).dialog("close"); | |
| 63 | } | |
| 64 | } | |
| 65 | }); | |
| 66 | } else { | |
| 67 | // Prepare data to send | |
| 68 | const formData = new FormData(); | |
| 69 | formData.append("action", "easy_charts_save_chart_data"); // Must match the PHP action | |
| 70 | formData.append("chart_id", ec_chart.chart_id); | |
| 71 | formData.append('_nonce_check', ec_chart.ec_ajax_nonce); | |
| 72 | formData.append("chart_data", JSON.stringify(data)); | |
| 70 | 73 | |
| 71 | var container = document.getElementById("handsontable"); | |
| 74 | // Send AJAX request | |
| 75 | fetch(ajaxurl, { | |
| 76 | method: "POST", | |
| 77 | body: formData | |
| 78 | }) | |
| 79 | .then(response => response.json()) | |
| 80 | .then(updated_data => { | |
| 81 | document.querySelector( '.uv-div-' + ec_chart.chart_id ).innerHTML = ''; | |
| 72 | 82 | |
| 73 | if (container != null) { | |
| 83 | var graphdef = { | |
| 84 | categories: updated_data.chart_categories, | |
| 85 | dataset: updated_data.chart_data, | |
| 86 | }; | |
| 74 | 87 | |
| 75 | var hot = new Handsontable(container, { | |
| 76 | data: data, | |
| 77 | stretchH: 'all', | |
| 78 | cell: [{ | |
| 79 | row: 0, | |
| 80 | col: 0, | |
| 81 | readOnly: true | |
| 82 | }], | |
| 83 | fixedRowsTop: 1, | |
| 84 | fixedColumnsTop: 1, | |
| 85 | fixedColumnsLeft: 1, | |
| 86 | rowHeaders: true, | |
| 87 | colHeaders: true, | |
| 88 | manualColumnMove: true, | |
| 89 | manualRowMove: true, | |
| 90 | minSpareRows: 0, | |
| 91 | minSpareCols: 0, | |
| 92 | contextMenu: true, | |
| 93 | autoWrapCol: true, | |
| 94 | autoWrapRow: true, | |
| 95 | afterChange: function(change, source) {}, | |
| 96 | afterColumnMove: function(startColumn, endColumn) {}, | |
| 97 | afterRowMove: function(startColumn, endColumn) {} | |
| 98 | }); | |
| 99 | } | |
| 88 | var chartObject = uv.chart(updated_data.chart_type, graphdef, chartConfiguration); | |
| 89 | }) | |
| 90 | .catch(error => console.error("Error:", error)); | |
| 91 | } | |
| 92 | }); | |
| 100 | 93 | |
| 101 | $('#ec-button-add-col').on('click', function(event) { | |
| 102 | event.preventDefault(); | |
| 103 | hot.alter('insert_col', null); | |
| 104 | }); | |
| 105 | $('#ec-button-remove-col').on('click', function(event) { | |
| 106 | event.preventDefault(); | |
| 107 | hot.alter('remove_col', null); | |
| 108 | }); | |
| 109 | $('#ec-button-add-row').on('click', function(event) { | |
| 110 | event.preventDefault(); | |
| 111 | hot.alter('insert_row', null); | |
| 112 | }); | |
| 113 | $('#ec-button-remove-row').on('click', function(event) { | |
| 114 | event.preventDefault(); | |
| 115 | hot.alter('remove_row', null); | |
| 116 | }); | |
| 94 | // jQuery implementation. | |
| 95 | jQuery('.ec-color-picker').wpColorPicker(); | |
| 96 | jQuery(".ec-field-buttonset").buttonset(); | |
| 97 | jQuery('.ec-field-slider').each(function(index, el) { | |
| 117 | 98 | |
| 118 | $('#ec-button-save-data').on('click', function(event) { | |
| 119 | event.preventDefault(); | |
| 99 | jQuery(this).slider({ | |
| 100 | range: "max", | |
| 101 | min: 0, | |
| 102 | max: 1, | |
| 103 | value: jQuery(jQuery(this).data('attach')).val(), | |
| 104 | step: 0.1, | |
| 105 | slide: function(event, ui) { | |
| 106 | jQuery(jQuery(this).data('attach')).val(ui.value); | |
| 107 | } | |
| 108 | }); | |
| 109 | }); | |
| 120 | 110 | |
| 121 | if (hot.countEmptyCols() == 0 && hot.countEmptyRows() == 0) { | |
| 111 | jQuery('.resp-tabs-container').pwstabs({ | |
| 112 | tabsPosition: 'vertical', | |
| 113 | responsive: false, | |
| 114 | containerWidth: '100%', | |
| 115 | theme: 'pws_theme_orange', | |
| 116 | effect: 'slidedown' | |
| 117 | }); | |
| 122 | 118 | |
| 123 | ec_save_chart_data_ajax(hot); | |
| 124 | } else { | |
| 125 | $("#dialog-confirm").dialog({ | |
| 126 | resizable: false, | |
| 127 | height: 400, | |
| 128 | modal: true, | |
| 129 | buttons: { | |
| 130 | "Ok": function() { | |
| 131 | $(this).dialog("close"); | |
| 132 | } | |
| 133 | } | |
| 134 | }); | |
| 135 | } | |
| 119 | jQuery('.uv-chart-div svg.uv-frame g.uv-download-options').bind('mouseenter', function(event) { | |
| 120 | var svg = jQuery(this).parents('.uv-chart-div svg.uv-frame'); | |
| 136 | 121 | |
| 137 | }); | |
| 122 | svg[0].setAttribute('width', svg[0].getBoundingClientRect().width); | |
| 123 | svg[0].setAttribute('height', svg[0].getBoundingClientRect().height); | |
| 138 | 124 | |
| 139 | if (typeof(ec_chart_data) != 'undefined') { | |
| 140 | var graphdef = { | |
| 141 | categories: [], | |
| 142 | dataset: {} | |
| 143 | }; | |
| 125 | }); | |
| 144 | 126 | |
| 145 | var chartType = ec_chart_data.chart_type; | |
| 146 | var chartCategories = ec_chart_data.chart_categories; | |
| 147 | var chartDataset = ec_chart_data.chart_data; | |
| 148 | var chartConfiguration = ec_chart_data.chart_configuration; | |
| 149 | ||
| 150 | graphdef = { | |
| 151 | categories: chartCategories, | |
| 152 | dataset: chartDataset, | |
| 153 | }; | |
| 154 | ||
| 155 | var chartObject = uv.chart(chartType, graphdef, chartConfiguration); | |
| 156 | } | |
| 157 | ||
| 158 | $('.uv-chart-div svg.uv-frame g.uv-download-options').bind('mouseenter', function(event) { | |
| 159 | var svg = $(this).parents('.uv-chart-div svg.uv-frame'); | |
| 160 | ||
| 161 | svg[0].setAttribute('width', svg[0].getBoundingClientRect().width); | |
| 162 | svg[0].setAttribute('height', svg[0].getBoundingClientRect().height); | |
| 163 | ||
| 164 | }); | |
| 165 | ||
| 166 | }); | |
| 167 | ||
| 168 | })(jQuery); | |
| 127 | }); |
| r1944243 | r3349519 | |
|---|---|---|
| 21 | 21 | |
| 22 | 22 | |
| 23 | ||
| 24 | ||
| 23 | ||
| 24 | <div id="jspreadsheet" > | |
| 25 | 25 | |
| 26 | ||
| 26 | ||
| 27 | 27 | |
| 28 | 28 | <span |
| r3242372 | r3349519 | |
|---|---|---|
| 10 | 10 | * Plugin URI: http://kiranpotphode.github.io/easy-charts/ |
| 11 | 11 | * Description: Build simple, reusable, customisable charts on any page or post with ease. |
| 12 | * Version: 1.2. |
|
| 12 | * Version: 1.2.5 | |
| 13 | 13 | * Author: Kiran Potphode |
| 14 | 14 | * License: GPL-2.0+ |
| r3242372 | r3349519 | |
|---|---|---|
| 69 | 69 | |
| 70 | 70 | $this->plugin_name = 'easy-charts'; |
| 71 | $this->version = '1.2. |
|
| 71 | $this->version = '1.2.5'; | |
| 72 | 72 | |
| 73 | 73 | $this->load_dependencies(); |
| r3242372 | r3349519 | |
|---|---|---|
| 4 | 4 | Requires at least: 3.0 |
| 5 | 5 | Tested up to: 6.7.2 |
| 6 | Stable tag: 1.2. |
|
| 6 | Stable tag: 1.2.5 | |
| 7 | 7 | License: GPLv2 or later |
| 8 | 8 | License URI: http://www.gnu.org/licenses/gpl-2.0.html |
| … | … | |
| 78 | 78 | == Changelog == |
| 79 | 79 | |
| 80 | = 1.2.5 = | |
| 81 | *Release Date - 25th Aug, 2025* | |
| 82 | ||
| 83 | * Replace handsontable with jspreadsheet js | |
| 84 | ||
| 80 | 85 | = 1.2.4 = |
| 81 | 86 | *Release Date - 18th Feb, 2025* |
| r3081203 | r3349519 | |
|---|---|---|
| 82 | 82 | wp_enqueue_style( this−>pluginname,plugindirurl(FILE).′css/easy−charts−admin.css′,array(),this->plugin_name, plugin_dir_url( __FILE__ ) . 'css/easy-charts-admin.css', array(), this−>pluginname,plugindirurl(FILE).′css/easy−charts−admin.css′,array(),this->version, 'all' ); |
| 83 | 83 | |
| 84 | wp_enqueue_style( 'handsontable-css', plugin_dir_url( __FILE__ ) . 'css/handsontable/handsontable.full.css', array(), $this->version, 'all' ); | |
| 84 | wp_enqueue_style( 'jsuites-css', plugin_dir_url( __FILE__ ) . 'js/jspreadsheet/jsuites.min.css', array(), $this->version, 'all' ); | |
| 85 | ||
| 86 | wp_enqueue_style( 'jspreadsheet-css', plugin_dir_url( __FILE__ ) . 'js/jspreadsheet/jspreadsheet.css', array( 'jsuites-css' ), $this->version, 'all' ); | |
| 85 | 87 | |
| 86 | 88 | wp_enqueue_style( 'jquery-ui-css', plugin_dir_url( __FILE__ ) . 'css/jquery-ui.min.css', array(), $this->version, 'all' ); |
| … | … | |
| 117 | 119 | if ( 'post-new.php' === pagenow∥∣′post.php′===pagenow | |
| 118 | 120 | |
| 119 | wp_enqueue_script( 'easy-charts-admin-js', plugin_dir_url( __FILE__ ) . 'js/easy-charts-admin.js', array( 'jquery' ), $this->version, true ); | |
| 120 | ||
| 121 | wp_enqueue_script( 'handsontable-js', plugin_dir_url( __FILE__ ) . 'js/handsontable/handsontable.full.js', array( 'jquery' ), $this->version, false ); | |
| 121 | wp_enqueue_script( 'easy-charts-admin-js', plugin_dir_url( __FILE__ ) . 'js/easy-charts-admin.js', array( 'jquery', 'jsuites-js', 'jspreadsheet-js' ), $this->version, true ); | |
| 122 | ||
| 123 | wp_enqueue_script( 'jsuites-js', plugin_dir_url( __FILE__ ) . 'js/jspreadsheet/jsuites.min.js', array(), $this->version, false ); | |
| 124 | ||
| 125 | wp_enqueue_script( 'jspreadsheet-js', plugin_dir_url( __FILE__ ) . 'js/jspreadsheet/jspreadsheet.js', array(), $this->version, false ); | |
| 126 | ||
| 122 | 127 | wp_enqueue_script( 'd3-js', plugins_url( 'includes/js/d3.min.js', __DIR__ ), array( 'jquery' ), $this->version, false ); |
| 123 | 128 | |
| … | … | |
| 337 | 342 | return; |
| 338 | 343 | } |
| 339 | } else { | |
| 340 | ||
| 341 | if ( ! current_user_can( 'edit_post', $post_id ) ) { | |
| 344 | } elseif ( ! current_user_can( 'edit_post', $post_id ) ) { | |
| 345 | ||
| 342 | 346 | return; |
| 343 | ||
| 344 | 347 | } |
| 345 | 348 |
| r2908758 | r3349519 | |
|---|---|---|
| 3 | 3 | * included in this file. |
| 4 | 4 | */ |
| 5 | #easy-charts-data-metabox-wrap #easy-data-chart-box .ec-data-container . |
|
| 5 | #easy-charts-data-metabox-wrap #easy-data-chart-box .ec-data-container .jspreadsheet-controls { | |
| 6 | 6 | text-align: center; |
| 7 | 7 | padding: 30px 0; |
| 8 | 8 | border: 1px solid #000; |
| 9 | 9 | } |
| 10 | #easy-charts-data-metabox-wrap #easy-data-chart-box .ec-data-container . |
|
| 10 | #easy-charts-data-metabox-wrap #easy-data-chart-box .ec-data-container .jspreadsheet-controls .button-group { | |
| 11 | 11 | margin: 0 5px; |
| 12 | 12 | } |
| 13 | #easy-charts-data-metabox-wrap #easy-data-chart-box .ec-data-container . |
|
| 13 | #easy-charts-data-metabox-wrap #easy-data-chart-box .ec-data-container .jspreadsheet-controls .button-group button { | |
| 14 | 14 | /*display: block;*/ |
| 15 | 15 | } |
| 16 | #easy-charts-data-metabox-wrap #easy-data-chart-box .ec-data-container . |
|
| 16 | #easy-charts-data-metabox-wrap #easy-data-chart-box .ec-data-container .jspreadsheet-controls .button-group button .dashicons { | |
| 17 | 17 | line-height: 26px; |
| 18 | 18 | height: 28px; |
| r2908758 | r3349519 | |
|---|---|---|
| 7 | 7 | .ec-data-container{ |
| 8 | 8 | |
| 9 | . |
|
| 9 | .jspreadsheet-container{ | |
| 10 | 10 | } |
| 11 | 11 | |
| 12 | . |
|
| 12 | .jspreadsheet-controls{ | |
| 13 | 13 | text-align: center; |
| 14 | 14 | padding: 30px 0; |
| r1944243 | r3349519 | |
|---|---|---|
| 1 | (function($) { | |
| 2 | 'use strict'; | |
| 3 | $('document').ready(function() { | |
| 1 | // phpcs:disable | |
| 4 | 2 | |
| 5 | var data = [ | |
| 6 | ['', 'Kia', 'Nissan', 'Toyota', 'Honda'], | |
| 7 | ['2008', 10, 11, 12, 13], | |
| 8 | ['2009', 20, 11, 14, 13], | |
| 9 | ['2010', 30, 15, 12, 13] | |
| 10 | ]; | |
| 3 | document.addEventListener( 'DOMContentLoaded', function () { | |
| 11 | 4 | |
| 5 | if (typeof(ec_chart_data) != 'undefined') { | |
| 6 | var graphdef = { | |
| 7 | categories: [], | |
| 8 | dataset: {} | |
| 9 | }; | |
| 12 | 10 | |
| 13 | if (typeof(ec_chart) != 'undefined') { | |
| 14 | if (ec_chart.chart_data != null) { | |
| 15 | data = ec_chart.chart_data; | |
| 16 | } | |
| 17 | } | |
| 11 | var chartType = ec_chart_data.chart_type; | |
| 12 | var chartCategories = ec_chart_data.chart_categories; | |
| 13 | var chartDataset = ec_chart_data.chart_data; | |
| 14 | var chartConfiguration = ec_chart_data.chart_configuration; | |
| 18 | 15 | |
| 19 | $('.ec-color-picker').wpColorPicker(); | |
| 20 | $(".ec-field-buttonset").buttonset(); | |
| 16 | graphdef = { | |
| 17 | categories: chartCategories, | |
| 18 | dataset: chartDataset, | |
| 19 | }; | |
| 21 | 20 | |
| 22 | $('.ec-field-slider').each(function(index, el) { | |
| 21 | var chartObject = uv.chart(chartType, graphdef, chartConfiguration); | |
| 22 | } | |
| 23 | 23 | |
| 24 | $(this).slider({ | |
| 25 | range: "max", | |
| 26 | min: 0, | |
| 27 | max: 1, | |
| 28 | value: ((((this).data('attach')).val(), | |
| 29 | step: 0.1, | |
| 30 | slide: function(event, ui) { | |
| 31 | ((((this).data('attach')).val(ui.value); | |
| 32 | } | |
| 33 | }); | |
| 34 | }); | |
| 24 | var jspreadsheetid = document.getElementById("jspreadsheet"); | |
| 25 | var data = [ | |
| 26 | ['', 'Kia', 'Nissan', 'Toyota', 'Honda'], | |
| 27 | ['2008', 10, 11, 12, 13], | |
| 28 | ['2009', 20, 11, 14, 13], | |
| 29 | ['2010', 30, 15, 12, 13] | |
| 30 | ]; | |
| 35 | 31 | |
| 32 | if (typeof(ec_chart) != 'undefined') { | |
| 33 | if (ec_chart.chart_data != null) { | |
| 34 | data = ec_chart.chart_data; | |
| 35 | } | |
| 36 | } | |
| 36 | 37 | |
| 37 | ||
| 38 | tabsPosition: 'vertical', | |
| 39 | ||
| 40 | ||
| 41 | ||
| 42 | effect: 'slidedown' | |
| 43 | }); | |
| 38 | let spreadsheet = jspreadsheet(jspreadsheetid, { | |
| 39 | worksheets: [{ | |
| 40 | data: data, | |
| 41 | }], | |
| 42 | tableOverflow: true, | |
| 43 | tableWidth: "200px", | |
| 44 | }); | |
| 44 | 45 | |
| 45 | function ec_save_chart_data_ajax(table) { | |
| 46 | $.ajax({ | |
| 47 | url: ajaxurl, | |
| 48 | type: 'POST', | |
| 49 | dataType: 'json', | |
| 50 | data: { | |
| 51 | 'action': 'easy_charts_save_chart_data', | |
| 52 | 'chart_id': ec_chart.chart_id, | |
| 53 | '_nonce_check': ec_chart.ec_ajax_nonce, | |
| 54 | 'chart_data': JSON.stringify(table.getData()) | |
| 55 | }, | |
| 56 | }) | |
| 57 | .done(function(updated_data) { | |
| 58 | $('.uv-div-' + ec_chart.chart_id).html(''); | |
| 46 | document.getElementById("ec-button-add-col").onclick = (event) => { event.preventDefault(); spreadsheet[0].insertColumn() }; | |
| 47 | document.getElementById("ec-button-remove-col").onclick = (event) => { event.preventDefault(); spreadsheet[0].deleteColumn() }; | |
| 48 | document.getElementById("ec-button-add-row").onclick = (event) => { event.preventDefault(); spreadsheet[0].insertRow() }; | |
| 49 | document.getElementById("ec-button-remove-row").onclick = (event) => { event.preventDefault(); spreadsheet[0].deleteRow() }; | |
| 59 | 50 | |
| 60 | var graphdef = { | |
| 61 | categories: updated_data.chart_categories, | |
| 62 | dataset: updated_data.chart_data, | |
| 63 | }; | |
| 51 | document.getElementById("ec-button-save-data").addEventListener('click', function (event) { | |
| 52 | event.preventDefault(); | |
| 53 | let data = spreadsheet[0].getData(); | |
| 64 | 54 | |
| 65 | var chartObject = uv.chart(updated_data.chart_type, graphdef, chartConfiguration); | |
| 66 | }) | |
| 67 | .fail(function() {}) | |
| 68 | .always(function() {}); | |
| 69 | } | |
| 55 | if (data.flat().every(cell => cell === "" | | |
| 56 | jQuery("#dialog-confirm").dialog({ | |
| 57 | resizable: false, | |
| 58 | height: 400, | |
| 59 | modal: true, | |
| 60 | buttons: { | |
| 61 | "Ok": function() { | |
| 62 | jQuery(this).dialog("close"); | |
| 63 | } | |
| 64 | } | |
| 65 | }); | |
| 66 | } else { | |
| 67 | // Prepare data to send | |
| 68 | const formData = new FormData(); | |
| 69 | formData.append("action", "easy_charts_save_chart_data"); // Must match the PHP action | |
| 70 | formData.append("chart_id", ec_chart.chart_id); | |
| 71 | formData.append('_nonce_check', ec_chart.ec_ajax_nonce); | |
| 72 | formData.append("chart_data", JSON.stringify(data)); | |
| 70 | 73 | |
| 71 | var container = document.getElementById("handsontable"); | |
| 74 | // Send AJAX request | |
| 75 | fetch(ajaxurl, { | |
| 76 | method: "POST", | |
| 77 | body: formData | |
| 78 | }) | |
| 79 | .then(response => response.json()) | |
| 80 | .then(updated_data => { | |
| 81 | document.querySelector( '.uv-div-' + ec_chart.chart_id ).innerHTML = ''; | |
| 72 | 82 | |
| 73 | if (container != null) { | |
| 83 | var graphdef = { | |
| 84 | categories: updated_data.chart_categories, | |
| 85 | dataset: updated_data.chart_data, | |
| 86 | }; | |
| 74 | 87 | |
| 75 | var hot = new Handsontable(container, { | |
| 76 | data: data, | |
| 77 | stretchH: 'all', | |
| 78 | cell: [{ | |
| 79 | row: 0, | |
| 80 | col: 0, | |
| 81 | readOnly: true | |
| 82 | }], | |
| 83 | fixedRowsTop: 1, | |
| 84 | fixedColumnsTop: 1, | |
| 85 | fixedColumnsLeft: 1, | |
| 86 | rowHeaders: true, | |
| 87 | colHeaders: true, | |
| 88 | manualColumnMove: true, | |
| 89 | manualRowMove: true, | |
| 90 | minSpareRows: 0, | |
| 91 | minSpareCols: 0, | |
| 92 | contextMenu: true, | |
| 93 | autoWrapCol: true, | |
| 94 | autoWrapRow: true, | |
| 95 | afterChange: function(change, source) {}, | |
| 96 | afterColumnMove: function(startColumn, endColumn) {}, | |
| 97 | afterRowMove: function(startColumn, endColumn) {} | |
| 98 | }); | |
| 99 | } | |
| 88 | var chartObject = uv.chart(updated_data.chart_type, graphdef, chartConfiguration); | |
| 89 | }) | |
| 90 | .catch(error => console.error("Error:", error)); | |
| 91 | } | |
| 92 | }); | |
| 100 | 93 | |
| 101 | $('#ec-button-add-col').on('click', function(event) { | |
| 102 | event.preventDefault(); | |
| 103 | hot.alter('insert_col', null); | |
| 104 | }); | |
| 105 | $('#ec-button-remove-col').on('click', function(event) { | |
| 106 | event.preventDefault(); | |
| 107 | hot.alter('remove_col', null); | |
| 108 | }); | |
| 109 | $('#ec-button-add-row').on('click', function(event) { | |
| 110 | event.preventDefault(); | |
| 111 | hot.alter('insert_row', null); | |
| 112 | }); | |
| 113 | $('#ec-button-remove-row').on('click', function(event) { | |
| 114 | event.preventDefault(); | |
| 115 | hot.alter('remove_row', null); | |
| 116 | }); | |
| 94 | // jQuery implementation. | |
| 95 | jQuery('.ec-color-picker').wpColorPicker(); | |
| 96 | jQuery(".ec-field-buttonset").buttonset(); | |
| 97 | jQuery('.ec-field-slider').each(function(index, el) { | |
| 117 | 98 | |
| 118 | $('#ec-button-save-data').on('click', function(event) { | |
| 119 | event.preventDefault(); | |
| 99 | jQuery(this).slider({ | |
| 100 | range: "max", | |
| 101 | min: 0, | |
| 102 | max: 1, | |
| 103 | value: jQuery(jQuery(this).data('attach')).val(), | |
| 104 | step: 0.1, | |
| 105 | slide: function(event, ui) { | |
| 106 | jQuery(jQuery(this).data('attach')).val(ui.value); | |
| 107 | } | |
| 108 | }); | |
| 109 | }); | |
| 120 | 110 | |
| 121 | if (hot.countEmptyCols() == 0 && hot.countEmptyRows() == 0) { | |
| 111 | jQuery('.resp-tabs-container').pwstabs({ | |
| 112 | tabsPosition: 'vertical', | |
| 113 | responsive: false, | |
| 114 | containerWidth: '100%', | |
| 115 | theme: 'pws_theme_orange', | |
| 116 | effect: 'slidedown' | |
| 117 | }); | |
| 122 | 118 | |
| 123 | ec_save_chart_data_ajax(hot); | |
| 124 | } else { | |
| 125 | $("#dialog-confirm").dialog({ | |
| 126 | resizable: false, | |
| 127 | height: 400, | |
| 128 | modal: true, | |
| 129 | buttons: { | |
| 130 | "Ok": function() { | |
| 131 | $(this).dialog("close"); | |
| 132 | } | |
| 133 | } | |
| 134 | }); | |
| 135 | } | |
| 119 | jQuery('.uv-chart-div svg.uv-frame g.uv-download-options').bind('mouseenter', function(event) { | |
| 120 | var svg = jQuery(this).parents('.uv-chart-div svg.uv-frame'); | |
| 136 | 121 | |
| 137 | }); | |
| 122 | svg[0].setAttribute('width', svg[0].getBoundingClientRect().width); | |
| 123 | svg[0].setAttribute('height', svg[0].getBoundingClientRect().height); | |
| 138 | 124 | |
| 139 | if (typeof(ec_chart_data) != 'undefined') { | |
| 140 | var graphdef = { | |
| 141 | categories: [], | |
| 142 | dataset: {} | |
| 143 | }; | |
| 125 | }); | |
| 144 | 126 | |
| 145 | var chartType = ec_chart_data.chart_type; | |
| 146 | var chartCategories = ec_chart_data.chart_categories; | |
| 147 | var chartDataset = ec_chart_data.chart_data; | |
| 148 | var chartConfiguration = ec_chart_data.chart_configuration; | |
| 149 | ||
| 150 | graphdef = { | |
| 151 | categories: chartCategories, | |
| 152 | dataset: chartDataset, | |
| 153 | }; | |
| 154 | ||
| 155 | var chartObject = uv.chart(chartType, graphdef, chartConfiguration); | |
| 156 | } | |
| 157 | ||
| 158 | $('.uv-chart-div svg.uv-frame g.uv-download-options').bind('mouseenter', function(event) { | |
| 159 | var svg = $(this).parents('.uv-chart-div svg.uv-frame'); | |
| 160 | ||
| 161 | svg[0].setAttribute('width', svg[0].getBoundingClientRect().width); | |
| 162 | svg[0].setAttribute('height', svg[0].getBoundingClientRect().height); | |
| 163 | ||
| 164 | }); | |
| 165 | ||
| 166 | }); | |
| 167 | ||
| 168 | })(jQuery); | |
| 127 | }); |
| r1944243 | r3349519 | |
|---|---|---|
| 21 | 21 | |
| 22 | 22 | |
| 23 | ||
| 24 | ||
| 23 | ||
| 24 | <div id="jspreadsheet" > | |
| 25 | 25 | |
| 26 | ||
| 26 | ||
| 27 | 27 | |
| 28 | 28 | <span |
| r3242372 | r3349519 | |
|---|---|---|
| 10 | 10 | * Plugin URI: http://kiranpotphode.github.io/easy-charts/ |
| 11 | 11 | * Description: Build simple, reusable, customisable charts on any page or post with ease. |
| 12 | * Version: 1.2. |
|
| 12 | * Version: 1.2.5 | |
| 13 | 13 | * Author: Kiran Potphode |
| 14 | 14 | * License: GPL-2.0+ |
| r3242372 | r3349519 | |
|---|---|---|
| 69 | 69 | |
| 70 | 70 | $this->plugin_name = 'easy-charts'; |
| 71 | $this->version = '1.2. |
|
| 71 | $this->version = '1.2.5'; | |
| 72 | 72 | |
| 73 | 73 | $this->load_dependencies(); |