PluginProbe
Chartify – WordPress Chart Plugin / 3.7.1
Chartify – WordPress Chart Plugin v3.7.1
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.1, at admin/class-chart-builder-admin.php

9,918 lines 701.1 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 check_ajax_referer( $this->plugin_name . '-install-plugin-nonce', '_ajax_nonce' );
3242
3243
3244 // Check for permissions.
3245 if ( ! current_user_can( 'activate_plugins' ) ) {
3246 wp_send_json_error( esc_html__( 'Plugin activation is disabled for you on this site.', 'chart-builder' ) );
3247 }
3248
3249 $type = 'addon';
3250
3251 if ( isset( $_POST['plugin'] ) ) {
3252
3253 if ( ! empty( $_POST['type'] ) ) {
3254 $type = sanitize_key( $_POST['type'] );
3255 }
3256
3257 $plugin = sanitize_text_field( wp_unslash( $_POST['plugin'] ) );
3258 $activate = activate_plugins( $plugin );
3259
3260 if ( ! is_wp_error( $activate ) ) {
3261 if ( $type === 'plugin' ) {
3262 wp_send_json_success( esc_html__( 'Plugin activated.', 'chart-builder' ) );
3263 } else {
3264 ( esc_html__( 'Addon activated.', 'chart-builder' ) );
3265 }
3266 }
3267 }
3268
3269 if ( $type === 'plugin' ) {
3270 wp_send_json_error( esc_html__( 'Could not activate the plugin. Please activate it on the Plugins page.', 'chart-builder' ) );
3271 }
3272
3273 wp_send_json_error( esc_html__( 'Could not activate the addon. Please activate it on the Plugins page.', 'chart-builder' ) );
3274 }
3275
3276 /**
3277 * Install addon.
3278 *
3279 * @since 1.0.0
3280 * @since 6.4.0.4 Updated the permissions checking.
3281 */
3282 public function ays_chart_install_plugin() {
3283
3284 // Run a security check.
3285 check_ajax_referer( $this->plugin_name . '-install-plugin-nonce', '_ajax_nonce' );
3286
3287
3288 $generic_error = esc_html__( 'There was an error while performing your request.', 'chart-builder' );
3289 $type = ! empty( $_POST['type'] ) ? sanitize_key( $_POST['type'] ) : '';
3290
3291 // Check if new installations are allowed.
3292 if ( ! self::ays_chart_can_install( $type ) ) {
3293 wp_send_json_error( $generic_error );
3294 }
3295
3296 $error = $type === 'plugin'
3297 ? esc_html__( 'Could not install the plugin. Please download and install it manually.', 'chart-builder' )
3298 : "";
3299
3300 $plugin_url = ! empty( $_POST['plugin'] ) ? esc_url_raw( wp_unslash( $_POST['plugin'] ) ) : '';
3301
3302 if ( empty( $plugin_url ) ) {
3303 wp_send_json_error( $error );
3304 }
3305
3306 // Prepare variables.
3307 $url = esc_url_raw(
3308 add_query_arg(
3309 [
3310 'page' => 'chart-builder-featured-plugins',
3311 ],
3312 admin_url( 'admin.php' )
3313 )
3314 );
3315
3316 ob_start();
3317 $creds = request_filesystem_credentials( $url, '', false, false, null );
3318
3319 // Hide the filesystem credentials form.
3320 ob_end_clean();
3321
3322 // Check for file system permissions.
3323 if ( $creds === false ) {
3324 wp_send_json_error( $error );
3325 }
3326
3327 if ( ! WP_Filesystem( $creds ) ) {
3328 wp_send_json_error( $error );
3329 }
3330
3331 /*
3332 * We do not need any extra credentials if we have gotten this far, so let's install the plugin.
3333 */
3334 require_once CHART_BUILDER_DIR . 'includes/admin/class-chart-builder-upgrader.php';
3335 require_once CHART_BUILDER_DIR . 'includes/admin/class-chart-builder-install-skin.php';
3336 require_once CHART_BUILDER_DIR . 'includes/admin/class-chart-builder-skin.php';
3337
3338
3339 // Do not allow WordPress to search/download translations, as this will break JS output.
3340 remove_action( 'upgrader_process_complete', array( 'Language_Pack_Upgrader', 'async_upgrade' ), 20 );
3341
3342 // Create the plugin upgrader with our custom skin.
3343 $installer = new ChartBuilder\Helpers\ChartBuilderPluginSilentUpgrader( new Chart_Builder_Install_Skin() );
3344
3345 // Error check.
3346 if ( ! method_exists( $installer, 'install' ) ) {
3347 wp_send_json_error( $error );
3348 }
3349
3350 $installer->install( $plugin_url );
3351
3352 // Flush the cache and return the newly installed plugin basename.
3353 wp_cache_flush();
3354
3355 $plugin_basename = $installer->plugin_info();
3356
3357 if ( empty( $plugin_basename ) ) {
3358 wp_send_json_error( $error );
3359 }
3360
3361 $result = array(
3362 'msg' => $generic_error,
3363 'is_activated' => false,
3364 'basename' => $plugin_basename,
3365 );
3366
3367 // Check for permissions.
3368 if ( ! current_user_can( 'activate_plugins' ) ) {
3369 $result['msg'] = $type === 'plugin' ? esc_html__( 'Plugin installed.', 'chart-builder' ) : "";
3370
3371 wp_send_json_success( $result );
3372 }
3373
3374 // Activate the plugin silently.
3375 $activated = activate_plugin( $plugin_basename );
3376 remove_action( 'activated_plugin', array( 'ays_sccp_activation_redirect_method', 'gallery_p_gallery_activation_redirect_method', 'poll_maker_activation_redirect_method' ), 100 );
3377
3378 if ( ! is_wp_error( $activated ) ) {
3379
3380 $result['is_activated'] = true;
3381 $result['msg'] = $type === 'plugin' ? esc_html__( 'Plugin installed and activated.', 'chart-builder' ) : esc_html__( 'Addon installed and activated.', 'chart-builder' );
3382
3383 wp_send_json_success( $result );
3384 }
3385
3386 // Fallback error just in case.
3387 wp_send_json_error( $result );
3388 }
3389
3390 /**
3391 * List of AM plugins that we propose to install.
3392 *
3393 * @since 6.4.0.4
3394 *
3395 * @return array
3396 */
3397 protected function get_am_plugins() {
3398 if ( !isset( $_SESSION ) ) {
3399 session_start();
3400 }
3401
3402 $images_url = CHART_BUILDER_ADMIN_URL . '/images/icons/';
3403
3404 $plugin_slug = array(
3405 'fox-lms',
3406 'quiz-maker',
3407 'survey-maker',
3408 'chart-builder',
3409 'ays-popup-box',
3410 'secure-copy-content-protection',
3411 'gallery-photo-gallery',
3412 'ays-chatgpt-assistant',
3413 'easy-form',
3414 );
3415
3416 $plugin_url_arr = array();
3417 foreach ($plugin_slug as $key => $slug) {
3418 if ( isset( $_SESSION['ays_chart_our_product_links'] ) && !empty( $_SESSION['ays_chart_our_product_links'] )
3419 && isset( $_SESSION['ays_chart_our_product_links'][$slug] ) && !empty( $_SESSION['ays_chart_our_product_links'][$slug] ) ) {
3420 $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])) : "";
3421 } else {
3422 $latest_version = $this->ays_chart_get_latest_plugin_version($slug);
3423 $plugin_url = 'https://downloads.wordpress.org/plugin/'. $slug .'.zip';
3424 if ( $latest_version != '' ) {
3425 $plugin_url = 'https://downloads.wordpress.org/plugin/'. $slug .'.'. $latest_version .'.zip';
3426 $_SESSION['ays_chart_our_product_links'][$slug] = $plugin_url;
3427 }
3428 }
3429
3430 $plugin_url_arr[$slug] = $plugin_url;
3431 }
3432
3433 $plugins_array = array(
3434 'fox-lms/fox-lms.php' => array(
3435 'icon' => $images_url . 'icon-fox-lms-128x128.png',
3436 'name' => __( 'Fox LMS', 'chart-builder' ),
3437 'desc' => __( 'Build and manage online courses directly on your WordPress site.', 'chart-builder' ),
3438 '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' ),
3439 'wporg' => 'https://wordpress.org/plugins/fox-lms/',
3440 'buy_now' => 'https://foxlms.com/pricing/?utm_source=dashboard&utm_medium=chart-free&utm_campaign=fox-lms-our-products-page',
3441 'url' => $plugin_url_arr['fox-lms'],
3442 ),
3443 'quiz-maker/quiz-maker.php' => array(
3444 'icon' => $images_url . 'icon-quiz-128x128.png',
3445 'name' => __( 'Quiz Maker', 'chart-builder' ),
3446 'desc' => __( 'Create powerful and engaging quizzes, tests, and exams in minutes.', 'chart-builder' ),
3447 'desc_hidden' => __( 'Build an unlimited number of quizzes and questions.', 'chart-builder' ),
3448 'wporg' => 'https://wordpress.org/plugins/quiz-maker/',
3449 'buy_now' => 'https://ays-pro.com/wordpress/quiz-maker/',
3450 'url' => $plugin_url_arr['quiz-maker'],
3451 ),
3452 'survey-maker/survey-maker.php' => array(
3453 'icon' => $images_url . 'icon-survey-128x128.png',
3454 'name' => __( 'Survey Maker', 'chart-builder' ),
3455 'desc' => __( 'Make amazing online surveys and get real-time feedback quickly and easily.', 'chart-builder' ),
3456 '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' ),
3457 'wporg' => 'https://wordpress.org/plugins/survey-maker/',
3458 'buy_now' => 'https://ays-pro.com/wordpress/survey-maker',
3459 'url' => $plugin_url_arr['survey-maker'],
3460 ),
3461 'poll-maker/poll-maker-ays.php' => array(
3462 'icon' => $images_url . 'icon-poll-128x128.png',
3463 'name' => __( 'Poll Maker', 'chart-builder' ),
3464 'desc' => __( 'Create amazing online polls for your WordPress website super easily.', 'chart-builder' ),
3465 'desc_hidden' => __( 'Build up various types of polls in a minute and get instant feedback on any topic or product.', 'chart-builder' ),
3466 'wporg' => 'https://wordpress.org/plugins/poll-maker/',
3467 'buy_now' => 'https://ays-pro.com/wordpress/poll-maker/',
3468 'url' => $plugin_url_arr['poll-maker'],
3469 ),
3470 'ays-popup-box/ays-pb.php' => array(
3471 'icon' => $images_url . 'icon-popup-128x128.png',
3472 'name' => __( 'Popup Box', 'chart-builder' ),
3473 'desc' => __( 'Popup everything you want! Create informative and promotional popups all in one plugin.', 'chart-builder' ),
3474 'desc_hidden' => __( 'Attract your visitors and convert them into email subscribers and paying customers.', 'chart-builder' ),
3475 'wporg' => 'https://wordpress.org/plugins/ays-popup-box/',
3476 'buy_now' => 'https://ays-pro.com/wordpress/popup-box/',
3477 'url' => $plugin_url_arr['ays-popup-box'],
3478 ),
3479 'secure-copy-content-protection/secure-copy-content-protection.php' => array(
3480 'icon' => $images_url . 'icon-sccp-128x128.png',
3481 'name' => __( 'Secure Copy Content Protection', 'chart-builder' ),
3482 'desc' => __( 'Disable the right click, copy paste, content selection and copy shortcut keys on your website.', 'chart-builder' ),
3483 'desc_hidden' => __( 'Protect web content from being plagiarized. Prevent plagiarism from your website with this easy to use plugin.', 'chart-builder' ),
3484 'wporg' => 'https://wordpress.org/plugins/secure-copy-content-protection/',
3485 'buy_now' => 'https://ays-pro.com/wordpress/secure-copy-content-protection/',
3486 'url' => $plugin_url_arr['secure-copy-content-protection'],
3487 ),
3488 'gallery-photo-gallery/gallery-photo-gallery.php' => array(
3489 'icon' => $images_url . 'icon-gallery-128x128.png',
3490 'name' => __( 'Gallery Photo Gallery', 'chart-builder' ),
3491 'desc' => __( 'Create unlimited galleries and include unlimited images in those galleries.', 'chart-builder' ),
3492 'desc_hidden' => __( 'Represent images in an attractive way. Attract people with your own single and multiple free galleries from your photo library.', 'chart-builder' ),
3493 'wporg' => 'https://wordpress.org/plugins/gallery-photo-gallery/',
3494 'buy_now' => 'https://ays-pro.com/wordpress/photo-gallery/',
3495 'url' => $plugin_url_arr['gallery-photo-gallery'],
3496 ),
3497 'ays-chatgpt-assistant/ays-chatgpt-assistant.php' => array(
3498 'icon' => $images_url . 'icon-chatgpt-128x128.png',
3499 'name' => __( 'AI Assistant with ChatGPT', 'chart-builder' ),
3500 'desc' => __( 'ChatGPT AI Assistant plugin gives you the ability to automate various tasks related to content creation and programming.', 'chart-builder' ),
3501 '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' ),
3502 'wporg' => 'https://wordpress.org/plugins/ays-chatgpt-assistant/',
3503 'buy_now' => 'https://ays-pro.com/wordpress/chatgpt-assistant',
3504 'url' => $plugin_url_arr['ays-chatgpt-assistant'],
3505 ),
3506 'easy-form/easy-form.php' => array(
3507 'icon' => $images_url . 'icon-form-128x128.png',
3508 'name' => __( 'Easy Form', 'chart-builder' ),
3509 'desc' => __( 'Choose the best WordPress form builder plugin. ', 'chart-builder' ),
3510 'desc_hidden' => __( 'Create contact forms, payment forms, surveys, and many more custom forms. Build forms easily with us.', 'chart-builder' ),
3511 'wporg' => 'https://wordpress.org/plugins/easy-form/',
3512 'buy_now' => 'https://ays-pro.com/wordpress/easy-form',
3513 'url' => $plugin_url_arr['easy-form'],
3514 ),
3515 );
3516
3517 return $plugins_array;
3518 }
3519
3520 protected function ays_chart_get_latest_plugin_version( $slug ){
3521
3522 if ( is_null( $slug ) || empty($slug) ) {
3523 return "";
3524 }
3525
3526 $version_latest = "";
3527
3528 if ( ! function_exists( 'plugins_api' ) ) {
3529 require_once( ABSPATH . 'wp-admin/includes/plugin-install.php' );
3530 }
3531
3532 // set the arguments to get latest info from repository via API ##
3533 $args = array(
3534 'slug' => $slug,
3535 'fields' => array(
3536 'version' => true,
3537 )
3538 );
3539
3540 /** Prepare our query */
3541 $call_api = plugins_api( 'plugin_information', $args );
3542
3543 /** Check for Errors & Display the results */
3544 if ( is_wp_error( $call_api ) ) {
3545 $api_error = $call_api->get_error_message();
3546 } else {
3547
3548 //echo $call_api;
3549 // everything ##
3550 if ( ! empty( $call_api->version ) ) {
3551 $version_latest = $call_api->version;
3552 }
3553 }
3554
3555 return $version_latest;
3556 }
3557
3558 /**
3559 * Get AM plugin data to display in the Addons section of About tab.
3560 *
3561 * @since 6.4.0.4
3562 *
3563 * @param string $plugin Plugin slug.
3564 * @param array $details Plugin details.
3565 * @param array $all_plugins List of all plugins.
3566 *
3567 * @return array
3568 */
3569 protected function get_plugin_data( $plugin, $details, $all_plugins ) {
3570
3571 $have_pro = ( ! empty( $details['pro'] ) && ! empty( $details['pro']['plug'] ) );
3572 $show_pro = false;
3573
3574 $plugin_data = array();
3575
3576 if ( $have_pro ) {
3577 if ( array_key_exists( $plugin, $all_plugins ) ) {
3578 if ( is_plugin_active( $plugin ) ) {
3579 $show_pro = true;
3580 }
3581 }
3582 if ( array_key_exists( $details['pro']['plug'], $all_plugins ) ) {
3583 $show_pro = true;
3584 }
3585 if ( $show_pro ) {
3586 $plugin = $details['pro']['plug'];
3587 $details = $details['pro'];
3588 }
3589 }
3590
3591 if ( array_key_exists( $plugin, $all_plugins ) ) {
3592 if ( is_plugin_active( $plugin ) ) {
3593 // Status text/status.
3594 $plugin_data['status_class'] = 'status-active';
3595 $plugin_data['status_text'] = esc_html__( 'Active', 'chart-builder' );
3596 // Button text/status.
3597 $plugin_data['action_class'] = $plugin_data['status_class'] . ' ays-chart-card__btn-info disabled';
3598 $plugin_data['action_text'] = esc_html__( 'Activated', 'chart-builder' );
3599 $plugin_data['plugin_src'] = esc_attr( $plugin );
3600 } else {
3601 // Status text/status.
3602 $plugin_data['status_class'] = 'status-installed';
3603 $plugin_data['status_text'] = esc_html__( 'Inactive', 'chart-builder' );
3604 // Button text/status.
3605 $plugin_data['action_class'] = $plugin_data['status_class'] . ' ays-chart-card__btn-info';
3606 $plugin_data['action_text'] = esc_html__( 'Activate', 'chart-builder' );
3607 $plugin_data['plugin_src'] = esc_attr( $plugin );
3608 }
3609 } else {
3610 // Doesn't exist, install.
3611 // Status text/status.
3612 $plugin_data['status_class'] = 'status-missing';
3613
3614 if ( isset( $details['act'] ) && 'go-to-url' === $details['act'] ) {
3615 $plugin_data['status_class'] = 'status-go-to-url';
3616 }
3617 $plugin_data['status_text'] = esc_html__( 'Not Installed', 'chart-builder' );
3618 // Button text/status.
3619 $plugin_data['action_class'] = $plugin_data['status_class'] . ' ays-chart-card__btn-info';
3620 $plugin_data['action_text'] = esc_html__( 'Install Plugin', 'chart-builder' );
3621 $plugin_data['plugin_src'] = esc_url( $details['url'] );
3622 }
3623
3624 $plugin_data['details'] = $details;
3625
3626 return $plugin_data;
3627 }
3628
3629 /**
3630 * Display the Addons section of About tab.
3631 *
3632 * @since 6.4.0.4
3633 */
3634 public function output_about_addons() {
3635
3636 if ( ! function_exists( 'get_plugins' ) ) {
3637 require_once ABSPATH . 'wp-admin/includes/plugin.php';
3638 }
3639
3640 $all_plugins = get_plugins();
3641 $am_plugins = $this->get_am_plugins();
3642 $can_install_plugins = self::ays_chart_can_install( 'plugin' );
3643 $can_activate_plugins = self::ays_chart_can_activate( 'plugin' );
3644
3645 $content = '';
3646 $content.= '<div class="ays-chart-cards-block">';
3647 foreach ( $am_plugins as $plugin => $details ){
3648
3649 $plugin_data = $this->get_plugin_data( $plugin, $details, $all_plugins );
3650 $plugin_ready_to_activate = $can_activate_plugins
3651 && isset( $plugin_data['status_class'] )
3652 && $plugin_data['status_class'] === 'status-installed';
3653 $plugin_not_activated = ! isset( $plugin_data['status_class'] )
3654 || $plugin_data['status_class'] !== 'status-active';
3655
3656 $plugin_action_class = ( isset( $plugin_data['action_class'] ) && esc_attr( $plugin_data['action_class'] ) != "" ) ? esc_attr( $plugin_data['action_class'] ) : "";
3657
3658 $plugin_action_class_disbaled = "";
3659 if ( strpos($plugin_action_class, 'status-active') !== false ) {
3660 $plugin_action_class_disbaled = "disbaled='true'";
3661 }
3662
3663 $content .= '
3664 <div class="ays-chart-card">
3665 <div class="ays-chart-card__content flexible">
3666 <div class="ays-chart-card__content-img-box">
3667 <img class="ays-chart-card__img" src="'. esc_url( $plugin_data['details']['icon'] ) .'" alt="'. esc_attr( $plugin_data['details']['name'] ) .'">
3668 </div>
3669 <div class="ays-chart-card__text-block">
3670 <h5 class="ays-chart-card__title">'. esc_html( $plugin_data['details']['name'] ) .'</h5>
3671 <p class="ays-chart-card__text">'. wp_kses_post( $plugin_data['details']['desc'] ) .'
3672 <span class="ays-chart-card__text-hidden">
3673 '. wp_kses_post( $plugin_data['details']['desc_hidden'] ) .'
3674 </span>
3675 </p>
3676 </div>
3677 </div>
3678 <div class="ays-chart-card__footer">';
3679 if ( $can_install_plugins || $plugin_ready_to_activate || ! $details['wporg'] ) {
3680 $content .= '<button class="'. esc_attr( $plugin_data['action_class'] ) .'" data-plugin="'. esc_attr( $plugin_data['plugin_src'] ) .'" data-type="plugin" '. $plugin_action_class_disbaled .'>
3681 '. wp_kses_post( $plugin_data['action_text'] ) .'
3682 </button>';
3683 }
3684 elseif ( $plugin_not_activated ) {
3685 $content .= '<a href="'. esc_url( $details['wporg'] ) .'" target="_blank" rel="noopener noreferrer">
3686 '. esc_html_e( 'WordPress.org', 'chart-builder' ) .'
3687 <span aria-hidden="true" class="dashicons dashicons-external"></span>
3688 </a>';
3689 }
3690 $content .='
3691 <a target="_blank" href="'. esc_url( $plugin_data['details']['buy_now'] ) .'" class="ays-chart-card__btn-primary">'. __('Buy Now', 'chart-builder') .'</a>
3692 </div>
3693 </div>';
3694 }
3695 $install_plugin_nonce = wp_create_nonce( $this->plugin_name . '-install-plugin-nonce' );
3696 $content.= '<input type="hidden" id="ays_chart_ajax_install_plugin_nonce" name="ays_chart_ajax_install_plugin_nonce" value="'. $install_plugin_nonce .'">';
3697 $content.= '</div>';
3698
3699 echo html_entity_decode($content);
3700 }
3701
3702 /**
3703 * Returns the data from Quiz maker.
3704 *
3705 * @access public
3706 */
3707 public function fetch_quiz_maker_data(){
3708 check_ajax_referer( 'cbuilder-fetch-quiz-maker-data', 'security' );
3709
3710 $params = isset($_REQUEST['params']) ? $_REQUEST['params'] : array();
3711 if ( !isset($params) || empty($params) ) {
3712 return array(
3713 'success' => false,
3714 'data' => array(
3715 'msg' => __( "Something went wrong.", "chart-builder" )
3716 )
3717 );
3718 }
3719
3720 $query = isset($params['query']) && $params['query'] !== '' ? $params['query'] : '';
3721 if ( $query == '' ) {
3722 return array(
3723 'success' => false,
3724 'data' => array(
3725 'msg' => __( "No data given.", "chart-builder" )
3726 )
3727 );
3728 }
3729 $quiz_id = isset($params['quizID']) && $params['quizID'] !== '' ? $params['quizID'] : null;
3730 $user_id = get_current_user_id();
3731
3732 $return_results = CBFunctions()->get_quiz_query($query, $quiz_id, $user_id);
3733
3734 if (empty($return_results)) {
3735 return array(
3736 'success' => false,
3737 'data' => array(
3738 'msg' => __( "Something went wrong.", "chart-builder" )
3739 )
3740 );
3741 }
3742
3743 $result_values = $return_results['result'];
3744 $query = $return_results['query'];
3745
3746 if (empty($result_values)) {
3747 return array(
3748 'success' => false,
3749 'data' => array(
3750 'msg' => $return_results['message']
3751 )
3752 );
3753 }
3754
3755 if (count($return_results['result'][0]) != 1 ) {
3756 $results = array();
3757 $headers = array();
3758 if ( $result_values ) {
3759 $row_num = 0;
3760 foreach ( $result_values as $row ) {
3761 $result = array();
3762 foreach ( $row as $k => $v ) {
3763 $result[] = $v;
3764 if ( $row_num === 0 ) {
3765 $headers[] = $k;
3766 }
3767 }
3768 $results[] = $result;
3769 $row_num++;
3770 }
3771 }
3772 } else if (count($return_results['result'][0]) == 1) {
3773 $results = array();
3774 $headers = array();
3775 if ( $result_values ) {
3776 $row_num = 0;
3777 foreach ( $result_values as $index => $row ) {
3778 $result = array();
3779 foreach ( $row as $k => $v ) {
3780 $result[] = strval($index) + 1;
3781 $result[] = $v;
3782 if ( $row_num === 0 ) {
3783 $headers[] = 'Quiz';
3784 $headers[] = $k;
3785 }
3786 }
3787 $results[] = $result;
3788 $row_num++;
3789 }
3790 }
3791 }
3792
3793 if (empty($results)) {
3794 return array(
3795 'success' => false,
3796 'data' => array(
3797 'msg' => $return_results['message']
3798 )
3799 );
3800 }
3801
3802 foreach ($results as $key => $value) {
3803 if (!isset($value) || count($value) <= 1 && $key != 0) {
3804 unset($results[$key]);
3805 }
3806 }
3807
3808 array_unshift($results, $headers);
3809 $results = array_values( $results );
3810 $data = $results;
3811
3812 $headers = $results[0];
3813 unset( $results[0] );
3814
3815 $html = CBFunctions()->get_table_html( $headers, $results );
3816
3817 return array(
3818 'success' => true,
3819 'data' => array(
3820 'table' => $html,
3821 'data' => $data
3822 )
3823 );
3824 }
3825
3826 /**
3827 * Saves the Quiz maker data.
3828 *
3829 * @access public
3830 */
3831 public function save_quiz_maker_data() {
3832 check_ajax_referer( 'cbuilder-save-quiz-maker-data', 'security' );
3833
3834 $params = isset($_REQUEST['params']) ? $_REQUEST['params'] : array();
3835 if ( !isset($params) || empty($params) ) {
3836 return array(
3837 'success' => false,
3838 'data' => array(
3839 'msg' => __( "Something went wrong.", "chart-builder" )
3840 )
3841 );
3842 }
3843
3844 $query_id = isset($params['query']) && $params['query'] !== '' ? $params['query'] : '';
3845 if ( $query_id == '' ) {
3846 return array(
3847 'success' => false,
3848 'data' => array(
3849 'msg' => __( "No data given.", "chart-builder" )
3850 )
3851 );
3852 }
3853
3854 $chart_id = isset( $params['chart_id'] ) ? absint( $params['chart_id'] ) : 0;
3855 $quiz_id = isset($params['quizID']) && $params['quizID'] !== '' ? $params['quizID'] : 0;
3856 $user_id = get_current_user_id();
3857
3858 if ( $chart_id >= 0 ) {
3859
3860 $return_results = CBFunctions()->get_quiz_query($query_id, $quiz_id, $user_id);
3861
3862 if (empty($return_results)) {
3863 return array(
3864 'success' => false,
3865 'data' => array(
3866 'msg' => __( "Something went wrong.", "chart-builder" )
3867 )
3868 );
3869 }
3870
3871 $result_values = $return_results['result'];
3872 $query = $return_results['query'];
3873
3874 if (empty($result_values)) {
3875 return array(
3876 'success' => false,
3877 'data' => array(
3878 'msg' => $return_results['message']
3879 )
3880 );
3881 }
3882
3883 if ( !empty($result_values) && count($return_results['result'][0]) != 1 ) {
3884 $results = array();
3885 $headers = array();
3886 if ( $result_values ) {
3887 $row_num = 0;
3888 foreach ( $result_values as $row ) {
3889 $result = array();
3890 foreach ( $row as $k => $v ) {
3891 $result[] = $v;
3892 if ( $row_num === 0 ) {
3893 $headers[] = $k;
3894 }
3895 }
3896 $results[] = $result;
3897 $row_num++;
3898 }
3899 }
3900 } else if (count($return_results['result'][0]) == 1) {
3901 $results = array();
3902 $headers = array();
3903 if ( $result_values ) {
3904 $row_num = 0;
3905 foreach ( $result_values as $index => $row ) {
3906 $result = array();
3907 foreach ( $row as $k => $v ) {
3908 $result[] = strval($index) + 1;
3909 $result[] = $v;
3910 if ( $row_num === 0 ) {
3911 $headers[] = 'Quiz';
3912 $headers[] = $k;
3913 }
3914 }
3915 $results[] = $result;
3916 $row_num++;
3917 }
3918 }
3919 }
3920
3921 $source_type = 'quiz_maker';
3922 $option_name_for_data = $chart_id == 0 ? 'ays_chart_quiz_maker_results_temp' : 'ays_chart_quiz_maker_results_' . $chart_id;
3923 $option_name_for_quiz = $chart_id == 0 ? 'ays_chart_quiz_maker_quiz_data_temp' : 'ays_chart_quiz_maker_quiz_data_' . $chart_id;
3924
3925 update_option( $option_name_for_data, array(
3926 'source_type' => $source_type,
3927 'source' => $query,
3928 'data' => $results,
3929 ) );
3930 update_option( $option_name_for_quiz, array(
3931 'quiz_query' => $query_id,
3932 'quiz_id' => $quiz_id
3933 ) );
3934
3935 } else {
3936 return array(
3937 'success' => false,
3938 'data' => array(
3939 'msg' => __( 'Given incorrect Chart ID.', "chart-builder")
3940 )
3941 );
3942 }
3943
3944 return array(
3945 'success' => true,
3946 'data' => array(
3947 'msg' => __( 'Data was successfully saved.', "chart-builder" )
3948 )
3949 );
3950 }
3951
3952 /**
3953 * Chart page action hooks
3954 */
3955
3956 /**
3957 * Chart page sources contents
3958 * @param $args
3959 */
3960 public function ays_chart_page_source_contents( $args ){
3961 $chart_source_type = $args['chart_source_type'];
3962
3963 if ($chart_source_type === 'chart-js') {
3964 $sources_contents = apply_filters( 'ays_cb_chart_page_sources_contents_settings_chartjs', array(), $args );
3965 } else {
3966 $sources_contents = apply_filters( 'ays_cb_chart_page_sources_contents_settings', array(), $args );
3967 }
3968
3969 $source_type = $args['source_type'];
3970
3971 $sources = array();
3972 foreach ( $sources_contents as $key => $sources_content ) {
3973 $collapsed = $key == $source_type ? 'false' : 'true';
3974
3975 $content = '<fieldset class="ays-accordion-options-container" data-collapsed="'. $collapsed .'">';
3976 if( isset( $sources_content['title'] ) ){
3977 $content .= '<legend class="ays-accordion-options-header">';
3978 $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">
3979 <g>
3980 <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" />
3981 </g>
3982 </svg>';
3983
3984 $content .= '<span>'. $sources_content['title'] .'</span></legend>';
3985 }
3986
3987 $content .= '<div class="ays-accordion-options-content">';
3988 $content .= $sources_content['content'];
3989 $content .= '</div>';
3990
3991 $content .= '</fieldset>';
3992
3993 $sources[] = $content;
3994 }
3995 $content_for_escape = implode('' , $sources );
3996 echo html_entity_decode( esc_html($content_for_escape) );
3997 }
3998
3999 public function source_contents_import_from_csv_settings( $sources, $args ){
4000 $html_class_prefix = $args['html_class_prefix'];
4001 $html_name_prefix = $args['html_name_prefix'];
4002
4003 ob_start();
4004 ?>
4005 <div class="ays-accordion-data-main-wrap ays-pro-features-v2-main-box" style="padding:10px;">
4006 <div class="ays-pro-features-v2-big-buttons-box">
4007 <a href="https://www.youtube.com/watch?v=tZ8K3y0qOEY" target="_blank" class="ays-pro-features-v2-video-button">
4008 <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>
4009 <div class="ays-pro-features-v2-video-text">
4010 <?php echo esc_html__("Watch Video" , "chart-builder"); ?>
4011 </div>
4012 </a>
4013 <a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-pro-features-v2-upgrade-button">
4014 <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>
4015 <div class="ays-pro-features-v2-upgrade-text">
4016 <?php echo esc_html__("Upgrade" , "chart-builder"); ?>
4017 </div>
4018 </a>
4019 </div>
4020 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-main ays-accordion-data-main-wrap">
4021 <div class="<?php echo esc_attr($html_class_prefix) ?>file-import-form">
4022 <h6><?php echo esc_html__("Choose what kind of data would you like to upload.", "chart-builder"); ?></h6>
4023 <select class="form-select" style="max-width: none;" id="<?php echo esc_attr($html_class_prefix) ?>import-files-file-type">
4024 <option value="csv">CSV File</option>
4025 </select>
4026 <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>
4027 <p class="<?php echo esc_attr($html_class_prefix) ?>csv-export-example" style="font-size: 15px; font-style: italic;">Example:
4028 <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>
4029 </p>
4030 <div>
4031 <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" />
4032 </div>
4033 <div class='ays-chart-file-import-success'></div>
4034 <div class='ays-chart-file-import-error'></div>
4035 <div class="ays-chart-buttons-group">
4036 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-file-import-fetch">
4037 <?php echo esc_html__( 'Show Results', "chart-builder" ); ?>
4038 </button>
4039 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-file-import-show-on-chart">
4040 <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>
4041 <?php echo esc_html__( 'Preview', "chart-builder" ); ?>
4042 </button>
4043 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-file-import-save">
4044 <?php echo esc_html__( 'Save data', "chart-builder" ); ?>
4045 </button>
4046 </div>
4047 </div>
4048 </div>
4049 </div>
4050 <?php
4051 $content = ob_get_clean();
4052
4053 $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") . '">
4054 <i class="ays_fa ays_fa_info_circle"></i>
4055 </a>';
4056
4057 $sources['file_import'] = array(
4058 'content' => $content,
4059 'title' => $title
4060 );
4061
4062 return $sources;
4063 }
4064
4065 public function source_contents_import_from_db_settings( $sources, $args ){
4066 $html_class_prefix = $args['html_class_prefix'];
4067 $html_name_prefix = $args['html_name_prefix'];
4068
4069 ob_start();
4070 ?>
4071 <div class="ays-accordion-data-main-wrap ays-pro-features-v2-main-box" style="padding:10px;">
4072 <div class="ays-pro-features-v2-big-buttons-box">
4073 <a href="https://www.youtube.com/watch?v=tZ8K3y0qOEY" target="_blank" class="ays-pro-features-v2-video-button">
4074 <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>
4075 <div class="ays-pro-features-v2-video-text">
4076 <?php echo esc_html__("Watch Video" , "chart-builder"); ?>
4077 </div>
4078 </a>
4079 <a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-pro-features-v2-upgrade-button">
4080 <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>
4081 <div class="ays-pro-features-v2-upgrade-text">
4082 <?php echo esc_html__("Upgrade" , "chart-builder"); ?>
4083 </div>
4084 </a>
4085 </div>
4086 <div class="<?php echo esc_attr( $html_class_prefix ) ?>source-data-main-wrap ays-accordion-data-main-wrap ">
4087 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-main">
4088 <div id="ays-chart-db-query">
4089 <div class="<?php echo esc_attr($html_class_prefix) ?>-db-query-form">
4090 <div id="db-query-form">
4091 <input type="hidden" name="chart_id" value="1">
4092 <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>
4093 <div class='db-wizard-success'></div>
4094 <div class='db-wizard-error'></div>
4095 </div>
4096 <div class="ays-chart-db-query-form-button ays-chart-buttons-group">
4097 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-query-fetch">
4098 <?php echo esc_html__( 'Show Results', "chart-builder" ); ?>
4099 </button>
4100 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-query-show-on-chart">
4101 <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>
4102 <?php echo esc_html__( 'Preview', "chart-builder" ); ?>
4103 </button>
4104 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-query-save">
4105 <?php echo esc_html__( 'Save data', "chart-builder" ); ?>
4106 </button>
4107 </div>
4108 </div>
4109 <div class="db-wizard-hints">
4110 <ul>
4111 <!-- <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> -->
4112 <li>
4113 <?php
4114 echo sprintf(
4115 /* translators: %1$s and %2$s are HTML span tags for styling. */
4116 esc_html__( 'Use %1$sControl+Space%2$s for autocompleting keywords or table names.', 'chart-builder' ),
4117 '<span class="ays-chart-emboss">',
4118 '</span>'
4119 );
4120 ?>
4121 </li>
4122 </ul>
4123 </div>
4124 </div>
4125 </div>
4126 </div>
4127 </div>
4128 <?php
4129 $content = ob_get_clean();
4130
4131 $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') . '">
4132 <i class="ays_fa ays_fa_info_circle"></i>
4133 </a>';
4134
4135 $sources['import_from_db'] = array(
4136 'content' => $content,
4137 'title' => $title
4138 );
4139
4140 return $sources;
4141 }
4142
4143 public function source_contents_import_from_external_db_settings( $sources, $args ){
4144 $html_class_prefix = $args['html_class_prefix'];
4145 $html_name_prefix = $args['html_name_prefix'];
4146
4147 ob_start();
4148 ?>
4149 <div class="ays-accordion-data-main-wrap ays-pro-features-v2-main-box" style="padding:10px;">
4150 <div class="ays-pro-features-v2-big-buttons-box">
4151 <a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-pro-features-v2-upgrade-button">
4152 <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>
4153 <div class="ays-pro-features-v2-upgrade-text">
4154 <?php echo esc_html__("Upgrade" , "chart-builder"); ?>
4155 </div>
4156 </a>
4157 </div>
4158 <div class="<?php echo esc_attr($html_class_prefix) ?>source-data-main-wrap ays-accordion-data-main-wrap ">
4159 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-main">
4160 <div class="form-group row mb-2">
4161 <div class="col-sm-8 <?php echo esc_attr($html_class_prefix) ?>option-title">
4162 <label class="form-label">
4163 <?php echo esc_html(__('Use custom database settings for this chart', "chart-builder")); ?>
4164 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __(".","chart-builder") ); ?>">
4165 <i class="ays_fa ays_fa_info_circle"></i>
4166 </a>
4167 </label>
4168 </div>
4169 <div class="col-sm-3 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
4170 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
4171 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" type="checkbox" />
4172 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
4173 </label>
4174 </div>
4175 </div>
4176 <div id="ays-chart-external-db-query">
4177 <div class="<?php echo esc_attr($html_class_prefix) ?>-db-query-form">
4178 <div id="external-db-query-form">
4179 <input type="hidden" name="chart_id" value="1">
4180 <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>
4181 <div class='db-wizard-success'></div>
4182 <div class='db-wizard-error'></div>
4183 </div>
4184 <div class="ays-chart-db-query-form-button ays-chart-buttons-group">
4185 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-external-query-fetch">
4186 <?php echo esc_html__( 'Show Results', "chart-builder" ); ?>
4187 </button>
4188 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-external-query-show-on-chart">
4189 <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>
4190 <?php echo esc_html__( 'Preview', "chart-builder" ); ?>
4191 </button>
4192 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-external-query-save">
4193 <?php echo esc_html__( 'Save data', "chart-builder" ); ?>
4194 </button>
4195 </div>
4196 </div>
4197 <div class="db-wizard-hints">
4198 <ul>
4199 <!-- <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> -->
4200 <li>
4201 <?php
4202 echo sprintf(
4203 /* translators: %1$s and %2$s are HTML span tags for styling. */
4204 esc_html__( 'Use %1$sControl+Space%2$s for autocompleting keywords or table names.', 'chart-builder' ),
4205 '<span class="ays-chart-emboss">',
4206 '</span>'
4207 );
4208 ?>
4209 </li>
4210 </ul>
4211 </div>
4212 </div>
4213 </div>
4214 </div>
4215 </div>
4216 <?php
4217 $content = ob_get_clean();
4218
4219 $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') . '">
4220 <i class="ays_fa ays_fa_info_circle"></i>
4221 </a>';
4222
4223 $sources['import_from_external_db'] = array(
4224 'content' => $content,
4225 'title' => $title
4226 );
4227
4228 return $sources;
4229 }
4230
4231 public function source_contents_quiz_maker_integration_settings( $sources, $args ){
4232 global $wpdb;
4233 $chart_id = $args['chart_id'];
4234 $html_class_prefix = $args['html_class_prefix'];
4235 $html_name_prefix = $args['html_name_prefix'];
4236 $source = $args['source'];
4237 $settings = $args['settings'];
4238 $quiz_queries = $args['quiz_queries'];
4239 $quiz_query_tooltips = $args['quiz_query_tooltips'];
4240 $quiz_id = $args['quiz_id'];
4241 $quiz_query = $args['quiz_query'];
4242
4243 if ( !is_plugin_active('quiz-maker/quiz-maker.php') ) {
4244 // $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") . '">
4245 // <i class="ays_fa ays_fa_info_circle"></i>
4246 // </a>', '<br>', '<b>', '</b>');
4247 // $content = $this->blockquote_content_quiz;
4248 // $sources['quiz_maker'] = array(
4249 // 'content' => $content,
4250 // 'title' => $title
4251 // );
4252
4253 return $sources;
4254 }
4255 $quizes = $wpdb->get_results( // phpcs:ignore
4256 $wpdb->prepare(
4257 "SELECT `title`, `id` FROM {$wpdb->prefix}aysquiz_quizes
4258 WHERE `published` = %d AND `question_ids` <> %s",
4259 1,
4260 ''
4261 ),
4262 ARRAY_A
4263 );
4264
4265
4266 ob_start();
4267 ?>
4268 <div class="ays-accordion-data-main-wrap">
4269 <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">
4270 <div id="<?php echo esc_attr($html_class_prefix) ?>quiz-maker-form">
4271 <input type="hidden" class="<?php echo esc_attr($html_class_prefix) ?>chart-id" value="<?php echo esc_attr($chart_id) ?>">
4272 <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">
4273 <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' ) ?>">
4274 <i class="ays_fa ays_fa_info_circle"></i>
4275 </a>
4276 <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">
4277 <option value=""><?php echo esc_html__( "Select query", "chart-builder" ) ?></option>
4278 <?php foreach ( $quiz_queries as $id => $q):
4279 $disabled = preg_replace('/[^0-9]/', '', $id) <= 6 ? "false" : "true" ; ?>
4280 <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>
4281 <?php endforeach; ?>
4282 </select>
4283 </div>
4284 <div class="<?php echo esc_attr($html_class_prefix) ?>select-quiz-maker-quiz-container">
4285 <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">
4286 <option value="0"><?php echo esc_html__( "Select quiz", "chart-builder" ) ?></option>
4287 <?php foreach ( $quizes as $quiz): ?>
4288 <option value="<?php echo esc_attr($quiz['id']) ?>" <?php echo $quiz_id == $quiz['id'] ? 'selected' : '' ?> ><?php echo esc_html($quiz['title'] )?></option>
4289 <?php endforeach; ?>
4290 </select>
4291 </div>
4292 <div id="ays-chart-quiz-maker-success"></div>
4293 <div id="ays-chart-quiz-maker-error"></div>
4294 <div class="ays-chart-buttons-group">
4295 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-quiz-maker-fetch">
4296 <?php echo esc_html__( 'Show Results', "chart-builder" ); ?>
4297 </button>
4298 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-quiz-maker-show-on-chart">
4299 <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>
4300 <?php echo esc_html__( 'Preview', "chart-builder" ); ?>
4301 </button>
4302 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-quiz-maker-save">
4303 <?php echo esc_html__( 'Save data', "chart-builder" ); ?>
4304 </button>
4305 </div>
4306 </div>
4307 <div>
4308 <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>
4309 </div>
4310 </div>
4311 </div>
4312 <?php
4313 $content = ob_get_clean();
4314
4315 $title = sprintf(
4316 /* translators: %1$s: Line break, %2$s: Opening bold tag, %3$s: Closing bold tag. */
4317 __( 'Get Quiz Maker data', 'chart-builder' ) .
4318 ' <a class="ays_help" data-bs-toggle="tooltip" data-bs-html="true" title="' .
4319 /* translators: %1$s: Line break, %2$s: Opening bold tag, %3$s: Closing bold tag. */
4320 __( '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' ) . '">
4321 <i class="ays_fa ays_fa_info_circle"></i>
4322 </a>',
4323 '<br>', '<b>', '</b>'
4324 );
4325 $sources['quiz_maker'] = array(
4326 'content' => $content,
4327 'title' => $title
4328 );
4329
4330 return $sources;
4331 }
4332
4333 public function source_contents_woocommerce_integration_settings( $sources, $args ){
4334 if ( !is_plugin_active('woocommerce/woocommerce.php') ) {
4335 return $sources;
4336 }
4337
4338 $chart_id = $args['chart_id'];
4339 $html_class_prefix = $args['html_class_prefix'];
4340 $html_name_prefix = $args['html_name_prefix'];
4341 ob_start();
4342 ?>
4343 <div class="ays-accordion-data-main-wrap ays-accordion-data-main-wrap-woocommerce ays-pro-features-v2-main-box" style="padding:10px;">
4344 <div class="ays-pro-features-v2-big-buttons-box">
4345 <div class="ays-pro-features-v2-video-button"></div>
4346 <a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-pro-features-v2-upgrade-button">
4347 <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>
4348 <div class="ays-pro-features-v2-upgrade-text">
4349 <?php echo esc_html__("Upgrade" , "chart-builder"); ?>
4350 </div>
4351 </a>
4352 </div>
4353 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-main ays-accordion-data-main-wrap ">
4354 <div id="ays-chart-woocommerce-datas">
4355 <div class="<?php echo esc_attr($html_class_prefix) ?>woocommerce-datas-form">
4356 <div id="woocommerce-datas-form">
4357 <input type="hidden" name="chart_id" value="<?php echo esc_attr( $chart_id )?>">
4358 <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" >
4359 <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' ) ?>">
4360 <i class="ays_fa ays_fa_info_circle"></i>
4361 </a>
4362 <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]">
4363 <option value=""><?php echo esc_html__( 'Select query', 'chart-builder') ?></option>
4364 </select>
4365 </div>
4366 <div class='ays-chart-woocommerce-datas-success'></div>
4367 <div class='ays-chart-woocommerce-datas-error'></div>
4368 </div>
4369 <div class="ays-chart-buttons-group">
4370 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-woocommerce-datas-fetch">
4371 <?php echo esc_html__( 'Show Results', "chart-builder" ); ?>
4372 </button>
4373 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-woocommerce-datas-show-on-chart">
4374 <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>
4375 <?php echo esc_html__( 'Preview', "chart-builder" ); ?>
4376 </button>
4377 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-woocommerce-datas-save">
4378 <?php echo esc_html__( 'Save data', "chart-builder" ); ?>
4379 </button>
4380 </div>
4381 </div>
4382 </div>
4383 </div>
4384 </div>
4385 <?php
4386 $content = ob_get_clean();
4387
4388 $title = sprintf(
4389 /* translators: %1$s: Line break, %2$s: Opening bold tag, %3$s: Closing bold tag. */
4390 esc_html__( 'Get WooCommerce data', 'chart-builder' ) .
4391 ' <a class="ays_help" data-bs-toggle="tooltip" data-bs-html="true" title="' .
4392 /* translators: %1$s: Line break, %2$s: Opening bold tag, %3$s: Closing bold tag. */
4393 __( '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' ) . '">
4394 <i class="ays_fa ays_fa_info_circle"></i>
4395 </a>',
4396 '<br>', '<b>', '</b>'
4397 );
4398 $sources['woocommerce'] = array(
4399 'content' => $content,
4400 'title' => $title
4401 );
4402
4403 return $sources;
4404 }
4405
4406 public function source_contents_manual_settings( $sources, $args ){
4407 $html_class_prefix = $args['html_class_prefix'];
4408 $html_name_prefix = $args['html_name_prefix'];
4409 $source = $args['source'];
4410 $source = isset($source["commonTypeCharts"]) ? $source["commonTypeCharts"] : $source;
4411 $settings = $args['settings'];
4412 $source_chart_type = $args['source_chart_type'];
4413 // phpcs:ignore WordPress.Security.NonceVerification.Recommended
4414 $action = isset($_GET['action']) ? sanitize_text_field(wp_unslash($_GET['action'])) : 'add';
4415
4416 if (isset($source) && !empty($source)) {
4417 if ( !isset( $source[0] ) ) {
4418 if (count($source[1]) > 2) {
4419 $titles = array();
4420 for ($i = 0; $i < count($source[1]); $i++) {
4421 array_push($titles, __("Title", 'chart-builder').$i);
4422 }
4423 $source[0] = $titles;
4424 } else {
4425 $source[0] = array(
4426 __("Country", 'chart-builder'),
4427 __("Population", 'chart-builder'),
4428 );
4429 }
4430
4431 ksort($source);
4432 }
4433 }
4434
4435 if ($action == 'add') {
4436 foreach ($source as $key => $row) {
4437 $source[$key] = array_slice($row, 0, 2);
4438 }
4439 } else if ($action == 'edit') {
4440 if ($source_chart_type == 'pie_chart' || $source_chart_type == 'donut_chart') {
4441 foreach ($source as $key => $row) {
4442 $source[$key] = array_slice($row, 0, 2);
4443 }
4444 }
4445 }
4446 ob_start();
4447 ?>
4448 <div class="ays-accordion-data-main-wrap">
4449 <div class="<?php echo esc_attr($html_class_prefix) ?>source-data-main-wrap">
4450 <?php if($source_chart_type != 'org_chart'): ?>
4451 <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">
4452 <!-- <div class="<//?= $html_class_prefix ?>icons-box">
4453 <img class="<//?= $html_class_prefix ?>add-new-row" src="<//?php echo CHART_BUILDER_ADMIN_URL; ?>/images/icons/add-circle-outline.svg">
4454 </div> -->
4455 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-content-container">
4456 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-content">
4457 <?php if(!empty($source)):
4458 foreach($source as $source_id => $source_value):
4459 if(!empty($source_value) ):
4460 if ($source_id == 0): ?>
4461 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-edit-block" data-source-id = "<?php echo esc_attr($source_id); ?>">
4462 <div class="ays-chart-empty-data-table-cell"></div>
4463 <?php foreach($source_value as $each_source_id => $each_source_value): ?>
4464 <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); ?>">
4465 <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">
4466 <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;" />
4467 </svg>
4468 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-titles-box-item">
4469 <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'" : "" ?>>
4470 <?php if ($each_source_id !== 0): ?>
4471 <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">
4472 <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;" />
4473 </svg>
4474 <?php endif; ?>
4475 </div>
4476 </div>
4477 <?php endforeach; ?>
4478 </div>
4479 <?php else: ?>
4480 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-edit-block" data-source-id = "<?php echo esc_attr($source_id); ?>">
4481 <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">
4482 <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512">
4483 <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;" />
4484 </svg>
4485 </div>
4486 <div class="<?php echo esc_attr($html_class_prefix) ?>icons-box <?php echo esc_attr($html_class_prefix) ?>icons-remove-box">
4487 <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">
4488 <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;" />
4489 </svg>
4490 </div>
4491 <?php foreach($source_value as $each_source_id => $each_source_value): ?>
4492 <?php if ($each_source_id == 0): ?>
4493 <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); ?>">
4494 <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)); ?>">
4495 </div>
4496 <?php else: ?>
4497 <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); ?>">
4498 <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">
4499 </div>
4500 <?php endif; ?>
4501 <?php endforeach; ?>
4502 </div>
4503 <?php endif; ?>
4504 <?php endif; ?>
4505 <?php endforeach; ?>
4506 <?php else:?>
4507 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-edit-block">
4508 <div style="height: 63.11px; padding: 0 15px;"></div>
4509 <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">
4510 <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">
4511 <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;" />
4512 </svg>
4513 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-titles-box-item">
4514 <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'>
4515 <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">
4516 <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;" />
4517 </svg>
4518 </div>
4519 </div>
4520 </div>
4521 <div class = "<?php echo esc_attr($html_class_prefix) ?>chart-source-data-edit-block" data-source-id="1">
4522 <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">
4523 <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512">
4524 <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" />
4525 </svg>
4526 </div>
4527 <div class="<?php echo esc_attr($html_class_prefix) ?>icons-box <?php echo esc_attr($html_class_prefix) ?>icons-remove-box" >
4528 <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">
4529 <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;" />
4530 </svg>
4531 </div>
4532 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-input-box">
4533 <input type="text" class="ays-text-input form-control" name="<?php echo esc_attr($html_name_prefix); ?>chart_source_data[1][]" >
4534 </div>
4535 <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">
4536 <input type="number" class="ays-text-input form-control" name="<?php echo esc_attr($html_name_prefix); ?>chart_source_data[1][]" step="any">
4537 </div>
4538 </div>
4539 <?php endif; ?>
4540 </div>
4541 <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">
4542 <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">
4543 <?php echo esc_html__( 'Add column', "chart-builder" ); ?>
4544 </div>
4545 </div>
4546 <div class="<?php echo esc_attr($html_class_prefix) ?>icons-box <?php echo esc_attr($html_class_prefix) ?>add-new-row-box">
4547 <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">
4548 <?php echo esc_html__( 'Add row', "chart-builder" ); ?>
4549 </div>
4550 <br>
4551 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns <?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttn">
4552 <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>
4553 <?php echo esc_html__( 'Preview', "chart-builder" ); ?>
4554 </button>
4555 </div>
4556 <?php endif; ?>
4557 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-main-org-type display_none cb-changable-manual cb-org_chart-manual">
4558 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-content-org-type">
4559 <ul id="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-edit-tree-content">
4560 </ul>
4561 </div>
4562 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns <?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttn">
4563 <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>
4564 <?php echo esc_html__( 'Preview', "chart-builder" ); ?>
4565 </button>
4566 </div>
4567 </div>
4568 </div>
4569 <?php
4570 $content = ob_get_clean();
4571
4572 $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") . '">
4573 <i class="ays_fa ays_fa_info_circle"></i>
4574 </a>';
4575
4576 $sources['manual'] = array(
4577 'content' => $content,
4578 'title' => $title
4579 );
4580
4581 return $sources;
4582 }
4583
4584 public function source_contents_manual_settings_chartjs( $sources, $args ){
4585 $html_class_prefix = $args['html_class_prefix'];
4586 $html_name_prefix = $args['html_name_prefix'];
4587 $source = $args['source'];
4588 $source = isset($source["commonTypeCharts"]) ? $source["commonTypeCharts"] : $source;
4589 $settings = $args['settings'];
4590 $source_chart_type = $args['source_chart_type'];
4591 // phpcs:ignore WordPress.Security.NonceVerification.Recommended
4592 $action = isset($_GET['action']) ? sanitize_text_field((wp_unslash($_GET['action']))) : 'add';
4593
4594 ob_start();
4595 ?>
4596 <div class="ays-accordion-data-main-wrap">
4597 <div class="<?php echo esc_attr($html_class_prefix) ?>source-data-main-wrap">
4598 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-main <?php echo esc_attr($html_class_prefix) ?>chart-source-data-manual">
4599 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-content-container">
4600 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-content">
4601 <?php if(!empty($source)):
4602 foreach($source as $source_id => $source_value):
4603 if(!empty($source_value) ):
4604 if ($source_id == 0): ?>
4605 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-edit-block" data-source-id = "<?php echo esc_attr($source_id); ?>">
4606 <div class="ays-chart-empty-data-table-cell"></div>
4607 <?php foreach($source_value as $each_source_id => $each_source_value): ?>
4608 <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); ?>">
4609 <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">
4610 <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;" />
4611 </svg>
4612 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-titles-box-item">
4613 <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'" : "" ?>>
4614 <?php if ($each_source_id !== 0): ?>
4615 <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">
4616 <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;" />
4617 </svg>
4618 <?php endif; ?>
4619 </div>
4620 </div>
4621 <?php endforeach; ?>
4622 </div>
4623 <?php else: ?>
4624 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-edit-block" data-source-id = "<?php echo esc_attr($source_id); ?>">
4625 <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">
4626 <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512">
4627 <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;" />
4628 </svg>
4629 </div>
4630 <div class="<?php echo esc_attr($html_class_prefix) ?>icons-box <?php echo esc_attr($html_class_prefix) ?>icons-remove-box">
4631 <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">
4632 <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;" />
4633 </svg>
4634 </div>
4635 <?php foreach($source_value as $each_source_id => $each_source_value): ?>
4636 <?php if ($each_source_id == 0): ?>
4637 <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); ?>">
4638 <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)); ?>">
4639 </div>
4640 <?php else: ?>
4641 <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); ?>">
4642 <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">
4643 </div>
4644 <?php endif; ?>
4645 <?php endforeach; ?>
4646 </div>
4647 <?php endif; ?>
4648 <?php endif; ?>
4649 <?php endforeach; ?>
4650 <?php else:?>
4651 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-edit-block">
4652 <div style="height: 63.11px; padding: 0 15px;"></div>
4653 <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">
4654 <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">
4655 <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;" />
4656 </svg>
4657 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-titles-box-item">
4658 <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'>
4659 <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">
4660 <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;" />
4661 </svg>
4662 </div>
4663 </div>
4664 </div>
4665 <div class = "<?php echo esc_attr($html_class_prefix) ?>chart-source-data-edit-block" data-source-id="1">
4666 <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">
4667 <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512">
4668 <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" />
4669 </svg>
4670 </div>
4671 <div class="<?php echo esc_attr($html_class_prefix) ?>icons-box <?php echo esc_attr($html_class_prefix) ?>icons-remove-box" >
4672 <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">
4673 <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;" />
4674 </svg>
4675 </div>
4676 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-input-box">
4677 <input type="text" class="ays-text-input form-control" name="<?php echo esc_attr($html_name_prefix); ?>chart_source_data[1][]" >
4678 </div>
4679 <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">
4680 <input type="number" class="ays-text-input form-control" name="<?php echo esc_attr($html_name_prefix); ?>chart_source_data[1][]" step="any">
4681 </div>
4682 </div>
4683 <?php endif; ?>
4684 </div>
4685 <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">
4686 <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">
4687 <?php echo esc_html__( 'Add column', "chart-builder" ); ?>
4688 </div>
4689 </div>
4690 <div class="<?php echo esc_attr($html_class_prefix) ?>icons-box <?php echo esc_attr($html_class_prefix) ?>add-new-row-box">
4691 <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">
4692 <?php echo esc_html__( 'Add row', "chart-builder" ); ?>
4693 </div>
4694 <br>
4695 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns <?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttn">
4696 <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>
4697 <?php echo esc_html__( 'Preview', "chart-builder" ); ?>
4698 </button>
4699 </div>
4700 </div>
4701 </div>
4702 <?php
4703 $content = ob_get_clean();
4704
4705 $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") . '">
4706 <i class="ays_fa ays_fa_info_circle"></i>
4707 </a>';
4708
4709 $sources['manual'] = array(
4710 'content' => $content,
4711 'title' => $title
4712 );
4713
4714 return $sources;
4715 }
4716
4717 /**
4718 * Chart page settings contents
4719 * @param $args
4720 */
4721 public function ays_chart_page_settings_contents( $args ){
4722 $chart_source_type = $args['chart_source_type'];
4723
4724 if ($chart_source_type === 'chart-js') {
4725 $sources_contents = apply_filters( 'ays_cb_chart_page_settings_contents_settings_chartjs', array(), $args );
4726 } else {
4727 $sources_contents = apply_filters( 'ays_cb_chart_page_settings_contents_settings', array(), $args );
4728 }
4729
4730 $sources = array();
4731 foreach ( $sources_contents as $key => $sources_content ) {
4732 $collapsed = $key == 'general_settings' ? 'false' : 'true';
4733
4734 $content = '<fieldset class="ays-accordion-options-container" data-collapsed="' . $collapsed . '">';
4735 if(isset($sources_content['title'])){
4736 $content .= '<legend class="ays-accordion-options-header">';
4737 $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">
4738 <g>
4739 <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" />
4740 </g>
4741 </svg>';
4742
4743 $content .= '<span>'. esc_html($sources_content['title']) .'</span></legend>';
4744 }
4745
4746 $content .= '<div class="ays-accordion-options-content">';
4747 $content .= $sources_content['content'];
4748 $content .= '</div>';
4749
4750 $content .= '</fieldset>';
4751
4752 $sources[] = $content;
4753 }
4754 $content_for_escape = implode('' , $sources );
4755 echo html_entity_decode( $content_for_escape );
4756 }
4757
4758 public function settings_contents_general_settings( $sources, $args ){
4759 $html_class_prefix = $args['html_class_prefix'];
4760 $html_name_prefix = $args['html_name_prefix'];
4761 $chart_description = $args['chart_description'];
4762 $create_author_data = $args['create_author_data'];
4763 $status = $args['status'];
4764 $settings = $args['settings'];
4765
4766 $show_title = $settings['show_title'];
4767 $show_description = $settings['show_description'];
4768 $enable_interactivity = $settings['enable_interactivity'];
4769 $maximized_view = $settings['maximized_view'];
4770
4771 ob_start();
4772 ?>
4773 <div class="ays-accordion-data-main-wrap">
4774 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
4775 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
4776 <div class="col-sm-5 <?php echo esc_attr($html_class_prefix) ?>option-title">
4777 <label for="ays-status" class="form-label">
4778 <?php echo esc_html(__('Status', "chart-builder")); ?>
4779 <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") ); ?>">
4780 <i class="ays_fa ays_fa_info_circle"></i>
4781 </a>
4782 </label>
4783 </div>
4784 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
4785 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
4786 <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' : ''; ?> >
4787 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
4788 </label>
4789 </div>
4790 </div> <!-- Status -->
4791 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
4792 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
4793 <label for="ays-chart-description" class="form-label">
4794 <?php echo esc_html(__( "Description", "chart-builder" )); ?>
4795 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Set the chart description","chart-builder") ); ?>">
4796 <i class="ays_fa ays_fa_info_circle"></i>
4797 </a>
4798 </label>
4799 </div>
4800 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
4801 <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>
4802 </div>
4803 </div> <!-- Chart description -->
4804 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
4805 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
4806 <label for="ays-chart-create-author" class="form-label">
4807 <?php echo esc_html(__('Change the author of the current chart',"chart-builder")); ?>
4808 <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")); ?>">
4809 <i class="ays_fa ays_fa_info_circle"></i>
4810 </a>
4811 </label>
4812 </div>
4813 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
4814 <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">
4815 <option value=""><?php echo esc_html(__('Select User',"chart-builder"))?></option>
4816 <?php if (isset($create_author_data['ID'])) : ?>
4817 <option value="<?php echo esc_html($create_author_data['ID'])?>" selected><?php echo esc_html($create_author_data['display_name'])?></option>
4818 <?php endif; ?>
4819 </select>
4820 </div>
4821 </div> <!-- Change chart author -->
4822 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
4823 <div class="col-sm-5 <?php echo esc_attr($html_class_prefix) ?>option-title">
4824 <label for="ays-chart-show-title" class="form-label">
4825 <?php echo esc_html(__('Show chart title', "chart-builder")); ?>
4826 <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") ); ?>">
4827 <i class="ays_fa ays_fa_info_circle"></i>
4828 </a>
4829 </label>
4830 </div>
4831 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
4832 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
4833 <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); ?> >
4834 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
4835 </label>
4836 </div>
4837 </div> <!-- Show title -->
4838 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
4839 <div class="col-sm-5 <?php echo esc_attr($html_class_prefix) ?>option-title">
4840 <label for="ays-chart-show-description" class="form-label">
4841 <?php echo esc_html(__('Show chart description', "chart-builder")); ?>
4842 <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") ); ?>">
4843 <i class="ays_fa ays_fa_info_circle"></i>
4844 </a>
4845 </label>
4846 </div>
4847 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
4848 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
4849 <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); ?> >
4850 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
4851 </label>
4852 </div>
4853 </div> <!-- Show description -->
4854 <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">
4855 <div class="col-sm-5 <?php echo esc_attr($html_class_prefix) ?>option-title">
4856 <label for="ays-chart-option-enable-interactivity" class="form-label">
4857 <?php echo esc_html(__('Enable interactivity', "chart-builder")); ?>
4858 <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") ); ?>">
4859 <i class="ays_fa ays_fa_info_circle"></i>
4860 </a>
4861 </label>
4862 </div>
4863 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
4864 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
4865 <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); ?> >
4866 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
4867 </label>
4868 </div>
4869 </div> <!-- Enable interactivity -->
4870 <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">
4871 <div class="col-sm-5 <?php echo esc_attr($html_class_prefix) ?>option-title">
4872 <label for="ays-chart-option-maximized-view" class="form-label">
4873 <?php echo esc_html(__('Maximized view', "chart-builder")); ?>
4874 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("If checked, maximizes the area of the chart.","chart-builder") ); ?>">
4875 <i class="ays_fa ays_fa_info_circle"></i>
4876 </a>
4877 </label>
4878 </div>
4879 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
4880 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
4881 <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); ?> >
4882 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
4883 </label>
4884 </div>
4885 </div> <!-- Maximized view -->
4886 </div>
4887 </div>
4888 <?php
4889 $content = ob_get_clean();
4890
4891 $title = __( 'General Settings', "chart-builder" );
4892
4893 $sources['general_settings'] = array(
4894 'content' => $content,
4895 'title' => $title
4896 );
4897
4898 return $sources;
4899 }
4900
4901 public function settings_contents_general_settings_chartjs( $sources, $args ){
4902 $html_class_prefix = $args['html_class_prefix'];
4903 $html_name_prefix = $args['html_name_prefix'];
4904 $chart_description = $args['chart_description'];
4905 $create_author_data = $args['create_author_data'];
4906 $status = $args['status'];
4907 $settings = $args['settings'];
4908
4909 $show_title = $settings['show_title'];
4910 $show_description = $settings['show_description'];
4911
4912 ob_start();
4913 ?>
4914 <div class="ays-accordion-data-main-wrap">
4915 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
4916 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
4917 <div class="col-sm-5 <?php echo esc_attr($html_class_prefix) ?>option-title">
4918 <label for="ays-status" class="form-label">
4919 <?php echo esc_html(__('Status', "chart-builder")); ?>
4920 <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") ); ?>">
4921 <i class="ays_fa ays_fa_info_circle"></i>
4922 </a>
4923 </label>
4924 </div>
4925 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
4926 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
4927 <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' : ''; ?> >
4928 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
4929 </label>
4930 </div>
4931 </div> <!-- Status -->
4932 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
4933 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
4934 <label for="ays-chart-description" class="form-label">
4935 <?php echo esc_html(__( "Description", "chart-builder" )); ?>
4936 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Set the chart description","chart-builder") ); ?>">
4937 <i class="ays_fa ays_fa_info_circle"></i>
4938 </a>
4939 </label>
4940 </div>
4941 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
4942 <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>
4943 </div>
4944 </div> <!-- Chart description -->
4945 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
4946 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
4947 <label for="ays-chart-create-author" class="form-label">
4948 <?php echo esc_html(__('Change the author of the current chart',"chart-builder")); ?>
4949 <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")); ?>">
4950 <i class="ays_fa ays_fa_info_circle"></i>
4951 </a>
4952 </label>
4953 </div>
4954 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
4955 <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">
4956 <option value=""><?php echo esc_html(__('Select User',"chart-builder"))?></option>
4957 <?php if (isset($create_author_data['ID'])) : ?>
4958 <option value="<?php echo esc_html($create_author_data['ID'])?>" selected><?php echo esc_html($create_author_data['display_name'])?></option>
4959 <?php endif; ?>
4960 </select>
4961 </div>
4962 </div> <!-- Change chart author -->
4963 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
4964 <div class="col-sm-5 <?php echo esc_attr($html_class_prefix) ?>option-title">
4965 <label for="ays-chart-show-title" class="form-label">
4966 <?php echo esc_html(__('Show chart title', "chart-builder")); ?>
4967 <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") ); ?>">
4968 <i class="ays_fa ays_fa_info_circle"></i>
4969 </a>
4970 </label>
4971 </div>
4972 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
4973 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
4974 <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); ?> >
4975 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
4976 </label>
4977 </div>
4978 </div> <!-- Show title -->
4979 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
4980 <div class="col-sm-5 <?php echo esc_attr($html_class_prefix) ?>option-title">
4981 <label for="ays-chart-show-description" class="form-label">
4982 <?php echo esc_html(__('Show chart description', "chart-builder")); ?>
4983 <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") ); ?>">
4984 <i class="ays_fa ays_fa_info_circle"></i>
4985 </a>
4986 </label>
4987 </div>
4988 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
4989 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
4990 <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); ?> >
4991 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
4992 </label>
4993 </div>
4994 </div> <!-- Show description -->
4995 </div>
4996 </div>
4997 <?php
4998 $content = ob_get_clean();
4999
5000 $title = __( 'General Settings', "chart-builder" );
5001
5002 $sources['general_settings'] = array(
5003 'content' => $content,
5004 'title' => $title
5005 );
5006
5007 return $sources;
5008 }
5009
5010 public function settings_contents_tooltip_settings( $sources, $args ){
5011 $html_class_prefix = $args['html_class_prefix'];
5012 $html_name_prefix = $args['html_name_prefix'];
5013 $settings = $args['settings'];
5014
5015 $tooltip_trigger_options = $settings['tooltip_trigger_options'];
5016 $tooltip_trigger = $settings['tooltip_trigger'];
5017 $show_color_code = $settings['show_color_code'];
5018 $tooltip_italic = $settings['tooltip_italic'];
5019 $tooltip_bold = $settings['tooltip_bold'];
5020 $tooltip_bold_options = $settings['tooltip_bold_options'];
5021 $tooltip_text_color = $settings['tooltip_text_color'];
5022 $tooltip_font_size = $settings['tooltip_font_size'];
5023
5024 ob_start();
5025 ?>
5026 <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">
5027 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
5028 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5029 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5030 <label for="ays-chart-option-tooltip-trigger">
5031 <?php echo esc_html(__( "Trigger", "chart-builder" )); ?>
5032 <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") )); ?>">
5033 <i class="ays_fa ays_fa_info_circle"></i>
5034 </a>
5035 </label>
5036 </div>
5037 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5038 <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]">
5039 <?php
5040 foreach ( $tooltip_trigger_options as $option_slug => $option ):
5041 $selected = ( $tooltip_trigger == $option_slug ) ? 'selected' : '';
5042 ?>
5043 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
5044 <?php
5045 endforeach;
5046 ?>
5047 </select>
5048 </div>
5049 </div> <!-- Trigger -->
5050 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5051 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5052 <label for="ays-chart-option-show-color-code">
5053 <?php echo esc_html(__( "Show Color Code", "chart-builder" )); ?>
5054 <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") ); ?>">
5055 <i class="ays_fa ays_fa_info_circle"></i>
5056 </a>
5057 </label>
5058 </div>
5059 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5060 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5061 <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); ?> >
5062 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5063 </label>
5064 </div>
5065 </div> <!-- Show Color Code -->
5066 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5067 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5068 <label for="ays-chart-option-tooltip-text-color">
5069 <?php echo esc_html(__( "Text color", "chart-builder" )); ?>
5070 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the tooltip text.","chart-builder") ); ?>">
5071 <i class="ays_fa ays_fa_info_circle"></i>
5072 </a>
5073 </label>
5074 </div>
5075 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5076 <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) ?>">
5077 </div>
5078 </div> <!-- Text color -->
5079 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5080 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5081 <label for="ays-chart-option-tooltip-font-size" class="form-label">
5082 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
5083 <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") )); ?>">
5084 <i class="ays_fa ays_fa_info_circle"></i>
5085 </a>
5086 </label>
5087 </div>
5088 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5089 <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) ?>">
5090 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
5091 </div>
5092 </div> <!-- Font size -->
5093 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5094 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5095 <label for="ays-chart-option-tooltip-italic">
5096 <?php echo esc_html(__( "Italic text", "chart-builder" )); ?>
5097 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable this option to make chart tooltip text italic.","chart-builder") ); ?>">
5098 <i class="ays_fa ays_fa_info_circle"></i>
5099 </a>
5100 </label>
5101 </div>
5102 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5103 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5104 <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); ?> >
5105 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5106 </label>
5107 </div>
5108 </div> <!-- Italic text -->
5109 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5110 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5111 <label for="ays-chart-option-tooltip-bold">
5112 <?php echo esc_html(__( "Bold text", "chart-builder" )); ?>
5113 <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") )); ?>">
5114 <i class="ays_fa ays_fa_info_circle"></i>
5115 </a>
5116 </label>
5117 </div>
5118 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5119 <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]">
5120 <?php
5121 foreach ( $tooltip_bold_options as $option_slug => $option ):
5122 $selected = ( $tooltip_bold == $option_slug ) ? 'selected' : '';
5123 ?>
5124 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
5125 <?php
5126 endforeach;
5127 ?>
5128 </select>
5129 </div>
5130 </div> <!-- Bold text -->
5131 </div>
5132 </div>
5133 <?php
5134 $content = ob_get_clean();
5135
5136 $title = __( 'Tooltip', "chart-builder" );
5137
5138 $sources['tooltip'] = array(
5139 'content' => $content,
5140 'title' => $title
5141 );
5142
5143 return $sources;
5144 }
5145
5146 public function settings_contents_tooltip_settings_chartjs( $sources, $args ){
5147 $html_class_prefix = $args['html_class_prefix'];
5148 $html_name_prefix = $args['html_name_prefix'];
5149 $settings = $args['settings'];
5150
5151 $tooltip_text_color = $settings['tooltip_text_color'];
5152
5153 ob_start();
5154 ?>
5155 <div class="ays-accordion-data-main-wrap ">
5156 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
5157 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5158 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5159 <label for="ays-chart-option-tooltip-text-color">
5160 <?php echo esc_html(__( "Text color", "chart-builder" )); ?>
5161 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the tooltip text.","chart-builder") ); ?>">
5162 <i class="ays_fa ays_fa_info_circle"></i>
5163 </a>
5164 </label>
5165 </div>
5166 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5167 <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) ?>">
5168 </div>
5169 </div> <!-- Text color -->
5170 </div>
5171 </div>
5172 <?php
5173 $content = ob_get_clean();
5174
5175 $title = __( 'Tooltip', "chart-builder" );
5176
5177 $sources['tooltip'] = array(
5178 'content' => $content,
5179 'title' => $title
5180 );
5181
5182 return $sources;
5183 }
5184
5185 public function settings_contents_legend_settings( $sources, $args ){
5186 $html_class_prefix = $args['html_class_prefix'];
5187 $html_name_prefix = $args['html_name_prefix'];
5188 $settings = $args['settings'];
5189 $legend_positions = $settings['legend_positions'];
5190 $legend_position = $settings['legend_position'];
5191 $legend_alignments = $settings['legend_alignments'];
5192 $legend_alignment = $settings['legend_alignment'];
5193 $legend_color = $settings['legend_color'];
5194 $legend_font_size = $settings['legend_font_size'];
5195 $legend_bold = $settings['legend_bold'];
5196 $legend_italic = $settings['legend_italic'];
5197
5198 ob_start();
5199 ?>
5200 <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">
5201 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
5202 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5203 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5204 <label for="ays-chart-option-legend-position">
5205 <?php echo esc_html(__( "Position", "chart-builder" )); ?>
5206 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr(htmlspecialchars( __("Choose the appropriate position for the chart legend.","chart-builder") )); ?>">
5207 <i class="ays_fa ays_fa_info_circle"></i>
5208 </a>
5209 </label>
5210 </div>
5211 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5212 <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]">
5213 <?php
5214 foreach ( $legend_positions as $option_slug => $option ):
5215 $selected = ( $legend_position == $option_slug ) ? 'selected' : '';
5216
5217 $type_class = '';
5218 if ($option_slug == 'left') {
5219 $type_class = ' cb-changable-opt cb-pie_chart-opt cb-donut_chart-opt ';
5220 } else if ($option_slug == 'in') {
5221 $type_class = ' cb-changable-opt cb-bar_chart-opt cb-column_chart-opt cb-line_chart-opt ';
5222 } else if ($option_slug == 'labeled') {
5223 $type_class = ' cb-changable-opt cb-pie_chart-opt cb-donut_chart-opt ';
5224 }
5225
5226 ?>
5227
5228 <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>
5229 <?php
5230 endforeach;
5231 ?>
5232 </select>
5233 </div>
5234 </div> <!-- Legend position -->
5235 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5236 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5237 <label for="ays-chart-option-legend-alignment">
5238 <?php echo esc_html(__( "Alignment", "chart-builder" )); ?>
5239 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr(htmlspecialchars( __("Choose the appropriate alignment for the chart legend.","chart-builder") )); ?>">
5240 <i class="ays_fa ays_fa_info_circle"></i>
5241 </a>
5242 </label>
5243 </div>
5244 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5245 <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]">
5246 <?php
5247 foreach ( $legend_alignments as $option_slug => $option ):
5248 $selected = ( $legend_alignment == $option_slug ) ? 'selected' : '';
5249 ?>
5250 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
5251 <?php
5252 endforeach;
5253 ?>
5254 </select>
5255 </div>
5256 </div> <!-- Legend alignment -->
5257 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5258 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5259 <label for="ays-chart-option-legend-font-color">
5260 <?php echo esc_html(__( "Font Color", "chart-builder" )); ?>
5261 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr(htmlspecialchars( __("Choose the font color for the chart legend.","chart-builder") )); ?>">
5262 <i class="ays_fa ays_fa_info_circle"></i>
5263 </a>
5264 </label>
5265 </div>
5266 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5267 <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) ?>">
5268 </div>
5269 </div> <!-- Legend font color -->
5270 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5271 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5272 <label for="ays-chart-option-legend-font-size" class="form-label">
5273 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
5274 <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") )); ?>">
5275 <i class="ays_fa ays_fa_info_circle"></i>
5276 </a>
5277 </label>
5278 </div>
5279 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5280 <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) ?>">
5281 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
5282 </div>
5283 </div> <!-- Font size -->
5284 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5285 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5286 <label for="ays-chart-option-legend-italic">
5287 <?php echo esc_html(__( "Italic text", "chart-builder" )); ?>
5288 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable this option to make chart legend text italic.","chart-builder") ); ?>">
5289 <i class="ays_fa ays_fa_info_circle"></i>
5290 </a>
5291 </label>
5292 </div>
5293 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5294 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5295 <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); ?> >
5296 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5297 </label>
5298 </div>
5299 </div> <!-- Italic text -->
5300 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5301 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5302 <label for="ays-chart-option-legend-bold">
5303 <?php echo esc_html(__( "Bold text", "chart-builder" )); ?>
5304 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable this option to make chart legend text bold.","chart-builder") ); ?>">
5305 <i class="ays_fa ays_fa_info_circle"></i>
5306 </a>
5307 </label>
5308 </div>
5309 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5310 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5311 <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); ?> >
5312 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5313 </label>
5314 </div>
5315 </div> <!-- Bold text -->
5316 </div>
5317 </div>
5318 <?php
5319 $content = ob_get_clean();
5320
5321 $title = __( 'Legend', "chart-builder" );
5322
5323 $sources['legend'] = array(
5324 'content' => $content,
5325 'title' => $title
5326 );
5327
5328 return $sources;
5329 }
5330
5331 public function settings_contents_legend_settings_chartjs( $sources, $args ){
5332 $html_class_prefix = $args['html_class_prefix'];
5333 $html_name_prefix = $args['html_name_prefix'];
5334 $settings = $args['settings'];
5335 $legend_positions = $settings['legend_positions'];
5336 $legend_position = $settings['legend_position'];
5337 $legend_alignments = $settings['legend_alignments'];
5338 $legend_alignment = $settings['legend_alignment'];
5339 $legend_color = $settings['legend_color'];
5340 $legend_font_size = $settings['legend_font_size'];
5341 $legend_reverse = $settings['legend_reverse'];
5342 $legend_bold = $settings['legend_bold'];
5343 $legend_italic = $settings['legend_italic'];
5344 ob_start();
5345 ?>
5346 <div class="ays-accordion-data-main-wrap">
5347 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
5348 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5349 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5350 <label for="ays-chart-option-legend-position">
5351 <?php echo esc_html(__( "Position", "chart-builder" )); ?>
5352 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr(htmlspecialchars( __("Choose the appropriate position for the chart legend.","chart-builder") )); ?>">
5353 <i class="ays_fa ays_fa_info_circle"></i>
5354 </a>
5355 </label>
5356 </div>
5357 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5358 <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]">
5359 <?php
5360 foreach ( $legend_positions as $option_slug => $option ):
5361 $selected = ( $legend_position == $option_slug ) ? 'selected' : '';
5362 ?>
5363 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?> ><?php echo esc_html($option); ?></option>
5364 <?php
5365 endforeach;
5366 ?>
5367 </select>
5368 </div>
5369 </div> <!-- Legend position -->
5370 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5371 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5372 <label for="ays-chart-option-legend-alignment">
5373 <?php echo esc_html(__( "Alignment", "chart-builder" )); ?>
5374 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr(htmlspecialchars( __("Choose the appropriate alignment for the chart legend.","chart-builder") )); ?>">
5375 <i class="ays_fa ays_fa_info_circle"></i>
5376 </a>
5377 </label>
5378 </div>
5379 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5380 <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]">
5381 <?php
5382 foreach ( $legend_alignments as $option_slug => $option ):
5383 $selected = ( $legend_alignment == $option_slug ) ? 'selected' : '';
5384 ?>
5385 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
5386 <?php
5387 endforeach;
5388 ?>
5389 </select>
5390 </div>
5391 </div> <!-- Legend alignment -->
5392 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5393 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5394 <label for="ays-chart-option-legend-font-color">
5395 <?php echo esc_html(__( "Font Color", "chart-builder" )); ?>
5396 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr(htmlspecialchars( __("Choose the font color for the chart legend.","chart-builder") )); ?>">
5397 <i class="ays_fa ays_fa_info_circle"></i>
5398 </a>
5399 </label>
5400 </div>
5401 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5402 <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) ?>">
5403 </div>
5404 </div> <!-- Legend font color -->
5405 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5406 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5407 <label for="ays-chart-option-legend-font-size" class="form-label">
5408 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
5409 <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") )); ?>">
5410 <i class="ays_fa ays_fa_info_circle"></i>
5411 </a>
5412 </label>
5413 </div>
5414 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5415 <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) ?>">
5416 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
5417 </div>
5418 </div> <!-- Font size -->
5419 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5420 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5421 <label for="ays-chart-option-legend-italic">
5422 <?php echo esc_html(__( "Italic text", "chart-builder" )); ?>
5423 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable this option to make chart legend text italic.","chart-builder") ); ?>">
5424 <i class="ays_fa ays_fa_info_circle"></i>
5425 </a>
5426 </label>
5427 </div>
5428 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5429 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5430 <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); ?> >
5431 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5432 </label>
5433 </div>
5434 </div> <!-- Italic text -->
5435 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5436 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5437 <label for="ays-chart-option-legend-bold">
5438 <?php echo esc_html(__( "Bold text", "chart-builder" )); ?>
5439 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable this option to make chart legend text bold.","chart-builder") ); ?>">
5440 <i class="ays_fa ays_fa_info_circle"></i>
5441 </a>
5442 </label>
5443 </div>
5444 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5445 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5446 <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); ?> >
5447 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5448 </label>
5449 </div>
5450 </div> <!-- Bold text -->
5451 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt">
5452 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5453 <label for="ays-chart-option-legend-revers">
5454 <?php echo esc_html(__( "Show datasets in reverse order", "chart-builder" )); ?>
5455 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable this toggle to show datasets in reverse ordering.","chart-builder") ); ?>">
5456 <i class="ays_fa ays_fa_info_circle"></i>
5457 </a>
5458 </label>
5459 </div>
5460 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5461 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5462 <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); ?> >
5463 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5464 </label>
5465 </div>
5466 </div> <!-- reverse datasets -->
5467 </div>
5468 </div>
5469 <?php
5470 $content = ob_get_clean();
5471
5472 $title = __( 'Legend', "chart-builder" );
5473
5474 $sources['legend'] = array(
5475 'content' => $content,
5476 'title' => $title
5477 );
5478
5479 return $sources;
5480 }
5481
5482 public function settings_contents_horizontal_axis_settings( $sources, $args ){
5483 $html_class_prefix = $args['html_class_prefix'];
5484 $html_name_prefix = $args['html_name_prefix'];
5485 $settings = $args['settings'];
5486
5487 $haxis_title = $settings['haxis_title'];
5488 $axes_text_positions = $settings['axes_text_positions'];
5489 $haxis_text_position = $settings['haxis_text_position'];
5490 $haxis_direction = $settings['haxis_direction'];
5491 $haxis_text_color = $settings['haxis_text_color'];
5492 $haxis_baseline_color = $settings['haxis_baseline_color'];
5493 $haxis_slanted_options = $settings['haxis_slanted_options'];
5494 $haxis_slanted = $settings['haxis_slanted'];
5495 $haxis_slanted_text_angle = $settings['haxis_slanted_text_angle'];
5496 $haxis_show_text_every = $settings['haxis_show_text_every'];
5497 $haxis_format_options = $settings['axes_format_options'];
5498 $haxis_format = $settings['haxis_format'];
5499 $haxis_enable_divide_percent = $settings['haxis_enable_divide_percent'];
5500 $haxis_label_font_size = $settings['haxis_label_font_size'];
5501 $haxis_max_value = $settings['haxis_max_value'];
5502 $haxis_min_value = $settings['haxis_min_value'];
5503 $haxis_text_font_size = $settings['haxis_text_font_size'];
5504 $haxis_label_color = $settings['haxis_label_color'];
5505 $haxis_bold = $settings['haxis_bold'];
5506 $haxis_italic = $settings['haxis_italic'];
5507 $haxis_title_bold = $settings['haxis_title_bold'];
5508 $haxis_title_italic = $settings['haxis_title_italic'];
5509 $haxis_gridlines_count = $settings['haxis_gridlines_count'];
5510 $haxis_gridlines_color = $settings['haxis_gridlines_color'];
5511 $haxis_minor_gridlines_color = $settings['haxis_minor_gridlines_color'];
5512
5513 ob_start();
5514 ?>
5515 <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">
5516 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
5517 <h6>Label</h6>
5518 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5519 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5520 <label for="ays-chart-option-haxis-title" class="form-label">
5521 <?php echo esc_html(__( "Label", "chart-builder" )); ?>
5522 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The title of the horizontal axis","chart-builder") ); ?>">
5523 <i class="ays_fa ays_fa_info_circle"></i>
5524 </a>
5525 </label>
5526 </div>
5527 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5528 <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) ?>">
5529 </div>
5530 </div> <!-- Horizontal axis label -->
5531 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5532 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5533 <label for="ays-chart-option-haxis-label-font-size" class="form-label">
5534 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
5535 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The font size of the horizontal axis label.","chart-builder") ); ?>">
5536 <i class="ays_fa ays_fa_info_circle"></i>
5537 </a>
5538 </label>
5539 </div>
5540 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5541 <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) ?>">
5542 </div>
5543 </div> <!-- Horizontal axis label font size -->
5544 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5545 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5546 <label for="ays-chart-option-haxis-label-color">
5547 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
5548 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the horizontal axis label.","chart-builder") ); ?>">
5549 <i class="ays_fa ays_fa_info_circle"></i>
5550 </a>
5551 </label>
5552 </div>
5553 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5554 <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) ?>">
5555 </div>
5556 </div> <!-- Horizontal axis label color -->
5557 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5558 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5559 <label for="ays-chart-option-haxis-title-italic">
5560 <?php echo esc_html(__( "Italic", "chart-builder" )); ?>
5561 <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") ); ?>">
5562 <i class="ays_fa ays_fa_info_circle"></i>
5563 </a>
5564 </label>
5565 </div>
5566 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5567 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5568 <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); ?> >
5569 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5570 </label>
5571 </div>
5572 </div> <!-- Italic label -->
5573 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5574 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5575 <label for="ays-chart-option-haxis-title-bold">
5576 <?php echo esc_html(__( "Bold", "chart-builder" )); ?>
5577 <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") ); ?>">
5578 <i class="ays_fa ays_fa_info_circle"></i>
5579 </a>
5580 </label>
5581 </div>
5582 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5583 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5584 <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); ?> >
5585 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5586 </label>
5587 </div>
5588 </div> <!-- Bold label -->
5589 <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">
5590 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5591 <label for="ays-chart-option-haxis-show-text-every" class="form-label">
5592 <?php echo esc_html(__( "Interval", "chart-builder" )); ?>
5593 <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") ); ?>">
5594 <i class="ays_fa ays_fa_info_circle"></i>
5595 </a>
5596 </label>
5597 </div>
5598 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5599 <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">
5600 </div>
5601 </div> <!-- Label interval -->
5602
5603 <br>
5604 <h6>Text</h6>
5605 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5606 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5607 <label for="ays-chart-option-haxis-text-position" class="form-label">
5608 <?php echo esc_html(__( "Position", "chart-builder" )); ?>
5609 <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") ); ?>">
5610 <i class="ays_fa ays_fa_info_circle"></i>
5611 </a>
5612 </label>
5613 </div>
5614 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5615 <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]">
5616 <?php
5617 foreach ( $axes_text_positions as $option_slug => $option ):
5618 $selected = ( $haxis_text_position == $option_slug ) ? 'selected' : '';
5619 ?>
5620 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
5621 <?php
5622 endforeach;
5623 ?>
5624 </select>
5625 </div>
5626 </div> <!-- Horizontal axis text position -->
5627 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5628 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5629 <label for="ays-chart-option-haxis-text-color">
5630 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
5631 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the horizontal axis text.","chart-builder") ); ?>">
5632 <i class="ays_fa ays_fa_info_circle"></i>
5633 </a>
5634 </label>
5635 </div>
5636 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5637 <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) ?>">
5638 </div>
5639 </div> <!-- Horizontal axis text color -->
5640 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5641 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5642 <label for="ays-chart-option-haxis-text-font-size" class="form-label">
5643 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
5644 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The font size of the horizontal axis text.","chart-builder") ); ?>">
5645 <i class="ays_fa ays_fa_info_circle"></i>
5646 </a>
5647 </label>
5648 </div>
5649 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5650 <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) ?>">
5651 </div>
5652 </div> <!-- Horizontal axis text font size -->
5653 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5654 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5655 <label for="ays-chart-option-haxis-text-direction">
5656 <?php echo esc_html(__( "Reverse Direction", "chart-builder" )); ?>
5657 <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") ); ?>">
5658 <i class="ays_fa ays_fa_info_circle"></i>
5659 </a>
5660 </label>
5661 </div>
5662 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5663 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5664 <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); ?> >
5665 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5666 </label>
5667 </div>
5668 </div> <!-- Horizontal axis text direction -->
5669 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5670 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5671 <label for="ays-chart-option-haxis-italic">
5672 <?php echo esc_html(__( "Italic", "chart-builder" )); ?>
5673 <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") ); ?>">
5674 <i class="ays_fa ays_fa_info_circle"></i>
5675 </a>
5676 </label>
5677 </div>
5678 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5679 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5680 <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); ?> >
5681 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5682 </label>
5683 </div>
5684 </div> <!-- Italic text -->
5685 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5686 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5687 <label for="ays-chart-option-haxis-bold">
5688 <?php echo esc_html(__( "Bold", "chart-builder" )); ?>
5689 <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") ); ?>">
5690 <i class="ays_fa ays_fa_info_circle"></i>
5691 </a>
5692 </label>
5693 </div>
5694 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5695 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5696 <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); ?> >
5697 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5698 </label>
5699 </div>
5700 </div> <!-- Bold text -->
5701 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5702 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5703 <label for="ays-chart-option-haxis-slanted-text" class="form-label">
5704 <?php echo esc_html(__( "Slanted text", "chart-builder" )); ?>
5705 <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") ); ?>">
5706 <i class="ays_fa ays_fa_info_circle"></i>
5707 </a>
5708 </label>
5709 </div>
5710 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5711 <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]">
5712 <?php
5713 foreach ( $haxis_slanted_options as $option_slug => $option ):
5714 $selected = ( $haxis_slanted == $option_slug ) ? 'selected' : '';
5715 ?>
5716 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
5717 <?php
5718 endforeach;
5719 ?>
5720 </select>
5721 </div>
5722 </div> <!-- Horizontal axis slanted text -->
5723 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section <?php echo ($haxis_slanted == 'false') ? 'display_none' : ''; ?>">
5724 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5725 <label for="ays-chart-option-haxis-slanted-text-angle" class="form-label">
5726 <?php echo esc_html(__( "Slanted text angle", "chart-builder" )); ?>
5727 <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") ); ?>">
5728 <i class="ays_fa ays_fa_info_circle"></i>
5729 </a>
5730 </label>
5731 </div>
5732 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5733 <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">
5734 </div>
5735 </div> <!-- Horizontal axis slanted text angle -->
5736
5737 <br>
5738 <h6>Gridlines</h6>
5739 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5740 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5741 <label for="ays-chart-option-haxis-gridlines-count" class="form-label">
5742 <?php echo esc_html(__( "Count", "chart-builder" )); ?>
5743 <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") ); ?>">
5744 <i class="ays_fa ays_fa_info_circle"></i>
5745 </a>
5746 </label>
5747 </div>
5748 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5749 <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) ?>">
5750 </div>
5751 </div> <!-- Horizontal axis gridlines count -->
5752 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5753 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5754 <label for="ays-chart-option-haxis-gridlines-color">
5755 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
5756 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the horizontal axis gridlines.","chart-builder") ); ?>">
5757 <i class="ays_fa ays_fa_info_circle"></i>
5758 </a>
5759 </label>
5760 </div>
5761 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5762 <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) ?>">
5763 </div>
5764 </div> <!-- Horizontal axis gridlines color -->
5765 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5766 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5767 <label for="ays-chart-option-haxis-minor-gridlines-color">
5768 <?php echo esc_html(__( "Minor gridlines color", "chart-builder" )); ?>
5769 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the horizontal axis minor gridlines.","chart-builder") ); ?>">
5770 <i class="ays_fa ays_fa_info_circle"></i>
5771 </a>
5772 </label>
5773 </div>
5774 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5775 <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) ?>">
5776 </div>
5777 </div> <!-- Horizontal axis minor gridlines color -->
5778 <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">
5779 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5780 <label for="ays-chart-option-haxis-baseline-color">
5781 <?php echo esc_html(__( "Baseline color", "chart-builder" )); ?>
5782 <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") ); ?>">
5783 <i class="ays_fa ays_fa_info_circle"></i>
5784 </a>
5785 </label>
5786 </div>
5787 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5788 <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) ?>">
5789 </div>
5790 </div> <!-- Horizontal axis baseline color -->
5791
5792 <br class="cb-changable-opt cb-bar_chart-opt " >
5793 <h6 class="cb-changable-opt cb-bar_chart-opt">Format</h6>
5794 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-bar_chart-opt " >
5795 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5796 <label for="ays-chart-option-haxis-format" class="form-label">
5797 <?php echo esc_html(__( "Format", "chart-builder" )); ?>
5798 <a class="ays_help" data-bs-toggle="tooltip" data-bs-html="true" title="<?php
5799 echo esc_attr( sprintf(
5800 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
5801 "<p>" . __('A format string for numeric axis labels. You can choose any of the following:', "chart-builder") . "</p><ul class='ays_tooltop_ul'><li>" .
5802 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
5803 __('%1$sNone:%2$s Displays numbers with no formatting (e.g., 8000000)', "chart-builder") . "</li><li>" .
5804 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
5805 __('%1$sDecimal:%2$s Displays numbers with thousands separators (e.g., 8,000,000)', "chart-builder") . "</li><li>" .
5806 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
5807 __('%1$sScientific:%2$s Displays numbers in scientific notation (e.g., 8e6)', "chart-builder") . "</li><li>" .
5808 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
5809 __('%1$sCurrency:%2$s Displays numbers in the local currency (e.g., $8,000,000.00)', "chart-builder") . "</li><li>" .
5810 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
5811 __('%1$sPercent:%2$s Displays numbers as percentages (e.g., 800,000,000%%)', "chart-builder") . "</li><li>" .
5812 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
5813 __('%1$sShort:%2$s Displays abbreviated numbers (e.g., 8M)', "chart-builder") . "</li><li>" .
5814 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
5815 __('%1$sLong:%2$s Displays numbers as full words (e.g., 8 million)', "chart-builder") . "</li></ul>",
5816 '<em>', '</em>',
5817 '<em>', '</em>',
5818 '<em>', '</em>',
5819 '<em>', '</em>',
5820 '<em>', '</em>',
5821 '<em>', '</em>',
5822 '<em>', '</em>'
5823 ));
5824 ?>">
5825 <i class="ays_fa ays_fa_info_circle"></i>
5826 </a>
5827 </label>
5828 </div>
5829 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5830 <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]">
5831 <?php
5832 foreach ( $haxis_format_options as $option_slug => $option ):
5833 $selected = ( $haxis_format == $option_slug ) ? 'selected' : '';
5834 ?>
5835 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
5836 <?php
5837 endforeach;
5838 ?>
5839 </select>
5840 </div>
5841 </div> <!-- Horizontal axis format -->
5842 <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;'; ?>">
5843 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5844 <label for="ays-chart-option-haxis-enable-divide-percent">
5845 <?php echo esc_html(__( "Remove Extra Zeros ", "chart-builder" )); ?>
5846 <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") ); ?>">
5847 <i class="ays_fa ays_fa_info_circle"></i>
5848 </a>
5849 </label>
5850 </div>
5851 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5852 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5853 <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); ?> >
5854 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5855 </label>
5856 </div>
5857 </div> <!--Remove Extra Zeros"-->
5858 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-bar_chart-opt" >
5859 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5860 <label for="ays-chart-option-haxis-max-value" class="form-label">
5861 <?php echo esc_html(__( "Max value", "chart-builder" )); ?>
5862 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The maximum value of the axis.","chart-builder") ); ?>">
5863 <i class="ays_fa ays_fa_info_circle"></i>
5864 </a>
5865 </label>
5866 </div>
5867 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5868 <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) ?>">
5869 </div>
5870 </div> <!-- Horizontal axis max value -->
5871 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-bar_chart-opt" >
5872 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5873 <label for="ays-chart-option-haxis-min-value" class="form-label">
5874 <?php echo esc_html(__( "Min value", "chart-builder" )); ?>
5875 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The minimum value of the axis.","chart-builder") ); ?>">
5876 <i class="ays_fa ays_fa_info_circle"></i>
5877 </a>
5878 </label>
5879 </div>
5880 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5881 <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) ?>">
5882 </div>
5883 </div> <!-- Horizontal axis min value -->
5884 </div>
5885 </div>
5886 <?php
5887 $content = ob_get_clean();
5888
5889 $title = __( 'Horizontal Axis Settings', "chart-builder" );
5890
5891 $sources['horizontal_axis'] = array(
5892 'content' => $content,
5893 'title' => $title
5894 );
5895
5896 return $sources;
5897 }
5898
5899 public function settings_contents_vertical_axis_settings( $sources, $args ){
5900 $html_class_prefix = $args['html_class_prefix'];
5901 $html_name_prefix = $args['html_name_prefix'];
5902 $settings = $args['settings'];
5903
5904 $vaxis_title = $settings['vaxis_title'];
5905 $axes_text_positions = $settings['axes_text_positions'];
5906 $vaxis_text_position = $settings['vaxis_text_position'];
5907 $vaxis_direction = $settings['vaxis_direction'];
5908 $vaxis_text_color = $settings['vaxis_text_color'];
5909 $vaxis_baseline_color = $settings['vaxis_baseline_color'];
5910 $vaxis_format_options = $settings['axes_format_options'];
5911 $vaxis_format = $settings['vaxis_format'];
5912 $vaxis_enable_divide_percent = $settings['vaxis_enable_divide_percent'];
5913 $vaxis_label_font_size = $settings['vaxis_label_font_size'];
5914 $vaxis_max_value = $settings['vaxis_max_value'];
5915 $vaxis_min_value = $settings['vaxis_min_value'];
5916 $vaxis_text_font_size = $settings['vaxis_text_font_size'];
5917 $vaxis_label_color = $settings['vaxis_label_color'];
5918 $vaxis_bold = $settings['vaxis_bold'];
5919 $vaxis_italic = $settings['vaxis_italic'];
5920 $vaxis_title_bold = $settings['vaxis_title_bold'];
5921 $vaxis_title_italic = $settings['vaxis_title_italic'];
5922 $vaxis_gridlines_count = $settings['vaxis_gridlines_count'];
5923 $vaxis_gridlines_color = $settings['vaxis_gridlines_color'];
5924 $vaxis_minor_gridlines_color = $settings['vaxis_minor_gridlines_color'];
5925
5926 ob_start();
5927 ?>
5928 <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">
5929 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
5930 <h6>Label</h6>
5931 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5932 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5933 <label for="ays-chart-option-vaxis-title" class="form-label">
5934 <?php echo esc_html(__( "Label", "chart-builder" )); ?>
5935 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The title of the vertical axis","chart-builder") ); ?>">
5936 <i class="ays_fa ays_fa_info_circle"></i>
5937 </a>
5938 </label>
5939 </div>
5940 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5941 <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) ?>">
5942 </div>
5943 </div> <!-- Vertical axis label -->
5944 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5945 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5946 <label for="ays-chart-option-vaxis-label-font-size" class="form-label">
5947 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
5948 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The font size of the vertical axis label.","chart-builder") ); ?>">
5949 <i class="ays_fa ays_fa_info_circle"></i>
5950 </a>
5951 </label>
5952 </div>
5953 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5954 <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) ?>">
5955 </div>
5956 </div> <!-- Vertical axis label font size -->
5957 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5958 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5959 <label for="ays-chart-option-vaxis-label-color">
5960 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
5961 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the horizontal axis label.","chart-builder") ); ?>">
5962 <i class="ays_fa ays_fa_info_circle"></i>
5963 </a>
5964 </label>
5965 </div>
5966 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5967 <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) ?>">
5968 </div>
5969 </div> <!-- Vertical axis label color -->
5970 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5971 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5972 <label for="ays-chart-option-vaxis-title-italic">
5973 <?php echo esc_html(__( "Italic", "chart-builder" )); ?>
5974 <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") ); ?>">
5975 <i class="ays_fa ays_fa_info_circle"></i>
5976 </a>
5977 </label>
5978 </div>
5979 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5980 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5981 <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); ?> >
5982 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5983 </label>
5984 </div>
5985 </div> <!-- Italic label -->
5986 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5987 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5988 <label for="ays-chart-option-vaxis-title-bold">
5989 <?php echo esc_html(__( "Bold", "chart-builder" )); ?>
5990 <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") ); ?>">
5991 <i class="ays_fa ays_fa_info_circle"></i>
5992 </a>
5993 </label>
5994 </div>
5995 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5996 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5997 <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); ?> >
5998 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5999 </label>
6000 </div>
6001 </div> <!-- Bold label -->
6002
6003 <br>
6004 <h6>Text</h6>
6005 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6006 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6007 <label for="ays-chart-option-vaxis-text-position" class="form-label">
6008 <?php echo esc_html(__( "Position", "chart-builder" )); ?>
6009 <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") ); ?>">
6010 <i class="ays_fa ays_fa_info_circle"></i>
6011 </a>
6012 </label>
6013 </div>
6014 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6015 <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]">
6016 <?php
6017 foreach ( $axes_text_positions as $option_slug => $option ):
6018 $selected = ( $vaxis_text_position == $option_slug ) ? 'selected' : '';
6019 ?>
6020 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
6021 <?php
6022 endforeach;
6023 ?>
6024 </select>
6025 </div>
6026 </div> <!-- Vertical axis text position -->
6027 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6028 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6029 <label for="ays-chart-option-vaxis-text-color">
6030 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
6031 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the vertical axis text.","chart-builder") ); ?>">
6032 <i class="ays_fa ays_fa_info_circle"></i>
6033 </a>
6034 </label>
6035 </div>
6036 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6037 <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) ?>">
6038 </div>
6039 </div> <!-- Vertical axis text color -->
6040 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6041 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6042 <label for="ays-chart-option-vaxis-text-font-size" class="form-label">
6043 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
6044 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The font size of the horizontal axis text.","chart-builder") ); ?>">
6045 <i class="ays_fa ays_fa_info_circle"></i>
6046 </a>
6047 </label>
6048 </div>
6049 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6050 <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) ?>">
6051 </div>
6052 </div> <!-- Vertical axis text font size -->
6053 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6054 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6055 <label for="ays-chart-option-vaxis-text-direction">
6056 <?php echo esc_html(__( "Reverse Direction", "chart-builder" )); ?>
6057 <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") ); ?>">
6058 <i class="ays_fa ays_fa_info_circle"></i>
6059 </a>
6060 </label>
6061 </div>
6062 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6063 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6064 <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); ?> >
6065 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6066 </label>
6067 </div>
6068 </div> <!-- Vertical axis text direction -->
6069 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6070 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6071 <label for="ays-chart-option-vaxis-italic">
6072 <?php echo esc_html(__( "Italic text", "chart-builder" )); ?>
6073 <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") ); ?>">
6074 <i class="ays_fa ays_fa_info_circle"></i>
6075 </a>
6076 </label>
6077 </div>
6078 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6079 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6080 <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); ?> >
6081 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6082 </label>
6083 </div>
6084 </div> <!-- Italic text -->
6085 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6086 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6087 <label for="ays-chart-option-vaxis-bold">
6088 <?php echo esc_html(__( "Bold text", "chart-builder" )); ?>
6089 <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") ); ?>">
6090 <i class="ays_fa ays_fa_info_circle"></i>
6091 </a>
6092 </label>
6093 </div>
6094 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6095 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6096 <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); ?> >
6097 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6098 </label>
6099 </div>
6100 </div> <!-- Bold text -->
6101
6102 <br>
6103 <h6>Gridlines</h6>
6104 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6105 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6106 <label for="ays-chart-option-vaxis-gridlines-count" class="form-label">
6107 <?php echo esc_html(__( "Count", "chart-builder" )); ?>
6108 <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") ); ?>">
6109 <i class="ays_fa ays_fa_info_circle"></i>
6110 </a>
6111 </label>
6112 </div>
6113 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6114 <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) ?>">
6115 </div>
6116 </div> <!-- Vertical axis gridlines count -->
6117 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6118 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6119 <label for="ays-chart-option-vaxis-gridlines-color">
6120 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
6121 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the vertical axis gridlines.","chart-builder") ); ?>">
6122 <i class="ays_fa ays_fa_info_circle"></i>
6123 </a>
6124 </label>
6125 </div>
6126 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6127 <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) ?>">
6128 </div>
6129 </div> <!-- Vertical axis gridlines color -->
6130 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6131 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6132 <label for="ays-chart-option-vaxis-minor-gridlines-color">
6133 <?php echo esc_html(__( "Minor gridlines color", "chart-builder" )); ?>
6134 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the vertical axis minor gridlines.","chart-builder") ); ?>">
6135 <i class="ays_fa ays_fa_info_circle"></i>
6136 </a>
6137 </label>
6138 </div>
6139 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6140 <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) ?>">
6141 </div>
6142 </div> <!-- Vertical axis minor gridlines color -->
6143 <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">
6144 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6145 <label for="ays-chart-option-vaxis-baseline-color">
6146 <?php echo esc_html(__( "Baseline color", "chart-builder" )); ?>
6147 <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") ); ?>">
6148 <i class="ays_fa ays_fa_info_circle"></i>
6149 </a>
6150 </label>
6151 </div>
6152 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6153 <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) ?>">
6154 </div>
6155 </div> <!-- Vertical axis baseline color -->
6156
6157 <br class="cb-changable-opt cb-column_chart-opt cb-line_chart-opt">
6158 <h6 class="cb-changable-opt cb-column_chart-opt cb-line_chart-opt">Format</h6>
6159 <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">
6160 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6161 <label for="ays-chart-option-vaxis-format" class="form-label">
6162 <?php echo esc_html(__( "Format", "chart-builder" )); ?>
6163 <a class="ays_help" data-bs-toggle="tooltip" data-bs-html="true" title="<?php
6164 echo esc_attr( sprintf(
6165 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6166 "<p>" . __('A format string for numeric axis labels. You can choose any of the following:', "chart-builder") . "</p><ul class='ays_tooltop_ul'><li>" .
6167 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6168 __('%1$sNone:%2$s Displays numbers with no formatting (e.g., 8000000)', "chart-builder") . "</li><li>" .
6169 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6170 __('%1$sDecimal:%2$s Displays numbers with thousands separators (e.g., 8,000,000)', "chart-builder") . "</li><li>" .
6171 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6172 __('%1$sScientific:%2$s Displays numbers in scientific notation (e.g., 8e6)', "chart-builder") . "</li><li>" .
6173 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6174 __('%1$sCurrency:%2$s Displays numbers in the local currency (e.g., $8,000,000.00)', "chart-builder") . "</li><li>" .
6175 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6176 __('%1$sPercent:%2$s Displays numbers as percentages (e.g., 800,000,000%%)', "chart-builder") . "</li><li>" .
6177 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6178 __('%1$sShort:%2$s Displays abbreviated numbers (e.g., 8M)', "chart-builder") . "</li><li>" .
6179 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6180 __('%1$sLong:%2$s Displays numbers as full words (e.g., 8 million)', "chart-builder") . "</li></ul>",
6181 '<em>', '</em>',
6182 '<em>', '</em>',
6183 '<em>', '</em>',
6184 '<em>', '</em>',
6185 '<em>', '</em>',
6186 '<em>', '</em>',
6187 '<em>', '</em>'
6188 ));
6189 ?>">
6190 <i class="ays_fa ays_fa_info_circle"></i>
6191 </a>
6192 </label>
6193 </div>
6194 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6195 <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]">
6196 <?php
6197 foreach ( $vaxis_format_options as $option_slug => $option ):
6198 $selected = ( $vaxis_format == $option_slug ) ? 'selected' : '';
6199 ?>
6200 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
6201 <?php
6202 endforeach;
6203 ?>
6204 </select>
6205 </div>
6206 </div> <!-- Vertical axis format -->
6207 <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;'; ?>">
6208 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6209 <label for="ays-chart-option-vaxis-enable-divide-percent">
6210 <?php echo esc_html(__( "Remove Extra Zeros", "chart-builder" )); ?>
6211 <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") ); ?>">
6212 <i class="ays_fa ays_fa_info_circle"></i>
6213 </a>
6214 </label>
6215 </div>
6216 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6217 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6218 <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); ?> >
6219 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6220 </label>
6221 </div>
6222 </div> <!--Remove Extra Zeros-->
6223 <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">
6224 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6225 <label for="ays-chart-option-vaxis-max-value" class="form-label">
6226 <?php echo esc_html(__( "Max value", "chart-builder" )); ?>
6227 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The maximum value of the axis.","chart-builder") ); ?>">
6228 <i class="ays_fa ays_fa_info_circle"></i>
6229 </a>
6230 </label>
6231 </div>
6232 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6233 <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) ?>">
6234 </div>
6235 </div> <!-- Vertical axis max value -->
6236 <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">
6237 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6238 <label for="ays-chart-option-vaxis-min-value" class="form-label">
6239 <?php echo esc_html(__( "Min value", "chart-builder" )); ?>
6240 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The minimum value of the axis.","chart-builder") ); ?>">
6241 <i class="ays_fa ays_fa_info_circle"></i>
6242 </a>
6243 </label>
6244 </div>
6245 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6246 <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) ?>">
6247 </div>
6248 </div> <!-- Vertical axis min value -->
6249 </div>
6250 </div>
6251 <?php
6252 $content = ob_get_clean();
6253
6254 $title = __( 'Vertical Axis Settings', "chart-builder" );
6255
6256 $sources['vertical_axis'] = array(
6257 'content' => $content,
6258 'title' => $title
6259 );
6260
6261 return $sources;
6262 }
6263
6264 public function settings_contents_animation_settings( $sources, $args ) {
6265 $html_class_prefix = $args['html_class_prefix'];
6266 $html_name_prefix = $args['html_name_prefix'];
6267 $settings = $args['settings'];
6268
6269 $enable_animation = $settings['enable_animation'];
6270 $animation_duration = $settings['animation_duration'];
6271 $animation_startup = $settings['animation_startup'];
6272 $animation_easing_options = $settings['animation_easing_options'];
6273 $animation_easing = $settings['animation_easing'];
6274
6275 ob_start();
6276 ?>
6277 <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">
6278 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
6279 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6280 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6281 <label for="ays-chart-option-enable-animation">
6282 <?php echo esc_html(__( "Enable chart animation", "chart-builder" )); ?>
6283 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable chart animation.","chart-builder") ); ?>">
6284 <i class="ays_fa ays_fa_info_circle"></i>
6285 </a>
6286 </label>
6287 </div>
6288 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6289 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6290 <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); ?> >
6291 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6292 </label>
6293 </div>
6294 </div> <!-- Enable animation -->
6295 <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'; ?>">
6296 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6297 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6298 <label for="ays-chart-option-animation-duration" class="form-label">
6299 <?php echo esc_html(__( "Duration", "chart-builder" )); ?>
6300 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The duration of the chart animation, in milliseconds.","chart-builder") ); ?>">
6301 <i class="ays_fa ays_fa_info_circle"></i>
6302 </a>
6303 </label>
6304 </div>
6305 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6306 <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) ?>">
6307 </div>
6308 </div> <!-- Animation duration -->
6309 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6310 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6311 <label for="ays-chart-option-animation-startup">
6312 <?php echo esc_html(__( "Startup", "chart-builder" )); ?>
6313 <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") ); ?>">
6314 <i class="ays_fa ays_fa_info_circle"></i>
6315 </a>
6316 </label>
6317 </div>
6318 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6319 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6320 <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); ?> >
6321 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6322 </label>
6323 </div>
6324 </div> <!-- Animation startup -->
6325 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6326 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6327 <label for="ays-chart-option-animation-easing" class="form-label">
6328 <?php echo esc_html(__( "Easing", "chart-builder" )); ?>
6329 <a class="ays_help" data-bs-toggle="tooltip" data-bs-html="true" title="<?php
6330 echo esc_attr( sprintf(
6331 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6332 "<p>" . __('The easing function applied to the chart animation. The following options are available:', "chart-builder") . "</p><ul class='ays_tooltop_ul'><li>" .
6333 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6334 __('%1$sLinear:%2$s Constant speed.', "chart-builder") . "</li><li>" .
6335 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6336 __('%1$sEase in:%2$s Start slow and speed up.', "chart-builder") . "</li><li>" .
6337 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6338 __('%1$sEase out:%2$s Start fast and slow down.', "chart-builder") . "</li><li>" .
6339 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6340 __('%1$sEase in and out:%2$s Start slow, speed up, then slow down.', "chart-builder") . "</li></ul>",
6341 '<em>', '</em>',
6342 '<em>', '</em>',
6343 '<em>', '</em>',
6344 '<em>', '</em>'
6345 ));
6346 ?>">
6347 <i class="ays_fa ays_fa_info_circle"></i>
6348 </a>
6349 </label>
6350 </div>
6351 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6352 <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]">
6353 <?php
6354 foreach ( $animation_easing_options as $option_slug => $option ):
6355 $selected = ( $animation_easing == $option_slug ) ? 'selected' : '';
6356 ?>
6357 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
6358 <?php
6359 endforeach;
6360 ?>
6361 </select>
6362 </div>
6363 </div> <!-- Animation easing -->
6364 <div>
6365 </div>
6366 </div>
6367 <?php
6368 $content = ob_get_clean();
6369
6370 $title = __( 'Chart animation', "chart-builder" );
6371
6372 $sources['animation'] = array(
6373 'content' => $content,
6374 'title' => $title
6375 );
6376
6377 return $sources;
6378 }
6379
6380 public function settings_contents_live_chart_settings( $sources, $args ) {
6381 $html_class_prefix = $args['html_class_prefix'];
6382 $html_name_prefix = $args['html_name_prefix'];
6383
6384 ob_start();
6385 ?>
6386 <div class="ays-accordion-data-main-wrap <?php echo esc_attr($html_class_prefix) ?>options-live-chart-settings-tab">
6387 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
6388 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section ays-pro-features-v2-main-box">
6389 <div class="ays-pro-features-v2-small-buttons-box-middle ays-pro-features-v2-big-buttons-box">
6390 <a href="https://www.youtube.com/watch?v=lhTqZmFUNz4" target="_blank" class="ays-pro-features-v2-video-button">
6391 <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>
6392 <div class="ays-pro-features-v2-video-text">
6393 <?php echo esc_html(__("Watch Video" , "chart-builder")); ?>
6394 </div>
6395 </a>
6396 <a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-pro-features-v2-upgrade-button">
6397 <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>
6398 <div class="ays-pro-features-v2-upgrade-text">
6399 <?php echo esc_html(__("Upgrade" , "chart-builder")); ?>
6400 </div>
6401 </a>
6402 </div>
6403 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6404 <label for="ays-chart-option-enable-live-chart">
6405 <?php echo esc_html(__( "Enable live chart", "chart-builder" )); ?>
6406 <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") ); ?>">
6407 <i class="ays_fa ays_fa_info_circle"></i>
6408 </a>
6409 </label>
6410 </div>
6411 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6412 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6413 <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">
6414 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6415 </label>
6416 </div>
6417 </div> <!-- Enable live chart -->
6418 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section ays-pro-features-v2-main-box">
6419 <div class="ays-pro-features-v2-small-buttons-box-middle ays-pro-features-v2-big-buttons-box">
6420 <a href="https://www.youtube.com/watch?v=lhTqZmFUNz4" target="_blank" class="ays-pro-features-v2-video-button">
6421 <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>
6422 <div class="ays-pro-features-v2-video-text">
6423 <?php echo esc_html(__("Watch Video" , "chart-builder")); ?>
6424 </div>
6425 </a>
6426 <a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-pro-features-v2-upgrade-button">
6427 <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>
6428 <div class="ays-pro-features-v2-upgrade-text">
6429 <?php echo esc_html(__("Upgrade" , "chart-builder")); ?>
6430 </div>
6431 </a>
6432 </div>
6433 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6434 <label for="ays-chart-option-live-chart-interval" class="form-label">
6435 <?php echo esc_html(__( "Interval", "chart-builder" )); ?>
6436 <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") ); ?>">
6437 <i class="ays_fa ays_fa_info_circle"></i>
6438 </a>
6439 </label>
6440 </div>
6441 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6442 <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">
6443 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">ms</div>
6444 </div>
6445 </div> <!-- Live chart interval -->
6446 </div>
6447 </div>
6448 <?php
6449 $content = ob_get_clean();
6450
6451 $title = __( 'Live Chart', "chart-builder" );
6452
6453 $sources['live_chart'] = array(
6454 'content' => $content,
6455 'title' => $title
6456 );
6457
6458 return $sources;
6459
6460 }
6461
6462 public function settings_contents_export_options( $sources, $args ){
6463 $html_class_prefix = $args['html_class_prefix'];
6464 $html_name_prefix = $args['html_name_prefix'];
6465 $settings = $args['settings'];
6466
6467 $enable_img = $settings['enable_img'];
6468
6469 ob_start();
6470 ?>
6471 <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">
6472 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
6473 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section ays-pro-features-v2-main-box">
6474 <div class="ays-pro-features-v2-small-buttons-box-middle ays-pro-features-v2-big-buttons-box">
6475 <a href="https://www.youtube.com/watch?v=9UqLXG5NU_I" target="_blank" class="ays-pro-features-v2-video-button">
6476 <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>
6477 <div class="ays-pro-features-v2-video-text">
6478 <?php echo esc_html(__("Watch Video" , "chart-builder")); ?>
6479 </div>
6480 </a>
6481 <a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-pro-features-v2-upgrade-button">
6482 <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>
6483 <div class="ays-pro-features-v2-upgrade-text">
6484 <?php echo esc_html(__("Upgrade" , "chart-builder")); ?>
6485 </div>
6486 </a>
6487 </div>
6488 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6489 <label for="ays-chart-option-export-print">
6490 <?php echo esc_html(__( "Print chart", "chart-builder" )); ?>
6491 <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") ); ?>">
6492 <i class="ays_fa ays_fa_info_circle"></i>
6493 </a>
6494 </label>
6495 </div>
6496 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6497 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6498 <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">
6499 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6500 </label>
6501 </div>
6502 </div> <!-- Print option end -->
6503 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section ays-pro-features-v2-main-box">
6504 <div class="ays-pro-features-v2-small-buttons-box-middle ays-pro-features-v2-big-buttons-box">
6505 <a href="https://www.youtube.com/watch?v=9UqLXG5NU_I" target="_blank" class="ays-pro-features-v2-video-button">
6506 <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>
6507 <div class="ays-pro-features-v2-video-text">
6508 <?php echo esc_html(__("Watch Video" , "chart-builder")); ?>
6509 </div>
6510 </a>
6511 <a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-pro-features-v2-upgrade-button">
6512 <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>
6513 <div class="ays-pro-features-v2-upgrade-text">
6514 <?php echo esc_html(__("Upgrade" , "chart-builder")); ?>
6515 </div>
6516 </a>
6517 </div>
6518 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6519 <label for="ays-chart-option-export-Excel">
6520 <?php echo esc_html(__( "Excel download", "chart-builder" )); ?>
6521 <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") ); ?>">
6522 <i class="ays_fa ays_fa_info_circle"></i>
6523 </a>
6524 </label>
6525 </div>
6526 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6527 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6528 <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">
6529 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6530 </label>
6531 </div>
6532 </div> <!-- Excel option end -->
6533 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section ays-pro-features-v2-main-box">
6534 <div class="ays-pro-features-v2-small-buttons-box-middle ays-pro-features-v2-big-buttons-box">
6535 <a href="https://www.youtube.com/watch?v=9UqLXG5NU_I" target="_blank" class="ays-pro-features-v2-video-button">
6536 <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>
6537 <div class="ays-pro-features-v2-video-text">
6538 <?php echo esc_html(__("Watch Video" , "chart-builder")); ?>
6539 </div>
6540 </a>
6541 <a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-pro-features-v2-upgrade-button">
6542 <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>
6543 <div class="ays-pro-features-v2-upgrade-text">
6544 <?php echo esc_html(__("Upgrade" , "chart-builder")); ?>
6545 </div>
6546 </a>
6547 </div>
6548 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6549 <label for="ays-chart-option-export-CSV">
6550 <?php echo esc_html(__( "CSV download", "chart-builder" )); ?>
6551 <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") ); ?>">
6552 <i class="ays_fa ays_fa_info_circle"></i>
6553 </a>
6554 </label>
6555 </div>
6556 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6557 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6558 <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">
6559 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6560 </label>
6561 </div>
6562 </div> <!-- CSV option end -->
6563 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section ays-pro-features-v2-main-box">
6564 <div class="ays-pro-features-v2-small-buttons-box-middle ays-pro-features-v2-big-buttons-box">
6565 <a href="https://www.youtube.com/watch?v=9UqLXG5NU_I" target="_blank" class="ays-pro-features-v2-video-button">
6566 <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>
6567 <div class="ays-pro-features-v2-video-text">
6568 <?php echo esc_html(__("Watch Video" , "chart-builder")); ?>
6569 </div>
6570 </a>
6571 <a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-pro-features-v2-upgrade-button">
6572 <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>
6573 <div class="ays-pro-features-v2-upgrade-text">
6574 <?php echo esc_html(__("Upgrade" , "chart-builder")); ?>
6575 </div>
6576 </a>
6577 </div>
6578 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6579 <label for="ays-chart-option-export-Copy">
6580 <?php echo esc_html(__( "Copy chart data", "chart-builder" )); ?>
6581 <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") ); ?>">
6582 <i class="ays_fa ays_fa_info_circle"></i>
6583 </a>
6584 </label>
6585 </div>
6586 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6587 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6588 <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">
6589 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6590 </label>
6591 </div>
6592 </div> <!-- Copy option end -->
6593 <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">
6594 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6595 <label for="ays-chart-option-export-img">
6596 <?php echo esc_html(__( "Download chart image", "chart-builder" )); ?>
6597 <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") ); ?>">
6598 <i class="ays_fa ays_fa_info_circle"></i>
6599 </a>
6600 </label>
6601 </div>
6602 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6603 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6604 <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)?> >
6605 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6606 </label>
6607 </div>
6608 </div> <!-- IMG option end -->
6609 </div>
6610 </div>
6611 <?php
6612
6613 $content = ob_get_clean();
6614
6615 $title = __( 'Frontend Actions', "chart-builder" );
6616
6617 $sources['export_options'] = array(
6618 'content' => $content,
6619 'title' => $title
6620 );
6621
6622 return $sources;
6623 }
6624
6625 /**
6626 * Chart page styles contents
6627 * @param $args
6628 */
6629 public function ays_chart_page_styles_contents( $args ){
6630 $chart_source_type = $args['chart_source_type'];
6631
6632 if ($chart_source_type === 'chart-js') {
6633 $sources_contents = apply_filters( 'ays_cb_chart_page_styles_contents_settings_chartjs', array(), $args );
6634 } else {
6635 $sources_contents = apply_filters( 'ays_cb_chart_page_styles_contents_settings', array(), $args );
6636 }
6637
6638 $sources = array();
6639 foreach ( $sources_contents as $key => $sources_content ) {
6640 $collapsed = $key == 'chart' ? 'false' : 'true';
6641
6642 $content = '<fieldset class="ays-accordion-options-container" data-collapsed="' . $collapsed . '">';
6643 if(isset($sources_content['title'])){
6644 $content .= '<legend class="ays-accordion-options-header">';
6645 $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">
6646 <g>
6647 <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" />
6648 </g>
6649 </svg>';
6650
6651 $content .= '<span>'. esc_html($sources_content['title']) .'</span></legend>';
6652 }
6653
6654 $content .= '<div class="ays-accordion-options-content">';
6655 $content .= $sources_content['content'];
6656 $content .= '</div>';
6657
6658 $content .= '</fieldset>';
6659
6660 $sources[] = $content;
6661 }
6662 $content_for_escape = implode('' , $sources );
6663 echo html_entity_decode( esc_html($content_for_escape) );
6664 }
6665
6666 public function settings_contents_chart_styles_settings( $sources, $args ){
6667 $html_class_prefix = $args['html_class_prefix'];
6668 $html_name_prefix = $args['html_name_prefix'];
6669 $settings = $args['settings'];
6670
6671 $width = $settings['width'];
6672 $width_format = $settings['width_format'];
6673 $title_positions = $settings['title_positions'];
6674 $position = $settings['position'];
6675 $width_format_options = $settings['width_format_options'];
6676 $responsive_width = $settings['responsive_width'];
6677 $height = $settings['height'];
6678 $height_format = $settings['height_format'];
6679 $font_size = $settings['font_size'];
6680 $org_chart_font_size_options = $settings['org_chart_font_size_options'];
6681 $org_chart_font_size = $settings['org_chart_font_size'];
6682 $background_color = $settings['background_color'];
6683 $transparent_background = $settings['transparent_background'];
6684 $border_width = $settings['border_width'];
6685 $border_width_with_title = $settings['border_width_with_title'];
6686 $border_radius_with_title = $settings['border_radius_with_title'];
6687 $border_color_with_title = $settings['border_color_with_title'];
6688 $border_style_with_title = $settings['border_style_with_title'];
6689 $border_style = $settings['border_style'];
6690 $border_styles = $settings['border_styles'];
6691 $border_radius = $settings['border_radius'];
6692 $border_color = $settings['border_color'];
6693 $box_shadow = $settings['box_shadow'];
6694 $box_shadow_color = $settings['box_shadow_color'];
6695 $padding_outer = $settings['padding_outer'];
6696 ob_start();
6697 ?>
6698 <div class="ays-accordion-data-main-wrap">
6699 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
6700 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6701 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6702 <label for="ays-chart-option-width" class="form-label">
6703 <?php echo esc_html(__( "Width", "chart-builder" )); ?>
6704 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The width of the chart container, in percents.","chart-builder") ); ?>">
6705 <i class="ays_fa ays_fa_info_circle"></i>
6706 </a>
6707 </label>
6708 </div>
6709 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6710 <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) ?>">
6711 <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]">
6712 <?php
6713 foreach ( $width_format_options as $option_slug => $option ):
6714 $selected = ( $width_format == $option_slug ) ? 'selected' : '';
6715 ?>
6716 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
6717 <?php
6718 endforeach;
6719 ?>
6720 </select>
6721 </div>
6722 </div> <!-- Width -->
6723 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6724 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6725 <label for="ays-chart-option-responsive-width" class="form-label">
6726 <?php echo esc_html(__( "Responsive Width", "chart-builder" )); ?>
6727 <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") ); ?>">
6728 <i class="ays_fa ays_fa_info_circle"></i>
6729 </a>
6730 </label>
6731 </div>
6732 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6733 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6734 <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); ?> >
6735 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6736 </label>
6737 </div>
6738 </div> <!-- Responsive Width -->
6739 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6740 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6741 <label for="ays-chart-option-position">
6742 <?php echo esc_html(__( "Position", "chart-builder" )); ?>
6743 <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") ); ?>">
6744 <i class="ays_fa ays_fa_info_circle"></i>
6745 </a>
6746 </label>
6747 </div>
6748 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6749 <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]">
6750 <?php
6751 foreach ( $title_positions as $option_slug => $option ):
6752 $selected = ( $position == $option_slug ) ? 'selected' : '';
6753 ?>
6754 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
6755 <?php
6756 endforeach;
6757 ?>
6758 </select>
6759 </div>
6760 </div> <!-- Position -->
6761 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6762 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6763 <label for="ays-chart-option-height" class="form-label">
6764 <?php echo esc_html(__( "Height", "chart-builder" )); ?>
6765 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The height of the chart container, in pixels.","chart-builder") ); ?>">
6766 <i class="ays_fa ays_fa_info_circle"></i>
6767 </a>
6768 </label>
6769 </div>
6770 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6771 <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) ?>">
6772 <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]">
6773 <?php
6774 foreach ( $width_format_options as $option_slug => $option ):
6775 $selected = ( $height_format == $option_slug ) ? 'selected' : '';
6776 ?>
6777 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
6778 <?php
6779 endforeach;
6780 ?>
6781 </select>
6782 </div>
6783 </div> <!-- Height -->
6784 <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">
6785 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6786 <label for="ays-chart-option-font-size" class="form-label">
6787 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
6788 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The font size of the chart text.","chart-builder") ); ?>">
6789 <i class="ays_fa ays_fa_info_circle"></i>
6790 </a>
6791 </label>
6792 </div>
6793 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6794 <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) ?>">
6795 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
6796 </div>
6797 </div> <!-- Font size -->
6798 <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">
6799 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6800 <label for="ays-chart-option-org-chart-font-size" class="form-label">
6801 <?php echo esc_html(__( "Element size", 'chart-builder' )); ?>
6802 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The size of the chart element.","chart-builder") ); ?>">
6803 <i class="ays_fa ays_fa_info_circle"></i>
6804 </a>
6805 </label>
6806 </div>
6807 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6808 <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]">
6809 <?php
6810 foreach ( $org_chart_font_size_options as $option_slug => $option ):
6811 $selected = ( $org_chart_font_size == $option_slug ) ? 'selected' : '';
6812 ?>
6813 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_attr($option); ?></option>
6814 <?php
6815 endforeach;
6816 ?>
6817 </select>
6818 </div>
6819 </div> <!-- Font size for org type -->
6820 <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">
6821 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6822 <label for="ays-chart-option-background-color">
6823 <?php echo esc_html(__( "Background Color", "chart-builder" )); ?>
6824 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The background color of the chart container.","chart-builder") ); ?>">
6825 <i class="ays_fa ays_fa_info_circle"></i>
6826 </a>
6827 </label>
6828 </div>
6829 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6830 <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) ?>">
6831 </div>
6832 </div> <!-- Background color -->
6833 <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">
6834 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6835 <label for="ays-chart-option-transparent-background" class="form-label">
6836 <?php echo esc_html(__( "Transparent background", "chart-builder" )); ?>
6837 <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") ); ?>">
6838 <i class="ays_fa ays_fa_info_circle"></i>
6839 </a>
6840 </label>
6841 </div>
6842 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6843 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6844 <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); ?> >
6845 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6846 </label>
6847 </div>
6848 </div> <!-- Transparent background -->
6849 <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">
6850 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6851 <label for="ays-chart-option-border-width">
6852 <?php echo esc_html(__( "Border Width", "chart-builder" )); ?>
6853 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The width of the chart container border.","chart-builder") ); ?>">
6854 <i class="ays_fa ays_fa_info_circle"></i>
6855 </a>
6856 </label>
6857 </div>
6858 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6859 <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) ?>">
6860 </div>
6861 </div> <!-- Border Width -->
6862 <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">
6863 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6864 <label for="ays-chart-option-border-color">
6865 <?php echo esc_html(__( "Border Color", "chart-builder" )); ?>
6866 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The border color of the chart container.","chart-builder") ); ?>">
6867 <i class="ays_fa ays_fa_info_circle"></i>
6868 </a>
6869 </label>
6870 </div>
6871 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6872 <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) ?>">
6873 </div>
6874 </div> <!-- Border color -->
6875 <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">
6876 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6877 <label for="ays-chart-option-border-radius">
6878 <?php echo esc_html(__( "Border Radius", "chart-builder" )); ?>
6879 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The border radius of the chart container.","chart-builder") ); ?>">
6880 <i class="ays_fa ays_fa_info_circle"></i>
6881 </a>
6882 </label>
6883 </div>
6884 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6885 <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) ?>">
6886 </div>
6887 </div> <!-- Border radius -->
6888 <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">
6889 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6890 <label for="ays-chart-option-border-style">
6891 <?php echo esc_html(__( "Border Style", "chart-builder" )); ?>
6892 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The style of the chart container border.","chart-builder") ); ?>">
6893 <i class="ays_fa ays_fa_info_circle"></i>
6894 </a>
6895 </label>
6896 </div>
6897 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6898 <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]">
6899 <?php
6900 foreach ( $border_styles as $option_slug => $option ):
6901 $selected = ( $border_style == $option_slug ) ? 'selected' : '';
6902 ?>
6903 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
6904 <?php
6905 endforeach;
6906 ?>
6907 </select>
6908 </div>
6909 </div> <!-- Border style -->
6910 <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">
6911 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6912 <label for="ays-chart-option-box-shadow" class="form-label">
6913 <?php echo esc_html(__( "Box Shadow", "chart-builder" )); ?>
6914 <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") ); ?>">
6915 <i class="ays_fa ays_fa_info_circle"></i>
6916 </a>
6917 </label>
6918 </div>
6919 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6920 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6921 <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); ?> >
6922 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6923 </label>
6924 </div>
6925 </div> <!-- box shadow -->
6926 <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">
6927 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6928 <label for="ays-chart-option-box-shadow-color" class="form-label">
6929 <?php echo esc_html(__( "Box Shadow Color", "chart-builder" )); ?>
6930 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Choose chart container's box shadow color.","chart-builder") ); ?>">
6931 <i class="ays_fa ays_fa_info_circle"></i>
6932 </a>
6933 </label>
6934 </div>
6935 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6936 <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) ?>">
6937 </div>
6938 </div> <!-- box shadow color -->
6939 <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">
6940 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6941 <label for="ays-chart-option-border-width-with-title">
6942 <?php echo esc_html(__( "Border Width (including title)", "chart-builder" )); ?>
6943 <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") ); ?>">
6944 <i class="ays_fa ays_fa_info_circle"></i>
6945 </a>
6946 </label>
6947 </div>
6948 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6949 <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) ?>">
6950 </div>
6951 </div> <!-- Border Width with title -->
6952 <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">
6953 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6954 <label for="ays-chart-option-border-radius-with-title">
6955 <?php echo esc_html(__( "Border radius (including title)", "chart-builder" )); ?>
6956 <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") ); ?>">
6957 <i class="ays_fa ays_fa_info_circle"></i>
6958 </a>
6959 </label>
6960 </div>
6961 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6962 <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) ?>">
6963 </div>
6964 </div> <!-- Border radius with title -->
6965 <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">
6966 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6967 <label for="ays-chart-option-border-color-with-title">
6968 <?php echo esc_html(__( "Border Color (including title)", "chart-builder" )); ?>
6969 <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") ); ?>">
6970 <i class="ays_fa ays_fa_info_circle"></i>
6971 </a>
6972 </label>
6973 </div>
6974 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6975 <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) ?>">
6976 </div>
6977 </div> <!-- Border color with title -->
6978 <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">
6979 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6980 <label for="ays-chart-option-border-style-with-title">
6981 <?php echo esc_html(__( "Border Style (including title)", "chart-builder" )); ?>
6982 <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") ); ?>">
6983 <i class="ays_fa ays_fa_info_circle"></i>
6984 </a>
6985 </label>
6986 </div>
6987 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6988 <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]">
6989 <?php
6990 foreach ( $border_styles as $option_slug => $option ):
6991 $selected = ( $border_style_with_title == $option_slug ) ? 'selected' : '';
6992 ?>
6993 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
6994 <?php
6995 endforeach;
6996 ?>
6997 </select>
6998 </div>
6999 </div> <!-- Border style with title -->
7000 <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">
7001 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7002 <label for="ays-chart-option-padding-outer">
7003 <?php echo esc_html(__( "Padding", "chart-builder" )); ?>
7004 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The padding of the chart container.","chart-builder") ); ?>">
7005 <i class="ays_fa ays_fa_info_circle"></i>
7006 </a>
7007 </label>
7008 </div>
7009 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7010 <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) ?>">
7011 </div>
7012 </div> <!-- Padding outer -->
7013 </div>
7014 </div>
7015 <?php
7016 $content = ob_get_clean();
7017
7018 $title = __( 'Chart', "chart-builder" );
7019
7020 $sources['chart'] = array(
7021 'content' => $content,
7022 'title' => $title
7023 );
7024
7025 return $sources;
7026 }
7027
7028 public function settings_contents_chart_styles_settings_chartjs( $sources, $args ){
7029 $html_class_prefix = $args['html_class_prefix'];
7030 $html_name_prefix = $args['html_name_prefix'];
7031 $settings = $args['settings'];
7032 $border_width_with_title = $settings['border_width_with_title'];
7033 $border_radius_with_title = $settings['border_radius_with_title'];
7034 $border_color_with_title = $settings['border_color_with_title'];
7035 $border_style_with_title = $settings['border_style_with_title'];
7036 $width = $settings['width'];
7037 $width_format = $settings['width_format'];
7038 $height = $settings['height'];
7039 $height_format = $settings['height_format'];
7040 $width_format_options = $settings['width_format_options'];
7041 $border_width = $settings['border_width'];
7042 $border_radius = $settings['border_radius'];
7043 $border_color = $settings['border_color'];
7044 $background_color_chart = $settings['background_color_chart'];
7045 $border_style = $settings['border_style'];
7046 $border_styles = $settings['border_styles'];
7047 $box_shadow = $settings['box_shadow'];
7048 $box_shadow_color = $settings['box_shadow_color'];
7049 $padding_outer = $settings['padding_outer'];
7050 ob_start();
7051 ?>
7052 <div class="ays-accordion-data-main-wrap">
7053 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
7054 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7055 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7056 <label for="ays-chart-option-width" class="form-label">
7057 <?php echo esc_html(__( "Width", "chart-builder" )); ?>
7058 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The width of the chart container, in percents.","chart-builder") ); ?>">
7059 <i class="ays_fa ays_fa_info_circle"></i>
7060 </a>
7061 </label>
7062 </div>
7063 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7064 <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) ?>">
7065 <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]">
7066 <?php
7067 foreach ( $width_format_options as $option_slug => $option ):
7068 $selected = ( $width_format == $option_slug ) ? 'selected' : '';
7069 ?>
7070 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7071 <?php
7072 endforeach;
7073 ?>
7074 </select>
7075 </div>
7076 </div> <!-- Width -->
7077 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7078 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7079 <label for="ays-chart-option-height" class="form-label">
7080 <?php echo esc_html(__( "Height", "chart-builder" )); ?>
7081 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The height of the chart container, in pixels.","chart-builder") ); ?>">
7082 <i class="ays_fa ays_fa_info_circle"></i>
7083 </a>
7084 </label>
7085 </div>
7086 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7087 <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) ?>">
7088 <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]">
7089 <?php
7090 foreach ( $width_format_options as $option_slug => $option ):
7091 $selected = ( $height_format == $option_slug ) ? 'selected' : '';
7092 ?>
7093 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7094 <?php
7095 endforeach;
7096 ?>
7097 </select>
7098 </div>
7099 </div> <!-- Height -->
7100 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7101 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7102 <label for="ays-chart-option-border-width">
7103 <?php echo esc_html(__( "Border Width", "chart-builder" )); ?>
7104 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The width of the chart container border.","chart-builder") ); ?>">
7105 <i class="ays_fa ays_fa_info_circle"></i>
7106 </a>
7107 </label>
7108 </div>
7109 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7110 <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) ?>">
7111 </div>
7112 </div> <!-- Border Width -->
7113 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7114 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7115 <label for="ays-chart-option-border-radius">
7116 <?php echo esc_html(__( "Border Radius", "chart-builder" )); ?>
7117 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The radius of the chart container border.","chart-builder") ); ?>">
7118 <i class="ays_fa ays_fa_info_circle"></i>
7119 </a>
7120 </label>
7121 </div>
7122 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7123 <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) ?>">
7124 </div>
7125 </div> <!-- Border Radius -->
7126 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7127 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7128 <label for="ays-chart-option-border-color">
7129 <?php echo esc_html(__( "Border Color", "chart-builder" )); ?>
7130 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The border color of the chart container.","chart-builder") ); ?>">
7131 <i class="ays_fa ays_fa_info_circle"></i>
7132 </a>
7133 </label>
7134 </div>
7135 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7136 <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) ?>">
7137 </div>
7138 </div> <!-- Border color -->
7139 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7140 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7141 <label for="ays-chart-option-border-style">
7142 <?php echo esc_html(__( "Border Style", "chart-builder" )); ?>
7143 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The style of the chart container border.","chart-builder") ); ?>">
7144 <i class="ays_fa ays_fa_info_circle"></i>
7145 </a>
7146 </label>
7147 </div>
7148 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7149 <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]">
7150 <?php
7151 foreach ( $border_styles as $option_slug => $option ):
7152 $selected = ( $border_style == $option_slug ) ? 'selected' : '';
7153 ?>
7154 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7155 <?php
7156 endforeach;
7157 ?>
7158 </select>
7159 </div>
7160 </div> <!-- Border style -->
7161 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7162 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7163 <label for="ays-chart-option-backgorund-color">
7164 <?php echo esc_html(__( "Background Color", "chart-builder" )); ?>
7165 <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") ); ?>">
7166 <i class="ays_fa ays_fa_info_circle"></i>
7167 </a>
7168 </label>
7169 </div>
7170 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7171 <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) ?>">
7172 </div>
7173 </div><!-- Background color -->
7174
7175 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7176 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7177 <label for="ays-chart-option-box-shadow" class="form-label">
7178 <?php echo esc_html(__( "Box Shadow", "chart-builder" )); ?>
7179 <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") ); ?>">
7180 <i class="ays_fa ays_fa_info_circle"></i>
7181 </a>
7182 </label>
7183 </div>
7184 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7185 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
7186 <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); ?> >
7187 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
7188 </label>
7189 </div>
7190 </div> <!-- box shadow -->
7191 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7192 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7193 <label for="ays-chart-option-box-shadow-color" class="form-label">
7194 <?php echo esc_html(__( "Box Shadow Color", "chart-builder" )); ?>
7195 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Choose chart container's box shadow color.","chart-builder") ); ?>">
7196 <i class="ays_fa ays_fa_info_circle"></i>
7197 </a>
7198 </label>
7199 </div>
7200 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7201 <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) ?>">
7202 </div>
7203 </div> <!-- box shadow color -->
7204 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7205 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7206 <label for="ays-chart-option-border-width-with-title">
7207 <?php echo esc_html(__( "Border Width (including title)", "chart-builder" )); ?>
7208 <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") ); ?>">
7209 <i class="ays_fa ays_fa_info_circle"></i>
7210 </a>
7211 </label>
7212 </div>
7213 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7214 <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) ?>">
7215 </div>
7216 </div> <!-- Border Width with title -->
7217 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7218 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7219 <label for="ays-chart-option-border-radius-with-title">
7220 <?php echo esc_html(__( "Border Radius (including title)", "chart-builder" )); ?>
7221 <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") ); ?>">
7222 <i class="ays_fa ays_fa_info_circle"></i>
7223 </a>
7224 </label>
7225 </div>
7226 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7227 <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) ?>">
7228 </div>
7229 </div> <!-- Border radius with title -->
7230 <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">
7231 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7232 <label for="ays-chart-option-border-color-with-title">
7233 <?php echo esc_html(__( "Border Color (including title)", "chart-builder" )); ?>
7234 <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") ); ?>">
7235 <i class="ays_fa ays_fa_info_circle"></i>
7236 </a>
7237 </label>
7238 </div>
7239 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7240 <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) ?>">
7241 </div>
7242 </div> <!-- Border colro with title -->
7243 <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">
7244 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7245 <label for="ays-chart-option-border-style-with-title">
7246 <?php echo esc_html(__( "Border Style (including title)", "chart-builder" )); ?>
7247 <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") ); ?>">
7248 <i class="ays_fa ays_fa_info_circle"></i>
7249 </a>
7250 </label>
7251 </div>
7252 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7253 <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]">
7254 <?php
7255 foreach ( $border_styles as $option_slug => $option ):
7256 $selected = ( $border_style_with_title == $option_slug ) ? 'selected' : '';
7257 ?>
7258 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7259 <?php
7260 endforeach;
7261 ?>
7262 </select>
7263 </div>
7264 </div> <!-- Border style with title -->
7265 <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">
7266 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7267 <label for="ays-chart-option-padding-outer">
7268 <?php echo esc_html(__( "Padding", "chart-builder" )); ?>
7269 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The padding of the chart container.","chart-builder") ); ?>">
7270 <i class="ays_fa ays_fa_info_circle"></i>
7271 </a>
7272 </label>
7273 </div>
7274 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7275 <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) ?>">
7276 </div>
7277 </div> <!-- Padding outer -->
7278 </div>
7279 </div>
7280 <?php
7281 $content = ob_get_clean();
7282
7283 $title = __( 'Chart', "chart-builder" );
7284
7285 $sources['chart'] = array(
7286 'content' => $content,
7287 'title' => $title
7288 );
7289
7290 return $sources;
7291 }
7292
7293 public function settings_contents_chart_area_styles_settings( $sources, $args ){
7294 $html_class_prefix = $args['html_class_prefix'];
7295 $html_name_prefix = $args['html_name_prefix'];
7296 $settings = $args['settings'];
7297
7298 $chart_background_color = $settings['chart_background_color'];
7299 $chart_border_color = $settings['chart_border_color'];
7300 $chart_left_margin = $settings['chart_left_margin'];
7301 $chart_right_margin = $settings['chart_right_margin'];
7302 $chart_top_margin = $settings['chart_top_margin'];
7303 $chart_bottom_margin = $settings['chart_bottom_margin'];
7304 $chart_border_width = $settings['chart_border_width'];
7305 ob_start();
7306 ?>
7307 <div class="ays-accordion-data-main-wrap">
7308 <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">
7309 <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">
7310 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7311 <label for="ays-chart-option-chart-background-color">
7312 <?php echo esc_html(__( "Background Color", "chart-builder" )); ?>
7313 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The background color of the chart area.","chart-builder") ); ?>">
7314 <i class="ays_fa ays_fa_info_circle"></i>
7315 </a>
7316 </label>
7317 </div>
7318 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7319 <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) ?>">
7320 </div>
7321 </div> <!-- Chart Area background color -->
7322 <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">
7323 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7324 <label for="ays-chart-option-chart-border-width">
7325 <?php echo esc_html(__( "Border Width", "chart-builder" )); ?>
7326 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The border width of the chart area.","chart-builder") ); ?>">
7327 <i class="ays_fa ays_fa_info_circle"></i>
7328 </a>
7329 </label>
7330 </div>
7331 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7332 <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) ?>">
7333 </div>
7334 </div> <!-- Chart Area Border Width -->
7335 <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">
7336 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7337 <label for="ays-chart-option-chart-border-color">
7338 <?php echo esc_html(__( "Border Color", "chart-builder" )); ?>
7339 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The border color of the chart area.","chart-builder") ); ?>">
7340 <i class="ays_fa ays_fa_info_circle"></i>
7341 </a>
7342 </label>
7343 </div>
7344 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7345 <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) ?>">
7346 </div>
7347 </div> <!-- Chart Area border color -->
7348 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7349 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7350 <label for="ays-chart-option-chart-left-margin">
7351 <?php echo esc_html(__( "Left Margin", "chart-builder" )); ?>
7352 <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") ); ?>">
7353 <i class="ays_fa ays_fa_info_circle"></i>
7354 </a>
7355 </label>
7356 </div>
7357 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7358 <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) ?>">
7359 </div>
7360 </div> <!-- Chart Area Left Margin -->
7361 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7362 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7363 <label for="ays-chart-option-chart-right-margin">
7364 <?php echo esc_html(__( "Right Margin", "chart-builder" )); ?>
7365 <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") ); ?>">
7366 <i class="ays_fa ays_fa_info_circle"></i>
7367 </a>
7368 </label>
7369 </div>
7370 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7371 <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) ?>">
7372 </div>
7373 </div> <!-- Chart Area Right Margin -->
7374 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7375 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7376 <label for="ays-chart-option-chart-top-margin">
7377 <?php echo esc_html(__( "Top Margin", "chart-builder" )); ?>
7378 <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") ); ?>">
7379 <i class="ays_fa ays_fa_info_circle"></i>
7380 </a>
7381 </label>
7382 </div>
7383 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7384 <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) ?>">
7385 </div>
7386 </div> <!-- Chart Area Top Margin -->
7387 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7388 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7389 <label for="ays-chart-option-chart-bottom-margin">
7390 <?php echo esc_html(__( "Bottom Margin", "chart-builder" )); ?>
7391 <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") ); ?>">
7392 <i class="ays_fa ays_fa_info_circle"></i>
7393 </a>
7394 </label>
7395 </div>
7396 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7397 <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) ?>">
7398 </div>
7399 </div> <!-- Chart Area Bottom Margin -->
7400 </div>
7401 </div>
7402 <?php
7403 $content = ob_get_clean();
7404
7405 $title = __( 'Chart Area', "chart-builder" );
7406
7407 $sources['chart_area'] = array(
7408 'content' => $content,
7409 'title' => $title
7410 );
7411
7412 return $sources;
7413 }
7414
7415 public function settings_contents_title_styles_settings( $sources, $args ){
7416 $html_class_prefix = $args['html_class_prefix'];
7417 $html_name_prefix = $args['html_name_prefix'];
7418 $settings = $args['settings'];
7419
7420 $title_color = $settings['title_color'];
7421 $title_shadow_color = $settings['title_shadow_color'];
7422 $title_font_size = $settings['title_font_size'];
7423 $title_gap = $settings['title_gap'];
7424 $title_gap_description = $settings['title_gap_description'];
7425 $title_positions = $settings['title_positions'];
7426 $title_position = $settings['title_position'];
7427 $title_bold = $settings['title_bold'];
7428 $title_text_shadow = $settings['title_text_shadow'];
7429 $title_italic = $settings['title_italic'];
7430 $text_transforms = $settings['text_transforms'];
7431 $text_decorations = $settings['text_decorations'];
7432 $title_text_transform = $settings['title_text_transform'];
7433 $title_text_decoration = $settings['title_text_decoration'];
7434 $title_letter_spacing = $settings['title_letter_spacing'];
7435 ob_start();
7436 ?>
7437 <div class="ays-accordion-data-main-wrap">
7438 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
7439 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7440 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7441 <label for="ays-chart-option-title-color">
7442 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
7443 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the chart title.","chart-builder") ); ?>">
7444 <i class="ays_fa ays_fa_info_circle"></i>
7445 </a>
7446 </label>
7447 </div>
7448 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7449 <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) ?>">
7450 </div>
7451 </div> <!-- Chart title color -->
7452 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7453 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7454 <label for="ays-chart-option-title-font-size" class="form-label">
7455 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
7456 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The font size of the chart title.","chart-builder") ); ?>">
7457 <i class="ays_fa ays_fa_info_circle"></i>
7458 </a>
7459 </label>
7460 </div>
7461 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7462 <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) ?>">
7463 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
7464 </div>
7465 </div> <!-- Chart title font size -->
7466 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7467 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7468 <label for="ays-chart-option-title-bold" class="form-label">
7469 <?php echo esc_html(__( "Bold text", "chart-builder" )); ?>
7470 <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") ); ?>">
7471 <i class="ays_fa ays_fa_info_circle"></i>
7472 </a>
7473 </label>
7474 </div>
7475 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7476 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
7477 <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); ?> >
7478 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
7479 </label>
7480 </div>
7481 </div> <!-- Title bold -->
7482 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7483 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7484 <label for="ays-chart-option-title-italic" class="form-label">
7485 <?php echo esc_html(__( "Italic text", "chart-builder" )); ?>
7486 <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") ); ?>">
7487 <i class="ays_fa ays_fa_info_circle"></i>
7488 </a>
7489 </label>
7490 </div>
7491 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7492 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
7493 <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); ?> >
7494 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
7495 </label>
7496 </div>
7497 </div> <!-- Title italic -->
7498 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7499 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7500 <label for="ays-chart-option-title-position">
7501 <?php echo esc_html(__( "Position", "chart-builder" )); ?>
7502 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The position of the chart title.","chart-builder") ); ?>">
7503 <i class="ays_fa ays_fa_info_circle"></i>
7504 </a>
7505 </label>
7506 </div>
7507 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7508 <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]">
7509 <?php
7510 foreach ( $title_positions as $option_slug => $option ):
7511 $selected = ( $title_position == $option_slug ) ? 'selected' : '';
7512 ?>
7513 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7514 <?php
7515 endforeach;
7516 ?>
7517 </select>
7518 </div>
7519 </div> <!-- Title position -->
7520 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7521 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7522 <label for="ays-chart-option-title-gap" class="form-label">
7523 <?php echo esc_html(__( "Gap", "chart-builder" )); ?>
7524 <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") ); ?>">
7525 <i class="ays_fa ays_fa_info_circle"></i>
7526 </a>
7527 </label>
7528 </div>
7529 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7530 <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) ?>">
7531 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
7532 </div>
7533 </div> <!-- Chart title gap -->
7534 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7535 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7536 <label for="ays-chart-option-title-gap-description" class="form-label">
7537 <?php echo esc_html(__( "Distance from description", "chart-builder" )); ?>
7538 <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") ); ?>">
7539 <i class="ays_fa ays_fa_info_circle"></i>
7540 </a>
7541 </label>
7542 </div>
7543 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7544 <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) ?>">
7545 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
7546 </div>
7547 </div> <!-- Chart title gap -->
7548 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7549 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7550 <label for="ays-chart-option-title-text-transform">
7551 <?php echo esc_html(__( "Text-transform", "chart-builder" )); ?>
7552 <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") ); ?>">
7553 <i class="ays_fa ays_fa_info_circle"></i>
7554 </a>
7555 </label>
7556 </div>
7557 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7558 <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]">
7559 <?php
7560 foreach ( $text_transforms as $option_slug => $option ):
7561 $selected = ( $title_text_transform == $option_slug ) ? 'selected' : '';
7562 ?>
7563 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7564 <?php
7565 endforeach;
7566 ?>
7567 </select>
7568 </div>
7569 </div> <!-- Title text transform -->
7570 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7571 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7572 <label for="ays-chart-option-title-letter-spacing" class="form-label">
7573 <?php echo esc_html(__( "Letter spacing", "chart-builder" )); ?>
7574 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Specify the space between the chart title letters.","chart-builder") ); ?>">
7575 <i class="ays_fa ays_fa_info_circle"></i>
7576 </a>
7577 </label>
7578 </div>
7579 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7580 <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) ?>">
7581 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
7582 </div>
7583 </div> <!-- Chart title letter spacing -->
7584 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7585 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7586 <label for="ays-chart-option-title-text-decoration">
7587 <?php echo esc_html(__( "Text-decoration", "chart-builder" )); ?>
7588 <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") ); ?>">
7589 <i class="ays_fa ays_fa_info_circle"></i>
7590 </a>
7591 </label>
7592 </div>
7593 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7594 <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]">
7595 <?php
7596 foreach ( $text_decorations as $option_slug => $option ):
7597 $selected = ( $title_text_decoration == $option_slug ) ? 'selected' : '';
7598 ?>
7599 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7600 <?php
7601 endforeach;
7602 ?>
7603 </select>
7604 </div>
7605 </div> <!-- Title text decoration -->
7606 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7607 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7608 <label for="ays-chart-option-title-text-shadow" class="form-label">
7609 <?php echo esc_html(__( "Text shadow", "chart-builder" )); ?>
7610 <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") ); ?>">
7611 <i class="ays_fa ays_fa_info_circle"></i>
7612 </a>
7613 </label>
7614 </div>
7615 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7616 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
7617 <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); ?> >
7618 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
7619 </label>
7620 </div>
7621 </div> <!-- Title bold -->
7622 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7623 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7624 <label for="ays-chart-option-title-shadow-color">
7625 <?php echo esc_html(__( "Text Shadow Color", "chart-builder" )); ?>
7626 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The text shadow color of the chart title.","chart-builder") ); ?>">
7627 <i class="ays_fa ays_fa_info_circle"></i>
7628 </a>
7629 </label>
7630 </div>
7631 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7632 <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) ?>">
7633 </div>
7634 </div> <!-- Chart title color -->
7635 </div>
7636 </div>
7637 <?php
7638 $content = ob_get_clean();
7639
7640 $title = __( 'Title', "chart-builder" );
7641
7642 $sources['title'] = array(
7643 'content' => $content,
7644 'title' => $title
7645 );
7646
7647 return $sources;
7648 }
7649
7650 public function settings_contents_title_styles_settings_chartjs( $sources, $args ){
7651 $html_class_prefix = $args['html_class_prefix'];
7652 $html_name_prefix = $args['html_name_prefix'];
7653 $settings = $args['settings'];
7654
7655 $title_color = $settings['title_color'];
7656 $title_shadow_color = $settings['title_shadow_color'];
7657 $title_font_size = $settings['title_font_size'];
7658 $title_gap = $settings['title_gap'];
7659 $title_gap_description = $settings['title_gap_description'];
7660 $title_positions = $settings['title_positions'];
7661 $title_position = $settings['title_position'];
7662 $title_bold = $settings['title_bold'];
7663 $title_text_shadow = $settings['title_text_shadow'];
7664 $title_italic = $settings['title_italic'];
7665 $text_transforms = $settings['text_transforms'];
7666 $text_decorations = $settings['text_decorations'];
7667 $title_text_transform = $settings['title_text_transform'];
7668 $title_text_decoration = $settings['title_text_decoration'];
7669 $title_letter_spacing = $settings['title_letter_spacing'];
7670 ob_start();
7671 ?>
7672 <div class="ays-accordion-data-main-wrap">
7673 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
7674 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7675 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7676 <label for="ays-chart-option-title-color">
7677 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
7678 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the chart title.","chart-builder") ); ?>">
7679 <i class="ays_fa ays_fa_info_circle"></i>
7680 </a>
7681 </label>
7682 </div>
7683 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7684 <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) ?>">
7685 </div>
7686 </div> <!-- Chart title color -->
7687 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7688 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7689 <label for="ays-chart-option-title-font-size" class="form-label">
7690 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
7691 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The font size of the chart title.","chart-builder") ); ?>">
7692 <i class="ays_fa ays_fa_info_circle"></i>
7693 </a>
7694 </label>
7695 </div>
7696 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7697 <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) ?>">
7698 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
7699 </div>
7700 </div> <!-- Chart title font size -->
7701 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7702 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7703 <label for="ays-chart-option-title-bold" class="form-label">
7704 <?php echo esc_html(__( "Bold text", "chart-builder" )); ?>
7705 <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") ); ?>">
7706 <i class="ays_fa ays_fa_info_circle"></i>
7707 </a>
7708 </label>
7709 </div>
7710 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7711 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
7712 <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); ?> >
7713 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
7714 </label>
7715 </div>
7716 </div> <!-- Title bold -->
7717 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7718 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7719 <label for="ays-chart-option-title-italic" class="form-label">
7720 <?php echo esc_html(__( "Italic text", "chart-builder" )); ?>
7721 <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") ); ?>">
7722 <i class="ays_fa ays_fa_info_circle"></i>
7723 </a>
7724 </label>
7725 </div>
7726 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7727 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
7728 <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); ?> >
7729 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
7730 </label>
7731 </div>
7732 </div> <!-- Title italic -->
7733 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7734 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7735 <label for="ays-chart-option-title-position">
7736 <?php echo esc_html(__( "Position", "chart-builder" )); ?>
7737 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The position of the chart title.","chart-builder") ); ?>">
7738 <i class="ays_fa ays_fa_info_circle"></i>
7739 </a>
7740 </label>
7741 </div>
7742 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7743 <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]">
7744 <?php
7745 foreach ( $title_positions as $option_slug => $option ):
7746 $selected = ( $title_position == $option_slug ) ? 'selected' : '';
7747 ?>
7748 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7749 <?php
7750 endforeach;
7751 ?>
7752 </select>
7753 </div>
7754 </div> <!-- Title position -->
7755 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7756 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7757 <label for="ays-chart-option-title-gap" class="form-label">
7758 <?php echo esc_html(__( "Gap", "chart-builder" )); ?>
7759 <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") ); ?>">
7760 <i class="ays_fa ays_fa_info_circle"></i>
7761 </a>
7762 </label>
7763 </div>
7764 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7765 <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) ?>">
7766 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
7767 </div>
7768 </div> <!-- Chart title gap -->
7769 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7770 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7771 <label for="ays-chart-option-title-gap-description" class="form-label">
7772 <?php echo esc_html(__( "Distance from description", "chart-builder" )); ?>
7773 <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") ); ?>">
7774 <i class="ays_fa ays_fa_info_circle"></i>
7775 </a>
7776 </label>
7777 </div>
7778 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7779 <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) ?>">
7780 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
7781 </div>
7782 </div> <!-- Chart title gap -->
7783 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7784 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7785 <label for="ays-chart-option-title-text-transform">
7786 <?php echo esc_html(__( "Text-transform", "chart-builder" )); ?>
7787 <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") ); ?>">
7788 <i class="ays_fa ays_fa_info_circle"></i>
7789 </a>
7790 </label>
7791 </div>
7792 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7793 <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]">
7794 <?php
7795 foreach ( $text_transforms as $option_slug => $option ):
7796 $selected = ( $title_text_transform == $option_slug ) ? 'selected' : '';
7797 ?>
7798 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7799 <?php
7800 endforeach;
7801 ?>
7802 </select>
7803 </div>
7804 </div> <!-- Title text transform -->
7805 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7806 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7807 <label for="ays-chart-option-title-letter-spacing" class="form-label">
7808 <?php echo esc_html(__( "Letter spacing", "chart-builder" )); ?>
7809 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Specify the space between the chart title letters.","chart-builder") ); ?>">
7810 <i class="ays_fa ays_fa_info_circle"></i>
7811 </a>
7812 </label>
7813 </div>
7814 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7815 <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) ?>">
7816 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
7817 </div>
7818 </div> <!-- Chart title letter spacing -->
7819 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7820 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7821 <label for="ays-chart-option-title-text-decoration">
7822 <?php echo esc_html(__( "Text-decoration", "chart-builder" )); ?>
7823 <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") ); ?>">
7824 <i class="ays_fa ays_fa_info_circle"></i>
7825 </a>
7826 </label>
7827 </div>
7828 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7829 <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]">
7830 <?php
7831 foreach ( $text_decorations as $option_slug => $option ):
7832 $selected = ( $title_text_decoration == $option_slug ) ? 'selected' : '';
7833 ?>
7834 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7835 <?php
7836 endforeach;
7837 ?>
7838 </select>
7839 </div>
7840 </div> <!-- Title text decoration -->
7841 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7842 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7843 <label for="ays-chart-option-title-text-shadow" class="form-label">
7844 <?php echo esc_html(__( "Text shadow", "chart-builder" )); ?>
7845 <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") ); ?>">
7846 <i class="ays_fa ays_fa_info_circle"></i>
7847 </a>
7848 </label>
7849 </div>
7850 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7851 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
7852 <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); ?> >
7853 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
7854 </label>
7855 </div>
7856 </div> <!-- Title bold -->
7857 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7858 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7859 <label for="ays-chart-option-title-shadow-color">
7860 <?php echo esc_html(__( "Text Shadow Color", "chart-builder" )); ?>
7861 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The text shadow color of the chart title.","chart-builder") ); ?>">
7862 <i class="ays_fa ays_fa_info_circle"></i>
7863 </a>
7864 </label>
7865 </div>
7866 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7867 <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) ?>">
7868 </div>
7869 </div> <!-- Chart title color -->
7870 </div>
7871 </div>
7872 <?php
7873 $content = ob_get_clean();
7874
7875 $title = __( 'Title', "chart-builder" );
7876
7877 $sources['title'] = array(
7878 'content' => $content,
7879 'title' => $title
7880 );
7881
7882 return $sources;
7883 }
7884
7885 public function settings_contents_description_styles_settings( $sources, $args ){
7886 $html_class_prefix = $args['html_class_prefix'];
7887 $html_name_prefix = $args['html_name_prefix'];
7888 $settings = $args['settings'];
7889
7890 $description_color = $settings['description_color'];
7891 $description_font_size = $settings['description_font_size'];
7892 $title_positions = $settings['title_positions'];
7893 $description_position = $settings['description_position'];
7894 $description_bold = $settings['description_bold'];
7895 $description_text_shadow = $settings['description_text_shadow'];
7896 $description_shadow_color = $settings['description_shadow_color'];
7897 $description_italic = $settings['description_italic'];
7898 $text_transforms = $settings['text_transforms'];
7899 $text_decorations = $settings['text_decorations'];
7900 $description_text_transform = $settings['description_text_transform'];
7901 $description_text_decoration = $settings['description_text_decoration'];
7902 $description_letter_spacing = $settings['description_letter_spacing'];
7903
7904 ob_start();
7905 ?>
7906 <div class="ays-accordion-data-main-wrap">
7907 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
7908 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7909 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7910 <label for="ays-chart-option-description-color">
7911 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
7912 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the chart description.","chart-builder") ); ?>">
7913 <i class="ays_fa ays_fa_info_circle"></i>
7914 </a>
7915 </label>
7916 </div>
7917 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7918 <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) ?>">
7919 </div>
7920 </div> <!-- Chart description color -->
7921 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7922 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7923 <label for="ays-chart-option-description-font-size" class="form-label">
7924 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
7925 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The font size of the chart description.","chart-builder") ); ?>">
7926 <i class="ays_fa ays_fa_info_circle"></i>
7927 </a>
7928 </label>
7929 </div>
7930 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7931 <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) ?>">
7932 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
7933 </div>
7934 </div> <!-- Chart description font size -->
7935 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7936 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7937 <label for="ays-chart-option-description-bold" class="form-label">
7938 <?php echo esc_html(__( "Bold text", "chart-builder" )); ?>
7939 <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") ); ?>">
7940 <i class="ays_fa ays_fa_info_circle"></i>
7941 </a>
7942 </label>
7943 </div>
7944 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7945 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
7946 <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); ?> >
7947 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
7948 </label>
7949 </div>
7950 </div> <!-- Description bold -->
7951 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7952 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7953 <label for="ays-chart-option-description-italic" class="form-label">
7954 <?php echo esc_html(__( "Italic text", "chart-builder" )); ?>
7955 <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") ); ?>">
7956 <i class="ays_fa ays_fa_info_circle"></i>
7957 </a>
7958 </label>
7959 </div>
7960 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7961 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
7962 <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); ?> >
7963 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
7964 </label>
7965 </div>
7966 </div> <!-- Description italic -->
7967 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7968 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7969 <label for="ays-chart-option-description-position">
7970 <?php echo esc_html(__( "Position", "chart-builder" )); ?>
7971 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The position of the chart description.","chart-builder") ); ?>">
7972 <i class="ays_fa ays_fa_info_circle"></i>
7973 </a>
7974 </label>
7975 </div>
7976 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7977 <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]">
7978 <?php
7979 foreach ( $title_positions as $option_slug => $option ):
7980 $selected = ( $description_position == $option_slug ) ? 'selected' : '';
7981 ?>
7982 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7983 <?php
7984 endforeach;
7985 ?>
7986 </select>
7987 </div>
7988 </div> <!-- Description position -->
7989 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7990 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7991 <label for="ays-chart-option-description-text-transform">
7992 <?php echo esc_html(__( "Text-transform", "chart-builder" )); ?>
7993 <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") ); ?>">
7994 <i class="ays_fa ays_fa_info_circle"></i>
7995 </a>
7996 </label>
7997 </div>
7998 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7999 <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]">
8000 <?php
8001 foreach ( $text_transforms as $option_slug => $option ):
8002 $selected = ( $description_text_transform == $option_slug ) ? 'selected' : '';
8003 ?>
8004 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8005 <?php
8006 endforeach;
8007 ?>
8008 </select>
8009 </div>
8010 </div> <!-- description text transform -->
8011 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8012 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8013 <label for="ays-chart-option-description-letter-spacing" class="form-label">
8014 <?php echo esc_html(__( "Letter spacing", "chart-builder" )); ?>
8015 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Specify the space between the chart description letters.","chart-builder") ); ?>">
8016 <i class="ays_fa ays_fa_info_circle"></i>
8017 </a>
8018 </label>
8019 </div>
8020 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8021 <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) ?>">
8022 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
8023 </div>
8024 </div> <!-- Chart description letter spacing -->
8025 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8026 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8027 <label for="ays-chart-option-description-text-decoration">
8028 <?php echo esc_html(__( "Text-decoration", "chart-builder" )); ?>
8029 <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") ); ?>">
8030 <i class="ays_fa ays_fa_info_circle"></i>
8031 </a>
8032 </label>
8033 </div>
8034 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8035 <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]">
8036 <?php
8037 foreach ( $text_decorations as $option_slug => $option ):
8038 $selected = ( $description_text_decoration == $option_slug ) ? 'selected' : '';
8039 ?>
8040 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8041 <?php
8042 endforeach;
8043 ?>
8044 </select>
8045 </div>
8046 </div> <!-- description text decoration -->
8047 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8048 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8049 <label for="ays-chart-option-description-text-shadow" class="form-label">
8050 <?php echo esc_html(__( "Text shadow", "chart-builder" )); ?>
8051 <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") ); ?>">
8052 <i class="ays_fa ays_fa_info_circle"></i>
8053 </a>
8054 </label>
8055 </div>
8056 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8057 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
8058 <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); ?> >
8059 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
8060 </label>
8061 </div>
8062 </div> <!-- description bold -->
8063 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8064 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8065 <label for="ays-chart-option-description-shadow-color">
8066 <?php echo esc_html(__( "Text Shadow Color", "chart-builder" )); ?>
8067 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The text shadow color of the chart description.","chart-builder") ); ?>">
8068 <i class="ays_fa ays_fa_info_circle"></i>
8069 </a>
8070 </label>
8071 </div>
8072 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8073 <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) ?>">
8074 </div>
8075 </div> <!-- Chart title color -->
8076 </div>
8077 </div>
8078 <?php
8079 $content = ob_get_clean();
8080
8081 $title = __( 'Description', "chart-builder" );
8082
8083 $sources['description'] = array(
8084 'content' => $content,
8085 'title' => $title
8086 );
8087
8088 return $sources;
8089 }
8090
8091 public function settings_contents_description_styles_settings_chartjs( $sources, $args ){
8092 $html_class_prefix = $args['html_class_prefix'];
8093 $html_name_prefix = $args['html_name_prefix'];
8094 $settings = $args['settings'];
8095
8096 $description_color = $settings['description_color'];
8097 $description_font_size = $settings['description_font_size'];
8098 $title_positions = $settings['title_positions'];
8099 $description_position = $settings['description_position'];
8100 $description_bold = $settings['description_bold'];
8101 $description_text_shadow = $settings['description_text_shadow'];
8102 $description_shadow_color = $settings['description_shadow_color'];
8103 $description_italic = $settings['description_italic'];
8104 $text_transforms = $settings['text_transforms'];
8105 $text_decorations = $settings['text_decorations'];
8106 $description_text_transform = $settings['description_text_transform'];
8107 $description_text_decoration = $settings['description_text_decoration'];
8108 $description_letter_spacing = $settings['description_letter_spacing'];
8109
8110 ob_start();
8111 ?>
8112 <div class="ays-accordion-data-main-wrap">
8113 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
8114 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8115 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8116 <label for="ays-chart-option-description-color">
8117 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
8118 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the chart description.","chart-builder") ); ?>">
8119 <i class="ays_fa ays_fa_info_circle"></i>
8120 </a>
8121 </label>
8122 </div>
8123 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8124 <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) ?>">
8125 </div>
8126 </div> <!-- Chart description color -->
8127 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8128 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8129 <label for="ays-chart-option-description-font-size" class="form-label">
8130 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
8131 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The font size of the chart description.","chart-builder") ); ?>">
8132 <i class="ays_fa ays_fa_info_circle"></i>
8133 </a>
8134 </label>
8135 </div>
8136 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8137 <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) ?>">
8138 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
8139 </div>
8140 </div> <!-- Chart description font size -->
8141 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8142 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8143 <label for="ays-chart-option-description-bold" class="form-label">
8144 <?php echo esc_html(__( "Bold text", "chart-builder" )); ?>
8145 <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") ); ?>">
8146 <i class="ays_fa ays_fa_info_circle"></i>
8147 </a>
8148 </label>
8149 </div>
8150 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8151 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
8152 <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); ?> >
8153 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
8154 </label>
8155 </div>
8156 </div> <!-- Description bold -->
8157 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8158 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8159 <label for="ays-chart-option-description-italic" class="form-label">
8160 <?php echo esc_html(__( "Italic text", "chart-builder" )); ?>
8161 <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") ); ?>">
8162 <i class="ays_fa ays_fa_info_circle"></i>
8163 </a>
8164 </label>
8165 </div>
8166 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8167 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
8168 <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); ?> >
8169 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
8170 </label>
8171 </div>
8172 </div> <!-- Description italic -->
8173 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8174 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8175 <label for="ays-chart-option-description-position">
8176 <?php echo esc_html(__( "Position", "chart-builder" )); ?>
8177 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The position of the chart description.","chart-builder") ); ?>">
8178 <i class="ays_fa ays_fa_info_circle"></i>
8179 </a>
8180 </label>
8181 </div>
8182 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8183 <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]">
8184 <?php
8185 foreach ( $title_positions as $option_slug => $option ):
8186 $selected = ( $description_position == $option_slug ) ? 'selected' : '';
8187 ?>
8188 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8189 <?php
8190 endforeach;
8191 ?>
8192 </select>
8193 </div>
8194 </div> <!-- Description position -->
8195 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8196 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8197 <label for="ays-chart-option-description-text-transform">
8198 <?php echo esc_html(__( "Text-transform", "chart-builder" )); ?>
8199 <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") ); ?>">
8200 <i class="ays_fa ays_fa_info_circle"></i>
8201 </a>
8202 </label>
8203 </div>
8204 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8205 <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]">
8206 <?php
8207 foreach ( $text_transforms as $option_slug => $option ):
8208 $selected = ( $description_text_transform == $option_slug ) ? 'selected' : '';
8209 ?>
8210 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8211 <?php
8212 endforeach;
8213 ?>
8214 </select>
8215 </div>
8216 </div> <!-- description text transform -->
8217 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8218 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8219 <label for="ays-chart-option-description-letter-spacing" class="form-label">
8220 <?php echo esc_html(__( "Letter spacing", "chart-builder" )); ?>
8221 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Specify the space between the chart description letters.","chart-builder") ); ?>">
8222 <i class="ays_fa ays_fa_info_circle"></i>
8223 </a>
8224 </label>
8225 </div>
8226 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8227 <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) ?>">
8228 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
8229 </div>
8230 </div> <!-- Chart description letter spacing -->
8231 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8232 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8233 <label for="ays-chart-option-description-text-decoration">
8234 <?php echo esc_html(__( "Text-decoration", "chart-builder" )); ?>
8235 <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") ); ?>">
8236 <i class="ays_fa ays_fa_info_circle"></i>
8237 </a>
8238 </label>
8239 </div>
8240 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8241 <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]">
8242 <?php
8243 foreach ( $text_decorations as $option_slug => $option ):
8244 $selected = ( $description_text_decoration == $option_slug ) ? 'selected' : '';
8245 ?>
8246 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8247 <?php
8248 endforeach;
8249 ?>
8250 </select>
8251 </div>
8252 </div> <!-- description text decoration -->
8253 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8254 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8255 <label for="ays-chart-option-description-text-shadow" class="form-label">
8256 <?php echo esc_html(__( "Text shadow", "chart-builder" )); ?>
8257 <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") ); ?>">
8258 <i class="ays_fa ays_fa_info_circle"></i>
8259 </a>
8260 </label>
8261 </div>
8262 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8263 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
8264 <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); ?> >
8265 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
8266 </label>
8267 </div>
8268 </div> <!-- description bold -->
8269 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8270 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8271 <label for="ays-chart-option-description-shadow-color">
8272 <?php echo esc_html(__( "Text Shadow Color", "chart-builder" )); ?>
8273 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The text shadow color of the chart description.","chart-builder") ); ?>">
8274 <i class="ays_fa ays_fa_info_circle"></i>
8275 </a>
8276 </label>
8277 </div>
8278 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8279 <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) ?>">
8280 </div>
8281 </div> <!-- Chart title color -->
8282 </div>
8283 </div>
8284 <?php
8285 $content = ob_get_clean();
8286
8287 $title = __( 'Description', "chart-builder" );
8288
8289 $sources['description'] = array(
8290 'content' => $content,
8291 'title' => $title
8292 );
8293
8294 return $sources;
8295 }
8296
8297 /**
8298 * Chart page settings contents
8299 * @param $args
8300 */
8301 public function ays_chart_page_advanced_settings_contents( $args ){
8302 $chart_source_type = $args['chart_source_type'];
8303
8304 if ($chart_source_type === 'chart-js') {
8305 if ($args['source_chart_type'] !== 'pie_chart') {return;}
8306 $sources_contents = apply_filters( 'ays_cb_chart_page_advanced_settings_contents_settings_chartjs', array(), $args );
8307 } else {
8308 $sources_contents = apply_filters( 'ays_cb_chart_page_advanced_settings_contents_settings', array(), $args );
8309 }
8310
8311 $sources = array();
8312 foreach ( $sources_contents as $key => $sources_content ) {
8313 $collapsed = $key == 'advanced_settings' ? 'false' : 'true';
8314
8315 $content = '<fieldset class="ays-accordion-options-container" data-collapsed="' . $collapsed . '">';
8316 if(isset($sources_content['title'])){
8317 $content .= '<legend class="ays-accordion-options-header">';
8318 $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">
8319 <g>
8320 <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" />
8321 </g>
8322 </svg>';
8323
8324 $content .= '<span>'. esc_html($sources_content['title']) .'</span></legend>';
8325 }
8326
8327 $content .= '<div class="ays-accordion-options-content">';
8328 $content .= $sources_content['content'];
8329 $content .= '</div>';
8330
8331 $content .= '</fieldset>';
8332
8333 $sources[] = $content;
8334 }
8335 $content_for_escape = implode('' , $sources );
8336 echo html_entity_decode( esc_html($content_for_escape) );
8337 }
8338
8339 public function settings_contents_advanced_settings( $sources, $args ){
8340 $html_class_prefix = $args['html_class_prefix'];
8341 $html_name_prefix = $args['html_name_prefix'];
8342 $settings = $args['settings'];
8343 $tab_title = $args['tab_name'];
8344
8345 $rotation_degree = $settings['rotation_degree'];
8346 $reverse_categories = $settings['reverse_categories'];
8347 $slice_border_color = $settings['slice_border_color'];
8348 $slice_texts = $settings['slice_texts'];
8349 $slice_text = $settings['slice_text'];
8350 $tooltip_text_options = $settings['tooltip_text_options'];
8351 $tooltip_text = $settings['tooltip_text'];
8352 $is_stacked = $settings['is_stacked'];
8353 $focus_target_options = $settings['focus_target_options'];
8354 $focus_target = $settings['focus_target'];
8355 $multiple_data_format_options = $settings['multiple_data_format_options'];
8356 $multiple_data_format = $settings['multiple_data_format'];
8357 $opacity = $settings['opacity'];
8358 $group_width = $settings['group_width'];
8359 $group_width_format = $settings['group_width_format'];
8360 $group_width_format_options = $settings['group_width_format_options'];
8361 $line_width = $settings['line_width'];
8362 $data_grouping_limit = $settings['data_grouping_limit'];
8363 $data_grouping_label = $settings['data_grouping_label'];
8364 $data_grouping_color = $settings['data_grouping_color'];
8365 $multiple_selection = $settings['multiple_selection'];
8366 $point_shape_options = $settings['point_shape_options'];
8367 $point_shape = $settings['point_shape'];
8368 $crosshair_trigger_options = $settings['crosshair_trigger_options'];
8369 $crosshair_trigger = $settings['crosshair_trigger'];
8370 $crosshair_orientation_options = $settings['crosshair_orientation_options'];
8371 $crosshair_orientation = $settings['crosshair_orientation'];
8372 $crosshair_opacity = $settings['crosshair_opacity'];
8373 $dash_style = $settings['dash_style'];
8374 $point_size = $settings['point_size'];
8375 $donut_hole_size = $settings['donut_hole_size'];
8376 $orientation = $settings['orientation'];
8377 $fill_nulls = $settings['fill_nulls'];
8378 $allow_collapse = $settings['allow_collapse'];
8379 $org_classname = $settings['org_classname'];
8380 $org_node_background_color = $settings['org_node_background_color'];
8381 $org_node_padding = $settings['org_node_padding'];
8382 $org_node_border_radius = $settings['org_node_border_radius'];
8383 $org_node_border_width = $settings['org_node_border_width'];
8384 $org_node_border_color = $settings['org_node_border_color'];
8385 $org_node_text_color = $settings['org_node_text_color'];
8386 $org_node_text_font_size = $settings['org_node_text_font_size'];
8387 $org_node_description_font_color = $settings['org_node_description_font_color'];
8388 $org_node_description_font_size = $settings['org_node_description_font_size'];
8389 $org_selected_classname = $settings['org_selected_classname'];
8390 $org_selected_node_background_color = $settings['org_selected_node_background_color'];
8391 $org_selected_node_text_color = $settings['org_selected_node_text_color'];
8392
8393 ob_start();
8394 ?>
8395 <div class="ays-accordion-data-main-wrap">
8396 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap <?php echo esc_attr($html_class_prefix) ?>advanced-settings-data-wrap">
8397 <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">
8398 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8399 <label for="ays-chart-option-rotation-degree" class="form-label">
8400 <?php echo esc_html(__( "Degree of chart rotation", "chart-builder" )); ?>
8401 <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") ); ?>">
8402 <i class="ays_fa ays_fa_info_circle"></i>
8403 </a>
8404 </label>
8405 </div>
8406 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8407 <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) ?>">
8408 </div>
8409 </div> <!-- Rotation degree -->
8410 <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">
8411 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8412 <label for="ays-chart-option-reverse-categories">
8413 <?php echo esc_html(__( "Reverse Categories", "chart-builder" )); ?>
8414 <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") ); ?>">
8415 <i class="ays_fa ays_fa_info_circle"></i>
8416 </a>
8417 </label>
8418 </div>
8419 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8420 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
8421 <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); ?> >
8422 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
8423 </label>
8424 </div>
8425 </div> <!-- Reverse Categories -->
8426 <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">
8427 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8428 <label for="ays-chart-option-slice-border-color">
8429 <?php echo esc_html(__( "Slice Border Color", "chart-builder" )); ?>
8430 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the slice borders.","chart-builder") ); ?>">
8431 <i class="ays_fa ays_fa_info_circle"></i>
8432 </a>
8433 </label>
8434 </div>
8435 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8436 <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) ?>">
8437 </div>
8438 </div> <!-- Slice border color -->
8439 <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">
8440 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8441 <label for="ays-chart-option-slice-text">
8442 <?php echo esc_html(__( "Slice text", "chart-builder" )); ?>
8443 <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") ); ?>">
8444 <i class="ays_fa ays_fa_info_circle"></i>
8445 </a>
8446 </label>
8447 </div>
8448 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8449 <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]">
8450 <?php
8451 foreach ( $slice_texts as $option_slug => $option ):
8452 $selected = ( $slice_text == $option_slug ) ? 'selected' : '';
8453 ?>
8454 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8455 <?php
8456 endforeach;
8457 ?>
8458 </select>
8459 </div>
8460 </div> <!-- Slice text -->
8461 <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">
8462 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8463 <label for="ays-chart-option-tooltip-text">
8464 <?php echo esc_html(__( "Slice tooltip text", "chart-builder" )); ?>
8465 <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") ); ?>">
8466 <i class="ays_fa ays_fa_info_circle"></i>
8467 </a>
8468 </label>
8469 </div>
8470 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8471 <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]">
8472 <?php
8473 foreach ( $tooltip_text_options as $option_slug => $option ):
8474 $selected = ( $tooltip_text == $option_slug ) ? 'selected' : '';
8475 ?>
8476 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8477 <?php
8478 endforeach;
8479 ?>
8480 </select>
8481 </div>
8482 </div> <!-- Slice tooltip Text -->
8483 <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">
8484 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8485 <label for="ays-chart-option-data-grouping-limit" class="form-label">
8486 <?php echo esc_html(__( "Chart Data Grouping Limit", "chart-builder" )); ?>
8487 <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") ); ?>">
8488 <i class="ays_fa ays_fa_info_circle"></i>
8489 </a>
8490 </label>
8491 </div>
8492 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8493 <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">
8494 </div>
8495 </div> <!-- Data Grouping Limit -->
8496 <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">
8497 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8498 <label for="ays-chart-option-data-grouping-label" class="form-label">
8499 <?php echo esc_html(__( "Chart Data Grouping Label", "chart-builder" )); ?>
8500 <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") ); ?>">
8501 <i class="ays_fa ays_fa_info_circle"></i>
8502 </a>
8503 </label>
8504 </div>
8505 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8506 <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) ?>">
8507 </div>
8508 </div> <!-- Data Grouping Label -->
8509 <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">
8510 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8511 <label for="ays-chart-option-data-grouping-color">
8512 <?php echo esc_html(__( "Chart Data Grouping Color", "chart-builder" )); ?>
8513 <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") ); ?>">
8514 <i class="ays_fa ays_fa_info_circle"></i>
8515 </a>
8516 </label>
8517 </div>
8518 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8519 <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) ?>">
8520 </div>
8521 </div> <!-- Data Grouping Color -->
8522 <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">
8523 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8524 <label for="ays-chart-option-is-stacked">
8525 <?php echo esc_html(__( "Is stacked", "chart-builder" )); ?>
8526 <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") ); ?>">
8527 <i class="ays_fa ays_fa_info_circle"></i>
8528 </a>
8529 </label>
8530 </div>
8531 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8532 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
8533 <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); ?> >
8534 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
8535 </label>
8536 </div>
8537 </div> <!-- Is stacked -->
8538 <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">
8539 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8540 <label for="ays-chart-option-focus-target">
8541 <?php echo esc_html(__( "Focus target", "chart-builder" )); ?>
8542 <a class="ays_help" data-bs-toggle="tooltip" data-bs-html="true" title="<?php
8543 echo esc_html( sprintf(
8544 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
8545 "<p>" . __('There are two ways to focus the data table elements.', "chart-builder") . "</p><ul class='ays_tooltop_ul'><li>" .
8546 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
8547 __('%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>" .
8548 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
8549 __('%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>",
8550 '<em>', '</em>',
8551 '<em>', '</em>'
8552 ));
8553 ?>">
8554 <i class="ays_fa ays_fa_info_circle"></i>
8555 </a>
8556 </label>
8557 </div>
8558 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8559 <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]">
8560 <?php
8561 foreach ( $focus_target_options as $option_slug => $option ):
8562 $selected = ( $focus_target == $option_slug ) ? 'selected' : '';
8563 ?>
8564 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8565 <?php
8566 endforeach;
8567 ?>
8568 </select>
8569 </div>
8570 </div> <!-- Focus target -->
8571 <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">
8572 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8573 <label for="ays-chart-option-opacity" class="form-label">
8574 <?php echo esc_html(__( "Opacity", "chart-builder" )); ?>
8575 <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") ); ?>">
8576 <i class="ays_fa ays_fa_info_circle"></i>
8577 </a>
8578 </label>
8579 </div>
8580 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8581 <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">
8582 </div>
8583 </div> <!-- Data opacity -->
8584 <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">
8585 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8586 <label for="ays-chart-option-group-width">
8587 <?php echo esc_html(__( "Bar width", "chart-builder" )); ?>
8588 <a class="ays_help" data-bs-toggle="tooltip" data-bs-html="true" title="<?php
8589 echo esc_html( sprintf(
8590 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
8591 "<p>" . __('The width of the bars, specified in either of these formats:', "chart-builder") . "</p><ul class='ays_tooltop_ul'><li>" .
8592 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
8593 __('%1$sPixels:%2$s Set the width of the bars in pixels.', "chart-builder") . "</li><li>" .
8594 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
8595 __('%1$sPercentage:%2$s Set the width of the bars in percentage.', "chart-builder") . "</li></ul>",
8596 '<em>', '</em>',
8597 '<em>', '</em>'
8598 ));
8599 ?>">
8600 <i class="ays_fa ays_fa_info_circle"></i>
8601 </a>
8602 </label>
8603 </div>
8604 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8605 <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) ?>">
8606 <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]">
8607 <?php
8608 foreach ( $group_width_format_options as $option_slug => $option ):
8609 $selected = ( $group_width_format == $option_slug ) ? 'selected' : '';
8610 ?>
8611 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8612 <?php
8613 endforeach;
8614 ?>
8615 </select>
8616 </div>
8617 </div> <!-- Bars width -->
8618 <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">
8619 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8620 <label for="ays-chart-option-line-width" class="form-label">
8621 <?php echo esc_html(__( "Line width", "chart-builder" )); ?>
8622 <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") ); ?>">
8623 <i class="ays_fa ays_fa_info_circle"></i>
8624 </a>
8625 </label>
8626 </div>
8627 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8628 <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) ?>">
8629 </div>
8630 </div> <!-- Line width -->
8631 <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">
8632 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8633 <label for="ays-chart-option-multiple-selection">
8634 <?php echo esc_html(__( "Multiple data selection", "chart-builder" )); ?>
8635 <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") ); ?>">
8636 <i class="ays_fa ays_fa_info_circle"></i>
8637 </a>
8638 </label>
8639 </div>
8640 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8641 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
8642 <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); ?> >
8643 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
8644 </label>
8645 </div>
8646 </div> <!-- Multiple data selection -->
8647 <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">
8648 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8649 <label for="ays-chart-option-multiple-data-format">
8650 <?php echo esc_html(__( "Multiple data format", "chart-builder" )); ?>
8651 <a class="ays_help" data-bs-toggle="tooltip" data-bs-html="true" title="<?php
8652 echo esc_html( sprintf(
8653 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
8654 "<p>" . __('How multiple data selections are rolled up into tooltips:', "chart-builder") . "</p><ul class='ays_tooltop_ul'><li>" .
8655 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
8656 __('%1$sCategory:%2$s Group selected data by row titles.', "chart-builder") . "</li><li>" .
8657 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
8658 __('%1$sSeries:%2$s Group selected data by column titles.', "chart-builder") . "</li><li>" .
8659 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
8660 __('%1$sAuto:%2$s Group selected data by row titles, if they have the same titles or by column titles', "chart-builder") . "</li><li>" .
8661 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
8662 __('%1$sNone:%2$s Show only one tooltip per selection.', "chart-builder") . "</li></ul>",
8663 '<em>', '</em>',
8664 '<em>', '</em>',
8665 '<em>', '</em>',
8666 '<em>', '</em>'
8667 ));
8668 ?>">
8669 <i class="ays_fa ays_fa_info_circle"></i>
8670 </a>
8671 </label>
8672 </div>
8673 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8674 <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]">
8675 <?php
8676 foreach ( $multiple_data_format_options as $option_slug => $option ):
8677 $selected = ( $multiple_data_format == $option_slug ) ? 'selected' : '';
8678 ?>
8679 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8680 <?php
8681 endforeach;
8682 ?>
8683 </select>
8684 </div>
8685 </div> <!-- Multiple data format -->
8686 <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">
8687 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8688 <label for="ays-chart-option-point-shape">
8689 <?php echo esc_html(__( "Point shape", "chart-builder" )); ?>
8690 <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") ); ?>">
8691 <i class="ays_fa ays_fa_info_circle"></i>
8692 </a>
8693 </label>
8694 </div>
8695 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8696 <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]">
8697 <?php
8698 foreach ( $point_shape_options as $option_slug => $option ):
8699 $selected = ( $point_shape == $option_slug ) ? 'selected' : '';
8700 ?>
8701 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8702 <?php
8703 endforeach;
8704 ?>
8705 </select>
8706 </div>
8707 </div> <!-- Point shape -->
8708 <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">
8709 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8710 <label for="ays-chart-option-point-size" class="form-label">
8711 <?php echo esc_html(__( "Point size", "chart-builder" )); ?>
8712 <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") ); ?>">
8713 <i class="ays_fa ays_fa_info_circle"></i>
8714 </a>
8715 </label>
8716 </div>
8717 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8718 <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) ?>">
8719 </div>
8720 </div> <!-- Point size -->
8721 <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">
8722 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8723 <label for="ays-chart-option-orientation">
8724 <?php echo esc_html(__( "Rotate Vertical", "chart-builder" )); ?>
8725 <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") ); ?>">
8726 <i class="ays_fa ays_fa_info_circle"></i>
8727 </a>
8728 </label>
8729 </div>
8730 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8731 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
8732 <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); ?> >
8733 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
8734 </label>
8735 </div>
8736 </div> <!-- Orientation -->
8737 <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">
8738 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8739 <label for="ays-chart-option-fill-nulls">
8740 <?php echo esc_html(__( "Autofill nulls", "chart-builder" )); ?>
8741 <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") ); ?>">
8742 <i class="ays_fa ays_fa_info_circle"></i>
8743 </a>
8744 </label>
8745 </div>
8746 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8747 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
8748 <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); ?> >
8749 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
8750 </label>
8751 </div>
8752 </div> <!-- Autofill nulls -->
8753 <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">
8754 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8755 <label for="ays-chart-option-crosshair-trigger">
8756 <?php echo esc_html(__( "Crosshair trigger", "chart-builder" )); ?>
8757 <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") ); ?>">
8758 <i class="ays_fa ays_fa_info_circle"></i>
8759 </a>
8760 </label>
8761 </div>
8762 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8763 <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]">
8764 <?php
8765 foreach ( $crosshair_trigger_options as $option_slug => $option ):
8766 $selected = ( $crosshair_trigger == $option_slug ) ? 'selected' : '';
8767 ?>
8768 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8769 <?php
8770 endforeach;
8771 ?>
8772 </select>
8773 </div>
8774 </div> <!-- Crosshair trigger -->
8775 <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">
8776 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8777 <label for="ays-chart-option-crosshair-orientation">
8778 <?php echo esc_html(__( "Crosshair orientation", "chart-builder" )); ?>
8779 <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") ); ?>">
8780 <i class="ays_fa ays_fa_info_circle"></i>
8781 </a>
8782 </label>
8783 </div>
8784 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8785 <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]">
8786 <?php
8787 foreach ( $crosshair_orientation_options as $option_slug => $option ):
8788 $selected = ( $crosshair_orientation == $option_slug ) ? 'selected' : '';
8789 ?>
8790 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8791 <?php
8792 endforeach;
8793 ?>
8794 </select>
8795 </div>
8796 </div> <!-- Crosshair orientation -->
8797 <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">
8798 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8799 <label for="ays-chart-option-crosshair-opacity" class="form-label">
8800 <?php echo esc_html(__( "Crosshair opacity", "chart-builder" )); ?>
8801 <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") ); ?>">
8802 <i class="ays_fa ays_fa_info_circle"></i>
8803 </a>
8804 </label>
8805 </div>
8806 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8807 <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">
8808 </div>
8809 </div> <!-- Crosshair opacity -->
8810 <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">
8811 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8812 <label for="ays-chart-option-dash-style" class="form-label">
8813 <?php echo esc_html(__( "Dash Pattern", "chart-builder" )); ?>
8814 <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") ); ?>">
8815 <i class="ays_fa ays_fa_info_circle"></i>
8816 </a>
8817 </label>
8818 </div>
8819 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8820 <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) ?>">
8821 </div>
8822 </div> <!-- Line dash pattern -->
8823 <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">
8824 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8825 <label for="ays-chart-option-donut-hole-size">
8826 <?php echo esc_html(__( "Hole size", 'chart-builder' )); ?>
8827 </label>
8828 </div>
8829 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right <?php echo esc_attr($html_class_prefix) ?>option-input">
8830 <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) ?>">
8831 </div>
8832 </div> <!-- Donut hole size -->
8833 <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">
8834 <div class="ays-pro-features-v2-small-buttons-box-middle ays-pro-features-v2-big-buttons-box">
8835 <div class="ays-pro-features-v2-video-button"></div>
8836 <a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-pro-features-v2-upgrade-button">
8837 <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>
8838 <div class="ays-pro-features-v2-upgrade-text">
8839 <?php echo esc_html(__("Upgrade" , "chart-builder")); ?>
8840 </div>
8841 </a>
8842 </div>
8843 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix )?>option-title">
8844 <label for="ays-chart-option-curve-type">
8845 <?php echo esc_html(__( "Line curve type", "chart-builder" )); ?>
8846 </label>
8847 </div>
8848 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8849 <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]">
8850 <option><?php echo esc_html(__( "Straight", "chart-builder" )); ?></option>
8851 </select>
8852 </div>
8853 </div> <!-- Line curve type -->
8854 <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">
8855 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8856 <label for="ays-chart-option-allow-collapse">
8857 <?php echo esc_html(__( "Allow collapse", "chart-builder" )); ?>
8858 <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") ); ?>">
8859 <i class="ays_fa ays_fa_info_circle"></i>
8860 </a>
8861 </label>
8862 </div>
8863 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8864 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
8865 <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); ?> >
8866 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
8867 </label>
8868 </div>
8869 </div> <!-- Allow collapse -->
8870 <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">
8871 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8872 <label for="ays-chart-option-org-node-description-font-color">
8873 <?php echo esc_html(__( "Description color", "chart-builder" )); ?>
8874 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Description text color of the node.","chart-builder") ); ?>">
8875 <i class="ays_fa ays_fa_info_circle"></i>
8876 </a>
8877 </label>
8878 </div>
8879 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8880 <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) ?>">
8881 </div>
8882 </div> <!-- Org Node Description color -->
8883 <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">
8884 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8885 <label for="ays-chart-option-org-node-description-font-size" class="form-label">
8886 <?php echo esc_html(__( "Description font size", "chart-builder" )); ?>
8887 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Description font size of the node.","chart-builder") ); ?>">
8888 <i class="ays_fa ays_fa_info_circle"></i>
8889 </a>
8890 </label>
8891 </div>
8892 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8893 <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) ?>">
8894 </div>
8895 </div> <!-- Org Node Description font size -->
8896 <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">
8897 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8898 <label for="ays-chart-option-org-classname" class="form-label">
8899 <?php echo esc_html(__( "Custom CSS class", "chart-builder" )); ?>
8900 <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") ); ?>">
8901 <i class="ays_fa ays_fa_info_circle"></i>
8902 </a>
8903 </label>
8904 </div>
8905 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8906 <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) ?>">
8907 </div>
8908 </div> <!-- Org custom class -->
8909 <div class="form-group mb-2 cb-changable-opt cb-org_chart-opt display_none">
8910 <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">
8911 <br>
8912 <blockquote>
8913 <?php echo sprintf(
8914 /* translators: %1$s: Opening <strong> tag, %2$s: Closing </strong> tag */
8915 esc_html(__( '%1$sNote:%2$s Custom CSS class must be set for the options below to take effect.', 'chart-builder' )), '<strong>', '</strong>'); ?>
8916 </blockquote>
8917 <br>
8918 </div>
8919 <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">
8920 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8921 <label for="ays-chart-option-org-node-background-color">
8922 <?php echo esc_html(__( "Background color", "chart-builder" )); ?>
8923 <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") ); ?>">
8924 <i class="ays_fa ays_fa_info_circle"></i>
8925 </a>
8926 </label>
8927 </div>
8928 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8929 <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) ?>">
8930 </div>
8931 </div> <!-- Org Node Background color -->
8932 <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">
8933 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8934 <label for="ays-chart-option-org-node-padding" class="form-label">
8935 <?php echo esc_html(__( "Padding", "chart-builder" )); ?>
8936 <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") ); ?>">
8937 <i class="ays_fa ays_fa_info_circle"></i>
8938 </a>
8939 </label>
8940 </div>
8941 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8942 <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) ?>">
8943 </div>
8944 </div> <!-- Org Node Padding -->
8945 <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">
8946 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8947 <label for="ays-chart-option-org-node-border-radius" class="form-label">
8948 <?php echo esc_html(__( "Border radius", "chart-builder" )); ?>
8949 <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") ); ?>">
8950 <i class="ays_fa ays_fa_info_circle"></i>
8951 </a>
8952 </label>
8953 </div>
8954 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8955 <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) ?>">
8956 </div>
8957 </div> <!-- Org Node Border radius -->
8958 <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">
8959 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8960 <label for="ays-chart-option-org-node-border-width" class="form-label">
8961 <?php echo esc_html(__( "Border width", "chart-builder" )); ?>
8962 <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") ); ?>">
8963 <i class="ays_fa ays_fa_info_circle"></i>
8964 </a>
8965 </label>
8966 </div>
8967 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8968 <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) ?>">
8969 </div>
8970 </div> <!-- Org Node Border width -->
8971 <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">
8972 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8973 <label for="ays-chart-option-org-node-border-color">
8974 <?php echo esc_html(__( "Border color", "chart-builder" )); ?>
8975 <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") ); ?>">
8976 <i class="ays_fa ays_fa_info_circle"></i>
8977 </a>
8978 </label>
8979 </div>
8980 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8981 <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) ?>">
8982 </div>
8983 </div> <!-- Org Node Background color -->
8984 <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">
8985 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8986 <label for="ays-chart-option-org-node-text-color">
8987 <?php echo esc_html(__( "Text color", "chart-builder" )); ?>
8988 <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") ); ?>">
8989 <i class="ays_fa ays_fa_info_circle"></i>
8990 </a>
8991 </label>
8992 </div>
8993 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8994 <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) ?>">
8995 </div>
8996 </div> <!-- Org Node Text color -->
8997 <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">
8998 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8999 <label for="ays-chart-option-org-node-text-font-size" class="form-label">
9000 <?php echo esc_html(__( "Text font size", "chart-builder" )); ?>
9001 <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") ); ?>">
9002 <i class="ays_fa ays_fa_info_circle"></i>
9003 </a>
9004 </label>
9005 </div>
9006 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9007 <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) ?>">
9008 </div>
9009 </div> <!-- Org Node Text font size -->
9010 </div> <!-- Org custom class options -->
9011 <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">
9012 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9013 <label for="ays-chart-option-org-selected-classname" class="form-label">
9014 <?php echo esc_html(__( "Selected node custom CSS class", "chart-builder" )); ?>
9015 <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") ); ?>">
9016 <i class="ays_fa ays_fa_info_circle"></i>
9017 </a>
9018 </label>
9019 </div>
9020 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
9021 <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) ?>">
9022 </div>
9023 </div> <!-- Org custom selected class -->
9024 <div class="form-group mb-2 cb-changable-opt cb-org_chart-opt display_none">
9025 <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">
9026 <br>
9027 <blockquote>
9028 <?php echo sprintf(
9029 /* translators: %1$s: Opening <strong> tag, %2$s: Closing </strong> tag */
9030 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' )),
9031 '<strong>',
9032 '</strong>'
9033 ); ?>
9034 </blockquote>
9035 <br>
9036 </div>
9037 <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">
9038 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9039 <label for="ays-chart-option-org-selected-node-background-color">
9040 <?php echo esc_html(__( "Background color", "chart-builder" )); ?>
9041 <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") ); ?>">
9042 <i class="ays_fa ays_fa_info_circle"></i>
9043 </a>
9044 </label>
9045 </div>
9046 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9047 <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) ?>">
9048 </div>
9049 </div> <!-- Org selected Node Background color -->
9050 <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">
9051 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9052 <label for="ays-chart-option-org-selected-node-text-color">
9053 <?php echo esc_html(__( "Text color", "chart-builder" )); ?>
9054 <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") ); ?>">
9055 <i class="ays_fa ays_fa_info_circle"></i>
9056 </a>
9057 </label>
9058 </div>
9059 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9060 <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) ?>">
9061 </div>
9062 </div> <!-- Org selected Node text color -->
9063 </div> <!-- Org custom selected class options -->
9064 </div>
9065 </div>
9066 <?php
9067 $content = ob_get_clean();
9068
9069 $sources['advanced_settings'] = array(
9070 'content' => $content,
9071 'title' => $tab_title
9072 );
9073
9074 return $sources;
9075 }
9076
9077 public function settings_contents_advanced_settings_chartjs( $sources, $args ){
9078 $html_class_prefix = $args['html_class_prefix'];
9079 $html_name_prefix = $args['html_name_prefix'];
9080 $settings = $args['settings'];
9081 $tab_title = $args['tab_name'];
9082
9083 $outer_radius = $settings['outer_radius'];
9084 $slice_spacing = $settings['slice_spacing'];
9085 $circumference = $settings['circumference'];
9086 $start_angle = $settings['start_angle'];
9087 $slice_border_color = $settings['slice_border_color'];
9088 $slice_border_width = $settings['slice_border_width'];
9089 // $index_axis = $settings['index_axis'];
9090
9091 ob_start();
9092 ?>
9093 <div class="ays-accordion-data-main-wrap">
9094 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap <?php echo esc_attr($html_class_prefix) ?>advanced-settings-data-wrap">
9095 <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">
9096 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9097 <label for="ays-chart-option-outer-radius" class="form-label">
9098 <?php echo esc_html(__( "Outer Radius", "chart-builder" )); ?>
9099 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The outer radius of the chart.","chart-builder") ); ?>">
9100 <i class="ays_fa ays_fa_info_circle"></i>
9101 </a>
9102 </label>
9103 </div>
9104 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
9105 <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) ?>">
9106 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
9107 </div>
9108 </div> <!-- Outer Radius -->
9109 <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">
9110 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9111 <label for="ays-chart-option-slice-spacing" class="form-label">
9112 <?php echo esc_html(__( "Slices Spacing", "chart-builder" )); ?>
9113 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Fixed arc offset (in pixels).","chart-builder") ); ?>">
9114 <i class="ays_fa ays_fa_info_circle"></i>
9115 </a>
9116 </label>
9117 </div>
9118 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
9119 <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) ?>">
9120 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
9121 </div>
9122 </div> <!-- Slice Spacing -->
9123 <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">
9124 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9125 <label for="ays-chart-option-circumference" class="form-label">
9126 <?php echo esc_html(__( "Arc Coverage", "chart-builder" )); ?>
9127 <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") ); ?>">
9128 <i class="ays_fa ays_fa_info_circle"></i>
9129 </a>
9130 </label>
9131 </div>
9132 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
9133 <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) ?>">
9134 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">°</div>
9135 </div>
9136 </div> <!-- Arc Coverage -->
9137 <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">
9138 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9139 <label for="ays-chart-option-start-angle" class="form-label">
9140 <?php echo esc_html(__( "Start Angle", "chart-builder" )); ?>
9141 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Starting angle to draw arcs from.","chart-builder") ); ?>">
9142 <i class="ays_fa ays_fa_info_circle"></i>
9143 </a>
9144 </label>
9145 </div>
9146 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
9147 <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) ?>">
9148 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">°</div>
9149 </div>
9150 </div> <!-- Start Angle -->
9151 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt ">
9152 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9153 <label for="ays-chart-option-slice-border-width">
9154 <?php echo esc_html(__( "Border Width", "chart-builder" )); ?>
9155 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The width of the slice borders.","chart-builder") ); ?>">
9156 <i class="ays_fa ays_fa_info_circle"></i>
9157 </a>
9158 </label>
9159 </div>
9160 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
9161 <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) ?>">
9162 </div>
9163 </div> <!-- Border Width -->
9164 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt ">
9165 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9166 <label for="ays-chart-option-slice-border-color">
9167 <?php echo esc_html(__( "Border Color", "chart-builder" )); ?>
9168 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the slice borders.","chart-builder") ); ?>">
9169 <i class="ays_fa ays_fa_info_circle"></i>
9170 </a>
9171 </label>
9172 </div>
9173 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9174 <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) ?>">
9175 </div>
9176 </div> <!-- Slice border color -->
9177 <!-- <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">
9178 <div class="col-sm-5 d-flex align-items-center <?php // echo esc_attr($html_class_prefix) ?>option-title">
9179 <label for="ays-chart-option-index-axis">
9180 <?php // echo esc_html(__( "Horizontal ", "chart-builder" )); ?>
9181 <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") ); ?>">
9182 <i class="ays_fa ays_fa_info_circle"></i>
9183 </a>
9184 </label>
9185 </div>
9186 <div class="col-sm-7 py-1 <?php // echo esc_attr($html_class_prefix) ?>input-align-right">
9187 <label class="<?php // echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
9188 <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); ?> >
9189 <span class="<?php // echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php // echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
9190 </label>
9191 </div>
9192 </div> Reverse Categories -->
9193 </div>
9194 </div>
9195 <?php
9196 $content = ob_get_clean();
9197
9198 $sources['advanced_settings'] = array(
9199 'content' => $content,
9200 'title' => $tab_title
9201 );
9202
9203 return $sources;
9204 }
9205
9206 public function settings_contents_slices_settings( $sources, $args ){
9207 $html_class_prefix = $args['html_class_prefix'];
9208 $html_name_prefix = $args['html_name_prefix'];
9209 $settings = $args['settings'];
9210 $source = $args['source'];
9211 $source = isset($source["commonTypeCharts"]) ? $source["commonTypeCharts"] : $source;
9212 $source_chart_type = $args['source_chart_type'];
9213 $settings = $args['settings'];
9214 $title_row = array_shift($source);
9215
9216 if (isset($source) && !empty($source)) {
9217 if ( !isset( $source[0] ) ) {
9218 if (count($source[1]) > 2) {
9219 $titles = array();
9220 for ($i = 0; $i < count($source[1]); $i++) {
9221 array_push($titles, __("Title", 'chart-builder').$i);
9222 }
9223 $source[0] = $titles;
9224 } else {
9225 $source[0] = array(
9226 __("Country", 'chart-builder'),
9227 __("Population", 'chart-builder'),
9228 );
9229 }
9230
9231 ksort($source);
9232 }
9233 }
9234
9235 if ($source_chart_type == 'pie_chart' || $source_chart_type == 'donut_chart') {
9236 foreach ($source as $key => $row) {
9237 $source[$key] = array_slice($row, 0, 2);
9238 }
9239 }
9240
9241 ob_start();
9242 if ($source_chart_type == 'pie_chart' || $source_chart_type == 'donut_chart') {
9243 $slice_color = $settings['slice_color'];
9244 $slice_colors_default = $settings['slice_colors_default'];
9245 $slice_offset = $settings['slice_offset'];
9246 $slice_text_color = $settings['slice_text_color'];
9247
9248 ?>
9249 <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">
9250 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
9251 <div class="<?php echo esc_attr($html_class_prefix) ?>slices-settings">
9252 <?php
9253 foreach ( $source as $key => $val ):
9254 ?>
9255 <fieldset class="ays-slices-accordion-options-container <?php echo esc_attr($html_class_prefix) ?>options-slices-<?php echo esc_attr($key); ?>" data-collapsed="true">
9256 <legend class="ays-slices-accordion-options-header">
9257 <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">
9258 <g>
9259 <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" />
9260 </g>
9261 </svg>
9262 <span><?php echo esc_html($val[0]); ?></span>
9263 </legend>
9264 <div class="ays-slices-accordion-options-content ays-slices-accordion-options-content">
9265 <div class="ays-slices-accordion-data-main-wrap">
9266 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
9267 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
9268 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9269 <label for="ays-chart-option-slice-color">
9270 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
9271 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color to use for this slice.","chart-builder") ); ?>">
9272 <i class="ays_fa ays_fa_info_circle"></i>
9273 </a>
9274 </label>
9275 </div>
9276 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9277 <input type="color"
9278 id="ays-chart-option-slice-color-<?php echo esc_attr($key); ?>"
9279 class="ays-chart-option-slice-color form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker"
9280 name="<?php echo esc_attr($html_name_prefix); ?>settings[slice_color][<?php echo esc_attr($key); ?>]"
9281 value="<?php echo isset($slice_color[$key]) ? esc_attr($slice_color[$key]) : esc_attr($slice_colors_default[$key]); ?>"
9282 data-slice-id="<?php echo esc_attr($key); ?>">
9283 </div>
9284 </div> <!-- Slice color -->
9285 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
9286 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9287 <label for="ays-chart-option-slice-offset" class="form-label">
9288 <?php echo esc_html(__( "Offset", "chart-builder" )); ?>
9289 <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") ); ?>">
9290 <i class="ays_fa ays_fa_info_circle"></i>
9291 </a>
9292 </label>
9293 </div>
9294 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9295 <input type="number"
9296 id="ays-chart-option-slice-offset-<?php echo esc_attr($key); ?>"
9297 class="ays-chart-option-slice-offset ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input"
9298 name="<?php echo esc_attr($html_name_prefix); ?>settings[slice_offset][<?php echo esc_attr($key); ?>]"
9299 value="<?php echo isset($slice_offset[$key]) ? esc_attr($slice_offset[$key]) : 0 ; ?>"
9300 data-slice-id="<?php echo esc_attr($key); ?>"
9301 step=".01" min="0.0" max="1.0">
9302 </div>
9303 </div> <!-- Slice offset -->
9304 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
9305 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9306 <label for="ays-chart-option-slice-text-color">
9307 <?php echo esc_html(__( "Text color", "chart-builder" )); ?>
9308 <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") ); ?>">
9309 <i class="ays_fa ays_fa_info_circle"></i>
9310 </a>
9311 </label>
9312 </div>
9313 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9314 <input type="color"
9315 id="ays-chart-option-slice-text-color-<?php echo esc_attr($key); ?>"
9316 class="ays-chart-option-slice-text-color form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker"
9317 name="<?php echo esc_attr($html_name_prefix); ?>settings[slice_text_color][<?php echo esc_attr($key); ?>]"
9318 value="<?php echo isset($slice_text_color[$key]) ? esc_attr($slice_text_color[$key]) : '#ffffff'; ?>"
9319 data-slice-id="<?php echo esc_attr($key); ?>">
9320 </div>
9321 </div> <!-- Slice color -->
9322 </div>
9323 </div>
9324 </div>
9325 </fieldset>
9326 <?php
9327 endforeach;
9328 ?>
9329 </div>
9330 </div>
9331 <br>
9332 <blockquote>
9333 <?php echo esc_html(__( "Save the chart to update the data.", "chart-builder" )); ?>
9334 </blockquote>
9335 </div>
9336 <?php
9337
9338 } else {
9339 ?>
9340 <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>
9341 <?php
9342 }
9343
9344 $content = ob_get_clean();
9345
9346 $title = esc_html(__( 'Slices settings', 'chart-builder' ));
9347
9348 $sources['slices_settings'] = array(
9349 'content' => $content,
9350 'title' => $title
9351 );
9352
9353 return $sources;
9354 }
9355
9356 public function settings_contents_slices_settings_chartjs( $sources, $args ){
9357 $html_class_prefix = $args['html_class_prefix'];
9358 $html_name_prefix = $args['html_name_prefix'];
9359 $settings = $args['settings'];
9360 $source = $args['source'];
9361 $source = isset($source["commonTypeCharts"]) ? $source["commonTypeCharts"] : $source;
9362 $source_chart_type = $args['source_chart_type'];
9363 $settings = $args['settings'];
9364 $title_row = array_shift($source);
9365
9366 if (isset($source) && !empty($source)) {
9367 if ( !isset( $source[0] ) ) {
9368 if (count($source[1]) > 2) {
9369 $titles = array();
9370 for ($i = 0; $i < count($source[1]); $i++) {
9371 array_push($titles, __("Title", 'chart-builder').$i);
9372 }
9373 $source[0] = $titles;
9374 } else {
9375 $source[0] = array(
9376 __("Country", 'chart-builder'),
9377 __("Population", 'chart-builder'),
9378 );
9379 }
9380
9381 ksort($source);
9382 }
9383 }
9384
9385 if ($source_chart_type == 'pie_chart') {
9386 foreach ($source as $key => $row) {
9387 $source[$key] = array_slice($row, 0, 2);
9388 }
9389 }
9390
9391 ob_start();
9392 if ($source_chart_type == 'pie_chart') {
9393 $slice_color = $settings['slice_color'];
9394 $slices_border_color = $settings['slices_border_color'];
9395 $slice_colors_default = $settings['slice_colors_default'];
9396
9397 ?>
9398 <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">
9399 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
9400 <div class="<?php echo esc_attr($html_class_prefix) ?>slices-settings">
9401 <?php
9402 foreach ( $source as $key => $val ):
9403 ?>
9404 <fieldset class="ays-slices-accordion-options-container <?php echo esc_attr($html_class_prefix) ?>options-slices-<?php echo esc_attr($key); ?>" data-collapsed="true">
9405 <legend class="ays-slices-accordion-options-header">
9406 <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">
9407 <g>
9408 <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" />
9409 </g>
9410 </svg>
9411 <span><?php echo esc_html($val[0]); ?></span>
9412 </legend>
9413 <div class="ays-slices-accordion-options-content ays-slices-accordion-options-content">
9414 <div class="ays-slices-accordion-data-main-wrap">
9415 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
9416 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
9417 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9418 <label for="ays-chart-option-slice-color">
9419 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
9420 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color to use for this slice.","chart-builder") ); ?>">
9421 <i class="ays_fa ays_fa_info_circle"></i>
9422 </a>
9423 </label>
9424 </div>
9425 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9426 <input type="color"
9427 id="ays-chart-option-slice-color-<?php echo esc_attr($key); ?>"
9428 class="ays-chart-option-slice-color form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker"
9429 name="<?php echo esc_attr($html_name_prefix); ?>settings[slice_color][<?php echo esc_attr($key); ?>]"
9430 value="<?php echo isset($slice_color[$key]) ? esc_attr($slice_color[$key]) : esc_attr($slice_colors_default[$key]); ?>"
9431 data-slice-id="<?php echo esc_attr($key); ?>">
9432 </div>
9433 </div> <!-- Slice color -->
9434 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
9435 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9436 <label for="ays-chart-option-slice-border-color">
9437 <?php echo esc_html(__( "Border Color", "chart-builder" )); ?>
9438 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color to use for this slice border.","chart-builder") ); ?>">
9439 <i class="ays_fa ays_fa_info_circle"></i>
9440 </a>
9441 </label>
9442 </div>
9443 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9444 <input type="color"
9445 id="ays-chart-option-slice-border-color-<?php echo esc_attr($key); ?>"
9446 class="ays-chart-option-slice-border-color form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker"
9447 name="<?php echo esc_attr($html_name_prefix); ?>settings[slices_border_color][<?php echo esc_attr($key); ?>]"
9448 value="<?php echo isset($slices_border_color[$key]) ? esc_attr($slices_border_color[$key]) : esc_attr($settings['slice_border_color']); ?>"
9449 data-slice-id="<?php echo esc_attr($key); ?>">
9450 </div>
9451 </div> <!-- Slice border color -->
9452 </div>
9453 </div>
9454 </div>
9455 </fieldset>
9456 <?php
9457 endforeach;
9458 ?>
9459 </div>
9460 </div>
9461 <br>
9462 <blockquote>
9463 <?php echo esc_html(__( "Save the chart to update the data.", "chart-builder" )); ?>
9464 </blockquote>
9465 </div>
9466 <?php
9467
9468 } else {
9469 ?>
9470 <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>
9471 <?php
9472 }
9473
9474 $content = ob_get_clean();
9475
9476 $title = esc_html(__( 'Slices settings', 'chart-builder' ));
9477
9478 $sources['slices_settings'] = array(
9479 'content' => $content,
9480 'title' => $title
9481 );
9482
9483 return $sources;
9484 }
9485
9486 public function settings_contents_series_settings( $sources, $args ){
9487 $html_class_prefix = $args['html_class_prefix'];
9488 $html_name_prefix = $args['html_name_prefix'];
9489 $settings = $args['settings'];
9490 $source = $args['source'];
9491 $source = isset($source["commonTypeCharts"]) ? $source["commonTypeCharts"] : $source;
9492 $source_chart_type = $args['source_chart_type'];
9493
9494 $line_width = $settings['line_width'];
9495 $point_size = $settings['point_size'];
9496 $point_shape_options = $settings['point_shape_options'];
9497 $point_shape = $settings['point_shape'];
9498
9499 if (isset($source) && !empty($source)) {
9500 if ( !isset( $source[0] ) ) {
9501 if (count($source[1]) > 2) {
9502 $titles = array();
9503 for ($i = 0; $i < count($source[1]); $i++) {
9504 array_push($titles, __("Title", "chart-builder").$i);
9505 }
9506 $source[0] = $titles;
9507 } else {
9508 $source[0] = array(
9509 __("Country", "chart-builder"),
9510 __("Population", "chart-builder"),
9511 );
9512 }
9513
9514 ksort($source);
9515 }
9516 }
9517
9518 if ($source_chart_type == 'pie_chart' || $source_chart_type == 'donut_chart') {
9519 foreach ($source as $key => $row) {
9520 $source[$key] = array_slice($row, 0, 2);
9521 }
9522 }
9523
9524 ob_start();
9525 if ($source_chart_type == 'pie_chart' || $source_chart_type == 'line_chart' || $source_chart_type == 'bar_chart' || $source_chart_type == 'column_chart') {
9526 $series_row = array_shift($source);
9527 $title = array_shift($series_row);
9528 $series_color = $settings['series_color'];
9529 $series_colors_default = $settings['series_colors_default'];
9530 $series_format = $settings['series_format'];
9531 $series_visible_in_legend = $settings['series_visible_in_legend'];
9532 $series_line_width = $settings['series_line_width'];
9533 $series_point_size = $settings['series_point_size'];
9534 $series_point_shape = $settings['series_point_shape'];
9535
9536 ?>
9537 <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">
9538 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
9539 <div class="<?php echo esc_attr($html_class_prefix) ?>series-settings">
9540 <?php
9541 foreach ( $series_row as $key => $val ):
9542 ?>
9543 <fieldset class="ays-series-accordion-options-container <?php echo esc_attr($html_class_prefix) ?>options-series-<?php echo esc_attr($key); ?>" data-collapsed="true">
9544 <legend class="ays-series-accordion-options-header">
9545 <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">
9546 <g>
9547 <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" />
9548 </g>
9549 </svg>
9550 <span><?php echo esc_attr($val); ?></span>
9551 </legend>
9552 <div class="ays-series-accordion-options-content ays-series-accordion-options-content">
9553 <div class="ays-series-accordion-data-main-wrap">
9554 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
9555 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
9556 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9557 <label for="ays-chart-option-series-color">
9558 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
9559 </label>
9560 </div>
9561 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9562 <input type="color"
9563 id="ays-chart-option-series-color-<?php echo esc_attr($key); ?>"
9564 class="ays-chart-option-series-color form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker"
9565 name="<?php echo esc_attr($html_name_prefix); ?>settings[series_color][<?php echo esc_attr($key); ?>]"
9566 value="<?php echo isset($series_color[$key]) ? esc_attr($series_color[$key]) : esc_attr($series_colors_default[$key]); ?>"
9567 data-series-id="<?php echo esc_attr($key); ?>">
9568 </div>
9569 </div> <!-- series color -->
9570 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
9571 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9572 <label for="ays-chart-option-series-visible-in-legend">
9573 <?php echo esc_html(__( "Visible in legend", "chart-builder" )); ?>
9574 <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") ); ?>">
9575 <i class="ays_fa ays_fa_info_circle"></i>
9576 </a>
9577 </label>
9578 </div>
9579 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9580 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
9581 <input type="checkbox"
9582 id="ays-chart-option-series-visible-in-legend-<?php echo esc_attr($key); ?>"
9583 class="ays-chart-option-series-visible-in-legend <?php echo esc_attr($html_class_prefix) ?>toggle-switch"
9584 name="<?php echo esc_attr($html_name_prefix); ?>settings[series_visible_in_legend][<?php echo esc_attr($key); ?>]"
9585 value="on"
9586 data-series-id="<?php echo esc_attr($key); ?>"
9587 <?php echo isset($series_visible_in_legend[$key]) && $series_visible_in_legend[$key] == 'on' ? 'checked' : (!isset($series_color[$key]) ? 'checked' : ''); ?> >
9588 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
9589 </label>
9590 </div>
9591 </div> <!-- Series visible in legend -->
9592 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
9593 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9594 <label for="ays-chart-option-series-color">
9595 <?php echo esc_html(__( "Format", "chart-builder" )); ?>
9596 <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") ); ?>">
9597 <i class="ays_fa ays_fa_info_circle"></i>
9598 </a>
9599 </label>
9600 </div>
9601 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9602 <input type="text"
9603 id="ays-chart-option-series-format-<?php echo $key; ?>"
9604 class="ays-chart-option-series-format ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input"
9605 name="<?php echo esc_attr($html_name_prefix); ?>settings[series_format][<?php echo $key; ?>]"
9606 value="<?php echo isset($series_format[$key]) && '' !== $series_format[$key] ? esc_attr($series_format[$key]) : ''; ?>"
9607 data-series-id="<?php echo $key; ?>">
9608 </div>
9609 </div> <!-- Format -->
9610 <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">
9611 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9612 <label for="ays-chart-option-series-line-width">
9613 <?php echo esc_html(__( "Line width", "chart-builder" )); ?>
9614 <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") ); ?>">
9615 <i class="ays_fa ays_fa_info_circle"></i>
9616 </a>
9617 </label>
9618 </div>
9619 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9620 <input type="number"
9621 id="ays-chart-option-series-line-width-<?php echo esc_attr($key); ?>"
9622 class="ays-chart-option-series-line-width ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input"
9623 name="<?php echo esc_attr($html_name_prefix); ?>settings[series_line_width][<?php echo esc_attr($key); ?>]"
9624 value="<?php echo isset($series_line_width[$key]) ? esc_attr($series_line_width[$key]) : esc_attr($line_width); ?>"
9625 data-series-id="<?php echo esc_attr($key); ?>">
9626 </div>
9627 </div> <!-- Line width -->
9628 <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">
9629 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9630 <label for="ays-chart-option-series-point-size">
9631 <?php echo esc_html(__( "Point size", "chart-builder" )); ?>
9632 <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") ); ?>">
9633 <i class="ays_fa ays_fa_info_circle"></i>
9634 </a>
9635 </label>
9636 </div>
9637 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9638 <input type="number"
9639 id="ays-chart-option-series-point-size-<?php echo esc_attr($key); ?>"
9640 class="ays-chart-option-series-point-size ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input"
9641 name="<?php echo esc_attr($html_name_prefix); ?>settings[series_point_size][<?php echo esc_attr($key); ?>]"
9642 value="<?php echo isset($series_point_size[$key]) ? esc_attr($series_point_size[$key]) : esc_attr($point_size); ?>"
9643 data-series-id="<?php echo esc_attr($key); ?>">
9644 </div>
9645 </div> <!-- Point size -->
9646 <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">
9647 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9648 <label for="ays-chart-option-series-point-shape">
9649 <?php echo esc_html(__( "Point shape", "chart-builder" )); ?>
9650 <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") ); ?>">
9651 <i class="ays_fa ays_fa_info_circle"></i>
9652 </a>
9653 </label>
9654 </div>
9655 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9656 <select
9657 id="ays-chart-option-series-point-shape-<?php echo esc_attr($key); ?>"
9658 class="ays-chart-option-series-point-shape <?php echo esc_attr($html_class_prefix) ?>option-select-input form-select"
9659 name="<?php echo esc_attr($html_name_prefix); ?>settings[series_point_shape][<?php echo esc_attr($key); ?>]"
9660 data-series-id="<?php echo esc_attr($key); ?>">
9661 >
9662 <?php
9663 $value = isset($series_point_shape[$key]) ? esc_attr($series_point_shape[$key]) : $point_shape;
9664 foreach ( $point_shape_options as $option_slug => $option ):
9665 $selected = ( $value === $option_slug ) ? 'selected' : '';
9666 ?>
9667 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
9668 <?php
9669 endforeach;
9670 ?>
9671 </select>
9672 </div>
9673 </div> <!-- Point shape -->
9674 </div>
9675 </div>
9676 </div>
9677 </fieldset>
9678 <?php
9679 endforeach;
9680 ?>
9681 </div>
9682 </div>
9683 <br>
9684 <blockquote>
9685 <?php echo esc_html(__( "Save the chart to update the data.", 'chart-builder' )); ?>
9686 <br>
9687 <?php echo sprintf(
9688 /* translators: %1$s: Opening <strong> tag, %2$s: Closing </strong> tag */
9689 esc_html(__( '%1$sNote:%2$s If you are not able to set the options, disable the row settings feature.', 'chart-builder' )),
9690 '<strong>',
9691 '</strong>'
9692 ); ?>
9693 </blockquote>
9694 </div>
9695 <?php
9696
9697 } else {
9698 ?>
9699 <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>
9700 <?php
9701 }
9702
9703 $content = ob_get_clean();
9704
9705 $title = __( 'Series settings', "chart-builder" );
9706
9707 $sources['series_settings'] = array(
9708 'content' => $content,
9709 'title' => $title
9710 );
9711
9712 return $sources;
9713 }
9714
9715 public function settings_contents_row_settings( $sources, $args ){
9716 $html_class_prefix = $args['html_class_prefix'];
9717 $html_name_prefix = $args['html_name_prefix'];
9718 $settings = $args['settings'];
9719 $source = $args['source'];
9720 $source = isset($source["commonTypeCharts"]) ? $source["commonTypeCharts"] : $source;
9721 $source_chart_type = $args['source_chart_type'];
9722
9723 if (isset($source) && !empty($source)) {
9724 if ( !isset( $source[0] ) ) {
9725 if (count($source[1]) > 2) {
9726 $titles = array();
9727 for ($i = 0; $i < count($source[1]); $i++) {
9728 array_push($titles, __("Title", 'chart-builder').$i);
9729 }
9730 $source[0] = $titles;
9731 } else {
9732 $source[0] = array(
9733 __("Country", 'chart-builder'),
9734 __("Population", 'chart-builder'),
9735 );
9736 }
9737
9738 ksort($source);
9739 }
9740 }
9741
9742 array_shift($source);
9743 $rows = array_column($source, 0);
9744
9745 $enable_row_settings = $settings['enable_row_settings'];
9746 $series_color = $settings['series_color'][0] ?? '#3366cc';
9747 $rows_color = $settings['rows_color'];
9748 $rows_opacity = $settings['rows_opacity'];
9749
9750 ob_start();
9751 ?>
9752 <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">
9753 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
9754 <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">
9755 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9756 <label for="ays-chart-option-enable-row-settings">
9757 <?php echo esc_html(__( "Enable row settings", "chart-builder" )); ?>
9758 <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") ); ?>">
9759 <i class="ays_fa ays_fa_info_circle"></i>
9760 </a>
9761 </label>
9762 </div>
9763 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9764 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
9765 <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); ?> >
9766 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
9767 </label>
9768 </div>
9769 </div> <!-- Enable row settings -->
9770 <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'; ?>">
9771 <br>
9772 <?php
9773 foreach ( $rows as $key => $val ):
9774 ?>
9775 <fieldset class="ays-rows-accordion-options-container <?php echo esc_attr($html_class_prefix) ?>options-rows-<?php echo esc_attr($key); ?>" data-collapsed="true">
9776 <legend class="ays-rows-accordion-options-header">
9777 <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">
9778 <g>
9779 <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" />
9780 </g>
9781 </svg>
9782 <span><?php echo esc_html($val); ?></span>
9783 </legend>
9784 <div class="ays-rows-accordion-options-content ays-rows-accordion-options-content">
9785 <div class="ays-rows-accordion-data-main-wrap">
9786 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
9787 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
9788 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9789 <label for="ays-chart-option-rows-color">
9790 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
9791 </label>
9792 </div>
9793 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9794 <input type="color"
9795 id="ays-chart-option-rows-color-<?php echo esc_attr($key); ?>"
9796 class="ays-chart-option-rows-color form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker"
9797 name="<?php echo esc_attr($html_name_prefix); ?>settings[rows_color][<?php echo esc_attr($key); ?>]"
9798 value="<?php echo isset($rows_color[$key]) && '' !== $rows_color[$key] ? esc_attr($rows_color[$key]) : esc_attr($series_color); ?>"
9799 data-rows-id="<?php echo esc_attr($key); ?>">
9800 </div>
9801 </div> <!-- color -->
9802 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
9803 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9804 <label for="ays-chart-option-rows-color">
9805 <?php echo esc_html(__( "Opacity", "chart-builder" )); ?>
9806 </label>
9807 </div>
9808 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9809 <input type="number"
9810 id="ays-chart-option-rows-opacity-<?php echo esc_attr($key); ?>"
9811 class="ays-chart-option-rows-opacity ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input"
9812 name="<?php echo esc_attr($html_name_prefix); ?>settings[rows_opacity][<?php echo esc_attr($key); ?>]"
9813 value="<?php echo isset($rows_opacity[$key]) && '' !== $rows_opacity[$key] ? esc_attr($rows_opacity[$key]) : 1.0; ?>"
9814 data-rows-id="<?php echo esc_attr($key); ?>"
9815 step=".1" min="0" max="1">
9816 </div>
9817 </div> <!-- opacity -->
9818 </div>
9819 </div>
9820 </div>
9821 </fieldset>
9822 <?php
9823 endforeach;
9824 ?>
9825 <br>
9826 <blockquote>
9827 <?php echo esc_html(__( "Save the chart to update the data.", 'chart-builder' )); ?>
9828 <br>
9829 <?php echo sprintf(
9830 /* translators: %1$s: Opening <strong> tag, %2$s: Closing </strong> tag */
9831 esc_html(__( '%1$sNote:%2$s The applied styles will work only if the chart has one column.', 'chart-builder' )),
9832 '<strong>',
9833 '</strong>'
9834 ); ?>
9835 </blockquote>
9836 </div>
9837 <div class="<?php echo esc_attr($html_class_prefix) ?>not-hidden-options-section <?php echo $enable_row_settings === 'checked' ? 'display_none' : ''; ?>">
9838 <br>
9839 <blockquote>
9840 <?php echo sprintf(
9841 /* translators: %1$s: Opening <strong> tag, %2$s: Closing </strong> tag */
9842 esc_html(__( '%1$sNote:%2$s If this option is disabled, the general options will be set from the series settings.', 'chart-builder' )),
9843 '<strong>',
9844 '</strong>'
9845 ); ?>
9846 </blockquote>
9847 </div>
9848 </div>
9849 </div>
9850 <?php
9851 $content = ob_get_clean();
9852
9853 $title = __( 'Row settings', "chart-builder" );
9854
9855 $sources['row_settings'] = array(
9856 'content' => $content,
9857 'title' => $title
9858 );
9859
9860 return $sources;
9861 }
9862
9863 public function ays_chart_disable_all_notice_from_plugin() {
9864 if (!function_exists('get_current_screen')) {
9865 return;
9866 }
9867
9868 $screen = get_current_screen();
9869
9870 if (empty($screen) || strpos($screen->id, $this->plugin_name) === false) {
9871 return;
9872 }
9873
9874 global $wp_filter;
9875
9876 // Keep plugin-specific notices
9877 $our_plugin_notices = array();
9878
9879 $exclude_functions = [
9880 'chart_builder_general_admin_notice',
9881 ];
9882
9883 if (!empty($wp_filter['admin_notices'])) {
9884 foreach ($wp_filter['admin_notices']->callbacks as $priority => $callbacks) {
9885 foreach ($callbacks as $key => $callback) {
9886 // For class-based methods
9887 if (
9888 is_array($callback['function']) &&
9889 is_object($callback['function'][0]) &&
9890 get_class($callback['function'][0]) === __CLASS__
9891 ) {
9892 $our_plugin_notices[$priority][$key] = $callback;
9893 }
9894 // For standalone functions
9895 elseif (
9896 is_string($callback['function']) &&
9897 in_array($callback['function'], $exclude_functions)
9898 ) {
9899 $our_plugin_notices[$priority][$key] = $callback;
9900 }
9901 }
9902 }
9903 }
9904
9905 // Remove all notices
9906 remove_all_actions('admin_notices');
9907 remove_all_actions('all_admin_notices');
9908
9909 // Re-add only your plugin's notices
9910 foreach ($our_plugin_notices as $priority => $callbacks) {
9911 foreach ($callbacks as $callback) {
9912 add_action('admin_notices', $callback['function'], $priority);
9913 }
9914 }
9915 }
9916
9917 }
9918