PluginProbe
Chartify – WordPress Chart Plugin / 3.7.0
Chartify – WordPress Chart Plugin v3.7.0
3.8.0 3.7.9 3.7.8 3.7.7 3.7.6 3.7.5 trunk 1.0.0 3.0.0 3.0.1 3.0.2 3.0.3 3.0.4 3.0.5 3.0.6 3.0.7 3.0.8 3.0.9 3.1.0 3.1.1 3.1.2 3.1.3 3.1.4 3.1.5 3.1.6 All 83 releases
chart-builder / admin / class-chart-builder-admin.php

class-chart-builder-admin.php in Chartify – WordPress Chart Plugin 3.7.0, at admin/class-chart-builder-admin.php

9,920 lines 701.3 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 <?php
2
3 /**
4 * The admin-specific functionality of the plugin.
5 *
6 * @link https://ays-pro.com/
7 * @since 1.0.0
8 *
9 * @package Chart_Builder
10 * @subpackage Chart_Builder/admin
11 */
12
13 /**
14 * The admin-specific functionality of the plugin.
15 *
16 * Defines the plugin name, version, and two examples hooks for how to
17 * enqueue the admin-specific stylesheet and JavaScript.
18 *
19 * @package Chart_Builder
20 * @subpackage Chart_Builder/admin
21 * @author Chart Builder Team <info@ays-pro.com>
22 */
23 class Chart_Builder_Admin {
24
25 /**
26 * The ID of this plugin.
27 *
28 * @since 1.0.0
29 * @access private
30 * @var string $plugin_name The ID of this plugin.
31 */
32 private $plugin_name;
33
34 /**
35 * The version of this plugin.
36 *
37 * @since 1.0.0
38 * @access private
39 * @var string $version The current version of this plugin.
40 */
41 private $version;
42
43 /**
44 * The capability of this plugin.
45 *
46 * @since 1.0.0
47 * @access private
48 * @var string $capability The capability for users access to this plugin.
49 */
50 private $capability;
51
52 /**
53 * @var Chart_Builder_DB_Actions
54 */
55 private $db_obj;
56
57 /**
58 * @var Chart_Builder_Settings_DB_Actions
59 */
60 private $settings_obj;
61
62 /**
63 * Initialize the class and set its properties.
64 *
65 * @since 1.0.0
66 * @param string $plugin_name The name of this plugin.
67 * @param string $version The version of this plugin.
68 */
69 public function __construct( $plugin_name, $version ) {
70
71 $this->plugin_name = $plugin_name;
72 $this->version = $version;
73
74 add_filter('set-screen-option', array(__CLASS__, 'set_screen'), 10, 3);
75 add_filter('set_screen_option_cb_charts_per_page', array(__CLASS__, 'set_screen'), 10, 3);
76
77 }
78
79 /**
80 * Register the stylesheets for the admin area.
81 *
82 * @since 1.0.0
83 */
84 public function enqueue_styles($hook_suffix) {
85 wp_enqueue_style( $this->plugin_name . '-admin', plugin_dir_url(__FILE__) . 'css/admin.css', array(), $this->version, 'all');
86 // Not enqueue styles if they are not on the current plugin page
87 if (false === strpos($hook_suffix, $this->plugin_name)) return;
88 //
89 wp_enqueue_style( $this->plugin_name . '-normalize', plugin_dir_url( __FILE__ ) . 'css/normalize.css', array(), $this->version . time(), 'all' );
90 wp_enqueue_style( $this->plugin_name . '-admin-general', plugin_dir_url( __FILE__ ) . 'css/admin-general.css', array(), $this->version, 'all' );
91 wp_enqueue_style( $this->plugin_name . '-banner', plugin_dir_url( __FILE__ ) . 'css/banner.css', array(), $this->version, 'all' );
92 // wp_enqueue_style( $this->plugin_name . '-chart-builder-banner.css', plugin_dir_url(__FILE__) . 'css/chart-builder-banner.css', array(), $this->version, 'all');
93 wp_enqueue_style( $this->plugin_name . '-animate', plugin_dir_url(__FILE__) . 'css/animate.css', array(), $this->version, 'all');
94 wp_enqueue_style( $this->plugin_name . '-font-awesome', plugin_dir_url(__FILE__) . 'css/ays-font-awesome.min.css', array(), $this->version, 'all');
95 wp_enqueue_style( $this->plugin_name . '-font-awesome-icons', plugin_dir_url(__FILE__) . 'css/ays-font-awesome-icons.css', array(), $this->version, 'all');
96 wp_enqueue_style( $this->plugin_name . '-select2', plugin_dir_url(__FILE__) . 'css/ays-select2.min.css', array(), $this->version, 'all');
97 wp_enqueue_style( $this->plugin_name . '-chosen', plugin_dir_url(__FILE__) . 'css/chosen.min.css', array(), $this->version, 'all');
98 wp_enqueue_style( $this->plugin_name . '-bootstrap', plugin_dir_url(__FILE__) . 'css/bootstrap.min.css', array(), $this->version, 'all');
99 wp_enqueue_style( $this->plugin_name . '-data-bootstrap', plugin_dir_url(__FILE__) . 'css/dataTables.bootstrap4.min.css', array(), $this->version, 'all');
100 wp_enqueue_style( $this->plugin_name . '-jquery-ui.min', plugin_dir_url(__FILE__) . 'css/jquery-ui.min.css', array(), $this->version, 'all');
101
102 wp_enqueue_style( $this->plugin_name . '-layer', plugin_dir_url( __FILE__ ) . 'css/chart-builder-admin-layer.css', array(), $this->version, 'all' );
103 wp_enqueue_style( $this->plugin_name, plugin_dir_url( __FILE__ ) . 'css/chart-builder-admin.css', array(), $this->version . time(), 'all' );
104 wp_enqueue_style( $this->plugin_name . "-pro-features", plugin_dir_url( __FILE__ ) . 'css/chart-builder-pro-features.css', array(), $this->version . time(), 'all' );
105
106 }
107
108 /**
109 * Register the JavaScript for the admin area.
110 *
111 * @since 1.0.0
112 */
113 public function enqueue_scripts($hook_suffix) {
114 if (false !== strpos($hook_suffix, "plugins.php")){
115 wp_enqueue_script( $this->plugin_name . '-sweetalert-js', plugin_dir_url( __FILE__ ) . 'js/chart-builder-sweetalert2.all.min.js', array('jquery'), $this->version, true );
116 wp_enqueue_script($this->plugin_name . '-admin', plugin_dir_url(__FILE__) . 'js/admin.js', array('jquery'), $this->version, true);
117 wp_localize_script($this->plugin_name . '-admin', 'chart_builder_admin_ajax', array('ajax_url' => admin_url('admin-ajax.php')));
118 }
119
120 // Not enqueue scripts if they are not on the current plugin page
121 if (false === strpos($hook_suffix, $this->plugin_name)) return;
122 //
123 global $wp_version;
124 $version1 = $wp_version;
125 $operator = '>=';
126 $version2 = '5.5';
127 $versionCompare = CBFunctions()->versionCompare( $version1, $operator, $version2 );
128
129 if ( $versionCompare ) {
130 wp_enqueue_script( $this->plugin_name.'-wp-load-scripts', plugin_dir_url(__FILE__) . 'js/load-scripts.js', array(), $this->version, true);
131 }
132
133 wp_enqueue_script( 'jquery' );
134
135 /*
136 ==========================================
137 * Bootstrap
138 * select2
139 * jQuery DataTables
140 ==========================================
141 */
142 wp_enqueue_script( $this->plugin_name . "-popper", plugin_dir_url(__FILE__) . 'js/popper.min.js', array( 'jquery' ), $this->version, true );
143 wp_enqueue_script( $this->plugin_name . "-bootstrap", plugin_dir_url(__FILE__) . 'js/bootstrap.min.js', array( 'jquery' ), $this->version, true );
144 wp_enqueue_script( $this->plugin_name . '-select2js', plugin_dir_url( __FILE__ ) . 'js/ays-select2.min.js', array('jquery'), $this->version, true);
145 wp_enqueue_script( $this->plugin_name . '-chosen', plugin_dir_url( __FILE__ ) . 'js/chosen.jquery.min.js', array('jquery'), $this->version, true);
146 wp_enqueue_script( $this->plugin_name . '-datatable-min', plugin_dir_url( __FILE__ ) . 'js/chart-builder-datatable.min.js', array('jquery'), $this->version, true);
147 wp_enqueue_script( $this->plugin_name . "-db4.min.js", plugin_dir_url( __FILE__ ) . 'js/dataTables.bootstrap4.min.js', array( 'jquery' ), $this->version, true );
148 wp_enqueue_script( $this->plugin_name . "-jquery-ui.min.js", plugin_dir_url( __FILE__ ) . 'js/jquery-ui.min.js', array( 'jquery' ), $this->version, true );
149 wp_enqueue_script( $this->plugin_name . '-sweetalert-js', plugin_dir_url( __FILE__ ) . 'js/chart-builder-sweetalert2.all.min.js', array('jquery'), $this->version, true );
150
151 wp_enqueue_script( $this->plugin_name . "-treeSortable", plugin_dir_url( __FILE__ ) . 'js/treeSortable.js', array( 'jquery' ), $this->version, true );
152 wp_enqueue_script( $this->plugin_name . "-tippy-bundle", plugin_dir_url( __FILE__ ) . 'js/tippy-bundle.umd.js', array( 'jquery' ), $this->version, true );
153
154 $table_col_mapping = CBFunctions()->get_all_db_tables_column_mapping( 1 );
155 $chart_banner_date = $this->ays_chart_update_banner_time();
156
157 wp_enqueue_code_editor(
158 array(
159 'type' => 'sql',
160 'codemirror' => array(
161 'autofocus' => true,
162 'lineWrapping' => true,
163 'dragDrop' => false,
164 'matchBrackets' => true,
165 'autoCloseBrackets' => true,
166 'extraKeys' => array( 'Ctrl-Space' => 'autocomplete' ),
167 'hintOptions' => array( 'tables' => $table_col_mapping ),
168 ),
169 )
170 );
171
172 wp_enqueue_script( $this->plugin_name . '-charts-google', plugin_dir_url(__FILE__) . 'js/google-chart.js', array('jquery'), $this->version, true);
173 wp_enqueue_script( $this->plugin_name . '-chart-js', plugin_dir_url(__FILE__) . 'js/chart-js.js', array('jquery'), $this->version, true);
174
175 wp_enqueue_script( $this->plugin_name . '-functions', plugin_dir_url( __FILE__ ) . 'js/functions.js', array( 'jquery' ), $this->version, true );
176
177 wp_register_script( $this->plugin_name . '-localized', '' , array('jquery'), $this->version, true);
178
179 wp_localize_script( $this->plugin_name . '-localized', 'aysChartBuilderAdmin', array(
180 'ajaxUrl' => admin_url( 'admin-ajax.php' ),
181 'selectUser' => __( 'Select author', "chart-builder" ),
182 'pleaseEnterMore' => __( "Please enter 1 or more characters", "chart-builder" ),
183 'searching' => __( "Searching...", "chart-builder" ),
184 'chartBannerDate' => $chart_banner_date,
185 'selectUserRoles' => __( 'Select user roles', "chart-builder" ),
186 'delete' => __( 'Delete', "chart-builder" ),
187 'selectQuestionDefaultType' => __( 'Select question default type', "chart-builder" ),
188 'yes' => __( 'Yes', "chart-builder" ),
189 'cancel' => __( 'Cancel', "chart-builder" ),
190 'somethingWentWrong' => __( "Maybe something went wrong.", "chart-builder" ),
191 'failed' => __( 'Failed', "chart-builder" ),
192 'selectPage' => __( 'Select page', "chart-builder" ),
193 'selectPostType' => __( 'Select post type', "chart-builder" ),
194 'copied' => __( 'Copied!', "chart-builder"),
195 'clickForCopy' => __( 'Click to copy', "chart-builder"),
196 'selectForm' => __( 'Select form', "chart-builder"),
197 'addImage' => __( 'Add Image', "chart-builder"),
198 'editImage' => __( 'Edit Image', "chart-builder"),
199 'confirmDelete' => __( 'Are you sure you want to delete the chart(s)?', "chart-builder"),
200 'confirmRowDelete' => __( 'Are you sure you want to delete the row?', "chart-builder"),
201 'confirmColDelete' => __( 'Are you sure you want to delete the column?', "chart-builder"),
202 'minRowNotice' => __( 'Sorry, minimum count of rows should be 1', "chart-builder"),
203 'minColNotice' => __( 'Sorry, minimum count of columns should be 1', "chart-builder"),
204 'activated' => __( "Activated", "chart-builder" ),
205 'errorMsg' => __( "Error", "chart-builder" ),
206 'loadResource' => __( "Can't load resource.", "chart-builder" ),
207 'somethingWentWrong' => __( "Maybe something went wrong.", "chart-builder" ),
208 'successCopyCoupon' => esc_html__( "Coupon code copied!", 'chart-builder' ),
209 'failedCopyCoupon' => esc_html__( "Failed to copy coupon code", 'chart-builder' ),
210
211 ) );
212
213 wp_localize_script( $this->plugin_name . '-localized', 'aysChartBuilderChartSettings', array(
214 'types' => CBFunctions()->getAllowedTypes(),
215 'max_selected_options' => 2,
216 'l10n' => array(
217 'invalid_source' => esc_html__( 'You have entered invalid URL. Please, insert proper URL.', "chart-builder" ),
218 'loading' => esc_html__( 'Loading...', "chart-builder" ),
219 'filter_config_error' => esc_html__( 'Please check the filters you have configured.', "chart-builder" ),
220 'select_columns' => esc_html__( 'Please select a few columns to include in the chart.', "chart-builder" ),
221 'save_settings' => __( 'You have modified the chart\'s settings. To modify the source/data again, you must save this chart and reopen it for editing. If you continue without saving the chart, you may lose your changes.', "chart-builder" ),
222 ),
223 'ajax' => array(
224 'url' => admin_url( 'admin-ajax.php' ),
225 'nonces' => array(
226 'filter_get_props' => wp_create_nonce( 'cbuilder-fetch-post-type-props' ),
227 'filter_get_data' => wp_create_nonce( 'cbuilder-fetch-post-type-data' ),
228 'quiz_maker_get_data' => wp_create_nonce( 'cbuilder-fetch-quiz-maker-data' ),
229 'quiz_maker_save_data' => wp_create_nonce( 'cbuilder-save-quiz-maker-data' ),
230 'author_user_search' => wp_create_nonce( 'cbuilder-author-user-search' ),
231
232 ),
233 'actions' => array(
234 'filter_get_props' => 'fetch_post_type_props',
235 'filter_get_data' => 'fetch_post_type_data',
236 'quiz_maker_get_data' => 'fetch_quiz_maker_data',
237 'quiz_maker_save_data' => 'save_quiz_maker_data',
238 'author_user_search' => 'author_user_search'
239 ),
240 ),
241 'db_query' => array(
242 'tables' => $table_col_mapping,
243 ),
244 ) );
245
246 wp_enqueue_script( $this->plugin_name, plugin_dir_url( __FILE__ ) . 'js/chart-builder-admin.js', array( 'jquery', $this->plugin_name . '-localized' ), $this->version . time(), true );
247 wp_enqueue_script( $this->plugin_name . '-google', plugin_dir_url( __FILE__ ) . 'js/chart-builder-admin-google.js', array( 'jquery', $this->plugin_name . '-localized' ), $this->version . time(), true );
248 wp_enqueue_script( $this->plugin_name . '-chartjs', plugin_dir_url( __FILE__ ) . 'js/chart-builder-admin-chartjs.js', array( 'jquery', $this->plugin_name . '-localized' ), $this->version . time(), true );
249 wp_enqueue_script( $this->plugin_name . '-general-js', plugin_dir_url( __FILE__ ) . 'js/chart-builder-admin-general.js', array( 'jquery', $this->plugin_name . '-localized' ), $this->version . time(), true );
250
251 if ( false !== strpos( $hook_suffix, 'settings' ) ) {
252 wp_enqueue_script( $this->plugin_name . '-settings', plugin_dir_url( __FILE__ ) . 'js/chart-builder-admin-settings.js', array( 'jquery' ), $this->version, true );
253
254 wp_localize_script( $this->plugin_name . '-settings', 'aysChartBuilderAdminSettings', array(
255 'ajaxUrl' => admin_url( 'admin-ajax.php' ),
256 'selectUserRoles' => __( 'Select user roles', 'chart-builder' ),
257 'delete' => __( 'Delete', 'chart-builder' ),
258 'selectQuestionDefaultType' => __( 'Select question default type', 'chart-builder' ),
259 'yes' => __( 'Yes', 'chart-builder' ),
260 'cancel' => __( 'Cancel', 'chart-builder' ),
261 'somethingWentWrong' => __( "Maybe something went wrong.", 'chart-builder' ),
262 'failed' => __( 'Failed', 'chart-builder' ),
263 'selectPage' => __( 'Select page', 'chart-builder' ),
264 'selectPostType' => __( 'Select post type', 'chart-builder' ),
265 'copied' => __( 'Copied!', 'chart-builder'),
266 'clickForCopy' => __( 'Click to copy', 'chart-builder'),
267 'selectForm' => __( 'Select form', 'chart-builder'),
268 ) );
269 }
270 }
271
272 /**
273 * De-register JavaScript files for the admin area.
274 *
275 * @since 1.0.0
276 */
277 public function disable_scripts($hook_suffix) {
278 if (false !== strpos($hook_suffix, $this->plugin_name)) {
279 if (is_plugin_active('ai-engine/ai-engine.php')) {
280 wp_deregister_script('mwai');
281 wp_deregister_script('mwai-vendor');
282 wp_dequeue_script('mwai');
283 wp_dequeue_script('mwai-vendor');
284 }
285
286 if (is_plugin_active('html5-video-player/html5-video-player.php')) {
287 wp_dequeue_style('h5vp-admin');
288 wp_dequeue_style('fs_common');
289 }
290
291 if (is_plugin_active('panorama/panorama.php')) {
292 wp_dequeue_style('bppiv_admin_custom_css');
293 wp_dequeue_style('bppiv-custom-style');
294 }
295
296 if (is_plugin_active('wp-social/wp-social.php')) {
297 wp_dequeue_style('wp_social_select2_css');
298 wp_deregister_script('wp_social_select2_js');
299 wp_dequeue_script('wp_social_select2_js');
300 }
301
302 if (is_plugin_active('real-media-library-lite/index.php')) {
303 wp_dequeue_style('real-media-library-lite-rml');
304 }
305
306 // Theme | Phlox 2.17.6
307 wp_dequeue_style('auxin-admin-style');
308
309 // Theme | Pixel Ebook Store
310 wp_dequeue_style('pixel-ebook-store-free-demo-content-style');
311
312 // Theme | Interactive Education
313 wp_dequeue_style('interactive-education-free-demo-content-style');
314
315 }
316 }
317
318 /**
319 * Register the administration menu for this plugin into the WordPress Dashboard menu.
320 *
321 * @since 1.0.0
322 */
323 public function add_plugin_admin_menu(){
324
325 /*
326 * Add a settings page for this plugin to the Settings menu.
327 *
328 * NOTE: Alternative menu locations are available via WordPress administration menu functions.
329 *
330 * Administration Menus: http://codex.wordpress.org/Administration_Menus
331 *
332 */
333 global $wpdb;
334 $menu_item = __( 'Chart Builder', "chart-builder" );
335 $this->capability = 'manage_options';
336
337 add_menu_page(
338 __( 'Chart Builder', "chart-builder" ),
339 $menu_item,
340 $this->capability,
341 $this->plugin_name,
342 array($this, 'display_plugin_charts_page'),
343 CHART_BUILDER_ADMIN_URL . '/images/icons/ays_chart_logo_icon_bw.svg',
344 '6.22'
345 );
346
347 }
348
349 public function add_plugin_charts_submenu(){
350 $hook_page_view = add_submenu_page(
351 $this->plugin_name,
352 __('All Charts', 'chart-builder'),
353 __('All Charts', 'chart-builder'),
354 'manage_options',
355 $this->plugin_name,
356 array($this, 'display_plugin_charts_page')
357 );
358
359 add_action( "load-$hook_page_view", array( $this, 'screen_option_charts' ) );
360 }
361
362 public function add_plugin_add_new_submenu(){
363 $hook_charts = add_submenu_page(
364 $this->plugin_name,
365 __('Add New', 'chart-builder'),
366 __('Add New', 'chart-builder'),
367 'manage_options',
368 $this->plugin_name."&action=add",
369 array($this, 'display_plugin_addnew_page')
370 );
371 add_action("load-$hook_charts", array( $this, 'add_tabs' ));
372 }
373
374 public function add_plugin_dashboard_submenu(){
375 $hook_charts = add_submenu_page(
376 $this->plugin_name,
377 __('How to use', 'chart-builder'),
378 __('How to use', 'chart-builder'),
379 'manage_options',
380 $this->plugin_name . '-dashboard',
381 array($this, 'display_plugin_setup_page')
382 );
383 add_action("load-$hook_charts", array( $this, 'add_tabs' ));
384 }
385
386 public function add_plugin_general_settings_submenu(){
387 $hook_settings = add_submenu_page( $this->plugin_name,
388 __('General Settings', 'chart-builder'),
389 __('General Settings', 'chart-builder'),
390 'manage_options',
391 $this->plugin_name . '-settings',
392 array($this, 'display_plugin_settings_page')
393 );
394 add_action("load-$hook_settings", array($this, 'screen_option_settings'));
395 }
396
397 public function add_plugin_featured_plugins_submenu(){
398 $hook_our_products = add_submenu_page( $this->plugin_name,
399 __('Our products', 'chart-builder'),
400 __('Our products', 'chart-builder'),
401 'manage_options',
402 $this->plugin_name . '-featured-plugins',
403 array($this, 'display_plugin_featured_plugins_page')
404 );
405
406 add_action("load-$hook_our_products", array( $this, 'add_tabs' ));
407 }
408
409 public function add_plugin_chart_features_submenu(){
410 $hook_pro_features = add_submenu_page(
411 $this->plugin_name,
412 __('PRO Features', 'chart-builder'),
413 __('PRO Features', 'chart-builder'),
414 'manage_options',
415 $this->plugin_name . '-chart-features',
416 array($this, 'display_plugin_chart_features_page')
417 );
418
419 add_action("load-$hook_pro_features", array( $this, 'add_tabs' ));
420 }
421
422 public function screen_option_charts(){
423 $option = 'per_page';
424 $args = array(
425 'label' => __('Charts', "chart-builder"),
426 'default' => 5,
427 'option' => 'cb_charts_per_page'
428 );
429
430 // phpcs:ignore WordPress.Security.NonceVerification.Recommended
431 if( ! ( isset( $_GET['action'] ) && ( $_GET['action'] == 'add' || $_GET['action'] == 'edit' ) ) ){
432 add_screen_option( $option, $args );
433 }
434
435 $this->db_obj = new Chart_Builder_DB_Actions( $this->plugin_name );
436 }
437
438 public function screen_option_settings(){
439 $this->settings_obj = new Chart_Builder_Settings_DB_Actions( $this->plugin_name );
440 }
441
442 public function add_tabs() {
443 $screen = get_current_screen();
444
445 if ( ! $screen) {
446 return;
447 }
448 }
449
450 private function check_permissions_and_nonce($nonce_action) {
451 if (!is_user_logged_in() || !current_user_can('manage_options')) {
452 wp_die(__('Access denied.', 'chart-builder'));
453 }
454
455 if (!isset($_REQUEST['_wpnonce']) || !wp_verify_nonce($_REQUEST['_wpnonce'], $this->plugin_name . '-' . $nonce_action)) {
456 wp_die(__('Security check failed. Invalid or missing nonce.', 'chart-builder'));
457 }
458 }
459 public function display_plugin_charts_page(){
460 global $ays_chart_db_actions;
461
462 // phpcs:ignore WordPress.Security.NonceVerification.Recommended
463 $action = ( isset( $_GET['action'] ) ) ? sanitize_text_field( wp_unslash( $_GET['action'] ) ) : '';
464 // phpcs:ignore WordPress.Security.NonceVerification.Recommended
465 $id = (isset($_GET['id'])) ? absint( wp_unslash( $_GET['id'] ) ) : 0;
466 if (isset($_POST['bulk_delete_confirm'])) {
467 $this->check_permissions_and_nonce('bulk-delete');
468 if (isset($_POST['bulk-delete']) && !empty($_POST['bulk-delete'])) {
469 $ids = wp_unslash( $_POST['bulk-delete'] );
470 $ids = array_map( 'absint', (array) $ids );
471 foreach ($ids as $id) {
472 if ($id > 0) {
473 $this->db_obj->delete_item( $id );
474 }
475 }
476 $url = remove_query_arg( array('action', 'id', '_wpnonce') );
477 $url = esc_url_raw( add_query_arg( array(
478 "status" => 'all-deleted'
479 ), $url ) );
480 wp_redirect( $url );
481 exit;
482 }
483 }
484
485 switch ($action) {
486 case 'trash':
487 $this->check_permissions_and_nonce('trash-item');
488 if ($id > 0){
489 $this->db_obj->trash_item( $id );
490 $url = remove_query_arg( array('action', 'id', '_wpnonce') );
491 $url = esc_url_raw( add_query_arg( array(
492 "status" => 'trashed'
493 ), $url ) );
494 wp_redirect( $url );
495 exit;
496 }
497 break;
498 case 'restore':
499 $this->check_permissions_and_nonce('delete-item');
500 if ($id > 0 ) {
501 $this->db_obj->restore_item( $id );
502 $url = remove_query_arg( array('action', 'id', '_wpnonce') );
503 $url = esc_url_raw( add_query_arg( array(
504 "status" => 'restored'
505 ), $url ) );
506 wp_redirect( $url );
507 exit;
508 }
509 break;
510 case 'delete':
511 $this->check_permissions_and_nonce('delete-item');
512 if ($id > 0) {
513 $this->db_obj->delete_item( $id );
514 $url = remove_query_arg( array('action', 'id', '_wpnonce') );
515 $url = esc_url_raw( add_query_arg( array(
516 "status" => 'deleted'
517 ), $url ) );
518 wp_redirect( $url );
519 exit;
520 }
521 break;
522 case 'publish':
523 $this->check_permissions_and_nonce('publish-item');
524 if ($id > 0) {
525 $this->db_obj->publish_item( $id );
526 $url = remove_query_arg( array('action', 'id', '_wpnonce') );
527 $url = esc_url_raw( add_query_arg( array(
528 "status" => 'published'
529 ), $url ) );
530 wp_redirect( $url );
531 exit;
532 }
533 break;
534 case 'unpublish':
535 $this->check_permissions_and_nonce('unpublish-item');
536 if ($id > 0) {
537 $this->db_obj->restore_item( $id );
538 $url = remove_query_arg( array('action', 'id', '_wpnonce') );
539 $url = esc_url_raw( add_query_arg( array(
540 "status" => 'unpublished'
541 ), $url ) );
542 wp_redirect( $url );
543 exit;
544 }
545 break;
546 case 'duplicate':
547 $this->check_permissions_and_nonce('duplicate-item');
548 if ($id > 0) {
549 $this->db_obj->duplicate_item( $id );
550 $url = remove_query_arg( array('action', 'id', '_wpnonce') );
551 $url = esc_url_raw( add_query_arg( array(
552 "status" => 'duplicated'
553 ), $url ) );
554 wp_redirect( $url );
555 exit;
556 }
557 break;
558 case 'add':
559 include_once('partials/charts/actions/chart-builder-charts-actions.php');
560 break;
561 case 'edit':
562 include_once('partials/charts/actions/chart-builder-charts-actions.php');
563 break;
564 default:
565 include_once('partials/charts/chart-builder-charts-display.php');
566 }
567 }
568 public static function chart_builder_svg_sanitize_allowed_properties(){
569
570 $allowed_properties = array(
571 'div' => array(
572 'id' => true,
573 'class' => true,
574 'style' => true,
575 ),
576 'svg' => array(
577 'class' => true,
578 'version' => true,
579 'overflow' => true,
580 'preserveAspectRatio' => true,
581 'preserveaspectratio' => true,
582 'fill' => true,
583 'viewBox' => true,
584 'viewbox' => true,
585 'height' => true,
586 'width' => true,
587 'xmlns' => true,
588 'xmlns:xlink' => true,
589 'id' => true,
590 'title' => true,
591 ),
592 'g' => array(
593 'id' => true,
594 'class' => true,
595 'stroke-width' => true,
596 'stroke-linecap' => true,
597 'stroke-linejoin' => true,
598 ),
599 'path' => array(
600 'id' => true,
601 'class' => true,
602 'd' => true,
603 'fill' => true,
604 'vector-effect' => true,
605 'xmlns:default' => true,
606 ),
607 'span' => array(
608 'class' => true,
609 ),
610 'img' => array(
611 'src' => true,
612 'alt' => true,
613 ),
614 );
615
616 return $allowed_properties;
617 }
618
619 public static function get_allowed_tags_for_loader() {
620 return array(
621 'span' => array('class' => array()),
622 'img' => array('src' => array(), 'alt' => array()),
623 );
624 }
625
626 public function display_plugin_setup_page(){
627 include_once('partials/chart-builder-admin-display.php');
628 }
629
630 public function display_plugin_addnew_page(){
631
632 // $url = remove_query_arg( array('action', 'id', '_wpnonce') );
633 // $url = esc_url_raw( add_query_arg( array(
634 // "action" => 'add'
635 // ), $url ) );
636 // wp_redirect( $url );
637 }
638
639 public function display_plugin_settings_page(){
640 include_once('partials/settings/chart-builder-settings.php');
641 }
642
643 public function display_plugin_featured_plugins_page(){
644 include_once('partials/features/chart-builder-plugin-featured-display.php');
645 }
646
647 public function display_plugin_chart_features_page(){
648 include_once('partials/features/chart-builder-features-display.php');
649 }
650
651 /**
652 * Add settings action link to the plugins page.
653 *
654 * @since 1.0.0
655 */
656 public function add_action_links( $links ){
657
658 $chart_ajax_deactivate_plugin_nonce = wp_create_nonce( 'chart-ajax-deactivate-plugin-nonce' );
659
660 /*
661 * Documentation : https://codex.wordpress.org/Plugin_API/Filter_Reference/plugin_action_links_(plugin_file_name)
662 */
663 $settings_link = array(
664 '<a href="' . admin_url('admin.php?page=' . $this->plugin_name) . '">' . __('Settings', "chart-builder") . '</a>',
665 '<a href="https://ays-demo.com/chart-builder-demo/" target="_blank">' . __('Demo', "chart-builder") . '</a>',
666 // '<a href="https://ays-pro.com/wordpress/chart-builder?utm_source=chart-free-dashboard&utm_medium=chart-plugins-page&utm_campaign=chart-buy-now" id="ays-chart-plugins-buy-now-button" target="_blank">' . __('Upgrade', "chart-builder") . '</a>',
667 '<a href="https://ays-pro.com/wordpress/chart-builder?utm_source=chart-free-dashboard&utm_medium=chart-plugins-page&utm_campaign=chart-buy-now" id="ays-chart-plugins-buy-now-button" target="_blank">' . __('Upgrade 30% Sale', "chart-builder") . '</a>
668 <input type="hidden" id="chart_ajax_deactivate_plugin_nonce" name="chart_ajax_deactivate_plugin_nonce" value="' . $chart_ajax_deactivate_plugin_nonce .'">',
669 );
670 return array_merge( $settings_link, $links );
671
672 }
673
674
675 public static function set_screen($status, $option, $value){
676 return $value;
677 }
678
679 public function ays_admin_ajax(){
680 global $wpdb;
681
682 $response = array(
683 "status" => false
684 );
685 // phpcs:ignore WordPress.Security.NonceVerification.Recommended
686 $function = isset( $_REQUEST['function'] ) ? sanitize_text_field( wp_unslash( $_REQUEST['function'] ) ) : null;
687
688 if($function !== null){
689 $response = array();
690 if( is_callable( array( $this, $function ) ) ){
691 $allowed_functions = array(
692 "deactivate_plugin_option",
693 "ays_chart_dismiss_button",
694 "author_user_search",
695 "ays_chart_activate_plugin",
696 "ays_chart_install_plugin",
697 "fetch_quiz_maker_data",
698 "save_quiz_maker_data",
699 "fetch_post_type_props",
700 "fetch_post_type_data",
701 );
702 if (in_array($function, $allowed_functions, true)) {
703 $response = $this->$function();
704 }
705
706 ob_end_clean();
707 $ob_get_clean = ob_get_clean();
708 echo json_encode( $response );
709 wp_die();
710 }
711
712 }
713
714 ob_end_clean();
715 $ob_get_clean = ob_get_clean();
716 echo json_encode( $response );
717 wp_die();
718 }
719
720 public function deactivate_plugin_option(){
721 // Run a security check.
722 if ( isset( $_REQUEST['_ajax_nonce'] ) ) {
723 check_ajax_referer( 'chart-ajax-deactivate-plugin-nonce', sanitize_key( $_REQUEST['_ajax_nonce'] ) );
724 } else {
725 wp_die();
726 }
727
728 // Check for permissions.
729 if ( ! current_user_can( 'manage_options' ) ) {
730 ob_end_clean();
731 $ob_get_clean = ob_get_clean();
732 echo json_encode(array(
733 'option' => ''
734 ));
735 wp_die();
736 }
737
738 if( is_user_logged_in() ) {
739 $request_value = isset( $_REQUEST['upgrade_plugin'] ) ? sanitize_text_field( wp_unslash( $_REQUEST['upgrade_plugin'] ) ) : '';
740 $upgrade_option = get_option( 'ays_chart_builder_upgrade_plugin', '' );
741
742 if ( $upgrade_option === '' ) {
743 add_option( 'ays_chart_builder_upgrade_plugin', $request_value );
744 } else {
745 update_option( 'ays_chart_builder_upgrade_plugin', $request_value );
746 }
747
748 $response = array(
749 'option' => get_option( 'ays_chart_builder_upgrade_plugin', '' ),
750 );
751
752 wp_send_json_success( $response );
753 } else {
754 ob_end_clean();
755 $ob_get_clean = ob_get_clean();
756 echo json_encode(array(
757 'option' => ''
758 ));
759 wp_die();
760 }
761 }
762
763 public function chart_builder_admin_footer($a){
764 if(isset($_REQUEST['page'])){// phpcs:ignore WordPress.Security.NonceVerification.Recommended
765 if(false !== strpos( sanitize_text_field( wp_unslash( $_REQUEST['page'] ) ), $this->plugin_name)){// phpcs:ignore WordPress.Security.NonceVerification.Recommended
766 ?>
767 <div class="ays-chart-footer-support-box">
768 <span class="ays-chart-footer-link-row"><a href="https://wordpress.org/support/plugin/chart-builder" target="_blank"><?php echo esc_html__( "Support", "chart-builder"); ?></a></span>
769 <span class="ays-chart-footer-slash-row">/</span>
770 <span class="ays-chart-footer-link-row"><a href="https://ays-pro.com/wordpress-chart-builder-plugin-user-manual" target="_blank"><?php echo esc_html__( "Docs", "chart-builder"); ?></a></span>
771 <span class="ays-chart-footer-slash-row">/</span>
772 <span class="ays-chart-footer-link-row"><a href="https://ays-demo.com/chart-builder-plugin-suggestion-box" target="_blank"><?php echo esc_html__( "Suggest a Feature", "chart-builder"); ?></a></span>
773 </div>
774 <p style="font-size:13px;text-align:center;font-style:italic;">
775 <span style="margin-left:0px;margin-right:10px;" class="ays_heart_beat"><i class="ays_fa ays_fa_heart_o animated"></i></span>
776 <span><?php echo esc_html(__( "If you love our plugin, please do big favor and rate us on", "chart-builder")); ?></span>
777 <a target="_blank" href='https://wordpress.org/support/plugin/chart-builder/reviews/'>WordPress.org</a>
778 <span class="ays_heart_beat"><i class="ays_fa ays_fa_heart_o animated"></i></span>
779 </p>
780 <?php
781 }
782 }
783 }
784
785 // Chart Builder Elementor widget init
786 public function chart_builder_el_widgets_registered() {
787 // We check if the Elementor plugin has been installed / activated.
788 if ( defined( 'ELEMENTOR_PATH' ) && class_exists( 'Elementor\Widget_Base' ) ) {
789 // get our own widgets up and running:
790 // copied from widgets-manager.php
791 if ( class_exists( 'Elementor\Plugin' ) ) {
792 if ( is_callable( 'Elementor\Plugin', 'instance' ) ) {
793 $elementor = Elementor\Plugin::instance();
794 if ( isset( $elementor->widgets_manager ) ) {
795 if ( method_exists( $elementor->widgets_manager, 'register_widget_type' ) ) {
796 wp_enqueue_style($this->plugin_name . '-admin', plugin_dir_url(__FILE__) . 'css/admin.css', array(), $this->version, 'all');
797 $widget_file = 'plugins/elementor/chart-builder-elementor.php';
798 $template_file = locate_template( $widget_file );
799 if ( !$template_file || !is_readable( $template_file ) ) {
800 $template_file = CHART_BUILDER_DIR . 'pb_templates/chart-builder-elementor.php';
801 }
802 if ( $template_file && is_readable( $template_file ) ) {
803 require_once $template_file;
804 Elementor\Plugin::instance()->widgets_manager->register_widget_type( new Elementor\Widget_Chart_Builder_Elementor() );
805 }
806 }
807 }
808 }
809 }
810 }
811 }
812
813 public function fetch_post_type_props(){
814 // phpcs:ignore WordPress.Security.NonceVerification.Recommended
815 $nonce = isset( $_POST['nonce'] ) ? wp_verify_nonce( sanitize_text_field( wp_unslash( $_POST['nonce'] ) ), 'cbuilder-fetch-post-type-props' ) : '';
816 if ( $nonce ) {// phpcs:ignore WordPress.Security.NonceVerification.Recommended
817 $results = isset($_POST['post_type']) ? CBFunctions()->get_post_type_properties( sanitize_text_field( wp_unslash($_POST['post_type']) ) ) : '';
818
819 return array(
820 'success' => true,
821 'fields' => $results,
822 );
823 }
824
825 return array(
826 'success' => false,
827 );
828 }
829
830 public static function get_max_id( $table ) {
831 global $wpdb;
832 $db_table = $wpdb->prefix . CHART_BUILDER_DB_PREFIX . $table;
833
834 $sql = "SELECT MAX(id) FROM {$db_table}";
835
836 $result = intval( $wpdb->get_var( $sql ) );
837
838 return $result;
839 }
840
841 public static function ays_restriction_string($type, $x, $length){
842 $output = "";
843 switch($type){
844 case "char":
845 if(strlen($x)<=$length){
846 $output = $x;
847 } else {
848 $output = substr($x,0,$length) . '...';
849 }
850 break;
851 case "word":
852 $res = explode(" ", $x);
853 if(count($res)<=$length){
854 $output = implode(" ",$res);
855 } else {
856 $res = array_slice($res,0,$length);
857 $output = implode(" ",$res) . '...';
858 }
859 break;
860 }
861 return $output;
862 }
863
864 public function ays_chart_sale_banner(){
865 // if(isset($_POST['ays_chart_sale_btn']) && (isset( $_POST[CHART_BUILDER_NAME . '-sale-banner'] ) && wp_verify_nonce( $_POST[CHART_BUILDER_NAME . '-sale-banner'], CHART_BUILDER_NAME . '-sale-banner' )) && current_user_can( 'manage_options' )) {
866 // update_option('ays_chart_sale_btn', 1);
867 // update_option('ays_chart_sale_date', current_time( 'mysql' ));
868 // }
869
870 $ays_chart_sale_date = get_option('ays_chart_sale_date');
871
872 $val = 60*60*24*5;
873
874 $current_date = current_time( 'mysql' );
875 $date_diff = strtotime($current_date) - intval(strtotime($ays_chart_sale_date)) ;
876
877 $days_diff = $date_diff / $val;
878
879 if(intval($days_diff) > 0 ){
880 update_option('ays_chart_sale_btn', 0);
881 }
882
883 $ays_chart_builder_flag = intval(get_option('ays_chart_sale_btn'));
884 if( $ays_chart_builder_flag == 0 ){
885 // phpcs:ignore WordPress.Security.NonceVerification.Recommended
886 if ( isset( $_GET['page'] ) && strpos( sanitize_text_field( wp_unslash( $_GET['page'] ) ), CHART_BUILDER_NAME ) !== false ) {
887 if( !(Chart_Builder_Admin::get_max_id('charts') <= 2) ){
888 // $this->ays_chart_sale_message20($ays_chart_builder_flag);
889 // $this->ays_chart_discounted_licenses_banner_message();
890 $this->ays_chart_new_silver_bundle_message_2025($ays_chart_builder_flag);
891 // $this->ays_chart_helloween_message($ays_chart_builder_flag);
892 // $this->ays_chart_christmas_message($ays_chart_builder_flag);
893 // $this->ays_chart_silver_bundle_message($ays_chart_builder_flag);
894 // $this->ays_chart_black_friday_message_2024($ays_chart_builder_flag);
895 // $this->ays_chart_christmas_message_2024($ays_chart_builder_flag);
896 // $this->ays_chart_new_halloween_bundle_message_2025($ays_chart_builder_flag);
897 // $this->ays_chart_black_friday_message($ays_chart_builder_flag);
898 // $this->ays_chart_christmas_banner_message_2025($ays_chart_builder_flag);
899 }
900 }
901 }
902 }
903
904 public function ays_chart_dismiss_button(){
905
906 $data = array(
907 'status' => false,
908 );
909
910 if (isset($_REQUEST['action']) && $_REQUEST['action'] == 'ays_chart_dismiss_button') {
911 if ( isset( $_REQUEST['_ajax_nonce'] ) && wp_verify_nonce( sanitize_text_field( wp_unslash( $_REQUEST['_ajax_nonce'] ) ), $this->plugin_name . '-sale-banner' ) && current_user_can( 'manage_options' ) ) {
912 update_option('ays_chart_sale_btn', 1);
913 update_option('ays_chart_sale_date', current_time( 'mysql' ));
914 $data['status'] = true;
915 }
916 }
917
918 ob_end_clean();
919 $ob_get_clean = ob_get_clean();
920 echo json_encode($data);
921 wp_die();
922
923 }
924
925 public function ays_chart_discounted_licenses_banner_message(){
926
927 $content = array();
928
929 $date = time() + (int) ( get_option( 'gmt_offset' ) * HOUR_IN_SECONDS);
930 $now_date = date('M d, Y H:i:s', $date);
931
932 $start_date = strtotime('2025-09-24');
933 $end_date = strtotime('2025-10-25');
934 $diff_end = $end_date - $date;
935
936 $style_attr = '';
937 if( $diff_end < 0 ){
938 $style_attr = 'style="display:none;"';
939 }
940
941 $total_licenses = 50;
942 $progression_pattern = array(3, 2, 1, 4, 2, 3, 1, 2, 4, 3, 2, 1, 3, 2, 4, 1, 3, 2, 2, 3, 1, 2);
943 $days_passed = floor(($date - $start_date) / (24 * 60 * 60));
944 $used_licenses = 0;
945
946 for ($i = 0; $i < min($days_passed, count($progression_pattern)); $i++) {
947 $used_licenses += $progression_pattern[$i];
948 }
949 $used_licenses = min($used_licenses, $total_licenses);
950 $remaining_licenses = $total_licenses - $used_licenses;
951 $progress_percentage = ($used_licenses / $total_licenses) * 100;
952
953 $ays_chart_cta_button_link = esc_url('https://ays-pro.com/wordpress/chart-builder?utm_source=dashboard&utm_medium=chart-free&utm_campaign=chart-maker-license-banner-' . CHART_BUILDER_VERSION);
954
955 $content[] = '<div id="ays-chart-progress-banner-main" class="ays-chart-progress-banner-main ays-chart-admin-notice notice notice-success is-dismissible" ' . $style_attr . '>';
956 $content[] = '<div class="ays-chart-progress-banner-content">';
957 $content[] = '<div class="ays-chart-progress-banner-left">';
958 $content[] = '<div class="ays-chart-progress-banner-icon">';
959 $content[] = '<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
960 <path d="M1.33325 22.6668L11.9999 13.3335L33.3333 14.6668L34.6666 36.0002L25.3333 46.6668C25.3333 46.6668 25.3346 38.6682 17.3333 30.6668C9.33192 22.6655 1.33325 22.6668 1.33325 22.6668Z" fill="#A0041E"/>
961 <path d="M1.29739 46.6665C1.29739 46.6665 1.24939 36.0278 5.27739 31.9998C9.30539 27.9718 20.0001 28.2492 20.0001 28.2492C20.0001 28.2492 19.9987 38.6665 15.9987 42.6665C11.9987 46.6665 1.29739 46.6665 1.29739 46.6665Z" fill="#FFAC33"/>
962 <path d="M11.9986 41.3332C14.9441 41.3332 17.3319 38.9454 17.3319 35.9998C17.3319 33.0543 14.9441 30.6665 11.9986 30.6665C9.0531 30.6665 6.66528 33.0543 6.66528 35.9998C6.66528 38.9454 9.0531 41.3332 11.9986 41.3332Z" fill="#FFCC4D"/>
963 <path d="M47.9986 0C47.9986 0 34.6653 0 18.6653 13.3333C10.6653 20 10.6653 32 13.3319 34.6667C15.9986 37.3333 27.9986 37.3333 34.6653 29.3333C47.9986 13.3333 47.9986 0 47.9986 0Z" fill="#55ACEE"/>
964 <path d="M35.9987 6.6665C33.8347 6.6665 31.9814 7.96117 31.144 9.81317C31.8134 9.5105 32.5507 9.33317 33.332 9.33317C36.2774 9.33317 38.6654 11.7212 38.6654 14.6665C38.6654 15.4478 38.488 16.1852 38.1867 16.8532C40.0387 16.0172 41.332 14.1638 41.332 11.9998C41.332 9.0545 38.944 6.6665 35.9987 6.6665Z" fill="black"/>
965 <path d="M10.6667 37.3332C10.6667 37.3332 10.6667 31.9998 12.0001 30.6665C13.3334 29.3332 29.3347 16.0012 30.6667 17.3332C31.9987 18.6652 18.6654 34.6665 17.3321 35.9998C15.9987 37.3332 10.6667 37.3332 10.6667 37.3332Z" fill="#A0041E"/>
966 </svg>';
967 $content[] = '</div>';
968 $content[] = '<div class="ays-chart-progress-banner-text">';
969 $content[] = '<h2 class="ays-chart-progress-banner-title">' . sprintf( __('Get the Pro Version of %s Chart Builder%s – 20%% OFF', 'chart-builder'), '<a href="'. $ays_chart_cta_button_link .'" target="_blank">', '</a>' ) . '</h2>';
970 $content[] = '<p class="ays-chart-progress-banner-subtitle">' . __('Unlock advanced features + 30 day Money Back Guarantee', 'chart-builder') . '</p>';
971 $content[] = '</div>';
972 $content[] = '</div>';
973
974 $content[] = '<div class="ays-chart-progress-banner-center">';
975 $content[] = '<div class="ays-chart-progress-banner-coupon">';
976 $content[] = '<div class="ays-chart-progress-banner-coupon-box" onclick="chartCopyToClipboard(\'FREE2PRO20\')" title="' . __('Click to copy', 'chart-builder') . '">';
977 $content[] = '<span class="ays-chart-progress-banner-coupon-text">FREE2PRO20</span>';
978 $content[] = '<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="ays-chart-progress-banner-copy-icon">';
979 $content[] = '<path d="M13.5 2.5H6.5C5.67 2.5 5 3.17 5 4V10C5 10.83 5.67 11.5 6.5 11.5H13.5C14.33 11.5 15 10.83 15 10V4C15 3.17 14.33 2.5 13.5 2.5ZM13.5 10H6.5V4H13.5V10ZM2.5 6.5V12.5C2.5 13.33 3.17 14 4 14H10V12.5H4V6.5H2.5Z" fill="white"/>';
980 $content[] = '</svg>';
981 $content[] = '</div>';
982 $content[] = '</div>';
983
984 $content[] = '<div class="ays-chart-progress-banner-progress">';
985 $content[] = '<p class="ays-chart-progress-banner-progress-text">' . __('Only', 'chart-builder') . ' <span id="remaining-licenses">' . $remaining_licenses . '</span> ' . __('of 50 discounted licenses left', 'chart-builder') . '</p>';
986 $content[] = '<div class="ays-chart-progress-banner-progress-bar">';
987 $content[] = '<div class="ays-chart-progress-banner-progress-fill" id="progress-fill" style="width: ' . $progress_percentage . '%;"></div>';
988 $content[] = '</div>';
989 $content[] = '</div>';
990 $content[] = '</div>';
991
992 $content[] = '<div class="ays-chart-progress-banner-right">';
993 $content[] = '<a href="'. $ays_chart_cta_button_link .'" class="ays-chart-progress-banner-upgrade" target="_blank">';
994 $content[] = '<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">';
995 $content[] = '<path d="M14.6392 6.956C14.5743 6.78222 14.4081 6.66667 14.2223 6.66667H8.85565L11.9512 0.648C12.0485 0.458667 11.9983 0.227111 11.8308 0.0955556C11.7499 0.0315556 11.6525 0 11.5556 0C11.4521 0 11.3485 0.0364444 11.2654 0.108L8.00009 2.928L1.48765 8.55244C1.3472 8.67378 1.29653 8.86978 1.36142 9.04356C1.42631 9.21733 1.59209 9.33333 1.77787 9.33333H7.14454L4.04898 15.352C3.95165 15.5413 4.00187 15.7729 4.16942 15.9044C4.25031 15.9684 4.34765 16 4.44453 16C4.54809 16 4.65165 15.9636 4.73476 15.892L8.00009 13.072L14.5125 7.44756C14.6534 7.32622 14.7036 7.13022 14.6392 6.956Z" fill="white"/>';
996 $content[] = '</svg>';
997 $content[] = ' ' . __('Upgrade Now', 'chart-builder');
998 $content[] = '</a>';
999 $content[] = '</div>';
1000 $content[] = '</div>';
1001
1002 if( current_user_can( 'manage_options' ) ){
1003 $content[] = '<div id="ays-chart-dismiss-buttons-content">';
1004 $content[] = '<form action="" method="POST" style="position: absolute; bottom: 0; right: 0; color: #fff;">';
1005 $content[] = '<button class="btn btn-link ays-button" name="ays_chart_sale_btn" style="color: darkgrey; font-size: 11px;">'. __( "Dismiss ad", 'chart-builder' ) .'</button>';
1006 $content[] = wp_nonce_field( CHART_BUILDER_NAME . '-sale-banner' , CHART_BUILDER_NAME . '-sale-banner' );
1007 $content[] = '</form>';
1008 $content[] = '</div>';
1009 }
1010 $content[] = '</div>';
1011
1012 // Fox LMS Pro Banner Styles
1013 $content[] = '<style id="ays-chart-progress-banner-styles-inline-css">';
1014 $content[] = '
1015 .ays-chart-progress-banner-main {
1016 background: linear-gradient(135deg, #6344ED 0%, #8C2ABE 100%);
1017 padding: 20px 30px;
1018 border-radius: 16px;
1019 color: white;
1020 position: relative;
1021 margin: 20px 0;
1022 box-shadow: 0 8px 32px rgba(99, 68, 237, 0.3);
1023 border: 0;
1024 }
1025
1026 .ays-chart-progress-banner-main .ays-chart-progress-banner-content {
1027 display: flex;
1028 align-items: center;
1029 justify-content: space-between;
1030 gap: 30px;
1031 }
1032
1033 .ays-chart-progress-banner-main .ays-chart-progress-banner-left {
1034 display: flex;
1035 align-items: center;
1036 gap: 20px;
1037 flex: 1;
1038 }
1039
1040 .ays-chart-progress-banner-main .ays-chart-progress-banner-center {
1041 display: flex;
1042 align-items: center;
1043 gap: 15px;
1044 flex: 1;
1045 }
1046
1047 .ays-chart-progress-banner-main .ays-chart-progress-banner-right {
1048 display: flex;
1049 align-items: center;
1050 gap: 20px;
1051 flex-shrink: 0;
1052 }
1053
1054 .ays-chart-progress-banner-main .ays-chart-progress-banner-icon {
1055 font-size: 32px;
1056 filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.2));
1057 }
1058
1059 .ays-chart-progress-banner-main .ays-chart-progress-banner-title {
1060 font-size: 21px;
1061 font-weight: 700;
1062 margin: 0 0 8px 0;
1063 line-height: 1.2;
1064 color: #fff;
1065 }
1066
1067 .ays-chart-progress-banner-main .ays-chart-progress-banner-title a {
1068 text-decoration: underline;
1069 color: #fff;
1070 }
1071
1072 .ays-chart-progress-banner-main .ays-chart-progress-banner-subtitle {
1073 font-size: 16px;
1074 margin: 0;
1075 opacity: 0.9;
1076 font-weight: 400;
1077 }
1078
1079 .ays-chart-progress-banner-main .ays-chart-progress-banner-coupon {
1080 margin-bottom: 5px;
1081 }
1082
1083 .ays-chart-progress-banner-main .ays-chart-progress-banner-coupon-box {
1084 border: 2px dotted rgba(255, 255, 255, 0.6);
1085 padding: 8px 16px;
1086 border-radius: 8px;
1087 background: rgba(255, 255, 255, 0.1);
1088 cursor: pointer;
1089 transition: all 0.3s ease;
1090 display: flex;
1091 align-items: center;
1092 gap: 8px;
1093 backdrop-filter: blur(10px);
1094 }
1095
1096 .ays-chart-progress-banner-main .ays-chart-progress-banner-coupon-box:hover {
1097 background: rgba(255, 255, 255, 0.2);
1098 border-color: rgba(255, 255, 255, 0.8);
1099 transform: translateY(-1px);
1100 }
1101
1102 .ays-chart-progress-banner-main .ays-chart-progress-banner-coupon-text {
1103 font-size: 16px;
1104 font-weight: 700;
1105 letter-spacing: 1px;
1106 color: #fff;
1107 font-family: monospace;
1108 }
1109
1110 .ays-chart-progress-banner-main .ays-chart-progress-banner-copy-icon {
1111 opacity: 0.8;
1112 transition: opacity 0.3s ease;
1113 }
1114
1115 .ays-chart-progress-banner-main .ays-chart-progress-banner-coupon-box:hover .ays-chart-progress-banner-copy-icon {
1116 opacity: 1;
1117 }
1118
1119 .ays-chart-progress-banner-main .ays-chart-progress-banner-progress {
1120 text-align: center;
1121 width: 100%;
1122 }
1123
1124 .ays-chart-progress-banner-main .ays-chart-progress-banner-progress-text {
1125 font-size: 14px;
1126 margin: 0 0 10px 0;
1127 opacity: 0.9;
1128 }
1129
1130 .ays-chart-progress-banner-main .ays-chart-progress-banner-progress-bar {
1131 width: 300px;
1132 height: 10px;
1133 background: rgba(255, 255, 255, 0.2);
1134 border-radius: 4px;
1135 overflow: hidden;
1136 margin: 0 auto;
1137 }
1138
1139 .ays-chart-progress-banner-main .ays-chart-progress-banner-progress-fill {
1140 height: 100%;
1141 background: linear-gradient(90deg, #4ADE80 0%, #22C55E 100%);
1142 border-radius: 4px;
1143 transition: width 0.8s ease;
1144 width: 70%;
1145 }
1146
1147 .ays-chart-progress-banner-main .ays-chart-progress-banner-upgrade {
1148 background: linear-gradient(135deg, #F59E0B 0%, #F97316 100%);
1149 color: white;
1150 border: none;
1151 padding: 12px 24px;
1152 border-radius: 8px;
1153 font-size: 16px;
1154 font-weight: 600;
1155 cursor: pointer;
1156 transition: all 0.3s ease;
1157 box-shadow: 0 4px 16px rgba(245, 158, 11, 0.4);
1158 text-decoration: none;
1159 display: inline-flex;
1160 align-items: center;
1161 gap: 8px;
1162 }
1163
1164 .ays-chart-progress-banner-main .ays-chart-progress-banner-upgrade:hover {
1165 transform: translateY(-2px);
1166 box-shadow: 0 6px 20px rgba(245, 158, 11, 0.6);
1167 text-decoration: none;
1168 color: white;
1169 }
1170
1171 .ays-chart-progress-banner-main .notice-dismiss:before {
1172 color: #fff;
1173 }
1174
1175 /* Copy notification */
1176 .ays-chart-copy-notification {
1177 position: fixed;
1178 top: 50%;
1179 left: 50%;
1180 transform: translate(-50%, -50%);
1181 background: rgba(0, 0, 0, 0.8);
1182 color: white;
1183 padding: 12px 24px;
1184 border-radius: 8px;
1185 font-size: 14px;
1186 z-index: 10000;
1187 opacity: 0;
1188 transition: opacity 0.3s ease;
1189 }
1190
1191 .ays-chart-copy-notification.show {
1192 opacity: 1;
1193 }
1194
1195 @media (max-width: 1400px) {
1196 .ays-chart-progress-banner-main .ays-chart-progress-banner-center {
1197 flex-direction: column;
1198 }
1199 }
1200
1201 @media (max-width: 1200px) {
1202 .ays-chart-progress-banner-main .ays-chart-progress-banner-content {
1203 flex-direction: column;
1204 gap: 20px;
1205 }
1206
1207 .ays-chart-progress-banner-main .ays-chart-progress-banner-left {
1208 width: 100%;
1209 justify-content: center;
1210 text-align: center;
1211 flex-direction: column;
1212 }
1213
1214 .ays-chart-progress-banner-main .ays-chart-progress-banner-center {
1215 width: 100%;
1216 }
1217
1218 .ays-chart-progress-banner-main .ays-chart-progress-banner-right {
1219 width: 100%;
1220 justify-content: center;
1221 }
1222 }
1223
1224 @media (max-width: 768px) {
1225 #ays-chart-progress-banner-main {
1226 display: none !important;
1227 }
1228
1229 .ays-chart-progress-banner-main {
1230 padding: 15px 20px;
1231 margin: 15px 0;
1232 }
1233
1234 .ays-chart-progress-banner-main .ays-chart-progress-banner-title {
1235 font-size: 18px;
1236 }
1237
1238 .ays-chart-progress-banner-main .ays-chart-progress-banner-subtitle {
1239 font-size: 14px;
1240 }
1241
1242 .ays-chart-progress-banner-main .ays-chart-progress-banner-progress-bar {
1243 width: 100%;
1244 max-width: 280px;
1245 }
1246
1247 .ays-chart-progress-banner-main .ays-chart-progress-banner-upgrade {
1248 padding: 10px 20px;
1249 font-size: 14px;
1250 }
1251 }
1252
1253 @media (max-width: 480px) {
1254 .ays-chart-progress-banner-main {
1255 padding: 12px 15px;
1256 }
1257
1258 .ays-chart-progress-banner-main .ays-chart-progress-banner-coupon-text {
1259 font-size: 14px;
1260 }
1261
1262 .ays-chart-progress-banner-main .ays-chart-progress-banner-progress-bar {
1263 max-width: 250px;
1264 }
1265 }
1266 ';
1267
1268 $content[] = '</style>';
1269
1270 $content = implode( '', $content );
1271 echo ($content);
1272 }
1273
1274 // 30% Sale Emma
1275 public function ays_chart_sale_message_30_emma($ishmar){
1276 if($ishmar == 0 ){
1277 $content = array();
1278 $content[] = '<div id="ays-chart-new-mega-bundle-dicount-month-main-2024" class="notice notice-success is-dismissible ays_chart_dicount_info">';
1279 $content[] = '<div id="ays-chart-dicount-month" class="ays_chart_dicount_month">';
1280
1281 $content[] = '<div class="ays-chart-discount-box-sale-image"></div>';
1282 $content[] = '<div class="ays-chart-dicount-wrap-box ays-chart-dicount-wrap-text-box">';
1283
1284 $content[] = '<div class="ays-chart-dicount-wrap-text-box-texts">';
1285 $content[] = '<div>
1286 <a href="https://ays-pro.com/wordpress/chart-builder?utm_source=chart-free-dashboard&utm_medium=chart-sale-banner&utm_campaign=chart-sale-plugin-name" target="_blank" style="color:#30499B;">
1287 <span class="ays-chart-new-mega-bundle-limited-text">Limited</span> Offer for Chart Builder </a> <br>
1288 </div>';
1289 $content[] = '</div>';
1290
1291 $content[] = '<div style="font-size: 17px;">';
1292 $content[] = '<img style="width: 24px; height: 24px;" src="' . esc_url(plugins_url('admin/images/icons/guarantee-new.png', dirname(__FILE__))) . '">';// phpcs:ignore PluginCheck.CodeAnalysis.ImageFunctions.NonEnqueuedImage
1293 $content[] = '<span style="padding-left: 4px; font-size: 14px; font-weight: 600;"> 30 Day Money Back Guarantee</span>';
1294
1295 $content[] = '</div>';
1296
1297
1298
1299 $content[] = '<div style="position: absolute;right: 10px;bottom: 1px;" class="ays-chart-dismiss-buttons-container-for-chart">';
1300
1301 $content[] = '<form action="" method="POST">';
1302 $content[] = '<div id="ays-chart-dismiss-buttons-content">';
1303 if( current_user_can( 'manage_options' ) ){
1304 $content[] = '<button class="btn btn-link ays-button" name="ays_chart_sale_btn" style="height: 32px; margin-left: 0;padding-left: 0; color: #30499B;
1305 ">Dismiss ad</button>';
1306 $content[] = wp_nonce_field( $this->plugin_name . '-sale-banner' , $this->plugin_name . '-sale-banner' );
1307 }
1308 $content[] = '</div>';
1309 $content[] = '</form>';
1310
1311 $content[] = '</div>';
1312
1313 $content[] = '</div>';
1314
1315 $content[] = '<div class="ays-chart-dicount-wrap-box ays-chart-dicount-wrap-countdown-box">';
1316
1317 $content[] = '<div id="ays-chart-countdown-main-container">';
1318 $content[] = '<div class="ays-chart-countdown-container">';
1319
1320 $content[] = '<div id="ays-chart-countdown">';
1321
1322 $content[] = '<div style="font-weight: 500;">';
1323 $content[] = __( "Offer ends in:", "chart-builder" );
1324 $content[] = '</div>';
1325
1326 $content[] = '<ul>';
1327 $content[] = '<li><span id="ays-chart-countdown-days"></span>days</li>';
1328 $content[] = '<li><span id="ays-chart-countdown-hours"></span>Hours</li>';
1329 $content[] = '<li><span id="ays-chart-countdown-minutes"></span>Minutes</li>';
1330 $content[] = '<li><span id="ays-chart-countdown-seconds"></span>Seconds</li>';
1331 $content[] = '</ul>';
1332 $content[] = '</div>';
1333
1334 $content[] = '<div id="ays-chart-countdown-content" class="emoji">';
1335 $content[] = '<span>🚀</span>';
1336 $content[] = '<span>⌛</span>';
1337 $content[] = '<span>🔥</span>';
1338 $content[] = '<span>💣</span>';
1339 $content[] = '</div>';
1340
1341 $content[] = '</div>';
1342 $content[] = '</div>';
1343
1344 $content[] = '</div>';
1345
1346 $content[] = '<div class="ays-chart-dicount-wrap-box ays-chart-dicount-wrap-button-box">';
1347 $content[] = '<a href="https://ays-pro.com/wordpress/chart-builder?utm_source=chart-free-dashboard&utm_medium=chart-sale-banner&utm_campaign=chart-sale-button" class="button button-primary ays-button" id="ays-button-top-buy-now" target="_blank">' . __( 'Buy Now !', "chart-builder" ) . '</a>';
1348 $content[] = '<span >One-time payment</span>';
1349 $content[] = '</div>';
1350 $content[] = '</div>';
1351 $content[] = '</div>';
1352
1353 $content = implode( '', $content );
1354 echo wp_kses_post( html_entity_decode( $content, ENT_QUOTES, 'UTF-8' ) );
1355
1356 }
1357 }
1358
1359 // Self 20% sale
1360 public static function ays_chart_sale_message20($ishmar){
1361 if($ishmar == 0 ){
1362 $content = array();
1363
1364 $content[] = '<div id="ays-chart-dicount-month-main" class="notice notice-success is-dismissible ays_chart_dicount_info">';
1365 $content[] = '<div id="ays-chart-dicount-month" class="ays_chart_dicount_month">';
1366 // $content[] = '<a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-chart-sale-banner-link"><img src="' . CHART_BUILDER_ADMIN_URL . '/images/ays_chart_logo.png"></a>';
1367
1368 $content[] = '<div class="ays-chart-dicount-wrap-box ays-chart-dicount-wrap-text-box">';
1369
1370 $content[] = '<div class="ays-chart-dicount-sale-name-discount-box">';
1371 $content[] = '<span class="ays-chart-new-chart-pro-title">';
1372 // Translators: %s is the URL to the Chart Builder plugin page.
1373 $content[] = sprintf(
1374 /* translators: %s is the Chart Builder plugin URL. */
1375 __(
1376 "<span><a href='%s' target='_blank' style='color:#ffffff; text-decoration: underline;'>Chart Builder</a></span>",
1377 'chart-builder'
1378 ),
1379 "https://ays-pro.com/wordpress/chart-builder?utm_source=chart-free-dashboard&utm_medium=chart-sale-banner&utm_campaign=chart-sale-plugin-name" . CHART_BUILDER_VERSION
1380 );
1381 $content[] = '</span>';
1382 $content[] = '<div>';
1383 $content[] = '<img src="' . esc_url(plugins_url('admin/images/ays-chart-banner-sale-30.svg', dirname(__FILE__))) . '" style="width: 70px;">';// phpcs:ignore PluginCheck.CodeAnalysis.ImageFunctions.NonEnqueuedImage
1384 $content[] = '</div>';
1385 $content[] = '</div>';
1386
1387 $content[] = '<span class="ays-chart-new-chart-pro-desc">';
1388 $content[] = '<img class="ays-chart-new-chart-pro-guaranteeicon" src="' . esc_url(plugins_url('admin/images/chart-builder-guaranteeicon.webp', dirname(__FILE__))) . '" style="width: 30px;">'; // phpcs:ignore PluginCheck.CodeAnalysis.ImageFunctions.NonEnqueuedImage
1389 $content[] = esc_html__( "30 Days Money Back Guarantee", 'chart-builder' );
1390 $content[] = '</span>';
1391
1392 $content[] = '<div style="position: absolute;right: 10px;bottom: 1px;" class="ays-chart-dismiss-buttons-container-for-chart">';
1393 $content[] = '<form method="POST">';
1394 $content[] = '<div id="ays-chart-dismiss-buttons-content">';
1395 if (current_user_can( 'manage_options' )) {
1396 $content[] = '<button class="btn btn-link ays-button" name="ays_chart_sale_btn" style="height: 32px; margin-left: 0;padding-left: 0">Dismiss ad</button>';
1397 $content[] = wp_nonce_field( CHART_BUILDER_NAME . '-sale-banner' , CHART_BUILDER_NAME . '-sale-banner' );
1398 }
1399 $content[] = '</div>';
1400 $content[] = '</form>';
1401 $content[] = '</div>';
1402
1403 $content[] = '</div>';
1404
1405 $content[] = '<div class="ays-chart-dicount-wrap-box ays-chart-dicount-wrap-countdown-box">';
1406
1407 $content[] = '<div id="ays-chart-countdown-main-container">';
1408 $content[] = '<div class="ays-chart-countdown-container">';
1409 $content[] = '<div id="ays-chart-countdown" style="display: block;">';
1410 $content[] = esc_html__( "Offer ends in:", 'chart-builder' );
1411
1412 $content[] = '<ul style="padding: 0">';
1413 $content[] = '<li><span id="ays-chart-countdown-days">0</span>' . esc_html__( 'Days', 'chart-builder' ) . '</li>';
1414 $content[] = '<li><span id="ays-chart-countdown-hours">0</span>' . esc_html__( 'Hours', 'chart-builder' ) . '</li>';
1415 $content[] = '<li><span id="ays-chart-countdown-minutes">0</span>' . esc_html__( 'Minutes', 'chart-builder' ) . '</li>';
1416 $content[] = '<li><span id="ays-chart-countdown-seconds">0</span>' . esc_html__( 'Seconds', 'chart-builder' ) . '</li>';
1417 $content[] = '</ul>';
1418 $content[] = '</div>';
1419
1420 $content[] = '<div id="ays-chart-countdown-content" class="emoji" style="display: none;">';
1421 $content[] = '<span>🚀</span>';
1422 $content[] = '<span>⌛</span>';
1423 $content[] = '<span>🔥</span>';
1424 $content[] = '<span>💣</span>';
1425 $content[] = '</div>';
1426 $content[] = '</div>';
1427 $content[] = '</div>';
1428
1429 $content[] = '</div>';
1430
1431 $content[] = '<div class="ays-chart-dicount-wrap-box ays-chart-dicount-wrap-button-box">';
1432 $content[] = '<a href="https://ays-pro.com/wordpress/chart-builder?utm_source=chart-free-dashboard&utm_medium=chart-sale-banner&utm_campaign=chart-sale-button'.CHART_BUILDER_VERSION.'" class="button button-primary ays-button" id="ays-button-top-buy-now" target="_blank" style="" >' . esc_html__( 'Buy Now', 'chart-builder' ) . '</a>';
1433 $content[] = '<span class="ays-chart-dicount-one-time-text">';
1434 $content[] = esc_html__( "One-time payment", 'chart-builder' );
1435 $content[] = '</span>';
1436 $content[] = '</div>';
1437
1438 $content[] = '</div>';
1439
1440 $content[] = '</div>';
1441
1442 $content = implode( '', $content );
1443 echo wp_kses_post( html_entity_decode( $content, ENT_QUOTES, 'UTF-8' ) );
1444 }
1445 }
1446
1447 // Helloween banner
1448 public static function ays_chart_helloween_message($ishmar){
1449 if($ishmar == 0 ){
1450 $content = array();
1451
1452 $content[] = '<div id="ays-chart-dicount-month-main-helloween" class="notice notice-success is-dismissible ays_chart_dicount_info">';
1453 $content[] = '<div id="ays-chart-dicount-month-helloween" class="ays_chart_dicount_month_helloween">';
1454 $content[] = '<div class="ays-chart-dicount-wrap-box-helloween-limited">';
1455
1456 $content[] = '<p>';
1457 $content[] = __( "Limited Time
1458 <span class='ays-chart-dicount-wrap-color-helloween' style='color:#b2ff00;'>30%</span>
1459 <span>
1460 SALE on
1461 </span>
1462 <br>
1463 <span style='' class='ays-chart-helloween-bundle'>
1464 <a href='https://ays-pro.com/wordpress/chart-builder?utm_source=dashboard&utm_medium=chart-free&utm_campaign=helloween-sale-banner' target='_blank' class='ays-chart-dicount-wrap-color-helloween ays-chart-dicount-wrap-text-decoration-helloween' style='display:block; color:#b2ff00;margin-right:6px;'>
1465 Chart Builder
1466 </a>
1467 </span>", 'chart-builder' );
1468 $content[] = '</p>';
1469 $content[] = '<p>';
1470 $content[] = __( "Hurry up!
1471 <a href='https://ays-pro.com/wordpress/chart-builder?utm_source=dashboard&utm_medium=chart-free&utm_campaign=helloween-sale-banner' target='_blank' style='color:#ffc700;'>
1472 Check it out!
1473 </a>", 'chart-builder' );
1474 $content[] = '</p>';
1475
1476 $content[] = '</div>';
1477
1478
1479 $content[] = '<div class="ays-chart-helloween-bundle-buy-now-timer">';
1480 $content[] = '<div class="ays-chart-dicount-wrap-box-helloween-timer">';
1481 $content[] = '<div id="ays-chart-countdown-main-container" class="ays-chart-countdown-main-container-helloween">';
1482 $content[] = '<div class="ays-chart-countdown-container-helloween">';
1483 $content[] = '<div id="ays-chart-countdown">';
1484 $content[] = '<ul>';
1485 $content[] = '<li><p><span id="ays-chart-countdown-days"></span><span>days</span></p></li>';
1486 $content[] = '<li><p><span id="ays-chart-countdown-hours"></span><span>Hours</span></p></li>';
1487 $content[] = '<li><p><span id="ays-chart-countdown-minutes"></span><span>Mins</span></p></li>';
1488 $content[] = '<li><p><span id="ays-chart-countdown-seconds"></span><span>Secs</span></p></li>';
1489 $content[] = '</ul>';
1490 $content[] = '</div>';
1491
1492 $content[] = '<div id="ays-chart-countdown-content" class="emoji">';
1493 $content[] = '<span>🚀</span>';
1494 $content[] = '<span>⌛</span>';
1495 $content[] = '<span>🔥</span>';
1496 $content[] = '<span>💣</span>';
1497 $content[] = '</div>';
1498
1499 $content[] = '</div>';
1500
1501 $content[] = '</div>';
1502
1503 $content[] = '</div>';
1504 $content[] = '<div class="ays-chart-dicount-wrap-box ays-buy-now-button-box-helloween">';
1505 $content[] = '<a href="https://ays-pro.com/wordpress/chart-builder?utm_source=dashboard&utm_medium=chart-free&utm_campaign=helloween-sale-banner" class="button button-primary ays-buy-now-button-helloween" id="ays-button-top-buy-now-helloween" target="_blank" style="" >' . __( 'Buy Now !', 'chart-builder' ) . '</a>';
1506 $content[] = '</div>';
1507 $content[] = '</div>';
1508
1509 $content[] = '</div>';
1510
1511 $content[] = '<div style="position: absolute;right: 0;bottom: 1px;" class="ays-chart-dismiss-buttons-container-for-form-helloween">';
1512 $content[] = '<form method="POST">';
1513 $content[] = '<div id="ays-chart-dismiss-buttons-content-helloween">';
1514 if( current_user_can( 'manage_options' ) ){
1515 $content[] = '<button class="btn btn-link ays-button-helloween" name="ays_chart_sale_btn" style="height: 32px; margin-left: 0;padding-left: 0">Dismiss ad</button>';
1516 $content[] = wp_nonce_field( CHART_BUILDER_NAME . '-sale-banner' , CHART_BUILDER_NAME . '-sale-banner' );
1517 }
1518 $content[] = '</div>';
1519 $content[] = '</form>';
1520
1521 $content[] = '</div>';
1522 // $content[] = '<button type="button" class="notice-dismiss">';
1523 // $content[] = '</button>';
1524 $content[] = '</div>';
1525
1526 $content = implode( '', $content );
1527
1528 echo wp_kses_post( html_entity_decode( $content, ENT_QUOTES, 'UTF-8' ) );
1529 }
1530 }
1531
1532 // Christmas banner
1533 public static function ays_chart_christmas_message($ishmar){
1534 if($ishmar == 0 ){
1535 $content = array();
1536
1537 $content[] = '<div id="ays-chart-dicount-christmas-month-main" class="notice notice-success is-dismissible ays_chart_dicount_info">';
1538 $content[] = '<div id="ays-chart-dicount-christmas-month" class="ays_chart_dicount_month">';
1539 $content[] = '<div class="ays-chart-dicount-christmas-box">';
1540 $content[] = '<div class="ays-chart-dicount-christmas-wrap-box ays-chart-dicount-christmas-wrap-box-80">';
1541 $content[] = '<div class="ays-chart-dicount-christmas-title-row">' . __( 'Limited Time', 'chart-builder' ) .' '. '<a href="https://ays-pro.com/wordpress/chart-builder" class="ays-chart-dicount-christmas-button-sale" target="_blank">' . __( '40%', 'chart-builder' ) . '</a>' . ' SALE</div>';
1542 $content[] = '<div class="ays-chart-dicount-christmas-title-row">' . __( 'Chart Builder Plugin', 'chart-builder' ) . '</div>';
1543 $content[] = '</div>';
1544
1545 $content[] = '<div class="ays-chart-dicount-christmas-wrap-box" style="width: 25%;">';
1546 $content[] = '<div id="ays-chart-countdown-main-container">';
1547 $content[] = '<div class="ays-chart-countdown-container">';
1548 $content[] = '<div id="ays-chart-countdown" style="display: block;">';
1549 $content[] = '<ul>';
1550 $content[] = '<li><span id="ays-chart-countdown-days"></span>' . __( 'Days', 'chart-builder' ) . '</li>';
1551 $content[] = '<li><span id="ays-chart-countdown-hours"></span>' . __( 'Hours', 'chart-builder' ) . '</li>';
1552 $content[] = '<li><span id="ays-chart-countdown-minutes"></span>' . __( 'Minutes', 'chart-builder' ) . '</li>';
1553 $content[] = '<li><span id="ays-chart-countdown-seconds"></span>' . __( 'Seconds', 'chart-builder' ) . '</li>';
1554 $content[] = '</ul>';
1555 $content[] = '</div>';
1556 $content[] = '<div id="ays-chart-countdown-content" class="emoji" style="display: none;">';
1557 $content[] = '<span>🚀</span>';
1558 $content[] = '<span>⌛</span>';
1559 $content[] = '<span>🔥</span>';
1560 $content[] = '<span>💣</span>';
1561 $content[] = '</div>';
1562 $content[] = '</div>';
1563 $content[] = '</div>';
1564 $content[] = '</div>';
1565
1566 $content[] = '<div class="ays-chart-dicount-christmas-wrap-box" style="width: 25%;">';
1567 $content[] = '<a href="https://ays-pro.com/wordpress/chart-builder" class="ays-chart-dicount-christmas-button-buy-now" target="_blank">' . __( 'BUY NOW!', 'chart-builder' ) . '</a>';
1568 $content[] = '</div>';
1569 $content[] = '</div>';
1570 $content[] = '</div>';
1571
1572 $content[] = '<div style="position: absolute;right: 0;bottom: 1px;" class="ays-chart-dismiss-buttons-container-for-form-christmas">';
1573 $content[] = '<form method="POST">';
1574 $content[] = '<div id="ays-chart-dismiss-buttons-content-christmas">';
1575 $content[] = '<button class="btn btn-link ays-button-christmas" name="ays_chart_sale_btn" style="">' . __( 'Dismiss ad', 'chart-builder' ) . '</button>';
1576 $content[] = '</div>';
1577 $content[] = '</form>';
1578 $content[] = '</div>';
1579 $content[] = '</div>';
1580
1581 $content = implode( '', $content );
1582
1583 echo wp_kses_post( html_entity_decode( $content, ENT_QUOTES, 'UTF-8' ) );
1584 }
1585 }
1586
1587 // Silver Bundle
1588 public function ays_chart_silver_bundle_message($ishmar){
1589 if($ishmar == 0 ){
1590 $content = array();
1591
1592 $content[] = '<div id="ays-chart-dicount-month-main" class="notice notice-success is-dismissible ays_chart_dicount_info">';
1593 $content[] = '<div id="ays-chart-dicount-month" class="ays_chart_dicount_month">';
1594 $content[] = '<a href="https://ays-pro.com/silver-bundle" target="_blank" class="ays-chart-sale-banner-link"><img src="' . esc_url(plugins_url('/images/silver_bundle_logo_box.png', dirname(__FILE__))) . '"></a>';// phpcs:ignore PluginCheck.CodeAnalysis.ImageFunctions.NonEnqueuedImage
1595
1596 $content[] = '<div class="ays-chart-dicount-wrap-box">';
1597
1598 $content[] = '<strong style="font-weight: bold;">';
1599 $content[] = __( "Limited Time <span style='color:#E85011;'>50%</span> SALE on <br><span><a href='https://ays-pro.com/silver-bundle' target='_blank' style='color:#E85011; text-decoration: underline;'>Silver Bundle</a></span> (Quiz + Chart + Form)!", 'chart-builder' );
1600 $content[] = '</strong>';
1601
1602 $content[] = '<br>';
1603
1604 $content[] = '<strong>';
1605 $content[] = __( "Hurry up! <a href='https://ays-pro.com/silver-bundle' target='_blank'>Check it out!</a>", 'chart-builder' );
1606 $content[] = '</strong>';
1607
1608 $content[] = '<div style="position: absolute;right: 10px;bottom: 1px;" class="ays-chart-dismiss-buttons-container-for-form">';
1609
1610 $content[] = '<form method="POST">';
1611 $content[] = '<div id="ays-chart-dismiss-buttons-content">';
1612 $content[] = '<button class="btn btn-link ays-button" name="ays_chart_sale_btn" style="height: 32px; margin-left: 0;padding-left: 0">Dismiss ad</button>';
1613 $content[] = '</div>';
1614 $content[] = '</form>';
1615
1616 $content[] = '</div>';
1617
1618 $content[] = '</div>';
1619
1620 $content[] = '<div class="ays-chart-dicount-wrap-box">';
1621
1622 $content[] = '<div id="ays-chart-countdown-main-container">';
1623 $content[] = '<div class="ays-chart-countdown-container">';
1624
1625 $content[] = '<div id="ays-chart-countdown">';
1626 $content[] = '<ul>';
1627 $content[] = '<li><span id="ays-chart-countdown-days"></span>days</li>';
1628 $content[] = '<li><span id="ays-chart-countdown-hours"></span>Hours</li>';
1629 $content[] = '<li><span id="ays-chart-countdown-minutes"></span>Minutes</li>';
1630 $content[] = '<li><span id="ays-chart-countdown-seconds"></span>Seconds</li>';
1631 $content[] = '</ul>';
1632 $content[] = '</div>';
1633
1634 $content[] = '<div id="ays-chart-countdown-content" class="emoji">';
1635 $content[] = '<span>🚀</span>';
1636 $content[] = '<span>⌛</span>';
1637 $content[] = '<span>🔥</span>';
1638 $content[] = '<span>💣</span>';
1639 $content[] = '</div>';
1640
1641 $content[] = '</div>';
1642 $content[] = '</div>';
1643
1644 $content[] = '</div>';
1645
1646 $content[] = '<a href="https://ays-pro.com/silver-bundle" class="button button-primary ays-button" id="ays-button-top-buy-now" target="_blank" style="height: 32px; display: flex; align-items: center; font-weight: 500; " >' . __( 'Buy Now !', 'chart-builder' ) . '</a>';
1647 $content[] = '</div>';
1648 $content[] = '</div>';
1649
1650 $content = implode( '', $content );
1651 echo wp_kses_post( html_entity_decode( $content, ENT_QUOTES, 'UTF-8' ) );
1652 }
1653 }
1654
1655 //silver bundle
1656 public function ays_chart_new_silver_bundle_message_2025($ishmar){
1657 $content = array();
1658
1659 $date = time() + (int) ( get_option( 'gmt_offset' ) * HOUR_IN_SECONDS);
1660 $now_date = date('M d, Y H:i:s', $date);
1661
1662 $chart_banner_date = strtotime( $this->ays_chart_update_banner_time() );
1663
1664 $diff = $chart_banner_date - $date;
1665
1666 $style_attr = '';
1667 if( $diff < 0 ){
1668 $style_attr = 'style="display:none;"';
1669 }
1670
1671 $chart_cta_button_link = esc_url( 'https://ays-pro.com/silver-bundle?utm_source=dashboard&utm_medium=chart-free&utm_campaign=silver-bundle-sale-banner-' . CHART_BUILDER_VERSION );
1672
1673 $content[] = '<div id="ays-chart-new-silver-bundle-dicount-month-main" class="ays-chart-admin-notice notice notice-success is-dismissible ays_chart_dicount_info">';
1674 $content[] = '<div id="ays-chart-dicount-month" class="ays_chart_dicount_month">';
1675
1676 $content[] = '<div class="ays-chart-dicount-wrap-box ays-chart-dicount-wrap-text-box">';
1677 $content[] = '<div>';
1678 $content[] = '<div class="ays-chart-dicount-logo-box">';
1679 $content[] = '<a href="' . $chart_cta_button_link . '" target="_blank" class="ays-chart-sale-banner-link"><img src="' . CHART_BUILDER_ADMIN_URL . '/images/mega_bundle_logo_box.webp"></a>';
1680
1681 $content[] = '<div>';
1682 $content[] = '<span class="ays-chart-new-silver-bundle-title">';
1683 $content[] = sprintf(
1684 /* translators: 1: opening link wrapper with <a> tag, 2: closing </a> tag */
1685 __( '%1$s Silver Bundle %2$s (Quiz + Form + Chart)', 'chart-builder' ),
1686 '<span style="display:inline-block; margin-right:5px;"><a href="' . esc_url( $chart_cta_button_link ) . '" target="_blank" rel="noopener noreferrer" style="color:#ffffff !important; text-decoration: underline;">',
1687 '</a></span>'
1688 );
1689 $content[] = '</span>';
1690 $content[] = '</br>';
1691 $content[] = '<span class="ays-chart-new-silver-bundle-desc">';
1692 $content[] = __( "30 Day Money Back Guarantee", 'chart-builder' );
1693 $content[] = '</span>';
1694 $content[] = '</div>';
1695
1696 $content[] = '<div class="ays-chart-new-silver-bundle-title-icon-row" style="display: inline-block;">';
1697 $content[] = '<img src="' . CHART_BUILDER_ADMIN_URL . '/images/ays-chart-banner-50.svg" class="ays-chart-new-silver-bundle-mobile-image-display-none" style="width: 70px;">';
1698 $content[] = '</div>';
1699
1700 $content[] = '</div>';
1701
1702 $content[] = '<div class="ays-chart-new-silver-bundle-mobile-image-display-block display_none">';
1703 $content[] = '<img src="' . CHART_BUILDER_ADMIN_URL . '/images/ays-chart-banner-50.svg" style="width: 70px;">';
1704 $content[] = '</div>';
1705 $content[] = '</div>';
1706
1707 $content[] = '<div style="position: absolute;right: 10px;bottom: 1px;" class="ays-chart-dismiss-buttons-container-for-form">';
1708
1709 $content[] = '<form action="" method="POST">';
1710 $content[] = '<div id="ays-chart-dismiss-buttons-content">';
1711 if( current_user_can( 'manage_options' ) ){
1712 $content[] = '<button class="btn btn-link ays-button" name="ays_chart_sale_btn" style="height: 32px; margin-left: 0;padding-left: 0">'. __( "Dismiss ad", 'chart-builder' ) .'</button>';
1713 $content[] = wp_nonce_field( CHART_BUILDER_NAME . '-sale-banner' , CHART_BUILDER_NAME . '-sale-banner' );
1714 }
1715 $content[] = '</div>';
1716 $content[] = '</form>';
1717
1718 $content[] = '</div>';
1719
1720 $content[] = '</div>';
1721
1722 $content[] = '<div class="ays-chart-dicount-wrap-box ays-chart-dicount-wrap-countdown-box">';
1723
1724 $content[] = '<div id="ays-chart-maker-countdown-main-container">';
1725 $content[] = '<div class="ays-chart-maker-countdown-container">';
1726
1727 $content[] = '<div ' . $style_attr . ' id="ays-chart-countdown">';
1728
1729 $content[] = '<ul>';
1730
1731 $content[] = '<li><span id="ays-chart-countdown-days"></span></li>';
1732 $content[] = '<li><span id="ays-chart-countdown-hours"></span></li>';
1733 $content[] = '<li><span id="ays-chart-countdown-minutes"></span></li>';
1734 $content[] = '<li><span id="ays-chart-countdown-seconds"></span></li>';
1735 $content[] = '</ul>';
1736 $content[] = '</div>';
1737
1738 $content[] = '<div id="ays-chart-countdown-content" class="emoji">';
1739 $content[] = '</div>';
1740
1741 $content[] = '</div>';
1742 $content[] = '</div>';
1743
1744 $content[] = '</div>';
1745
1746 $content[] = '<div class="ays-chart-dicount-wrap-box ays-chart-dicount-wrap-button-box">';
1747 $content[] = '<a href="'. $chart_cta_button_link .'" class="button button-primary ays-button" id="ays-button-top-buy-now" target="_blank">' . __( 'Buy Now', 'chart-builder' ) . '</a>';
1748 $content[] = '<span class="ays-chart-dicount-one-time-text">';
1749 $content[] = __( "One-time payment", 'chart-builder' );
1750 $content[] = '</span>';
1751 $content[] = '</div>';
1752 $content[] = '</div>';
1753 $content[] = '</div>';
1754
1755 // /* New Mega Bundle Banner Quiz | Start */
1756 $content[] = '<style id="ays-chart-mega-bundle-styles-inline-css">';
1757 $content[] = '
1758 div#ays-chart-new-silver-bundle-dicount-month-main{border:0;background:#fff;border-radius:20px;box-shadow:unset;position:relative;z-index:1;min-height:80px}div#ays-chart-new-silver-bundle-dicount-month-main.ays_chart_dicount_info button{display:flex;align-items:center}div#ays-chart-new-silver-bundle-dicount-month-main div#ays-chart-dicount-month a.ays-chart-sale-banner-link:focus{outline:0;box-shadow:0}div#ays-chart-new-silver-bundle-dicount-month-main .btn-link{color:#007bff;background-color:transparent;display:inline-block;font-weight:400;text-align:center;white-space:nowrap;vertical-align:middle;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border:1px solid transparent;padding:.375rem .75rem;font-size:1rem;line-height:1.5;border-radius:.25rem}div#ays-chart-new-silver-bundle-dicount-month-main.ays_chart_dicount_info{background-image:url("'. CHART_BUILDER_ADMIN_URL .'/images/chart-builder-banner-background-50.svg");background-position:center right;background-repeat:no-repeat;background-size:cover;background-color:#5551ff;padding:1px 38px 1px 12px}#ays-chart-new-silver-bundle-dicount-month-main .ays_chart_dicount_month{display:flex;align-items:center;justify-content:space-between;color:#fff}#ays-chart-new-silver-bundle-dicount-month-main .ays_chart_dicount_month img{width:60px}#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-sale-banner-link{display:flex;justify-content:center;align-items:center;width:60px}#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box{font-size:14px;padding:12px;text-align:center}#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box.ays-chart-dicount-wrap-text-box{text-align:left;width:auto;display:flex;justify-content:space-around;align-items:flex-start}#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box.ays-chart-dicount-wrap-countdown-box{width:30%;display:flex;justify-content:center;align-items:center}#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box.ays-chart-dicount-wrap-button-box{width:20%;display:flex;justify-content:center;align-items:center;flex-direction:column}#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box .ays-chart-dicount-logo-box{display:flex;justify-content:flex-start;align-items:center;gap:20px}#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box.ays-chart-dicount-wrap-text-box .ays-chart-new-silver-bundle-title{color:#fdfdfd;font-size:19px;font-style:normal;font-weight:600;line-height:normal}#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box.ays-chart-dicount-wrap-text-box .ays-chart-new-silver-bundle-title-icon-row{display:inline-block}#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box.ays-chart-dicount-wrap-text-box .ays-chart-new-silver-bundle-desc{display:inline-block;color:#fff;font-size:15px;font-style:normal;font-weight:400;line-height:normal;margin-top:10px}#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box strong{font-size:17px;font-weight:700;letter-spacing:.8px}#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-color{color:#971821}#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-text-decoration{text-decoration:underline}#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box.ays-buy-now-button-box{display:flex;justify-content:flex-end;align-items:center;width:30%}#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box .ays-button,#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box .ays-buy-now-button{align-items:center;font-weight:500}#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box .ays-buy-now-button{background:#971821;border-color:#fff;display:flex;justify-content:center;align-items:center;padding:5px 15px;font-size:16px;border-radius:5px}#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box .ays-buy-now-button:hover{background:#7d161d;border-color:#971821}#ays-chart-new-silver-bundle-dicount-month-main #ays-chart-dismiss-buttons-content{display:flex;justify-content:center}#ays-chart-new-silver-bundle-dicount-month-main #ays-chart-dismiss-buttons-content .ays-button{margin:0!important;font-size:13px;color:#fff}#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-opacity-box{width:19%}#ays-chart-new-silver-bundle-dicount-month-main .ays-buy-now-opacity-button{padding:40px 15px;display:flex;justify-content:center;align-items:center;opacity:0}#ays-chart-maker-countdown-main-container .ays-chart-maker-countdown-container{margin:0 auto;text-align:center}#ays-chart-maker-countdown-main-container #ays-chart-countdown-headline{letter-spacing:.125rem;text-transform:uppercase;font-size:18px;font-weight:400;margin:0;padding:9px 0 4px;line-height:1.3}#ays-chart-maker-countdown-main-container li,#ays-chart-maker-countdown-main-container ul{margin:0}#ays-chart-maker-countdown-main-container li{display:inline-block;font-size:14px;list-style-type:none;padding:14px;text-transform:lowercase}#ays-chart-maker-countdown-main-container li span{display:flex;justify-content:center;align-items:center;font-size:22px;min-height:40px;min-width:40px;border-radius:4.273px;border:.534px solid #f4f4f4;background:#9896ed;color:#fff}#ays-chart-maker-countdown-main-container .emoji{display:none;padding:1rem}#ays-chart-maker-countdown-main-container .emoji span{font-size:30px;padding:0 .5rem}#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box li{position:relative}#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box li span:after{content:":";color:#fff;position:absolute;top:0;right:-5px;font-size:40px}#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box li span#ays-chart-countdown-seconds:after{content:unset}#ays-chart-new-silver-bundle-dicount-month-main #ays-button-top-buy-now{display:flex;align-items:center;border-radius:6.409px;background:#f66123;padding:12px 32px;color:#fff;font-size:15px;font-style:normal;line-height:normal;margin:0!important}div#ays-chart-new-silver-bundle-dicount-month-main button.notice-dismiss:before{color:#fff;content:"\f00d";font-family:fontawesome;font-size:22px}#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-new-silver-bundle-guaranteeicon{width:30px;margin-right:5px}#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-one-time-text{color:#fff;font-size:12px;font-style:normal;font-weight:600;line-height:normal}@media all and (max-width:768px){div#ays-chart-new-silver-bundle-dicount-month-main.ays_chart_dicount_info.notice{display:none!important;background-position:bottom right;background-repeat:no-repeat;background-size:cover;border-radius:32px}div#ays-chart-new-silver-bundle-dicount-month-main{padding-right:0}div#ays-chart-new-silver-bundle-dicount-month-main .ays_chart_dicount_month{display:flex;align-items:center;justify-content:space-between;align-content:center;flex-wrap:wrap;flex-direction:column;padding:10px 0}div#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box{width:100%!important;text-align:center}#ays-chart-maker-countdown-main-container #ays-chart-countdown-headline{font-size:15px;font-weight:600}#ays-chart-maker-countdown-main-container ul{font-weight:500}div#ays-chart-maker-countdown-main-container li{padding:10px}div#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-new-silver-bundle-mobile-image-display-none{display:none!important}div#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-new-silver-bundle-mobile-image-display-block{display:block!important;margin-top:5px}div#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box.ays-chart-dicount-wrap-text-box{width:100%!important;text-align:center;flex-direction:column;margin-top:20px;justify-content:center;align-items:center}div#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box li span:after{top:unset}div#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box.ays-chart-dicount-wrap-countdown-box{width:100%;display:flex;justify-content:center;align-items:center}#ays-chart-new-silver-bundle-dicount-month-main .ays-button{margin:0 auto!important}#ays-chart-new-silver-bundle-dicount-month-main #ays-chart-dismiss-buttons-content .ays-button{padding-left:unset!important}div#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box.ays-buy-now-button-box{justify-content:center}div#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box .ays-buy-now-button{font-size:14px;padding:5px 10px}div#ays-chart-new-silver-bundle-dicount-month-main .ays-buy-now-opacity-button{display:none}#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dismiss-buttons-container-for-form{position:static!important}.comparison .product img{width:70px}.ays-chart-features-wrap .comparison a.price-buy{padding:8px 5px;font-size:11px}}@media screen and (max-width:1350px) and (min-width:768px){div#ays-chart-new-silver-bundle-dicount-month-main.ays_chart_dicount_info.notice{background-position:bottom right;background-repeat:no-repeat;background-size:cover}div#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box strong{font-size:15px}#ays-chart-maker-countdown-main-container li{font-size:11px}div#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-opacity-box{display:none}}@media screen and (max-width:1680px) and (min-width:1551px){div#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box.ays-chart-dicount-wrap-text-box{width:29%}div#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box.ays-chart-dicount-wrap-countdown-box{width:30%}}@media screen and (max-width:1410px){#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-coupon-row{width:150px}}@media screen and (max-width:1550px) and (min-width:1400px){div#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box.ays-chart-dicount-wrap-countdown-box{width:35%}}@media screen and (max-width:1400px) and (min-width:1250px){div#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box.ays-chart-dicount-wrap-countdown-box{width:35%}div#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box.ays-chart-dicount-wrap-text-box{width:40%}}@media screen and (max-width:1274px){#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box.ays-chart-dicount-wrap-text-box .ays-chart-new-silver-bundle-title{font-size:15px}}@media screen and (max-width:1200px){#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box.ays-chart-dicount-wrap-button-box{margin-bottom:16px}#ays-chart-maker-countdown-main-container ul{padding-left:0}#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-coupon-row{width:120px;font-size:18px}#ays-chart-new-silver-bundle-dicount-month-main #ays-button-top-buy-now{padding:12px 20px}#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box{font-size:12px}#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box.ays-chart-dicount-wrap-text-box .ays-chart-new-silver-bundle-desc{font-size:13px}}@media screen and (max-width:1076px) and (min-width:769px){#ays-chart-maker-countdown-main-container li{padding:10px}#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-coupon-row{width:100px;font-size:16px}#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box.ays-chart-dicount-wrap-button-box{margin-bottom:16px}#ays-chart-new-silver-bundle-dicount-month-main #ays-button-top-buy-now{padding:12px 15px}#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box{font-size:11px;padding:12px 0}}@media screen and (max-width:1250px) and (min-width:769px){div#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box.ays-chart-dicount-wrap-countdown-box{width:45%}div#ays-chart-new-silver-bundle-dicount-month-main .ays-chart-dicount-wrap-box.ays-chart-dicount-wrap-text-box{width:35%}}';
1759 $content[] = '</style>';
1760 // /* New Mega Bundle Banner Quiz | End */
1761
1762 $content = implode( '', $content );
1763 echo ($content);
1764 }
1765
1766 // Christmas Top Banner 2024
1767 public function ays_chart_christmas_message_2024($ishmar){
1768 if($ishmar == 0 ){
1769 $content = array();
1770
1771 $content[] = '<div id="ays-chart-christmas-top-bundle-dicount-month-main" class="notice notice-success is-dismissible ays_chart_dicount_info">';
1772 $content[] = '<div id="ays-chart-dicount-month" class="ays_chart_dicount_month">';
1773
1774 $content[] = '<div class="ays-chart-dicount-wrap-box ays-chart-dicount-wrap-countdown-box">';
1775
1776 $content[] = '<div id="ays-chart-countdown-main-container">';
1777 $content[] = '<div class="ays-chart-countdown-container">';
1778
1779 $content[] = '<div id="ays-chart-countdown">';
1780
1781 $content[] = '<div>';
1782 $content[] = __( "Offer ends in:", 'chart-builder' );
1783 $content[] = '</div>';
1784
1785 $content[] = '<ul style="padding-left: 0;">';
1786 $content[] = '<li><span id="ays-chart-countdown-days"></span>'. __( "Days", 'chart-builder' ) .'</li>';
1787 $content[] = '<li><span id="ays-chart-countdown-hours"></span>'. __( "Hours", 'chart-builder' ) .'</li>';
1788 $content[] = '<li><span id="ays-chart-countdown-minutes"></span>'. __( "Minutes", 'chart-builder' ) .'</li>';
1789 $content[] = '<li><span id="ays-chart-countdown-seconds"></span>'. __( "Seconds", 'chart-builder' ) .'</li>';
1790 $content[] = '</ul>';
1791 $content[] = '</div>';
1792
1793 $content[] = '<div id="ays-chart-countdown-content" class="emoji">';
1794 $content[] = '<span>🚀</span>';
1795 $content[] = '<span>⌛</span>';
1796 $content[] = '<span>🔥</span>';
1797 $content[] = '<span>💣</span>';
1798 $content[] = '</div>';
1799
1800 $content[] = '</div>';
1801 $content[] = '</div>';
1802
1803 $content[] = '</div>';
1804
1805 $content[] = '<div class="ays-chart-dicount-wrap-box ays-chart-dicount-wrap-text-box">';
1806 $content[] = '<div>';
1807
1808 $content[] = '<span class="ays-chart-christmas-top-bundle-title">';
1809 $content[] = sprintf(
1810 /* translators: %s is the Chart Builder plugin URL with version parameter. */
1811 __(
1812 "<span><a href='%s' class='ays-chart-christmas-top-bundle-title-link' target='_blank'>Christmas Sale</a></span>",
1813 'chart-builder'
1814 ),
1815 "https://ays-pro.com/wordpress/chart-builder?utm_source=dashboard&utm_medium=chart-free&utm_campaign=christmas-sale-banner" . CHART_BUILDER_VERSION
1816 );
1817 $content[] = '</span>';
1818
1819 $content[] = '</br>';
1820
1821 $content[] = '<span class="ays-chart-christmas-top-bundle-desc">';
1822 $content[] = '<a class="ays-chart-christmas-top-bundle-desc" href="https://ays-pro.com/wordpress/chart-builder?utm_source=dashboard&utm_medium=chart-free&utm_campaign=christmas-sale-banner'.CHART_BUILDER_VERSION.'" class="ays-chart-christmas-top-bundle-title-link" target="_blank">';
1823 $content[] = __( "20% Extra OFF", 'chart-builder' );
1824 $content[] = '</a>';
1825 $content[] = '</span>';
1826 $content[] = '</div>';
1827
1828 $content[] = '<div style="position: absolute;right: 10px;bottom: 1px;" class="ays-chart-dismiss-buttons-container-for-form">';
1829
1830 $content[] = '<form action="" method="POST">';
1831 $content[] = '<div id="ays-chart-dismiss-buttons-content">';
1832 if( current_user_can( 'manage_options' ) ){
1833 $content[] = '<button class="btn btn-link ays-button" name="ays_chart_sale_btn" style="height: 32px; margin-left: 0;padding-left: 0">'. __( "Dismiss ad", 'chart-builder' ) .'</button>';
1834 $content[] = wp_nonce_field( CHART_BUILDER_NAME . '-sale-banner' , CHART_BUILDER_NAME . '-sale-banner' );
1835 }
1836 $content[] = '</div>';
1837 $content[] = '</form>';
1838
1839 $content[] = '</div>';
1840
1841 $content[] = '</div>';
1842
1843 $content[] = '<div class="ays-chart-dicount-wrap-box ays-chart-christmas-top-bundle-coupon-text-box">';
1844 $content[] = '<div class="ays-chart-christmas-top-bundle-coupon-row">';
1845 $content[] = 'xmas20off';
1846 $content[] = '</div>';
1847 $content[] = '<div class="ays-chart-christmas-top-bundle-text-row">';
1848 $content[] = __( '20% Extra Discount Coupon', 'chart-builder' );
1849 $content[] = '</div>';
1850 $content[] = '</div>';
1851
1852 $content[] = '<div class="ays-chart-dicount-wrap-box ays-chart-dicount-wrap-button-box">';
1853 $content[] = '<a href="https://ays-pro.com/wordpress/chart-builder?utm_source=dashboard&utm_medium=chart-free&utm_campaign=christmas-sale-banner'.CHART_BUILDER_VERSION.'" class="button button-primary ays-button" id="ays-button-top-buy-now" target="_blank">' . __( 'Get Your Deal', 'chart-builder' ) . '</a>';
1854 $content[] = '<span class="ays-chart-dicount-one-time-text">';
1855 $content[] = __( "One-time payment", 'chart-builder' );
1856 $content[] = '</span>';
1857 $content[] = '</div>';
1858 $content[] = '</div>';
1859 $content[] = '</div>';
1860
1861 $content = implode( '', $content );
1862 echo wp_kses_post( html_entity_decode( $content, ENT_QUOTES, 'UTF-8' ) );
1863 }
1864 }
1865
1866 // Halloween Bundle 2025
1867 public function ays_chart_new_halloween_bundle_message_2025($ishmar){
1868 if($ishmar == 0 ){
1869 $content = array();
1870
1871 $date = time() + (int) ( get_option( 'gmt_offset' ) * HOUR_IN_SECONDS);
1872 $now_date = date('M d, Y H:i:s', $date);
1873
1874 $start_date = strtotime('2025-09-08');
1875 $end_date = strtotime('2025-10-31');
1876 $diff_end = $end_date - $date;
1877
1878 $style_attr = '';
1879 if( $diff_end < 0 ){
1880 $style_attr = 'style="display:none;"';
1881 }
1882
1883 $ays_chart_cta_button_link = esc_url('https://ays-pro.com/wordpress/chart-builder?utm_source=dashboard&utm_medium=chart-free&utm_campaign=chart-halloween-banner-' . CHART_BUILDER_VERSION);
1884
1885 $content[] = '
1886 <div id="ays-chart-halloween-banner-2025-main" class="ays-chart-halloween-banner-2025-main ays_chart_dicount_info notice notice-success is-dismissible">
1887 <div class="ays-chart-halloween-banner-2025-content">
1888 <div class="ays-chart-halloween-banner-2025-left">
1889 <div class="ays-chart-halloween-banner-2025-text">
1890 <h2 class="ays-chart-halloween-banner-2025-title">Boo! Grab Your <a href="'. $ays_chart_cta_button_link .'" class="" target="_blank">Halloween Deal</a> <br/> Before It Vanishes!</h2>
1891 <p class="ays-chart-halloween-banner-2025-subtitle">Don’t get spooked by missing out!<br/> Get 25% discount using the coupon code while the magic lasts!</p>
1892 </div>
1893 </div>
1894
1895 <div class="ays-chart-halloween-banner-2025-center">';
1896
1897 $content[] = '<div id="ays-chart-halloween-banner-2025-countdown" class="ays-chart-halloween-banner-2025-countdown" ' . $style_attr . '>';
1898 $content[] = '<div class="ays-chart-halloween-banner-2025-countdown-timer">';
1899 $content[] = '<div class="ays-chart-halloween-banner-2025-countdown-item">';
1900 $content[] = '<div class="ays-chart-halloween-banner-2025-countdown-value" id="ays-chart-halloween-banner-2025-days">00</div>';
1901 $content[] = '<div class="ays-chart-halloween-banner-2025-countdown-label">' . __('days', 'chart-builder') . '</div>';
1902 $content[] = '</div>';
1903 $content[] = '<div class="ays-chart-halloween-banner-2025-countdown-separator">:</div>';
1904 $content[] = '<div class="ays-chart-halloween-banner-2025-countdown-item">';
1905 $content[] = '<div class="ays-chart-halloween-banner-2025-countdown-value" id="ays-chart-halloween-banner-2025-hours">00</div>';
1906 $content[] = '<div class="ays-chart-halloween-banner-2025-countdown-label">' . __('hours', 'chart-builder') . '</div>';
1907 $content[] = '</div>';
1908 $content[] = '<div class="ays-chart-halloween-banner-2025-countdown-separator">:</div>';
1909 $content[] = '<div class="ays-chart-halloween-banner-2025-countdown-item">';
1910 $content[] = '<div class="ays-chart-halloween-banner-2025-countdown-value" id="ays-chart-halloween-banner-2025-minutes">00</div>';
1911 $content[] = '<div class="ays-chart-halloween-banner-2025-countdown-label">' . __('minutes', 'chart-builder') . '</div>';
1912 $content[] = '</div>';
1913 $content[] = '<div class="ays-chart-halloween-banner-2025-countdown-separator">:</div>';
1914 $content[] = '<div class="ays-chart-halloween-banner-2025-countdown-item">';
1915 $content[] = '<div class="ays-chart-halloween-banner-2025-countdown-value" id="ays-chart-halloween-banner-2025-seconds">00</div>';
1916 $content[] = '<div class="ays-chart-halloween-banner-2025-countdown-label">' . __('seconds', 'chart-builder') . '</div>';
1917 $content[] = '</div>';
1918 $content[] = '</div>';
1919 $content[] = '</div>';
1920
1921 $content[] = '</div>
1922
1923 <div class="ays-chart-halloween-banner-2025-right">
1924 <div class="ays-chart-halloween-banner-2025-pumpkin">
1925 <svg width="36" height="36" viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
1926 <g clip-path="url(#clip0_177_40)">
1927 <path d="M32.664 8.519C29.364 5.134 23.42 4.75 18 4.75C12.58 4.75 6.636 5.134 3.336 8.519C0.582 11.344 0 15.751 0 19.791C0 25.054 1.982 31.102 6.357 34.035C9.364 36.051 13.95 35.871 18 35.871C22.05 35.871 26.636 36.051 29.643 34.035C34.018 31.101 36 25.054 36 19.791C36 15.751 35.418 11.344 32.664 8.519Z" fill="#F4900C"/>
1928 <path d="M20.783 5.44401C20.852 5.86401 20.561 6.20801 20.136 6.20801H15.685C15.259 6.20801 14.968 5.86401 15.038 5.44401L15.783 0.972008C15.853 0.551008 16.259 0.208008 16.685 0.208008H19.136C19.562 0.208008 19.968 0.552008 20.037 0.972008L20.783 5.44401Z" fill="#3F7123"/>
1929 <path d="M20.6541 21.159L19.0561 18.563C18.7651 18.021 18.3831 17.75 17.9991 17.746C17.6161 17.75 17.2331 18.021 16.9421 18.563L15.3441 21.159C14.7571 22.252 16.2171 22.875 17.9981 22.875C19.7791 22.875 21.2411 22.251 20.6541 21.159ZM30.1621 24.351C30.1171 24.276 30.0361 24.23 29.9481 24.23H29.1071C29.0391 24.23 28.9731 24.258 28.9261 24.307L26.6951 26.641L23.9971 24.472C23.9461 24.431 23.8801 24.414 23.8121 24.419C23.7461 24.426 23.6851 24.46 23.6441 24.513L21.2361 27.575L18.1821 24.309C18.1691 24.295 18.1491 24.292 18.1341 24.281C18.1191 24.271 18.1091 24.254 18.0911 24.247C18.0851 24.245 18.0781 24.247 18.0721 24.245C18.0481 24.238 18.0251 24.24 18.0001 24.24C17.9751 24.24 17.9521 24.238 17.9281 24.246C17.9221 24.248 17.9151 24.245 17.9081 24.248C17.8901 24.255 17.8811 24.272 17.8651 24.282C17.8491 24.292 17.8301 24.295 17.8171 24.309L14.7641 27.575L12.3551 24.513C12.3141 24.46 12.2531 24.426 12.1871 24.419C12.1211 24.413 12.0541 24.431 12.0021 24.472L9.30411 26.641L7.07411 24.307C7.02711 24.258 6.96211 24.23 6.89311 24.23H6.05211C5.96511 24.23 5.88311 24.276 5.83811 24.351C5.79311 24.426 5.79011 24.519 5.83111 24.596L8.58511 29.815C8.61911 29.879 8.6781 29.925 8.7491 29.942C8.8201 29.959 8.8941 29.944 8.9521 29.902L10.9861 28.444L13.9901 32.077C14.0331 32.13 14.0961 32.162 14.1641 32.167L14.1831 32.168C14.2451 32.168 14.3041 32.146 14.3501 32.105L18.0001 28.836L21.6501 32.104C21.6961 32.145 21.7551 32.167 21.8171 32.167L21.8361 32.166C21.9041 32.161 21.9671 32.129 22.0101 32.076L25.0151 28.443L27.0491 29.901C27.1091 29.944 27.1821 29.961 27.2521 29.941C27.3221 29.924 27.3821 29.879 27.4151 29.815L30.1701 24.596C30.2101 24.519 30.2081 24.426 30.1621 24.351ZM27.9761 15.421C28.1051 17.548 27.1921 19.227 24.7711 19.374C22.3511 19.52 21.2421 17.963 21.1131 15.837C20.9841 13.711 22.3451 10.717 24.2401 10.603C26.1361 10.487 27.8481 13.294 27.9761 15.421ZM8.02411 15.421C7.89511 17.548 8.80811 19.227 11.2291 19.374C13.6491 19.52 14.7581 17.963 14.8871 15.837C15.0161 13.711 13.6551 10.717 11.7601 10.603C9.86511 10.489 8.15211 13.294 8.02411 15.421Z" fill="#642116"/>
1930 </g>
1931 <defs>
1932 <clipPath id="clip0_177_40">
1933 <rect width="36" height="36" fill="white"/>
1934 </clipPath>
1935 </defs>
1936 </svg>
1937 </div>
1938
1939
1940
1941 <div class="ays-chart-halloween-banner-2025-discount-section">
1942 <div class="ays-chart-halloween-banner-2025-discount">25% OFF</div>
1943 <div class="ays-chart-halloween-banner-2025-coupon-wrapper">
1944 <div class="ays-chart-halloween-banner-2025-coupon-box" onclick="aysChartHalloweenCopyToClipboard(\'HALLOWEEN25\')" title="Click to copy">
1945 <span class="ays-chart-halloween-banner-2025-coupon-text">HALLOWEEN25</span>
1946 <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="ays-chart-halloween-banner-2025-copy-icon">
1947 <path d="M13.5 2.5H6.5C5.67 2.5 5 3.17 5 4V10C5 10.83 5.67 11.5 6.5 11.5H13.5C14.33 11.5 15 10.83 15 10V4C15 3.17 14.33 2.5 13.5 2.5ZM13.5 10H6.5V4H13.5V10ZM2.5 6.5V12.5C2.5 13.33 3.17 14 4 14H10V12.5H4V6.5H2.5Z" fill="white"/>
1948 </svg>
1949 </div>
1950 </div>
1951 <a href="'. $ays_chart_cta_button_link .'" class="ays-chart-halloween-banner-2025-upgrade" target="_blank">Upgrade Now</a>
1952 </div>';
1953
1954 if( current_user_can( 'manage_options' ) ){
1955 $content[] = '<div id="ays-chart-dismiss-buttons-content">';
1956 $content[] = '<form action="" method="POST" style="position: absolute; bottom: -5px; right: 0; color: #fff;">';
1957 $content[] = '<button class="btn btn-link ays-button" name="ays_chart_sale_btn" style="color: darkgrey; font-size: 11px;">'. __( "Dismiss ad", 'chart-builder' ) .'</button>';
1958 $content[] = wp_nonce_field( CHART_BUILDER_NAME . '-sale-banner' , CHART_BUILDER_NAME . '-sale-banner' );
1959 $content[] = '</form>';
1960 $content[] = '</div>';
1961 }
1962
1963 $content[] = '
1964 </div>
1965 </div>
1966 </div>';
1967
1968 $content[] = '<style id="ays-chart-progress-banner-styles-inline-css">';
1969 $content[] = '
1970 .ays-chart-halloween-banner-2025-main {
1971 background: linear-gradient(135deg, #1A0F2E 100%, #2D1B4E 0%);
1972 background-image: url("' . esc_attr( CHART_BUILDER_ADMIN_URL ) . '/images/halloween-banner-background-image-remove.png"), linear-gradient(135deg, #2D1B4E 0%, #1A0F2E 100%);
1973 background-position: left center, center;
1974 background-repeat: no-repeat, no-repeat;
1975 background-size: auto 100%, cover;
1976 padding: 20px 30px 20px 130px;
1977 border-radius: 12px;
1978 color: white;
1979 margin: 20px 0;
1980 border: 0;
1981 box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
1982 overflow: hidden;
1983 }
1984
1985 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-content {
1986 display: flex;
1987 align-items: center;
1988 justify-content: space-between;
1989 gap: 30px;
1990 }
1991
1992 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-left {
1993 display: flex;
1994 align-items: center;
1995 gap: 20px;
1996 }
1997
1998 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-center {
1999 display: flex;
2000 align-items: center;
2001 justify-content: center;
2002 flex: 1;
2003 max-width: 350px;
2004 }
2005
2006 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-right {
2007 display: flex;
2008 align-items: center;
2009 gap: 15px;
2010 flex-shrink: 0;
2011 }
2012
2013 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-icon {
2014 flex-shrink: 0;
2015 }
2016
2017 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-pumpkin svg {
2018 display: inline !important;
2019 border: none !important;
2020 box-shadow: none !important;
2021 height: 1em !important;
2022 width: 1em !important;
2023 margin: 0 0.07em !important;
2024 vertical-align: -0.1em !important;
2025 background: none !important;
2026 padding: 0 !important;
2027 }
2028
2029 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-orb {
2030 width: 80px;
2031 height: 80px;
2032 background: linear-gradient(135deg, #8B5CF6 0%, #6D28D9 100%);
2033 border-radius: 50%;
2034 display: flex;
2035 align-items: center;
2036 justify-content: center;
2037 box-shadow: 0 0 30px rgba(139, 92, 246, 0.6);
2038 border: 3px solid rgba(168, 85, 247, 0.4);
2039 }
2040
2041 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-question {
2042 font-size: 48px;
2043 font-weight: 700;
2044 color: #E9D5FF;
2045 }
2046
2047 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-bat {
2048 font-size: 20px;
2049 opacity: 0.8;
2050 }
2051
2052 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-bat-1 {
2053 margin-left: -100px;
2054 margin-top: -40px;
2055 }
2056
2057 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-bat-2 {
2058 margin-left: -110px;
2059 margin-top: 35px;
2060 }
2061
2062 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-sparkle {
2063 font-size: 12px;
2064 opacity: 0.7;
2065 }
2066
2067 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-sparkle-1 {
2068 margin-left: -95px;
2069 margin-top: -60px;
2070 }
2071
2072 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-sparkle-2 {
2073 margin-left: -70px;
2074 margin-top: -15px;
2075 }
2076
2077 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-sparkle-3 {
2078 margin-left: -120px;
2079 margin-top: 10px;
2080 }
2081
2082 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-text {
2083 flex: 1;
2084 }
2085
2086 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-title {
2087 font-size: 24px;
2088 font-weight: 700;
2089 margin: 0 0 8px 0;
2090 line-height: 1.2;
2091 color: #fff;
2092 text-transform: uppercase;
2093 letter-spacing: 1px;
2094 }
2095
2096 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-title a {
2097 color: #FB923C;
2098 text-decoration: underline;
2099 }
2100
2101 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-subtitle {
2102 font-size: 16px;
2103 margin: 0;
2104 opacity: 0.9;
2105 font-weight: 400;
2106 color: #E9D5FF;
2107 }
2108
2109 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-description {
2110 font-size: 14px;
2111 margin: 0;
2112 opacity: 0.85;
2113 line-height: 1.5;
2114 color: #D8B4FE;
2115 }
2116
2117 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-pumpkin {
2118 font-size: 64px;
2119 filter: drop-shadow(0 0 20px rgba(251, 146, 60, 0.8));
2120 flex-shrink: 0;
2121 }
2122
2123 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-discount-section {
2124 display: flex;
2125 flex-direction: column;
2126 align-items: center;
2127 gap: 10px;
2128 }
2129
2130 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-discount {
2131 font-size: 36px;
2132 font-weight: 700;
2133 color: #FB923C;
2134 text-shadow: 0 0 20px rgba(251, 146, 60, 0.6);
2135 margin: 0;
2136 line-height: 1;
2137 }
2138
2139 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-coupon-wrapper {
2140 margin-bottom: 5px;
2141 }
2142
2143 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-coupon-box {
2144 border: 2px dashed rgba(255, 255, 255, 0.4);
2145 padding: 6px 12px;
2146 border-radius: 6px;
2147 background: rgba(255, 255, 255, 0.1);
2148 cursor: pointer;
2149 transition: all 0.3s ease;
2150 display: flex;
2151 align-items: center;
2152 gap: 6px;
2153 backdrop-filter: blur(10px);
2154 }
2155
2156 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-coupon-box:hover {
2157 background: rgba(255, 255, 255, 0.2);
2158 border-color: rgba(255, 255, 255, 0.6);
2159 transform: translateY(-1px);
2160 }
2161
2162 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-coupon-text {
2163 font-size: 14px;
2164 font-weight: 700;
2165 letter-spacing: 1px;
2166 color: #fff;
2167 font-family: monospace;
2168 }
2169
2170 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-copy-icon {
2171 opacity: 0.8;
2172 transition: opacity 0.3s ease;
2173 }
2174
2175 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-coupon-box:hover .ays-chart-halloween-banner-2025-copy-icon {
2176 opacity: 1;
2177 }
2178
2179 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-upgrade {
2180 background: linear-gradient(135deg, #FB923C 0%, #F97316 100%);
2181 color: white;
2182 border: none;
2183 padding: 12px 28px;
2184 border-radius: 8px;
2185 font-size: 16px;
2186 font-weight: 600;
2187 cursor: pointer;
2188 transition: all 0.3s ease;
2189 box-shadow: 0 4px 16px rgba(251, 146, 60, 0.5);
2190 text-decoration: none;
2191 display: inline-flex;
2192 align-items: center;
2193 text-align: center;
2194 }
2195
2196 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-upgrade:hover {
2197 transform: translateY(-2px);
2198 box-shadow: 0 6px 20px rgba(251, 146, 60, 0.7);
2199 text-decoration: none;
2200 color: white;
2201 }
2202
2203 .ays-chart-halloween-banner-2025-main .notice-dismiss:before {
2204 color: #fff;
2205 }
2206
2207 .ays-chart-halloween-banner-2025-copy-notification {
2208 position: fixed;
2209 top: 50%;
2210 left: 50%;
2211 transform: translate(-50%, -50%);
2212 background: rgba(0, 0, 0, 0.8);
2213 color: white;
2214 padding: 12px 24px;
2215 border-radius: 8px;
2216 font-size: 14px;
2217 z-index: 10000;
2218 opacity: 0;
2219 transition: opacity 0.3s ease;
2220 }
2221
2222 .ays-chart-halloween-banner-2025-copy-notification.show {
2223 opacity: 1;
2224 }
2225
2226 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-countdown-timer {
2227 display: flex;
2228 align-items: center;
2229 justify-content: center;
2230 gap: 8px;
2231 }
2232
2233 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-countdown-item {
2234 background: rgba(255, 255, 255, 0.15);
2235 border-radius: 8px;
2236 padding: 8px 12px;
2237 min-width: 60px;
2238 backdrop-filter: blur(10px);
2239 }
2240
2241 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-countdown-value {
2242 font-size: 24px;
2243 font-weight: 700;
2244 line-height: 1;
2245 margin-bottom: 4px;
2246 color: #fff;
2247 text-align: center;
2248 }
2249
2250 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-countdown-label {
2251 font-size: 11px;
2252 opacity: 0.8;
2253 text-transform: lowercase;
2254 text-align: center;
2255 }
2256
2257 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-countdown-separator {
2258 font-size: 24px;
2259 font-weight: 700;
2260 opacity: 0.6;
2261 margin: 0 4px;
2262 }
2263
2264 @media (min-width: 1200px) {
2265 .ays-chart-halloween-banner-2025-main .wp-core-ui .notice.is-dismissible {
2266 padding-right: 60px;
2267 }
2268 }
2269
2270 @media (max-width: 1200px) {
2271
2272 div.ays-chart-halloween-banner-2025-main {
2273 padding: 20px 30px;
2274 }
2275
2276 div.ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-pumpkin {
2277 display: none;
2278 }
2279
2280 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-subtitle,
2281 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-title {
2282 text-align: center;
2283 }
2284
2285 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-content {
2286 flex-wrap: wrap;
2287 gap: 20px;
2288 }
2289
2290 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-left {
2291 width: 100%;
2292 }
2293
2294 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-center {
2295 width: 100%;
2296 max-width: 100%;
2297 text-align: center;
2298 }
2299
2300 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-right {
2301 width: 100%;
2302 justify-content: center;
2303 }
2304 }
2305
2306 @media (max-width: 786px) {
2307 #ays-chart-halloween-banner-2025-main {
2308 display: none !important;
2309 }
2310 }
2311
2312 @media (max-width: 768px) {
2313 .ays-chart-halloween-banner-2025-main {
2314 padding: 15px 20px;
2315 margin: 15px 0;
2316 }
2317
2318 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-title {
2319 font-size: 20px;
2320 }
2321
2322 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-subtitle {
2323 font-size: 14px;
2324 }
2325
2326 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-description {
2327 font-size: 13px;
2328 }
2329
2330 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-pumpkin {
2331 font-size: 48px;
2332 }
2333
2334 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-discount {
2335 font-size: 28px;
2336 }
2337
2338 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-upgrade {
2339 padding: 10px 20px;
2340 font-size: 14px;
2341 }
2342 }
2343
2344 @media (max-width: 480px) {
2345 .ays-chart-halloween-banner-2025-main {
2346 padding: 12px 15px;
2347 }
2348
2349 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-orb {
2350 width: 60px;
2351 height: 60px;
2352 }
2353
2354 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-question {
2355 font-size: 36px;
2356 }
2357
2358 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-title {
2359 font-size: 18px;
2360 }
2361
2362 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-coupon-text {
2363 font-size: 12px;
2364 }
2365 }
2366 ';
2367
2368 $content[] = '</style>';
2369
2370 $content[] = '<script>';
2371 $content[] = "
2372 function aysChartHalloweenCopyToClipboard(text) {
2373 // Create a temporary textarea element
2374 var textarea = document.createElement('textarea');
2375 textarea.value = text;
2376 textarea.style.position = 'fixed';
2377 textarea.style.opacity = '0';
2378 document.body.appendChild(textarea);
2379
2380 // Select and copy the text
2381 textarea.select();
2382 textarea.setSelectionRange(0, 99999); // For mobile devices
2383
2384 try {
2385 document.execCommand('copy');
2386 aysChartHalloweenShowCopyNotification('Coupon code copied!');
2387 } catch (err) {
2388 console.error('Failed to copy text: ', err);
2389 }
2390
2391 // Remove the temporary textarea
2392 document.body.removeChild(textarea);
2393 }
2394
2395 function aysChartHalloweenShowCopyNotification(message) {
2396 // Check if notification already exists
2397 var existingNotification = document.querySelector('.ays-chart-halloween-banner-2025-copy-notification');
2398 if (existingNotification) {
2399 document.body.removeChild(existingNotification);
2400 }
2401
2402 // Create notification element
2403 var notification = document.createElement('div');
2404 notification.className = 'ays-chart-halloween-banner-2025-copy-notification';
2405 notification.textContent = message;
2406 document.body.appendChild(notification);
2407
2408 // Show notification with animation
2409 setTimeout(function() {
2410 notification.classList.add('show');
2411 }, 10);
2412
2413 // Hide and remove notification after 2 seconds
2414 setTimeout(function() {
2415 notification.classList.remove('show');
2416 setTimeout(function() {
2417 if (notification.parentNode) {
2418 document.body.removeChild(notification);
2419 }
2420 }, 300);
2421 }, 2000);
2422 }
2423
2424 (function() {
2425 var endDate = new Date('". date('Y-m-d H:i:s', $end_date) ."').getTime();
2426
2427 function updateCountdown() {
2428 var now = new Date().getTime();
2429 var distance = endDate - now;
2430
2431 if (distance < 0) {
2432 clearInterval(updateCountdown);
2433 document.getElementById('ays-chart-halloween-banner-2025-progress-banner-countdown').style.display = 'none';
2434 return;
2435 }
2436
2437 var days = Math.floor(distance / (1000 * 60 * 60 * 24));
2438 var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
2439 var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
2440 var seconds = Math.floor((distance % (1000 * 60)) / 1000);
2441
2442 function padZero(num) {
2443 return num < 10 ? '0' + num : num;
2444 }
2445
2446 document.getElementById('ays-chart-halloween-banner-2025-days').textContent = padZero(days);
2447 document.getElementById('ays-chart-halloween-banner-2025-hours').textContent = padZero(hours);
2448 document.getElementById('ays-chart-halloween-banner-2025-minutes').textContent = padZero(minutes);
2449 document.getElementById('ays-chart-halloween-banner-2025-seconds').textContent = padZero(seconds);
2450 }
2451
2452 updateCountdown();
2453 setInterval(updateCountdown, 1000);
2454 })()";
2455 $content[] = '</script>';
2456
2457 $content = implode( '', $content );
2458 echo ($content);
2459 }
2460 }
2461
2462 // Black Friday
2463 public static function ays_chart_black_friday_message($ishmar){
2464 if($ishmar == 0 ){
2465 $content = array();
2466
2467 $ays_chart_cta_button_link = esc_url('https://ays-pro.com/wordpress/chart-builder?utm_source=dashboard&utm_medium=chart-free&utm_campaign=black-friday-sale-banner-' . CHART_BUILDER_VERSION);
2468
2469 $content[] = '<div id="ays-chart-dicount-black-friday-month-main" class="ays-chart notice notice-success is-dismissible ays_chart_dicount_info">';
2470 $content[] = '<div id="ays-chart-dicount-black-friday-month" class="ays_chart_dicount_month">';
2471 $content[] = '<div class="ays-chart-dicount-black-friday-box">';
2472 $content[] = '<div class="ays-chart-dicount-black-friday-wrap-box ays-chart-dicount-black-friday-wrap-box-80" style="width: 70%;">';
2473 $content[] = '<div class="">';
2474 $content[] = '<div class="ays-chart-dicount-black-friday-title-row" >' . __( 'Coupon Code', "ays-popup-box" ) .' ' . '</div>';
2475 $content[] = '<div class="ays-chart-dicount-black-friday-title-row">';
2476
2477 $content[] = '
2478 <span class="ays-chart-dicount-black-friday-banner-2025-coupon-wrapper">
2479 <span class="ays-chart-dicount-black-friday-banner-2025-coupon-box" onclick="aysChartHalloweenCopyToClipboard(\'FREE2PROBF\')" title="Click to copy">
2480 <span class="ays-chart-dicount-black-friday-banner-2025-coupon-text">FREE2PROBF</span>
2481 <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="ays-chart-dicount-black-friday-banner-2025-copy-icon">
2482 <path d="M13.5 2.5H6.5C5.67 2.5 5 3.17 5 4V10C5 10.83 5.67 11.5 6.5 11.5H13.5C14.33 11.5 15 10.83 15 10V4C15 3.17 14.33 2.5 13.5 2.5ZM13.5 10H6.5V4H13.5V10ZM2.5 6.5V12.5C2.5 13.33 3.17 14 4 14H10V12.5H4V6.5H2.5Z" fill="white"/>
2483 </svg>
2484 </span>
2485 </span>';
2486 $content[] = '</div> ';
2487 $content[] = '</div>';
2488
2489 $content[] = '</div>';
2490
2491 $content[] = '<div class="ays-chart-dicount-black-friday-wrap-box ays-chart-dicount-black-friday-wrap-text-box">';
2492 $content[] = '<div class="ays-chart-dicount-black-friday-text-row">' . '30% off' . '</div>';
2493 $content[] = '</div>';
2494
2495 $content[] = '<div class="ays-chart-dicount-black-friday-wrap-box" style="width: 25%;">';
2496 $content[] = '<div id="ays-chart-countdown-main-container">';
2497 $content[] = '<div class="ays-chart-countdown-container">';
2498 $content[] = '<div id="ays-chart-countdown" style="display: block;">';
2499 $content[] = '<ul>';
2500 $content[] = '<li><span id="ays-chart-countdown-days"></span>' . __( 'Days', "ays-popup-box" ) . '</li>';
2501 $content[] = '<li><span id="ays-chart-countdown-hours"></span>' . __( 'Hours', "ays-popup-box" ) . '</li>';
2502 $content[] = '<li><span id="ays-chart-countdown-minutes"></span>' . __( 'Minutes', "ays-popup-box" ) . '</li>';
2503 $content[] = '<li><span id="ays-chart-countdown-seconds"></span>' . __( 'Seconds', "ays-popup-box" ) . '</li>';
2504 $content[] = '</ul>';
2505 $content[] = '</div>';
2506 $content[] = '<div id="ays-chart-countdown-content" class="emoji" style="display: none;">';
2507 $content[] = '<span></span>';
2508 $content[] = '<span></span>';
2509 $content[] = '<span></span>';
2510 $content[] = '<span></span>';
2511 $content[] = '</div>';
2512 $content[] = '</div>';
2513 $content[] = '</div>';
2514 $content[] = '</div>';
2515
2516 $content[] = '<div class="ays-chart-dicount-black-friday-wrap-box" style="width: 25%;">';
2517 $content[] = '<a href="'. $ays_chart_cta_button_link .'" class="ays-chart-dicount-black-friday-button-buy-now" target="_blank">' . __( 'Get Your Deal', "ays-popup-box" ) . '</a>';
2518 $content[] = '</div>';
2519 $content[] = '</div>';
2520 $content[] = '</div>';
2521
2522 $content[] = '<div style="position: absolute;right: 0;bottom: 1px;" class="ays-chart-dismiss-buttons-container-for-form-black-friday">';
2523 $content[] = '<form action="" method="POST">';
2524 $content[] = '<div id="ays-chart-dismiss-buttons-content">';
2525 if( current_user_can( 'manage_options' ) ){
2526 $content[] = '<button class="btn btn-link ays-button" name="ays_chart_sale_btn" style="height: 32px; margin-left: 0;padding-left: 0">Dismiss ad</button>';
2527 $content[] = wp_nonce_field( CHART_BUILDER_NAME . '-sale-banner' , CHART_BUILDER_NAME . '-sale-banner' );
2528 }
2529 $content[] = '</div>';
2530 $content[] = '</form>';
2531 $content[] = '</div>';
2532 $content[] = '</div>';
2533
2534 $content[] = '<script>';
2535 $content[] = "
2536 function aysChartHalloweenCopyToClipboard(text) {
2537 // Create a temporary textarea element
2538 var textarea = document.createElement('textarea');
2539 textarea.value = text;
2540 textarea.style.position = 'fixed';
2541 textarea.style.opacity = '0';
2542 document.body.appendChild(textarea);
2543
2544 // Select and copy the text
2545 textarea.select();
2546 textarea.setSelectionRange(0, 99999); // For mobile devices
2547
2548 try {
2549 document.execCommand('copy');
2550 aysChartHalloweenShowCopyNotification('Coupon code copied!');
2551 } catch (err) {
2552 console.error('Failed to copy text: ', err);
2553 }
2554
2555 // Remove the temporary textarea
2556 document.body.removeChild(textarea);
2557 }
2558
2559 function aysChartHalloweenShowCopyNotification(message) {
2560 // Check if notification already exists
2561 var existingNotification = document.querySelector('.ays-chart-discount-black-friday-banner-2025-copy-notification');
2562 if (existingNotification) {
2563 document.body.removeChild(existingNotification);
2564 }
2565
2566 // Create notification element
2567 var notification = document.createElement('div');
2568 notification.className = 'ays-chart-discount-black-friday-banner-2025-copy-notification';
2569 notification.textContent = message;
2570 document.body.appendChild(notification);
2571
2572 // Show notification with animation
2573 setTimeout(function() {
2574 notification.classList.add('show');
2575 }, 10);
2576
2577 // Hide and remove notification after 2 seconds
2578 setTimeout(function() {
2579 notification.classList.remove('show');
2580 setTimeout(function() {
2581 if (notification.parentNode) {
2582 document.body.removeChild(notification);
2583 }
2584 }, 300);
2585 }, 2000);
2586 }";
2587 $content[] = '</script>';
2588
2589 $content[] = '<style>';
2590 $content[] = '
2591 /* Black friday banner start */
2592 div#ays-chart-dicount-black-friday-month-main *{color:#fff}div#ays-chart-dicount-black-friday-month-main div#ays-chart-dicount-black-friday-month a.ays-chart-sale-banner-link:focus{outline:0;box-shadow:0}div#ays-chart-dicount-black-friday-month-main .btn-link{background-color:transparent;display:inline-block;font-weight:400;text-align:center;white-space:nowrap;vertical-align:middle;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border:1px solid transparent;padding:.375rem .75rem;font-size:12px;line-height:1.5;border-radius:.25rem;color:rgba(255,255,255,.6)}div#ays-chart-dicount-black-friday-month-main.ays_chart_dicount_info{background-image:linear-gradient(45deg,#1e101d,#c60af4);padding:unset;border-left:0}#ays-chart-dicount-black-friday-month-main .ays_chart_dicount_month{position:relative;background-image:url("'. esc_attr(CHART_BUILDER_ADMIN_URL) .'/images/black-friday-plugins-background-image.webp");background-position:center right;background-repeat:no-repeat;background-size:100% 100%}#ays-chart-dicount-black-friday-month-main .ays_chart_dicount_month img{width:80px}#ays-chart-dicount-black-friday-month-main .ays-chart-sale-banner-link{display:flex;justify-content:center;align-items:center;width:200px}#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-button-sale{font-style:normal;font-weight:600;font-size:24px;text-align:center;color:#b2ff00;text-transform:uppercase}#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-wrap-box{font-size:14px;padding:12px;text-align:center;width:50%;white-space:nowrap}#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-wrap-box strong{font-size:17px;font-weight:700;letter-spacing:.8px}#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-wrap-color{color:#971821}#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-wrap-text-decoration{text-decoration:underline}#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-wrap-box.ays-buy-now-button-box{display:flex;justify-content:flex-end;align-items:center;width:30%}#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-wrap-box .ays-button,#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-wrap-box .ays-buy-now-button{align-items:center;font-weight:500}#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-wrap-box .ays-buy-now-button{background:#971821;border-color:#fff;display:flex;justify-content:center;align-items:center;padding:5px 15px;font-size:16px;border-radius:5px}#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-wrap-box .ays-buy-now-button:hover{background:#7d161d;border-color:#971821}#ays-chart-dicount-black-friday-month-main #ays-chart-dismiss-buttons-content{display:flex;justify-content:center}#ays-chart-dicount-black-friday-month-main #ays-chart-dismiss-buttons-content .ays-button{margin:0!important;font-size:13px;color:#969393b0}#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-wrap-opacity-box{width:19%}#ays-chart-dicount-black-friday-month-main .ays-buy-now-opacity-button{padding:40px 15px;display:flex;justify-content:center;align-items:center;opacity:0}#ays-chart-countdown-main-container .ays-chart-countdown-container{margin:0 auto;text-align:center}#ays-chart-countdown-main-container #ays-chart-countdown-headline{letter-spacing:.125rem;text-transform:uppercase;font-size:18px;font-weight:400;margin:0;padding:9px 0 4px;line-height:1.3}#ays-chart-countdown-main-container li,#ays-chart-countdown-main-container ul{margin:0;font-weight:600}#ays-chart-countdown-main-container li{display:inline-block;font-size:10px;list-style-type:none;padding:10px;text-transform:uppercase}#ays-chart-countdown-main-container li span{display:block;font-size:22px;min-height:33px}#ays-chart-countdown-main-container .emoji{display:none;padding:1rem}#ays-chart-countdown-main-container .emoji span{font-size:25px;padding:0 .5rem}#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-box{display:flex;justify-content:space-between;align-items:center;width:95%;margin:auto}#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-title-row{text-align:center;padding-right:50px;font-style:normal;font-weight:900;font-size:19px;color:#fff;}#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-button-buy-now{border:none;outline:0;padding:10px 20px;font-size:22px;text-transform:uppercase;font-weight:700;text-decoration:none;background:linear-gradient(180deg,#dd0bef 0,#82008d 100%);border-radius:16px}#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-text-row{text-transform:uppercase;text-shadow:-1.5px 0 #dd0bef,0 1.5px #dd0bef,1.5px 0 #dd0bef,0 -1.5px #dd0bef;font-weight:900;font-style:normal;font-size:40px;line-height:40px;color:#fff}#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-wrap-text-box{position:absolute;width:25%;top:10px;bottom:0;right:0;left:0;margin:0 auto}#ays-chart-countdown ul{padding:0}#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-banner-2025-coupon-box{border:2px dashed rgba(255,255,255,.4);padding:0 12px;border-radius:6px;background:rgba(255,255,255,.1);cursor:pointer;transition:.3s;display:flex;align-items:center;justify-content:center;gap:6px;backdrop-filter:blur(10px);width:fit-content;margin:0 auto}#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-banner-2025-coupon-box:hover{background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.6);transform:translateY(-1px)}#ays-chart-dicount-black-friday-month-main .ays-chart-discount-black-friday-banner-2025-coupon-text{font-size:14px;font-weight:700;letter-spacing:1px;color:#fff;font-family:monospace}#ays-chart-dicount-black-friday-month-main .ays-chart-discount-black-friday-banner-2025-copy-icon{opacity:.8;transition:opacity .3s}#ays-chart-dicount-black-friday-month-main .ays-chart-discount-black-friday-banner-banner-2025-coupon-box:hover .ays-chart-discount-black-friday-banner-2025-copy-icon,.ays-chart-discount-black-friday-banner-2025-copy-notification.show{opacity:1}.ays-chart-discount-black-friday-banner-2025-copy-notification{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:rgba(0,0,0,.8);color:#fff;padding:12px 24px;border-radius:8px;font-size:14px;z-index:10000;opacity:0;transition:opacity .3s}@media screen and (max-width:1400px) and (min-width:1200px){div#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-title-row{font-size:15px}div#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-text-row{font-size:27px}div#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-box{width:100%}div#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-button-buy-now{font-size:13px}div#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-wrap-box-80{width:80%!important}}@media all and (max-width:1200px){div#ays-chart-dicount-black-friday-month-main .ays_chart_dicount_month{background:unset}div#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-text-row{font-size:30px}div#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-box{width:100%}div#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-button-buy-now{font-size:15px}div#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-wrap-box-80{width:80%!important}}@media all and (max-width:1200px) and (min-width:1150px){div#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-title-row{font-size:15px}div#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-button-buy-now{font-size:10px}}@media all and (max-width:1150px){div#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-wrap-box-80{width:80%!important}div#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-box{flex-direction:column}div#ays-chart-dicount-black-friday-month-main{padding-right:0}div#ays-chart-dicount-black-friday-month-main .ays_chart_dicount_month{display:flex;align-items:center;justify-content:space-between;align-content:center;flex-wrap:wrap;flex-direction:column;padding:10px 0}div#ays-chart-dicount-black-friday-month-main div.ays-chart-dicount-black-friday-wrap-box{width:100%!important;text-align:center}#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-title-row,div#ays-chart-dicount-black-friday-month-main #ays-chart-countdown-main-container ul{padding:0;font-size:13px}#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-button-sale,div#ays-chart-countdown-main-container li{font-size:15px}div#ays-chart-countdown-main-container li span{font-size:25px}div#ays-chart-dicount-black-friday-month-main div.ays-chart-dicount-black-friday-wrap-text-box{position:unset}#ays-chart-countdown-main-container #ays-chart-countdown-headline{font-size:15px;font-weight:600}#ays-chart-countdown-main-container ul{font-weight:500}#ays-chart-countdown-main-container li span{font-size:20px}#ays-chart-dicount-black-friday-month-main .ays-button{margin:0 auto!important}div#ays-chart-dicount-black-friday-month-main.ays_chart_dicount_info.notice{background-position:bottom right;background-repeat:no-repeat;background-size:contain;display:flex;justify-content:center;background-image:linear-gradient(45deg,#1e101d,#c60af4)}div#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-wrap-box.ays-buy-now-button-box{justify-content:center}div#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-wrap-box .ays-buy-now-button{font-size:14px;padding:5px 10px}div#ays-chart-dicount-black-friday-month-main .ays-chart-dicount-black-friday-button-buy-now{padding:10px 18px;font-size:15px}}@media all and (max-width:768px){#ays-chart-dicount-black-friday-month-main{display:none!important}}
2593 ';
2594 $content[] = '</style>';
2595
2596 $content = implode( '', $content );
2597
2598 echo $content;
2599 }
2600 }
2601
2602 // Christmas Banner 2025
2603 public static function ays_chart_christmas_banner_message_2025($ishmar){
2604 if($ishmar == 0 ){
2605 $content = array();
2606
2607 $svg_icon = '<svg width="21" height="22" viewBox="0 0 21 22" fill="none" xmlns="http://www.w3.org/2000/svg">
2608 <path fill-rule="evenodd" clip-rule="evenodd" d="M10.0445 0C10.4587 0 10.7945 0.33579 10.7945 0.75V2.93934L12.5141 1.21967C12.807 0.92678 13.2819 0.92678 13.5748 1.21967C13.8677 1.51256 13.8677 1.98744 13.5748 2.28033L10.7945 5.06066V9.451L14.5965 7.25588L15.6142 3.45788C15.7214 3.05778 16.1326 2.82034 16.5327 2.92755C16.9328 3.03475 17.1703 3.44601 17.0631 3.84611L16.4336 6.19522L18.3296 5.10055C18.6884 4.89344 19.147 5.01635 19.3542 5.37507C19.5613 5.73379 19.4384 6.19248 19.0796 6.39959L17.1836 7.49426L19.5327 8.1237C19.9328 8.23091 20.1703 8.64216 20.0631 9.0423C19.9558 9.4424 19.5446 9.6798 19.1445 9.5726L15.3465 8.55492L11.5445 10.75L15.3467 12.9452L19.1447 11.9275C19.5448 11.8203 19.956 12.0578 20.0633 12.4579C20.1705 12.858 19.933 13.2692 19.5329 13.3764L17.1838 14.0059L19.0798 15.1005C19.4386 15.3077 19.5615 15.7663 19.3544 16.1251C19.1472 16.4838 18.6886 16.6067 18.3298 16.3996L16.4338 15.3049L17.0633 17.654C17.1705 18.0541 16.933 18.4654 16.5329 18.5726C16.1328 18.6798 15.7216 18.4424 15.6144 18.0423L14.5967 14.2443L10.7945 12.049V16.4393L13.5748 19.2197C13.8677 19.5126 13.8677 19.9874 13.5748 20.2803C13.2819 20.5732 12.807 20.5732 12.5141 20.2803L10.7945 18.5607V20.75C10.7945 21.1642 10.4587 21.5 10.0445 21.5C9.63033 21.5 9.29453 21.1642 9.29453 20.75V18.5607L7.57484 20.2803C7.28195 20.5732 6.80707 20.5732 6.51418 20.2803C6.22129 19.9874 6.22129 19.5126 6.51418 19.2197L9.29453 16.4393V12.049L5.4923 14.2443L4.47463 18.0423C4.36742 18.4424 3.95617 18.6798 3.55607 18.5726C3.15597 18.4654 2.91853 18.0541 3.02574 17.654L3.65518 15.3049L1.75916 16.3996C1.40044 16.6067 0.941743 16.4838 0.734643 16.1251C0.527533 15.7663 0.650443 15.3077 1.00916 15.1005L2.90518 14.0059L0.556073 13.3764C0.155973 13.2692 -0.081467 12.858 0.0257431 12.4579C0.132943 12.0578 0.544203 11.8203 0.944303 11.9275L4.7423 12.9452L8.54453 10.75L4.74249 8.55492L0.944493 9.5726C0.544393 9.6798 0.133143 9.4424 0.0259331 9.0423C-0.0812669 8.64216 0.156163 8.23091 0.556263 8.1237L2.90538 7.49426L1.00935 6.39959C0.650633 6.19248 0.527733 5.73379 0.734833 5.37507C0.941943 5.01635 1.40063 4.89344 1.75935 5.10055L3.65538 6.19522L3.02593 3.84611C2.91873 3.44601 3.15616 3.03475 3.55626 2.92755C3.95636 2.82034 4.36762 3.05778 4.47482 3.45788L5.49249 7.25588L9.29453 9.451V5.06066L6.51418 2.28033C6.22129 1.98744 6.22129 1.51256 6.51418 1.21967C6.80707 0.92678 7.28195 0.92678 7.57484 1.21967L9.29453 2.93934V0.75C9.29453 0.33579 9.63033 0 10.0445 0Z" fill="white" fill-opacity="0.2"/>
2609 </svg>
2610 ';
2611
2612 $ays_chart_cta_button_link = esc_url('https://ays-pro.com/wordpress/chart-builder?utm_source=dashboard&utm_medium=chart-free&utm_campaign=christmas-sale-banner-' . CHART_BUILDER_VERSION);
2613
2614 $content[] = '<div id="ays-chart-christmas-banner-main" class="notice notice-success is-dismissible ays-chart-christmas-banner-info ays_chart_dicount_info">';
2615 $content[] = '<div id="ays-chart-christmas-banner-month" class="ays-chart-christmas-banner-month">';
2616
2617 // Background effects
2618 $content[] = '<div class="ays-chart-christmas-banner-bg-effects">';
2619 $content[] = '<div class="ays-chart-christmas-banner-bg-gradient-1"></div>';
2620 $content[] = '<div class="ays-chart-christmas-banner-bg-gradient-2"></div>';
2621
2622 // Snowflakes
2623 $content[] = '<div class="ays-chart-christmas-banner-snowflake" style="left: 5%; animation-delay: 0s; animation-duration: 8s;">'. $svg_icon .'</div>';
2624 $content[] = '<div class="ays-chart-christmas-banner-snowflake" style="left: 15%; animation-delay: 2s; animation-duration: 10s;">'. $svg_icon .'</div>';
2625 $content[] = '<div class="ays-chart-christmas-banner-snowflake" style="left: 25%; animation-delay: 4s; animation-duration: 9s;">'. $svg_icon .'</div>';
2626 $content[] = '<div class="ays-chart-christmas-banner-snowflake" style="left: 75%; animation-delay: 1s; animation-duration: 11s;">'. $svg_icon .'</div>';
2627 $content[] = '<div class="ays-chart-christmas-banner-snowflake" style="left: 85%; animation-delay: 3s; animation-duration: 8s;">'. $svg_icon .'</div>';
2628 $content[] = '<div class="ays-chart-christmas-banner-snowflake" style="left: 92%; animation-delay: 5s; animation-duration: 10s;">'. $svg_icon .'</div>';
2629
2630 // Sparkles
2631 $content[] = '<svg class="ays-chart-christmas-banner-sparkle" style="top: 20%; left: 8%; animation-delay: 0s; width: 14px; height: 14px;" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">';
2632 $content[] = '<path d="M9.937 15.5A2 2 0 0 0 8.5 14.063l-6.135-1.582a.5.5 0 0 1 0-.962L8.5 9.936A2 2 0 0 0 9.937 8.5l1.582-6.135a.5.5 0 0 1 .963 0L14.063 8.5A2 2 0 0 0 15.5 9.937l6.135 1.581a.5.5 0 0 1 0 .964L15.5 14.063a2 2 0 0 0-1.437 1.437l-1.582 6.135a.5.5 0 0 1-.963 0z"/>';
2633 $content[] = '</svg>';
2634 $content[] = '<svg class="ays-chart-christmas-banner-sparkle" style="top: 60%; left: 3%; animation-delay: 0.5s; width: 10px; height: 10px;" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">';
2635 $content[] = '<path d="M9.937 15.5A2 2 0 0 0 8.5 14.063l-6.135-1.582a.5.5 0 0 1 0-.962L8.5 9.936A2 2 0 0 0 9.937 8.5l1.582-6.135a.5.5 0 0 1 .963 0L14.063 8.5A2 2 0 0 0 15.5 9.937l6.135 1.581a.5.5 0 0 1 0 .964L15.5 14.063a2 2 0 0 0-1.437 1.437l-1.582 6.135a.5.5 0 0 1-.963 0z"/>';
2636 $content[] = '</svg>';
2637 $content[] = '<svg class="ays-chart-christmas-banner-sparkle" style="top: 30%; right: 12%; animation-delay: 1s; width: 12px; height: 12px;" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">';
2638 $content[] = '<path d="M9.937 15.5A2 2 0 0 0 8.5 14.063l-6.135-1.582a.5.5 0 0 1 0-.962L8.5 9.936A2 2 0 0 0 9.937 8.5l1.582-6.135a.5.5 0 0 1 .963 0L14.063 8.5A2 2 0 0 0 15.5 9.937l6.135 1.581a.5.5 0 0 1 0 .964L15.5 14.063a2 2 0 0 0-1.437 1.437l-1.582 6.135a.5.5 0 0 1-.963 0z"/>';
2639 $content[] = '</svg>';
2640 $content[] = '</div>';
2641
2642 // Main content
2643 $content[] = '<div class="ays-chart-christmas-banner-content">';
2644 $content[] = '<div class="ays-chart-christmas-banner-left">';
2645 // Gift icon with hat
2646 $content[] = '<div class="ays-chart-christmas-banner-gift-wrapper">';
2647 $content[] = '<svg class="ays-chart-christmas-banner-gift-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">';
2648 $content[] = '<rect x="3" y="8" width="18" height="4" rx="1"></rect>';
2649 $content[] = '<path d="M12 8v13"></path>';
2650 $content[] = '<path d="M19 12v7a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2v-7"></path>';
2651 $content[] = '<path d="M7.5 8a2.5 2.5 0 0 1 0-5A4.8 8 0 0 1 12 8a4.8 8 0 0 1 4.5-5 2.5 2.5 0 0 1 0 5"></path>';
2652 $content[] = '</svg>';
2653 $content[] = '<div class="ays-chart-christmas-banner-hat">';
2654 $content[] = '<svg viewBox="0 0 24 24" fill="none" class="ays-chart-christmas-banner-hat-svg">';
2655 $content[] = '<path d="M12 2L4 14h16L12 2z" fill="hsl(0 80% 45%)"></path>';
2656 $content[] = '<path d="M4 14c0 2 3.5 3 8 3s8-1 8-3" fill="hsl(0 0% 100%)"></path>';
2657 $content[] = '<circle cx="12" cy="3" r="2" fill="hsl(0 0% 100%)"></circle>';
2658 $content[] = '</svg>';
2659 $content[] = '</div>';
2660 $content[] = '</div>';
2661
2662 $content[] = '<div class="ays-chart-christmas-banner-special-label">';
2663 $content[] = '<div class="ays-chart-christmas-banner-special-label-name">';
2664 $content[] = '<a href="'. $ays_chart_cta_button_link .'" class="ays-chart-christmas-banner-special-label-name-link" target="_blank">';
2665 $content[] = __( 'Chart Builder', "chart-builder" );
2666 $content[] = '</a>';
2667 $content[] = '</div>';
2668
2669 $content[] = '<div>✦ ' . __( 'CHRISTMAS SPECIAL', "chart-builder" ) . ' ✦</div>';
2670 $content[] = '</div>';
2671 $content[] = '</div>';
2672
2673 $content[] = '<div class="ays-chart-christmas-banner-center">';
2674 $content[] = '<div class="ays-chart-christmas-banner-discount-text">25% OFF</div>';
2675 $content[] = '<div class="ays-chart-christmas-banner-limited-offer">' . __( 'Limited time offer', "chart-builder" ) . '</div>';
2676 $content[] = '</div>';
2677
2678 $content[] = '<div class="ays-chart-christmas-banner-right">';
2679 $content[] = '<div class="ays-chart-christmas-banner-coupon-box" onclick="aysChartChristmasCopyToClipboard(\'XMAS25\')" title="' . __( 'Click to copy', "chart-builder" ) . '">';
2680 $content[] = '<span class="ays-chart-christmas-banner-coupon-text">XMAS25</span>';
2681 $content[] = '<svg class="ays-chart-christmas-banner-copy-icon" width="16" height="16" viewBox="0 0 16 16" fill="none">';
2682 $content[] = '<path d="M13.5 2.5H6.5C5.67 2.5 5 3.17 5 4V10C5 10.83 5.67 11.5 6.5 11.5H13.5C14.33 11.5 15 10.83 15 10V4C15 3.17 14.33 2.5 13.5 2.5ZM13.5 10H6.5V4H13.5V10ZM2.5 6.5V12.5C2.5 13.33 3.17 14 4 14H10V12.5H4V6.5H2.5Z" fill="white"/>';
2683 $content[] = '</svg>';
2684 $content[] = '</div>';
2685
2686 $content[] = '<a href="'. $ays_chart_cta_button_link .'" class="ays-chart-christmas-banner-buy-now-btn" target="_blank">';
2687 $content[] = __( 'Buy Now', "chart-builder" );
2688 $content[] = '</a>';
2689 $content[] = '</div>';
2690 $content[] = '</div>';
2691
2692 $content[] = '</div>';
2693
2694 if( current_user_can( 'manage_options' ) ){
2695 $content[] = '<div id="ays-chart-dismiss-buttons-content">';
2696 $content[] = '<form action="" method="POST" style="position: absolute; bottom: 0; right: 0; color: #fff;">';
2697 $content[] = '<button class="btn btn-link ays-button" name="ays_chart_sale_btn" style="color: darkgrey; font-size: 11px; padding: 0 .75rem;">'. __( "Dismiss ad", 'chart-builder' ) .'</button>';
2698 $content[] = wp_nonce_field( CHART_BUILDER_NAME . '-sale-banner' , CHART_BUILDER_NAME . '-sale-banner' );
2699 $content[] = '</form>';
2700 $content[] = '</div>';
2701 }
2702
2703 $content[] = '</div>';
2704
2705 $content[] = '<script>';
2706 $content[] = "
2707 function aysChartChristmasCopyToClipboard(text) {
2708 var textarea = document.createElement('textarea');
2709 textarea.value = text;
2710 textarea.style.position = 'fixed';
2711 textarea.style.opacity = '0';
2712 document.body.appendChild(textarea);
2713
2714 textarea.select();
2715 textarea.setSelectionRange(0, 99999);
2716
2717 try {
2718 document.execCommand('copy');
2719 aysChartChristmasShowCopyNotification('" . __( 'Coupon code copied!', "chart-builder" ) . "');
2720 } catch (err) {
2721 console.error('Failed to copy text: ', err);
2722 }
2723
2724 document.body.removeChild(textarea);
2725 }
2726
2727 function aysChartChristmasShowCopyNotification(message) {
2728 var existingNotification = document.querySelector('.ays-chart-christmas-banner-copy-notification');
2729 if (existingNotification) {
2730 document.body.removeChild(existingNotification);
2731 }
2732
2733 var notification = document.createElement('div');
2734 notification.className = 'ays-chart-christmas-banner-copy-notification';
2735 notification.textContent = message;
2736 document.body.appendChild(notification);
2737
2738 setTimeout(function() {
2739 notification.classList.add('show');
2740 }, 10);
2741
2742 setTimeout(function() {
2743 notification.classList.remove('show');
2744 setTimeout(function() {
2745 if (notification.parentNode) {
2746 document.body.removeChild(notification);
2747 }
2748 }, 300);
2749 }, 2000);
2750 }";
2751 $content[] = '</script>';
2752
2753 $content[] = '<style>';
2754 $content[] = '
2755 /* Christmas banner start */
2756
2757 div#ays-chart-christmas-banner-main .btn-link {
2758 background-color: transparent;
2759 display: inline-block;
2760 font-weight: 400;
2761 text-align: center;
2762 white-space: nowrap;
2763 vertical-align: middle;
2764 -webkit-user-select: none;
2765 -moz-user-select: none;
2766 -ms-user-select: none;
2767 user-select: none;
2768 border: 1px solid transparent;
2769 padding: .375rem .75rem;
2770 font-size: 12px;
2771 line-height: 1.5;
2772 border-radius: .25rem;
2773 color: rgba(255, 255, 255, .6);
2774 }
2775
2776 div#ays-chart-christmas-banner-main.ays-chart-christmas-banner-info {
2777 background: linear-gradient(to right, hsl(0, 70%, 28%), hsl(0, 65%, 38%), hsl(0, 70%, 28%));
2778 padding: unset;
2779 border-left: 0;
2780 position: relative;
2781 }
2782
2783 #ays-chart-christmas-banner-main .ays-chart-christmas-banner-month {
2784 position: relative;
2785 padding: 15px 40px;
2786 overflow: hidden;
2787 }
2788
2789 /* Background effects */
2790 .ays-chart-christmas-banner-bg-effects {
2791 position: absolute;
2792 top: 0;
2793 left: 0;
2794 right: 0;
2795 bottom: 0;
2796 pointer-events: none;
2797 z-index: 1;
2798 }
2799
2800 .ays-chart-christmas-banner-bg-gradient-1 {
2801 position: absolute;
2802 top: 0;
2803 left: 30%;
2804 width: 40%;
2805 height: 100%;
2806 background: radial-gradient(circle, rgba(202, 43, 43, 0.5) 0%, transparent 60%);
2807 opacity: 0.4;
2808 }
2809
2810 .ays-chart-christmas-banner-bg-gradient-2 {
2811 position: absolute;
2812 top: 0;
2813 right: 15%;
2814 width: 35%;
2815 height: 100%;
2816 background: radial-gradient(circle, rgba(246, 201, 85, 0.15) 0%, transparent 50%);
2817 opacity: 0.3;
2818 }
2819
2820 .ays-chart-christmas-banner-snowflake {
2821 position: absolute;
2822 color: rgba(255, 255, 255, 0.2);
2823 font-size: 20px;
2824 animation: ays-chart-christmas-snowfall linear infinite;
2825 top: -10px;
2826 }
2827
2828 @keyframes ays-chart-christmas-snowfall {
2829 0% {
2830 transform: translateY(-10px) rotate(0deg);
2831 opacity: 0;
2832 }
2833 10% {
2834 opacity: 0.8;
2835 }
2836 90% {
2837 opacity: 0.8;
2838 }
2839 100% {
2840 transform: translateY(100%) rotate(360deg);
2841 opacity: 0;
2842 }
2843 }
2844
2845 .ays-chart-christmas-banner-sparkle {
2846 position: absolute;
2847 color: hsl(43, 90%, 65%);
2848 animation: ays-chart-christmas-twinkle 2s ease-in-out infinite;
2849 }
2850
2851 @keyframes ays-chart-christmas-twinkle {
2852 0%, 100% {
2853 opacity: 0.3;
2854 transform: scale(0.8);
2855 }
2856 50% {
2857 opacity: 1;
2858 transform: scale(1.2);
2859 }
2860 }
2861
2862 /* Main content */
2863 .ays-chart-christmas-banner-content {
2864 position: relative;
2865 display: flex;
2866 align-items: center;
2867 justify-content: space-between;
2868 z-index: 2;
2869 }
2870
2871 /* Left section */
2872 .ays-chart-christmas-banner-left {
2873 display: flex;
2874 align-items: center;
2875 gap: 50px;
2876 }
2877
2878 .ays-chart-christmas-banner-gift-wrapper {
2879 position: relative;
2880 animation: ays-chart-christmas-float 3s ease-in-out infinite;
2881 }
2882
2883 .ays-chart-christmas-banner-gift-icon {
2884 width: 48px;
2885 height: 48px;
2886 color: rgba(255, 247, 237, 0.9);
2887 }
2888
2889 @keyframes ays-chart-christmas-float {
2890 0%, 100% {
2891 transform: translateY(0);
2892 }
2893 50% {
2894 transform: translateY(-5px);
2895 }
2896 }
2897
2898 .ays-chart-christmas-banner-hat {
2899 position: absolute;
2900 top: -12px;
2901 right: -4px;
2902 width: 24px;
2903 height: 24px;
2904 }
2905
2906 .ays-chart-christmas-banner-hat-svg {
2907 width: 100%;
2908 height: 100%;
2909 }
2910
2911 .ays-chart-christmas-banner-special-label {
2912 color: hsl(43, 90%, 65%);
2913 font-size: 14px;
2914 font-weight: 500;
2915 text-transform: uppercase;
2916 letter-spacing: 1px;
2917 /* font-family: "Outfit", sans-serif; */
2918 }
2919
2920 .ays-chart-christmas-banner-special-label-name {
2921 color: #fffaf0;
2922 text-align: center;
2923 }
2924
2925 div#ays-chart-christmas-banner-main .ays-chart-christmas-banner-special-label-name-link {
2926 color: #fffaf0;
2927 box-shadow: unset;
2928 }
2929
2930 /* Center section */
2931 .ays-chart-christmas-banner-center {
2932 display: flex;
2933 flex-direction: row;
2934 text-align: center;
2935 justify-content: center;
2936 align-items: center;
2937 gap: 30px;
2938 }
2939
2940 .ays-chart-christmas-banner-discount-text {
2941 font-family: "Outfit", sans-serif;
2942 font-weight: 800;
2943 font-size: 30px;
2944 color: hsl(40, 100%, 97%);
2945 letter-spacing: -1px;
2946 line-height: 1;
2947 }
2948
2949 .ays-chart-christmas-banner-limited-offer {
2950 color: rgba(255, 247, 237, 0.7);
2951 font-size: 13px;
2952 font-weight: 500;
2953 }
2954
2955 /* Right section */
2956 .ays-chart-christmas-banner-right {
2957 display: flex;
2958 align-items: center;
2959 gap: 20px;
2960 }
2961
2962 .ays-chart-christmas-banner-coupon-box {
2963 border: 2px dashed rgba(255, 255, 255, 0.4);
2964 padding: 8px 16px;
2965 border-radius: 6px;
2966 background: rgba(255, 255, 255, 0.1);
2967 cursor: pointer;
2968 transition: all 0.3s;
2969 display: flex;
2970 align-items: center;
2971 gap: 8px;
2972 backdrop-filter: blur(10px);
2973 }
2974
2975 .ays-chart-christmas-banner-coupon-box:hover {
2976 background: rgba(255, 255, 255, 0.2);
2977 border-color: rgba(255, 255, 255, 0.6);
2978 transform: translateY(-1px);
2979 }
2980
2981 .ays-chart-christmas-banner-coupon-text {
2982 font-size: 16px;
2983 font-weight: 700;
2984 letter-spacing: 1px;
2985 color: #fff;
2986 font-family: monospace;
2987 }
2988
2989 .ays-chart-christmas-banner-copy-icon {
2990 opacity: 0.8;
2991 transition: opacity 0.3s;
2992 }
2993
2994 .ays-chart-christmas-banner-coupon-box:hover .ays-chart-christmas-banner-copy-icon {
2995 opacity: 1;
2996 }
2997
2998 #ays-chart-christmas-banner-main .ays-chart-christmas-banner-buy-now-btn {
2999 background-color: #fbe19f;
3000 color: hsl(0, 72%, 35%);
3001 padding: 10px 30px;
3002 border-radius: 9999px;
3003 font-size: 16px;
3004 font-weight: 600;
3005 font-family: "Outfit", sans-serif;
3006 border: none;
3007 cursor: pointer;
3008 transition: all 0.3s;
3009 text-decoration: none;
3010 display: flex;
3011 align-items: center;
3012 gap: 6px;
3013 box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15), 0 0 30px rgba(246, 201, 85, 0.2);
3014 }
3015
3016 #ays-chart-christmas-banner-main .ays-chart-christmas-banner-buy-now-btn:hover {
3017 background-color: #f2d58c;
3018 transform: scale(1.05);
3019 box-shadow: 0 8px 30px rgba(0, 0, 0, 0.2), 0 0 40px rgba(246, 201, 85, 0.3);
3020 }
3021
3022 .ays-chart-christmas-banner-btn-arrow {
3023 display: inline-block;
3024 transition: transform 0.3s;
3025 }
3026
3027 .ays-chart-christmas-banner-buy-now-btn:hover .ays-chart-christmas-banner-btn-arrow {
3028 transform: translateX(4px);
3029 }
3030
3031 /* Notification */
3032 .ays-chart-christmas-banner-copy-notification {
3033 position: fixed;
3034 top: 50%;
3035 left: 50%;
3036 transform: translate(-50%, -50%);
3037 background: rgba(0, 0, 0, 0.8);
3038 color: #fff;
3039 padding: 12px 24px;
3040 border-radius: 8px;
3041 font-size: 14px;
3042 z-index: 10000;
3043 opacity: 0;
3044 transition: opacity 0.3s;
3045 }
3046
3047 .ays-chart-christmas-banner-copy-notification.show {
3048 opacity: 1;
3049 }
3050
3051 /* Dismiss button */
3052 #ays-chart-christmas-banner-main #ays-chart-christmas-banner-dismiss-content {
3053 display: flex;
3054 justify-content: center;
3055 }
3056
3057 #ays-chart-christmas-banner-main #ays-chart-christmas-banner-dismiss-content .ays-button {
3058 margin: 0 !important;
3059 font-size: 13px;
3060 color: rgba(150, 147, 147, 0.69);
3061 }
3062
3063 /* Responsive */
3064 @media (max-width: 1024px) {
3065 .ays-chart-christmas-banner-discount-text {
3066 font-size: 40px;
3067 }
3068 .ays-chart-christmas-banner-content {
3069 flex-wrap: wrap;
3070 }
3071 }
3072
3073 @media (max-width: 768px) {
3074 #ays-chart-christmas-banner-main {
3075 display: none !important;
3076 }
3077 }
3078 /* Christmas banner end */
3079 ';
3080 $content[] = '</style>';
3081
3082 $content = implode( '', $content );
3083
3084 echo $content;
3085 }
3086 }
3087
3088 public function ays_chart_update_banner_time(){
3089 if (!current_user_can('manage_options')) {
3090 return array('error' => 'Insufficient permissions');
3091 }
3092
3093 $date = time() + ( 3 * 24 * 60 * 60 ) + (int) ( get_option( 'gmt_offset' ) * HOUR_IN_SECONDS);
3094 // $date = time() + ( 60 ) + (int) ( get_option( 'gmt_offset' ) * HOUR_IN_SECONDS); // for testing | 1 min
3095 $next_3_days = gmdate('M d, Y H:i:s', $date);
3096
3097 $ays_chart_banner_time = get_option('ays_chart_20_bundle_banner_time');
3098
3099 if ( !$ays_chart_banner_time || is_null( $ays_chart_banner_time ) ) {
3100 update_option('ays_chart_20_bundle_banner_time', $next_3_days );
3101 }
3102
3103 $get_ays_chart_banner_time = get_option('ays_chart_20_bundle_banner_time');
3104
3105 $val = 60*60*24*0.5; // half day
3106 // $val = 60; // for testing | 1 min
3107
3108 $current_date = current_time( 'mysql' );
3109 $date_diff = strtotime($current_date) - intval(strtotime($get_ays_chart_banner_time));
3110
3111 $days_diff = $date_diff / $val;
3112 if(intval($days_diff) > 0 ){
3113 update_option('ays_chart_20_bundle_banner_time', $next_3_days);
3114 $get_ays_chart_banner_time = get_option('ays_chart_20_bundle_banner_time');
3115 }
3116
3117 return $get_ays_chart_banner_time;
3118 }
3119
3120 public function author_user_search() {
3121 check_ajax_referer( 'cbuilder-author-user-search', 'security' );
3122 $params = isset($_REQUEST['params']) ? sanitize_text_field(wp_unslash($_REQUEST['params'])) : array();
3123 $search = isset($params['search']) && $params['search'] != '' ? sanitize_text_field( $params['search'] ) : null;
3124 $checked = isset($params['val']) && $params['val'] !='' ? sanitize_text_field( $params['val'] ) : null;
3125 $args = 'search=';
3126 if ($search !== null) {
3127 $args .= '*';
3128 $args .= $search;
3129 $args .= '*';
3130 }
3131
3132 $users = get_users($args);
3133
3134 $content_text = array(
3135 'results' => array()
3136 );
3137
3138 foreach ($users as $key => $value) {
3139 if ($checked !== null) {
3140 if ( !is_array( $checked ) ) {
3141 $checked2 = $checked;
3142 $checked = array();
3143 $checked[] = absint($checked2);
3144 }
3145 if (in_array($value->ID, $checked)) {
3146 continue;
3147 } else {
3148 $content_text['results'][] = array(
3149 'id' => $value->ID,
3150 'text' => $value->data->display_name,
3151 );
3152 }
3153 } else {
3154 $content_text['results'][] = array(
3155 'id' => $value->ID,
3156 'text' => $value->data->display_name,
3157 );
3158 }
3159 }
3160
3161 ob_end_clean();
3162 echo json_encode($content_text);
3163 wp_die();
3164 }
3165
3166 /**
3167 * Determine if the plugin/addon installations are allowed.
3168 *
3169 * @since 6.4.0.4
3170 *
3171 * @param string $type Should be `plugin` or `addon`.
3172 *
3173 * @return bool
3174 */
3175 public static function ays_chart_can_install( $type ) {
3176
3177 return self::ays_chart_can_do( 'install', $type );
3178 }
3179
3180 /**
3181 * Determine if the plugin/addon activations are allowed.
3182 *
3183 * @since 6.4.0.4
3184 *
3185 * @param string $type Should be `plugin` or `addon`.
3186 *
3187 * @return bool
3188 */
3189 public static function ays_chart_can_activate( $type ) {
3190
3191 return self::ays_chart_can_do( 'activate', $type );
3192 }
3193
3194 /**
3195 * Determine if the plugin/addon installations/activations are allowed.
3196 *
3197 * @since 6.4.0.4
3198 *
3199 * @param string $what Should be 'activate' or 'install'.
3200 * @param string $type Should be `plugin` or `addon`.
3201 *
3202 * @return bool
3203 */
3204 public static function ays_chart_can_do( $what, $type ) {
3205
3206 if ( ! in_array( $what, array( 'install', 'activate' ), true ) ) {
3207 return false;
3208 }
3209
3210 if ( ! in_array( $type, array( 'plugin', 'addon' ), true ) ) {
3211 return false;
3212 }
3213
3214 $capability = $what . '_plugins';
3215
3216 if ( ! current_user_can( $capability ) ) {
3217 return false;
3218 }
3219
3220 // Determine whether file modifications are allowed and it is activation permissions checking.
3221 if ( $what === 'install' && ! wp_is_file_mod_allowed( 'ays_chart_can_install' ) ) {
3222 return false;
3223 }
3224
3225 // All plugin checks are done.
3226 if ( $type === 'plugin' ) {
3227 return true;
3228 }
3229 return false;
3230 }
3231
3232 /**
3233 * Activate plugin.
3234 *
3235 * @since 1.0.0
3236 * @since 6.4.0.4 Updated the permissions checking.
3237 */
3238 public function ays_chart_activate_plugin() {
3239
3240 // Run a security check.
3241 if ( isset( $_REQUEST['_ajax_nonce'] ) ) {
3242 check_ajax_referer( $this->plugin_name . '-install-plugin-nonce', sanitize_key( $_REQUEST['_ajax_nonce'] ) );
3243 }
3244
3245 // Check for permissions.
3246 if ( ! current_user_can( 'activate_plugins' ) ) {
3247 wp_send_json_error( esc_html__( 'Plugin activation is disabled for you on this site.', 'chart-builder' ) );
3248 }
3249
3250 $type = 'addon';
3251
3252 if ( isset( $_POST['plugin'] ) ) {
3253
3254 if ( ! empty( $_POST['type'] ) ) {
3255 $type = sanitize_key( $_POST['type'] );
3256 }
3257
3258 $plugin = sanitize_text_field( wp_unslash( $_POST['plugin'] ) );
3259 $activate = activate_plugins( $plugin );
3260
3261 if ( ! is_wp_error( $activate ) ) {
3262 if ( $type === 'plugin' ) {
3263 wp_send_json_success( esc_html__( 'Plugin activated.', 'chart-builder' ) );
3264 } else {
3265 ( esc_html__( 'Addon activated.', 'chart-builder' ) );
3266 }
3267 }
3268 }
3269
3270 if ( $type === 'plugin' ) {
3271 wp_send_json_error( esc_html__( 'Could not activate the plugin. Please activate it on the Plugins page.', 'chart-builder' ) );
3272 }
3273
3274 wp_send_json_error( esc_html__( 'Could not activate the addon. Please activate it on the Plugins page.', 'chart-builder' ) );
3275 }
3276
3277 /**
3278 * Install addon.
3279 *
3280 * @since 1.0.0
3281 * @since 6.4.0.4 Updated the permissions checking.
3282 */
3283 public function ays_chart_install_plugin() {
3284
3285 // Run a security check.
3286 if ( isset( $_REQUEST['_ajax_nonce'] ) ) {
3287 check_ajax_referer( $this->plugin_name . '-install-plugin-nonce', sanitize_key( $_REQUEST['_ajax_nonce'] ) );
3288 }
3289
3290 $generic_error = esc_html__( 'There was an error while performing your request.', 'chart-builder' );
3291 $type = ! empty( $_POST['type'] ) ? sanitize_key( $_POST['type'] ) : '';
3292
3293 // Check if new installations are allowed.
3294 if ( ! self::ays_chart_can_install( $type ) ) {
3295 wp_send_json_error( $generic_error );
3296 }
3297
3298 $error = $type === 'plugin'
3299 ? esc_html__( 'Could not install the plugin. Please download and install it manually.', 'chart-builder' )
3300 : "";
3301
3302 $plugin_url = ! empty( $_POST['plugin'] ) ? esc_url_raw( wp_unslash( $_POST['plugin'] ) ) : '';
3303
3304 if ( empty( $plugin_url ) ) {
3305 wp_send_json_error( $error );
3306 }
3307
3308 // Prepare variables.
3309 $url = esc_url_raw(
3310 add_query_arg(
3311 [
3312 'page' => 'chart-builder-featured-plugins',
3313 ],
3314 admin_url( 'admin.php' )
3315 )
3316 );
3317
3318 ob_start();
3319 $creds = request_filesystem_credentials( $url, '', false, false, null );
3320
3321 // Hide the filesystem credentials form.
3322 ob_end_clean();
3323
3324 // Check for file system permissions.
3325 if ( $creds === false ) {
3326 wp_send_json_error( $error );
3327 }
3328
3329 if ( ! WP_Filesystem( $creds ) ) {
3330 wp_send_json_error( $error );
3331 }
3332
3333 /*
3334 * We do not need any extra credentials if we have gotten this far, so let's install the plugin.
3335 */
3336 require_once CHART_BUILDER_DIR . 'includes/admin/class-chart-builder-upgrader.php';
3337 require_once CHART_BUILDER_DIR . 'includes/admin/class-chart-builder-install-skin.php';
3338 require_once CHART_BUILDER_DIR . 'includes/admin/class-chart-builder-skin.php';
3339
3340
3341 // Do not allow WordPress to search/download translations, as this will break JS output.
3342 remove_action( 'upgrader_process_complete', array( 'Language_Pack_Upgrader', 'async_upgrade' ), 20 );
3343
3344 // Create the plugin upgrader with our custom skin.
3345 $installer = new ChartBuilder\Helpers\ChartBuilderPluginSilentUpgrader( new Chart_Builder_Install_Skin() );
3346
3347 // Error check.
3348 if ( ! method_exists( $installer, 'install' ) ) {
3349 wp_send_json_error( $error );
3350 }
3351
3352 $installer->install( $plugin_url );
3353
3354 // Flush the cache and return the newly installed plugin basename.
3355 wp_cache_flush();
3356
3357 $plugin_basename = $installer->plugin_info();
3358
3359 if ( empty( $plugin_basename ) ) {
3360 wp_send_json_error( $error );
3361 }
3362
3363 $result = array(
3364 'msg' => $generic_error,
3365 'is_activated' => false,
3366 'basename' => $plugin_basename,
3367 );
3368
3369 // Check for permissions.
3370 if ( ! current_user_can( 'activate_plugins' ) ) {
3371 $result['msg'] = $type === 'plugin' ? esc_html__( 'Plugin installed.', 'chart-builder' ) : "";
3372
3373 wp_send_json_success( $result );
3374 }
3375
3376 // Activate the plugin silently.
3377 $activated = activate_plugin( $plugin_basename );
3378 remove_action( 'activated_plugin', array( 'ays_sccp_activation_redirect_method', 'gallery_p_gallery_activation_redirect_method', 'poll_maker_activation_redirect_method' ), 100 );
3379
3380 if ( ! is_wp_error( $activated ) ) {
3381
3382 $result['is_activated'] = true;
3383 $result['msg'] = $type === 'plugin' ? esc_html__( 'Plugin installed and activated.', 'chart-builder' ) : esc_html__( 'Addon installed and activated.', 'chart-builder' );
3384
3385 wp_send_json_success( $result );
3386 }
3387
3388 // Fallback error just in case.
3389 wp_send_json_error( $result );
3390 }
3391
3392 /**
3393 * List of AM plugins that we propose to install.
3394 *
3395 * @since 6.4.0.4
3396 *
3397 * @return array
3398 */
3399 protected function get_am_plugins() {
3400 if ( !isset( $_SESSION ) ) {
3401 session_start();
3402 }
3403
3404 $images_url = CHART_BUILDER_ADMIN_URL . '/images/icons/';
3405
3406 $plugin_slug = array(
3407 'fox-lms',
3408 'quiz-maker',
3409 'survey-maker',
3410 'chart-builder',
3411 'ays-popup-box',
3412 'secure-copy-content-protection',
3413 'gallery-photo-gallery',
3414 'ays-chatgpt-assistant',
3415 'easy-form',
3416 );
3417
3418 $plugin_url_arr = array();
3419 foreach ($plugin_slug as $key => $slug) {
3420 if ( isset( $_SESSION['ays_chart_our_product_links'] ) && !empty( $_SESSION['ays_chart_our_product_links'] )
3421 && isset( $_SESSION['ays_chart_our_product_links'][$slug] ) && !empty( $_SESSION['ays_chart_our_product_links'][$slug] ) ) {
3422 $plugin_url = (isset( $_SESSION['ays_chart_our_product_links'][$slug] ) && $_SESSION['ays_chart_our_product_links'][$slug] != "") ? esc_url_raw(sanitize_text_field($_SESSION['ays_chart_our_product_links'][$slug])) : "";
3423 } else {
3424 $latest_version = $this->ays_chart_get_latest_plugin_version($slug);
3425 $plugin_url = 'https://downloads.wordpress.org/plugin/'. $slug .'.zip';
3426 if ( $latest_version != '' ) {
3427 $plugin_url = 'https://downloads.wordpress.org/plugin/'. $slug .'.'. $latest_version .'.zip';
3428 $_SESSION['ays_chart_our_product_links'][$slug] = $plugin_url;
3429 }
3430 }
3431
3432 $plugin_url_arr[$slug] = $plugin_url;
3433 }
3434
3435 $plugins_array = array(
3436 'fox-lms/fox-lms.php' => array(
3437 'icon' => $images_url . 'icon-fox-lms-128x128.png',
3438 'name' => __( 'Fox LMS', 'chart-builder' ),
3439 'desc' => __( 'Build and manage online courses directly on your WordPress site.', 'chart-builder' ),
3440 'desc_hidden' => __( 'With the FoxLMS plugin, you can create, sell, and organize courses, lessons, and quizzes, transforming your website into a dynamic e-learning platform.', 'chart-builder' ),
3441 'wporg' => 'https://wordpress.org/plugins/fox-lms/',
3442 'buy_now' => 'https://foxlms.com/pricing/?utm_source=dashboard&utm_medium=chart-free&utm_campaign=fox-lms-our-products-page',
3443 'url' => $plugin_url_arr['fox-lms'],
3444 ),
3445 'quiz-maker/quiz-maker.php' => array(
3446 'icon' => $images_url . 'icon-quiz-128x128.png',
3447 'name' => __( 'Quiz Maker', 'chart-builder' ),
3448 'desc' => __( 'Create powerful and engaging quizzes, tests, and exams in minutes.', 'chart-builder' ),
3449 'desc_hidden' => __( 'Build an unlimited number of quizzes and questions.', 'chart-builder' ),
3450 'wporg' => 'https://wordpress.org/plugins/quiz-maker/',
3451 'buy_now' => 'https://ays-pro.com/wordpress/quiz-maker/',
3452 'url' => $plugin_url_arr['quiz-maker'],
3453 ),
3454 'survey-maker/survey-maker.php' => array(
3455 'icon' => $images_url . 'icon-survey-128x128.png',
3456 'name' => __( 'Survey Maker', 'chart-builder' ),
3457 'desc' => __( 'Make amazing online surveys and get real-time feedback quickly and easily.', 'chart-builder' ),
3458 'desc_hidden' => __( 'Learn what your website visitors want, need, and expect with the help of Survey Maker. Build surveys without limiting your needs.', 'chart-builder' ),
3459 'wporg' => 'https://wordpress.org/plugins/survey-maker/',
3460 'buy_now' => 'https://ays-pro.com/wordpress/survey-maker',
3461 'url' => $plugin_url_arr['survey-maker'],
3462 ),
3463 'poll-maker/poll-maker-ays.php' => array(
3464 'icon' => $images_url . 'icon-poll-128x128.png',
3465 'name' => __( 'Poll Maker', 'chart-builder' ),
3466 'desc' => __( 'Create amazing online polls for your WordPress website super easily.', 'chart-builder' ),
3467 'desc_hidden' => __( 'Build up various types of polls in a minute and get instant feedback on any topic or product.', 'chart-builder' ),
3468 'wporg' => 'https://wordpress.org/plugins/poll-maker/',
3469 'buy_now' => 'https://ays-pro.com/wordpress/poll-maker/',
3470 'url' => $plugin_url_arr['poll-maker'],
3471 ),
3472 'ays-popup-box/ays-pb.php' => array(
3473 'icon' => $images_url . 'icon-popup-128x128.png',
3474 'name' => __( 'Popup Box', 'chart-builder' ),
3475 'desc' => __( 'Popup everything you want! Create informative and promotional popups all in one plugin.', 'chart-builder' ),
3476 'desc_hidden' => __( 'Attract your visitors and convert them into email subscribers and paying customers.', 'chart-builder' ),
3477 'wporg' => 'https://wordpress.org/plugins/ays-popup-box/',
3478 'buy_now' => 'https://ays-pro.com/wordpress/popup-box/',
3479 'url' => $plugin_url_arr['ays-popup-box'],
3480 ),
3481 'secure-copy-content-protection/secure-copy-content-protection.php' => array(
3482 'icon' => $images_url . 'icon-sccp-128x128.png',
3483 'name' => __( 'Secure Copy Content Protection', 'chart-builder' ),
3484 'desc' => __( 'Disable the right click, copy paste, content selection and copy shortcut keys on your website.', 'chart-builder' ),
3485 'desc_hidden' => __( 'Protect web content from being plagiarized. Prevent plagiarism from your website with this easy to use plugin.', 'chart-builder' ),
3486 'wporg' => 'https://wordpress.org/plugins/secure-copy-content-protection/',
3487 'buy_now' => 'https://ays-pro.com/wordpress/secure-copy-content-protection/',
3488 'url' => $plugin_url_arr['secure-copy-content-protection'],
3489 ),
3490 'gallery-photo-gallery/gallery-photo-gallery.php' => array(
3491 'icon' => $images_url . 'icon-gallery-128x128.png',
3492 'name' => __( 'Gallery Photo Gallery', 'chart-builder' ),
3493 'desc' => __( 'Create unlimited galleries and include unlimited images in those galleries.', 'chart-builder' ),
3494 'desc_hidden' => __( 'Represent images in an attractive way. Attract people with your own single and multiple free galleries from your photo library.', 'chart-builder' ),
3495 'wporg' => 'https://wordpress.org/plugins/gallery-photo-gallery/',
3496 'buy_now' => 'https://ays-pro.com/wordpress/photo-gallery/',
3497 'url' => $plugin_url_arr['gallery-photo-gallery'],
3498 ),
3499 'ays-chatgpt-assistant/ays-chatgpt-assistant.php' => array(
3500 'icon' => $images_url . 'icon-chatgpt-128x128.png',
3501 'name' => __( 'AI Assistant with ChatGPT', 'chart-builder' ),
3502 'desc' => __( 'ChatGPT AI Assistant plugin gives you the ability to automate various tasks related to content creation and programming.', 'chart-builder' ),
3503 'desc_hidden' => __( 'The ChatGPT AI Assistant plugin is here to empower your WordPress website. Have your personal chatbot, content generator right on your front end and backend.', 'chart-builder' ),
3504 'wporg' => 'https://wordpress.org/plugins/ays-chatgpt-assistant/',
3505 'buy_now' => 'https://ays-pro.com/wordpress/chatgpt-assistant',
3506 'url' => $plugin_url_arr['ays-chatgpt-assistant'],
3507 ),
3508 'easy-form/easy-form.php' => array(
3509 'icon' => $images_url . 'icon-form-128x128.png',
3510 'name' => __( 'Easy Form', 'chart-builder' ),
3511 'desc' => __( 'Choose the best WordPress form builder plugin. ', 'chart-builder' ),
3512 'desc_hidden' => __( 'Create contact forms, payment forms, surveys, and many more custom forms. Build forms easily with us.', 'chart-builder' ),
3513 'wporg' => 'https://wordpress.org/plugins/easy-form/',
3514 'buy_now' => 'https://ays-pro.com/wordpress/easy-form',
3515 'url' => $plugin_url_arr['easy-form'],
3516 ),
3517 );
3518
3519 return $plugins_array;
3520 }
3521
3522 protected function ays_chart_get_latest_plugin_version( $slug ){
3523
3524 if ( is_null( $slug ) || empty($slug) ) {
3525 return "";
3526 }
3527
3528 $version_latest = "";
3529
3530 if ( ! function_exists( 'plugins_api' ) ) {
3531 require_once( ABSPATH . 'wp-admin/includes/plugin-install.php' );
3532 }
3533
3534 // set the arguments to get latest info from repository via API ##
3535 $args = array(
3536 'slug' => $slug,
3537 'fields' => array(
3538 'version' => true,
3539 )
3540 );
3541
3542 /** Prepare our query */
3543 $call_api = plugins_api( 'plugin_information', $args );
3544
3545 /** Check for Errors & Display the results */
3546 if ( is_wp_error( $call_api ) ) {
3547 $api_error = $call_api->get_error_message();
3548 } else {
3549
3550 //echo $call_api;
3551 // everything ##
3552 if ( ! empty( $call_api->version ) ) {
3553 $version_latest = $call_api->version;
3554 }
3555 }
3556
3557 return $version_latest;
3558 }
3559
3560 /**
3561 * Get AM plugin data to display in the Addons section of About tab.
3562 *
3563 * @since 6.4.0.4
3564 *
3565 * @param string $plugin Plugin slug.
3566 * @param array $details Plugin details.
3567 * @param array $all_plugins List of all plugins.
3568 *
3569 * @return array
3570 */
3571 protected function get_plugin_data( $plugin, $details, $all_plugins ) {
3572
3573 $have_pro = ( ! empty( $details['pro'] ) && ! empty( $details['pro']['plug'] ) );
3574 $show_pro = false;
3575
3576 $plugin_data = array();
3577
3578 if ( $have_pro ) {
3579 if ( array_key_exists( $plugin, $all_plugins ) ) {
3580 if ( is_plugin_active( $plugin ) ) {
3581 $show_pro = true;
3582 }
3583 }
3584 if ( array_key_exists( $details['pro']['plug'], $all_plugins ) ) {
3585 $show_pro = true;
3586 }
3587 if ( $show_pro ) {
3588 $plugin = $details['pro']['plug'];
3589 $details = $details['pro'];
3590 }
3591 }
3592
3593 if ( array_key_exists( $plugin, $all_plugins ) ) {
3594 if ( is_plugin_active( $plugin ) ) {
3595 // Status text/status.
3596 $plugin_data['status_class'] = 'status-active';
3597 $plugin_data['status_text'] = esc_html__( 'Active', 'chart-builder' );
3598 // Button text/status.
3599 $plugin_data['action_class'] = $plugin_data['status_class'] . ' ays-chart-card__btn-info disabled';
3600 $plugin_data['action_text'] = esc_html__( 'Activated', 'chart-builder' );
3601 $plugin_data['plugin_src'] = esc_attr( $plugin );
3602 } else {
3603 // Status text/status.
3604 $plugin_data['status_class'] = 'status-installed';
3605 $plugin_data['status_text'] = esc_html__( 'Inactive', 'chart-builder' );
3606 // Button text/status.
3607 $plugin_data['action_class'] = $plugin_data['status_class'] . ' ays-chart-card__btn-info';
3608 $plugin_data['action_text'] = esc_html__( 'Activate', 'chart-builder' );
3609 $plugin_data['plugin_src'] = esc_attr( $plugin );
3610 }
3611 } else {
3612 // Doesn't exist, install.
3613 // Status text/status.
3614 $plugin_data['status_class'] = 'status-missing';
3615
3616 if ( isset( $details['act'] ) && 'go-to-url' === $details['act'] ) {
3617 $plugin_data['status_class'] = 'status-go-to-url';
3618 }
3619 $plugin_data['status_text'] = esc_html__( 'Not Installed', 'chart-builder' );
3620 // Button text/status.
3621 $plugin_data['action_class'] = $plugin_data['status_class'] . ' ays-chart-card__btn-info';
3622 $plugin_data['action_text'] = esc_html__( 'Install Plugin', 'chart-builder' );
3623 $plugin_data['plugin_src'] = esc_url( $details['url'] );
3624 }
3625
3626 $plugin_data['details'] = $details;
3627
3628 return $plugin_data;
3629 }
3630
3631 /**
3632 * Display the Addons section of About tab.
3633 *
3634 * @since 6.4.0.4
3635 */
3636 public function output_about_addons() {
3637
3638 if ( ! function_exists( 'get_plugins' ) ) {
3639 require_once ABSPATH . 'wp-admin/includes/plugin.php';
3640 }
3641
3642 $all_plugins = get_plugins();
3643 $am_plugins = $this->get_am_plugins();
3644 $can_install_plugins = self::ays_chart_can_install( 'plugin' );
3645 $can_activate_plugins = self::ays_chart_can_activate( 'plugin' );
3646
3647 $content = '';
3648 $content.= '<div class="ays-chart-cards-block">';
3649 foreach ( $am_plugins as $plugin => $details ){
3650
3651 $plugin_data = $this->get_plugin_data( $plugin, $details, $all_plugins );
3652 $plugin_ready_to_activate = $can_activate_plugins
3653 && isset( $plugin_data['status_class'] )
3654 && $plugin_data['status_class'] === 'status-installed';
3655 $plugin_not_activated = ! isset( $plugin_data['status_class'] )
3656 || $plugin_data['status_class'] !== 'status-active';
3657
3658 $plugin_action_class = ( isset( $plugin_data['action_class'] ) && esc_attr( $plugin_data['action_class'] ) != "" ) ? esc_attr( $plugin_data['action_class'] ) : "";
3659
3660 $plugin_action_class_disbaled = "";
3661 if ( strpos($plugin_action_class, 'status-active') !== false ) {
3662 $plugin_action_class_disbaled = "disbaled='true'";
3663 }
3664
3665 $content .= '
3666 <div class="ays-chart-card">
3667 <div class="ays-chart-card__content flexible">
3668 <div class="ays-chart-card__content-img-box">
3669 <img class="ays-chart-card__img" src="'. esc_url( $plugin_data['details']['icon'] ) .'" alt="'. esc_attr( $plugin_data['details']['name'] ) .'">
3670 </div>
3671 <div class="ays-chart-card__text-block">
3672 <h5 class="ays-chart-card__title">'. esc_html( $plugin_data['details']['name'] ) .'</h5>
3673 <p class="ays-chart-card__text">'. wp_kses_post( $plugin_data['details']['desc'] ) .'
3674 <span class="ays-chart-card__text-hidden">
3675 '. wp_kses_post( $plugin_data['details']['desc_hidden'] ) .'
3676 </span>
3677 </p>
3678 </div>
3679 </div>
3680 <div class="ays-chart-card__footer">';
3681 if ( $can_install_plugins || $plugin_ready_to_activate || ! $details['wporg'] ) {
3682 $content .= '<button class="'. esc_attr( $plugin_data['action_class'] ) .'" data-plugin="'. esc_attr( $plugin_data['plugin_src'] ) .'" data-type="plugin" '. $plugin_action_class_disbaled .'>
3683 '. wp_kses_post( $plugin_data['action_text'] ) .'
3684 </button>';
3685 }
3686 elseif ( $plugin_not_activated ) {
3687 $content .= '<a href="'. esc_url( $details['wporg'] ) .'" target="_blank" rel="noopener noreferrer">
3688 '. esc_html_e( 'WordPress.org', 'chart-builder' ) .'
3689 <span aria-hidden="true" class="dashicons dashicons-external"></span>
3690 </a>';
3691 }
3692 $content .='
3693 <a target="_blank" href="'. esc_url( $plugin_data['details']['buy_now'] ) .'" class="ays-chart-card__btn-primary">'. __('Buy Now', 'chart-builder') .'</a>
3694 </div>
3695 </div>';
3696 }
3697 $install_plugin_nonce = wp_create_nonce( $this->plugin_name . '-install-plugin-nonce' );
3698 $content.= '<input type="hidden" id="ays_chart_ajax_install_plugin_nonce" name="ays_chart_ajax_install_plugin_nonce" value="'. $install_plugin_nonce .'">';
3699 $content.= '</div>';
3700
3701 echo html_entity_decode($content);
3702 }
3703
3704 /**
3705 * Returns the data from Quiz maker.
3706 *
3707 * @access public
3708 */
3709 public function fetch_quiz_maker_data(){
3710 check_ajax_referer( 'cbuilder-fetch-quiz-maker-data', 'security' );
3711
3712 $params = isset($_REQUEST['params']) ? $_REQUEST['params'] : array();
3713 if ( !isset($params) || empty($params) ) {
3714 return array(
3715 'success' => false,
3716 'data' => array(
3717 'msg' => __( "Something went wrong.", "chart-builder" )
3718 )
3719 );
3720 }
3721
3722 $query = isset($params['query']) && $params['query'] !== '' ? $params['query'] : '';
3723 if ( $query == '' ) {
3724 return array(
3725 'success' => false,
3726 'data' => array(
3727 'msg' => __( "No data given.", "chart-builder" )
3728 )
3729 );
3730 }
3731 $quiz_id = isset($params['quizID']) && $params['quizID'] !== '' ? $params['quizID'] : null;
3732 $user_id = get_current_user_id();
3733
3734 $return_results = CBFunctions()->get_quiz_query($query, $quiz_id, $user_id);
3735
3736 if (empty($return_results)) {
3737 return array(
3738 'success' => false,
3739 'data' => array(
3740 'msg' => __( "Something went wrong.", "chart-builder" )
3741 )
3742 );
3743 }
3744
3745 $result_values = $return_results['result'];
3746 $query = $return_results['query'];
3747
3748 if (empty($result_values)) {
3749 return array(
3750 'success' => false,
3751 'data' => array(
3752 'msg' => $return_results['message']
3753 )
3754 );
3755 }
3756
3757 if (count($return_results['result'][0]) != 1 ) {
3758 $results = array();
3759 $headers = array();
3760 if ( $result_values ) {
3761 $row_num = 0;
3762 foreach ( $result_values as $row ) {
3763 $result = array();
3764 foreach ( $row as $k => $v ) {
3765 $result[] = $v;
3766 if ( $row_num === 0 ) {
3767 $headers[] = $k;
3768 }
3769 }
3770 $results[] = $result;
3771 $row_num++;
3772 }
3773 }
3774 } else if (count($return_results['result'][0]) == 1) {
3775 $results = array();
3776 $headers = array();
3777 if ( $result_values ) {
3778 $row_num = 0;
3779 foreach ( $result_values as $index => $row ) {
3780 $result = array();
3781 foreach ( $row as $k => $v ) {
3782 $result[] = strval($index) + 1;
3783 $result[] = $v;
3784 if ( $row_num === 0 ) {
3785 $headers[] = 'Quiz';
3786 $headers[] = $k;
3787 }
3788 }
3789 $results[] = $result;
3790 $row_num++;
3791 }
3792 }
3793 }
3794
3795 if (empty($results)) {
3796 return array(
3797 'success' => false,
3798 'data' => array(
3799 'msg' => $return_results['message']
3800 )
3801 );
3802 }
3803
3804 foreach ($results as $key => $value) {
3805 if (!isset($value) || count($value) <= 1 && $key != 0) {
3806 unset($results[$key]);
3807 }
3808 }
3809
3810 array_unshift($results, $headers);
3811 $results = array_values( $results );
3812 $data = $results;
3813
3814 $headers = $results[0];
3815 unset( $results[0] );
3816
3817 $html = CBFunctions()->get_table_html( $headers, $results );
3818
3819 return array(
3820 'success' => true,
3821 'data' => array(
3822 'table' => $html,
3823 'data' => $data
3824 )
3825 );
3826 }
3827
3828 /**
3829 * Saves the Quiz maker data.
3830 *
3831 * @access public
3832 */
3833 public function save_quiz_maker_data() {
3834 check_ajax_referer( 'cbuilder-save-quiz-maker-data', 'security' );
3835
3836 $params = isset($_REQUEST['params']) ? $_REQUEST['params'] : array();
3837 if ( !isset($params) || empty($params) ) {
3838 return array(
3839 'success' => false,
3840 'data' => array(
3841 'msg' => __( "Something went wrong.", "chart-builder" )
3842 )
3843 );
3844 }
3845
3846 $query_id = isset($params['query']) && $params['query'] !== '' ? $params['query'] : '';
3847 if ( $query_id == '' ) {
3848 return array(
3849 'success' => false,
3850 'data' => array(
3851 'msg' => __( "No data given.", "chart-builder" )
3852 )
3853 );
3854 }
3855
3856 $chart_id = isset( $params['chart_id'] ) ? absint( $params['chart_id'] ) : 0;
3857 $quiz_id = isset($params['quizID']) && $params['quizID'] !== '' ? $params['quizID'] : 0;
3858 $user_id = get_current_user_id();
3859
3860 if ( $chart_id >= 0 ) {
3861
3862 $return_results = CBFunctions()->get_quiz_query($query_id, $quiz_id, $user_id);
3863
3864 if (empty($return_results)) {
3865 return array(
3866 'success' => false,
3867 'data' => array(
3868 'msg' => __( "Something went wrong.", "chart-builder" )
3869 )
3870 );
3871 }
3872
3873 $result_values = $return_results['result'];
3874 $query = $return_results['query'];
3875
3876 if (empty($result_values)) {
3877 return array(
3878 'success' => false,
3879 'data' => array(
3880 'msg' => $return_results['message']
3881 )
3882 );
3883 }
3884
3885 if ( !empty($result_values) && count($return_results['result'][0]) != 1 ) {
3886 $results = array();
3887 $headers = array();
3888 if ( $result_values ) {
3889 $row_num = 0;
3890 foreach ( $result_values as $row ) {
3891 $result = array();
3892 foreach ( $row as $k => $v ) {
3893 $result[] = $v;
3894 if ( $row_num === 0 ) {
3895 $headers[] = $k;
3896 }
3897 }
3898 $results[] = $result;
3899 $row_num++;
3900 }
3901 }
3902 } else if (count($return_results['result'][0]) == 1) {
3903 $results = array();
3904 $headers = array();
3905 if ( $result_values ) {
3906 $row_num = 0;
3907 foreach ( $result_values as $index => $row ) {
3908 $result = array();
3909 foreach ( $row as $k => $v ) {
3910 $result[] = strval($index) + 1;
3911 $result[] = $v;
3912 if ( $row_num === 0 ) {
3913 $headers[] = 'Quiz';
3914 $headers[] = $k;
3915 }
3916 }
3917 $results[] = $result;
3918 $row_num++;
3919 }
3920 }
3921 }
3922
3923 $source_type = 'quiz_maker';
3924 $option_name_for_data = $chart_id == 0 ? 'ays_chart_quiz_maker_results_temp' : 'ays_chart_quiz_maker_results_' . $chart_id;
3925 $option_name_for_quiz = $chart_id == 0 ? 'ays_chart_quiz_maker_quiz_data_temp' : 'ays_chart_quiz_maker_quiz_data_' . $chart_id;
3926
3927 update_option( $option_name_for_data, array(
3928 'source_type' => $source_type,
3929 'source' => $query,
3930 'data' => $results,
3931 ) );
3932 update_option( $option_name_for_quiz, array(
3933 'quiz_query' => $query_id,
3934 'quiz_id' => $quiz_id
3935 ) );
3936
3937 } else {
3938 return array(
3939 'success' => false,
3940 'data' => array(
3941 'msg' => __( 'Given incorrect Chart ID.', "chart-builder")
3942 )
3943 );
3944 }
3945
3946 return array(
3947 'success' => true,
3948 'data' => array(
3949 'msg' => __( 'Data was successfully saved.', "chart-builder" )
3950 )
3951 );
3952 }
3953
3954 /**
3955 * Chart page action hooks
3956 */
3957
3958 /**
3959 * Chart page sources contents
3960 * @param $args
3961 */
3962 public function ays_chart_page_source_contents( $args ){
3963 $chart_source_type = $args['chart_source_type'];
3964
3965 if ($chart_source_type === 'chart-js') {
3966 $sources_contents = apply_filters( 'ays_cb_chart_page_sources_contents_settings_chartjs', array(), $args );
3967 } else {
3968 $sources_contents = apply_filters( 'ays_cb_chart_page_sources_contents_settings', array(), $args );
3969 }
3970
3971 $source_type = $args['source_type'];
3972
3973 $sources = array();
3974 foreach ( $sources_contents as $key => $sources_content ) {
3975 $collapsed = $key == $source_type ? 'false' : 'true';
3976
3977 $content = '<fieldset class="ays-accordion-options-container" data-collapsed="'. $collapsed .'">';
3978 if( isset( $sources_content['title'] ) ){
3979 $content .= '<legend class="ays-accordion-options-header">';
3980 $content .= '<svg class="ays-accordion-arrow '. ( $key == $source_type ? 'ays-accordion-arrow-down' : 'ays-accordion-arrow-right' ) .'" version="1.2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" overflow="visible" preserveAspectRatio="none" viewBox="0 0 24 24" width="20" height="20">
3981 <g>
3982 <path xmlns:default="http://www.w3.org/2000/svg" d="M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z" style="fill: '. ( $key == $source_type ? '#008cff' : '#c4c4c4' ) .';" vector-effect="non-scaling-stroke" />
3983 </g>
3984 </svg>';
3985
3986 $content .= '<span>'. $sources_content['title'] .'</span></legend>';
3987 }
3988
3989 $content .= '<div class="ays-accordion-options-content">';
3990 $content .= $sources_content['content'];
3991 $content .= '</div>';
3992
3993 $content .= '</fieldset>';
3994
3995 $sources[] = $content;
3996 }
3997 $content_for_escape = implode('' , $sources );
3998 echo html_entity_decode( esc_html($content_for_escape) );
3999 }
4000
4001 public function source_contents_import_from_csv_settings( $sources, $args ){
4002 $html_class_prefix = $args['html_class_prefix'];
4003 $html_name_prefix = $args['html_name_prefix'];
4004
4005 ob_start();
4006 ?>
4007 <div class="ays-accordion-data-main-wrap ays-pro-features-v2-main-box" style="padding:10px;">
4008 <div class="ays-pro-features-v2-big-buttons-box">
4009 <a href="https://www.youtube.com/watch?v=tZ8K3y0qOEY" target="_blank" class="ays-pro-features-v2-video-button">
4010 <div class="ays-pro-features-v2-video-icon" style="background-image: url('<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Video_24x24.svg');" data-img-src="<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Video_24x24_Hover.svg"></div>
4011 <div class="ays-pro-features-v2-video-text">
4012 <?php echo esc_html__("Watch Video" , "chart-builder"); ?>
4013 </div>
4014 </a>
4015 <a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-pro-features-v2-upgrade-button">
4016 <div class="ays-pro-features-v2-upgrade-icon" style="background-image: url('<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Locked_24x24.svg');" data-img-src="<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Locked_24x24.svg"></div>
4017 <div class="ays-pro-features-v2-upgrade-text">
4018 <?php echo esc_html__("Upgrade" , "chart-builder"); ?>
4019 </div>
4020 </a>
4021 </div>
4022 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-main ays-accordion-data-main-wrap">
4023 <div class="<?php echo esc_attr($html_class_prefix) ?>file-import-form">
4024 <h6><?php echo esc_html__("Choose what kind of data would you like to upload.", "chart-builder"); ?></h6>
4025 <select class="form-select" style="max-width: none;" id="<?php echo esc_attr($html_class_prefix) ?>import-files-file-type">
4026 <option value="csv">CSV File</option>
4027 </select>
4028 <span style="display: block; font-style: italic; color: gray; font-size: 12px; margin: 5px 0;" class="<?php echo esc_attr($html_class_prefix) ?>small-hint-text"><?php echo esc_html__("Choose the format of the file you are going to import.", "chart-builder"); ?></span>
4029 <p class="<?php echo esc_attr($html_class_prefix) ?>csv-export-example" style="font-size: 15px; font-style: italic;">Example:
4030 <a class="<?php echo esc_attr($html_class_prefix) ?>csv-export-example-link <?php echo esc_attr($html_class_prefix) ?>csv-export-example-link-other-types" style="cursor: pointer;">example.csv</a>
4031 </p>
4032 <div>
4033 <input style="padding: 0.5rem 1rem;" class="form-control form-control-md" id="<?php echo esc_attr($html_class_prefix) ?>import-files-input" name="<?php echo esc_attr($html_class_prefix) ?>import-files-input" type="file" accept=".csv" />
4034 </div>
4035 <div class='ays-chart-file-import-success'></div>
4036 <div class='ays-chart-file-import-error'></div>
4037 <div class="ays-chart-buttons-group">
4038 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-file-import-fetch">
4039 <?php echo esc_html__( 'Show Results', "chart-builder" ); ?>
4040 </button>
4041 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-file-import-show-on-chart">
4042 <svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M13.722 6.59785C12.2407 3.47754 10.0017 1.90723 7.00009 1.90723C3.99697 1.90723 1.75947 3.47754 0.278215 6.59941C0.218802 6.72522 0.187988 6.86263 0.187988 7.00176C0.187988 7.14089 0.218802 7.27829 0.278215 7.4041C1.75947 10.5244 3.99853 12.0947 7.00009 12.0947C10.0032 12.0947 12.2407 10.5244 13.722 7.40254C13.8423 7.14941 13.8423 6.85566 13.722 6.59785ZM7.00009 10.9697C4.47978 10.9697 2.63447 9.6916 1.3329 7.00098C2.63447 4.31035 4.47978 3.03223 7.00009 3.03223C9.5204 3.03223 11.3657 4.31035 12.6673 7.00098C11.3673 9.6916 9.52197 10.9697 7.00009 10.9697ZM6.93759 4.25098C5.41884 4.25098 4.18759 5.48223 4.18759 7.00098C4.18759 8.51973 5.41884 9.75098 6.93759 9.75098C8.45634 9.75098 9.68759 8.51973 9.68759 7.00098C9.68759 5.48223 8.45634 4.25098 6.93759 4.25098ZM6.93759 8.75098C5.9704 8.75098 5.18759 7.96816 5.18759 7.00098C5.18759 6.03379 5.9704 5.25098 6.93759 5.25098C7.90478 5.25098 8.68759 6.03379 8.68759 7.00098C8.68759 7.96816 7.90478 8.75098 6.93759 8.75098Z" fill="#14524A" /></svg>
4043 <?php echo esc_html__( 'Preview', "chart-builder" ); ?>
4044 </button>
4045 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-file-import-save">
4046 <?php echo esc_html__( 'Save data', "chart-builder" ); ?>
4047 </button>
4048 </div>
4049 </div>
4050 </div>
4051 </div>
4052 <?php
4053 $content = ob_get_clean();
4054
4055 $title = __( 'Import data from file', "chart-builder" ) . ' <a class="ays_help" data-bs-toggle="tooltip" title="' . __("With the help of this option, you can import a file in your chosen file format.","chart-builder") . '">
4056 <i class="ays_fa ays_fa_info_circle"></i>
4057 </a>';
4058
4059 $sources['file_import'] = array(
4060 'content' => $content,
4061 'title' => $title
4062 );
4063
4064 return $sources;
4065 }
4066
4067 public function source_contents_import_from_db_settings( $sources, $args ){
4068 $html_class_prefix = $args['html_class_prefix'];
4069 $html_name_prefix = $args['html_name_prefix'];
4070
4071 ob_start();
4072 ?>
4073 <div class="ays-accordion-data-main-wrap ays-pro-features-v2-main-box" style="padding:10px;">
4074 <div class="ays-pro-features-v2-big-buttons-box">
4075 <a href="https://www.youtube.com/watch?v=tZ8K3y0qOEY" target="_blank" class="ays-pro-features-v2-video-button">
4076 <div class="ays-pro-features-v2-video-icon" style="background-image: url('<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Video_24x24.svg');" data-img-src="<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Video_24x24_Hover.svg"></div>
4077 <div class="ays-pro-features-v2-video-text">
4078 <?php echo esc_html__("Watch Video" , "chart-builder"); ?>
4079 </div>
4080 </a>
4081 <a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-pro-features-v2-upgrade-button">
4082 <div class="ays-pro-features-v2-upgrade-icon" style="background-image: url('<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Locked_24x24.svg');" data-img-src="<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Locked_24x24.svg"></div>
4083 <div class="ays-pro-features-v2-upgrade-text">
4084 <?php echo esc_html__("Upgrade" , "chart-builder"); ?>
4085 </div>
4086 </a>
4087 </div>
4088 <div class="<?php echo esc_attr( $html_class_prefix ) ?>source-data-main-wrap ays-accordion-data-main-wrap ">
4089 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-main">
4090 <div id="ays-chart-db-query">
4091 <div class="<?php echo esc_attr($html_class_prefix) ?>-db-query-form">
4092 <div id="db-query-form">
4093 <input type="hidden" name="chart_id" value="1">
4094 <textarea name="query" class="<?php echo esc_attr($html_class_prefix) ?>db-query" placeholder="<?php echo esc_html__( "Add your query here.", 'chart-builder' ); ?>"></textarea>
4095 <div class='db-wizard-success'></div>
4096 <div class='db-wizard-error'></div>
4097 </div>
4098 <div class="ays-chart-db-query-form-button ays-chart-buttons-group">
4099 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-query-fetch">
4100 <?php echo esc_html__( 'Show Results', "chart-builder" ); ?>
4101 </button>
4102 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-query-show-on-chart">
4103 <svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M13.722 6.59785C12.2407 3.47754 10.0017 1.90723 7.00009 1.90723C3.99697 1.90723 1.75947 3.47754 0.278215 6.59941C0.218802 6.72522 0.187988 6.86263 0.187988 7.00176C0.187988 7.14089 0.218802 7.27829 0.278215 7.4041C1.75947 10.5244 3.99853 12.0947 7.00009 12.0947C10.0032 12.0947 12.2407 10.5244 13.722 7.40254C13.8423 7.14941 13.8423 6.85566 13.722 6.59785ZM7.00009 10.9697C4.47978 10.9697 2.63447 9.6916 1.3329 7.00098C2.63447 4.31035 4.47978 3.03223 7.00009 3.03223C9.5204 3.03223 11.3657 4.31035 12.6673 7.00098C11.3673 9.6916 9.52197 10.9697 7.00009 10.9697ZM6.93759 4.25098C5.41884 4.25098 4.18759 5.48223 4.18759 7.00098C4.18759 8.51973 5.41884 9.75098 6.93759 9.75098C8.45634 9.75098 9.68759 8.51973 9.68759 7.00098C9.68759 5.48223 8.45634 4.25098 6.93759 4.25098ZM6.93759 8.75098C5.9704 8.75098 5.18759 7.96816 5.18759 7.00098C5.18759 6.03379 5.9704 5.25098 6.93759 5.25098C7.90478 5.25098 8.68759 6.03379 8.68759 7.00098C8.68759 7.96816 7.90478 8.75098 6.93759 8.75098Z" fill="#14524A" /></svg>
4104 <?php echo esc_html__( 'Preview', "chart-builder" ); ?>
4105 </button>
4106 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-query-save">
4107 <?php echo esc_html__( 'Save data', "chart-builder" ); ?>
4108 </button>
4109 </div>
4110 </div>
4111 <div class="db-wizard-hints">
4112 <ul>
4113 <!-- <li><//?php echo sprintf( __( 'For examples of queries and links to resources that you can use with this feature, please click %1$shere%2$s', $this->plugin_name ), '<a href="' . '#' . '" target="_blank">', '</a>' ); ?></li> -->
4114 <li>
4115 <?php
4116 echo sprintf(
4117 /* translators: %1$s and %2$s are HTML span tags for styling. */
4118 esc_html__( 'Use %1$sControl+Space%2$s for autocompleting keywords or table names.', 'chart-builder' ),
4119 '<span class="ays-chart-emboss">',
4120 '</span>'
4121 );
4122 ?>
4123 </li>
4124 </ul>
4125 </div>
4126 </div>
4127 </div>
4128 </div>
4129 </div>
4130 <?php
4131 $content = ob_get_clean();
4132
4133 $title = __( 'Connect to Database', 'chart-builder') . ' <a class="ays_help" data-bs-toggle="tooltip" title="' . __("Insert the Database query and the appropriate information from your Database will be displayed in the chart.", 'chart-builder') . '">
4134 <i class="ays_fa ays_fa_info_circle"></i>
4135 </a>';
4136
4137 $sources['import_from_db'] = array(
4138 'content' => $content,
4139 'title' => $title
4140 );
4141
4142 return $sources;
4143 }
4144
4145 public function source_contents_import_from_external_db_settings( $sources, $args ){
4146 $html_class_prefix = $args['html_class_prefix'];
4147 $html_name_prefix = $args['html_name_prefix'];
4148
4149 ob_start();
4150 ?>
4151 <div class="ays-accordion-data-main-wrap ays-pro-features-v2-main-box" style="padding:10px;">
4152 <div class="ays-pro-features-v2-big-buttons-box">
4153 <a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-pro-features-v2-upgrade-button">
4154 <div class="ays-pro-features-v2-upgrade-icon" style="background-image: url('<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Locked_24x24.svg');" data-img-src="<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Locked_24x24.svg"></div>
4155 <div class="ays-pro-features-v2-upgrade-text">
4156 <?php echo esc_html__("Upgrade" , "chart-builder"); ?>
4157 </div>
4158 </a>
4159 </div>
4160 <div class="<?php echo esc_attr($html_class_prefix) ?>source-data-main-wrap ays-accordion-data-main-wrap ">
4161 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-main">
4162 <div class="form-group row mb-2">
4163 <div class="col-sm-8 <?php echo esc_attr($html_class_prefix) ?>option-title">
4164 <label class="form-label">
4165 <?php echo esc_html(__('Use custom database settings for this chart', "chart-builder")); ?>
4166 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __(".","chart-builder") ); ?>">
4167 <i class="ays_fa ays_fa_info_circle"></i>
4168 </a>
4169 </label>
4170 </div>
4171 <div class="col-sm-3 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
4172 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
4173 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" type="checkbox" />
4174 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
4175 </label>
4176 </div>
4177 </div>
4178 <div id="ays-chart-external-db-query">
4179 <div class="<?php echo esc_attr($html_class_prefix) ?>-db-query-form">
4180 <div id="external-db-query-form">
4181 <input type="hidden" name="chart_id" value="1">
4182 <textarea name="query" class="<?php echo esc_attr($html_class_prefix) ?>external-db-query" placeholder="<?php echo esc_html__( "Add your query here.", 'chart-builder' ); ?>"></textarea>
4183 <div class='db-wizard-success'></div>
4184 <div class='db-wizard-error'></div>
4185 </div>
4186 <div class="ays-chart-db-query-form-button ays-chart-buttons-group">
4187 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-external-query-fetch">
4188 <?php echo esc_html__( 'Show Results', "chart-builder" ); ?>
4189 </button>
4190 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-external-query-show-on-chart">
4191 <svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M13.722 6.59785C12.2407 3.47754 10.0017 1.90723 7.00009 1.90723C3.99697 1.90723 1.75947 3.47754 0.278215 6.59941C0.218802 6.72522 0.187988 6.86263 0.187988 7.00176C0.187988 7.14089 0.218802 7.27829 0.278215 7.4041C1.75947 10.5244 3.99853 12.0947 7.00009 12.0947C10.0032 12.0947 12.2407 10.5244 13.722 7.40254C13.8423 7.14941 13.8423 6.85566 13.722 6.59785ZM7.00009 10.9697C4.47978 10.9697 2.63447 9.6916 1.3329 7.00098C2.63447 4.31035 4.47978 3.03223 7.00009 3.03223C9.5204 3.03223 11.3657 4.31035 12.6673 7.00098C11.3673 9.6916 9.52197 10.9697 7.00009 10.9697ZM6.93759 4.25098C5.41884 4.25098 4.18759 5.48223 4.18759 7.00098C4.18759 8.51973 5.41884 9.75098 6.93759 9.75098C8.45634 9.75098 9.68759 8.51973 9.68759 7.00098C9.68759 5.48223 8.45634 4.25098 6.93759 4.25098ZM6.93759 8.75098C5.9704 8.75098 5.18759 7.96816 5.18759 7.00098C5.18759 6.03379 5.9704 5.25098 6.93759 5.25098C7.90478 5.25098 8.68759 6.03379 8.68759 7.00098C8.68759 7.96816 7.90478 8.75098 6.93759 8.75098Z" fill="#14524A" /></svg>
4192 <?php echo esc_html__( 'Preview', "chart-builder" ); ?>
4193 </button>
4194 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-external-query-save">
4195 <?php echo esc_html__( 'Save data', "chart-builder" ); ?>
4196 </button>
4197 </div>
4198 </div>
4199 <div class="db-wizard-hints">
4200 <ul>
4201 <!-- <li><//?php echo sprintf( __( 'For examples of queries and links to resources that you can use with this feature, please click %1$shere%2$s', $this->plugin_name ), '<a href="' . '#' . '" target="_blank">', '</a>' ); ?></li> -->
4202 <li>
4203 <?php
4204 echo sprintf(
4205 /* translators: %1$s and %2$s are HTML span tags for styling. */
4206 esc_html__( 'Use %1$sControl+Space%2$s for autocompleting keywords or table names.', 'chart-builder' ),
4207 '<span class="ays-chart-emboss">',
4208 '</span>'
4209 );
4210 ?>
4211 </li>
4212 </ul>
4213 </div>
4214 </div>
4215 </div>
4216 </div>
4217 </div>
4218 <?php
4219 $content = ob_get_clean();
4220
4221 $title = __( 'Connect to External Database', 'chart-builder' ) . ' <a class="ays_help" data-bs-toggle="tooltip" title="' . __("Insert the Database query and fetch data from an external database.", 'chart-builder') . '">
4222 <i class="ays_fa ays_fa_info_circle"></i>
4223 </a>';
4224
4225 $sources['import_from_external_db'] = array(
4226 'content' => $content,
4227 'title' => $title
4228 );
4229
4230 return $sources;
4231 }
4232
4233 public function source_contents_quiz_maker_integration_settings( $sources, $args ){
4234 global $wpdb;
4235 $chart_id = $args['chart_id'];
4236 $html_class_prefix = $args['html_class_prefix'];
4237 $html_name_prefix = $args['html_name_prefix'];
4238 $source = $args['source'];
4239 $settings = $args['settings'];
4240 $quiz_queries = $args['quiz_queries'];
4241 $quiz_query_tooltips = $args['quiz_query_tooltips'];
4242 $quiz_id = $args['quiz_id'];
4243 $quiz_query = $args['quiz_query'];
4244
4245 if ( !is_plugin_active('quiz-maker/quiz-maker.php') ) {
4246 // $title = sprintf( __( 'Get Quiz Maker data', "chart-builder" ) . ' <a class="ays_help" data-bs-toggle="tooltip" data-bs-html="true" title="' . __("By using this option, you can display the quiz statistics by charts.%s %sNote:%s The Quiz Maker plugin must be active.","chart-builder") . '">
4247 // <i class="ays_fa ays_fa_info_circle"></i>
4248 // </a>', '<br>', '<b>', '</b>');
4249 // $content = $this->blockquote_content_quiz;
4250 // $sources['quiz_maker'] = array(
4251 // 'content' => $content,
4252 // 'title' => $title
4253 // );
4254
4255 return $sources;
4256 }
4257 $quizes = $wpdb->get_results( // phpcs:ignore
4258 $wpdb->prepare(
4259 "SELECT `title`, `id` FROM {$wpdb->prefix}aysquiz_quizes
4260 WHERE `published` = %d AND `question_ids` <> %s",
4261 1,
4262 ''
4263 ),
4264 ARRAY_A
4265 );
4266
4267
4268 ob_start();
4269 ?>
4270 <div class="ays-accordion-data-main-wrap">
4271 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-main cb-changable-tab cb-pie_chart-tab cb-donut_chart-tab cb-bar_chart-tab cb-column_chart-tab cb-line_chart-tab">
4272 <div id="<?php echo esc_attr($html_class_prefix) ?>quiz-maker-form">
4273 <input type="hidden" class="<?php echo esc_attr($html_class_prefix) ?>chart-id" value="<?php echo esc_attr($chart_id) ?>">
4274 <div class="<?php echo esc_attr($html_class_prefix) ?>select-quiz-maker-data-query-container" id="<?php echo esc_attr($html_class_prefix) ?>quiz-queries">
4275 <a class="ays_help <?php echo esc_attr($html_class_prefix) ?>quiz-query-tooltip" data-bs-toggle="tooltip" data-bs-html="true" title="<?php echo isset($quiz_query) ? esc_attr($quiz_query_tooltips[$quiz_query]) : esc_html__( 'Select a query to display quiz data.', 'chart-builder' ) ?>">
4276 <i class="ays_fa ays_fa_info_circle"></i>
4277 </a>
4278 <select class="form-select" style="max-width: none;" id="<?php echo esc_attr($html_class_prefix) ?>select-quiz-maker-data-query" name="<?php echo esc_attr($html_name_prefix) ?>quiz_query">
4279 <option value=""><?php echo esc_html__( "Select query", "chart-builder" ) ?></option>
4280 <?php foreach ( $quiz_queries as $id => $q):
4281 $disabled = preg_replace('/[^0-9]/', '', $id) <= 6 ? "false" : "true" ; ?>
4282 <option value="<?php echo esc_attr($id) ?>" <?php echo $quiz_query == $id ? 'selected' : '' ?> <?php echo 'is-pro="'.esc_attr($disabled).'"'; ?>><?php echo esc_attr($q) ?></option>
4283 <?php endforeach; ?>
4284 </select>
4285 </div>
4286 <div class="<?php echo esc_attr($html_class_prefix) ?>select-quiz-maker-quiz-container">
4287 <select class="form-select" style="max-width: none;" id="<?php echo esc_attr($html_class_prefix) ?>select-quiz-maker-quiz" name="<?php echo esc_attr($html_name_prefix) ?>quiz_id">
4288 <option value="0"><?php echo esc_html__( "Select quiz", "chart-builder" ) ?></option>
4289 <?php foreach ( $quizes as $quiz): ?>
4290 <option value="<?php echo esc_attr($quiz['id']) ?>" <?php echo $quiz_id == $quiz['id'] ? 'selected' : '' ?> ><?php echo esc_html($quiz['title'] )?></option>
4291 <?php endforeach; ?>
4292 </select>
4293 </div>
4294 <div id="ays-chart-quiz-maker-success"></div>
4295 <div id="ays-chart-quiz-maker-error"></div>
4296 <div class="ays-chart-buttons-group">
4297 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-quiz-maker-fetch">
4298 <?php echo esc_html__( 'Show Results', "chart-builder" ); ?>
4299 </button>
4300 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-quiz-maker-show-on-chart">
4301 <svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M13.722 6.59785C12.2407 3.47754 10.0017 1.90723 7.00009 1.90723C3.99697 1.90723 1.75947 3.47754 0.278215 6.59941C0.218802 6.72522 0.187988 6.86263 0.187988 7.00176C0.187988 7.14089 0.218802 7.27829 0.278215 7.4041C1.75947 10.5244 3.99853 12.0947 7.00009 12.0947C10.0032 12.0947 12.2407 10.5244 13.722 7.40254C13.8423 7.14941 13.8423 6.85566 13.722 6.59785ZM7.00009 10.9697C4.47978 10.9697 2.63447 9.6916 1.3329 7.00098C2.63447 4.31035 4.47978 3.03223 7.00009 3.03223C9.5204 3.03223 11.3657 4.31035 12.6673 7.00098C11.3673 9.6916 9.52197 10.9697 7.00009 10.9697ZM6.93759 4.25098C5.41884 4.25098 4.18759 5.48223 4.18759 7.00098C4.18759 8.51973 5.41884 9.75098 6.93759 9.75098C8.45634 9.75098 9.68759 8.51973 9.68759 7.00098C9.68759 5.48223 8.45634 4.25098 6.93759 4.25098ZM6.93759 8.75098C5.9704 8.75098 5.18759 7.96816 5.18759 7.00098C5.18759 6.03379 5.9704 5.25098 6.93759 5.25098C7.90478 5.25098 8.68759 6.03379 8.68759 7.00098C8.68759 7.96816 7.90478 8.75098 6.93759 8.75098Z" fill="#14524A" /></svg>
4302 <?php echo esc_html__( 'Preview', "chart-builder" ); ?>
4303 </button>
4304 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-quiz-maker-save">
4305 <?php echo esc_html__( 'Save data', "chart-builder" ); ?>
4306 </button>
4307 </div>
4308 </div>
4309 <div>
4310 <a href="https://www.youtube.com/watch?v=vqx76dw6NC8" target="_blank" style="text-decoration:none;font-style:italic"><?php echo esc_html__('How to Connect Quizzes to Charts', 'chart-builder'); ?></a>
4311 </div>
4312 </div>
4313 </div>
4314 <?php
4315 $content = ob_get_clean();
4316
4317 $title = sprintf(
4318 /* translators: %1$s: Line break, %2$s: Opening bold tag, %3$s: Closing bold tag. */
4319 __( 'Get Quiz Maker data', 'chart-builder' ) .
4320 ' <a class="ays_help" data-bs-toggle="tooltip" data-bs-html="true" title="' .
4321 /* translators: %1$s: Line break, %2$s: Opening bold tag, %3$s: Closing bold tag. */
4322 __( 'By using this option, you can display the quiz statistics by charts.%1$s %2$sNote:%3$s The Quiz Maker plugin must be active.', 'chart-builder' ) . '">
4323 <i class="ays_fa ays_fa_info_circle"></i>
4324 </a>',
4325 '<br>', '<b>', '</b>'
4326 );
4327 $sources['quiz_maker'] = array(
4328 'content' => $content,
4329 'title' => $title
4330 );
4331
4332 return $sources;
4333 }
4334
4335 public function source_contents_woocommerce_integration_settings( $sources, $args ){
4336 if ( !is_plugin_active('woocommerce/woocommerce.php') ) {
4337 return $sources;
4338 }
4339
4340 $chart_id = $args['chart_id'];
4341 $html_class_prefix = $args['html_class_prefix'];
4342 $html_name_prefix = $args['html_name_prefix'];
4343 ob_start();
4344 ?>
4345 <div class="ays-accordion-data-main-wrap ays-accordion-data-main-wrap-woocommerce ays-pro-features-v2-main-box" style="padding:10px;">
4346 <div class="ays-pro-features-v2-big-buttons-box">
4347 <div class="ays-pro-features-v2-video-button"></div>
4348 <a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-pro-features-v2-upgrade-button">
4349 <div class="ays-pro-features-v2-upgrade-icon" style="background-image: url('<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Locked_24x24.svg');" data-img-src="<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Locked_24x24.svg"></div>
4350 <div class="ays-pro-features-v2-upgrade-text">
4351 <?php echo esc_html__("Upgrade" , "chart-builder"); ?>
4352 </div>
4353 </a>
4354 </div>
4355 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-main ays-accordion-data-main-wrap ">
4356 <div id="ays-chart-woocommerce-datas">
4357 <div class="<?php echo esc_attr($html_class_prefix) ?>woocommerce-datas-form">
4358 <div id="woocommerce-datas-form">
4359 <input type="hidden" name="chart_id" value="<?php echo esc_attr( $chart_id )?>">
4360 <div class="<?php echo esc_attr($html_class_prefix) ?>woocommerce-datas-query-container" id="<?php echo esc_attr($html_class_prefix) ?>woocommerce-datas-container-id" >
4361 <a class="ays_help <?php echo esc_attr($html_class_prefix) ?>woocommerce-datas-tooltip" data-bs-toggle="tooltip" data-bs-html="true" title="<?php echo esc_html__( 'Select a query to display data.', 'chart-builder' ) ?>">
4362 <i class="ays_fa ays_fa_info_circle"></i>
4363 </a>
4364 <select class="form-select" style="max-width: none;" id="<?php echo esc_attr($html_class_prefix) ?>woocommerce-datas-select" name="<?php echo esc_attr($html_name_prefix); ?>settings[woocommerce_data_id]">
4365 <option value=""><?php echo esc_html__( 'Select query', 'chart-builder') ?></option>
4366 </select>
4367 </div>
4368 <div class='ays-chart-woocommerce-datas-success'></div>
4369 <div class='ays-chart-woocommerce-datas-error'></div>
4370 </div>
4371 <div class="ays-chart-buttons-group">
4372 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-woocommerce-datas-fetch">
4373 <?php echo esc_html__( 'Show Results', "chart-builder" ); ?>
4374 </button>
4375 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-woocommerce-datas-show-on-chart">
4376 <svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M13.722 6.59785C12.2407 3.47754 10.0017 1.90723 7.00009 1.90723C3.99697 1.90723 1.75947 3.47754 0.278215 6.59941C0.218802 6.72522 0.187988 6.86263 0.187988 7.00176C0.187988 7.14089 0.218802 7.27829 0.278215 7.4041C1.75947 10.5244 3.99853 12.0947 7.00009 12.0947C10.0032 12.0947 12.2407 10.5244 13.722 7.40254C13.8423 7.14941 13.8423 6.85566 13.722 6.59785ZM7.00009 10.9697C4.47978 10.9697 2.63447 9.6916 1.3329 7.00098C2.63447 4.31035 4.47978 3.03223 7.00009 3.03223C9.5204 3.03223 11.3657 4.31035 12.6673 7.00098C11.3673 9.6916 9.52197 10.9697 7.00009 10.9697ZM6.93759 4.25098C5.41884 4.25098 4.18759 5.48223 4.18759 7.00098C4.18759 8.51973 5.41884 9.75098 6.93759 9.75098C8.45634 9.75098 9.68759 8.51973 9.68759 7.00098C9.68759 5.48223 8.45634 4.25098 6.93759 4.25098ZM6.93759 8.75098C5.9704 8.75098 5.18759 7.96816 5.18759 7.00098C5.18759 6.03379 5.9704 5.25098 6.93759 5.25098C7.90478 5.25098 8.68759 6.03379 8.68759 7.00098C8.68759 7.96816 7.90478 8.75098 6.93759 8.75098Z" fill="#14524A" /></svg>
4377 <?php echo esc_html__( 'Preview', "chart-builder" ); ?>
4378 </button>
4379 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-woocommerce-datas-save">
4380 <?php echo esc_html__( 'Save data', "chart-builder" ); ?>
4381 </button>
4382 </div>
4383 </div>
4384 </div>
4385 </div>
4386 </div>
4387 <?php
4388 $content = ob_get_clean();
4389
4390 $title = sprintf(
4391 /* translators: %1$s: Line break, %2$s: Opening bold tag, %3$s: Closing bold tag. */
4392 esc_html__( 'Get WooCommerce data', 'chart-builder' ) .
4393 ' <a class="ays_help" data-bs-toggle="tooltip" data-bs-html="true" title="' .
4394 /* translators: %1$s: Line break, %2$s: Opening bold tag, %3$s: Closing bold tag. */
4395 __( 'By using this option, you can display the WooCommerce statistics by charts.%1$s %2$sNote:%3$s The WooCommerce plugin must be active.', 'chart-builder' ) . '">
4396 <i class="ays_fa ays_fa_info_circle"></i>
4397 </a>',
4398 '<br>', '<b>', '</b>'
4399 );
4400 $sources['woocommerce'] = array(
4401 'content' => $content,
4402 'title' => $title
4403 );
4404
4405 return $sources;
4406 }
4407
4408 public function source_contents_manual_settings( $sources, $args ){
4409 $html_class_prefix = $args['html_class_prefix'];
4410 $html_name_prefix = $args['html_name_prefix'];
4411 $source = $args['source'];
4412 $source = isset($source["commonTypeCharts"]) ? $source["commonTypeCharts"] : $source;
4413 $settings = $args['settings'];
4414 $source_chart_type = $args['source_chart_type'];
4415 // phpcs:ignore WordPress.Security.NonceVerification.Recommended
4416 $action = isset($_GET['action']) ? sanitize_text_field(wp_unslash($_GET['action'])) : 'add';
4417
4418 if (isset($source) && !empty($source)) {
4419 if ( !isset( $source[0] ) ) {
4420 if (count($source[1]) > 2) {
4421 $titles = array();
4422 for ($i = 0; $i < count($source[1]); $i++) {
4423 array_push($titles, __("Title", 'chart-builder').$i);
4424 }
4425 $source[0] = $titles;
4426 } else {
4427 $source[0] = array(
4428 __("Country", 'chart-builder'),
4429 __("Population", 'chart-builder'),
4430 );
4431 }
4432
4433 ksort($source);
4434 }
4435 }
4436
4437 if ($action == 'add') {
4438 foreach ($source as $key => $row) {
4439 $source[$key] = array_slice($row, 0, 2);
4440 }
4441 } else if ($action == 'edit') {
4442 if ($source_chart_type == 'pie_chart' || $source_chart_type == 'donut_chart') {
4443 foreach ($source as $key => $row) {
4444 $source[$key] = array_slice($row, 0, 2);
4445 }
4446 }
4447 }
4448 ob_start();
4449 ?>
4450 <div class="ays-accordion-data-main-wrap">
4451 <div class="<?php echo esc_attr($html_class_prefix) ?>source-data-main-wrap">
4452 <?php if($source_chart_type != 'org_chart'): ?>
4453 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-main <?php echo esc_attr( $html_class_prefix) ?>chart-source-data-manual cb-changable-manual cb-pie_chart-manual cb-bar_chart-manual cb-column_chart-manual cb-line_chart-manual cb-donut_chart-manual display_none">
4454 <!-- <div class="<//?= $html_class_prefix ?>icons-box">
4455 <img class="<//?= $html_class_prefix ?>add-new-row" src="<//?php echo CHART_BUILDER_ADMIN_URL; ?>/images/icons/add-circle-outline.svg">
4456 </div> -->
4457 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-content-container">
4458 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-content">
4459 <?php if(!empty($source)):
4460 foreach($source as $source_id => $source_value):
4461 if(!empty($source_value) ):
4462 if ($source_id == 0): ?>
4463 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-edit-block" data-source-id = "<?php echo esc_attr($source_id); ?>">
4464 <div class="ays-chart-empty-data-table-cell"></div>
4465 <?php foreach($source_value as $each_source_id => $each_source_value): ?>
4466 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-input-box <?php echo esc_attr($html_class_prefix) ?>chart-source-title-box" data-cell-id = "<?php echo esc_attr($each_source_id); ?>">
4467 <svg class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-remove-block <?php echo esc_attr($html_class_prefix) ?>chart-source-data-remove-col" data-trigger="hover" data-bs-toggle="tooltip" title="Delete column" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" width="10px">
4468 <path d="M310.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L160 210.7 54.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L114.7 256 9.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L160 301.3 265.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L205.3 256 310.6 150.6z" style="fill: #b8b8b8;" />
4469 </svg>
4470 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-titles-box-item">
4471 <input type="text" class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>chart-source-title-input" name="<?php echo esc_attr($html_name_prefix); ?>chart_source_data[<?php echo esc_attr($source_id); ?>][]" value="<?php echo esc_attr(stripslashes($each_source_value)); ?>" <?php echo $each_source_id == 0 ? "style='min-width:100px'" : "" ?>>
4472 <?php if ($each_source_id !== 0): ?>
4473 <svg class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-sort" data-sort-order="asc" xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 320 512">
4474 <path d="M137.4 41.4c12.5-12.5 32.8-12.5 45.3 0l128 128c9.2 9.2 11.9 22.9 6.9 34.9s-16.6 19.8-29.6 19.8H32c-12.9 0-24.6-7.8-29.6-19.8s-2.2-25.7 6.9-34.9l128-128zm0 429.3l-128-128c-9.2-9.2-11.9-22.9-6.9-34.9s16.6-19.8 29.6-19.8H288c12.9 0 24.6 7.8 29.6 19.8s2.2 25.7-6.9 34.9l-128 128c-12.5 12.5-32.8 12.5-45.3 0z" style="fill: #b8b8b8;" />
4475 </svg>
4476 <?php endif; ?>
4477 </div>
4478 </div>
4479 <?php endforeach; ?>
4480 </div>
4481 <?php else: ?>
4482 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-edit-block" data-source-id = "<?php echo esc_attr($source_id); ?>">
4483 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-move-block <?php echo esc_attr($html_class_prefix) ?>chart-source-data-move-row">
4484 <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512">
4485 <path d="M278.6 9.4c-12.5-12.5-32.8-12.5-45.3 0l-64 64c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l9.4-9.4V224H109.3l9.4-9.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-64 64c-12.5 12.5-12.5 32.8 0 45.3l64 64c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-9.4-9.4H224V402.7l-9.4-9.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l64 64c12.5 12.5 32.8 12.5 45.3 0l64-64c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-9.4 9.4V288H402.7l-9.4 9.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l64-64c12.5-12.5 12.5-32.8 0-45.3l-64-64c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l9.4 9.4H288V109.3l9.4 9.4c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-64-64z" style="fill: #b8b8b8;" />
4486 </svg>
4487 </div>
4488 <div class="<?php echo esc_attr($html_class_prefix) ?>icons-box <?php echo esc_attr($html_class_prefix) ?>icons-remove-box">
4489 <svg class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-remove-block <?php echo esc_attr($html_class_prefix) ?>chart-source-data-remove-row" data-trigger="hover" data-bs-toggle="tooltip" title="Delete row" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512">
4490 <path d="M310.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L160 210.7 54.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L114.7 256 9.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L160 301.3 265.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L205.3 256 310.6 150.6z" style="fill: #b8b8b8;" />
4491 </svg>
4492 </div>
4493 <?php foreach($source_value as $each_source_id => $each_source_value): ?>
4494 <?php if ($each_source_id == 0): ?>
4495 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-input-box <?php echo esc_attr($html_class_prefix) ?>chart-source-data-name-input-box" data-cell-id = "<?php echo esc_attr($each_source_id); ?>">
4496 <input type="text" class="ays-text-input form-control" name="<?php echo esc_attr($html_name_prefix); ?>chart_source_data[<?php echo esc_attr($source_id); ?>][]" value="<?php echo esc_attr(htmlspecialchars($each_source_value)); ?>">
4497 </div>
4498 <?php else: ?>
4499 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-input-box <?php echo esc_attr($html_class_prefix) ?>chart-source-data-input-number" data-cell-id = "<?php echo esc_attr($each_source_id); ?>">
4500 <input type="number" class="ays-text-input form-control" name="<?php echo esc_attr($html_name_prefix); ?>chart_source_data[<?php echo esc_attr($source_id); ?>][]" value="<?php echo esc_attr(stripslashes($each_source_value)); ?>" step="any">
4501 </div>
4502 <?php endif; ?>
4503 <?php endforeach; ?>
4504 </div>
4505 <?php endif; ?>
4506 <?php endif; ?>
4507 <?php endforeach; ?>
4508 <?php else:?>
4509 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-edit-block">
4510 <div style="height: 63.11px; padding: 0 15px;"></div>
4511 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-input-box <?php echo esc_attr($html_class_prefix) ?>chart-source-title-box">
4512 <svg class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-remove-block <?php echo esc_attr($html_class_prefix) ?>chart-source-data-remove-col" data-trigger="hover" data-bs-toggle="tooltip" title="Delete column" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" width="10px">
4513 <path d="M310.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L160 210.7 54.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L114.7 256 9.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L160 301.3 265.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L205.3 256 310.6 150.6z" style="fill: #b8b8b8;" />
4514 </svg>
4515 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-titles-box-item">
4516 <input type="text" class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>chart-source-title-input" name="<?php echo esc_attr($html_name_prefix); ?>chart_source_data[0][]" style='min-width:100px'>
4517 <svg class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-sort" data-sort-order="asc" xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 320 512">
4518 <path d="M137.4 41.4c12.5-12.5 32.8-12.5 45.3 0l128 128c9.2 9.2 11.9 22.9 6.9 34.9s-16.6 19.8-29.6 19.8H32c-12.9 0-24.6-7.8-29.6-19.8s-2.2-25.7 6.9-34.9l128-128zm0 429.3l-128-128c-9.2-9.2-11.9-22.9-6.9-34.9s16.6-19.8 29.6-19.8H288c12.9 0 24.6 7.8 29.6 19.8s2.2 25.7-6.9 34.9l-128 128c-12.5 12.5-32.8 12.5-45.3 0z" style="fill: #b8b8b8;" />
4519 </svg>
4520 </div>
4521 </div>
4522 </div>
4523 <div class = "<?php echo esc_attr($html_class_prefix) ?>chart-source-data-edit-block" data-source-id="1">
4524 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-move-block <?php echo esc_attr($html_class_prefix) ?>chart-source-data-move-row">
4525 <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512">
4526 <path d="M278.6 9.4c-12.5-12.5-32.8-12.5-45.3 0l-64 64c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l9.4-9.4V224H109.3l9.4-9.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-64 64c-12.5 12.5-12.5 32.8 0 45.3l64 64c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-9.4-9.4H224V402.7l-9.4-9.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l64 64c12.5 12.5 32.8 12.5 45.3 0l64-64c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-9.4 9.4V288H402.7l-9.4 9.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l64-64c12.5-12.5 12.5-32.8 0-45.3l-64-64c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l9.4 9.4H288V109.3l9.4 9.4c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-64-64z" />
4527 </svg>
4528 </div>
4529 <div class="<?php echo esc_attr($html_class_prefix) ?>icons-box <?php echo esc_attr($html_class_prefix) ?>icons-remove-box" >
4530 <svg class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-remove-block <?php echo esc_attr($html_class_prefix) ?>chart-source-data-remove-row" data-trigger="hover" data-bs-toggle="tooltip" title="Delete row" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512">
4531 <path d="M310.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L160 210.7 54.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L114.7 256 9.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L160 301.3 265.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L205.3 256 310.6 150.6z" style="fill: #b8b8b8;" />
4532 </svg>
4533 </div>
4534 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-input-box">
4535 <input type="text" class="ays-text-input form-control" name="<?php echo esc_attr($html_name_prefix); ?>chart_source_data[1][]" >
4536 </div>
4537 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-input-box <?php echo esc_attr($html_class_prefix) ?>chart-source-data-input-number">
4538 <input type="number" class="ays-text-input form-control" name="<?php echo esc_attr($html_name_prefix); ?>chart_source_data[1][]" step="any">
4539 </div>
4540 </div>
4541 <?php endif; ?>
4542 </div>
4543 <div class="<?php echo esc_attr($html_class_prefix) ?>icons-box <?php echo esc_attr($html_class_prefix) ?>add-new-column-box cb-changable-opt cb-bar_chart-opt cb-column_chart-opt cb-line_chart-opt display_none">
4544 <img class="<?php echo esc_attr($html_class_prefix) ?>add-new-column" src="<?php echo esc_url(CHART_BUILDER_ADMIN_URL); ?>/images/icons/add-circle-outline.svg">
4545 <?php echo esc_html__( 'Add column', "chart-builder" ); ?>
4546 </div>
4547 </div>
4548 <div class="<?php echo esc_attr($html_class_prefix) ?>icons-box <?php echo esc_attr($html_class_prefix) ?>add-new-row-box">
4549 <img class="<?php echo esc_attr($html_class_prefix) ?>add-new-row" src="<?php echo esc_url(CHART_BUILDER_ADMIN_URL); ?>/images/icons/add-circle-outline.svg">
4550 <?php echo esc_html__( 'Add row', "chart-builder" ); ?>
4551 </div>
4552 <br>
4553 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns <?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttn">
4554 <svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M13.722 6.59785C12.2407 3.47754 10.0017 1.90723 7.00009 1.90723C3.99697 1.90723 1.75947 3.47754 0.278215 6.59941C0.218802 6.72522 0.187988 6.86263 0.187988 7.00176C0.187988 7.14089 0.218802 7.27829 0.278215 7.4041C1.75947 10.5244 3.99853 12.0947 7.00009 12.0947C10.0032 12.0947 12.2407 10.5244 13.722 7.40254C13.8423 7.14941 13.8423 6.85566 13.722 6.59785ZM7.00009 10.9697C4.47978 10.9697 2.63447 9.6916 1.3329 7.00098C2.63447 4.31035 4.47978 3.03223 7.00009 3.03223C9.5204 3.03223 11.3657 4.31035 12.6673 7.00098C11.3673 9.6916 9.52197 10.9697 7.00009 10.9697ZM6.93759 4.25098C5.41884 4.25098 4.18759 5.48223 4.18759 7.00098C4.18759 8.51973 5.41884 9.75098 6.93759 9.75098C8.45634 9.75098 9.68759 8.51973 9.68759 7.00098C9.68759 5.48223 8.45634 4.25098 6.93759 4.25098ZM6.93759 8.75098C5.9704 8.75098 5.18759 7.96816 5.18759 7.00098C5.18759 6.03379 5.9704 5.25098 6.93759 5.25098C7.90478 5.25098 8.68759 6.03379 8.68759 7.00098C8.68759 7.96816 7.90478 8.75098 6.93759 8.75098Z" fill="#14524A" /></svg>
4555 <?php echo esc_html__( 'Preview', "chart-builder" ); ?>
4556 </button>
4557 </div>
4558 <?php endif; ?>
4559 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-main-org-type display_none cb-changable-manual cb-org_chart-manual">
4560 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-content-org-type">
4561 <ul id="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-edit-tree-content">
4562 </ul>
4563 </div>
4564 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns <?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttn">
4565 <svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M13.722 6.59785C12.2407 3.47754 10.0017 1.90723 7.00009 1.90723C3.99697 1.90723 1.75947 3.47754 0.278215 6.59941C0.218802 6.72522 0.187988 6.86263 0.187988 7.00176C0.187988 7.14089 0.218802 7.27829 0.278215 7.4041C1.75947 10.5244 3.99853 12.0947 7.00009 12.0947C10.0032 12.0947 12.2407 10.5244 13.722 7.40254C13.8423 7.14941 13.8423 6.85566 13.722 6.59785ZM7.00009 10.9697C4.47978 10.9697 2.63447 9.6916 1.3329 7.00098C2.63447 4.31035 4.47978 3.03223 7.00009 3.03223C9.5204 3.03223 11.3657 4.31035 12.6673 7.00098C11.3673 9.6916 9.52197 10.9697 7.00009 10.9697ZM6.93759 4.25098C5.41884 4.25098 4.18759 5.48223 4.18759 7.00098C4.18759 8.51973 5.41884 9.75098 6.93759 9.75098C8.45634 9.75098 9.68759 8.51973 9.68759 7.00098C9.68759 5.48223 8.45634 4.25098 6.93759 4.25098ZM6.93759 8.75098C5.9704 8.75098 5.18759 7.96816 5.18759 7.00098C5.18759 6.03379 5.9704 5.25098 6.93759 5.25098C7.90478 5.25098 8.68759 6.03379 8.68759 7.00098C8.68759 7.96816 7.90478 8.75098 6.93759 8.75098Z" fill="#14524A" /></svg>
4566 <?php echo esc_html__( 'Preview', "chart-builder" ); ?>
4567 </button>
4568 </div>
4569 </div>
4570 </div>
4571 <?php
4572 $content = ob_get_clean();
4573
4574 $title = __( 'Manual data', "chart-builder" ) . ' <a class="ays_help" data-bs-toggle="tooltip" title="' . __("Add the data manually. By clicking on the Add Row button you will be able to add as many rows as you need. While choosing the Line, Bar, Column Chart types you will be able to also add the columns.","chart-builder") . '">
4575 <i class="ays_fa ays_fa_info_circle"></i>
4576 </a>';
4577
4578 $sources['manual'] = array(
4579 'content' => $content,
4580 'title' => $title
4581 );
4582
4583 return $sources;
4584 }
4585
4586 public function source_contents_manual_settings_chartjs( $sources, $args ){
4587 $html_class_prefix = $args['html_class_prefix'];
4588 $html_name_prefix = $args['html_name_prefix'];
4589 $source = $args['source'];
4590 $source = isset($source["commonTypeCharts"]) ? $source["commonTypeCharts"] : $source;
4591 $settings = $args['settings'];
4592 $source_chart_type = $args['source_chart_type'];
4593 // phpcs:ignore WordPress.Security.NonceVerification.Recommended
4594 $action = isset($_GET['action']) ? sanitize_text_field((wp_unslash($_GET['action']))) : 'add';
4595
4596 ob_start();
4597 ?>
4598 <div class="ays-accordion-data-main-wrap">
4599 <div class="<?php echo esc_attr($html_class_prefix) ?>source-data-main-wrap">
4600 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-main <?php echo esc_attr($html_class_prefix) ?>chart-source-data-manual">
4601 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-content-container">
4602 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-content">
4603 <?php if(!empty($source)):
4604 foreach($source as $source_id => $source_value):
4605 if(!empty($source_value) ):
4606 if ($source_id == 0): ?>
4607 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-edit-block" data-source-id = "<?php echo esc_attr($source_id); ?>">
4608 <div class="ays-chart-empty-data-table-cell"></div>
4609 <?php foreach($source_value as $each_source_id => $each_source_value): ?>
4610 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-input-box <?php echo esc_attr($html_class_prefix) ?>chart-source-title-box" data-cell-id = "<?php echo esc_attr($each_source_id); ?>">
4611 <svg class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-remove-block <?php echo esc_attr($html_class_prefix) ?>chart-source-data-remove-col" data-trigger="hover" data-bs-toggle="tooltip" title="Delete column" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" width="10px">
4612 <path d="M310.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L160 210.7 54.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L114.7 256 9.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L160 301.3 265.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L205.3 256 310.6 150.6z" style="fill: #b8b8b8;" />
4613 </svg>
4614 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-titles-box-item">
4615 <input type="text" class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>chart-source-title-input" name="<?php echo esc_attr($html_name_prefix); ?>chart_source_data[<?php echo esc_attr($source_id); ?>][]" value="<?php echo esc_attr(stripslashes($each_source_value)); ?>" <?php echo $each_source_id == 0 ? "style='min-width:100px'" : "" ?>>
4616 <?php if ($each_source_id !== 0): ?>
4617 <svg class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-sort" data-sort-order="asc" xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 320 512">
4618 <path d="M137.4 41.4c12.5-12.5 32.8-12.5 45.3 0l128 128c9.2 9.2 11.9 22.9 6.9 34.9s-16.6 19.8-29.6 19.8H32c-12.9 0-24.6-7.8-29.6-19.8s-2.2-25.7 6.9-34.9l128-128zm0 429.3l-128-128c-9.2-9.2-11.9-22.9-6.9-34.9s16.6-19.8 29.6-19.8H288c12.9 0 24.6 7.8 29.6 19.8s2.2 25.7-6.9 34.9l-128 128c-12.5 12.5-32.8 12.5-45.3 0z" style="fill: #b8b8b8;" />
4619 </svg>
4620 <?php endif; ?>
4621 </div>
4622 </div>
4623 <?php endforeach; ?>
4624 </div>
4625 <?php else: ?>
4626 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-edit-block" data-source-id = "<?php echo esc_attr($source_id); ?>">
4627 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-move-block <?php echo esc_attr($html_class_prefix) ?>chart-source-data-move-row">
4628 <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512">
4629 <path d="M278.6 9.4c-12.5-12.5-32.8-12.5-45.3 0l-64 64c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l9.4-9.4V224H109.3l9.4-9.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-64 64c-12.5 12.5-12.5 32.8 0 45.3l64 64c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-9.4-9.4H224V402.7l-9.4-9.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l64 64c12.5 12.5 32.8 12.5 45.3 0l64-64c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-9.4 9.4V288H402.7l-9.4 9.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l64-64c12.5-12.5 12.5-32.8 0-45.3l-64-64c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l9.4 9.4H288V109.3l9.4 9.4c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-64-64z" style="fill: #b8b8b8;" />
4630 </svg>
4631 </div>
4632 <div class="<?php echo esc_attr($html_class_prefix) ?>icons-box <?php echo esc_attr($html_class_prefix) ?>icons-remove-box">
4633 <svg class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-remove-block <?php echo esc_attr($html_class_prefix) ?>chart-source-data-remove-row" data-trigger="hover" data-bs-toggle="tooltip" title="Delete row" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512">
4634 <path d="M310.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L160 210.7 54.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L114.7 256 9.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L160 301.3 265.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L205.3 256 310.6 150.6z" style="fill: #b8b8b8;" />
4635 </svg>
4636 </div>
4637 <?php foreach($source_value as $each_source_id => $each_source_value): ?>
4638 <?php if ($each_source_id == 0): ?>
4639 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-input-box <?php echo esc_attr($html_class_prefix) ?>chart-source-data-name-input-box" data-cell-id = "<?php echo esc_attr($each_source_id); ?>">
4640 <input type="text" class="ays-text-input form-control" name="<?php echo esc_attr($html_name_prefix); ?>chart_source_data[<?php echo esc_attr($source_id); ?>][]" value="<?php echo esc_attr(htmlspecialchars($each_source_value)); ?>">
4641 </div>
4642 <?php else: ?>
4643 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-input-box <?php echo esc_attr($html_class_prefix) ?>chart-source-data-input-number" data-cell-id = "<?php echo esc_attr($each_source_id); ?>">
4644 <input type="number" class="ays-text-input form-control" name="<?php echo esc_attr($html_name_prefix); ?>chart_source_data[<?php echo esc_attr($source_id); ?>][]" value="<?php echo esc_attr(stripslashes($each_source_value)); ?>" step="any">
4645 </div>
4646 <?php endif; ?>
4647 <?php endforeach; ?>
4648 </div>
4649 <?php endif; ?>
4650 <?php endif; ?>
4651 <?php endforeach; ?>
4652 <?php else:?>
4653 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-edit-block">
4654 <div style="height: 63.11px; padding: 0 15px;"></div>
4655 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-input-box <?php echo esc_attr($html_class_prefix) ?>chart-source-title-box">
4656 <svg class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-remove-block <?php echo esc_attr($html_class_prefix) ?>chart-source-data-remove-col" data-trigger="hover" data-bs-toggle="tooltip" title="Delete column" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" width="10px">
4657 <path d="M310.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L160 210.7 54.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L114.7 256 9.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L160 301.3 265.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L205.3 256 310.6 150.6z" style="fill: #b8b8b8;" />
4658 </svg>
4659 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-titles-box-item">
4660 <input type="text" class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>chart-source-title-input" name="<?php echo esc_attr($html_name_prefix); ?>chart_source_data[0][]" style='min-width:100px'>
4661 <svg class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-sort" data-sort-order="asc" xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 320 512">
4662 <path d="M137.4 41.4c12.5-12.5 32.8-12.5 45.3 0l128 128c9.2 9.2 11.9 22.9 6.9 34.9s-16.6 19.8-29.6 19.8H32c-12.9 0-24.6-7.8-29.6-19.8s-2.2-25.7 6.9-34.9l128-128zm0 429.3l-128-128c-9.2-9.2-11.9-22.9-6.9-34.9s16.6-19.8 29.6-19.8H288c12.9 0 24.6 7.8 29.6 19.8s2.2 25.7-6.9 34.9l-128 128c-12.5 12.5-32.8 12.5-45.3 0z" style="fill: #b8b8b8;" />
4663 </svg>
4664 </div>
4665 </div>
4666 </div>
4667 <div class = "<?php echo esc_attr($html_class_prefix) ?>chart-source-data-edit-block" data-source-id="1">
4668 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-move-block <?php echo esc_attr($html_class_prefix) ?>chart-source-data-move-row">
4669 <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512">
4670 <path d="M278.6 9.4c-12.5-12.5-32.8-12.5-45.3 0l-64 64c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l9.4-9.4V224H109.3l9.4-9.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-64 64c-12.5 12.5-12.5 32.8 0 45.3l64 64c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-9.4-9.4H224V402.7l-9.4-9.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l64 64c12.5 12.5 32.8 12.5 45.3 0l64-64c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-9.4 9.4V288H402.7l-9.4 9.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l64-64c12.5-12.5 12.5-32.8 0-45.3l-64-64c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l9.4 9.4H288V109.3l9.4 9.4c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-64-64z" />
4671 </svg>
4672 </div>
4673 <div class="<?php echo esc_attr($html_class_prefix) ?>icons-box <?php echo esc_attr($html_class_prefix) ?>icons-remove-box" >
4674 <svg class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-remove-block <?php echo esc_attr($html_class_prefix) ?>chart-source-data-remove-row" data-trigger="hover" data-bs-toggle="tooltip" title="Delete row" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512">
4675 <path d="M310.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L160 210.7 54.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L114.7 256 9.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L160 301.3 265.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L205.3 256 310.6 150.6z" style="fill: #b8b8b8;" />
4676 </svg>
4677 </div>
4678 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-input-box">
4679 <input type="text" class="ays-text-input form-control" name="<?php echo esc_attr($html_name_prefix); ?>chart_source_data[1][]" >
4680 </div>
4681 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-input-box <?php echo esc_attr($html_class_prefix) ?>chart-source-data-input-number">
4682 <input type="number" class="ays-text-input form-control" name="<?php echo esc_attr($html_name_prefix); ?>chart_source_data[1][]" step="any">
4683 </div>
4684 </div>
4685 <?php endif; ?>
4686 </div>
4687 <div class="<?php echo esc_attr($html_class_prefix) ?>icons-box <?php echo esc_attr($html_class_prefix) ?>add-new-column-box cb-changable-opt cb-bar_chart-opt cb-line_chart-opt display_none">
4688 <img class="<?php echo esc_attr($html_class_prefix) ?>add-new-column" src="<?php echo esc_url(CHART_BUILDER_ADMIN_URL); ?>/images/icons/add-circle-outline.svg">
4689 <?php echo esc_html__( 'Add column', "chart-builder" ); ?>
4690 </div>
4691 </div>
4692 <div class="<?php echo esc_attr($html_class_prefix) ?>icons-box <?php echo esc_attr($html_class_prefix) ?>add-new-row-box">
4693 <img class="<?php echo esc_attr($html_class_prefix) ?>add-new-row" src="<?php echo esc_url(CHART_BUILDER_ADMIN_URL); ?>/images/icons/add-circle-outline.svg">
4694 <?php echo esc_html__( 'Add row', "chart-builder" ); ?>
4695 </div>
4696 <br>
4697 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns <?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttn">
4698 <svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M13.722 6.59785C12.2407 3.47754 10.0017 1.90723 7.00009 1.90723C3.99697 1.90723 1.75947 3.47754 0.278215 6.59941C0.218802 6.72522 0.187988 6.86263 0.187988 7.00176C0.187988 7.14089 0.218802 7.27829 0.278215 7.4041C1.75947 10.5244 3.99853 12.0947 7.00009 12.0947C10.0032 12.0947 12.2407 10.5244 13.722 7.40254C13.8423 7.14941 13.8423 6.85566 13.722 6.59785ZM7.00009 10.9697C4.47978 10.9697 2.63447 9.6916 1.3329 7.00098C2.63447 4.31035 4.47978 3.03223 7.00009 3.03223C9.5204 3.03223 11.3657 4.31035 12.6673 7.00098C11.3673 9.6916 9.52197 10.9697 7.00009 10.9697ZM6.93759 4.25098C5.41884 4.25098 4.18759 5.48223 4.18759 7.00098C4.18759 8.51973 5.41884 9.75098 6.93759 9.75098C8.45634 9.75098 9.68759 8.51973 9.68759 7.00098C9.68759 5.48223 8.45634 4.25098 6.93759 4.25098ZM6.93759 8.75098C5.9704 8.75098 5.18759 7.96816 5.18759 7.00098C5.18759 6.03379 5.9704 5.25098 6.93759 5.25098C7.90478 5.25098 8.68759 6.03379 8.68759 7.00098C8.68759 7.96816 7.90478 8.75098 6.93759 8.75098Z" fill="#14524A" /></svg>
4699 <?php echo esc_html__( 'Preview', "chart-builder" ); ?>
4700 </button>
4701 </div>
4702 </div>
4703 </div>
4704 <?php
4705 $content = ob_get_clean();
4706
4707 $title = __( 'Manual data', "chart-builder" ) . ' <a class="ays_help" data-bs-toggle="tooltip" title="' . __("Add the data manually. By clicking on the Add Row button you will be able to add as many rows as you need. While choosing the Line, Bar, Column Chart types you will be able to also add the columns.","chart-builder") . '">
4708 <i class="ays_fa ays_fa_info_circle"></i>
4709 </a>';
4710
4711 $sources['manual'] = array(
4712 'content' => $content,
4713 'title' => $title
4714 );
4715
4716 return $sources;
4717 }
4718
4719 /**
4720 * Chart page settings contents
4721 * @param $args
4722 */
4723 public function ays_chart_page_settings_contents( $args ){
4724 $chart_source_type = $args['chart_source_type'];
4725
4726 if ($chart_source_type === 'chart-js') {
4727 $sources_contents = apply_filters( 'ays_cb_chart_page_settings_contents_settings_chartjs', array(), $args );
4728 } else {
4729 $sources_contents = apply_filters( 'ays_cb_chart_page_settings_contents_settings', array(), $args );
4730 }
4731
4732 $sources = array();
4733 foreach ( $sources_contents as $key => $sources_content ) {
4734 $collapsed = $key == 'general_settings' ? 'false' : 'true';
4735
4736 $content = '<fieldset class="ays-accordion-options-container" data-collapsed="' . $collapsed . '">';
4737 if(isset($sources_content['title'])){
4738 $content .= '<legend class="ays-accordion-options-header">';
4739 $content .= '<svg class="ays-accordion-arrow '. ( $key == 'general_settings' ? 'ays-accordion-arrow-down' : 'ays-accordion-arrow-right' ) .'" version="1.2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" overflow="visible" preserveAspectRatio="none" viewBox="0 0 24 24" width="20" height="20">
4740 <g>
4741 <path xmlns:default="http://www.w3.org/2000/svg" d="M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z" style="fill: '. ( $key == 'general_settings' ? '#008cff' : '#c4c4c4' ) .';" vector-effect="non-scaling-stroke" />
4742 </g>
4743 </svg>';
4744
4745 $content .= '<span>'. esc_html($sources_content['title']) .'</span></legend>';
4746 }
4747
4748 $content .= '<div class="ays-accordion-options-content">';
4749 $content .= $sources_content['content'];
4750 $content .= '</div>';
4751
4752 $content .= '</fieldset>';
4753
4754 $sources[] = $content;
4755 }
4756 $content_for_escape = implode('' , $sources );
4757 echo html_entity_decode( $content_for_escape );
4758 }
4759
4760 public function settings_contents_general_settings( $sources, $args ){
4761 $html_class_prefix = $args['html_class_prefix'];
4762 $html_name_prefix = $args['html_name_prefix'];
4763 $chart_description = $args['chart_description'];
4764 $create_author_data = $args['create_author_data'];
4765 $status = $args['status'];
4766 $settings = $args['settings'];
4767
4768 $show_title = $settings['show_title'];
4769 $show_description = $settings['show_description'];
4770 $enable_interactivity = $settings['enable_interactivity'];
4771 $maximized_view = $settings['maximized_view'];
4772
4773 ob_start();
4774 ?>
4775 <div class="ays-accordion-data-main-wrap">
4776 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
4777 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
4778 <div class="col-sm-5 <?php echo esc_attr($html_class_prefix) ?>option-title">
4779 <label for="ays-status" class="form-label">
4780 <?php echo esc_html(__('Status', "chart-builder")); ?>
4781 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Decide whether the chart is active or not. If the chart is a draft, it won't be shown anywhere on your website (you don't need to remove shortcodes).","chart-builder") ); ?>">
4782 <i class="ays_fa ays_fa_info_circle"></i>
4783 </a>
4784 </label>
4785 </div>
4786 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
4787 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
4788 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-status" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>status" value="published" <?php echo $status == 'published' ? 'checked' : ''; ?> >
4789 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
4790 </label>
4791 </div>
4792 </div> <!-- Status -->
4793 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
4794 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
4795 <label for="ays-chart-description" class="form-label">
4796 <?php echo esc_html(__( "Description", "chart-builder" )); ?>
4797 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Set the chart description","chart-builder") ); ?>">
4798 <i class="ays_fa ays_fa_info_circle"></i>
4799 </a>
4800 </label>
4801 </div>
4802 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
4803 <textarea class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-textarea-input" id="ays-chart-description" type="text" name="<?php echo esc_attr($html_name_prefix); ?>description"><?php echo esc_attr($chart_description) ?></textarea>
4804 </div>
4805 </div> <!-- Chart description -->
4806 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
4807 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
4808 <label for="ays-chart-create-author" class="form-label">
4809 <?php echo esc_html(__('Change the author of the current chart',"chart-builder")); ?>
4810 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_html(__('You can change the author who created the current chart to your preferred one. You need to write the User ID here. Please note, that in case you write an ID, by which there are no users found, the changes will not be applied and the previous author will remain the same.',"chart-builder")); ?>">
4811 <i class="ays_fa ays_fa_info_circle"></i>
4812 </a>
4813 </label>
4814 </div>
4815 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
4816 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-create-author" name="<?php echo esc_attr($html_name_prefix); ?>create_author">
4817 <option value=""><?php echo esc_html(__('Select User',"chart-builder"))?></option>
4818 <?php if (isset($create_author_data['ID'])) : ?>
4819 <option value="<?php echo esc_html($create_author_data['ID'])?>" selected><?php echo esc_html($create_author_data['display_name'])?></option>
4820 <?php endif; ?>
4821 </select>
4822 </div>
4823 </div> <!-- Change chart author -->
4824 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
4825 <div class="col-sm-5 <?php echo esc_attr($html_class_prefix) ?>option-title">
4826 <label for="ays-chart-show-title" class="form-label">
4827 <?php echo esc_html(__('Show chart title', "chart-builder")); ?>
4828 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("If you disable the toggle, the Chart title will not be displayed on the Front-end. By default, the toggle is enabled.","chart-builder") ); ?>">
4829 <i class="ays_fa ays_fa_info_circle"></i>
4830 </a>
4831 </label>
4832 </div>
4833 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
4834 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
4835 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-show-title" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[show_title]" value="on" <?php echo esc_attr($show_title); ?> >
4836 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
4837 </label>
4838 </div>
4839 </div> <!-- Show title -->
4840 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
4841 <div class="col-sm-5 <?php echo esc_attr($html_class_prefix) ?>option-title">
4842 <label for="ays-chart-show-description" class="form-label">
4843 <?php echo esc_html(__('Show chart description', "chart-builder")); ?>
4844 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("If you disable the toggle, the Chart description will not be displayed on the Front-end. By default, the toggle is enabled.","chart-builder") ); ?>">
4845 <i class="ays_fa ays_fa_info_circle"></i>
4846 </a>
4847 </label>
4848 </div>
4849 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
4850 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
4851 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-show-description" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[show_description]" value="on" <?php echo esc_attr($show_description); ?> >
4852 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
4853 </label>
4854 </div>
4855 </div> <!-- Show description -->
4856 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-bar_chart-opt cb-column_chart-opt cb-line_chart-opt cb-pie_chart-opt cb-donut_chart-opt">
4857 <div class="col-sm-5 <?php echo esc_attr($html_class_prefix) ?>option-title">
4858 <label for="ays-chart-option-enable-interactivity" class="form-label">
4859 <?php echo esc_html(__('Enable interactivity', "chart-builder")); ?>
4860 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Decide if the chart shows events based on user actions or responds to user interaction. If not, the chart won't generate 'select' or similar interaction-based events (but will generate ready or error events), and won't show hovertext or change based on user input.","chart-builder") ); ?>">
4861 <i class="ays_fa ays_fa_info_circle"></i>
4862 </a>
4863 </label>
4864 </div>
4865 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
4866 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
4867 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-enable-interactivity" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[enable_interactivity]" value="on" <?php echo esc_attr($enable_interactivity); ?> >
4868 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
4869 </label>
4870 </div>
4871 </div> <!-- Enable interactivity -->
4872 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-bar_chart-opt cb-column_chart-opt cb-line_chart-opt">
4873 <div class="col-sm-5 <?php echo esc_attr($html_class_prefix) ?>option-title">
4874 <label for="ays-chart-option-maximized-view" class="form-label">
4875 <?php echo esc_html(__('Maximized view', "chart-builder")); ?>
4876 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("If checked, maximizes the area of the chart.","chart-builder") ); ?>">
4877 <i class="ays_fa ays_fa_info_circle"></i>
4878 </a>
4879 </label>
4880 </div>
4881 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
4882 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
4883 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-maximized-view" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[maximized_view]" value="on" <?php echo esc_attr($maximized_view); ?> >
4884 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
4885 </label>
4886 </div>
4887 </div> <!-- Maximized view -->
4888 </div>
4889 </div>
4890 <?php
4891 $content = ob_get_clean();
4892
4893 $title = __( 'General Settings', "chart-builder" );
4894
4895 $sources['general_settings'] = array(
4896 'content' => $content,
4897 'title' => $title
4898 );
4899
4900 return $sources;
4901 }
4902
4903 public function settings_contents_general_settings_chartjs( $sources, $args ){
4904 $html_class_prefix = $args['html_class_prefix'];
4905 $html_name_prefix = $args['html_name_prefix'];
4906 $chart_description = $args['chart_description'];
4907 $create_author_data = $args['create_author_data'];
4908 $status = $args['status'];
4909 $settings = $args['settings'];
4910
4911 $show_title = $settings['show_title'];
4912 $show_description = $settings['show_description'];
4913
4914 ob_start();
4915 ?>
4916 <div class="ays-accordion-data-main-wrap">
4917 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
4918 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
4919 <div class="col-sm-5 <?php echo esc_attr($html_class_prefix) ?>option-title">
4920 <label for="ays-status" class="form-label">
4921 <?php echo esc_html(__('Status', "chart-builder")); ?>
4922 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Decide whether the chart is active or not. If the chart is a draft, it won't be shown anywhere on your website (you don't need to remove shortcodes).","chart-builder") ); ?>">
4923 <i class="ays_fa ays_fa_info_circle"></i>
4924 </a>
4925 </label>
4926 </div>
4927 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
4928 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
4929 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-status" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>status" value="published" <?php echo $status == 'published' ? 'checked' : ''; ?> >
4930 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
4931 </label>
4932 </div>
4933 </div> <!-- Status -->
4934 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
4935 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
4936 <label for="ays-chart-description" class="form-label">
4937 <?php echo esc_html(__( "Description", "chart-builder" )); ?>
4938 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Set the chart description","chart-builder") ); ?>">
4939 <i class="ays_fa ays_fa_info_circle"></i>
4940 </a>
4941 </label>
4942 </div>
4943 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
4944 <textarea class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-textarea-input" id="ays-chart-description" type="text" name="<?php echo esc_attr($html_name_prefix); ?>description"><?php echo esc_attr($chart_description) ?></textarea>
4945 </div>
4946 </div> <!-- Chart description -->
4947 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
4948 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
4949 <label for="ays-chart-create-author" class="form-label">
4950 <?php echo esc_html(__('Change the author of the current chart',"chart-builder")); ?>
4951 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_html(__('You can change the author who created the current chart to your preferred one. You need to write the User ID here. Please note, that in case you write an ID, by which there are no users found, the changes will not be applied and the previous author will remain the same.',"chart-builder")); ?>">
4952 <i class="ays_fa ays_fa_info_circle"></i>
4953 </a>
4954 </label>
4955 </div>
4956 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
4957 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-create-author" name="<?php echo esc_attr($html_name_prefix); ?>create_author">
4958 <option value=""><?php echo esc_html(__('Select User',"chart-builder"))?></option>
4959 <?php if (isset($create_author_data['ID'])) : ?>
4960 <option value="<?php echo esc_html($create_author_data['ID'])?>" selected><?php echo esc_html($create_author_data['display_name'])?></option>
4961 <?php endif; ?>
4962 </select>
4963 </div>
4964 </div> <!-- Change chart author -->
4965 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
4966 <div class="col-sm-5 <?php echo esc_attr($html_class_prefix) ?>option-title">
4967 <label for="ays-chart-show-title" class="form-label">
4968 <?php echo esc_html(__('Show chart title', "chart-builder")); ?>
4969 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("If you disable the toggle, the Chart title will not be displayed on the Front-end. By default, the toggle is enabled.","chart-builder") ); ?>">
4970 <i class="ays_fa ays_fa_info_circle"></i>
4971 </a>
4972 </label>
4973 </div>
4974 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
4975 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
4976 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-show-title" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[show_title]" value="on" <?php echo esc_attr($show_title); ?> >
4977 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
4978 </label>
4979 </div>
4980 </div> <!-- Show title -->
4981 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
4982 <div class="col-sm-5 <?php echo esc_attr($html_class_prefix) ?>option-title">
4983 <label for="ays-chart-show-description" class="form-label">
4984 <?php echo esc_html(__('Show chart description', "chart-builder")); ?>
4985 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("If you disable the toggle, the Chart description will not be displayed on the Front-end. By default, the toggle is enabled.","chart-builder") ); ?>">
4986 <i class="ays_fa ays_fa_info_circle"></i>
4987 </a>
4988 </label>
4989 </div>
4990 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
4991 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
4992 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-show-description" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[show_description]" value="on" <?php echo esc_attr($show_description); ?> >
4993 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
4994 </label>
4995 </div>
4996 </div> <!-- Show description -->
4997 </div>
4998 </div>
4999 <?php
5000 $content = ob_get_clean();
5001
5002 $title = __( 'General Settings', "chart-builder" );
5003
5004 $sources['general_settings'] = array(
5005 'content' => $content,
5006 'title' => $title
5007 );
5008
5009 return $sources;
5010 }
5011
5012 public function settings_contents_tooltip_settings( $sources, $args ){
5013 $html_class_prefix = $args['html_class_prefix'];
5014 $html_name_prefix = $args['html_name_prefix'];
5015 $settings = $args['settings'];
5016
5017 $tooltip_trigger_options = $settings['tooltip_trigger_options'];
5018 $tooltip_trigger = $settings['tooltip_trigger'];
5019 $show_color_code = $settings['show_color_code'];
5020 $tooltip_italic = $settings['tooltip_italic'];
5021 $tooltip_bold = $settings['tooltip_bold'];
5022 $tooltip_bold_options = $settings['tooltip_bold_options'];
5023 $tooltip_text_color = $settings['tooltip_text_color'];
5024 $tooltip_font_size = $settings['tooltip_font_size'];
5025
5026 ob_start();
5027 ?>
5028 <div class="ays-accordion-data-main-wrap cb-changable-tab cb-pie_chart-tab cb-bar_chart-tab cb-column_chart-tab cb-line_chart-tab cb-donut_chart-tab">
5029 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
5030 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5031 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5032 <label for="ays-chart-option-tooltip-trigger">
5033 <?php echo esc_html(__( "Trigger", "chart-builder" )); ?>
5034 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr(htmlspecialchars( __("Choose when to display the results on the chart.","chart-builder") )); ?>">
5035 <i class="ays_fa ays_fa_info_circle"></i>
5036 </a>
5037 </label>
5038 </div>
5039 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5040 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-tooltip-trigger" name="<?php echo esc_attr($html_name_prefix); ?>settings[tooltip_trigger]">
5041 <?php
5042 foreach ( $tooltip_trigger_options as $option_slug => $option ):
5043 $selected = ( $tooltip_trigger == $option_slug ) ? 'selected' : '';
5044 ?>
5045 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
5046 <?php
5047 endforeach;
5048 ?>
5049 </select>
5050 </div>
5051 </div> <!-- Trigger -->
5052 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5053 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5054 <label for="ays-chart-option-show-color-code">
5055 <?php echo esc_html(__( "Show Color Code", "chart-builder" )); ?>
5056 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color will be displayed while clicking on a particular part of the chart.","chart-builder") ); ?>">
5057 <i class="ays_fa ays_fa_info_circle"></i>
5058 </a>
5059 </label>
5060 </div>
5061 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5062 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5063 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-show-color-code" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[show_color_code]" value="on" <?php echo esc_attr($show_color_code); ?> >
5064 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5065 </label>
5066 </div>
5067 </div> <!-- Show Color Code -->
5068 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5069 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5070 <label for="ays-chart-option-tooltip-text-color">
5071 <?php echo esc_html(__( "Text color", "chart-builder" )); ?>
5072 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the tooltip text.","chart-builder") ); ?>">
5073 <i class="ays_fa ays_fa_info_circle"></i>
5074 </a>
5075 </label>
5076 </div>
5077 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5078 <input id="ays-chart-option-tooltip-text-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[tooltip_text_color]" value="<?php echo esc_attr($tooltip_text_color) ?>">
5079 </div>
5080 </div> <!-- Text color -->
5081 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5082 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5083 <label for="ays-chart-option-tooltip-font-size" class="form-label">
5084 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
5085 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr(htmlspecialchars( __("The font size for all text within the chart tooltip, specified in pixels. Please note that if an invalid value is entered, it will revert to the default global font size.","chart-builder") )); ?>">
5086 <i class="ays_fa ays_fa_info_circle"></i>
5087 </a>
5088 </label>
5089 </div>
5090 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5091 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-tooltip-font-size" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[tooltip_font_size]" value="<?php echo esc_attr($tooltip_font_size) ?>">
5092 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
5093 </div>
5094 </div> <!-- Font size -->
5095 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5096 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5097 <label for="ays-chart-option-tooltip-italic">
5098 <?php echo esc_html(__( "Italic text", "chart-builder" )); ?>
5099 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable this option to make chart tooltip text italic.","chart-builder") ); ?>">
5100 <i class="ays_fa ays_fa_info_circle"></i>
5101 </a>
5102 </label>
5103 </div>
5104 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5105 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5106 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-tooltip-italic" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[tooltip_italic]" value="on" <?php echo esc_attr($tooltip_italic); ?> >
5107 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5108 </label>
5109 </div>
5110 </div> <!-- Italic text -->
5111 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5112 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5113 <label for="ays-chart-option-tooltip-bold">
5114 <?php echo esc_html(__( "Bold text", "chart-builder" )); ?>
5115 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr(htmlspecialchars( __("Choose when to display the results on the chart.","chart-builder") )); ?>">
5116 <i class="ays_fa ays_fa_info_circle"></i>
5117 </a>
5118 </label>
5119 </div>
5120 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5121 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-tooltip-bold" name="<?php echo esc_attr($html_name_prefix); ?>settings[tooltip_bold]">
5122 <?php
5123 foreach ( $tooltip_bold_options as $option_slug => $option ):
5124 $selected = ( $tooltip_bold == $option_slug ) ? 'selected' : '';
5125 ?>
5126 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
5127 <?php
5128 endforeach;
5129 ?>
5130 </select>
5131 </div>
5132 </div> <!-- Bold text -->
5133 </div>
5134 </div>
5135 <?php
5136 $content = ob_get_clean();
5137
5138 $title = __( 'Tooltip', "chart-builder" );
5139
5140 $sources['tooltip'] = array(
5141 'content' => $content,
5142 'title' => $title
5143 );
5144
5145 return $sources;
5146 }
5147
5148 public function settings_contents_tooltip_settings_chartjs( $sources, $args ){
5149 $html_class_prefix = $args['html_class_prefix'];
5150 $html_name_prefix = $args['html_name_prefix'];
5151 $settings = $args['settings'];
5152
5153 $tooltip_text_color = $settings['tooltip_text_color'];
5154
5155 ob_start();
5156 ?>
5157 <div class="ays-accordion-data-main-wrap ">
5158 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
5159 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5160 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5161 <label for="ays-chart-option-tooltip-text-color">
5162 <?php echo esc_html(__( "Text color", "chart-builder" )); ?>
5163 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the tooltip text.","chart-builder") ); ?>">
5164 <i class="ays_fa ays_fa_info_circle"></i>
5165 </a>
5166 </label>
5167 </div>
5168 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5169 <input id="ays-chart-option-tooltip-text-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[tooltip_text_color]" value="<?php echo esc_attr($tooltip_text_color) ?>">
5170 </div>
5171 </div> <!-- Text color -->
5172 </div>
5173 </div>
5174 <?php
5175 $content = ob_get_clean();
5176
5177 $title = __( 'Tooltip', "chart-builder" );
5178
5179 $sources['tooltip'] = array(
5180 'content' => $content,
5181 'title' => $title
5182 );
5183
5184 return $sources;
5185 }
5186
5187 public function settings_contents_legend_settings( $sources, $args ){
5188 $html_class_prefix = $args['html_class_prefix'];
5189 $html_name_prefix = $args['html_name_prefix'];
5190 $settings = $args['settings'];
5191 $legend_positions = $settings['legend_positions'];
5192 $legend_position = $settings['legend_position'];
5193 $legend_alignments = $settings['legend_alignments'];
5194 $legend_alignment = $settings['legend_alignment'];
5195 $legend_color = $settings['legend_color'];
5196 $legend_font_size = $settings['legend_font_size'];
5197 $legend_bold = $settings['legend_bold'];
5198 $legend_italic = $settings['legend_italic'];
5199
5200 ob_start();
5201 ?>
5202 <div class="ays-accordion-data-main-wrap cb-changable-tab cb-pie_chart-tab cb-bar_chart-tab cb-column_chart-tab cb-line_chart-tab cb-donut_chart-tab">
5203 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
5204 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5205 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5206 <label for="ays-chart-option-legend-position">
5207 <?php echo esc_html(__( "Position", "chart-builder" )); ?>
5208 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr(htmlspecialchars( __("Choose the appropriate position for the chart legend.","chart-builder") )); ?>">
5209 <i class="ays_fa ays_fa_info_circle"></i>
5210 </a>
5211 </label>
5212 </div>
5213 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5214 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-legend-position" name="<?php echo esc_attr($html_name_prefix); ?>settings[legend_position]">
5215 <?php
5216 foreach ( $legend_positions as $option_slug => $option ):
5217 $selected = ( $legend_position == $option_slug ) ? 'selected' : '';
5218
5219 $type_class = '';
5220 if ($option_slug == 'left') {
5221 $type_class = ' cb-changable-opt cb-pie_chart-opt cb-donut_chart-opt ';
5222 } else if ($option_slug == 'in') {
5223 $type_class = ' cb-changable-opt cb-bar_chart-opt cb-column_chart-opt cb-line_chart-opt ';
5224 } else if ($option_slug == 'labeled') {
5225 $type_class = ' cb-changable-opt cb-pie_chart-opt cb-donut_chart-opt ';
5226 }
5227
5228 ?>
5229
5230 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?> class="<?php echo esc_attr($type_class); ?>"><?php echo esc_html($option); ?></option>
5231 <?php
5232 endforeach;
5233 ?>
5234 </select>
5235 </div>
5236 </div> <!-- Legend position -->
5237 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5238 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5239 <label for="ays-chart-option-legend-alignment">
5240 <?php echo esc_html(__( "Alignment", "chart-builder" )); ?>
5241 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr(htmlspecialchars( __("Choose the appropriate alignment for the chart legend.","chart-builder") )); ?>">
5242 <i class="ays_fa ays_fa_info_circle"></i>
5243 </a>
5244 </label>
5245 </div>
5246 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5247 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-legend-alignment" name="<?php echo esc_attr($html_name_prefix); ?>settings[legend_alignment]">
5248 <?php
5249 foreach ( $legend_alignments as $option_slug => $option ):
5250 $selected = ( $legend_alignment == $option_slug ) ? 'selected' : '';
5251 ?>
5252 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
5253 <?php
5254 endforeach;
5255 ?>
5256 </select>
5257 </div>
5258 </div> <!-- Legend alignment -->
5259 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5260 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5261 <label for="ays-chart-option-legend-font-color">
5262 <?php echo esc_html(__( "Font Color", "chart-builder" )); ?>
5263 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr(htmlspecialchars( __("Choose the font color for the chart legend.","chart-builder") )); ?>">
5264 <i class="ays_fa ays_fa_info_circle"></i>
5265 </a>
5266 </label>
5267 </div>
5268 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5269 <input id="ays-chart-option-legend-font-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[legend_color]" value="<?php echo esc_attr($legend_color) ?>">
5270 </div>
5271 </div> <!-- Legend font color -->
5272 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5273 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5274 <label for="ays-chart-option-legend-font-size" class="form-label">
5275 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
5276 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr(htmlspecialchars( __("The font size for all text within the chart legend, specified in pixels. Please note that if an invalid value is entered, it will revert to the default global font size.","chart-builder") )); ?>">
5277 <i class="ays_fa ays_fa_info_circle"></i>
5278 </a>
5279 </label>
5280 </div>
5281 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5282 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-legend-font-size" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[legend_font_size]" value="<?php echo esc_attr($legend_font_size) ?>">
5283 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
5284 </div>
5285 </div> <!-- Font size -->
5286 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5287 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5288 <label for="ays-chart-option-legend-italic">
5289 <?php echo esc_html(__( "Italic text", "chart-builder" )); ?>
5290 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable this option to make chart legend text italic.","chart-builder") ); ?>">
5291 <i class="ays_fa ays_fa_info_circle"></i>
5292 </a>
5293 </label>
5294 </div>
5295 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5296 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5297 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-legend-italic" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[legend_italic]" value="on" <?php echo esc_attr($legend_italic); ?> >
5298 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5299 </label>
5300 </div>
5301 </div> <!-- Italic text -->
5302 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5303 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5304 <label for="ays-chart-option-legend-bold">
5305 <?php echo esc_html(__( "Bold text", "chart-builder" )); ?>
5306 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable this option to make chart legend text bold.","chart-builder") ); ?>">
5307 <i class="ays_fa ays_fa_info_circle"></i>
5308 </a>
5309 </label>
5310 </div>
5311 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5312 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5313 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-legend-bold" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[legend_bold]" value="on" <?php echo esc_attr($legend_bold); ?> >
5314 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5315 </label>
5316 </div>
5317 </div> <!-- Bold text -->
5318 </div>
5319 </div>
5320 <?php
5321 $content = ob_get_clean();
5322
5323 $title = __( 'Legend', "chart-builder" );
5324
5325 $sources['legend'] = array(
5326 'content' => $content,
5327 'title' => $title
5328 );
5329
5330 return $sources;
5331 }
5332
5333 public function settings_contents_legend_settings_chartjs( $sources, $args ){
5334 $html_class_prefix = $args['html_class_prefix'];
5335 $html_name_prefix = $args['html_name_prefix'];
5336 $settings = $args['settings'];
5337 $legend_positions = $settings['legend_positions'];
5338 $legend_position = $settings['legend_position'];
5339 $legend_alignments = $settings['legend_alignments'];
5340 $legend_alignment = $settings['legend_alignment'];
5341 $legend_color = $settings['legend_color'];
5342 $legend_font_size = $settings['legend_font_size'];
5343 $legend_reverse = $settings['legend_reverse'];
5344 $legend_bold = $settings['legend_bold'];
5345 $legend_italic = $settings['legend_italic'];
5346 ob_start();
5347 ?>
5348 <div class="ays-accordion-data-main-wrap">
5349 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
5350 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5351 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5352 <label for="ays-chart-option-legend-position">
5353 <?php echo esc_html(__( "Position", "chart-builder" )); ?>
5354 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr(htmlspecialchars( __("Choose the appropriate position for the chart legend.","chart-builder") )); ?>">
5355 <i class="ays_fa ays_fa_info_circle"></i>
5356 </a>
5357 </label>
5358 </div>
5359 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5360 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-legend-position" name="<?php echo esc_attr($html_name_prefix); ?>settings[legend_position]">
5361 <?php
5362 foreach ( $legend_positions as $option_slug => $option ):
5363 $selected = ( $legend_position == $option_slug ) ? 'selected' : '';
5364 ?>
5365 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?> ><?php echo esc_html($option); ?></option>
5366 <?php
5367 endforeach;
5368 ?>
5369 </select>
5370 </div>
5371 </div> <!-- Legend position -->
5372 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5373 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5374 <label for="ays-chart-option-legend-alignment">
5375 <?php echo esc_html(__( "Alignment", "chart-builder" )); ?>
5376 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr(htmlspecialchars( __("Choose the appropriate alignment for the chart legend.","chart-builder") )); ?>">
5377 <i class="ays_fa ays_fa_info_circle"></i>
5378 </a>
5379 </label>
5380 </div>
5381 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5382 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-legend-alignment" name="<?php echo esc_attr($html_name_prefix); ?>settings[legend_alignment]">
5383 <?php
5384 foreach ( $legend_alignments as $option_slug => $option ):
5385 $selected = ( $legend_alignment == $option_slug ) ? 'selected' : '';
5386 ?>
5387 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
5388 <?php
5389 endforeach;
5390 ?>
5391 </select>
5392 </div>
5393 </div> <!-- Legend alignment -->
5394 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5395 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5396 <label for="ays-chart-option-legend-font-color">
5397 <?php echo esc_html(__( "Font Color", "chart-builder" )); ?>
5398 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr(htmlspecialchars( __("Choose the font color for the chart legend.","chart-builder") )); ?>">
5399 <i class="ays_fa ays_fa_info_circle"></i>
5400 </a>
5401 </label>
5402 </div>
5403 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5404 <input id="ays-chart-option-legend-font-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[legend_color]" value="<?php echo esc_attr($legend_color) ?>">
5405 </div>
5406 </div> <!-- Legend font color -->
5407 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5408 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5409 <label for="ays-chart-option-legend-font-size" class="form-label">
5410 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
5411 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr(htmlspecialchars( __("The font size for all text within the chart legend, specified in pixels. Please note that if an invalid value is entered, it will revert to the default global font size.","chart-builder") )); ?>">
5412 <i class="ays_fa ays_fa_info_circle"></i>
5413 </a>
5414 </label>
5415 </div>
5416 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5417 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-legend-font-size" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[legend_font_size]" value="<?php echo esc_attr($legend_font_size) ?>">
5418 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
5419 </div>
5420 </div> <!-- Font size -->
5421 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5422 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5423 <label for="ays-chart-option-legend-italic">
5424 <?php echo esc_html(__( "Italic text", "chart-builder" )); ?>
5425 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable this option to make chart legend text italic.","chart-builder") ); ?>">
5426 <i class="ays_fa ays_fa_info_circle"></i>
5427 </a>
5428 </label>
5429 </div>
5430 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5431 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5432 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-legend-italic" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[legend_italic]" value="on" <?php echo esc_attr($legend_italic); ?> >
5433 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5434 </label>
5435 </div>
5436 </div> <!-- Italic text -->
5437 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5438 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5439 <label for="ays-chart-option-legend-bold">
5440 <?php echo esc_html(__( "Bold text", "chart-builder" )); ?>
5441 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable this option to make chart legend text bold.","chart-builder") ); ?>">
5442 <i class="ays_fa ays_fa_info_circle"></i>
5443 </a>
5444 </label>
5445 </div>
5446 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5447 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5448 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-legend-bold" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[legend_bold]" value="on" <?php echo esc_attr($legend_bold); ?> >
5449 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5450 </label>
5451 </div>
5452 </div> <!-- Bold text -->
5453 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt">
5454 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5455 <label for="ays-chart-option-legend-revers">
5456 <?php echo esc_html(__( "Show datasets in reverse order", "chart-builder" )); ?>
5457 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable this toggle to show datasets in reverse ordering.","chart-builder") ); ?>">
5458 <i class="ays_fa ays_fa_info_circle"></i>
5459 </a>
5460 </label>
5461 </div>
5462 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5463 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5464 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-legend-reverse" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[legend_reverse]" value="on" <?php echo esc_attr($legend_reverse); ?> >
5465 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5466 </label>
5467 </div>
5468 </div> <!-- reverse datasets -->
5469 </div>
5470 </div>
5471 <?php
5472 $content = ob_get_clean();
5473
5474 $title = __( 'Legend', "chart-builder" );
5475
5476 $sources['legend'] = array(
5477 'content' => $content,
5478 'title' => $title
5479 );
5480
5481 return $sources;
5482 }
5483
5484 public function settings_contents_horizontal_axis_settings( $sources, $args ){
5485 $html_class_prefix = $args['html_class_prefix'];
5486 $html_name_prefix = $args['html_name_prefix'];
5487 $settings = $args['settings'];
5488
5489 $haxis_title = $settings['haxis_title'];
5490 $axes_text_positions = $settings['axes_text_positions'];
5491 $haxis_text_position = $settings['haxis_text_position'];
5492 $haxis_direction = $settings['haxis_direction'];
5493 $haxis_text_color = $settings['haxis_text_color'];
5494 $haxis_baseline_color = $settings['haxis_baseline_color'];
5495 $haxis_slanted_options = $settings['haxis_slanted_options'];
5496 $haxis_slanted = $settings['haxis_slanted'];
5497 $haxis_slanted_text_angle = $settings['haxis_slanted_text_angle'];
5498 $haxis_show_text_every = $settings['haxis_show_text_every'];
5499 $haxis_format_options = $settings['axes_format_options'];
5500 $haxis_format = $settings['haxis_format'];
5501 $haxis_enable_divide_percent = $settings['haxis_enable_divide_percent'];
5502 $haxis_label_font_size = $settings['haxis_label_font_size'];
5503 $haxis_max_value = $settings['haxis_max_value'];
5504 $haxis_min_value = $settings['haxis_min_value'];
5505 $haxis_text_font_size = $settings['haxis_text_font_size'];
5506 $haxis_label_color = $settings['haxis_label_color'];
5507 $haxis_bold = $settings['haxis_bold'];
5508 $haxis_italic = $settings['haxis_italic'];
5509 $haxis_title_bold = $settings['haxis_title_bold'];
5510 $haxis_title_italic = $settings['haxis_title_italic'];
5511 $haxis_gridlines_count = $settings['haxis_gridlines_count'];
5512 $haxis_gridlines_color = $settings['haxis_gridlines_color'];
5513 $haxis_minor_gridlines_color = $settings['haxis_minor_gridlines_color'];
5514
5515 ob_start();
5516 ?>
5517 <div class="ays-accordion-data-main-wrap <?php echo esc_attr($html_class_prefix) ?>options-haxis-settings-tab cb-changable-tab cb-bar_chart-tab cb-column_chart-tab cb-line_chart-tab">
5518 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
5519 <h6>Label</h6>
5520 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5521 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5522 <label for="ays-chart-option-haxis-title" class="form-label">
5523 <?php echo esc_html(__( "Label", "chart-builder" )); ?>
5524 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The title of the horizontal axis","chart-builder") ); ?>">
5525 <i class="ays_fa ays_fa_info_circle"></i>
5526 </a>
5527 </label>
5528 </div>
5529 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5530 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-haxis-title" type="text" name="<?php echo esc_attr($html_name_prefix); ?>settings[haxis_title]" value="<?php echo esc_attr($haxis_title) ?>">
5531 </div>
5532 </div> <!-- Horizontal axis label -->
5533 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5534 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5535 <label for="ays-chart-option-haxis-label-font-size" class="form-label">
5536 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
5537 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The font size of the horizontal axis label.","chart-builder") ); ?>">
5538 <i class="ays_fa ays_fa_info_circle"></i>
5539 </a>
5540 </label>
5541 </div>
5542 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5543 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-haxis-label-font-size" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[haxis_label_font_size]" value="<?php echo esc_attr($haxis_label_font_size) ?>">
5544 </div>
5545 </div> <!-- Horizontal axis label font size -->
5546 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5547 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5548 <label for="ays-chart-option-haxis-label-color">
5549 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
5550 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the horizontal axis label.","chart-builder") ); ?>">
5551 <i class="ays_fa ays_fa_info_circle"></i>
5552 </a>
5553 </label>
5554 </div>
5555 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5556 <input id="ays-chart-option-haxis-label-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[haxis_label_color]" value="<?php echo esc_attr($haxis_label_color) ?>">
5557 </div>
5558 </div> <!-- Horizontal axis label color -->
5559 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5560 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5561 <label for="ays-chart-option-haxis-title-italic">
5562 <?php echo esc_html(__( "Italic", "chart-builder" )); ?>
5563 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable this option to make chart horizontal axis label italic.","chart-builder") ); ?>">
5564 <i class="ays_fa ays_fa_info_circle"></i>
5565 </a>
5566 </label>
5567 </div>
5568 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5569 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5570 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-haxis-title-italic" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[haxis_title_italic]" value="on" <?php echo esc_attr($haxis_title_italic); ?> >
5571 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5572 </label>
5573 </div>
5574 </div> <!-- Italic label -->
5575 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5576 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5577 <label for="ays-chart-option-haxis-title-bold">
5578 <?php echo esc_html(__( "Bold", "chart-builder" )); ?>
5579 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable this option to make chart horizontal axis label bold.","chart-builder") ); ?>">
5580 <i class="ays_fa ays_fa_info_circle"></i>
5581 </a>
5582 </label>
5583 </div>
5584 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5585 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5586 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-haxis-title-bold" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[haxis_title_bold]" value="on" <?php echo esc_attr($haxis_title_bold); ?> >
5587 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5588 </label>
5589 </div>
5590 </div> <!-- Bold label -->
5591 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-column_chart-opt cb-line_chart-opt">
5592 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5593 <label for="ays-chart-option-haxis-show-text-every" class="form-label">
5594 <?php echo esc_html(__( "Interval", "chart-builder" )); ?>
5595 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("How many horizontal axis labels to show, where 1 means show every label, 2 means show every other label, and so on. 0 is to try to show as many labels as possible without overlapping.","chart-builder") ); ?>">
5596 <i class="ays_fa ays_fa_info_circle"></i>
5597 </a>
5598 </label>
5599 </div>
5600 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5601 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-haxis-show-text-every" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[haxis_show_text_every]" value="<?php echo esc_attr($haxis_show_text_every) ?>" step="1" min="0">
5602 </div>
5603 </div> <!-- Label interval -->
5604
5605 <br>
5606 <h6>Text</h6>
5607 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5608 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5609 <label for="ays-chart-option-haxis-text-position" class="form-label">
5610 <?php echo esc_html(__( "Position", "chart-builder" )); ?>
5611 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Position of the horizontal axis text, relative to the chart area.","chart-builder") ); ?>">
5612 <i class="ays_fa ays_fa_info_circle"></i>
5613 </a>
5614 </label>
5615 </div>
5616 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5617 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-haxis-text-position" name="<?php echo esc_attr($html_name_prefix); ?>settings[haxis_text_position]">
5618 <?php
5619 foreach ( $axes_text_positions as $option_slug => $option ):
5620 $selected = ( $haxis_text_position == $option_slug ) ? 'selected' : '';
5621 ?>
5622 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
5623 <?php
5624 endforeach;
5625 ?>
5626 </select>
5627 </div>
5628 </div> <!-- Horizontal axis text position -->
5629 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5630 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5631 <label for="ays-chart-option-haxis-text-color">
5632 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
5633 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the horizontal axis text.","chart-builder") ); ?>">
5634 <i class="ays_fa ays_fa_info_circle"></i>
5635 </a>
5636 </label>
5637 </div>
5638 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5639 <input id="ays-chart-option-haxis-text-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[haxis_text_color]" value="<?php echo esc_attr($haxis_text_color) ?>">
5640 </div>
5641 </div> <!-- Horizontal axis text color -->
5642 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5643 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5644 <label for="ays-chart-option-haxis-text-font-size" class="form-label">
5645 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
5646 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The font size of the horizontal axis text.","chart-builder") ); ?>">
5647 <i class="ays_fa ays_fa_info_circle"></i>
5648 </a>
5649 </label>
5650 </div>
5651 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5652 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-haxis-text-font-size" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[haxis_text_font_size]" value="<?php echo esc_attr($haxis_text_font_size) ?>">
5653 </div>
5654 </div> <!-- Horizontal axis text font size -->
5655 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5656 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5657 <label for="ays-chart-option-haxis-text-direction">
5658 <?php echo esc_html(__( "Reverse Direction", "chart-builder" )); ?>
5659 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The direction in which the values grow along the horizontal axis. By default, low values are on the left of the chart.","chart-builder") ); ?>">
5660 <i class="ays_fa ays_fa_info_circle"></i>
5661 </a>
5662 </label>
5663 </div>
5664 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5665 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5666 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-haxis-text-direction" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[haxis_direction]" value="-1" <?php echo esc_attr($haxis_direction); ?> >
5667 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5668 </label>
5669 </div>
5670 </div> <!-- Horizontal axis text direction -->
5671 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5672 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5673 <label for="ays-chart-option-haxis-italic">
5674 <?php echo esc_html(__( "Italic", "chart-builder" )); ?>
5675 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable this option to make chart horizontal axis text italic.","chart-builder") ); ?>">
5676 <i class="ays_fa ays_fa_info_circle"></i>
5677 </a>
5678 </label>
5679 </div>
5680 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5681 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5682 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-haxis-italic" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[haxis_italic]" value="on" <?php echo esc_attr($haxis_italic); ?> >
5683 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5684 </label>
5685 </div>
5686 </div> <!-- Italic text -->
5687 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5688 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5689 <label for="ays-chart-option-haxis-bold">
5690 <?php echo esc_html(__( "Bold", "chart-builder" )); ?>
5691 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable this option to make chart horizontal axis text bold.","chart-builder") ); ?>">
5692 <i class="ays_fa ays_fa_info_circle"></i>
5693 </a>
5694 </label>
5695 </div>
5696 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5697 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5698 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-haxis-bold" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[haxis_bold]" value="on" <?php echo esc_attr($haxis_bold); ?> >
5699 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5700 </label>
5701 </div>
5702 </div> <!-- Bold text -->
5703 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5704 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5705 <label for="ays-chart-option-haxis-slanted-text" class="form-label">
5706 <?php echo esc_html(__( "Slanted text", "chart-builder" )); ?>
5707 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("By choosing true the text will be slanted. In false it will be horizontal. In Automatic based on the size, it will be displayed either in horizontal or slanted. Note: This option only works, if 'Text position' option is set to 'Outside the chart'","chart-builder") ); ?>">
5708 <i class="ays_fa ays_fa_info_circle"></i>
5709 </a>
5710 </label>
5711 </div>
5712 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5713 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-haxis-slanted-text" name="<?php echo esc_attr($html_name_prefix); ?>settings[haxis_slanted]">
5714 <?php
5715 foreach ( $haxis_slanted_options as $option_slug => $option ):
5716 $selected = ( $haxis_slanted == $option_slug ) ? 'selected' : '';
5717 ?>
5718 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
5719 <?php
5720 endforeach;
5721 ?>
5722 </select>
5723 </div>
5724 </div> <!-- Horizontal axis slanted text -->
5725 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section <?php echo ($haxis_slanted == 'false') ? 'display_none' : ''; ?>">
5726 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5727 <label for="ays-chart-option-haxis-slanted-text-angle" class="form-label">
5728 <?php echo esc_html(__( "Slanted text angle", "chart-builder" )); ?>
5729 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The slanted text angle will define the angle. It will tilt in between -90 from 90 (except 0).","chart-builder") ); ?>">
5730 <i class="ays_fa ays_fa_info_circle"></i>
5731 </a>
5732 </label>
5733 </div>
5734 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5735 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-haxis-slanted-text-angle" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[haxis_slanted_text_angle]" value="<?php echo esc_attr($haxis_slanted_text_angle) ?>" step="15" min="-90" max="90">
5736 </div>
5737 </div> <!-- Horizontal axis slanted text angle -->
5738
5739 <br>
5740 <h6>Gridlines</h6>
5741 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5742 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5743 <label for="ays-chart-option-haxis-gridlines-count" class="form-label">
5744 <?php echo esc_html(__( "Count", "chart-builder" )); ?>
5745 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The approximate number of vertical gridlines inside the chart area. If you specify a positive number for gridlines count, it will be used to compute the min spacing between gridlines. You can specify a value of 1 to only draw one gridline, or 0 to draw no gridlines. Specify -1, which is the default, to automatically compute the number of gridlines based on other options. Note: This option will not work with 'Rotate vertical' option.","chart-builder") ); ?>">
5746 <i class="ays_fa ays_fa_info_circle"></i>
5747 </a>
5748 </label>
5749 </div>
5750 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5751 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-haxis-gridlines-count" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[haxis_gridlines_count]" value="<?php echo esc_attr($haxis_gridlines_count) ?>">
5752 </div>
5753 </div> <!-- Horizontal axis gridlines count -->
5754 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5755 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5756 <label for="ays-chart-option-haxis-gridlines-color">
5757 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
5758 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the horizontal axis gridlines.","chart-builder") ); ?>">
5759 <i class="ays_fa ays_fa_info_circle"></i>
5760 </a>
5761 </label>
5762 </div>
5763 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5764 <input id="ays-chart-option-haxis-gridlines-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[haxis_gridlines_color]" value="<?php echo esc_attr($haxis_gridlines_color) ?>">
5765 </div>
5766 </div> <!-- Horizontal axis gridlines color -->
5767 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5768 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5769 <label for="ays-chart-option-haxis-minor-gridlines-color">
5770 <?php echo esc_html(__( "Minor gridlines color", "chart-builder" )); ?>
5771 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the horizontal axis minor gridlines.","chart-builder") ); ?>">
5772 <i class="ays_fa ays_fa_info_circle"></i>
5773 </a>
5774 </label>
5775 </div>
5776 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5777 <input id="ays-chart-option-haxis-minor-gridlines-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[haxis_minor_gridlines_color]" value="<?php echo esc_attr($haxis_minor_gridlines_color) ?>">
5778 </div>
5779 </div> <!-- Horizontal axis minor gridlines color -->
5780 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-bar_chart-opt cb-line_chart-opt">
5781 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5782 <label for="ays-chart-option-haxis-baseline-color">
5783 <?php echo esc_html(__( "Baseline color", "chart-builder" )); ?>
5784 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Specifies the color of the baseline for the horizontal axis.","chart-builder") ); ?>">
5785 <i class="ays_fa ays_fa_info_circle"></i>
5786 </a>
5787 </label>
5788 </div>
5789 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5790 <input id="ays-chart-option-haxis-baseline-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[haxis_baseline_color]" value="<?php echo esc_attr($haxis_baseline_color) ?>">
5791 </div>
5792 </div> <!-- Horizontal axis baseline color -->
5793
5794 <br class="cb-changable-opt cb-bar_chart-opt " >
5795 <h6 class="cb-changable-opt cb-bar_chart-opt">Format</h6>
5796 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-bar_chart-opt " >
5797 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5798 <label for="ays-chart-option-haxis-format" class="form-label">
5799 <?php echo esc_html(__( "Format", "chart-builder" )); ?>
5800 <a class="ays_help" data-bs-toggle="tooltip" data-bs-html="true" title="<?php
5801 echo esc_attr( sprintf(
5802 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
5803 "<p>" . __('A format string for numeric axis labels. You can choose any of the following:', "chart-builder") . "</p><ul class='ays_tooltop_ul'><li>" .
5804 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
5805 __('%1$sNone:%2$s Displays numbers with no formatting (e.g., 8000000)', "chart-builder") . "</li><li>" .
5806 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
5807 __('%1$sDecimal:%2$s Displays numbers with thousands separators (e.g., 8,000,000)', "chart-builder") . "</li><li>" .
5808 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
5809 __('%1$sScientific:%2$s Displays numbers in scientific notation (e.g., 8e6)', "chart-builder") . "</li><li>" .
5810 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
5811 __('%1$sCurrency:%2$s Displays numbers in the local currency (e.g., $8,000,000.00)', "chart-builder") . "</li><li>" .
5812 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
5813 __('%1$sPercent:%2$s Displays numbers as percentages (e.g., 800,000,000%%)', "chart-builder") . "</li><li>" .
5814 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
5815 __('%1$sShort:%2$s Displays abbreviated numbers (e.g., 8M)', "chart-builder") . "</li><li>" .
5816 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
5817 __('%1$sLong:%2$s Displays numbers as full words (e.g., 8 million)', "chart-builder") . "</li></ul>",
5818 '<em>', '</em>',
5819 '<em>', '</em>',
5820 '<em>', '</em>',
5821 '<em>', '</em>',
5822 '<em>', '</em>',
5823 '<em>', '</em>',
5824 '<em>', '</em>'
5825 ));
5826 ?>">
5827 <i class="ays_fa ays_fa_info_circle"></i>
5828 </a>
5829 </label>
5830 </div>
5831 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5832 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-haxis-format" name="<?php echo esc_attr($html_name_prefix); ?>settings[haxis_format]">
5833 <?php
5834 foreach ( $haxis_format_options as $option_slug => $option ):
5835 $selected = ( $haxis_format == $option_slug ) ? 'selected' : '';
5836 ?>
5837 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
5838 <?php
5839 endforeach;
5840 ?>
5841 </select>
5842 </div>
5843 </div> <!-- Horizontal axis format -->
5844 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section option-haxis-enable-divide-percent cb-changable-opt cb-bar_chart-opt" style="<?php echo ($haxis_format == 'percent') ? '' : 'display: none;'; ?>">
5845 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5846 <label for="ays-chart-option-haxis-enable-divide-percent">
5847 <?php echo esc_html(__( "Remove Extra Zeros ", "chart-builder" )); ?>
5848 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable this option to hide extra 00's from the axis text if the Format option is set to 'Percent'. Note: Make sure to save chart, to see changes.","chart-builder") ); ?>">
5849 <i class="ays_fa ays_fa_info_circle"></i>
5850 </a>
5851 </label>
5852 </div>
5853 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5854 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5855 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-haxis-enable-divide-percent" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[haxis_enable_divide_percent]" value="on" <?php echo esc_attr($haxis_enable_divide_percent); ?> >
5856 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5857 </label>
5858 </div>
5859 </div> <!--Remove Extra Zeros"-->
5860 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-bar_chart-opt" >
5861 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5862 <label for="ays-chart-option-haxis-max-value" class="form-label">
5863 <?php echo esc_html(__( "Max value", "chart-builder" )); ?>
5864 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The maximum value of the axis.","chart-builder") ); ?>">
5865 <i class="ays_fa ays_fa_info_circle"></i>
5866 </a>
5867 </label>
5868 </div>
5869 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5870 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-haxis-max-value" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[haxis_max_value]" value="<?php echo esc_attr($haxis_max_value) ?>">
5871 </div>
5872 </div> <!-- Horizontal axis max value -->
5873 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-bar_chart-opt" >
5874 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5875 <label for="ays-chart-option-haxis-min-value" class="form-label">
5876 <?php echo esc_html(__( "Min value", "chart-builder" )); ?>
5877 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The minimum value of the axis.","chart-builder") ); ?>">
5878 <i class="ays_fa ays_fa_info_circle"></i>
5879 </a>
5880 </label>
5881 </div>
5882 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5883 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-haxis-min-value" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[haxis_min_value]" value="<?php echo esc_attr($haxis_min_value) ?>">
5884 </div>
5885 </div> <!-- Horizontal axis min value -->
5886 </div>
5887 </div>
5888 <?php
5889 $content = ob_get_clean();
5890
5891 $title = __( 'Horizontal Axis Settings', "chart-builder" );
5892
5893 $sources['horizontal_axis'] = array(
5894 'content' => $content,
5895 'title' => $title
5896 );
5897
5898 return $sources;
5899 }
5900
5901 public function settings_contents_vertical_axis_settings( $sources, $args ){
5902 $html_class_prefix = $args['html_class_prefix'];
5903 $html_name_prefix = $args['html_name_prefix'];
5904 $settings = $args['settings'];
5905
5906 $vaxis_title = $settings['vaxis_title'];
5907 $axes_text_positions = $settings['axes_text_positions'];
5908 $vaxis_text_position = $settings['vaxis_text_position'];
5909 $vaxis_direction = $settings['vaxis_direction'];
5910 $vaxis_text_color = $settings['vaxis_text_color'];
5911 $vaxis_baseline_color = $settings['vaxis_baseline_color'];
5912 $vaxis_format_options = $settings['axes_format_options'];
5913 $vaxis_format = $settings['vaxis_format'];
5914 $vaxis_enable_divide_percent = $settings['vaxis_enable_divide_percent'];
5915 $vaxis_label_font_size = $settings['vaxis_label_font_size'];
5916 $vaxis_max_value = $settings['vaxis_max_value'];
5917 $vaxis_min_value = $settings['vaxis_min_value'];
5918 $vaxis_text_font_size = $settings['vaxis_text_font_size'];
5919 $vaxis_label_color = $settings['vaxis_label_color'];
5920 $vaxis_bold = $settings['vaxis_bold'];
5921 $vaxis_italic = $settings['vaxis_italic'];
5922 $vaxis_title_bold = $settings['vaxis_title_bold'];
5923 $vaxis_title_italic = $settings['vaxis_title_italic'];
5924 $vaxis_gridlines_count = $settings['vaxis_gridlines_count'];
5925 $vaxis_gridlines_color = $settings['vaxis_gridlines_color'];
5926 $vaxis_minor_gridlines_color = $settings['vaxis_minor_gridlines_color'];
5927
5928 ob_start();
5929 ?>
5930 <div class="ays-accordion-data-main-wrap <?php echo esc_attr($html_class_prefix) ?>options-vaxis-settings-tab cb-changable-tab cb-bar_chart-tab cb-column_chart-tab cb-line_chart-tab">
5931 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
5932 <h6>Label</h6>
5933 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5934 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5935 <label for="ays-chart-option-vaxis-title" class="form-label">
5936 <?php echo esc_html(__( "Label", "chart-builder" )); ?>
5937 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The title of the vertical axis","chart-builder") ); ?>">
5938 <i class="ays_fa ays_fa_info_circle"></i>
5939 </a>
5940 </label>
5941 </div>
5942 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5943 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-vaxis-title" type="text" name="<?php echo esc_attr($html_name_prefix); ?>settings[vaxis_title]" value="<?php echo esc_attr($vaxis_title) ?>">
5944 </div>
5945 </div> <!-- Vertical axis label -->
5946 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5947 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5948 <label for="ays-chart-option-vaxis-label-font-size" class="form-label">
5949 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
5950 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The font size of the vertical axis label.","chart-builder") ); ?>">
5951 <i class="ays_fa ays_fa_info_circle"></i>
5952 </a>
5953 </label>
5954 </div>
5955 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5956 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-vaxis-label-font-size" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[vaxis_label_font_size]" value="<?php echo esc_attr($vaxis_label_font_size) ?>">
5957 </div>
5958 </div> <!-- Vertical axis label font size -->
5959 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5960 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5961 <label for="ays-chart-option-vaxis-label-color">
5962 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
5963 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the horizontal axis label.","chart-builder") ); ?>">
5964 <i class="ays_fa ays_fa_info_circle"></i>
5965 </a>
5966 </label>
5967 </div>
5968 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5969 <input id="ays-chart-option-vaxis-label-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[vaxis_label_color]" value="<?php echo esc_attr($vaxis_label_color) ?>">
5970 </div>
5971 </div> <!-- Vertical axis label color -->
5972 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5973 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5974 <label for="ays-chart-option-vaxis-title-italic">
5975 <?php echo esc_html(__( "Italic", "chart-builder" )); ?>
5976 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable this option to make chart vertical axis label italic.","chart-builder") ); ?>">
5977 <i class="ays_fa ays_fa_info_circle"></i>
5978 </a>
5979 </label>
5980 </div>
5981 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5982 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5983 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-vaxis-title-italic" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[vaxis_title_italic]" value="on" <?php echo esc_attr($vaxis_title_italic); ?> >
5984 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5985 </label>
5986 </div>
5987 </div> <!-- Italic label -->
5988 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5989 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5990 <label for="ays-chart-option-vaxis-title-bold">
5991 <?php echo esc_html(__( "Bold", "chart-builder" )); ?>
5992 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable this option to make chart vertical axis label bold.","chart-builder") ); ?>">
5993 <i class="ays_fa ays_fa_info_circle"></i>
5994 </a>
5995 </label>
5996 </div>
5997 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5998 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5999 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-vaxis-title-bold" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[vaxis_title_bold]" value="on" <?php echo esc_attr($vaxis_title_bold); ?> >
6000 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6001 </label>
6002 </div>
6003 </div> <!-- Bold label -->
6004
6005 <br>
6006 <h6>Text</h6>
6007 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6008 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6009 <label for="ays-chart-option-vaxis-text-position" class="form-label">
6010 <?php echo esc_html(__( "Position", "chart-builder" )); ?>
6011 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Position of the vertical axis text, relative to the chart area.","chart-builder") ); ?>">
6012 <i class="ays_fa ays_fa_info_circle"></i>
6013 </a>
6014 </label>
6015 </div>
6016 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6017 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-vaxis-text-position" name="<?php echo esc_attr($html_name_prefix); ?>settings[vaxis_text_position]">
6018 <?php
6019 foreach ( $axes_text_positions as $option_slug => $option ):
6020 $selected = ( $vaxis_text_position == $option_slug ) ? 'selected' : '';
6021 ?>
6022 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
6023 <?php
6024 endforeach;
6025 ?>
6026 </select>
6027 </div>
6028 </div> <!-- Vertical axis text position -->
6029 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6030 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6031 <label for="ays-chart-option-vaxis-text-color">
6032 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
6033 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the vertical axis text.","chart-builder") ); ?>">
6034 <i class="ays_fa ays_fa_info_circle"></i>
6035 </a>
6036 </label>
6037 </div>
6038 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6039 <input id="ays-chart-option-vaxis-text-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[vaxis_text_color]" value="<?php echo esc_attr($vaxis_text_color) ?>">
6040 </div>
6041 </div> <!-- Vertical axis text color -->
6042 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6043 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6044 <label for="ays-chart-option-vaxis-text-font-size" class="form-label">
6045 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
6046 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The font size of the horizontal axis text.","chart-builder") ); ?>">
6047 <i class="ays_fa ays_fa_info_circle"></i>
6048 </a>
6049 </label>
6050 </div>
6051 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6052 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-vaxis-text-font-size" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[vaxis_text_font_size]" value="<?php echo esc_attr($vaxis_text_font_size) ?>">
6053 </div>
6054 </div> <!-- Vertical axis text font size -->
6055 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6056 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6057 <label for="ays-chart-option-vaxis-text-direction">
6058 <?php echo esc_html(__( "Reverse Direction", "chart-builder" )); ?>
6059 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The direction in which the values along the vertical axis grow. By default, low values are on the bottom of the chart.","chart-builder") ); ?>">
6060 <i class="ays_fa ays_fa_info_circle"></i>
6061 </a>
6062 </label>
6063 </div>
6064 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6065 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6066 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-vaxis-text-direction" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[vaxis_direction]" value="-1" <?php echo esc_attr($vaxis_direction); ?> >
6067 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6068 </label>
6069 </div>
6070 </div> <!-- Vertical axis text direction -->
6071 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6072 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6073 <label for="ays-chart-option-vaxis-italic">
6074 <?php echo esc_html(__( "Italic text", "chart-builder" )); ?>
6075 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable this option to make chart vertical axis text italic.","chart-builder") ); ?>">
6076 <i class="ays_fa ays_fa_info_circle"></i>
6077 </a>
6078 </label>
6079 </div>
6080 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6081 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6082 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-vaxis-italic" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[vaxis_italic]" value="on" <?php echo esc_attr($vaxis_italic); ?> >
6083 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6084 </label>
6085 </div>
6086 </div> <!-- Italic text -->
6087 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6088 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6089 <label for="ays-chart-option-vaxis-bold">
6090 <?php echo esc_html(__( "Bold text", "chart-builder" )); ?>
6091 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable this option to make chart vertical axis text bold.","chart-builder") ); ?>">
6092 <i class="ays_fa ays_fa_info_circle"></i>
6093 </a>
6094 </label>
6095 </div>
6096 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6097 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6098 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-vaxis-bold" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[vaxis_bold]" value="on" <?php echo esc_attr($vaxis_bold); ?> >
6099 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6100 </label>
6101 </div>
6102 </div> <!-- Bold text -->
6103
6104 <br>
6105 <h6>Gridlines</h6>
6106 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6107 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6108 <label for="ays-chart-option-vaxis-gridlines-count" class="form-label">
6109 <?php echo esc_html(__( "Count", "chart-builder" )); ?>
6110 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The approximate number of horizontal gridlines inside the chart area. If you specify a positive number for gridlines count, it will be used to compute the min spacing between gridlines. You can specify a value of 1 to only draw one gridline, or 0 to draw no gridlines. Specify -1, which is the default, to automatically compute the number of gridlines based on other options. Note: This option will not work with 'Rotate vertical' option.","chart-builder") ); ?>">
6111 <i class="ays_fa ays_fa_info_circle"></i>
6112 </a>
6113 </label>
6114 </div>
6115 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6116 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-vaxis-gridlines-count" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[vaxis_gridlines_count]" value="<?php echo esc_attr($vaxis_gridlines_count) ?>">
6117 </div>
6118 </div> <!-- Vertical axis gridlines count -->
6119 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6120 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6121 <label for="ays-chart-option-vaxis-gridlines-color">
6122 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
6123 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the vertical axis gridlines.","chart-builder") ); ?>">
6124 <i class="ays_fa ays_fa_info_circle"></i>
6125 </a>
6126 </label>
6127 </div>
6128 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6129 <input id="ays-chart-option-vaxis-gridlines-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[vaxis_gridlines_color]" value="<?php echo esc_attr($vaxis_gridlines_color) ?>">
6130 </div>
6131 </div> <!-- Vertical axis gridlines color -->
6132 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6133 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6134 <label for="ays-chart-option-vaxis-minor-gridlines-color">
6135 <?php echo esc_html(__( "Minor gridlines color", "chart-builder" )); ?>
6136 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the vertical axis minor gridlines.","chart-builder") ); ?>">
6137 <i class="ays_fa ays_fa_info_circle"></i>
6138 </a>
6139 </label>
6140 </div>
6141 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6142 <input id="ays-chart-option-vaxis-minor-gridlines-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[vaxis_minor_gridlines_color]" value="<?php echo esc_attr($vaxis_minor_gridlines_color) ?>">
6143 </div>
6144 </div> <!-- Vertical axis minor gridlines color -->
6145 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-column_chart-opt cb-line_chart-opt">
6146 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6147 <label for="ays-chart-option-vaxis-baseline-color">
6148 <?php echo esc_html(__( "Baseline color", "chart-builder" )); ?>
6149 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Specifies the color of the baseline for the vertical axis.","chart-builder") ); ?>">
6150 <i class="ays_fa ays_fa_info_circle"></i>
6151 </a>
6152 </label>
6153 </div>
6154 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6155 <input id="ays-chart-option-vaxis-baseline-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[vaxis_baseline_color]" value="<?php echo esc_attr($vaxis_baseline_color) ?>">
6156 </div>
6157 </div> <!-- Vertical axis baseline color -->
6158
6159 <br class="cb-changable-opt cb-column_chart-opt cb-line_chart-opt">
6160 <h6 class="cb-changable-opt cb-column_chart-opt cb-line_chart-opt">Format</h6>
6161 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-column_chart-opt cb-line_chart-opt">
6162 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6163 <label for="ays-chart-option-vaxis-format" class="form-label">
6164 <?php echo esc_html(__( "Format", "chart-builder" )); ?>
6165 <a class="ays_help" data-bs-toggle="tooltip" data-bs-html="true" title="<?php
6166 echo esc_attr( sprintf(
6167 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6168 "<p>" . __('A format string for numeric axis labels. You can choose any of the following:', "chart-builder") . "</p><ul class='ays_tooltop_ul'><li>" .
6169 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6170 __('%1$sNone:%2$s Displays numbers with no formatting (e.g., 8000000)', "chart-builder") . "</li><li>" .
6171 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6172 __('%1$sDecimal:%2$s Displays numbers with thousands separators (e.g., 8,000,000)', "chart-builder") . "</li><li>" .
6173 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6174 __('%1$sScientific:%2$s Displays numbers in scientific notation (e.g., 8e6)', "chart-builder") . "</li><li>" .
6175 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6176 __('%1$sCurrency:%2$s Displays numbers in the local currency (e.g., $8,000,000.00)', "chart-builder") . "</li><li>" .
6177 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6178 __('%1$sPercent:%2$s Displays numbers as percentages (e.g., 800,000,000%%)', "chart-builder") . "</li><li>" .
6179 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6180 __('%1$sShort:%2$s Displays abbreviated numbers (e.g., 8M)', "chart-builder") . "</li><li>" .
6181 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6182 __('%1$sLong:%2$s Displays numbers as full words (e.g., 8 million)', "chart-builder") . "</li></ul>",
6183 '<em>', '</em>',
6184 '<em>', '</em>',
6185 '<em>', '</em>',
6186 '<em>', '</em>',
6187 '<em>', '</em>',
6188 '<em>', '</em>',
6189 '<em>', '</em>'
6190 ));
6191 ?>">
6192 <i class="ays_fa ays_fa_info_circle"></i>
6193 </a>
6194 </label>
6195 </div>
6196 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6197 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-vaxis-format" name="<?php echo esc_attr($html_name_prefix); ?>settings[vaxis_format]">
6198 <?php
6199 foreach ( $vaxis_format_options as $option_slug => $option ):
6200 $selected = ( $vaxis_format == $option_slug ) ? 'selected' : '';
6201 ?>
6202 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
6203 <?php
6204 endforeach;
6205 ?>
6206 </select>
6207 </div>
6208 </div> <!-- Vertical axis format -->
6209 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section option-vaxis-enable-divide-percent cb-changable-opt cb-column_chart-opt cb-line_chart-opt" style="<?php echo ($vaxis_format == 'percent') ? '' : 'display: none;'; ?>">
6210 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6211 <label for="ays-chart-option-vaxis-enable-divide-percent">
6212 <?php echo esc_html(__( "Remove Extra Zeros", "chart-builder" )); ?>
6213 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable this option to hide extra 00's from the axis text if the Format option is set to 'Percent'. Note: Make sure to save chart, to see changes.","chart-builder") ); ?>">
6214 <i class="ays_fa ays_fa_info_circle"></i>
6215 </a>
6216 </label>
6217 </div>
6218 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6219 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6220 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-vaxis-enable-divide-percent" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[vaxis_enable_divide_percent]" value="on" <?php echo esc_attr($vaxis_enable_divide_percent); ?> >
6221 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6222 </label>
6223 </div>
6224 </div> <!--Remove Extra Zeros-->
6225 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-column_chart-opt cb-line_chart-opt">
6226 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6227 <label for="ays-chart-option-vaxis-max-value" class="form-label">
6228 <?php echo esc_html(__( "Max value", "chart-builder" )); ?>
6229 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The maximum value of the axis.","chart-builder") ); ?>">
6230 <i class="ays_fa ays_fa_info_circle"></i>
6231 </a>
6232 </label>
6233 </div>
6234 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6235 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-vaxis-max-value" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[vaxis_max_value]" value="<?php echo esc_attr($vaxis_max_value) ?>">
6236 </div>
6237 </div> <!-- Vertical axis max value -->
6238 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-column_chart-opt cb-line_chart-opt">
6239 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6240 <label for="ays-chart-option-vaxis-min-value" class="form-label">
6241 <?php echo esc_html(__( "Min value", "chart-builder" )); ?>
6242 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The minimum value of the axis.","chart-builder") ); ?>">
6243 <i class="ays_fa ays_fa_info_circle"></i>
6244 </a>
6245 </label>
6246 </div>
6247 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6248 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-vaxis-min-value" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[vaxis_min_value]" value="<?php echo esc_attr($vaxis_min_value) ?>">
6249 </div>
6250 </div> <!-- Vertical axis min value -->
6251 </div>
6252 </div>
6253 <?php
6254 $content = ob_get_clean();
6255
6256 $title = __( 'Vertical Axis Settings', "chart-builder" );
6257
6258 $sources['vertical_axis'] = array(
6259 'content' => $content,
6260 'title' => $title
6261 );
6262
6263 return $sources;
6264 }
6265
6266 public function settings_contents_animation_settings( $sources, $args ) {
6267 $html_class_prefix = $args['html_class_prefix'];
6268 $html_name_prefix = $args['html_name_prefix'];
6269 $settings = $args['settings'];
6270
6271 $enable_animation = $settings['enable_animation'];
6272 $animation_duration = $settings['animation_duration'];
6273 $animation_startup = $settings['animation_startup'];
6274 $animation_easing_options = $settings['animation_easing_options'];
6275 $animation_easing = $settings['animation_easing'];
6276
6277 ob_start();
6278 ?>
6279 <div class="ays-accordion-data-main-wrap <?php echo esc_attr($html_class_prefix) ?>options-animation-settings-tab cb-changable-tab cb-bar_chart-tab cb-column_chart-tab cb-line_chart-tab">
6280 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
6281 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6282 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6283 <label for="ays-chart-option-enable-animation">
6284 <?php echo esc_html(__( "Enable chart animation", "chart-builder" )); ?>
6285 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable chart animation.","chart-builder") ); ?>">
6286 <i class="ays_fa ays_fa_info_circle"></i>
6287 </a>
6288 </label>
6289 </div>
6290 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6291 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6292 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch <?php echo esc_attr($html_class_prefix) ?>toggle-hidden-option" id="ays-chart-option-enable-animation" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[enable_animation]" value="on" <?php echo esc_attr($enable_animation); ?> >
6293 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6294 </label>
6295 </div>
6296 </div> <!-- Enable animation -->
6297 <div class="form-group row <?php echo esc_attr($html_class_prefix) ?>animation-options-section <?php echo esc_attr($html_class_prefix) ?>hidden-options-section <?php echo ($enable_animation == 'checked') ? '' : 'display_none'; ?>">
6298 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6299 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6300 <label for="ays-chart-option-animation-duration" class="form-label">
6301 <?php echo esc_html(__( "Duration", "chart-builder" )); ?>
6302 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The duration of the chart animation, in milliseconds.","chart-builder") ); ?>">
6303 <i class="ays_fa ays_fa_info_circle"></i>
6304 </a>
6305 </label>
6306 </div>
6307 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6308 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-animation-duration" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[animation_duration]" value="<?php echo esc_attr($animation_duration) ?>">
6309 </div>
6310 </div> <!-- Animation duration -->
6311 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6312 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6313 <label for="ays-chart-option-animation-startup">
6314 <?php echo esc_html(__( "Startup", "chart-builder" )); ?>
6315 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Determine if the chart will animate on the window load. If checked, the chart will start at the baseline and animate to its final state, else it will animate on size or data change.","chart-builder") ); ?>">
6316 <i class="ays_fa ays_fa_info_circle"></i>
6317 </a>
6318 </label>
6319 </div>
6320 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6321 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6322 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-animation-startup" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[animation_startup]" value="on" <?php echo esc_attr($animation_startup); ?> >
6323 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6324 </label>
6325 </div>
6326 </div> <!-- Animation startup -->
6327 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6328 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6329 <label for="ays-chart-option-animation-easing" class="form-label">
6330 <?php echo esc_html(__( "Easing", "chart-builder" )); ?>
6331 <a class="ays_help" data-bs-toggle="tooltip" data-bs-html="true" title="<?php
6332 echo esc_attr( sprintf(
6333 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6334 "<p>" . __('The easing function applied to the chart animation. The following options are available:', "chart-builder") . "</p><ul class='ays_tooltop_ul'><li>" .
6335 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6336 __('%1$sLinear:%2$s Constant speed.', "chart-builder") . "</li><li>" .
6337 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6338 __('%1$sEase in:%2$s Start slow and speed up.', "chart-builder") . "</li><li>" .
6339 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6340 __('%1$sEase out:%2$s Start fast and slow down.', "chart-builder") . "</li><li>" .
6341 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6342 __('%1$sEase in and out:%2$s Start slow, speed up, then slow down.', "chart-builder") . "</li></ul>",
6343 '<em>', '</em>',
6344 '<em>', '</em>',
6345 '<em>', '</em>',
6346 '<em>', '</em>'
6347 ));
6348 ?>">
6349 <i class="ays_fa ays_fa_info_circle"></i>
6350 </a>
6351 </label>
6352 </div>
6353 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6354 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-animation-easing" name="<?php echo esc_attr($html_name_prefix); ?>settings[animation_easing]">
6355 <?php
6356 foreach ( $animation_easing_options as $option_slug => $option ):
6357 $selected = ( $animation_easing == $option_slug ) ? 'selected' : '';
6358 ?>
6359 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
6360 <?php
6361 endforeach;
6362 ?>
6363 </select>
6364 </div>
6365 </div> <!-- Animation easing -->
6366 <div>
6367 </div>
6368 </div>
6369 <?php
6370 $content = ob_get_clean();
6371
6372 $title = __( 'Chart animation', "chart-builder" );
6373
6374 $sources['animation'] = array(
6375 'content' => $content,
6376 'title' => $title
6377 );
6378
6379 return $sources;
6380 }
6381
6382 public function settings_contents_live_chart_settings( $sources, $args ) {
6383 $html_class_prefix = $args['html_class_prefix'];
6384 $html_name_prefix = $args['html_name_prefix'];
6385
6386 ob_start();
6387 ?>
6388 <div class="ays-accordion-data-main-wrap <?php echo esc_attr($html_class_prefix) ?>options-live-chart-settings-tab">
6389 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
6390 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section ays-pro-features-v2-main-box">
6391 <div class="ays-pro-features-v2-small-buttons-box-middle ays-pro-features-v2-big-buttons-box">
6392 <a href="https://www.youtube.com/watch?v=lhTqZmFUNz4" target="_blank" class="ays-pro-features-v2-video-button">
6393 <div class="ays-pro-features-v2-video-icon" style="background-image: url('<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Video_24x24.svg');" data-img-src="<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Video_24x24_Hover.svg"></div>
6394 <div class="ays-pro-features-v2-video-text">
6395 <?php echo esc_html(__("Watch Video" , "chart-builder")); ?>
6396 </div>
6397 </a>
6398 <a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-pro-features-v2-upgrade-button">
6399 <div class="ays-pro-features-v2-upgrade-icon" style="background-image: url('<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Locked_24x24.svg');" data-img-src="<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Locked_24x24.svg"></div>
6400 <div class="ays-pro-features-v2-upgrade-text">
6401 <?php echo esc_html(__("Upgrade" , "chart-builder")); ?>
6402 </div>
6403 </a>
6404 </div>
6405 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6406 <label for="ays-chart-option-enable-live-chart">
6407 <?php echo esc_html(__( "Enable live chart", "chart-builder" )); ?>
6408 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("If you enable this option, the chart data will be dynamically updated on the front end. Note: If the option is enabled, the chart data will be periodically updated (e.g., once in 3 seconds) without refreshing the page..","chart-builder") ); ?>">
6409 <i class="ays_fa ays_fa_info_circle"></i>
6410 </a>
6411 </label>
6412 </div>
6413 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6414 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6415 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch <?php echo esc_attr($html_class_prefix) ?>toggle-hidden-option" id="ays-chart-option-enable-live-chart" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[enable_live_chart]" value="on">
6416 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6417 </label>
6418 </div>
6419 </div> <!-- Enable live chart -->
6420 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section ays-pro-features-v2-main-box">
6421 <div class="ays-pro-features-v2-small-buttons-box-middle ays-pro-features-v2-big-buttons-box">
6422 <a href="https://www.youtube.com/watch?v=lhTqZmFUNz4" target="_blank" class="ays-pro-features-v2-video-button">
6423 <div class="ays-pro-features-v2-video-icon" style="background-image: url('<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Video_24x24.svg');" data-img-src="<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Video_24x24_Hover.svg"></div>
6424 <div class="ays-pro-features-v2-video-text">
6425 <?php echo esc_html(__("Watch Video" , "chart-builder")); ?>
6426 </div>
6427 </a>
6428 <a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-pro-features-v2-upgrade-button">
6429 <div class="ays-pro-features-v2-upgrade-icon" style="background-image: url('<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Locked_24x24.svg');" data-img-src="<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Locked_24x24.svg"></div>
6430 <div class="ays-pro-features-v2-upgrade-text">
6431 <?php echo esc_html(__("Upgrade" , "chart-builder")); ?>
6432 </div>
6433 </a>
6434 </div>
6435 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6436 <label for="ays-chart-option-live-chart-interval" class="form-label">
6437 <?php echo esc_html(__( "Interval", "chart-builder" )); ?>
6438 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Specify the time intervals to update the chart on the front end (e.g., once in 3 seconds). The option works via milliseconds. Note: The minimum interval must be 3000 milliseconds.","chart-builder") ); ?>">
6439 <i class="ays_fa ays_fa_info_circle"></i>
6440 </a>
6441 </label>
6442 </div>
6443 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6444 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-live-chart-interval" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[live_chart_interval]" value="" min="3000">
6445 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">ms</div>
6446 </div>
6447 </div> <!-- Live chart interval -->
6448 </div>
6449 </div>
6450 <?php
6451 $content = ob_get_clean();
6452
6453 $title = __( 'Live Chart', "chart-builder" );
6454
6455 $sources['live_chart'] = array(
6456 'content' => $content,
6457 'title' => $title
6458 );
6459
6460 return $sources;
6461
6462 }
6463
6464 public function settings_contents_export_options( $sources, $args ){
6465 $html_class_prefix = $args['html_class_prefix'];
6466 $html_name_prefix = $args['html_name_prefix'];
6467 $settings = $args['settings'];
6468
6469 $enable_img = $settings['enable_img'];
6470
6471 ob_start();
6472 ?>
6473 <div class="ays-accordion-data-main-wrap <?php echo esc_attr($html_class_prefix) ?>options-export-tab cb-changable-tab cb-pie_chart-tab cb-donut_chart-tab cb-bar_chart-tab cb-column_chart-tab cb-line_chart-tab">
6474 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
6475 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section ays-pro-features-v2-main-box">
6476 <div class="ays-pro-features-v2-small-buttons-box-middle ays-pro-features-v2-big-buttons-box">
6477 <a href="https://www.youtube.com/watch?v=9UqLXG5NU_I" target="_blank" class="ays-pro-features-v2-video-button">
6478 <div class="ays-pro-features-v2-video-icon" style="background-image: url('<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Video_24x24.svg');" data-img-src="<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Video_24x24_Hover.svg"></div>
6479 <div class="ays-pro-features-v2-video-text">
6480 <?php echo esc_html(__("Watch Video" , "chart-builder")); ?>
6481 </div>
6482 </a>
6483 <a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-pro-features-v2-upgrade-button">
6484 <div class="ays-pro-features-v2-upgrade-icon" style="background-image: url('<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Locked_24x24.svg');" data-img-src="<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Locked_24x24.svg"></div>
6485 <div class="ays-pro-features-v2-upgrade-text">
6486 <?php echo esc_html(__("Upgrade" , "chart-builder")); ?>
6487 </div>
6488 </a>
6489 </div>
6490 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6491 <label for="ays-chart-option-export-print">
6492 <?php echo esc_html(__( "Print chart", "chart-builder" )); ?>
6493 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable the toggle and the users can print the chart data.","chart-builder") ); ?>">
6494 <i class="ays_fa ays_fa_info_circle"></i>
6495 </a>
6496 </label>
6497 </div>
6498 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6499 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6500 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-export-print" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[enable_print]" value="on">
6501 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6502 </label>
6503 </div>
6504 </div> <!-- Print option end -->
6505 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section ays-pro-features-v2-main-box">
6506 <div class="ays-pro-features-v2-small-buttons-box-middle ays-pro-features-v2-big-buttons-box">
6507 <a href="https://www.youtube.com/watch?v=9UqLXG5NU_I" target="_blank" class="ays-pro-features-v2-video-button">
6508 <div class="ays-pro-features-v2-video-icon" style="background-image: url('<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Video_24x24.svg');" data-img-src="<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Video_24x24_Hover.svg"></div>
6509 <div class="ays-pro-features-v2-video-text">
6510 <?php echo esc_html(__("Watch Video" , "chart-builder")); ?>
6511 </div>
6512 </a>
6513 <a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-pro-features-v2-upgrade-button">
6514 <div class="ays-pro-features-v2-upgrade-icon" style="background-image: url('<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Locked_24x24.svg');" data-img-src="<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Locked_24x24.svg"></div>
6515 <div class="ays-pro-features-v2-upgrade-text">
6516 <?php echo esc_html(__("Upgrade" , "chart-builder")); ?>
6517 </div>
6518 </a>
6519 </div>
6520 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6521 <label for="ays-chart-option-export-Excel">
6522 <?php echo esc_html(__( "Excel download", "chart-builder" )); ?>
6523 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable the toggle and the users can export the chart data in Excel file format.","chart-builder") ); ?>">
6524 <i class="ays_fa ays_fa_info_circle"></i>
6525 </a>
6526 </label>
6527 </div>
6528 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6529 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6530 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-export-excel" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[enable_excel]" value="on">
6531 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6532 </label>
6533 </div>
6534 </div> <!-- Excel option end -->
6535 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section ays-pro-features-v2-main-box">
6536 <div class="ays-pro-features-v2-small-buttons-box-middle ays-pro-features-v2-big-buttons-box">
6537 <a href="https://www.youtube.com/watch?v=9UqLXG5NU_I" target="_blank" class="ays-pro-features-v2-video-button">
6538 <div class="ays-pro-features-v2-video-icon" style="background-image: url('<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Video_24x24.svg');" data-img-src="<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Video_24x24_Hover.svg"></div>
6539 <div class="ays-pro-features-v2-video-text">
6540 <?php echo esc_html(__("Watch Video" , "chart-builder")); ?>
6541 </div>
6542 </a>
6543 <a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-pro-features-v2-upgrade-button">
6544 <div class="ays-pro-features-v2-upgrade-icon" style="background-image: url('<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Locked_24x24.svg');" data-img-src="<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Locked_24x24.svg"></div>
6545 <div class="ays-pro-features-v2-upgrade-text">
6546 <?php echo esc_html(__("Upgrade" , "chart-builder")); ?>
6547 </div>
6548 </a>
6549 </div>
6550 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6551 <label for="ays-chart-option-export-CSV">
6552 <?php echo esc_html(__( "CSV download", "chart-builder" )); ?>
6553 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable the toggle and the users can export the chart data in CSV file format.","chart-builder") ); ?>">
6554 <i class="ays_fa ays_fa_info_circle"></i>
6555 </a>
6556 </label>
6557 </div>
6558 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6559 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6560 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-export-csv" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[enable_csv]" value="on">
6561 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6562 </label>
6563 </div>
6564 </div> <!-- CSV option end -->
6565 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section ays-pro-features-v2-main-box">
6566 <div class="ays-pro-features-v2-small-buttons-box-middle ays-pro-features-v2-big-buttons-box">
6567 <a href="https://www.youtube.com/watch?v=9UqLXG5NU_I" target="_blank" class="ays-pro-features-v2-video-button">
6568 <div class="ays-pro-features-v2-video-icon" style="background-image: url('<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Video_24x24.svg');" data-img-src="<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Video_24x24_Hover.svg"></div>
6569 <div class="ays-pro-features-v2-video-text">
6570 <?php echo esc_html(__("Watch Video" , "chart-builder")); ?>
6571 </div>
6572 </a>
6573 <a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-pro-features-v2-upgrade-button">
6574 <div class="ays-pro-features-v2-upgrade-icon" style="background-image: url('<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Locked_24x24.svg');" data-img-src="<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Locked_24x24.svg"></div>
6575 <div class="ays-pro-features-v2-upgrade-text">
6576 <?php echo esc_html(__("Upgrade" , "chart-builder")); ?>
6577 </div>
6578 </a>
6579 </div>
6580 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6581 <label for="ays-chart-option-export-Copy">
6582 <?php echo esc_html(__( "Copy chart data", "chart-builder" )); ?>
6583 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable the toggle and the users can copy the chart data (CTRL+C, CTRL+V).","chart-builder") ); ?>">
6584 <i class="ays_fa ays_fa_info_circle"></i>
6585 </a>
6586 </label>
6587 </div>
6588 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6589 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6590 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-export-copy" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[enable_copy]" value="on">
6591 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6592 </label>
6593 </div>
6594 </div> <!-- Copy option end -->
6595 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt cb-donut_chart-opt cb-line_chart-opt cb-bar_chart-opt cb-column_chart-opt display_none">
6596 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6597 <label for="ays-chart-option-export-img">
6598 <?php echo esc_html(__( "Download chart image", "chart-builder" )); ?>
6599 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable the toggle and the users can download the chart as an image.","chart-builder") ); ?>">
6600 <i class="ays_fa ays_fa_info_circle"></i>
6601 </a>
6602 </label>
6603 </div>
6604 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6605 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6606 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-export-img" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[enable_img]" value="on" <?php echo esc_attr($enable_img)?> >
6607 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6608 </label>
6609 </div>
6610 </div> <!-- IMG option end -->
6611 </div>
6612 </div>
6613 <?php
6614
6615 $content = ob_get_clean();
6616
6617 $title = __( 'Frontend Actions', "chart-builder" );
6618
6619 $sources['export_options'] = array(
6620 'content' => $content,
6621 'title' => $title
6622 );
6623
6624 return $sources;
6625 }
6626
6627 /**
6628 * Chart page styles contents
6629 * @param $args
6630 */
6631 public function ays_chart_page_styles_contents( $args ){
6632 $chart_source_type = $args['chart_source_type'];
6633
6634 if ($chart_source_type === 'chart-js') {
6635 $sources_contents = apply_filters( 'ays_cb_chart_page_styles_contents_settings_chartjs', array(), $args );
6636 } else {
6637 $sources_contents = apply_filters( 'ays_cb_chart_page_styles_contents_settings', array(), $args );
6638 }
6639
6640 $sources = array();
6641 foreach ( $sources_contents as $key => $sources_content ) {
6642 $collapsed = $key == 'chart' ? 'false' : 'true';
6643
6644 $content = '<fieldset class="ays-accordion-options-container" data-collapsed="' . $collapsed . '">';
6645 if(isset($sources_content['title'])){
6646 $content .= '<legend class="ays-accordion-options-header">';
6647 $content .= '<svg class="ays-accordion-arrow '. ( $key == 'chart' ? 'ays-accordion-arrow-down' : 'ays-accordion-arrow-right' ) .'" version="1.2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" overflow="visible" preserveAspectRatio="none" viewBox="0 0 24 24" width="20" height="20">
6648 <g>
6649 <path xmlns:default="http://www.w3.org/2000/svg" d="M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z" style="fill: '. ( $key == 'chart' ? '#008cff' : '#c4c4c4' ) .';" vector-effect="non-scaling-stroke" />
6650 </g>
6651 </svg>';
6652
6653 $content .= '<span>'. esc_html($sources_content['title']) .'</span></legend>';
6654 }
6655
6656 $content .= '<div class="ays-accordion-options-content">';
6657 $content .= $sources_content['content'];
6658 $content .= '</div>';
6659
6660 $content .= '</fieldset>';
6661
6662 $sources[] = $content;
6663 }
6664 $content_for_escape = implode('' , $sources );
6665 echo html_entity_decode( esc_html($content_for_escape) );
6666 }
6667
6668 public function settings_contents_chart_styles_settings( $sources, $args ){
6669 $html_class_prefix = $args['html_class_prefix'];
6670 $html_name_prefix = $args['html_name_prefix'];
6671 $settings = $args['settings'];
6672
6673 $width = $settings['width'];
6674 $width_format = $settings['width_format'];
6675 $title_positions = $settings['title_positions'];
6676 $position = $settings['position'];
6677 $width_format_options = $settings['width_format_options'];
6678 $responsive_width = $settings['responsive_width'];
6679 $height = $settings['height'];
6680 $height_format = $settings['height_format'];
6681 $font_size = $settings['font_size'];
6682 $org_chart_font_size_options = $settings['org_chart_font_size_options'];
6683 $org_chart_font_size = $settings['org_chart_font_size'];
6684 $background_color = $settings['background_color'];
6685 $transparent_background = $settings['transparent_background'];
6686 $border_width = $settings['border_width'];
6687 $border_width_with_title = $settings['border_width_with_title'];
6688 $border_radius_with_title = $settings['border_radius_with_title'];
6689 $border_color_with_title = $settings['border_color_with_title'];
6690 $border_style_with_title = $settings['border_style_with_title'];
6691 $border_style = $settings['border_style'];
6692 $border_styles = $settings['border_styles'];
6693 $border_radius = $settings['border_radius'];
6694 $border_color = $settings['border_color'];
6695 $box_shadow = $settings['box_shadow'];
6696 $box_shadow_color = $settings['box_shadow_color'];
6697 $padding_outer = $settings['padding_outer'];
6698 ob_start();
6699 ?>
6700 <div class="ays-accordion-data-main-wrap">
6701 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
6702 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6703 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6704 <label for="ays-chart-option-width" class="form-label">
6705 <?php echo esc_html(__( "Width", "chart-builder" )); ?>
6706 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The width of the chart container, in percents.","chart-builder") ); ?>">
6707 <i class="ays_fa ays_fa_info_circle"></i>
6708 </a>
6709 </label>
6710 </div>
6711 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6712 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-width" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[width]" value="<?php echo esc_attr($width) ?>">
6713 <select class="<?php echo esc_attr($html_class_prefix) ?>option-width-format-change <?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-width-format" name="<?php echo esc_attr($html_name_prefix); ?>settings[width_format]">
6714 <?php
6715 foreach ( $width_format_options as $option_slug => $option ):
6716 $selected = ( $width_format == $option_slug ) ? 'selected' : '';
6717 ?>
6718 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
6719 <?php
6720 endforeach;
6721 ?>
6722 </select>
6723 </div>
6724 </div> <!-- Width -->
6725 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6726 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6727 <label for="ays-chart-option-responsive-width" class="form-label">
6728 <?php echo esc_html(__( "Responsive Width", "chart-builder" )); ?>
6729 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Tick this option to keep the chart's width fixed at 100%, no matter what is set for the Width option. This makes the chart more responsive.","chart-builder") ); ?>">
6730 <i class="ays_fa ays_fa_info_circle"></i>
6731 </a>
6732 </label>
6733 </div>
6734 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6735 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6736 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-responsive-width" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[responsive_width]" value="on" <?php echo esc_attr($responsive_width); ?> >
6737 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6738 </label>
6739 </div>
6740 </div> <!-- Responsive Width -->
6741 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6742 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6743 <label for="ays-chart-option-position">
6744 <?php echo esc_html(__( "Position", "chart-builder" )); ?>
6745 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The position of the chart. Note: The changes will be visible when the width option is not set to 100%","chart-builder") ); ?>">
6746 <i class="ays_fa ays_fa_info_circle"></i>
6747 </a>
6748 </label>
6749 </div>
6750 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6751 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-position" name="<?php echo esc_attr($html_name_prefix); ?>settings[position]">
6752 <?php
6753 foreach ( $title_positions as $option_slug => $option ):
6754 $selected = ( $position == $option_slug ) ? 'selected' : '';
6755 ?>
6756 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
6757 <?php
6758 endforeach;
6759 ?>
6760 </select>
6761 </div>
6762 </div> <!-- Position -->
6763 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6764 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6765 <label for="ays-chart-option-height" class="form-label">
6766 <?php echo esc_html(__( "Height", "chart-builder" )); ?>
6767 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The height of the chart container, in pixels.","chart-builder") ); ?>">
6768 <i class="ays_fa ays_fa_info_circle"></i>
6769 </a>
6770 </label>
6771 </div>
6772 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6773 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-height" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[height]" value="<?php echo esc_attr($height) ?>">
6774 <select class="<?php echo esc_attr($html_class_prefix) ?>option-width-format-change <?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-height-format" name="<?php echo esc_attr($html_name_prefix); ?>settings[height_format]">
6775 <?php
6776 foreach ( $width_format_options as $option_slug => $option ):
6777 $selected = ( $height_format == $option_slug ) ? 'selected' : '';
6778 ?>
6779 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
6780 <?php
6781 endforeach;
6782 ?>
6783 </select>
6784 </div>
6785 </div> <!-- Height -->
6786 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt cb-bar_chart-opt cb-column_chart-opt cb-line_chart-opt cb-donut_chart-opt">
6787 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6788 <label for="ays-chart-option-font-size" class="form-label">
6789 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
6790 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The font size of the chart text.","chart-builder") ); ?>">
6791 <i class="ays_fa ays_fa_info_circle"></i>
6792 </a>
6793 </label>
6794 </div>
6795 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6796 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-font-size" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[font_size]" value="<?php echo esc_attr($font_size) ?>">
6797 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
6798 </div>
6799 </div> <!-- Font size -->
6800 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-org_chart-opt display_none">
6801 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6802 <label for="ays-chart-option-org-chart-font-size" class="form-label">
6803 <?php echo esc_html(__( "Element size", 'chart-builder' )); ?>
6804 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The size of the chart element.","chart-builder") ); ?>">
6805 <i class="ays_fa ays_fa_info_circle"></i>
6806 </a>
6807 </label>
6808 </div>
6809 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6810 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-org-chart-font-size" name="<?php echo esc_attr($html_name_prefix); ?>settings[org_chart_font_size]">
6811 <?php
6812 foreach ( $org_chart_font_size_options as $option_slug => $option ):
6813 $selected = ( $org_chart_font_size == $option_slug ) ? 'selected' : '';
6814 ?>
6815 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_attr($option); ?></option>
6816 <?php
6817 endforeach;
6818 ?>
6819 </select>
6820 </div>
6821 </div> <!-- Font size for org type -->
6822 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt cb-bar_chart-opt cb-column_chart-opt cb-line_chart-opt cb-donut_chart-opt">
6823 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6824 <label for="ays-chart-option-background-color">
6825 <?php echo esc_html(__( "Background Color", "chart-builder" )); ?>
6826 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The background color of the chart container.","chart-builder") ); ?>">
6827 <i class="ays_fa ays_fa_info_circle"></i>
6828 </a>
6829 </label>
6830 </div>
6831 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6832 <input id="ays-chart-option-background-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[background_color]" value="<?php echo esc_attr($background_color) ?>">
6833 </div>
6834 </div> <!-- Background color -->
6835 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt cb-bar_chart-opt cb-column_chart-opt cb-line_chart-opt cb-donut_chart-opt">
6836 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6837 <label for="ays-chart-option-transparent-background" class="form-label">
6838 <?php echo esc_html(__( "Transparent background", "chart-builder" )); ?>
6839 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Tick this option to make the chart's background transparent. When enabled, both Background Color and Chart Area Background Color options will not work","chart-builder") ); ?>">
6840 <i class="ays_fa ays_fa_info_circle"></i>
6841 </a>
6842 </label>
6843 </div>
6844 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6845 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6846 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-transparent-background" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[transparent_background]" value="on" <?php echo esc_attr($transparent_background); ?> >
6847 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6848 </label>
6849 </div>
6850 </div> <!-- Transparent background -->
6851 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt cb-bar_chart-opt cb-column_chart-opt cb-line_chart-opt cb-donut_chart-opt">
6852 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6853 <label for="ays-chart-option-border-width">
6854 <?php echo esc_html(__( "Border Width", "chart-builder" )); ?>
6855 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The width of the chart container border.","chart-builder") ); ?>">
6856 <i class="ays_fa ays_fa_info_circle"></i>
6857 </a>
6858 </label>
6859 </div>
6860 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6861 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-border-width" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[border_width]" value="<?php echo esc_attr($border_width) ?>">
6862 </div>
6863 </div> <!-- Border Width -->
6864 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt cb-bar_chart-opt cb-column_chart-opt cb-line_chart-opt cb-donut_chart-opt">
6865 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6866 <label for="ays-chart-option-border-color">
6867 <?php echo esc_html(__( "Border Color", "chart-builder" )); ?>
6868 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The border color of the chart container.","chart-builder") ); ?>">
6869 <i class="ays_fa ays_fa_info_circle"></i>
6870 </a>
6871 </label>
6872 </div>
6873 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6874 <input id="ays-chart-option-border-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[border_color]" value="<?php echo esc_attr($border_color) ?>">
6875 </div>
6876 </div> <!-- Border color -->
6877 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt cb-bar_chart-opt cb-column_chart-opt cb-line_chart-opt cb-donut_chart-opt">
6878 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6879 <label for="ays-chart-option-border-radius">
6880 <?php echo esc_html(__( "Border Radius", "chart-builder" )); ?>
6881 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The border radius of the chart container.","chart-builder") ); ?>">
6882 <i class="ays_fa ays_fa_info_circle"></i>
6883 </a>
6884 </label>
6885 </div>
6886 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6887 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-border-radius" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[border_radius]" value="<?php echo esc_attr($border_radius) ?>">
6888 </div>
6889 </div> <!-- Border radius -->
6890 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt cb-bar_chart-opt cb-column_chart-opt cb-line_chart-opt cb-donut_chart-opt">
6891 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6892 <label for="ays-chart-option-border-style">
6893 <?php echo esc_html(__( "Border Style", "chart-builder" )); ?>
6894 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The style of the chart container border.","chart-builder") ); ?>">
6895 <i class="ays_fa ays_fa_info_circle"></i>
6896 </a>
6897 </label>
6898 </div>
6899 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6900 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-border-style" name="<?php echo esc_attr($html_name_prefix); ?>settings[border_style]">
6901 <?php
6902 foreach ( $border_styles as $option_slug => $option ):
6903 $selected = ( $border_style == $option_slug ) ? 'selected' : '';
6904 ?>
6905 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
6906 <?php
6907 endforeach;
6908 ?>
6909 </select>
6910 </div>
6911 </div> <!-- Border style -->
6912 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt cb-bar_chart-opt cb-column_chart-opt cb-line_chart-opt cb-donut_chart-opt">
6913 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6914 <label for="ays-chart-option-box-shadow" class="form-label">
6915 <?php echo esc_html(__( "Box Shadow", "chart-builder" )); ?>
6916 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Tick this option to add shadow to chart's container.","chart-builder") ); ?>">
6917 <i class="ays_fa ays_fa_info_circle"></i>
6918 </a>
6919 </label>
6920 </div>
6921 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6922 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6923 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-box-shadow" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[box_shadow]" value="on" <?php echo esc_attr($box_shadow); ?> >
6924 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6925 </label>
6926 </div>
6927 </div> <!-- box shadow -->
6928 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt cb-bar_chart-opt cb-column_chart-opt cb-line_chart-opt cb-donut_chart-opt">
6929 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6930 <label for="ays-chart-option-box-shadow-color" class="form-label">
6931 <?php echo esc_html(__( "Box Shadow Color", "chart-builder" )); ?>
6932 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Choose chart container's box shadow color.","chart-builder") ); ?>">
6933 <i class="ays_fa ays_fa_info_circle"></i>
6934 </a>
6935 </label>
6936 </div>
6937 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6938 <input id="ays-chart-option-box-shadow-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[box_shadow_color]" value="<?php echo esc_attr($box_shadow_color) ?>">
6939 </div>
6940 </div> <!-- box shadow color -->
6941 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt cb-bar_chart-opt cb-column_chart-opt cb-line_chart-opt cb-donut_chart-opt">
6942 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6943 <label for="ays-chart-option-border-width-with-title">
6944 <?php echo esc_html(__( "Border Width (including title)", "chart-builder" )); ?>
6945 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The width of the chart container border including chart title and description.","chart-builder") ); ?>">
6946 <i class="ays_fa ays_fa_info_circle"></i>
6947 </a>
6948 </label>
6949 </div>
6950 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6951 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-border-width-with-title" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[border_width_with_title]" value="<?php echo esc_attr($border_width_with_title) ?>">
6952 </div>
6953 </div> <!-- Border Width with title -->
6954 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt cb-bar_chart-opt cb-column_chart-opt cb-line_chart-opt cb-donut_chart-opt">
6955 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6956 <label for="ays-chart-option-border-radius-with-title">
6957 <?php echo esc_html(__( "Border radius (including title)", "chart-builder" )); ?>
6958 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The radius of the chart container border including chart title and description.","chart-builder") ); ?>">
6959 <i class="ays_fa ays_fa_info_circle"></i>
6960 </a>
6961 </label>
6962 </div>
6963 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6964 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-border-radius-with-title" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[border_radius_with_title]" value="<?php echo esc_attr($border_radius_with_title) ?>">
6965 </div>
6966 </div> <!-- Border radius with title -->
6967 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt cb-bar_chart-opt cb-column_chart-opt cb-line_chart-opt cb-donut_chart-opt">
6968 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6969 <label for="ays-chart-option-border-color-with-title">
6970 <?php echo esc_html(__( "Border Color (including title)", "chart-builder" )); ?>
6971 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the chart container border including chart title and description.","chart-builder") ); ?>">
6972 <i class="ays_fa ays_fa_info_circle"></i>
6973 </a>
6974 </label>
6975 </div>
6976 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6977 <input id="ays-chart-option-border-color-with-title" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[border_color_with_title]" value="<?php echo esc_attr($border_color_with_title) ?>">
6978 </div>
6979 </div> <!-- Border color with title -->
6980 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt cb-bar_chart-opt cb-column_chart-opt cb-line_chart-opt cb-donut_chart-opt">
6981 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6982 <label for="ays-chart-option-border-style-with-title">
6983 <?php echo esc_html(__( "Border Style (including title)", "chart-builder" )); ?>
6984 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The style of the chart container border including chart title and description.","chart-builder") ); ?>">
6985 <i class="ays_fa ays_fa_info_circle"></i>
6986 </a>
6987 </label>
6988 </div>
6989 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6990 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-border-style-with-title" name="<?php echo esc_attr($html_name_prefix); ?>settings[border_style_with_title]">
6991 <?php
6992 foreach ( $border_styles as $option_slug => $option ):
6993 $selected = ( $border_style_with_title == $option_slug ) ? 'selected' : '';
6994 ?>
6995 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
6996 <?php
6997 endforeach;
6998 ?>
6999 </select>
7000 </div>
7001 </div> <!-- Border style with title -->
7002 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt cb-bar_chart-opt cb-column_chart-opt cb-line_chart-opt cb-donut_chart-opt">
7003 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7004 <label for="ays-chart-option-padding-outer">
7005 <?php echo esc_html(__( "Padding", "chart-builder" )); ?>
7006 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The padding of the chart container.","chart-builder") ); ?>">
7007 <i class="ays_fa ays_fa_info_circle"></i>
7008 </a>
7009 </label>
7010 </div>
7011 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7012 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-padding-outer" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[padding_outer]" value="<?php echo esc_attr($padding_outer) ?>">
7013 </div>
7014 </div> <!-- Padding outer -->
7015 </div>
7016 </div>
7017 <?php
7018 $content = ob_get_clean();
7019
7020 $title = __( 'Chart', "chart-builder" );
7021
7022 $sources['chart'] = array(
7023 'content' => $content,
7024 'title' => $title
7025 );
7026
7027 return $sources;
7028 }
7029
7030 public function settings_contents_chart_styles_settings_chartjs( $sources, $args ){
7031 $html_class_prefix = $args['html_class_prefix'];
7032 $html_name_prefix = $args['html_name_prefix'];
7033 $settings = $args['settings'];
7034 $border_width_with_title = $settings['border_width_with_title'];
7035 $border_radius_with_title = $settings['border_radius_with_title'];
7036 $border_color_with_title = $settings['border_color_with_title'];
7037 $border_style_with_title = $settings['border_style_with_title'];
7038 $width = $settings['width'];
7039 $width_format = $settings['width_format'];
7040 $height = $settings['height'];
7041 $height_format = $settings['height_format'];
7042 $width_format_options = $settings['width_format_options'];
7043 $border_width = $settings['border_width'];
7044 $border_radius = $settings['border_radius'];
7045 $border_color = $settings['border_color'];
7046 $background_color_chart = $settings['background_color_chart'];
7047 $border_style = $settings['border_style'];
7048 $border_styles = $settings['border_styles'];
7049 $box_shadow = $settings['box_shadow'];
7050 $box_shadow_color = $settings['box_shadow_color'];
7051 $padding_outer = $settings['padding_outer'];
7052 ob_start();
7053 ?>
7054 <div class="ays-accordion-data-main-wrap">
7055 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
7056 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7057 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7058 <label for="ays-chart-option-width" class="form-label">
7059 <?php echo esc_html(__( "Width", "chart-builder" )); ?>
7060 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The width of the chart container, in percents.","chart-builder") ); ?>">
7061 <i class="ays_fa ays_fa_info_circle"></i>
7062 </a>
7063 </label>
7064 </div>
7065 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7066 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-width" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[width]" value="<?php echo esc_attr($width) ?>">
7067 <select class="<?php echo esc_attr($html_class_prefix) ?>option-width-format-change <?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-width-format" name="<?php echo esc_attr($html_name_prefix); ?>settings[width_format]">
7068 <?php
7069 foreach ( $width_format_options as $option_slug => $option ):
7070 $selected = ( $width_format == $option_slug ) ? 'selected' : '';
7071 ?>
7072 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7073 <?php
7074 endforeach;
7075 ?>
7076 </select>
7077 </div>
7078 </div> <!-- Width -->
7079 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7080 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7081 <label for="ays-chart-option-height" class="form-label">
7082 <?php echo esc_html(__( "Height", "chart-builder" )); ?>
7083 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The height of the chart container, in pixels.","chart-builder") ); ?>">
7084 <i class="ays_fa ays_fa_info_circle"></i>
7085 </a>
7086 </label>
7087 </div>
7088 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7089 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-height" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[height]" value="<?php echo esc_attr($height) ?>">
7090 <select class="<?php echo esc_attr($html_class_prefix) ?>option-width-format-change <?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-height-format" name="<?php echo esc_attr($html_name_prefix); ?>settings[height_format]">
7091 <?php
7092 foreach ( $width_format_options as $option_slug => $option ):
7093 $selected = ( $height_format == $option_slug ) ? 'selected' : '';
7094 ?>
7095 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7096 <?php
7097 endforeach;
7098 ?>
7099 </select>
7100 </div>
7101 </div> <!-- Height -->
7102 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7103 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7104 <label for="ays-chart-option-border-width">
7105 <?php echo esc_html(__( "Border Width", "chart-builder" )); ?>
7106 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The width of the chart container border.","chart-builder") ); ?>">
7107 <i class="ays_fa ays_fa_info_circle"></i>
7108 </a>
7109 </label>
7110 </div>
7111 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7112 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-border-width" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[border_width]" value="<?php echo esc_attr($border_width) ?>">
7113 </div>
7114 </div> <!-- Border Width -->
7115 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7116 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7117 <label for="ays-chart-option-border-radius">
7118 <?php echo esc_html(__( "Border Radius", "chart-builder" )); ?>
7119 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The radius of the chart container border.","chart-builder") ); ?>">
7120 <i class="ays_fa ays_fa_info_circle"></i>
7121 </a>
7122 </label>
7123 </div>
7124 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7125 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-border-radius" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[border_radius]" value="<?php echo esc_attr($border_radius) ?>">
7126 </div>
7127 </div> <!-- Border Radius -->
7128 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7129 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7130 <label for="ays-chart-option-border-color">
7131 <?php echo esc_html(__( "Border Color", "chart-builder" )); ?>
7132 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The border color of the chart container.","chart-builder") ); ?>">
7133 <i class="ays_fa ays_fa_info_circle"></i>
7134 </a>
7135 </label>
7136 </div>
7137 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7138 <input id="ays-chart-option-border-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[border_color]" value="<?php echo esc_attr($border_color) ?>">
7139 </div>
7140 </div> <!-- Border color -->
7141 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7142 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7143 <label for="ays-chart-option-border-style">
7144 <?php echo esc_html(__( "Border Style", "chart-builder" )); ?>
7145 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The style of the chart container border.","chart-builder") ); ?>">
7146 <i class="ays_fa ays_fa_info_circle"></i>
7147 </a>
7148 </label>
7149 </div>
7150 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7151 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-border-style" name="<?php echo esc_attr($html_name_prefix); ?>settings[border_style]">
7152 <?php
7153 foreach ( $border_styles as $option_slug => $option ):
7154 $selected = ( $border_style == $option_slug ) ? 'selected' : '';
7155 ?>
7156 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7157 <?php
7158 endforeach;
7159 ?>
7160 </select>
7161 </div>
7162 </div> <!-- Border style -->
7163 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7164 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7165 <label for="ays-chart-option-backgorund-color">
7166 <?php echo esc_html(__( "Background Color", "chart-builder" )); ?>
7167 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("With the help of this feature, you will be able to add background color for the Chart JS.","chart-builder") ); ?>">
7168 <i class="ays_fa ays_fa_info_circle"></i>
7169 </a>
7170 </label>
7171 </div>
7172 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7173 <input id="ays-chart-option-background-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[background_color_chart]" value="<?php echo esc_attr($background_color_chart) ?>">
7174 </div>
7175 </div><!-- Background color -->
7176
7177 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7178 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7179 <label for="ays-chart-option-box-shadow" class="form-label">
7180 <?php echo esc_html(__( "Box Shadow", "chart-builder" )); ?>
7181 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Tick this option to add shadow to chart's container.","chart-builder") ); ?>">
7182 <i class="ays_fa ays_fa_info_circle"></i>
7183 </a>
7184 </label>
7185 </div>
7186 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7187 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
7188 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-box-shadow" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[box_shadow]" value="on" <?php echo esc_attr($box_shadow); ?> >
7189 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
7190 </label>
7191 </div>
7192 </div> <!-- box shadow -->
7193 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7194 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7195 <label for="ays-chart-option-box-shadow-color" class="form-label">
7196 <?php echo esc_html(__( "Box Shadow Color", "chart-builder" )); ?>
7197 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Choose chart container's box shadow color.","chart-builder") ); ?>">
7198 <i class="ays_fa ays_fa_info_circle"></i>
7199 </a>
7200 </label>
7201 </div>
7202 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7203 <input id="ays-chart-option-box-shadow-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[box_shadow_color]" value="<?php echo esc_attr($box_shadow_color) ?>">
7204 </div>
7205 </div> <!-- box shadow color -->
7206 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7207 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7208 <label for="ays-chart-option-border-width-with-title">
7209 <?php echo esc_html(__( "Border Width (including title)", "chart-builder" )); ?>
7210 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The width of the chart container border including chart title and description.","chart-builder") ); ?>">
7211 <i class="ays_fa ays_fa_info_circle"></i>
7212 </a>
7213 </label>
7214 </div>
7215 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7216 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-border-width-with-title" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[border_width_with_title]" value="<?php echo esc_attr($border_width_with_title) ?>">
7217 </div>
7218 </div> <!-- Border Width with title -->
7219 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7220 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7221 <label for="ays-chart-option-border-radius-with-title">
7222 <?php echo esc_html(__( "Border Radius (including title)", "chart-builder" )); ?>
7223 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The radius of the chart container border including chart title and description.","chart-builder") ); ?>">
7224 <i class="ays_fa ays_fa_info_circle"></i>
7225 </a>
7226 </label>
7227 </div>
7228 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7229 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-border-radius-with-title" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[border_radius_with_title]" value="<?php echo esc_attr($border_radius_with_title) ?>">
7230 </div>
7231 </div> <!-- Border radius with title -->
7232 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt cb-bar_chart-opt cb-column_chart-opt cb-line_chart-opt cb-donut_chart-opt">
7233 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7234 <label for="ays-chart-option-border-color-with-title">
7235 <?php echo esc_html(__( "Border Color (including title)", "chart-builder" )); ?>
7236 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the chart container border including chart title and description.","chart-builder") ); ?>">
7237 <i class="ays_fa ays_fa_info_circle"></i>
7238 </a>
7239 </label>
7240 </div>
7241 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7242 <input id="ays-chart-option-border-color-with-title" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[border_color_with_title]" value="<?php echo esc_attr($border_color_with_title) ?>">
7243 </div>
7244 </div> <!-- Border colro with title -->
7245 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt cb-bar_chart-opt cb-column_chart-opt cb-line_chart-opt cb-donut_chart-opt">
7246 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7247 <label for="ays-chart-option-border-style-with-title">
7248 <?php echo esc_html(__( "Border Style (including title)", "chart-builder" )); ?>
7249 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The style of the chart container border including chart title and description.","chart-builder") ); ?>">
7250 <i class="ays_fa ays_fa_info_circle"></i>
7251 </a>
7252 </label>
7253 </div>
7254 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7255 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-border-style-with-title" name="<?php echo esc_attr($html_name_prefix); ?>settings[border_style_with_title]">
7256 <?php
7257 foreach ( $border_styles as $option_slug => $option ):
7258 $selected = ( $border_style_with_title == $option_slug ) ? 'selected' : '';
7259 ?>
7260 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7261 <?php
7262 endforeach;
7263 ?>
7264 </select>
7265 </div>
7266 </div> <!-- Border style with title -->
7267 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt cb-bar_chart-opt cb-column_chart-opt cb-line_chart-opt cb-donut_chart-opt">
7268 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7269 <label for="ays-chart-option-padding-outer">
7270 <?php echo esc_html(__( "Padding", "chart-builder" )); ?>
7271 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The padding of the chart container.","chart-builder") ); ?>">
7272 <i class="ays_fa ays_fa_info_circle"></i>
7273 </a>
7274 </label>
7275 </div>
7276 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7277 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-padding-outer" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[padding_outer]" value="<?php echo esc_attr($padding_outer) ?>">
7278 </div>
7279 </div> <!-- Padding outer -->
7280 </div>
7281 </div>
7282 <?php
7283 $content = ob_get_clean();
7284
7285 $title = __( 'Chart', "chart-builder" );
7286
7287 $sources['chart'] = array(
7288 'content' => $content,
7289 'title' => $title
7290 );
7291
7292 return $sources;
7293 }
7294
7295 public function settings_contents_chart_area_styles_settings( $sources, $args ){
7296 $html_class_prefix = $args['html_class_prefix'];
7297 $html_name_prefix = $args['html_name_prefix'];
7298 $settings = $args['settings'];
7299
7300 $chart_background_color = $settings['chart_background_color'];
7301 $chart_border_color = $settings['chart_border_color'];
7302 $chart_left_margin = $settings['chart_left_margin'];
7303 $chart_right_margin = $settings['chart_right_margin'];
7304 $chart_top_margin = $settings['chart_top_margin'];
7305 $chart_bottom_margin = $settings['chart_bottom_margin'];
7306 $chart_border_width = $settings['chart_border_width'];
7307 ob_start();
7308 ?>
7309 <div class="ays-accordion-data-main-wrap">
7310 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap cb-changable-tab cb-pie_chart-tab cb-bar_chart-tab cb-column_chart-tab cb-line_chart-tab cb-donut_chart-tab">
7311 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-bar_chart-opt cb-column_chart-opt cb-line_chart-opt">
7312 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7313 <label for="ays-chart-option-chart-background-color">
7314 <?php echo esc_html(__( "Background Color", "chart-builder" )); ?>
7315 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The background color of the chart area.","chart-builder") ); ?>">
7316 <i class="ays_fa ays_fa_info_circle"></i>
7317 </a>
7318 </label>
7319 </div>
7320 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7321 <input id="ays-chart-option-chart-background-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[chart_background_color]" value="<?php echo esc_attr($chart_background_color) ?>">
7322 </div>
7323 </div> <!-- Chart Area background color -->
7324 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-bar_chart-opt cb-column_chart-opt cb-line_chart-opt">
7325 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7326 <label for="ays-chart-option-chart-border-width">
7327 <?php echo esc_html(__( "Border Width", "chart-builder" )); ?>
7328 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The border width of the chart area.","chart-builder") ); ?>">
7329 <i class="ays_fa ays_fa_info_circle"></i>
7330 </a>
7331 </label>
7332 </div>
7333 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7334 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-chart-border-width" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[chart_border_width]" value="<?php echo esc_attr($chart_border_width) ?>">
7335 </div>
7336 </div> <!-- Chart Area Border Width -->
7337 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-bar_chart-opt cb-column_chart-opt cb-line_chart-opt">
7338 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7339 <label for="ays-chart-option-chart-border-color">
7340 <?php echo esc_html(__( "Border Color", "chart-builder" )); ?>
7341 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The border color of the chart area.","chart-builder") ); ?>">
7342 <i class="ays_fa ays_fa_info_circle"></i>
7343 </a>
7344 </label>
7345 </div>
7346 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7347 <input id="ays-chart-option-chart-border-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[chart_border_color]" value="<?php echo esc_attr($chart_border_color) ?>">
7348 </div>
7349 </div> <!-- Chart Area border color -->
7350 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7351 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7352 <label for="ays-chart-option-chart-left-margin">
7353 <?php echo esc_html(__( "Left Margin", "chart-builder" )); ?>
7354 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Specify the chart's distance from the left border. Leave blank for auto-positioning.","chart-builder") ); ?>">
7355 <i class="ays_fa ays_fa_info_circle"></i>
7356 </a>
7357 </label>
7358 </div>
7359 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7360 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-chart-left-margin" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[chart_left_margin]" value="<?php echo esc_attr($chart_left_margin) ?>">
7361 </div>
7362 </div> <!-- Chart Area Left Margin -->
7363 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7364 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7365 <label for="ays-chart-option-chart-right-margin">
7366 <?php echo esc_html(__( "Right Margin", "chart-builder" )); ?>
7367 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Specify the chart's distance from the right border. Leave blank for auto-positioning.","chart-builder") ); ?>">
7368 <i class="ays_fa ays_fa_info_circle"></i>
7369 </a>
7370 </label>
7371 </div>
7372 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7373 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-chart-right-margin" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[chart_right_margin]" value="<?php echo esc_attr($chart_right_margin) ?>">
7374 </div>
7375 </div> <!-- Chart Area Right Margin -->
7376 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7377 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7378 <label for="ays-chart-option-chart-top-margin">
7379 <?php echo esc_html(__( "Top Margin", "chart-builder" )); ?>
7380 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Specify the chart's distance from the top border. Leave blank for auto-positioning.","chart-builder") ); ?>">
7381 <i class="ays_fa ays_fa_info_circle"></i>
7382 </a>
7383 </label>
7384 </div>
7385 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7386 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-chart-top-margin" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[chart_top_margin]" value="<?php echo esc_attr($chart_top_margin) ?>">
7387 </div>
7388 </div> <!-- Chart Area Top Margin -->
7389 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7390 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7391 <label for="ays-chart-option-chart-bottom-margin">
7392 <?php echo esc_html(__( "Bottom Margin", "chart-builder" )); ?>
7393 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Specify the chart's distance from the bottom border. Leave blank for auto-positioning.","chart-builder") ); ?>">
7394 <i class="ays_fa ays_fa_info_circle"></i>
7395 </a>
7396 </label>
7397 </div>
7398 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7399 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-chart-bottom-margin" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[chart_bottom_margin]" value="<?php echo esc_attr($chart_bottom_margin) ?>">
7400 </div>
7401 </div> <!-- Chart Area Bottom Margin -->
7402 </div>
7403 </div>
7404 <?php
7405 $content = ob_get_clean();
7406
7407 $title = __( 'Chart Area', "chart-builder" );
7408
7409 $sources['chart_area'] = array(
7410 'content' => $content,
7411 'title' => $title
7412 );
7413
7414 return $sources;
7415 }
7416
7417 public function settings_contents_title_styles_settings( $sources, $args ){
7418 $html_class_prefix = $args['html_class_prefix'];
7419 $html_name_prefix = $args['html_name_prefix'];
7420 $settings = $args['settings'];
7421
7422 $title_color = $settings['title_color'];
7423 $title_shadow_color = $settings['title_shadow_color'];
7424 $title_font_size = $settings['title_font_size'];
7425 $title_gap = $settings['title_gap'];
7426 $title_gap_description = $settings['title_gap_description'];
7427 $title_positions = $settings['title_positions'];
7428 $title_position = $settings['title_position'];
7429 $title_bold = $settings['title_bold'];
7430 $title_text_shadow = $settings['title_text_shadow'];
7431 $title_italic = $settings['title_italic'];
7432 $text_transforms = $settings['text_transforms'];
7433 $text_decorations = $settings['text_decorations'];
7434 $title_text_transform = $settings['title_text_transform'];
7435 $title_text_decoration = $settings['title_text_decoration'];
7436 $title_letter_spacing = $settings['title_letter_spacing'];
7437 ob_start();
7438 ?>
7439 <div class="ays-accordion-data-main-wrap">
7440 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
7441 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7442 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7443 <label for="ays-chart-option-title-color">
7444 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
7445 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the chart title.","chart-builder") ); ?>">
7446 <i class="ays_fa ays_fa_info_circle"></i>
7447 </a>
7448 </label>
7449 </div>
7450 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7451 <input id="ays-chart-option-title-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[title_color]" value="<?php echo esc_attr($title_color) ?>">
7452 </div>
7453 </div> <!-- Chart title color -->
7454 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7455 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7456 <label for="ays-chart-option-title-font-size" class="form-label">
7457 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
7458 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The font size of the chart title.","chart-builder") ); ?>">
7459 <i class="ays_fa ays_fa_info_circle"></i>
7460 </a>
7461 </label>
7462 </div>
7463 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7464 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-title-font-size" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[title_font_size]" value="<?php echo esc_attr($title_font_size) ?>">
7465 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
7466 </div>
7467 </div> <!-- Chart title font size -->
7468 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7469 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7470 <label for="ays-chart-option-title-bold" class="form-label">
7471 <?php echo esc_html(__( "Bold text", "chart-builder" )); ?>
7472 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Tick this option to make the chart title text bold.","chart-builder") ); ?>">
7473 <i class="ays_fa ays_fa_info_circle"></i>
7474 </a>
7475 </label>
7476 </div>
7477 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7478 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
7479 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-title-bold" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[title_bold]" value="on" <?php echo esc_attr($title_bold); ?> >
7480 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
7481 </label>
7482 </div>
7483 </div> <!-- Title bold -->
7484 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7485 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7486 <label for="ays-chart-option-title-italic" class="form-label">
7487 <?php echo esc_html(__( "Italic text", "chart-builder" )); ?>
7488 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Tick this option to make the chart title text italic.","chart-builder") ); ?>">
7489 <i class="ays_fa ays_fa_info_circle"></i>
7490 </a>
7491 </label>
7492 </div>
7493 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7494 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
7495 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-title-italic" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[title_italic]" value="on" <?php echo esc_attr($title_italic); ?> >
7496 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
7497 </label>
7498 </div>
7499 </div> <!-- Title italic -->
7500 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7501 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7502 <label for="ays-chart-option-title-position">
7503 <?php echo esc_html(__( "Position", "chart-builder" )); ?>
7504 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The position of the chart title.","chart-builder") ); ?>">
7505 <i class="ays_fa ays_fa_info_circle"></i>
7506 </a>
7507 </label>
7508 </div>
7509 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7510 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-title-position" name="<?php echo esc_attr($html_name_prefix); ?>settings[title_position]">
7511 <?php
7512 foreach ( $title_positions as $option_slug => $option ):
7513 $selected = ( $title_position == $option_slug ) ? 'selected' : '';
7514 ?>
7515 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7516 <?php
7517 endforeach;
7518 ?>
7519 </select>
7520 </div>
7521 </div> <!-- Title position -->
7522 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7523 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7524 <label for="ays-chart-option-title-gap" class="form-label">
7525 <?php echo esc_html(__( "Gap", "chart-builder" )); ?>
7526 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Specify the space between the chart title and the chart container.","chart-builder") ); ?>">
7527 <i class="ays_fa ays_fa_info_circle"></i>
7528 </a>
7529 </label>
7530 </div>
7531 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7532 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-title-gap" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[title_gap]" value="<?php echo esc_attr($title_gap) ?>">
7533 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
7534 </div>
7535 </div> <!-- Chart title gap -->
7536 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7537 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7538 <label for="ays-chart-option-title-gap-description" class="form-label">
7539 <?php echo esc_html(__( "Distance from description", "chart-builder" )); ?>
7540 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Specify the space between the chart title and the chart description.","chart-builder") ); ?>">
7541 <i class="ays_fa ays_fa_info_circle"></i>
7542 </a>
7543 </label>
7544 </div>
7545 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7546 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-title-gap-description" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[title_gap_description]" value="<?php echo esc_attr($title_gap_description) ?>">
7547 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
7548 </div>
7549 </div> <!-- Chart title gap -->
7550 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7551 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7552 <label for="ays-chart-option-title-text-transform">
7553 <?php echo esc_html(__( "Text-transform", "chart-builder" )); ?>
7554 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Specify how to capitalize the text of the chart title.","chart-builder") ); ?>">
7555 <i class="ays_fa ays_fa_info_circle"></i>
7556 </a>
7557 </label>
7558 </div>
7559 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7560 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-title-text-transform" name="<?php echo esc_attr($html_name_prefix); ?>settings[title_text_transform]">
7561 <?php
7562 foreach ( $text_transforms as $option_slug => $option ):
7563 $selected = ( $title_text_transform == $option_slug ) ? 'selected' : '';
7564 ?>
7565 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7566 <?php
7567 endforeach;
7568 ?>
7569 </select>
7570 </div>
7571 </div> <!-- Title text transform -->
7572 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7573 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7574 <label for="ays-chart-option-title-letter-spacing" class="form-label">
7575 <?php echo esc_html(__( "Letter spacing", "chart-builder" )); ?>
7576 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Specify the space between the chart title letters.","chart-builder") ); ?>">
7577 <i class="ays_fa ays_fa_info_circle"></i>
7578 </a>
7579 </label>
7580 </div>
7581 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7582 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-title-letter-spacing" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[title_letter_spacing]" value="<?php echo esc_attr($title_letter_spacing) ?>">
7583 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
7584 </div>
7585 </div> <!-- Chart title letter spacing -->
7586 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7587 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7588 <label for="ays-chart-option-title-text-decoration">
7589 <?php echo esc_html(__( "Text-decoration", "chart-builder" )); ?>
7590 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Specify how to capitalize the text of the chart title.","chart-builder") ); ?>">
7591 <i class="ays_fa ays_fa_info_circle"></i>
7592 </a>
7593 </label>
7594 </div>
7595 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7596 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-title-text-decoration" name="<?php echo esc_attr($html_name_prefix); ?>settings[title_text_decoration]">
7597 <?php
7598 foreach ( $text_decorations as $option_slug => $option ):
7599 $selected = ( $title_text_decoration == $option_slug ) ? 'selected' : '';
7600 ?>
7601 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7602 <?php
7603 endforeach;
7604 ?>
7605 </select>
7606 </div>
7607 </div> <!-- Title text decoration -->
7608 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7609 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7610 <label for="ays-chart-option-title-text-shadow" class="form-label">
7611 <?php echo esc_html(__( "Text shadow", "chart-builder" )); ?>
7612 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Tick this option to add a text shadow to chart title.","chart-builder") ); ?>">
7613 <i class="ays_fa ays_fa_info_circle"></i>
7614 </a>
7615 </label>
7616 </div>
7617 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7618 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
7619 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-title-text-shadow" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[title_text_shadow]" value="on" <?php echo esc_attr($title_text_shadow); ?> >
7620 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
7621 </label>
7622 </div>
7623 </div> <!-- Title bold -->
7624 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7625 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7626 <label for="ays-chart-option-title-shadow-color">
7627 <?php echo esc_html(__( "Text Shadow Color", "chart-builder" )); ?>
7628 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The text shadow color of the chart title.","chart-builder") ); ?>">
7629 <i class="ays_fa ays_fa_info_circle"></i>
7630 </a>
7631 </label>
7632 </div>
7633 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7634 <input id="ays-chart-option-title-shadow-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[title_shadow_color]" value="<?php echo esc_attr($title_shadow_color) ?>">
7635 </div>
7636 </div> <!-- Chart title color -->
7637 </div>
7638 </div>
7639 <?php
7640 $content = ob_get_clean();
7641
7642 $title = __( 'Title', "chart-builder" );
7643
7644 $sources['title'] = array(
7645 'content' => $content,
7646 'title' => $title
7647 );
7648
7649 return $sources;
7650 }
7651
7652 public function settings_contents_title_styles_settings_chartjs( $sources, $args ){
7653 $html_class_prefix = $args['html_class_prefix'];
7654 $html_name_prefix = $args['html_name_prefix'];
7655 $settings = $args['settings'];
7656
7657 $title_color = $settings['title_color'];
7658 $title_shadow_color = $settings['title_shadow_color'];
7659 $title_font_size = $settings['title_font_size'];
7660 $title_gap = $settings['title_gap'];
7661 $title_gap_description = $settings['title_gap_description'];
7662 $title_positions = $settings['title_positions'];
7663 $title_position = $settings['title_position'];
7664 $title_bold = $settings['title_bold'];
7665 $title_text_shadow = $settings['title_text_shadow'];
7666 $title_italic = $settings['title_italic'];
7667 $text_transforms = $settings['text_transforms'];
7668 $text_decorations = $settings['text_decorations'];
7669 $title_text_transform = $settings['title_text_transform'];
7670 $title_text_decoration = $settings['title_text_decoration'];
7671 $title_letter_spacing = $settings['title_letter_spacing'];
7672 ob_start();
7673 ?>
7674 <div class="ays-accordion-data-main-wrap">
7675 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
7676 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7677 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7678 <label for="ays-chart-option-title-color">
7679 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
7680 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the chart title.","chart-builder") ); ?>">
7681 <i class="ays_fa ays_fa_info_circle"></i>
7682 </a>
7683 </label>
7684 </div>
7685 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7686 <input id="ays-chart-option-title-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[title_color]" value="<?php echo esc_attr($title_color) ?>">
7687 </div>
7688 </div> <!-- Chart title color -->
7689 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7690 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7691 <label for="ays-chart-option-title-font-size" class="form-label">
7692 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
7693 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The font size of the chart title.","chart-builder") ); ?>">
7694 <i class="ays_fa ays_fa_info_circle"></i>
7695 </a>
7696 </label>
7697 </div>
7698 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7699 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-title-font-size" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[title_font_size]" value="<?php echo esc_attr($title_font_size) ?>">
7700 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
7701 </div>
7702 </div> <!-- Chart title font size -->
7703 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7704 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7705 <label for="ays-chart-option-title-bold" class="form-label">
7706 <?php echo esc_html(__( "Bold text", "chart-builder" )); ?>
7707 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Tick this option to make the chart title text bold.","chart-builder") ); ?>">
7708 <i class="ays_fa ays_fa_info_circle"></i>
7709 </a>
7710 </label>
7711 </div>
7712 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7713 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
7714 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-title-bold" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[title_bold]" value="on" <?php echo esc_attr($title_bold); ?> >
7715 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
7716 </label>
7717 </div>
7718 </div> <!-- Title bold -->
7719 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7720 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7721 <label for="ays-chart-option-title-italic" class="form-label">
7722 <?php echo esc_html(__( "Italic text", "chart-builder" )); ?>
7723 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Tick this option to make the chart title text italic.","chart-builder") ); ?>">
7724 <i class="ays_fa ays_fa_info_circle"></i>
7725 </a>
7726 </label>
7727 </div>
7728 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7729 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
7730 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-title-italic" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[title_italic]" value="on" <?php echo esc_attr($title_italic); ?> >
7731 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
7732 </label>
7733 </div>
7734 </div> <!-- Title italic -->
7735 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7736 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7737 <label for="ays-chart-option-title-position">
7738 <?php echo esc_html(__( "Position", "chart-builder" )); ?>
7739 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The position of the chart title.","chart-builder") ); ?>">
7740 <i class="ays_fa ays_fa_info_circle"></i>
7741 </a>
7742 </label>
7743 </div>
7744 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7745 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-title-position" name="<?php echo esc_attr($html_name_prefix); ?>settings[title_position]">
7746 <?php
7747 foreach ( $title_positions as $option_slug => $option ):
7748 $selected = ( $title_position == $option_slug ) ? 'selected' : '';
7749 ?>
7750 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7751 <?php
7752 endforeach;
7753 ?>
7754 </select>
7755 </div>
7756 </div> <!-- Title position -->
7757 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7758 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7759 <label for="ays-chart-option-title-gap" class="form-label">
7760 <?php echo esc_html(__( "Gap", "chart-builder" )); ?>
7761 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Specify the space between the chart title and the chart container.","chart-builder") ); ?>">
7762 <i class="ays_fa ays_fa_info_circle"></i>
7763 </a>
7764 </label>
7765 </div>
7766 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7767 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-title-gap" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[title_gap]" value="<?php echo esc_attr($title_gap) ?>">
7768 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
7769 </div>
7770 </div> <!-- Chart title gap -->
7771 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7772 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7773 <label for="ays-chart-option-title-gap-description" class="form-label">
7774 <?php echo esc_html(__( "Distance from description", "chart-builder" )); ?>
7775 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Specify the space between the chart title and the chart description.","chart-builder") ); ?>">
7776 <i class="ays_fa ays_fa_info_circle"></i>
7777 </a>
7778 </label>
7779 </div>
7780 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7781 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-title-gap-description" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[title_gap_description]" value="<?php echo esc_attr($title_gap_description) ?>">
7782 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
7783 </div>
7784 </div> <!-- Chart title gap -->
7785 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7786 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7787 <label for="ays-chart-option-title-text-transform">
7788 <?php echo esc_html(__( "Text-transform", "chart-builder" )); ?>
7789 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Specify how to capitalize the text of the chart title.","chart-builder") ); ?>">
7790 <i class="ays_fa ays_fa_info_circle"></i>
7791 </a>
7792 </label>
7793 </div>
7794 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7795 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-title-text-transform" name="<?php echo esc_attr($html_name_prefix); ?>settings[title_text_transform]">
7796 <?php
7797 foreach ( $text_transforms as $option_slug => $option ):
7798 $selected = ( $title_text_transform == $option_slug ) ? 'selected' : '';
7799 ?>
7800 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7801 <?php
7802 endforeach;
7803 ?>
7804 </select>
7805 </div>
7806 </div> <!-- Title text transform -->
7807 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7808 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7809 <label for="ays-chart-option-title-letter-spacing" class="form-label">
7810 <?php echo esc_html(__( "Letter spacing", "chart-builder" )); ?>
7811 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Specify the space between the chart title letters.","chart-builder") ); ?>">
7812 <i class="ays_fa ays_fa_info_circle"></i>
7813 </a>
7814 </label>
7815 </div>
7816 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7817 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-title-letter-spacing" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[title_letter_spacing]" value="<?php echo esc_attr($title_letter_spacing) ?>">
7818 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
7819 </div>
7820 </div> <!-- Chart title letter spacing -->
7821 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7822 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7823 <label for="ays-chart-option-title-text-decoration">
7824 <?php echo esc_html(__( "Text-decoration", "chart-builder" )); ?>
7825 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Specify how to capitalize the text of the chart title.","chart-builder") ); ?>">
7826 <i class="ays_fa ays_fa_info_circle"></i>
7827 </a>
7828 </label>
7829 </div>
7830 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7831 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-title-text-decoration" name="<?php echo esc_attr($html_name_prefix); ?>settings[title_text_decoration]">
7832 <?php
7833 foreach ( $text_decorations as $option_slug => $option ):
7834 $selected = ( $title_text_decoration == $option_slug ) ? 'selected' : '';
7835 ?>
7836 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7837 <?php
7838 endforeach;
7839 ?>
7840 </select>
7841 </div>
7842 </div> <!-- Title text decoration -->
7843 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7844 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7845 <label for="ays-chart-option-title-text-shadow" class="form-label">
7846 <?php echo esc_html(__( "Text shadow", "chart-builder" )); ?>
7847 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Tick this option to add a text shadow to chart title.","chart-builder") ); ?>">
7848 <i class="ays_fa ays_fa_info_circle"></i>
7849 </a>
7850 </label>
7851 </div>
7852 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7853 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
7854 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-title-text-shadow" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[title_text_shadow]" value="on" <?php echo esc_attr($title_text_shadow); ?> >
7855 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
7856 </label>
7857 </div>
7858 </div> <!-- Title bold -->
7859 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7860 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7861 <label for="ays-chart-option-title-shadow-color">
7862 <?php echo esc_html(__( "Text Shadow Color", "chart-builder" )); ?>
7863 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The text shadow color of the chart title.","chart-builder") ); ?>">
7864 <i class="ays_fa ays_fa_info_circle"></i>
7865 </a>
7866 </label>
7867 </div>
7868 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7869 <input id="ays-chart-option-title-shadow-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[title_shadow_color]" value="<?php echo esc_attr($title_shadow_color) ?>">
7870 </div>
7871 </div> <!-- Chart title color -->
7872 </div>
7873 </div>
7874 <?php
7875 $content = ob_get_clean();
7876
7877 $title = __( 'Title', "chart-builder" );
7878
7879 $sources['title'] = array(
7880 'content' => $content,
7881 'title' => $title
7882 );
7883
7884 return $sources;
7885 }
7886
7887 public function settings_contents_description_styles_settings( $sources, $args ){
7888 $html_class_prefix = $args['html_class_prefix'];
7889 $html_name_prefix = $args['html_name_prefix'];
7890 $settings = $args['settings'];
7891
7892 $description_color = $settings['description_color'];
7893 $description_font_size = $settings['description_font_size'];
7894 $title_positions = $settings['title_positions'];
7895 $description_position = $settings['description_position'];
7896 $description_bold = $settings['description_bold'];
7897 $description_text_shadow = $settings['description_text_shadow'];
7898 $description_shadow_color = $settings['description_shadow_color'];
7899 $description_italic = $settings['description_italic'];
7900 $text_transforms = $settings['text_transforms'];
7901 $text_decorations = $settings['text_decorations'];
7902 $description_text_transform = $settings['description_text_transform'];
7903 $description_text_decoration = $settings['description_text_decoration'];
7904 $description_letter_spacing = $settings['description_letter_spacing'];
7905
7906 ob_start();
7907 ?>
7908 <div class="ays-accordion-data-main-wrap">
7909 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
7910 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7911 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7912 <label for="ays-chart-option-description-color">
7913 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
7914 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the chart description.","chart-builder") ); ?>">
7915 <i class="ays_fa ays_fa_info_circle"></i>
7916 </a>
7917 </label>
7918 </div>
7919 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7920 <input id="ays-chart-option-description-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[description_color]" value="<?php echo esc_attr($description_color) ?>">
7921 </div>
7922 </div> <!-- Chart description color -->
7923 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7924 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7925 <label for="ays-chart-option-description-font-size" class="form-label">
7926 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
7927 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The font size of the chart description.","chart-builder") ); ?>">
7928 <i class="ays_fa ays_fa_info_circle"></i>
7929 </a>
7930 </label>
7931 </div>
7932 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7933 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-description-font-size" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[description_font_size]" value="<?php echo esc_attr($description_font_size) ?>">
7934 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
7935 </div>
7936 </div> <!-- Chart description font size -->
7937 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7938 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7939 <label for="ays-chart-option-description-bold" class="form-label">
7940 <?php echo esc_html(__( "Bold text", "chart-builder" )); ?>
7941 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Tick this option to make the chart description text bold.","chart-builder") ); ?>">
7942 <i class="ays_fa ays_fa_info_circle"></i>
7943 </a>
7944 </label>
7945 </div>
7946 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7947 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
7948 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-description-bold" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[description_bold]" value="on" <?php echo esc_attr($description_bold); ?> >
7949 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
7950 </label>
7951 </div>
7952 </div> <!-- Description bold -->
7953 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7954 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7955 <label for="ays-chart-option-description-italic" class="form-label">
7956 <?php echo esc_html(__( "Italic text", "chart-builder" )); ?>
7957 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Tick this option to make the chart description text italic.","chart-builder") ); ?>">
7958 <i class="ays_fa ays_fa_info_circle"></i>
7959 </a>
7960 </label>
7961 </div>
7962 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7963 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
7964 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-description-italic" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[description_italic]" value="on" <?php echo esc_attr($description_italic); ?> >
7965 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
7966 </label>
7967 </div>
7968 </div> <!-- Description italic -->
7969 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7970 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7971 <label for="ays-chart-option-description-position">
7972 <?php echo esc_html(__( "Position", "chart-builder" )); ?>
7973 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The position of the chart description.","chart-builder") ); ?>">
7974 <i class="ays_fa ays_fa_info_circle"></i>
7975 </a>
7976 </label>
7977 </div>
7978 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7979 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-description-position" name="<?php echo esc_attr($html_name_prefix); ?>settings[description_position]">
7980 <?php
7981 foreach ( $title_positions as $option_slug => $option ):
7982 $selected = ( $description_position == $option_slug ) ? 'selected' : '';
7983 ?>
7984 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7985 <?php
7986 endforeach;
7987 ?>
7988 </select>
7989 </div>
7990 </div> <!-- Description position -->
7991 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7992 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7993 <label for="ays-chart-option-description-text-transform">
7994 <?php echo esc_html(__( "Text-transform", "chart-builder" )); ?>
7995 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Specify how to capitalize the text of the chart description.","chart-builder") ); ?>">
7996 <i class="ays_fa ays_fa_info_circle"></i>
7997 </a>
7998 </label>
7999 </div>
8000 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8001 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-description-text-transform" name="<?php echo esc_attr($html_name_prefix); ?>settings[description_text_transform]">
8002 <?php
8003 foreach ( $text_transforms as $option_slug => $option ):
8004 $selected = ( $description_text_transform == $option_slug ) ? 'selected' : '';
8005 ?>
8006 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8007 <?php
8008 endforeach;
8009 ?>
8010 </select>
8011 </div>
8012 </div> <!-- description text transform -->
8013 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8014 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8015 <label for="ays-chart-option-description-letter-spacing" class="form-label">
8016 <?php echo esc_html(__( "Letter spacing", "chart-builder" )); ?>
8017 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Specify the space between the chart description letters.","chart-builder") ); ?>">
8018 <i class="ays_fa ays_fa_info_circle"></i>
8019 </a>
8020 </label>
8021 </div>
8022 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8023 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-description-letter-spacing" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[description_letter_spacing]" value="<?php echo esc_attr($description_letter_spacing) ?>">
8024 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
8025 </div>
8026 </div> <!-- Chart description letter spacing -->
8027 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8028 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8029 <label for="ays-chart-option-description-text-decoration">
8030 <?php echo esc_html(__( "Text-decoration", "chart-builder" )); ?>
8031 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Specify how to capitalize the text of the chart description.","chart-builder") ); ?>">
8032 <i class="ays_fa ays_fa_info_circle"></i>
8033 </a>
8034 </label>
8035 </div>
8036 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8037 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-description-text-decoration" name="<?php echo esc_attr($html_name_prefix); ?>settings[description_text_decoration]">
8038 <?php
8039 foreach ( $text_decorations as $option_slug => $option ):
8040 $selected = ( $description_text_decoration == $option_slug ) ? 'selected' : '';
8041 ?>
8042 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8043 <?php
8044 endforeach;
8045 ?>
8046 </select>
8047 </div>
8048 </div> <!-- description text decoration -->
8049 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8050 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8051 <label for="ays-chart-option-description-text-shadow" class="form-label">
8052 <?php echo esc_html(__( "Text shadow", "chart-builder" )); ?>
8053 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Tick this option to add a text shadow to chart description.","chart-builder") ); ?>">
8054 <i class="ays_fa ays_fa_info_circle"></i>
8055 </a>
8056 </label>
8057 </div>
8058 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8059 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
8060 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-description-text-shadow" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[description_text_shadow]" value="on" <?php echo esc_attr($description_text_shadow); ?> >
8061 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
8062 </label>
8063 </div>
8064 </div> <!-- description bold -->
8065 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8066 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8067 <label for="ays-chart-option-description-shadow-color">
8068 <?php echo esc_html(__( "Text Shadow Color", "chart-builder" )); ?>
8069 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The text shadow color of the chart description.","chart-builder") ); ?>">
8070 <i class="ays_fa ays_fa_info_circle"></i>
8071 </a>
8072 </label>
8073 </div>
8074 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8075 <input id="ays-chart-option-description-shadow-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[description_shadow_color]" value="<?php echo esc_attr($description_shadow_color) ?>">
8076 </div>
8077 </div> <!-- Chart title color -->
8078 </div>
8079 </div>
8080 <?php
8081 $content = ob_get_clean();
8082
8083 $title = __( 'Description', "chart-builder" );
8084
8085 $sources['description'] = array(
8086 'content' => $content,
8087 'title' => $title
8088 );
8089
8090 return $sources;
8091 }
8092
8093 public function settings_contents_description_styles_settings_chartjs( $sources, $args ){
8094 $html_class_prefix = $args['html_class_prefix'];
8095 $html_name_prefix = $args['html_name_prefix'];
8096 $settings = $args['settings'];
8097
8098 $description_color = $settings['description_color'];
8099 $description_font_size = $settings['description_font_size'];
8100 $title_positions = $settings['title_positions'];
8101 $description_position = $settings['description_position'];
8102 $description_bold = $settings['description_bold'];
8103 $description_text_shadow = $settings['description_text_shadow'];
8104 $description_shadow_color = $settings['description_shadow_color'];
8105 $description_italic = $settings['description_italic'];
8106 $text_transforms = $settings['text_transforms'];
8107 $text_decorations = $settings['text_decorations'];
8108 $description_text_transform = $settings['description_text_transform'];
8109 $description_text_decoration = $settings['description_text_decoration'];
8110 $description_letter_spacing = $settings['description_letter_spacing'];
8111
8112 ob_start();
8113 ?>
8114 <div class="ays-accordion-data-main-wrap">
8115 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
8116 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8117 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8118 <label for="ays-chart-option-description-color">
8119 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
8120 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the chart description.","chart-builder") ); ?>">
8121 <i class="ays_fa ays_fa_info_circle"></i>
8122 </a>
8123 </label>
8124 </div>
8125 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8126 <input id="ays-chart-option-description-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[description_color]" value="<?php echo esc_attr($description_color) ?>">
8127 </div>
8128 </div> <!-- Chart description color -->
8129 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8130 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8131 <label for="ays-chart-option-description-font-size" class="form-label">
8132 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
8133 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The font size of the chart description.","chart-builder") ); ?>">
8134 <i class="ays_fa ays_fa_info_circle"></i>
8135 </a>
8136 </label>
8137 </div>
8138 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8139 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-description-font-size" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[description_font_size]" value="<?php echo esc_attr($description_font_size) ?>">
8140 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
8141 </div>
8142 </div> <!-- Chart description font size -->
8143 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8144 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8145 <label for="ays-chart-option-description-bold" class="form-label">
8146 <?php echo esc_html(__( "Bold text", "chart-builder" )); ?>
8147 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Tick this option to make the chart description text bold.","chart-builder") ); ?>">
8148 <i class="ays_fa ays_fa_info_circle"></i>
8149 </a>
8150 </label>
8151 </div>
8152 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8153 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
8154 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-description-bold" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[description_bold]" value="on" <?php echo esc_attr($description_bold); ?> >
8155 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
8156 </label>
8157 </div>
8158 </div> <!-- Description bold -->
8159 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8160 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8161 <label for="ays-chart-option-description-italic" class="form-label">
8162 <?php echo esc_html(__( "Italic text", "chart-builder" )); ?>
8163 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Tick this option to make the chart description text italic.","chart-builder") ); ?>">
8164 <i class="ays_fa ays_fa_info_circle"></i>
8165 </a>
8166 </label>
8167 </div>
8168 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8169 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
8170 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-description-italic" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[description_italic]" value="on" <?php echo esc_attr($description_italic); ?> >
8171 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
8172 </label>
8173 </div>
8174 </div> <!-- Description italic -->
8175 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8176 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8177 <label for="ays-chart-option-description-position">
8178 <?php echo esc_html(__( "Position", "chart-builder" )); ?>
8179 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The position of the chart description.","chart-builder") ); ?>">
8180 <i class="ays_fa ays_fa_info_circle"></i>
8181 </a>
8182 </label>
8183 </div>
8184 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8185 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-description-position" name="<?php echo esc_attr($html_name_prefix); ?>settings[description_position]">
8186 <?php
8187 foreach ( $title_positions as $option_slug => $option ):
8188 $selected = ( $description_position == $option_slug ) ? 'selected' : '';
8189 ?>
8190 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8191 <?php
8192 endforeach;
8193 ?>
8194 </select>
8195 </div>
8196 </div> <!-- Description position -->
8197 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8198 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8199 <label for="ays-chart-option-description-text-transform">
8200 <?php echo esc_html(__( "Text-transform", "chart-builder" )); ?>
8201 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Specify how to capitalize the text of the chart description.","chart-builder") ); ?>">
8202 <i class="ays_fa ays_fa_info_circle"></i>
8203 </a>
8204 </label>
8205 </div>
8206 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8207 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-description-text-transform" name="<?php echo esc_attr($html_name_prefix); ?>settings[description_text_transform]">
8208 <?php
8209 foreach ( $text_transforms as $option_slug => $option ):
8210 $selected = ( $description_text_transform == $option_slug ) ? 'selected' : '';
8211 ?>
8212 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8213 <?php
8214 endforeach;
8215 ?>
8216 </select>
8217 </div>
8218 </div> <!-- description text transform -->
8219 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8220 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8221 <label for="ays-chart-option-description-letter-spacing" class="form-label">
8222 <?php echo esc_html(__( "Letter spacing", "chart-builder" )); ?>
8223 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Specify the space between the chart description letters.","chart-builder") ); ?>">
8224 <i class="ays_fa ays_fa_info_circle"></i>
8225 </a>
8226 </label>
8227 </div>
8228 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8229 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-description-letter-spacing" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[description_letter_spacing]" value="<?php echo esc_attr($description_letter_spacing) ?>">
8230 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
8231 </div>
8232 </div> <!-- Chart description letter spacing -->
8233 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8234 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8235 <label for="ays-chart-option-description-text-decoration">
8236 <?php echo esc_html(__( "Text-decoration", "chart-builder" )); ?>
8237 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Specify how to capitalize the text of the chart description.","chart-builder") ); ?>">
8238 <i class="ays_fa ays_fa_info_circle"></i>
8239 </a>
8240 </label>
8241 </div>
8242 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8243 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-description-text-decoration" name="<?php echo esc_attr($html_name_prefix); ?>settings[description_text_decoration]">
8244 <?php
8245 foreach ( $text_decorations as $option_slug => $option ):
8246 $selected = ( $description_text_decoration == $option_slug ) ? 'selected' : '';
8247 ?>
8248 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8249 <?php
8250 endforeach;
8251 ?>
8252 </select>
8253 </div>
8254 </div> <!-- description text decoration -->
8255 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8256 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8257 <label for="ays-chart-option-description-text-shadow" class="form-label">
8258 <?php echo esc_html(__( "Text shadow", "chart-builder" )); ?>
8259 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Tick this option to add a text shadow to chart description.","chart-builder") ); ?>">
8260 <i class="ays_fa ays_fa_info_circle"></i>
8261 </a>
8262 </label>
8263 </div>
8264 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8265 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
8266 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-description-text-shadow" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[description_text_shadow]" value="on" <?php echo esc_attr($description_text_shadow); ?> >
8267 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
8268 </label>
8269 </div>
8270 </div> <!-- description bold -->
8271 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8272 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8273 <label for="ays-chart-option-description-shadow-color">
8274 <?php echo esc_html(__( "Text Shadow Color", "chart-builder" )); ?>
8275 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The text shadow color of the chart description.","chart-builder") ); ?>">
8276 <i class="ays_fa ays_fa_info_circle"></i>
8277 </a>
8278 </label>
8279 </div>
8280 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8281 <input id="ays-chart-option-description-shadow-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[description_shadow_color]" value="<?php echo esc_attr($description_shadow_color) ?>">
8282 </div>
8283 </div> <!-- Chart title color -->
8284 </div>
8285 </div>
8286 <?php
8287 $content = ob_get_clean();
8288
8289 $title = __( 'Description', "chart-builder" );
8290
8291 $sources['description'] = array(
8292 'content' => $content,
8293 'title' => $title
8294 );
8295
8296 return $sources;
8297 }
8298
8299 /**
8300 * Chart page settings contents
8301 * @param $args
8302 */
8303 public function ays_chart_page_advanced_settings_contents( $args ){
8304 $chart_source_type = $args['chart_source_type'];
8305
8306 if ($chart_source_type === 'chart-js') {
8307 if ($args['source_chart_type'] !== 'pie_chart') {return;}
8308 $sources_contents = apply_filters( 'ays_cb_chart_page_advanced_settings_contents_settings_chartjs', array(), $args );
8309 } else {
8310 $sources_contents = apply_filters( 'ays_cb_chart_page_advanced_settings_contents_settings', array(), $args );
8311 }
8312
8313 $sources = array();
8314 foreach ( $sources_contents as $key => $sources_content ) {
8315 $collapsed = $key == 'advanced_settings' ? 'false' : 'true';
8316
8317 $content = '<fieldset class="ays-accordion-options-container" data-collapsed="' . $collapsed . '">';
8318 if(isset($sources_content['title'])){
8319 $content .= '<legend class="ays-accordion-options-header">';
8320 $content .= '<svg class="ays-accordion-arrow '. ( $key == 'advanced_settings' ? 'ays-accordion-arrow-down' : 'ays-accordion-arrow-right' ) .'" version="1.2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" overflow="visible" preserveAspectRatio="none" viewBox="0 0 24 24" width="20" height="20">
8321 <g>
8322 <path xmlns:default="http://www.w3.org/2000/svg" d="M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z" style="fill: '. ( $key == 'advanced_settings' ? '#008cff' : '#c4c4c4' ) .';" vector-effect="non-scaling-stroke" />
8323 </g>
8324 </svg>';
8325
8326 $content .= '<span>'. esc_html($sources_content['title']) .'</span></legend>';
8327 }
8328
8329 $content .= '<div class="ays-accordion-options-content">';
8330 $content .= $sources_content['content'];
8331 $content .= '</div>';
8332
8333 $content .= '</fieldset>';
8334
8335 $sources[] = $content;
8336 }
8337 $content_for_escape = implode('' , $sources );
8338 echo html_entity_decode( esc_html($content_for_escape) );
8339 }
8340
8341 public function settings_contents_advanced_settings( $sources, $args ){
8342 $html_class_prefix = $args['html_class_prefix'];
8343 $html_name_prefix = $args['html_name_prefix'];
8344 $settings = $args['settings'];
8345 $tab_title = $args['tab_name'];
8346
8347 $rotation_degree = $settings['rotation_degree'];
8348 $reverse_categories = $settings['reverse_categories'];
8349 $slice_border_color = $settings['slice_border_color'];
8350 $slice_texts = $settings['slice_texts'];
8351 $slice_text = $settings['slice_text'];
8352 $tooltip_text_options = $settings['tooltip_text_options'];
8353 $tooltip_text = $settings['tooltip_text'];
8354 $is_stacked = $settings['is_stacked'];
8355 $focus_target_options = $settings['focus_target_options'];
8356 $focus_target = $settings['focus_target'];
8357 $multiple_data_format_options = $settings['multiple_data_format_options'];
8358 $multiple_data_format = $settings['multiple_data_format'];
8359 $opacity = $settings['opacity'];
8360 $group_width = $settings['group_width'];
8361 $group_width_format = $settings['group_width_format'];
8362 $group_width_format_options = $settings['group_width_format_options'];
8363 $line_width = $settings['line_width'];
8364 $data_grouping_limit = $settings['data_grouping_limit'];
8365 $data_grouping_label = $settings['data_grouping_label'];
8366 $data_grouping_color = $settings['data_grouping_color'];
8367 $multiple_selection = $settings['multiple_selection'];
8368 $point_shape_options = $settings['point_shape_options'];
8369 $point_shape = $settings['point_shape'];
8370 $crosshair_trigger_options = $settings['crosshair_trigger_options'];
8371 $crosshair_trigger = $settings['crosshair_trigger'];
8372 $crosshair_orientation_options = $settings['crosshair_orientation_options'];
8373 $crosshair_orientation = $settings['crosshair_orientation'];
8374 $crosshair_opacity = $settings['crosshair_opacity'];
8375 $dash_style = $settings['dash_style'];
8376 $point_size = $settings['point_size'];
8377 $donut_hole_size = $settings['donut_hole_size'];
8378 $orientation = $settings['orientation'];
8379 $fill_nulls = $settings['fill_nulls'];
8380 $allow_collapse = $settings['allow_collapse'];
8381 $org_classname = $settings['org_classname'];
8382 $org_node_background_color = $settings['org_node_background_color'];
8383 $org_node_padding = $settings['org_node_padding'];
8384 $org_node_border_radius = $settings['org_node_border_radius'];
8385 $org_node_border_width = $settings['org_node_border_width'];
8386 $org_node_border_color = $settings['org_node_border_color'];
8387 $org_node_text_color = $settings['org_node_text_color'];
8388 $org_node_text_font_size = $settings['org_node_text_font_size'];
8389 $org_node_description_font_color = $settings['org_node_description_font_color'];
8390 $org_node_description_font_size = $settings['org_node_description_font_size'];
8391 $org_selected_classname = $settings['org_selected_classname'];
8392 $org_selected_node_background_color = $settings['org_selected_node_background_color'];
8393 $org_selected_node_text_color = $settings['org_selected_node_text_color'];
8394
8395 ob_start();
8396 ?>
8397 <div class="ays-accordion-data-main-wrap">
8398 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap <?php echo esc_attr($html_class_prefix) ?>advanced-settings-data-wrap">
8399 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt cb-donut_chart-opt display_none">
8400 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8401 <label for="ays-chart-option-rotation-degree" class="form-label">
8402 <?php echo esc_html(__( "Degree of chart rotation", "chart-builder" )); ?>
8403 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The angle, in degrees, to rotate the chart by. The default of 0 will orient the leftmost edge of the first slice directly up.","chart-builder") ); ?>">
8404 <i class="ays_fa ays_fa_info_circle"></i>
8405 </a>
8406 </label>
8407 </div>
8408 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8409 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-rotation-degree" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[rotation_degree]" value="<?php echo esc_attr($rotation_degree) ?>">
8410 </div>
8411 </div> <!-- Rotation degree -->
8412 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt cb-donut_chart-opt display_none">
8413 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8414 <label for="ays-chart-option-reverse-categories">
8415 <?php echo esc_html(__( "Reverse Categories", "chart-builder" )); ?>
8416 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("If this option is enabled, the pie slices will be drawn counterclockwise.","chart-builder") ); ?>">
8417 <i class="ays_fa ays_fa_info_circle"></i>
8418 </a>
8419 </label>
8420 </div>
8421 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8422 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
8423 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-reverse-categories" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[reverse_categories]" value="on" <?php echo esc_attr($reverse_categories); ?> >
8424 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
8425 </label>
8426 </div>
8427 </div> <!-- Reverse Categories -->
8428 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt cb-donut_chart-opt display_none">
8429 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8430 <label for="ays-chart-option-slice-border-color">
8431 <?php echo esc_html(__( "Slice Border Color", "chart-builder" )); ?>
8432 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the slice borders.","chart-builder") ); ?>">
8433 <i class="ays_fa ays_fa_info_circle"></i>
8434 </a>
8435 </label>
8436 </div>
8437 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8438 <input id="ays-chart-option-slice-border-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[slice_border_color]" value="<?php echo esc_attr($slice_border_color) ?>">
8439 </div>
8440 </div> <!-- Slice border color -->
8441 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt cb-donut_chart-opt display_none">
8442 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8443 <label for="ays-chart-option-slice-text">
8444 <?php echo esc_html(__( "Slice text", "chart-builder" )); ?>
8445 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Choose the content of the text to be displayed on the pie slice.","chart-builder") ); ?>">
8446 <i class="ays_fa ays_fa_info_circle"></i>
8447 </a>
8448 </label>
8449 </div>
8450 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8451 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-slice-text" name="<?php echo esc_attr($html_name_prefix); ?>settings[slice_text]">
8452 <?php
8453 foreach ( $slice_texts as $option_slug => $option ):
8454 $selected = ( $slice_text == $option_slug ) ? 'selected' : '';
8455 ?>
8456 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8457 <?php
8458 endforeach;
8459 ?>
8460 </select>
8461 </div>
8462 </div> <!-- Slice text -->
8463 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt cb-donut_chart-opt display_none">
8464 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8465 <label for="ays-chart-option-tooltip-text">
8466 <?php echo esc_html(__( "Slice tooltip text", "chart-builder" )); ?>
8467 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Choose how to display the text in the chart tooltip.","chart-builder") ); ?>">
8468 <i class="ays_fa ays_fa_info_circle"></i>
8469 </a>
8470 </label>
8471 </div>
8472 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8473 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-tooltip-text" name="<?php echo esc_attr($html_name_prefix); ?>settings[tooltip_text]">
8474 <?php
8475 foreach ( $tooltip_text_options as $option_slug => $option ):
8476 $selected = ( $tooltip_text == $option_slug ) ? 'selected' : '';
8477 ?>
8478 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8479 <?php
8480 endforeach;
8481 ?>
8482 </select>
8483 </div>
8484 </div> <!-- Slice tooltip Text -->
8485 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt cb-donut_chart-opt display_none">
8486 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8487 <label for="ays-chart-option-data-grouping-limit" class="form-label">
8488 <?php echo esc_html(__( "Chart Data Grouping Limit", "chart-builder" )); ?>
8489 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The percentage value of the pie, below which a slice will not show individually. All slices that have not passed this value will be combined to a single 'Other' slice, whose size is the sum of all their sizes. Default is not to show individually any slice which is smaller than half a degree.","chart-builder") ); ?>">
8490 <i class="ays_fa ays_fa_info_circle"></i>
8491 </a>
8492 </label>
8493 </div>
8494 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8495 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-data-grouping-limit" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[data_grouping_limit]" value="<?php echo esc_attr($data_grouping_limit) ?>" step=".1" min="0" max="360">
8496 </div>
8497 </div> <!-- Data Grouping Limit -->
8498 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt cb-donut_chart-opt display_none">
8499 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8500 <label for="ays-chart-option-data-grouping-label" class="form-label">
8501 <?php echo esc_html(__( "Chart Data Grouping Label", "chart-builder" )); ?>
8502 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("A label for the combination slice that holds all slices below chart data grouping limit.","chart-builder") ); ?>">
8503 <i class="ays_fa ays_fa_info_circle"></i>
8504 </a>
8505 </label>
8506 </div>
8507 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8508 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-data-grouping-label" type="text" name="<?php echo esc_attr($html_name_prefix); ?>settings[data_grouping_label]" value="<?php echo esc_attr($data_grouping_label) ?>">
8509 </div>
8510 </div> <!-- Data Grouping Label -->
8511 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt cb-donut_chart-opt display_none">
8512 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8513 <label for="ays-chart-option-data-grouping-color">
8514 <?php echo esc_html(__( "Chart Data Grouping Color", "chart-builder" )); ?>
8515 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Color for the combination slice that holds all slices below chart data grouping limit.","chart-builder") ); ?>">
8516 <i class="ays_fa ays_fa_info_circle"></i>
8517 </a>
8518 </label>
8519 </div>
8520 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8521 <input id="ays-chart-option-data-grouping-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[data_grouping_color]" value="<?php echo esc_attr($data_grouping_color) ?>">
8522 </div>
8523 </div> <!-- Data Grouping Color -->
8524 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-bar_chart-opt cb-column_chart-opt display_none">
8525 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8526 <label for="ays-chart-option-is-stacked">
8527 <?php echo esc_html(__( "Is stacked", "chart-builder" )); ?>
8528 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Is stacked: If this option is enabled, the chart will be displayed in the proportional contribution of individual data points in comparison to a total.","chart-builder") ); ?>">
8529 <i class="ays_fa ays_fa_info_circle"></i>
8530 </a>
8531 </label>
8532 </div>
8533 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8534 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
8535 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-is-stacked" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[is_stacked]" value="on" <?php echo esc_attr($is_stacked); ?> >
8536 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
8537 </label>
8538 </div>
8539 </div> <!-- Is stacked -->
8540 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-line_chart-opt cb-bar_chart-opt cb-column_chart-opt display_none">
8541 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8542 <label for="ays-chart-option-focus-target">
8543 <?php echo esc_html(__( "Focus target", "chart-builder" )); ?>
8544 <a class="ays_help" data-bs-toggle="tooltip" data-bs-html="true" title="<?php
8545 echo esc_html( sprintf(
8546 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
8547 "<p>" . __('There are two ways to focus the data table elements.', "chart-builder") . "</p><ul class='ays_tooltop_ul'><li>" .
8548 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
8549 __('%1$sSingle data:%2$s If you choose the Single Data option, the focus will be on the single data point. By this, the particular cell of the data table will be focused.', "chart-builder") . "</li><li>" .
8550 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
8551 __('%1$sGroup data:%2$s If you choose the Group Data option, the focus will be on the grouped data points. By this, a row of the data table will be focused.', "chart-builder") . "</li></ul>",
8552 '<em>', '</em>',
8553 '<em>', '</em>'
8554 ));
8555 ?>">
8556 <i class="ays_fa ays_fa_info_circle"></i>
8557 </a>
8558 </label>
8559 </div>
8560 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8561 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-focus-target" name="<?php echo esc_attr($html_name_prefix); ?>settings[focus_target]">
8562 <?php
8563 foreach ( $focus_target_options as $option_slug => $option ):
8564 $selected = ( $focus_target == $option_slug ) ? 'selected' : '';
8565 ?>
8566 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8567 <?php
8568 endforeach;
8569 ?>
8570 </select>
8571 </div>
8572 </div> <!-- Focus target -->
8573 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-line_chart-opt cb-bar_chart-opt cb-column_chart-opt display_none">
8574 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8575 <label for="ays-chart-option-opacity" class="form-label">
8576 <?php echo esc_html(__( "Opacity", "chart-builder" )); ?>
8577 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The transparency of data points, with 1.0 being completely opaque and 0.0 fully transparent. In bar and column charts, this refers to the visible data: rectangles. In charts where selecting data creates a dot, such as the line chart, this refers to the circles that appear upon hover or selection.","chart-builder") ); ?>">
8578 <i class="ays_fa ays_fa_info_circle"></i>
8579 </a>
8580 </label>
8581 </div>
8582 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8583 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-opacity" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[opacity]" value="<?php echo esc_attr($opacity) ?>" step=".1" min="0" max="1">
8584 </div>
8585 </div> <!-- Data opacity -->
8586 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-bar_chart-opt cb-column_chart-opt display_none">
8587 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8588 <label for="ays-chart-option-group-width">
8589 <?php echo esc_html(__( "Bar width", "chart-builder" )); ?>
8590 <a class="ays_help" data-bs-toggle="tooltip" data-bs-html="true" title="<?php
8591 echo esc_html( sprintf(
8592 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
8593 "<p>" . __('The width of the bars, specified in either of these formats:', "chart-builder") . "</p><ul class='ays_tooltop_ul'><li>" .
8594 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
8595 __('%1$sPixels:%2$s Set the width of the bars in pixels.', "chart-builder") . "</li><li>" .
8596 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
8597 __('%1$sPercentage:%2$s Set the width of the bars in percentage.', "chart-builder") . "</li></ul>",
8598 '<em>', '</em>',
8599 '<em>', '</em>'
8600 ));
8601 ?>">
8602 <i class="ays_fa ays_fa_info_circle"></i>
8603 </a>
8604 </label>
8605 </div>
8606 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8607 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-group-width" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[group_width]" min="0" step=".1" value="<?php echo esc_attr($group_width) ?>">
8608 <select class="<?php echo esc_attr($html_class_prefix) ?>option-width-format-change <?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-group-width-format" name="<?php echo esc_attr($html_name_prefix); ?>settings[group_width_format]">
8609 <?php
8610 foreach ( $group_width_format_options as $option_slug => $option ):
8611 $selected = ( $group_width_format == $option_slug ) ? 'selected' : '';
8612 ?>
8613 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8614 <?php
8615 endforeach;
8616 ?>
8617 </select>
8618 </div>
8619 </div> <!-- Bars width -->
8620 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-line_chart-opt display_none">
8621 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8622 <label for="ays-chart-option-line-width" class="form-label">
8623 <?php echo esc_html(__( "Line width", "chart-builder" )); ?>
8624 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Data line width in pixels. Set 0 for hiding all the lines and show only the point. Note: If a line width is specified for series, it will override this setting.","chart-builder") ); ?>">
8625 <i class="ays_fa ays_fa_info_circle"></i>
8626 </a>
8627 </label>
8628 </div>
8629 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8630 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-line-width" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[line_width]" value="<?php echo esc_attr($line_width) ?>">
8631 </div>
8632 </div> <!-- Line width -->
8633 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-line_chart-opt display_none">
8634 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8635 <label for="ays-chart-option-multiple-selection">
8636 <?php echo esc_html(__( "Multiple data selection", "chart-builder" )); ?>
8637 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("When enabled, you may select multiple data points at once. To remove a data point from selection, click on it again. Note: This option works only when 'Tooltip trigger' option is set to 'When selected'.","chart-builder") ); ?>">
8638 <i class="ays_fa ays_fa_info_circle"></i>
8639 </a>
8640 </label>
8641 </div>
8642 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8643 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
8644 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-multiple-selection" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[multiple_selection]" value="on" <?php echo esc_attr($multiple_selection); ?> >
8645 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
8646 </label>
8647 </div>
8648 </div> <!-- Multiple data selection -->
8649 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-line_chart-opt display_none">
8650 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8651 <label for="ays-chart-option-multiple-data-format">
8652 <?php echo esc_html(__( "Multiple data format", "chart-builder" )); ?>
8653 <a class="ays_help" data-bs-toggle="tooltip" data-bs-html="true" title="<?php
8654 echo esc_html( sprintf(
8655 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
8656 "<p>" . __('How multiple data selections are rolled up into tooltips:', "chart-builder") . "</p><ul class='ays_tooltop_ul'><li>" .
8657 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
8658 __('%1$sCategory:%2$s Group selected data by row titles.', "chart-builder") . "</li><li>" .
8659 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
8660 __('%1$sSeries:%2$s Group selected data by column titles.', "chart-builder") . "</li><li>" .
8661 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
8662 __('%1$sAuto:%2$s Group selected data by row titles, if they have the same titles or by column titles', "chart-builder") . "</li><li>" .
8663 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
8664 __('%1$sNone:%2$s Show only one tooltip per selection.', "chart-builder") . "</li></ul>",
8665 '<em>', '</em>',
8666 '<em>', '</em>',
8667 '<em>', '</em>',
8668 '<em>', '</em>'
8669 ));
8670 ?>">
8671 <i class="ays_fa ays_fa_info_circle"></i>
8672 </a>
8673 </label>
8674 </div>
8675 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8676 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-multiple-data-format" name="<?php echo esc_attr($html_name_prefix); ?>settings[multiple_data_format]">
8677 <?php
8678 foreach ( $multiple_data_format_options as $option_slug => $option ):
8679 $selected = ( $multiple_data_format == $option_slug ) ? 'selected' : '';
8680 ?>
8681 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8682 <?php
8683 endforeach;
8684 ?>
8685 </select>
8686 </div>
8687 </div> <!-- Multiple data format -->
8688 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-line_chart-opt display_none">
8689 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8690 <label for="ays-chart-option-point-shape">
8691 <?php echo esc_html(__( "Point shape", "chart-builder" )); ?>
8692 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The shape of individual data elements: 'Circle', 'Triangle', 'Square', 'Diamond', 'Star', or 'Polygon'.","chart-builder") ); ?>">
8693 <i class="ays_fa ays_fa_info_circle"></i>
8694 </a>
8695 </label>
8696 </div>
8697 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8698 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-point-shape" name="<?php echo esc_attr($html_name_prefix); ?>settings[point_shape]">
8699 <?php
8700 foreach ( $point_shape_options as $option_slug => $option ):
8701 $selected = ( $point_shape == $option_slug ) ? 'selected' : '';
8702 ?>
8703 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8704 <?php
8705 endforeach;
8706 ?>
8707 </select>
8708 </div>
8709 </div> <!-- Point shape -->
8710 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-line_chart-opt display_none">
8711 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8712 <label for="ays-chart-option-point-size" class="form-label">
8713 <?php echo esc_html(__( "Point size", "chart-builder" )); ?>
8714 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Diameter of displayed points in pixels. Use zero to hide all points.","chart-builder") ); ?>">
8715 <i class="ays_fa ays_fa_info_circle"></i>
8716 </a>
8717 </label>
8718 </div>
8719 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8720 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-point-size" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[point_size]" value="<?php echo esc_attr($point_size) ?>">
8721 </div>
8722 </div> <!-- Point size -->
8723 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-line_chart-opt display_none">
8724 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8725 <label for="ays-chart-option-orientation">
8726 <?php echo esc_html(__( "Rotate Vertical", "chart-builder" )); ?>
8727 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable the option, if you want to change the direction of the chart from horizontal to vertical.","chart-builder") ); ?>">
8728 <i class="ays_fa ays_fa_info_circle"></i>
8729 </a>
8730 </label>
8731 </div>
8732 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8733 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
8734 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-orientation" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[orientation]" value="on" <?php echo esc_attr($orientation); ?> >
8735 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
8736 </label>
8737 </div>
8738 </div> <!-- Orientation -->
8739 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-line_chart-opt display_none">
8740 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8741 <label for="ays-chart-option-fill-nulls">
8742 <?php echo esc_html(__( "Autofill nulls", "chart-builder" )); ?>
8743 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Whether to guess and autofill the value of missing points when something goes wrong with the chart data. If checked, the chart will automatically fill the value of any missing data based on neighboring points. Else, it will leave a break in the line at the unknown point.","chart-builder") ); ?>">
8744 <i class="ays_fa ays_fa_info_circle"></i>
8745 </a>
8746 </label>
8747 </div>
8748 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8749 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
8750 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-fill-nulls" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[fill_nulls]" value="on" <?php echo esc_attr($fill_nulls); ?> >
8751 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
8752 </label>
8753 </div>
8754 </div> <!-- Autofill nulls -->
8755 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-line_chart-opt display_none">
8756 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8757 <label for="ays-chart-option-crosshair-trigger">
8758 <?php echo esc_html(__( "Crosshair trigger", "chart-builder" )); ?>
8759 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Choose when to display crosshairs. Crosshairs are thin vertical and horizontal lines centered on a data point in a chart.","chart-builder") ); ?>">
8760 <i class="ays_fa ays_fa_info_circle"></i>
8761 </a>
8762 </label>
8763 </div>
8764 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8765 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-crosshair-trigger" name="<?php echo esc_attr($html_name_prefix); ?>settings[crosshair_trigger]">
8766 <?php
8767 foreach ( $crosshair_trigger_options as $option_slug => $option ):
8768 $selected = ( $crosshair_trigger == $option_slug ) ? 'selected' : '';
8769 ?>
8770 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8771 <?php
8772 endforeach;
8773 ?>
8774 </select>
8775 </div>
8776 </div> <!-- Crosshair trigger -->
8777 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-line_chart-opt display_none">
8778 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8779 <label for="ays-chart-option-crosshair-orientation">
8780 <?php echo esc_html(__( "Crosshair orientation", "chart-builder" )); ?>
8781 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The crosshair orientation, which can be 'vertical' for vertical hairs only, 'horizontal' for horizontal hairs only, or 'both' for traditional crosshairs.","chart-builder") ); ?>">
8782 <i class="ays_fa ays_fa_info_circle"></i>
8783 </a>
8784 </label>
8785 </div>
8786 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8787 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-crosshair-orientation" name="<?php echo esc_attr($html_name_prefix); ?>settings[crosshair_orientation]">
8788 <?php
8789 foreach ( $crosshair_orientation_options as $option_slug => $option ):
8790 $selected = ( $crosshair_orientation == $option_slug ) ? 'selected' : '';
8791 ?>
8792 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8793 <?php
8794 endforeach;
8795 ?>
8796 </select>
8797 </div>
8798 </div> <!-- Crosshair orientation -->
8799 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-line_chart-opt display_none">
8800 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8801 <label for="ays-chart-option-crosshair-opacity" class="form-label">
8802 <?php echo esc_html(__( "Crosshair opacity", "chart-builder" )); ?>
8803 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The crosshair opacity, with 0.0 being fully transparent and 1.0 fully opaque.","chart-builder") ); ?>">
8804 <i class="ays_fa ays_fa_info_circle"></i>
8805 </a>
8806 </label>
8807 </div>
8808 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8809 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-crosshair-opacity" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[crosshair_opacity]" value="<?php echo esc_attr($crosshair_opacity) ?>" step=".1" min="0" max="1">
8810 </div>
8811 </div> <!-- Crosshair opacity -->
8812 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-line_chart-opt display_none">
8813 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8814 <label for="ays-chart-option-dash-style" class="form-label">
8815 <?php echo esc_html(__( "Dash Pattern", "chart-builder" )); ?>
8816 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enter a sequence of numbers separated by commas to define the dash pattern. The first number specifies the length of the first dash, the second number specifies the length of the gap after it, and so on. For example, '4,4' will create a pattern of 4-length dashes followed by 4-length gaps, and '5,1,3' will create a pattern of a 5-length dash, a 1-length gap, a 3-length dash, a 5-length gap, and so on.","chart-builder") ); ?>">
8817 <i class="ays_fa ays_fa_info_circle"></i>
8818 </a>
8819 </label>
8820 </div>
8821 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8822 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-dash-style" type="text" name="<?php echo esc_attr($html_name_prefix); ?>settings[dash_style]" value="<?php echo esc_attr($dash_style) ?>">
8823 </div>
8824 </div> <!-- Line dash pattern -->
8825 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-donut_chart-opt display_none">
8826 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8827 <label for="ays-chart-option-donut-hole-size">
8828 <?php echo esc_html(__( "Hole size", 'chart-builder' )); ?>
8829 </label>
8830 </div>
8831 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right <?php echo esc_attr($html_class_prefix) ?>option-input">
8832 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-donut-hole-size" type="number" min="0" max="1" step=".1" name="<?php echo esc_attr($html_name_prefix); ?>settings[donut_hole_size]" value="<?php echo esc_attr($donut_hole_size) ?>">
8833 </div>
8834 </div> <!-- Donut hole size -->
8835 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-line_chart-opt display_none ays-pro-features-v2-main-box">
8836 <div class="ays-pro-features-v2-small-buttons-box-middle ays-pro-features-v2-big-buttons-box">
8837 <div class="ays-pro-features-v2-video-button"></div>
8838 <a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-pro-features-v2-upgrade-button">
8839 <div class="ays-pro-features-v2-upgrade-icon" style="background-image: url('<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Locked_24x24.svg');" data-img-src="<?php echo esc_attr(CHART_BUILDER_ADMIN_URL); ?>/images/icons/pro-features-icons/Locked_24x24.svg"></div>
8840 <div class="ays-pro-features-v2-upgrade-text">
8841 <?php echo esc_html(__("Upgrade" , "chart-builder")); ?>
8842 </div>
8843 </a>
8844 </div>
8845 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix )?>option-title">
8846 <label for="ays-chart-option-curve-type">
8847 <?php echo esc_html(__( "Line curve type", "chart-builder" )); ?>
8848 </label>
8849 </div>
8850 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8851 <select class="<?php echo esc_attr($html_class_prefix) ?>option-select-input form-select" id="ays-chart-option-line-curve-type" name="<?php echo esc_attr($html_name_prefix); ?>settings[line_curve_type]">
8852 <option><?php echo esc_html(__( "Straight", "chart-builder" )); ?></option>
8853 </select>
8854 </div>
8855 </div> <!-- Line curve type -->
8856 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-org_chart-opt display_none">
8857 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8858 <label for="ays-chart-option-allow-collapse">
8859 <?php echo esc_html(__( "Allow collapse", "chart-builder" )); ?>
8860 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("If checked, double click on the node will collapse a node. Note: If the node has an Url option set in the source tab, this option will not work.","chart-builder") ); ?>">
8861 <i class="ays_fa ays_fa_info_circle"></i>
8862 </a>
8863 </label>
8864 </div>
8865 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8866 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
8867 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-allow-collapse" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[allow_collapse]" value="on" <?php echo esc_attr($allow_collapse); ?> >
8868 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
8869 </label>
8870 </div>
8871 </div> <!-- Allow collapse -->
8872 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-org_chart-opt display_none">
8873 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8874 <label for="ays-chart-option-org-node-description-font-color">
8875 <?php echo esc_html(__( "Description color", "chart-builder" )); ?>
8876 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Description text color of the node.","chart-builder") ); ?>">
8877 <i class="ays_fa ays_fa_info_circle"></i>
8878 </a>
8879 </label>
8880 </div>
8881 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8882 <input id="ays-chart-option-org-node-description-font-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[org_node_description_font_color]" value="<?php echo esc_attr($org_node_description_font_color) ?>">
8883 </div>
8884 </div> <!-- Org Node Description color -->
8885 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-org_chart-opt display_none">
8886 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8887 <label for="ays-chart-option-org-node-description-font-size" class="form-label">
8888 <?php echo esc_html(__( "Description font size", "chart-builder" )); ?>
8889 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Description font size of the node.","chart-builder") ); ?>">
8890 <i class="ays_fa ays_fa_info_circle"></i>
8891 </a>
8892 </label>
8893 </div>
8894 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8895 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-org-node-description-font-size" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[org_node_description_font_size]" value="<?php echo esc_attr($org_node_description_font_size) ?>">
8896 </div>
8897 </div> <!-- Org Node Description font size -->
8898 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-org_chart-opt display_none">
8899 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8900 <label for="ays-chart-option-org-classname" class="form-label">
8901 <?php echo esc_html(__( "Custom CSS class", "chart-builder" )); ?>
8902 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("A class name to assign to node elements to specify styles for the chart elements.","chart-builder") ); ?>">
8903 <i class="ays_fa ays_fa_info_circle"></i>
8904 </a>
8905 </label>
8906 </div>
8907 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8908 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-org-classname" type="text" name="<?php echo esc_attr($html_name_prefix); ?>settings[org_classname]" placeholder="chart-builder-org-chart-tree-node" value="<?php echo esc_attr($org_classname) ?>">
8909 </div>
8910 </div> <!-- Org custom class -->
8911 <div class="form-group mb-2 cb-changable-opt cb-org_chart-opt display_none">
8912 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-org_chart-opt display_none" style="background:transparent;box-shadow:unset;padding:10px 0">
8913 <br>
8914 <blockquote>
8915 <?php echo sprintf(
8916 /* translators: %1$s: Opening <strong> tag, %2$s: Closing </strong> tag */
8917 esc_html(__( '%1$sNote:%2$s Custom CSS class must be set for the options below to take effect.', 'chart-builder' )), '<strong>', '</strong>'); ?>
8918 </blockquote>
8919 <br>
8920 </div>
8921 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-org_chart-opt display_none">
8922 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8923 <label for="ays-chart-option-org-node-background-color">
8924 <?php echo esc_html(__( "Background color", "chart-builder" )); ?>
8925 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Background color of the node. Note: You need to set a Custom CSS class for this option to work.","chart-builder") ); ?>">
8926 <i class="ays_fa ays_fa_info_circle"></i>
8927 </a>
8928 </label>
8929 </div>
8930 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8931 <input id="ays-chart-option-org-node-background-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[org_node_background_color]" value="<?php echo esc_attr($org_node_background_color) ?>">
8932 </div>
8933 </div> <!-- Org Node Background color -->
8934 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-org_chart-opt display_none">
8935 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8936 <label for="ays-chart-option-org-node-padding" class="form-label">
8937 <?php echo esc_html(__( "Padding", "chart-builder" )); ?>
8938 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Padding of the node. Note: You need to set a Custom CSS class for this option to work.","chart-builder") ); ?>">
8939 <i class="ays_fa ays_fa_info_circle"></i>
8940 </a>
8941 </label>
8942 </div>
8943 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8944 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-org-node-padding" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[org_node_padding]" value="<?php echo esc_attr($org_node_padding) ?>">
8945 </div>
8946 </div> <!-- Org Node Padding -->
8947 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-org_chart-opt display_none">
8948 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8949 <label for="ays-chart-option-org-node-border-radius" class="form-label">
8950 <?php echo esc_html(__( "Border radius", "chart-builder" )); ?>
8951 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Border radius of the node. Note: You need to set a Custom CSS class for this option to work.","chart-builder") ); ?>">
8952 <i class="ays_fa ays_fa_info_circle"></i>
8953 </a>
8954 </label>
8955 </div>
8956 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8957 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-org-node-border-radius" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[org_node_border_radius]" value="<?php echo esc_attr($org_node_border_radius) ?>">
8958 </div>
8959 </div> <!-- Org Node Border radius -->
8960 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-org_chart-opt display_none">
8961 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8962 <label for="ays-chart-option-org-node-border-width" class="form-label">
8963 <?php echo esc_html(__( "Border width", "chart-builder" )); ?>
8964 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Border width of the node. Note: You need to set a Custom CSS class for this option to work.","chart-builder") ); ?>">
8965 <i class="ays_fa ays_fa_info_circle"></i>
8966 </a>
8967 </label>
8968 </div>
8969 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8970 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-org-node-border-width" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[org_node_border_width]" value="<?php echo esc_attr($org_node_border_width) ?>">
8971 </div>
8972 </div> <!-- Org Node Border width -->
8973 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-org_chart-opt display_none">
8974 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8975 <label for="ays-chart-option-org-node-border-color">
8976 <?php echo esc_html(__( "Border color", "chart-builder" )); ?>
8977 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Border color of the node. Note: You need to set a Custom CSS class for this option to work.","chart-builder") ); ?>">
8978 <i class="ays_fa ays_fa_info_circle"></i>
8979 </a>
8980 </label>
8981 </div>
8982 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8983 <input id="ays-chart-option-org-node-border-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[org_node_border_color]" value="<?php echo esc_attr($org_node_border_color) ?>">
8984 </div>
8985 </div> <!-- Org Node Background color -->
8986 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-org_chart-opt display_none">
8987 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8988 <label for="ays-chart-option-org-node-text-color">
8989 <?php echo esc_html(__( "Text color", "chart-builder" )); ?>
8990 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Text color of the node. Note: You need to set a Custom CSS class for this option to work.","chart-builder") ); ?>">
8991 <i class="ays_fa ays_fa_info_circle"></i>
8992 </a>
8993 </label>
8994 </div>
8995 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8996 <input id="ays-chart-option-org-node-text-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[org_node_text_color]" value="<?php echo esc_attr($org_node_text_color) ?>">
8997 </div>
8998 </div> <!-- Org Node Text color -->
8999 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-org_chart-opt display_none">
9000 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9001 <label for="ays-chart-option-org-node-text-font-size" class="form-label">
9002 <?php echo esc_html(__( "Text font size", "chart-builder" )); ?>
9003 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Font size of the text of the node. Note: You need to set a Custom CSS class for this option to work.","chart-builder") ); ?>">
9004 <i class="ays_fa ays_fa_info_circle"></i>
9005 </a>
9006 </label>
9007 </div>
9008 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9009 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-org-node-text-font-size" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[org_node_text_font_size]" value="<?php echo esc_attr($org_node_text_font_size) ?>">
9010 </div>
9011 </div> <!-- Org Node Text font size -->
9012 </div> <!-- Org custom class options -->
9013 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-org_chart-opt display_none">
9014 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9015 <label for="ays-chart-option-org-selected-classname" class="form-label">
9016 <?php echo esc_html(__( "Selected node custom CSS class", "chart-builder" )); ?>
9017 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("A class name to assign to node elements to specify styles for the selected chart elements.","chart-builder") ); ?>">
9018 <i class="ays_fa ays_fa_info_circle"></i>
9019 </a>
9020 </label>
9021 </div>
9022 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
9023 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-org-selected-classname" type="text" name="<?php echo esc_attr($html_name_prefix); ?>settings[org_selected_classname]" placeholder="chart-builder-org-chart-tree-node-selected" value="<?php echo esc_attr($org_selected_classname) ?>">
9024 </div>
9025 </div> <!-- Org custom selected class -->
9026 <div class="form-group mb-2 cb-changable-opt cb-org_chart-opt display_none">
9027 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-org_chart-opt display_none" style="background:transparent;box-shadow:unset;padding:10px 0">
9028 <br>
9029 <blockquote>
9030 <?php echo sprintf(
9031 /* translators: %1$s: Opening <strong> tag, %2$s: Closing </strong> tag */
9032 esc_html(__( '%1$sNote:%2$s Selected node custom CSS class must be set for the options below to take effect. Add the Custom CSS Class so that the Selected node custom CSS class can operate correctly for you.', 'chart-builder' )),
9033 '<strong>',
9034 '</strong>'
9035 ); ?>
9036 </blockquote>
9037 <br>
9038 </div>
9039 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-org_chart-opt display_none">
9040 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9041 <label for="ays-chart-option-org-selected-node-background-color">
9042 <?php echo esc_html(__( "Background color", "chart-builder" )); ?>
9043 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Background color of the selected node. Note: You need to set a Selected node custom CSS class for this option to work.","chart-builder") ); ?>">
9044 <i class="ays_fa ays_fa_info_circle"></i>
9045 </a>
9046 </label>
9047 </div>
9048 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9049 <input id="ays-chart-option-org-selected-node-background-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[org_selected_node_background_color]" value="<?php echo esc_attr($org_selected_node_background_color) ?>">
9050 </div>
9051 </div> <!-- Org selected Node Background color -->
9052 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-org_chart-opt display_none">
9053 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9054 <label for="ays-chart-option-org-selected-node-text-color">
9055 <?php echo esc_html(__( "Text color", "chart-builder" )); ?>
9056 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Text color of the selected node. Note: You need to set a Selected node custom CSS class for this option to work.","chart-builder") ); ?>">
9057 <i class="ays_fa ays_fa_info_circle"></i>
9058 </a>
9059 </label>
9060 </div>
9061 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9062 <input id="ays-chart-option-org-selected-node-text-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[org_selected_node_text_color]" value="<?php echo esc_attr($org_selected_node_text_color) ?>">
9063 </div>
9064 </div> <!-- Org selected Node text color -->
9065 </div> <!-- Org custom selected class options -->
9066 </div>
9067 </div>
9068 <?php
9069 $content = ob_get_clean();
9070
9071 $sources['advanced_settings'] = array(
9072 'content' => $content,
9073 'title' => $tab_title
9074 );
9075
9076 return $sources;
9077 }
9078
9079 public function settings_contents_advanced_settings_chartjs( $sources, $args ){
9080 $html_class_prefix = $args['html_class_prefix'];
9081 $html_name_prefix = $args['html_name_prefix'];
9082 $settings = $args['settings'];
9083 $tab_title = $args['tab_name'];
9084
9085 $outer_radius = $settings['outer_radius'];
9086 $slice_spacing = $settings['slice_spacing'];
9087 $circumference = $settings['circumference'];
9088 $start_angle = $settings['start_angle'];
9089 $slice_border_color = $settings['slice_border_color'];
9090 $slice_border_width = $settings['slice_border_width'];
9091 // $index_axis = $settings['index_axis'];
9092
9093 ob_start();
9094 ?>
9095 <div class="ays-accordion-data-main-wrap">
9096 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap <?php echo esc_attr($html_class_prefix) ?>advanced-settings-data-wrap">
9097 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt display_none">
9098 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9099 <label for="ays-chart-option-outer-radius" class="form-label">
9100 <?php echo esc_html(__( "Outer Radius", "chart-builder" )); ?>
9101 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The outer radius of the chart.","chart-builder") ); ?>">
9102 <i class="ays_fa ays_fa_info_circle"></i>
9103 </a>
9104 </label>
9105 </div>
9106 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
9107 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-outer-radius" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[outer_radius]" value="<?php echo esc_attr($outer_radius) ?>">
9108 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
9109 </div>
9110 </div> <!-- Outer Radius -->
9111 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt display_none">
9112 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9113 <label for="ays-chart-option-slice-spacing" class="form-label">
9114 <?php echo esc_html(__( "Slices Spacing", "chart-builder" )); ?>
9115 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Fixed arc offset (in pixels).","chart-builder") ); ?>">
9116 <i class="ays_fa ays_fa_info_circle"></i>
9117 </a>
9118 </label>
9119 </div>
9120 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
9121 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-slice-spacing" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[slice_spacing]" value="<?php echo esc_attr($slice_spacing) ?>">
9122 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
9123 </div>
9124 </div> <!-- Slice Spacing -->
9125 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt display_none">
9126 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9127 <label for="ays-chart-option-circumference" class="form-label">
9128 <?php echo esc_html(__( "Arc Coverage", "chart-builder" )); ?>
9129 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Adjust the sweep angle to define the arc's coverage area along the circumference.","chart-builder") ); ?>">
9130 <i class="ays_fa ays_fa_info_circle"></i>
9131 </a>
9132 </label>
9133 </div>
9134 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
9135 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-circumference" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[circumference]" value="<?php echo esc_attr($circumference) ?>">
9136 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">°</div>
9137 </div>
9138 </div> <!-- Arc Coverage -->
9139 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt display_none">
9140 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9141 <label for="ays-chart-option-start-angle" class="form-label">
9142 <?php echo esc_html(__( "Start Angle", "chart-builder" )); ?>
9143 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Starting angle to draw arcs from.","chart-builder") ); ?>">
9144 <i class="ays_fa ays_fa_info_circle"></i>
9145 </a>
9146 </label>
9147 </div>
9148 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
9149 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-start-angle" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[start_angle]" value="<?php echo esc_attr($start_angle) ?>">
9150 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">°</div>
9151 </div>
9152 </div> <!-- Start Angle -->
9153 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt ">
9154 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9155 <label for="ays-chart-option-slice-border-width">
9156 <?php echo esc_html(__( "Border Width", "chart-builder" )); ?>
9157 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The width of the slice borders.","chart-builder") ); ?>">
9158 <i class="ays_fa ays_fa_info_circle"></i>
9159 </a>
9160 </label>
9161 </div>
9162 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
9163 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-slice-border-width" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[slice_border_width]" value="<?php echo esc_attr($slice_border_width) ?>">
9164 </div>
9165 </div> <!-- Border Width -->
9166 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt ">
9167 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9168 <label for="ays-chart-option-slice-border-color">
9169 <?php echo esc_html(__( "Border Color", "chart-builder" )); ?>
9170 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the slice borders.","chart-builder") ); ?>">
9171 <i class="ays_fa ays_fa_info_circle"></i>
9172 </a>
9173 </label>
9174 </div>
9175 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9176 <input id="ays-chart-option-slice-border-color" class="form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker" type="color" name="<?php echo esc_attr($html_name_prefix); ?>settings[slice_border_color]" value="<?php echo esc_attr($slice_border_color) ?>">
9177 </div>
9178 </div> <!-- Slice border color -->
9179 <!-- <div class="form-group row mb-2 <?php // echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt cb-donut_chart-opt display_none">
9180 <div class="col-sm-5 d-flex align-items-center <?php // echo esc_attr($html_class_prefix) ?>option-title">
9181 <label for="ays-chart-option-index-axis">
9182 <?php // echo esc_html(__( "Horizontal ", "chart-builder" )); ?>
9183 <a class="ays_help" data-bs-toggle="tooltip" title="<?php // echo esc_attr( __("If this option is enabled, the pie slices will be drawn counterclockwise.","chart-builder") ); ?>">
9184 <i class="ays_fa ays_fa_info_circle"></i>
9185 </a>
9186 </label>
9187 </div>
9188 <div class="col-sm-7 py-1 <?php // echo esc_attr($html_class_prefix) ?>input-align-right">
9189 <label class="<?php // echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
9190 <input class="<?php // echo esc_attr($html_class_prefix) ?>toggle-switch" id="ays-chart-option-index-axis" type="checkbox" name="<?php // echo esc_attr($html_name_prefix); ?>settings[index_axis]" value="on" <?php // echo esc_attr($index_axis); ?> >
9191 <span class="<?php // echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php // echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
9192 </label>
9193 </div>
9194 </div> Reverse Categories -->
9195 </div>
9196 </div>
9197 <?php
9198 $content = ob_get_clean();
9199
9200 $sources['advanced_settings'] = array(
9201 'content' => $content,
9202 'title' => $tab_title
9203 );
9204
9205 return $sources;
9206 }
9207
9208 public function settings_contents_slices_settings( $sources, $args ){
9209 $html_class_prefix = $args['html_class_prefix'];
9210 $html_name_prefix = $args['html_name_prefix'];
9211 $settings = $args['settings'];
9212 $source = $args['source'];
9213 $source = isset($source["commonTypeCharts"]) ? $source["commonTypeCharts"] : $source;
9214 $source_chart_type = $args['source_chart_type'];
9215 $settings = $args['settings'];
9216 $title_row = array_shift($source);
9217
9218 if (isset($source) && !empty($source)) {
9219 if ( !isset( $source[0] ) ) {
9220 if (count($source[1]) > 2) {
9221 $titles = array();
9222 for ($i = 0; $i < count($source[1]); $i++) {
9223 array_push($titles, __("Title", 'chart-builder').$i);
9224 }
9225 $source[0] = $titles;
9226 } else {
9227 $source[0] = array(
9228 __("Country", 'chart-builder'),
9229 __("Population", 'chart-builder'),
9230 );
9231 }
9232
9233 ksort($source);
9234 }
9235 }
9236
9237 if ($source_chart_type == 'pie_chart' || $source_chart_type == 'donut_chart') {
9238 foreach ($source as $key => $row) {
9239 $source[$key] = array_slice($row, 0, 2);
9240 }
9241 }
9242
9243 ob_start();
9244 if ($source_chart_type == 'pie_chart' || $source_chart_type == 'donut_chart') {
9245 $slice_color = $settings['slice_color'];
9246 $slice_colors_default = $settings['slice_colors_default'];
9247 $slice_offset = $settings['slice_offset'];
9248 $slice_text_color = $settings['slice_text_color'];
9249
9250 ?>
9251 <div class="ays-accordion-data-main-wrap <?php echo esc_attr($html_class_prefix) ?>options-slices-settings-tab cb-changable-tab cb-pie_chart-tab cb-donut_chart-tab">
9252 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
9253 <div class="<?php echo esc_attr($html_class_prefix) ?>slices-settings">
9254 <?php
9255 foreach ( $source as $key => $val ):
9256 ?>
9257 <fieldset class="ays-slices-accordion-options-container <?php echo esc_attr($html_class_prefix) ?>options-slices-<?php echo esc_attr($key); ?>" data-collapsed="true">
9258 <legend class="ays-slices-accordion-options-header">
9259 <svg class="ays-slices-accordion-arrow ays-slices-accordion-arrow-right" version="1.2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" overflow="visible" preserveAspectRatio="none" viewBox="0 0 24 24" width="20" height="20">
9260 <g>
9261 <path xmlns:default="http://www.w3.org/2000/svg" d="M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z" style="fill: #c4c4c4;" vector-effect="non-scaling-stroke" />
9262 </g>
9263 </svg>
9264 <span><?php echo esc_html($val[0]); ?></span>
9265 </legend>
9266 <div class="ays-slices-accordion-options-content ays-slices-accordion-options-content">
9267 <div class="ays-slices-accordion-data-main-wrap">
9268 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
9269 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
9270 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9271 <label for="ays-chart-option-slice-color">
9272 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
9273 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color to use for this slice.","chart-builder") ); ?>">
9274 <i class="ays_fa ays_fa_info_circle"></i>
9275 </a>
9276 </label>
9277 </div>
9278 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9279 <input type="color"
9280 id="ays-chart-option-slice-color-<?php echo esc_attr($key); ?>"
9281 class="ays-chart-option-slice-color form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker"
9282 name="<?php echo esc_attr($html_name_prefix); ?>settings[slice_color][<?php echo esc_attr($key); ?>]"
9283 value="<?php echo isset($slice_color[$key]) ? esc_attr($slice_color[$key]) : esc_attr($slice_colors_default[$key]); ?>"
9284 data-slice-id="<?php echo esc_attr($key); ?>">
9285 </div>
9286 </div> <!-- Slice color -->
9287 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
9288 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9289 <label for="ays-chart-option-slice-offset" class="form-label">
9290 <?php echo esc_html(__( "Offset", "chart-builder" )); ?>
9291 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("How far to separate the slice from the rest of the pie, from 0.0 (not at all) to 1.0 (the chart's radius).","chart-builder") ); ?>">
9292 <i class="ays_fa ays_fa_info_circle"></i>
9293 </a>
9294 </label>
9295 </div>
9296 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9297 <input type="number"
9298 id="ays-chart-option-slice-offset-<?php echo esc_attr($key); ?>"
9299 class="ays-chart-option-slice-offset ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input"
9300 name="<?php echo esc_attr($html_name_prefix); ?>settings[slice_offset][<?php echo esc_attr($key); ?>]"
9301 value="<?php echo isset($slice_offset[$key]) ? esc_attr($slice_offset[$key]) : 0 ; ?>"
9302 data-slice-id="<?php echo esc_attr($key); ?>"
9303 step=".01" min="0.0" max="1.0">
9304 </div>
9305 </div> <!-- Slice offset -->
9306 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
9307 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9308 <label for="ays-chart-option-slice-text-color">
9309 <?php echo esc_html(__( "Text color", "chart-builder" )); ?>
9310 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color to use for the text of this slice.","chart-builder") ); ?>">
9311 <i class="ays_fa ays_fa_info_circle"></i>
9312 </a>
9313 </label>
9314 </div>
9315 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9316 <input type="color"
9317 id="ays-chart-option-slice-text-color-<?php echo esc_attr($key); ?>"
9318 class="ays-chart-option-slice-text-color form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker"
9319 name="<?php echo esc_attr($html_name_prefix); ?>settings[slice_text_color][<?php echo esc_attr($key); ?>]"
9320 value="<?php echo isset($slice_text_color[$key]) ? esc_attr($slice_text_color[$key]) : '#ffffff'; ?>"
9321 data-slice-id="<?php echo esc_attr($key); ?>">
9322 </div>
9323 </div> <!-- Slice color -->
9324 </div>
9325 </div>
9326 </div>
9327 </fieldset>
9328 <?php
9329 endforeach;
9330 ?>
9331 </div>
9332 </div>
9333 <br>
9334 <blockquote>
9335 <?php echo esc_html(__( "Save the chart to update the data.", "chart-builder" )); ?>
9336 </blockquote>
9337 </div>
9338 <?php
9339
9340 } else {
9341 ?>
9342 <div class="ays-accordion-data-main-wrap <?php echo esc_attr($html_class_prefix) ?>options-slices-settings-tab cb-changable-tab cb-pie_chart-tab cb-donut_chart-tab"></div>
9343 <?php
9344 }
9345
9346 $content = ob_get_clean();
9347
9348 $title = esc_html(__( 'Slices settings', 'chart-builder' ));
9349
9350 $sources['slices_settings'] = array(
9351 'content' => $content,
9352 'title' => $title
9353 );
9354
9355 return $sources;
9356 }
9357
9358 public function settings_contents_slices_settings_chartjs( $sources, $args ){
9359 $html_class_prefix = $args['html_class_prefix'];
9360 $html_name_prefix = $args['html_name_prefix'];
9361 $settings = $args['settings'];
9362 $source = $args['source'];
9363 $source = isset($source["commonTypeCharts"]) ? $source["commonTypeCharts"] : $source;
9364 $source_chart_type = $args['source_chart_type'];
9365 $settings = $args['settings'];
9366 $title_row = array_shift($source);
9367
9368 if (isset($source) && !empty($source)) {
9369 if ( !isset( $source[0] ) ) {
9370 if (count($source[1]) > 2) {
9371 $titles = array();
9372 for ($i = 0; $i < count($source[1]); $i++) {
9373 array_push($titles, __("Title", 'chart-builder').$i);
9374 }
9375 $source[0] = $titles;
9376 } else {
9377 $source[0] = array(
9378 __("Country", 'chart-builder'),
9379 __("Population", 'chart-builder'),
9380 );
9381 }
9382
9383 ksort($source);
9384 }
9385 }
9386
9387 if ($source_chart_type == 'pie_chart') {
9388 foreach ($source as $key => $row) {
9389 $source[$key] = array_slice($row, 0, 2);
9390 }
9391 }
9392
9393 ob_start();
9394 if ($source_chart_type == 'pie_chart') {
9395 $slice_color = $settings['slice_color'];
9396 $slices_border_color = $settings['slices_border_color'];
9397 $slice_colors_default = $settings['slice_colors_default'];
9398
9399 ?>
9400 <div class="ays-accordion-data-main-wrap <?php echo esc_attr($html_class_prefix) ?>options-slices-settings-tab cb-changable-tab cb-pie_chart-tab cb-donut_chart-tab">
9401 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
9402 <div class="<?php echo esc_attr($html_class_prefix) ?>slices-settings">
9403 <?php
9404 foreach ( $source as $key => $val ):
9405 ?>
9406 <fieldset class="ays-slices-accordion-options-container <?php echo esc_attr($html_class_prefix) ?>options-slices-<?php echo esc_attr($key); ?>" data-collapsed="true">
9407 <legend class="ays-slices-accordion-options-header">
9408 <svg class="ays-slices-accordion-arrow ays-slices-accordion-arrow-right" version="1.2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" overflow="visible" preserveAspectRatio="none" viewBox="0 0 24 24" width="20" height="20">
9409 <g>
9410 <path xmlns:default="http://www.w3.org/2000/svg" d="M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z" style="fill: #c4c4c4;" vector-effect="non-scaling-stroke" />
9411 </g>
9412 </svg>
9413 <span><?php echo esc_html($val[0]); ?></span>
9414 </legend>
9415 <div class="ays-slices-accordion-options-content ays-slices-accordion-options-content">
9416 <div class="ays-slices-accordion-data-main-wrap">
9417 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
9418 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
9419 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9420 <label for="ays-chart-option-slice-color">
9421 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
9422 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color to use for this slice.","chart-builder") ); ?>">
9423 <i class="ays_fa ays_fa_info_circle"></i>
9424 </a>
9425 </label>
9426 </div>
9427 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9428 <input type="color"
9429 id="ays-chart-option-slice-color-<?php echo esc_attr($key); ?>"
9430 class="ays-chart-option-slice-color form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker"
9431 name="<?php echo esc_attr($html_name_prefix); ?>settings[slice_color][<?php echo esc_attr($key); ?>]"
9432 value="<?php echo isset($slice_color[$key]) ? esc_attr($slice_color[$key]) : esc_attr($slice_colors_default[$key]); ?>"
9433 data-slice-id="<?php echo esc_attr($key); ?>">
9434 </div>
9435 </div> <!-- Slice color -->
9436 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
9437 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9438 <label for="ays-chart-option-slice-border-color">
9439 <?php echo esc_html(__( "Border Color", "chart-builder" )); ?>
9440 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color to use for this slice border.","chart-builder") ); ?>">
9441 <i class="ays_fa ays_fa_info_circle"></i>
9442 </a>
9443 </label>
9444 </div>
9445 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9446 <input type="color"
9447 id="ays-chart-option-slice-border-color-<?php echo esc_attr($key); ?>"
9448 class="ays-chart-option-slice-border-color form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker"
9449 name="<?php echo esc_attr($html_name_prefix); ?>settings[slices_border_color][<?php echo esc_attr($key); ?>]"
9450 value="<?php echo isset($slices_border_color[$key]) ? esc_attr($slices_border_color[$key]) : esc_attr($settings['slice_border_color']); ?>"
9451 data-slice-id="<?php echo esc_attr($key); ?>">
9452 </div>
9453 </div> <!-- Slice border color -->
9454 </div>
9455 </div>
9456 </div>
9457 </fieldset>
9458 <?php
9459 endforeach;
9460 ?>
9461 </div>
9462 </div>
9463 <br>
9464 <blockquote>
9465 <?php echo esc_html(__( "Save the chart to update the data.", "chart-builder" )); ?>
9466 </blockquote>
9467 </div>
9468 <?php
9469
9470 } else {
9471 ?>
9472 <div class="ays-accordion-data-main-wrap <?php echo esc_attr($html_class_prefix) ?>options-slices-settings-tab cb-changable-tab cb-pie_chart-tab cb-donut_chart-tab"></div>
9473 <?php
9474 }
9475
9476 $content = ob_get_clean();
9477
9478 $title = esc_html(__( 'Slices settings', 'chart-builder' ));
9479
9480 $sources['slices_settings'] = array(
9481 'content' => $content,
9482 'title' => $title
9483 );
9484
9485 return $sources;
9486 }
9487
9488 public function settings_contents_series_settings( $sources, $args ){
9489 $html_class_prefix = $args['html_class_prefix'];
9490 $html_name_prefix = $args['html_name_prefix'];
9491 $settings = $args['settings'];
9492 $source = $args['source'];
9493 $source = isset($source["commonTypeCharts"]) ? $source["commonTypeCharts"] : $source;
9494 $source_chart_type = $args['source_chart_type'];
9495
9496 $line_width = $settings['line_width'];
9497 $point_size = $settings['point_size'];
9498 $point_shape_options = $settings['point_shape_options'];
9499 $point_shape = $settings['point_shape'];
9500
9501 if (isset($source) && !empty($source)) {
9502 if ( !isset( $source[0] ) ) {
9503 if (count($source[1]) > 2) {
9504 $titles = array();
9505 for ($i = 0; $i < count($source[1]); $i++) {
9506 array_push($titles, __("Title", "chart-builder").$i);
9507 }
9508 $source[0] = $titles;
9509 } else {
9510 $source[0] = array(
9511 __("Country", "chart-builder"),
9512 __("Population", "chart-builder"),
9513 );
9514 }
9515
9516 ksort($source);
9517 }
9518 }
9519
9520 if ($source_chart_type == 'pie_chart' || $source_chart_type == 'donut_chart') {
9521 foreach ($source as $key => $row) {
9522 $source[$key] = array_slice($row, 0, 2);
9523 }
9524 }
9525
9526 ob_start();
9527 if ($source_chart_type == 'pie_chart' || $source_chart_type == 'line_chart' || $source_chart_type == 'bar_chart' || $source_chart_type == 'column_chart') {
9528 $series_row = array_shift($source);
9529 $title = array_shift($series_row);
9530 $series_color = $settings['series_color'];
9531 $series_colors_default = $settings['series_colors_default'];
9532 $series_format = $settings['series_format'];
9533 $series_visible_in_legend = $settings['series_visible_in_legend'];
9534 $series_line_width = $settings['series_line_width'];
9535 $series_point_size = $settings['series_point_size'];
9536 $series_point_shape = $settings['series_point_shape'];
9537
9538 ?>
9539 <div class="ays-accordion-data-main-wrap <?php echo esc_attr($html_class_prefix) ?>options-series-settings-tab cb-changable-tab cb-bar_chart-tab cb-column_chart-tab cb-line_chart-tab">
9540 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
9541 <div class="<?php echo esc_attr($html_class_prefix) ?>series-settings">
9542 <?php
9543 foreach ( $series_row as $key => $val ):
9544 ?>
9545 <fieldset class="ays-series-accordion-options-container <?php echo esc_attr($html_class_prefix) ?>options-series-<?php echo esc_attr($key); ?>" data-collapsed="true">
9546 <legend class="ays-series-accordion-options-header">
9547 <svg class="ays-series-accordion-arrow ays-series-accordion-arrow-right" version="1.2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" overflow="visible" preserveAspectRatio="none" viewBox="0 0 24 24" width="20" height="20">
9548 <g>
9549 <path xmlns:default="http://www.w3.org/2000/svg" d="M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z" style="fill: #c4c4c4;" vector-effect="non-scaling-stroke" />
9550 </g>
9551 </svg>
9552 <span><?php echo esc_attr($val); ?></span>
9553 </legend>
9554 <div class="ays-series-accordion-options-content ays-series-accordion-options-content">
9555 <div class="ays-series-accordion-data-main-wrap">
9556 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
9557 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
9558 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9559 <label for="ays-chart-option-series-color">
9560 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
9561 </label>
9562 </div>
9563 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9564 <input type="color"
9565 id="ays-chart-option-series-color-<?php echo esc_attr($key); ?>"
9566 class="ays-chart-option-series-color form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker"
9567 name="<?php echo esc_attr($html_name_prefix); ?>settings[series_color][<?php echo esc_attr($key); ?>]"
9568 value="<?php echo isset($series_color[$key]) ? esc_attr($series_color[$key]) : esc_attr($series_colors_default[$key]); ?>"
9569 data-series-id="<?php echo esc_attr($key); ?>">
9570 </div>
9571 </div> <!-- series color -->
9572 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
9573 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9574 <label for="ays-chart-option-series-visible-in-legend">
9575 <?php echo esc_html(__( "Visible in legend", "chart-builder" )); ?>
9576 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Tick this option to have the series shown in the legend, otherwise it won`t be shown. If the chart has only one column, disabling this option will not work. If you don't want any of the labels to be shown in the legend, change the 'Legend position' option to 'Hide' to entirely hide the legend .","chart-builder") ); ?>">
9577 <i class="ays_fa ays_fa_info_circle"></i>
9578 </a>
9579 </label>
9580 </div>
9581 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9582 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
9583 <input type="checkbox"
9584 id="ays-chart-option-series-visible-in-legend-<?php echo esc_attr($key); ?>"
9585 class="ays-chart-option-series-visible-in-legend <?php echo esc_attr($html_class_prefix) ?>toggle-switch"
9586 name="<?php echo esc_attr($html_name_prefix); ?>settings[series_visible_in_legend][<?php echo esc_attr($key); ?>]"
9587 value="on"
9588 data-series-id="<?php echo esc_attr($key); ?>"
9589 <?php echo isset($series_visible_in_legend[$key]) && $series_visible_in_legend[$key] == 'on' ? 'checked' : (!isset($series_color[$key]) ? 'checked' : ''); ?> >
9590 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
9591 </label>
9592 </div>
9593 </div> <!-- Series visible in legend -->
9594 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
9595 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9596 <label for="ays-chart-option-series-color">
9597 <?php echo esc_html(__( "Format", "chart-builder" )); ?>
9598 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo htmlspecialchars( __("The format of series data. The format string is a subset of the ICU pattern set . For instance, '#,###%' will result in output values '1,000%', '750%', and '50%' for values 10, 7.5, and 0.5. Note: This option won't work if the axes 'Remove Extra Zeros' option is enabled.","chart-builder") ); ?>">
9599 <i class="ays_fa ays_fa_info_circle"></i>
9600 </a>
9601 </label>
9602 </div>
9603 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9604 <input type="text"
9605 id="ays-chart-option-series-format-<?php echo $key; ?>"
9606 class="ays-chart-option-series-format ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input"
9607 name="<?php echo esc_attr($html_name_prefix); ?>settings[series_format][<?php echo $key; ?>]"
9608 value="<?php echo isset($series_format[$key]) && '' !== $series_format[$key] ? esc_attr($series_format[$key]) : ''; ?>"
9609 data-series-id="<?php echo $key; ?>">
9610 </div>
9611 </div> <!-- Format -->
9612 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-line_chart-opt display_none">
9613 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9614 <label for="ays-chart-option-series-line-width">
9615 <?php echo esc_html(__( "Line width", "chart-builder" )); ?>
9616 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Line width in pixels. Set 0 for hiding all the lines and show only the point.","chart-builder") ); ?>">
9617 <i class="ays_fa ays_fa_info_circle"></i>
9618 </a>
9619 </label>
9620 </div>
9621 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9622 <input type="number"
9623 id="ays-chart-option-series-line-width-<?php echo esc_attr($key); ?>"
9624 class="ays-chart-option-series-line-width ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input"
9625 name="<?php echo esc_attr($html_name_prefix); ?>settings[series_line_width][<?php echo esc_attr($key); ?>]"
9626 value="<?php echo isset($series_line_width[$key]) ? esc_attr($series_line_width[$key]) : esc_attr($line_width); ?>"
9627 data-series-id="<?php echo esc_attr($key); ?>">
9628 </div>
9629 </div> <!-- Line width -->
9630 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-line_chart-opt display_none">
9631 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9632 <label for="ays-chart-option-series-point-size">
9633 <?php echo esc_html(__( "Point size", "chart-builder" )); ?>
9634 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Point size in pixels. Set 0 for hiding all points.","chart-builder") ); ?>">
9635 <i class="ays_fa ays_fa_info_circle"></i>
9636 </a>
9637 </label>
9638 </div>
9639 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9640 <input type="number"
9641 id="ays-chart-option-series-point-size-<?php echo esc_attr($key); ?>"
9642 class="ays-chart-option-series-point-size ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input"
9643 name="<?php echo esc_attr($html_name_prefix); ?>settings[series_point_size][<?php echo esc_attr($key); ?>]"
9644 value="<?php echo isset($series_point_size[$key]) ? esc_attr($series_point_size[$key]) : esc_attr($point_size); ?>"
9645 data-series-id="<?php echo esc_attr($key); ?>">
9646 </div>
9647 </div> <!-- Point size -->
9648 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-line_chart-opt display_none">
9649 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9650 <label for="ays-chart-option-series-point-shape">
9651 <?php echo esc_html(__( "Point shape", "chart-builder" )); ?>
9652 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The shape of individual data elements: 'Circle', 'Triangle', 'Square', 'Diamond', 'Star', or 'Polygon'.","chart-builder") ); ?>">
9653 <i class="ays_fa ays_fa_info_circle"></i>
9654 </a>
9655 </label>
9656 </div>
9657 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9658 <select
9659 id="ays-chart-option-series-point-shape-<?php echo esc_attr($key); ?>"
9660 class="ays-chart-option-series-point-shape <?php echo esc_attr($html_class_prefix) ?>option-select-input form-select"
9661 name="<?php echo esc_attr($html_name_prefix); ?>settings[series_point_shape][<?php echo esc_attr($key); ?>]"
9662 data-series-id="<?php echo esc_attr($key); ?>">
9663 >
9664 <?php
9665 $value = isset($series_point_shape[$key]) ? esc_attr($series_point_shape[$key]) : $point_shape;
9666 foreach ( $point_shape_options as $option_slug => $option ):
9667 $selected = ( $value === $option_slug ) ? 'selected' : '';
9668 ?>
9669 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
9670 <?php
9671 endforeach;
9672 ?>
9673 </select>
9674 </div>
9675 </div> <!-- Point shape -->
9676 </div>
9677 </div>
9678 </div>
9679 </fieldset>
9680 <?php
9681 endforeach;
9682 ?>
9683 </div>
9684 </div>
9685 <br>
9686 <blockquote>
9687 <?php echo esc_html(__( "Save the chart to update the data.", 'chart-builder' )); ?>
9688 <br>
9689 <?php echo sprintf(
9690 /* translators: %1$s: Opening <strong> tag, %2$s: Closing </strong> tag */
9691 esc_html(__( '%1$sNote:%2$s If you are not able to set the options, disable the row settings feature.', 'chart-builder' )),
9692 '<strong>',
9693 '</strong>'
9694 ); ?>
9695 </blockquote>
9696 </div>
9697 <?php
9698
9699 } else {
9700 ?>
9701 <div class="ays-accordion-data-main-wrap <?php echo esc_attr($html_class_prefix) ?>options-series-settings-tab cb-changable-tab cb-bar_chart-tab cb-column_chart-tab cb-line_chart-tab"></div>
9702 <?php
9703 }
9704
9705 $content = ob_get_clean();
9706
9707 $title = __( 'Series settings', "chart-builder" );
9708
9709 $sources['series_settings'] = array(
9710 'content' => $content,
9711 'title' => $title
9712 );
9713
9714 return $sources;
9715 }
9716
9717 public function settings_contents_row_settings( $sources, $args ){
9718 $html_class_prefix = $args['html_class_prefix'];
9719 $html_name_prefix = $args['html_name_prefix'];
9720 $settings = $args['settings'];
9721 $source = $args['source'];
9722 $source = isset($source["commonTypeCharts"]) ? $source["commonTypeCharts"] : $source;
9723 $source_chart_type = $args['source_chart_type'];
9724
9725 if (isset($source) && !empty($source)) {
9726 if ( !isset( $source[0] ) ) {
9727 if (count($source[1]) > 2) {
9728 $titles = array();
9729 for ($i = 0; $i < count($source[1]); $i++) {
9730 array_push($titles, __("Title", 'chart-builder').$i);
9731 }
9732 $source[0] = $titles;
9733 } else {
9734 $source[0] = array(
9735 __("Country", 'chart-builder'),
9736 __("Population", 'chart-builder'),
9737 );
9738 }
9739
9740 ksort($source);
9741 }
9742 }
9743
9744 array_shift($source);
9745 $rows = array_column($source, 0);
9746
9747 $enable_row_settings = $settings['enable_row_settings'];
9748 $series_color = $settings['series_color'][0] ?? '#3366cc';
9749 $rows_color = $settings['rows_color'];
9750 $rows_opacity = $settings['rows_opacity'];
9751
9752 ob_start();
9753 ?>
9754 <div class="ays-accordion-data-main-wrap <?php echo esc_attr($html_class_prefix) ?>options-row-settings-tab cb-changable-tab cb-bar_chart-tab cb-column_chart-tab cb-line_chart-tab">
9755 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
9756 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-bar_chart-opt cb-column_chart-opt cb-line_chart-opt">
9757 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9758 <label for="ays-chart-option-enable-row-settings">
9759 <?php echo esc_html(__( "Enable row settings", "chart-builder" )); ?>
9760 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable this option to be able to choose the row settings. If this option is disabled, you will be able to set the general color form the series settings.","chart-builder") ); ?>">
9761 <i class="ays_fa ays_fa_info_circle"></i>
9762 </a>
9763 </label>
9764 </div>
9765 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9766 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
9767 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch <?php echo esc_attr($html_class_prefix) ?>toggle-hidden-option" id="ays-chart-option-enable-row-settings" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[enable_row_settings]" value="on" <?php echo esc_attr($enable_row_settings); ?> >
9768 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
9769 </label>
9770 </div>
9771 </div> <!-- Enable row settings -->
9772 <div class="<?php echo esc_attr($html_class_prefix) ?>rows-settings <?php echo esc_attr($html_class_prefix) ?>hidden-options-section <?php echo $enable_row_settings === 'checked' ? '' : 'display_none'; ?>">
9773 <br>
9774 <?php
9775 foreach ( $rows as $key => $val ):
9776 ?>
9777 <fieldset class="ays-rows-accordion-options-container <?php echo esc_attr($html_class_prefix) ?>options-rows-<?php echo esc_attr($key); ?>" data-collapsed="true">
9778 <legend class="ays-rows-accordion-options-header">
9779 <svg class="ays-rows-accordion-arrow ays-rows-accordion-arrow-right" version="1.2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" overflow="visible" preserveAspectRatio="none" viewBox="0 0 24 24" width="20" height="20">
9780 <g>
9781 <path xmlns:default="http://www.w3.org/2000/svg" d="M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z" style="fill: #c4c4c4;" vector-effect="non-scaling-stroke" />
9782 </g>
9783 </svg>
9784 <span><?php echo esc_html($val); ?></span>
9785 </legend>
9786 <div class="ays-rows-accordion-options-content ays-rows-accordion-options-content">
9787 <div class="ays-rows-accordion-data-main-wrap">
9788 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
9789 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
9790 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9791 <label for="ays-chart-option-rows-color">
9792 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
9793 </label>
9794 </div>
9795 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9796 <input type="color"
9797 id="ays-chart-option-rows-color-<?php echo esc_attr($key); ?>"
9798 class="ays-chart-option-rows-color form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker"
9799 name="<?php echo esc_attr($html_name_prefix); ?>settings[rows_color][<?php echo esc_attr($key); ?>]"
9800 value="<?php echo isset($rows_color[$key]) && '' !== $rows_color[$key] ? esc_attr($rows_color[$key]) : esc_attr($series_color); ?>"
9801 data-rows-id="<?php echo esc_attr($key); ?>">
9802 </div>
9803 </div> <!-- color -->
9804 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
9805 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9806 <label for="ays-chart-option-rows-color">
9807 <?php echo esc_html(__( "Opacity", "chart-builder" )); ?>
9808 </label>
9809 </div>
9810 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9811 <input type="number"
9812 id="ays-chart-option-rows-opacity-<?php echo esc_attr($key); ?>"
9813 class="ays-chart-option-rows-opacity ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input"
9814 name="<?php echo esc_attr($html_name_prefix); ?>settings[rows_opacity][<?php echo esc_attr($key); ?>]"
9815 value="<?php echo isset($rows_opacity[$key]) && '' !== $rows_opacity[$key] ? esc_attr($rows_opacity[$key]) : 1.0; ?>"
9816 data-rows-id="<?php echo esc_attr($key); ?>"
9817 step=".1" min="0" max="1">
9818 </div>
9819 </div> <!-- opacity -->
9820 </div>
9821 </div>
9822 </div>
9823 </fieldset>
9824 <?php
9825 endforeach;
9826 ?>
9827 <br>
9828 <blockquote>
9829 <?php echo esc_html(__( "Save the chart to update the data.", 'chart-builder' )); ?>
9830 <br>
9831 <?php echo sprintf(
9832 /* translators: %1$s: Opening <strong> tag, %2$s: Closing </strong> tag */
9833 esc_html(__( '%1$sNote:%2$s The applied styles will work only if the chart has one column.', 'chart-builder' )),
9834 '<strong>',
9835 '</strong>'
9836 ); ?>
9837 </blockquote>
9838 </div>
9839 <div class="<?php echo esc_attr($html_class_prefix) ?>not-hidden-options-section <?php echo $enable_row_settings === 'checked' ? 'display_none' : ''; ?>">
9840 <br>
9841 <blockquote>
9842 <?php echo sprintf(
9843 /* translators: %1$s: Opening <strong> tag, %2$s: Closing </strong> tag */
9844 esc_html(__( '%1$sNote:%2$s If this option is disabled, the general options will be set from the series settings.', 'chart-builder' )),
9845 '<strong>',
9846 '</strong>'
9847 ); ?>
9848 </blockquote>
9849 </div>
9850 </div>
9851 </div>
9852 <?php
9853 $content = ob_get_clean();
9854
9855 $title = __( 'Row settings', "chart-builder" );
9856
9857 $sources['row_settings'] = array(
9858 'content' => $content,
9859 'title' => $title
9860 );
9861
9862 return $sources;
9863 }
9864
9865 public function ays_chart_disable_all_notice_from_plugin() {
9866 if (!function_exists('get_current_screen')) {
9867 return;
9868 }
9869
9870 $screen = get_current_screen();
9871
9872 if (empty($screen) || strpos($screen->id, $this->plugin_name) === false) {
9873 return;
9874 }
9875
9876 global $wp_filter;
9877
9878 // Keep plugin-specific notices
9879 $our_plugin_notices = array();
9880
9881 $exclude_functions = [
9882 'chart_builder_general_admin_notice',
9883 ];
9884
9885 if (!empty($wp_filter['admin_notices'])) {
9886 foreach ($wp_filter['admin_notices']->callbacks as $priority => $callbacks) {
9887 foreach ($callbacks as $key => $callback) {
9888 // For class-based methods
9889 if (
9890 is_array($callback['function']) &&
9891 is_object($callback['function'][0]) &&
9892 get_class($callback['function'][0]) === __CLASS__
9893 ) {
9894 $our_plugin_notices[$priority][$key] = $callback;
9895 }
9896 // For standalone functions
9897 elseif (
9898 is_string($callback['function']) &&
9899 in_array($callback['function'], $exclude_functions)
9900 ) {
9901 $our_plugin_notices[$priority][$key] = $callback;
9902 }
9903 }
9904 }
9905 }
9906
9907 // Remove all notices
9908 remove_all_actions('admin_notices');
9909 remove_all_actions('all_admin_notices');
9910
9911 // Re-add only your plugin's notices
9912 foreach ($our_plugin_notices as $priority => $callbacks) {
9913 foreach ($callbacks as $callback) {
9914 add_action('admin_notices', $callback['function'], $priority);
9915 }
9916 }
9917 }
9918
9919 }
9920