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

10,286 lines 722.9 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_footer_sale_banner_2026($ays_chart_builder_flag);
892 // $this->ays_chart_helloween_message($ays_chart_builder_flag);
893 // $this->ays_chart_christmas_message($ays_chart_builder_flag);
894 // $this->ays_chart_silver_bundle_message($ays_chart_builder_flag);
895 // $this->ays_chart_black_friday_message_2024($ays_chart_builder_flag);
896 // $this->ays_chart_christmas_message_2024($ays_chart_builder_flag);
897 // $this->ays_chart_new_halloween_bundle_message_2025($ays_chart_builder_flag);
898 // $this->ays_chart_black_friday_message($ays_chart_builder_flag);
899 // $this->ays_chart_christmas_banner_message_2025($ays_chart_builder_flag);
900 }
901 }
902 }
903 }
904 public function ays_chart_footer_sale_banner_2026($ishmar){
905 if($ishmar == 0 ){
906 $content = array();
907
908 $chart_cta_button_link = esc_url('https://ays-pro.com/wordpress/chart-builder?utm_source=dashboard&utm_medium=chart-builder-free&utm_campaign=private-offer-20-off-' . CHART_BUILDER_VERSION);
909
910 $content[] = '
911 <div class="ays-chart-footer-banner-bottom-banner-wrapper" style="display: none;">
912 <div class="ays-chart-footer-banner-bottom-banner-container">
913 <div class="ays-chart-footer-banner-bottom-banner-content">
914 <div class="ays-chart-footer-banner-bottom-banner-inner">
915 <div class="ays-chart-footer-banner-bottom-banner-left">
916 <div class="ays-chart-footer-banner-bottom-banner-icon">
917 <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
918 <path d="M12 7v14"></path>
919 <path d="M20 11v8a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2v-8"></path>
920 <path d="M7.5 7a1 1 0 0 1 0-5A4.8 8 0 0 1 12 7a4.8 8 0 0 1 4.5-5 1 1 0 0 1 0 5"></path>
921 <rect x="3" y="7" width="18" height="4" rx="1"></rect>
922 </svg>
923 </div>
924 <span class="ays-chart-footer-banner-bottom-banner-title">'. esc_html__('Chart Builder by AYS', 'ays-chart-builder') .'</span>
925 </div>
926 <span class="ays-chart-footer-banner-bottom-banner-separator"></span>
927 <span class="ays-chart-footer-banner-bottom-banner-discount">'. esc_html__('20% Off', 'ays-chart-builder') .'</span>
928 <div class="ays-chart-footer-banner-bottom-banner-code" onclick="aysChartFooterBannerCopyToClipboard()" title="'. esc_html__('Copy Coupon Code', 'ays-chart-builder') .'">
929 <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
930 <path d="M2 9a3 3 0 0 1 0 6v2a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-2a3 3 0 0 1 0-6V7a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2Z"></path>
931 <path d="M13 5v2"></path>
932 <path d="M13 17v2"></path>
933 <path d="M13 11v2"></path>
934 </svg>
935 <span>CHARTPRO20</span>
936 <button type="button" class="ays-chart-footer-banner-bottom-banner-copy" aria-label="'. esc_html__('Copy Coupon Code', 'ays-chart-builder') .'">
937 <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
938 <rect width="14" height="14" x="8" y="8" rx="2" ry="2"></rect>
939 <path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"></path>
940 </svg>
941 </button>
942 </div>
943 <button type="button" class="ays-chart-footer-banner-bottom-banner-cta">
944 '. esc_html__('Get Deal', 'ays-chart-builder') .'
945 </button>
946 <button type="button" class="ays-chart-footer-banner-bottom-banner-close" aria-label="'. esc_html__('Close popup', 'ays-chart-builder') .'">
947 <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
948 <path d="M18 6 6 18"></path>
949 <path d="m6 6 12 12"></path>
950 </svg>
951 </button>
952 </div>
953 </div>
954 </div>
955 </div>';
956
957 $content[] = '<style id="ays-chart-footer-banner-styles-inline-css">';
958
959 $content[] = '@keyframes ays-pro-slide-up{0%{opacity:0;transform:translateY(24px)}100%{opacity:1;transform:translateY(0)}}@keyframes ays-pro-slide-down{0%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(24px)}}.ays-chart-footer-banner-bottom-banner-wrapper{position:fixed;bottom:0;left:0;right:0;z-index:9999;padding:0 16px 28px;text-align:center;animation:.45s cubic-bezier(.16,1,.3,1) forwards ays-pro-slide-up}.ays-chart-footer-banner-bottom-banner-wrapper.ays-pro-banner-closing{animation:.32s cubic-bezier(.16,1,.3,1) forwards ays-pro-slide-down}.ays-chart-footer-banner-bottom-banner-container{display:inline-block;max-width:100%;border-radius:16px;background:linear-gradient(90deg,#2f6bff 0,#3e7bff 100%);box-shadow:0 20px 40px -15px rgba(47,107,255,.55),0 8px 20px -10px rgba(47,107,255,.35);overflow:hidden}.ays-chart-footer-banner-bottom-banner-code,.ays-chart-footer-banner-bottom-banner-content,.ays-chart-footer-banner-bottom-banner-inner,.ays-chart-footer-banner-bottom-banner-left{display:flex;align-items:center}.ays-chart-footer-banner-bottom-banner-inner{gap:16px;padding:8px 14px 8px 10px;color:#fff;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}.ays-chart-footer-banner-bottom-banner-left{gap:14px}.ays-chart-footer-banner-bottom-banner-icon{display:flex;align-items:center;justify-content:center;flex:0 0 auto;width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.15);color:#fff}.ays-chart-footer-banner-bottom-banner-icon svg{width:24px;height:24px}.ays-chart-footer-banner-bottom-banner-discount,.ays-chart-footer-banner-bottom-banner-title{font-size:17px;font-weight:600;line-height:1.25;letter-spacing:0;white-space:nowrap;color:#fff}.ays-chart-footer-banner-bottom-banner-separator{display:block;width:1px;height:24px;background:rgba(255,255,255,.4)}.ays-chart-footer-banner-bottom-banner-code{gap:6px;border:1px dashed rgba(255,255,255,.7);border-radius:999px;padding:6px 9px;color:#fff;cursor:pointer;transition:background-color .15s,border-color .15s;display:flex;align-items:center}.ays-chart-footer-banner-bottom-banner-code:hover{background:rgba(255,255,255,.1);border-color:#fff}.ays-chart-footer-banner-bottom-banner-code button svg,.ays-chart-footer-banner-bottom-banner-code>svg{width:16px;height:16px}.ays-chart-footer-banner-bottom-banner-code span{font-size:14px;font-weight:600;line-height:1;letter-spacing:.05em;color:#fff}.ays-chart-footer-banner-bottom-banner-close{display:flex;align-items:center;justify-content:center;margin:0;padding:0;background:none;border:none;color:#fff;cursor:pointer;transition:opacity .15s}.ays-chart-footer-banner-bottom-banner-close:hover{opacity:.8}.ays-chart-footer-banner-bottom-banner-copy{display:flex;align-items:center;justify-content:center;margin:0;padding:0;background:none;border:none;color:#fff;cursor:pointer;transition:opacity .15s}.ays-chart-footer-banner-bottom-banner-copy:hover{opacity:.8}.ays-chart-footer-banner-bottom-banner-cta{display:flex;align-items:center;justify-content:center;padding:8px 16px;background:#fff;color:#2f6bff;border:none;border-radius:6px;font-weight:600;font-size:14px;cursor:pointer;transition:all .15s;margin-left:12px}.ays-chart-footer-banner-bottom-banner-cta:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(47,107,255,.3)}';
960 $content[] = '</style>';
961
962 $content[] = '<style id="ays-chart-footer-banner-notification-css">';
963 $content[] = '.ays-chart-footer-banner-copy-notification{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:rgba(0,0,0,.9);color:#fff;padding:12px 24px;border-radius:8px;font-size:14px;z-index:10001;opacity:0;transition:opacity .3s ease;pointer-events:none}.ays-chart-footer-banner-copy-notification.show{opacity:1}';
964 $content[] = '</style>';
965
966 $content[] = '<script>';
967
968 $content[] = "
969 /**
970 * Footer Banner JavaScript - ES5 Compatible
971 * With delayed popup and visit tracking
972 */
973
974 (function() {
975 'use strict';
976
977 // Configuration
978 var STORAGE_KEY = 'ays_chart_footer_banner_data';
979 var POPUP_RULES = [
980 { visit: 1, delay: 10000 }, // 1st visit: 10 seconds
981 { visit: 2, delay: 10000 }, // 2nd visit: 10 seconds
982 { visit: 3, delay: 15000 }, // 3th visit: 15 seconds
983 { visit: 4, delay: 15000 }, // 4th visit: 15 seconds
984 { visit: 5, delay: 20000 }, // 5th visit: 20 seconds
985 { visit: 7, delay: 20000 }, // 7th visit: 20 seconds
986 { visit: 10, delay: 30000 } // 10th visit: 30 seconds
987 ];
988 var MAX_SHOWS_PER_DAY = 7;
989
990 // Wait for DOM to be ready
991 if (document.readyState === 'loading') {
992 document.addEventListener('DOMContentLoaded', initBanner);
993 } else {
994 initBanner();
995 }
996
997 function initBanner() {
998 var banner = document.querySelector('.ays-chart-footer-banner-bottom-banner-wrapper');
999 var closeButton = document.querySelector('.ays-chart-footer-banner-bottom-banner-close');
1000 var ctaButton = document.querySelector('.ays-chart-footer-banner-bottom-banner-cta');
1001
1002 if (!banner) {
1003 return;
1004 }
1005
1006 // Hide banner initially
1007 banner.style.display = 'none';
1008
1009 // Get or initialize banner data
1010 var bannerData = getBannerData();
1011
1012 // Check if we need to reset daily data
1013 if (shouldResetData(bannerData.lastResetDate)) {
1014 bannerData = resetDailyData();
1015 }
1016
1017 // Increment visit count
1018 bannerData.visitCount++;
1019 saveBannerData(bannerData);
1020
1021 // Check if banner should be shown
1022 var shouldShow = shouldShowBanner(bannerData);
1023
1024 if (shouldShow.show) {
1025 // Show banner after delay
1026 setTimeout(function() {
1027 banner.style.display = 'block';
1028
1029 // Increment show count
1030 bannerData.showCount++;
1031 saveBannerData(bannerData);
1032 }, shouldShow.delay);
1033 }
1034
1035 // Close button handler
1036 if (closeButton) {
1037 closeButton.addEventListener('click', function() {
1038 closeBanner(banner);
1039 });
1040 }
1041
1042 // CTA button handler
1043 if (ctaButton) {
1044 ctaButton.addEventListener('click', function() {
1045 window.open('https://ays-pro.com/wordpress/chart-builder?utm_source=dashboard&utm_medium=chart-builder-free&utm_campaign=private-offer-20-off-". CHART_BUILDER_VERSION ."', '_blank');
1046 // Optionally close banner after click
1047 closeBanner(banner);
1048 });
1049 }
1050 }
1051
1052 /**
1053 * Get banner data from localStorage
1054 */
1055 function getBannerData() {
1056 try {
1057 var data = localStorage.getItem(STORAGE_KEY);
1058 if (data) {
1059 return JSON.parse(data);
1060 }
1061 } catch (e) {
1062 // localStorage not available or parsing error
1063 }
1064
1065 // Return default data
1066 return {
1067 visitCount: 0,
1068 showCount: 0,
1069 lastResetDate: getTodayDate()
1070 };
1071 }
1072
1073 /**
1074 * Save banner data to localStorage
1075 */
1076 function saveBannerData(data) {
1077 try {
1078 localStorage.setItem(STORAGE_KEY, JSON.stringify(data));
1079 } catch (e) {
1080 // localStorage not available
1081 }
1082 }
1083
1084 /**
1085 * Check if data should be reset (new day)
1086 */
1087 function shouldResetData(lastResetDate) {
1088 var today = getTodayDate();
1089 return lastResetDate !== today;
1090 }
1091
1092 /**
1093 * Reset daily data
1094 */
1095 function resetDailyData() {
1096 var newData = {
1097 visitCount: 0,
1098 showCount: 0,
1099 lastResetDate: getTodayDate()
1100 };
1101 saveBannerData(newData);
1102 return newData;
1103 }
1104
1105 /**
1106 * Get today's date as string (YYYY-MM-DD)
1107 */
1108 function getTodayDate() {
1109 var date = new Date();
1110 var year = date.getFullYear();
1111 var month = String(date.getMonth() + 1).padStart(2, '0');
1112 var day = String(date.getDate()).padStart(2, '0');
1113 return year + '-' + month + '-' + day;
1114 }
1115
1116 /**
1117 * Check if banner should be shown based on rules
1118 */
1119 function shouldShowBanner(bannerData) {
1120 // Check if already shown max times today
1121 if (bannerData.showCount >= MAX_SHOWS_PER_DAY) {
1122 return { show: false, delay: 0 };
1123 }
1124
1125 // Check visit count against rules
1126 for (var i = 0; i < POPUP_RULES.length; i++) {
1127 var rule = POPUP_RULES[i];
1128 if (bannerData.visitCount === rule.visit) {
1129 return { show: true, delay: rule.delay };
1130 }
1131 }
1132
1133 return { show: false, delay: 0 };
1134 }
1135
1136 /**
1137 * Close banner with animation
1138 */
1139 function closeBanner(banner) {
1140 if (!banner) {
1141 return;
1142 }
1143
1144 // Add closing animation class
1145 banner.classList.add('ays-pro-banner-closing');
1146
1147 // Wait for animation to complete
1148 setTimeout(function() {
1149 banner.style.display = 'none';
1150 }, 400);
1151 }
1152
1153 // Polyfill for String.padStart (for older browsers)
1154 if (!String.prototype.padStart) {
1155 String.prototype.padStart = function(targetLength, padString) {
1156 targetLength = targetLength >> 0;
1157 padString = String(typeof padString !== 'undefined' ? padString : ' ');
1158 if (this.length >= targetLength) {
1159 return String(this);
1160 } else {
1161 targetLength = targetLength - this.length;
1162 if (targetLength > padString.length) {
1163 padString += padString.repeat(targetLength / padString.length);
1164 }
1165 return padString.slice(0, targetLength) + String(this);
1166 }
1167 };
1168 }
1169 })();
1170
1171 function aysChartFooterBannerCopyToClipboard() {
1172 var textarea = document.createElement('textarea');
1173 textarea.value = 'CHARTPRO20';
1174 textarea.style.position = 'fixed';
1175 textarea.style.opacity = '0';
1176 document.body.appendChild(textarea);
1177
1178 textarea.select();
1179 textarea.setSelectionRange(0, 99999);
1180
1181 try {
1182 document.execCommand('copy');
1183 aysChartFooterBannerShowCopyNotification('". esc_html__('Coupon code copied', 'ays-chart-builder') ."');
1184 } catch (err) {
1185 console.error('Failed to copy text: ', err);
1186 }
1187
1188 document.body.removeChild(textarea);
1189 }
1190
1191 function aysChartFooterBannerShowCopyNotification(message) {
1192 var existingNotification = document.querySelector('.ays-chart-footer-banner-copy-notification');
1193 if (existingNotification) {
1194 document.body.removeChild(existingNotification);
1195 }
1196
1197 var notification = document.createElement('div');
1198 notification.className = 'ays-chart-footer-banner-copy-notification';
1199 notification.textContent = message;
1200 document.body.appendChild(notification);
1201
1202 setTimeout(function() {
1203 notification.classList.add('show');
1204 }, 10);
1205
1206 setTimeout(function() {
1207 notification.classList.remove('show');
1208 setTimeout(function() {
1209 if (notification.parentNode) {
1210 document.body.removeChild(notification);
1211 }
1212 }, 300);
1213 }, 2000);
1214 }";
1215
1216 $content[] = '</script>';
1217
1218 $content = implode( '', $content );
1219 echo ($content);
1220 }
1221 }
1222 public function ays_chart_dismiss_button(){
1223
1224 $data = array(
1225 'status' => false,
1226 );
1227
1228 if (isset($_REQUEST['action']) && $_REQUEST['action'] == 'ays_chart_dismiss_button') {
1229 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' ) ) {
1230 update_option('ays_chart_sale_btn', 1);
1231 update_option('ays_chart_sale_date', current_time( 'mysql' ));
1232 $data['status'] = true;
1233 }
1234 }
1235
1236 ob_end_clean();
1237 $ob_get_clean = ob_get_clean();
1238 echo json_encode($data);
1239 wp_die();
1240
1241 }
1242
1243 public function ays_chart_discounted_licenses_banner_message(){
1244
1245 $content = array();
1246
1247 $date = time() + (int) ( get_option( 'gmt_offset' ) * HOUR_IN_SECONDS);
1248 $now_date = date('M d, Y H:i:s', $date);
1249
1250 $start_date = strtotime('2025-09-24');
1251 $end_date = strtotime('2025-10-25');
1252 $diff_end = $end_date - $date;
1253
1254 $style_attr = '';
1255 if( $diff_end < 0 ){
1256 $style_attr = 'style="display:none;"';
1257 }
1258
1259 $total_licenses = 50;
1260 $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);
1261 $days_passed = floor(($date - $start_date) / (24 * 60 * 60));
1262 $used_licenses = 0;
1263
1264 for ($i = 0; $i < min($days_passed, count($progression_pattern)); $i++) {
1265 $used_licenses += $progression_pattern[$i];
1266 }
1267 $used_licenses = min($used_licenses, $total_licenses);
1268 $remaining_licenses = $total_licenses - $used_licenses;
1269 $progress_percentage = ($used_licenses / $total_licenses) * 100;
1270
1271 $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);
1272
1273 $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 . '>';
1274 $content[] = '<div class="ays-chart-progress-banner-content">';
1275 $content[] = '<div class="ays-chart-progress-banner-left">';
1276 $content[] = '<div class="ays-chart-progress-banner-icon">';
1277 $content[] = '<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
1278 <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"/>
1279 <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"/>
1280 <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"/>
1281 <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"/>
1282 <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"/>
1283 <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"/>
1284 </svg>';
1285 $content[] = '</div>';
1286 $content[] = '<div class="ays-chart-progress-banner-text">';
1287 $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>';
1288 $content[] = '<p class="ays-chart-progress-banner-subtitle">' . __('Unlock advanced features + 30 day Money Back Guarantee', 'chart-builder') . '</p>';
1289 $content[] = '</div>';
1290 $content[] = '</div>';
1291
1292 $content[] = '<div class="ays-chart-progress-banner-center">';
1293 $content[] = '<div class="ays-chart-progress-banner-coupon">';
1294 $content[] = '<div class="ays-chart-progress-banner-coupon-box" onclick="chartCopyToClipboard(\'FREE2PRO20\')" title="' . __('Click to copy', 'chart-builder') . '">';
1295 $content[] = '<span class="ays-chart-progress-banner-coupon-text">FREE2PRO20</span>';
1296 $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">';
1297 $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"/>';
1298 $content[] = '</svg>';
1299 $content[] = '</div>';
1300 $content[] = '</div>';
1301
1302 $content[] = '<div class="ays-chart-progress-banner-progress">';
1303 $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>';
1304 $content[] = '<div class="ays-chart-progress-banner-progress-bar">';
1305 $content[] = '<div class="ays-chart-progress-banner-progress-fill" id="progress-fill" style="width: ' . $progress_percentage . '%;"></div>';
1306 $content[] = '</div>';
1307 $content[] = '</div>';
1308 $content[] = '</div>';
1309
1310 $content[] = '<div class="ays-chart-progress-banner-right">';
1311 $content[] = '<a href="'. $ays_chart_cta_button_link .'" class="ays-chart-progress-banner-upgrade" target="_blank">';
1312 $content[] = '<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">';
1313 $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"/>';
1314 $content[] = '</svg>';
1315 $content[] = ' ' . __('Upgrade Now', 'chart-builder');
1316 $content[] = '</a>';
1317 $content[] = '</div>';
1318 $content[] = '</div>';
1319
1320 if( current_user_can( 'manage_options' ) ){
1321 $content[] = '<div id="ays-chart-dismiss-buttons-content">';
1322 $content[] = '<form action="" method="POST" style="position: absolute; bottom: 0; right: 0; color: #fff;">';
1323 $content[] = '<button class="btn btn-link ays-button" name="ays_chart_sale_btn" style="color: darkgrey; font-size: 11px;">'. __( "Dismiss ad", 'chart-builder' ) .'</button>';
1324 $content[] = wp_nonce_field( CHART_BUILDER_NAME . '-sale-banner' , CHART_BUILDER_NAME . '-sale-banner' );
1325 $content[] = '</form>';
1326 $content[] = '</div>';
1327 }
1328 $content[] = '</div>';
1329
1330 // Fox LMS Pro Banner Styles
1331 $content[] = '<style id="ays-chart-progress-banner-styles-inline-css">';
1332 $content[] = '
1333 .ays-chart-progress-banner-main {
1334 background: linear-gradient(135deg, #6344ED 0%, #8C2ABE 100%);
1335 padding: 20px 30px;
1336 border-radius: 16px;
1337 color: white;
1338 position: relative;
1339 margin: 20px 0;
1340 box-shadow: 0 8px 32px rgba(99, 68, 237, 0.3);
1341 border: 0;
1342 }
1343
1344 .ays-chart-progress-banner-main .ays-chart-progress-banner-content {
1345 display: flex;
1346 align-items: center;
1347 justify-content: space-between;
1348 gap: 30px;
1349 }
1350
1351 .ays-chart-progress-banner-main .ays-chart-progress-banner-left {
1352 display: flex;
1353 align-items: center;
1354 gap: 20px;
1355 flex: 1;
1356 }
1357
1358 .ays-chart-progress-banner-main .ays-chart-progress-banner-center {
1359 display: flex;
1360 align-items: center;
1361 gap: 15px;
1362 flex: 1;
1363 }
1364
1365 .ays-chart-progress-banner-main .ays-chart-progress-banner-right {
1366 display: flex;
1367 align-items: center;
1368 gap: 20px;
1369 flex-shrink: 0;
1370 }
1371
1372 .ays-chart-progress-banner-main .ays-chart-progress-banner-icon {
1373 font-size: 32px;
1374 filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.2));
1375 }
1376
1377 .ays-chart-progress-banner-main .ays-chart-progress-banner-title {
1378 font-size: 21px;
1379 font-weight: 700;
1380 margin: 0 0 8px 0;
1381 line-height: 1.2;
1382 color: #fff;
1383 }
1384
1385 .ays-chart-progress-banner-main .ays-chart-progress-banner-title a {
1386 text-decoration: underline;
1387 color: #fff;
1388 }
1389
1390 .ays-chart-progress-banner-main .ays-chart-progress-banner-subtitle {
1391 font-size: 16px;
1392 margin: 0;
1393 opacity: 0.9;
1394 font-weight: 400;
1395 }
1396
1397 .ays-chart-progress-banner-main .ays-chart-progress-banner-coupon {
1398 margin-bottom: 5px;
1399 }
1400
1401 .ays-chart-progress-banner-main .ays-chart-progress-banner-coupon-box {
1402 border: 2px dotted rgba(255, 255, 255, 0.6);
1403 padding: 8px 16px;
1404 border-radius: 8px;
1405 background: rgba(255, 255, 255, 0.1);
1406 cursor: pointer;
1407 transition: all 0.3s ease;
1408 display: flex;
1409 align-items: center;
1410 gap: 8px;
1411 backdrop-filter: blur(10px);
1412 }
1413
1414 .ays-chart-progress-banner-main .ays-chart-progress-banner-coupon-box:hover {
1415 background: rgba(255, 255, 255, 0.2);
1416 border-color: rgba(255, 255, 255, 0.8);
1417 transform: translateY(-1px);
1418 }
1419
1420 .ays-chart-progress-banner-main .ays-chart-progress-banner-coupon-text {
1421 font-size: 16px;
1422 font-weight: 700;
1423 letter-spacing: 1px;
1424 color: #fff;
1425 font-family: monospace;
1426 }
1427
1428 .ays-chart-progress-banner-main .ays-chart-progress-banner-copy-icon {
1429 opacity: 0.8;
1430 transition: opacity 0.3s ease;
1431 }
1432
1433 .ays-chart-progress-banner-main .ays-chart-progress-banner-coupon-box:hover .ays-chart-progress-banner-copy-icon {
1434 opacity: 1;
1435 }
1436
1437 .ays-chart-progress-banner-main .ays-chart-progress-banner-progress {
1438 text-align: center;
1439 width: 100%;
1440 }
1441
1442 .ays-chart-progress-banner-main .ays-chart-progress-banner-progress-text {
1443 font-size: 14px;
1444 margin: 0 0 10px 0;
1445 opacity: 0.9;
1446 }
1447
1448 .ays-chart-progress-banner-main .ays-chart-progress-banner-progress-bar {
1449 width: 300px;
1450 height: 10px;
1451 background: rgba(255, 255, 255, 0.2);
1452 border-radius: 4px;
1453 overflow: hidden;
1454 margin: 0 auto;
1455 }
1456
1457 .ays-chart-progress-banner-main .ays-chart-progress-banner-progress-fill {
1458 height: 100%;
1459 background: linear-gradient(90deg, #4ADE80 0%, #22C55E 100%);
1460 border-radius: 4px;
1461 transition: width 0.8s ease;
1462 width: 70%;
1463 }
1464
1465 .ays-chart-progress-banner-main .ays-chart-progress-banner-upgrade {
1466 background: linear-gradient(135deg, #F59E0B 0%, #F97316 100%);
1467 color: white;
1468 border: none;
1469 padding: 12px 24px;
1470 border-radius: 8px;
1471 font-size: 16px;
1472 font-weight: 600;
1473 cursor: pointer;
1474 transition: all 0.3s ease;
1475 box-shadow: 0 4px 16px rgba(245, 158, 11, 0.4);
1476 text-decoration: none;
1477 display: inline-flex;
1478 align-items: center;
1479 gap: 8px;
1480 }
1481
1482 .ays-chart-progress-banner-main .ays-chart-progress-banner-upgrade:hover {
1483 transform: translateY(-2px);
1484 box-shadow: 0 6px 20px rgba(245, 158, 11, 0.6);
1485 text-decoration: none;
1486 color: white;
1487 }
1488
1489 .ays-chart-progress-banner-main .notice-dismiss:before {
1490 color: #fff;
1491 }
1492
1493 /* Copy notification */
1494 .ays-chart-copy-notification {
1495 position: fixed;
1496 top: 50%;
1497 left: 50%;
1498 transform: translate(-50%, -50%);
1499 background: rgba(0, 0, 0, 0.8);
1500 color: white;
1501 padding: 12px 24px;
1502 border-radius: 8px;
1503 font-size: 14px;
1504 z-index: 10000;
1505 opacity: 0;
1506 transition: opacity 0.3s ease;
1507 }
1508
1509 .ays-chart-copy-notification.show {
1510 opacity: 1;
1511 }
1512
1513 @media (max-width: 1400px) {
1514 .ays-chart-progress-banner-main .ays-chart-progress-banner-center {
1515 flex-direction: column;
1516 }
1517 }
1518
1519 @media (max-width: 1200px) {
1520 .ays-chart-progress-banner-main .ays-chart-progress-banner-content {
1521 flex-direction: column;
1522 gap: 20px;
1523 }
1524
1525 .ays-chart-progress-banner-main .ays-chart-progress-banner-left {
1526 width: 100%;
1527 justify-content: center;
1528 text-align: center;
1529 flex-direction: column;
1530 }
1531
1532 .ays-chart-progress-banner-main .ays-chart-progress-banner-center {
1533 width: 100%;
1534 }
1535
1536 .ays-chart-progress-banner-main .ays-chart-progress-banner-right {
1537 width: 100%;
1538 justify-content: center;
1539 }
1540 }
1541
1542 @media (max-width: 768px) {
1543 #ays-chart-progress-banner-main {
1544 display: none !important;
1545 }
1546
1547 .ays-chart-progress-banner-main {
1548 padding: 15px 20px;
1549 margin: 15px 0;
1550 }
1551
1552 .ays-chart-progress-banner-main .ays-chart-progress-banner-title {
1553 font-size: 18px;
1554 }
1555
1556 .ays-chart-progress-banner-main .ays-chart-progress-banner-subtitle {
1557 font-size: 14px;
1558 }
1559
1560 .ays-chart-progress-banner-main .ays-chart-progress-banner-progress-bar {
1561 width: 100%;
1562 max-width: 280px;
1563 }
1564
1565 .ays-chart-progress-banner-main .ays-chart-progress-banner-upgrade {
1566 padding: 10px 20px;
1567 font-size: 14px;
1568 }
1569 }
1570
1571 @media (max-width: 480px) {
1572 .ays-chart-progress-banner-main {
1573 padding: 12px 15px;
1574 }
1575
1576 .ays-chart-progress-banner-main .ays-chart-progress-banner-coupon-text {
1577 font-size: 14px;
1578 }
1579
1580 .ays-chart-progress-banner-main .ays-chart-progress-banner-progress-bar {
1581 max-width: 250px;
1582 }
1583 }
1584 ';
1585
1586 $content[] = '</style>';
1587
1588 $content = implode( '', $content );
1589 echo ($content);
1590 }
1591
1592 // 30% Sale Emma
1593 public function ays_chart_sale_message_30_emma($ishmar){
1594 if($ishmar == 0 ){
1595 $content = array();
1596 $content[] = '<div id="ays-chart-new-mega-bundle-dicount-month-main-2024" class="notice notice-success is-dismissible ays_chart_dicount_info">';
1597 $content[] = '<div id="ays-chart-dicount-month" class="ays_chart_dicount_month">';
1598
1599 $content[] = '<div class="ays-chart-discount-box-sale-image"></div>';
1600 $content[] = '<div class="ays-chart-dicount-wrap-box ays-chart-dicount-wrap-text-box">';
1601
1602 $content[] = '<div class="ays-chart-dicount-wrap-text-box-texts">';
1603 $content[] = '<div>
1604 <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;">
1605 <span class="ays-chart-new-mega-bundle-limited-text">Limited</span> Offer for Chart Builder </a> <br>
1606 </div>';
1607 $content[] = '</div>';
1608
1609 $content[] = '<div style="font-size: 17px;">';
1610 $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
1611 $content[] = '<span style="padding-left: 4px; font-size: 14px; font-weight: 600;"> 30 Day Money Back Guarantee</span>';
1612
1613 $content[] = '</div>';
1614
1615
1616
1617 $content[] = '<div style="position: absolute;right: 10px;bottom: 1px;" class="ays-chart-dismiss-buttons-container-for-chart">';
1618
1619 $content[] = '<form action="" method="POST">';
1620 $content[] = '<div id="ays-chart-dismiss-buttons-content">';
1621 if( current_user_can( 'manage_options' ) ){
1622 $content[] = '<button class="btn btn-link ays-button" name="ays_chart_sale_btn" style="height: 32px; margin-left: 0;padding-left: 0; color: #30499B;
1623 ">Dismiss ad</button>';
1624 $content[] = wp_nonce_field( $this->plugin_name . '-sale-banner' , $this->plugin_name . '-sale-banner' );
1625 }
1626 $content[] = '</div>';
1627 $content[] = '</form>';
1628
1629 $content[] = '</div>';
1630
1631 $content[] = '</div>';
1632
1633 $content[] = '<div class="ays-chart-dicount-wrap-box ays-chart-dicount-wrap-countdown-box">';
1634
1635 $content[] = '<div id="ays-chart-countdown-main-container">';
1636 $content[] = '<div class="ays-chart-countdown-container">';
1637
1638 $content[] = '<div id="ays-chart-countdown">';
1639
1640 $content[] = '<div style="font-weight: 500;">';
1641 $content[] = __( "Offer ends in:", "chart-builder" );
1642 $content[] = '</div>';
1643
1644 $content[] = '<ul>';
1645 $content[] = '<li><span id="ays-chart-countdown-days"></span>days</li>';
1646 $content[] = '<li><span id="ays-chart-countdown-hours"></span>Hours</li>';
1647 $content[] = '<li><span id="ays-chart-countdown-minutes"></span>Minutes</li>';
1648 $content[] = '<li><span id="ays-chart-countdown-seconds"></span>Seconds</li>';
1649 $content[] = '</ul>';
1650 $content[] = '</div>';
1651
1652 $content[] = '<div id="ays-chart-countdown-content" class="emoji">';
1653 $content[] = '<span>🚀</span>';
1654 $content[] = '<span>⌛</span>';
1655 $content[] = '<span>🔥</span>';
1656 $content[] = '<span>💣</span>';
1657 $content[] = '</div>';
1658
1659 $content[] = '</div>';
1660 $content[] = '</div>';
1661
1662 $content[] = '</div>';
1663
1664 $content[] = '<div class="ays-chart-dicount-wrap-box ays-chart-dicount-wrap-button-box">';
1665 $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>';
1666 $content[] = '<span >One-time payment</span>';
1667 $content[] = '</div>';
1668 $content[] = '</div>';
1669 $content[] = '</div>';
1670
1671 $content = implode( '', $content );
1672 echo wp_kses_post( html_entity_decode( $content, ENT_QUOTES, 'UTF-8' ) );
1673
1674 }
1675 }
1676
1677 // Self 20% sale
1678 public static function ays_chart_sale_message20($ishmar){
1679 if($ishmar == 0 ){
1680 $content = array();
1681
1682 $content[] = '<div id="ays-chart-dicount-month-main" class="notice notice-success is-dismissible ays_chart_dicount_info">';
1683 $content[] = '<div id="ays-chart-dicount-month" class="ays_chart_dicount_month">';
1684 // $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>';
1685
1686 $content[] = '<div class="ays-chart-dicount-wrap-box ays-chart-dicount-wrap-text-box">';
1687
1688 $content[] = '<div class="ays-chart-dicount-sale-name-discount-box">';
1689 $content[] = '<span class="ays-chart-new-chart-pro-title">';
1690 // Translators: %s is the URL to the Chart Builder plugin page.
1691 $content[] = sprintf(
1692 /* translators: %s is the Chart Builder plugin URL. */
1693 __(
1694 "<span><a href='%s' target='_blank' style='color:#ffffff; text-decoration: underline;'>Chart Builder</a></span>",
1695 'chart-builder'
1696 ),
1697 "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
1698 );
1699 $content[] = '</span>';
1700 $content[] = '<div>';
1701 $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
1702 $content[] = '</div>';
1703 $content[] = '</div>';
1704
1705 $content[] = '<span class="ays-chart-new-chart-pro-desc">';
1706 $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
1707 $content[] = esc_html__( "30 Days Money Back Guarantee", 'chart-builder' );
1708 $content[] = '</span>';
1709
1710 $content[] = '<div style="position: absolute;right: 10px;bottom: 1px;" class="ays-chart-dismiss-buttons-container-for-chart">';
1711 $content[] = '<form method="POST">';
1712 $content[] = '<div id="ays-chart-dismiss-buttons-content">';
1713 if (current_user_can( 'manage_options' )) {
1714 $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>';
1715 $content[] = wp_nonce_field( CHART_BUILDER_NAME . '-sale-banner' , CHART_BUILDER_NAME . '-sale-banner' );
1716 }
1717 $content[] = '</div>';
1718 $content[] = '</form>';
1719 $content[] = '</div>';
1720
1721 $content[] = '</div>';
1722
1723 $content[] = '<div class="ays-chart-dicount-wrap-box ays-chart-dicount-wrap-countdown-box">';
1724
1725 $content[] = '<div id="ays-chart-countdown-main-container">';
1726 $content[] = '<div class="ays-chart-countdown-container">';
1727 $content[] = '<div id="ays-chart-countdown" style="display: block;">';
1728 $content[] = esc_html__( "Offer ends in:", 'chart-builder' );
1729
1730 $content[] = '<ul style="padding: 0">';
1731 $content[] = '<li><span id="ays-chart-countdown-days">0</span>' . esc_html__( 'Days', 'chart-builder' ) . '</li>';
1732 $content[] = '<li><span id="ays-chart-countdown-hours">0</span>' . esc_html__( 'Hours', 'chart-builder' ) . '</li>';
1733 $content[] = '<li><span id="ays-chart-countdown-minutes">0</span>' . esc_html__( 'Minutes', 'chart-builder' ) . '</li>';
1734 $content[] = '<li><span id="ays-chart-countdown-seconds">0</span>' . esc_html__( 'Seconds', 'chart-builder' ) . '</li>';
1735 $content[] = '</ul>';
1736 $content[] = '</div>';
1737
1738 $content[] = '<div id="ays-chart-countdown-content" class="emoji" style="display: none;">';
1739 $content[] = '<span>🚀</span>';
1740 $content[] = '<span>⌛</span>';
1741 $content[] = '<span>🔥</span>';
1742 $content[] = '<span>💣</span>';
1743 $content[] = '</div>';
1744 $content[] = '</div>';
1745 $content[] = '</div>';
1746
1747 $content[] = '</div>';
1748
1749 $content[] = '<div class="ays-chart-dicount-wrap-box ays-chart-dicount-wrap-button-box">';
1750 $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>';
1751 $content[] = '<span class="ays-chart-dicount-one-time-text">';
1752 $content[] = esc_html__( "One-time payment", 'chart-builder' );
1753 $content[] = '</span>';
1754 $content[] = '</div>';
1755
1756 $content[] = '</div>';
1757
1758 $content[] = '</div>';
1759
1760 $content = implode( '', $content );
1761 echo wp_kses_post( html_entity_decode( $content, ENT_QUOTES, 'UTF-8' ) );
1762 }
1763 }
1764
1765 // Helloween banner
1766 public static function ays_chart_helloween_message($ishmar){
1767 if($ishmar == 0 ){
1768 $content = array();
1769
1770 $content[] = '<div id="ays-chart-dicount-month-main-helloween" class="notice notice-success is-dismissible ays_chart_dicount_info">';
1771 $content[] = '<div id="ays-chart-dicount-month-helloween" class="ays_chart_dicount_month_helloween">';
1772 $content[] = '<div class="ays-chart-dicount-wrap-box-helloween-limited">';
1773
1774 $content[] = '<p>';
1775 $content[] = __( "Limited Time
1776 <span class='ays-chart-dicount-wrap-color-helloween' style='color:#b2ff00;'>30%</span>
1777 <span>
1778 SALE on
1779 </span>
1780 <br>
1781 <span style='' class='ays-chart-helloween-bundle'>
1782 <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;'>
1783 Chart Builder
1784 </a>
1785 </span>", 'chart-builder' );
1786 $content[] = '</p>';
1787 $content[] = '<p>';
1788 $content[] = __( "Hurry up!
1789 <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;'>
1790 Check it out!
1791 </a>", 'chart-builder' );
1792 $content[] = '</p>';
1793
1794 $content[] = '</div>';
1795
1796
1797 $content[] = '<div class="ays-chart-helloween-bundle-buy-now-timer">';
1798 $content[] = '<div class="ays-chart-dicount-wrap-box-helloween-timer">';
1799 $content[] = '<div id="ays-chart-countdown-main-container" class="ays-chart-countdown-main-container-helloween">';
1800 $content[] = '<div class="ays-chart-countdown-container-helloween">';
1801 $content[] = '<div id="ays-chart-countdown">';
1802 $content[] = '<ul>';
1803 $content[] = '<li><p><span id="ays-chart-countdown-days"></span><span>days</span></p></li>';
1804 $content[] = '<li><p><span id="ays-chart-countdown-hours"></span><span>Hours</span></p></li>';
1805 $content[] = '<li><p><span id="ays-chart-countdown-minutes"></span><span>Mins</span></p></li>';
1806 $content[] = '<li><p><span id="ays-chart-countdown-seconds"></span><span>Secs</span></p></li>';
1807 $content[] = '</ul>';
1808 $content[] = '</div>';
1809
1810 $content[] = '<div id="ays-chart-countdown-content" class="emoji">';
1811 $content[] = '<span>🚀</span>';
1812 $content[] = '<span>⌛</span>';
1813 $content[] = '<span>🔥</span>';
1814 $content[] = '<span>💣</span>';
1815 $content[] = '</div>';
1816
1817 $content[] = '</div>';
1818
1819 $content[] = '</div>';
1820
1821 $content[] = '</div>';
1822 $content[] = '<div class="ays-chart-dicount-wrap-box ays-buy-now-button-box-helloween">';
1823 $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>';
1824 $content[] = '</div>';
1825 $content[] = '</div>';
1826
1827 $content[] = '</div>';
1828
1829 $content[] = '<div style="position: absolute;right: 0;bottom: 1px;" class="ays-chart-dismiss-buttons-container-for-form-helloween">';
1830 $content[] = '<form method="POST">';
1831 $content[] = '<div id="ays-chart-dismiss-buttons-content-helloween">';
1832 if( current_user_can( 'manage_options' ) ){
1833 $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>';
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 // $content[] = '<button type="button" class="notice-dismiss">';
1841 // $content[] = '</button>';
1842 $content[] = '</div>';
1843
1844 $content = implode( '', $content );
1845
1846 echo wp_kses_post( html_entity_decode( $content, ENT_QUOTES, 'UTF-8' ) );
1847 }
1848 }
1849
1850 // Christmas banner
1851 public static function ays_chart_christmas_message($ishmar){
1852 if($ishmar == 0 ){
1853 $content = array();
1854
1855 $content[] = '<div id="ays-chart-dicount-christmas-month-main" class="notice notice-success is-dismissible ays_chart_dicount_info">';
1856 $content[] = '<div id="ays-chart-dicount-christmas-month" class="ays_chart_dicount_month">';
1857 $content[] = '<div class="ays-chart-dicount-christmas-box">';
1858 $content[] = '<div class="ays-chart-dicount-christmas-wrap-box ays-chart-dicount-christmas-wrap-box-80">';
1859 $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>';
1860 $content[] = '<div class="ays-chart-dicount-christmas-title-row">' . __( 'Chart Builder Plugin', 'chart-builder' ) . '</div>';
1861 $content[] = '</div>';
1862
1863 $content[] = '<div class="ays-chart-dicount-christmas-wrap-box" style="width: 25%;">';
1864 $content[] = '<div id="ays-chart-countdown-main-container">';
1865 $content[] = '<div class="ays-chart-countdown-container">';
1866 $content[] = '<div id="ays-chart-countdown" style="display: block;">';
1867 $content[] = '<ul>';
1868 $content[] = '<li><span id="ays-chart-countdown-days"></span>' . __( 'Days', 'chart-builder' ) . '</li>';
1869 $content[] = '<li><span id="ays-chart-countdown-hours"></span>' . __( 'Hours', 'chart-builder' ) . '</li>';
1870 $content[] = '<li><span id="ays-chart-countdown-minutes"></span>' . __( 'Minutes', 'chart-builder' ) . '</li>';
1871 $content[] = '<li><span id="ays-chart-countdown-seconds"></span>' . __( 'Seconds', 'chart-builder' ) . '</li>';
1872 $content[] = '</ul>';
1873 $content[] = '</div>';
1874 $content[] = '<div id="ays-chart-countdown-content" class="emoji" style="display: none;">';
1875 $content[] = '<span>🚀</span>';
1876 $content[] = '<span>⌛</span>';
1877 $content[] = '<span>🔥</span>';
1878 $content[] = '<span>💣</span>';
1879 $content[] = '</div>';
1880 $content[] = '</div>';
1881 $content[] = '</div>';
1882 $content[] = '</div>';
1883
1884 $content[] = '<div class="ays-chart-dicount-christmas-wrap-box" style="width: 25%;">';
1885 $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>';
1886 $content[] = '</div>';
1887 $content[] = '</div>';
1888 $content[] = '</div>';
1889
1890 $content[] = '<div style="position: absolute;right: 0;bottom: 1px;" class="ays-chart-dismiss-buttons-container-for-form-christmas">';
1891 $content[] = '<form method="POST">';
1892 $content[] = '<div id="ays-chart-dismiss-buttons-content-christmas">';
1893 $content[] = '<button class="btn btn-link ays-button-christmas" name="ays_chart_sale_btn" style="">' . __( 'Dismiss ad', 'chart-builder' ) . '</button>';
1894 $content[] = '</div>';
1895 $content[] = '</form>';
1896 $content[] = '</div>';
1897 $content[] = '</div>';
1898
1899 $content = implode( '', $content );
1900
1901 echo wp_kses_post( html_entity_decode( $content, ENT_QUOTES, 'UTF-8' ) );
1902 }
1903 }
1904
1905 // Silver Bundle
1906 public function ays_chart_silver_bundle_message($ishmar){
1907 if($ishmar == 0 ){
1908 $content = array();
1909
1910 $content[] = '<div id="ays-chart-dicount-month-main" class="notice notice-success is-dismissible ays_chart_dicount_info">';
1911 $content[] = '<div id="ays-chart-dicount-month" class="ays_chart_dicount_month">';
1912 $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
1913
1914 $content[] = '<div class="ays-chart-dicount-wrap-box">';
1915
1916 $content[] = '<strong style="font-weight: bold;">';
1917 $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' );
1918 $content[] = '</strong>';
1919
1920 $content[] = '<br>';
1921
1922 $content[] = '<strong>';
1923 $content[] = __( "Hurry up! <a href='https://ays-pro.com/silver-bundle' target='_blank'>Check it out!</a>", 'chart-builder' );
1924 $content[] = '</strong>';
1925
1926 $content[] = '<div style="position: absolute;right: 10px;bottom: 1px;" class="ays-chart-dismiss-buttons-container-for-form">';
1927
1928 $content[] = '<form method="POST">';
1929 $content[] = '<div id="ays-chart-dismiss-buttons-content">';
1930 $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>';
1931 $content[] = '</div>';
1932 $content[] = '</form>';
1933
1934 $content[] = '</div>';
1935
1936 $content[] = '</div>';
1937
1938 $content[] = '<div class="ays-chart-dicount-wrap-box">';
1939
1940 $content[] = '<div id="ays-chart-countdown-main-container">';
1941 $content[] = '<div class="ays-chart-countdown-container">';
1942
1943 $content[] = '<div id="ays-chart-countdown">';
1944 $content[] = '<ul>';
1945 $content[] = '<li><span id="ays-chart-countdown-days"></span>days</li>';
1946 $content[] = '<li><span id="ays-chart-countdown-hours"></span>Hours</li>';
1947 $content[] = '<li><span id="ays-chart-countdown-minutes"></span>Minutes</li>';
1948 $content[] = '<li><span id="ays-chart-countdown-seconds"></span>Seconds</li>';
1949 $content[] = '</ul>';
1950 $content[] = '</div>';
1951
1952 $content[] = '<div id="ays-chart-countdown-content" class="emoji">';
1953 $content[] = '<span>🚀</span>';
1954 $content[] = '<span>⌛</span>';
1955 $content[] = '<span>🔥</span>';
1956 $content[] = '<span>💣</span>';
1957 $content[] = '</div>';
1958
1959 $content[] = '</div>';
1960 $content[] = '</div>';
1961
1962 $content[] = '</div>';
1963
1964 $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>';
1965 $content[] = '</div>';
1966 $content[] = '</div>';
1967
1968 $content = implode( '', $content );
1969 echo wp_kses_post( html_entity_decode( $content, ENT_QUOTES, 'UTF-8' ) );
1970 }
1971 }
1972
1973 //silver bundle
1974 public function ays_chart_new_silver_bundle_message_2025($ishmar){
1975 $content = array();
1976
1977 $date = time() + (int) ( get_option( 'gmt_offset' ) * HOUR_IN_SECONDS);
1978 $now_date = date('M d, Y H:i:s', $date);
1979
1980 $chart_banner_date = strtotime( $this->ays_chart_update_banner_time() );
1981
1982 $diff = $chart_banner_date - $date;
1983
1984 $style_attr = '';
1985 if( $diff < 0 ){
1986 $style_attr = 'style="display:none;"';
1987 }
1988
1989 $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 );
1990
1991 $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">';
1992 $content[] = '<div id="ays-chart-dicount-month" class="ays_chart_dicount_month">';
1993
1994 $content[] = '<div class="ays-chart-dicount-wrap-box ays-chart-dicount-wrap-text-box">';
1995 $content[] = '<div>';
1996 $content[] = '<div class="ays-chart-dicount-logo-box">';
1997 $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>';
1998
1999 $content[] = '<div>';
2000 $content[] = '<span class="ays-chart-new-silver-bundle-title">';
2001 $content[] = sprintf(
2002 /* translators: 1: opening link wrapper with <a> tag, 2: closing </a> tag */
2003 __( '%1$s Silver Bundle %2$s (Quiz + Form + Chart)', 'chart-builder' ),
2004 '<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;">',
2005 '</a></span>'
2006 );
2007 $content[] = '</span>';
2008 $content[] = '</br>';
2009 $content[] = '<span class="ays-chart-new-silver-bundle-desc">';
2010 $content[] = __( "30 Day Money Back Guarantee", 'chart-builder' );
2011 $content[] = '</span>';
2012 $content[] = '</div>';
2013
2014 $content[] = '<div class="ays-chart-new-silver-bundle-title-icon-row" style="display: inline-block;">';
2015 $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;">';
2016 $content[] = '</div>';
2017
2018 $content[] = '</div>';
2019
2020 $content[] = '<div class="ays-chart-new-silver-bundle-mobile-image-display-block display_none">';
2021 $content[] = '<img src="' . CHART_BUILDER_ADMIN_URL . '/images/ays-chart-banner-50.svg" style="width: 70px;">';
2022 $content[] = '</div>';
2023 $content[] = '</div>';
2024
2025 $content[] = '<div style="position: absolute;right: 10px;bottom: 1px;" class="ays-chart-dismiss-buttons-container-for-form">';
2026
2027 $content[] = '<form action="" method="POST">';
2028 $content[] = '<div id="ays-chart-dismiss-buttons-content">';
2029 if( current_user_can( 'manage_options' ) ){
2030 $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>';
2031 $content[] = wp_nonce_field( CHART_BUILDER_NAME . '-sale-banner' , CHART_BUILDER_NAME . '-sale-banner' );
2032 }
2033 $content[] = '</div>';
2034 $content[] = '</form>';
2035
2036 $content[] = '</div>';
2037
2038 $content[] = '</div>';
2039
2040 $content[] = '<div class="ays-chart-dicount-wrap-box ays-chart-dicount-wrap-countdown-box">';
2041
2042 $content[] = '<div id="ays-chart-maker-countdown-main-container">';
2043 $content[] = '<div class="ays-chart-maker-countdown-container">';
2044
2045 $content[] = '<div ' . $style_attr . ' id="ays-chart-countdown">';
2046
2047 $content[] = '<ul>';
2048
2049 $content[] = '<li><span id="ays-chart-countdown-days"></span></li>';
2050 $content[] = '<li><span id="ays-chart-countdown-hours"></span></li>';
2051 $content[] = '<li><span id="ays-chart-countdown-minutes"></span></li>';
2052 $content[] = '<li><span id="ays-chart-countdown-seconds"></span></li>';
2053 $content[] = '</ul>';
2054 $content[] = '</div>';
2055
2056 $content[] = '<div id="ays-chart-countdown-content" class="emoji">';
2057 $content[] = '</div>';
2058
2059 $content[] = '</div>';
2060 $content[] = '</div>';
2061
2062 $content[] = '</div>';
2063
2064 $content[] = '<div class="ays-chart-dicount-wrap-box ays-chart-dicount-wrap-button-box">';
2065 $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>';
2066 $content[] = '<span class="ays-chart-dicount-one-time-text">';
2067 $content[] = __( "One-time payment", 'chart-builder' );
2068 $content[] = '</span>';
2069 $content[] = '</div>';
2070 $content[] = '</div>';
2071 $content[] = '</div>';
2072
2073 // /* New Mega Bundle Banner Quiz | Start */
2074 $content[] = '<style id="ays-chart-mega-bundle-styles-inline-css">';
2075 $content[] = '
2076 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%}}';
2077 $content[] = '</style>';
2078 // /* New Mega Bundle Banner Quiz | End */
2079
2080 $content = implode( '', $content );
2081 echo ($content);
2082 }
2083
2084 // Christmas Top Banner 2024
2085 public function ays_chart_christmas_message_2024($ishmar){
2086 if($ishmar == 0 ){
2087 $content = array();
2088
2089 $content[] = '<div id="ays-chart-christmas-top-bundle-dicount-month-main" class="notice notice-success is-dismissible ays_chart_dicount_info">';
2090 $content[] = '<div id="ays-chart-dicount-month" class="ays_chart_dicount_month">';
2091
2092 $content[] = '<div class="ays-chart-dicount-wrap-box ays-chart-dicount-wrap-countdown-box">';
2093
2094 $content[] = '<div id="ays-chart-countdown-main-container">';
2095 $content[] = '<div class="ays-chart-countdown-container">';
2096
2097 $content[] = '<div id="ays-chart-countdown">';
2098
2099 $content[] = '<div>';
2100 $content[] = __( "Offer ends in:", 'chart-builder' );
2101 $content[] = '</div>';
2102
2103 $content[] = '<ul style="padding-left: 0;">';
2104 $content[] = '<li><span id="ays-chart-countdown-days"></span>'. __( "Days", 'chart-builder' ) .'</li>';
2105 $content[] = '<li><span id="ays-chart-countdown-hours"></span>'. __( "Hours", 'chart-builder' ) .'</li>';
2106 $content[] = '<li><span id="ays-chart-countdown-minutes"></span>'. __( "Minutes", 'chart-builder' ) .'</li>';
2107 $content[] = '<li><span id="ays-chart-countdown-seconds"></span>'. __( "Seconds", 'chart-builder' ) .'</li>';
2108 $content[] = '</ul>';
2109 $content[] = '</div>';
2110
2111 $content[] = '<div id="ays-chart-countdown-content" class="emoji">';
2112 $content[] = '<span>🚀</span>';
2113 $content[] = '<span>⌛</span>';
2114 $content[] = '<span>🔥</span>';
2115 $content[] = '<span>💣</span>';
2116 $content[] = '</div>';
2117
2118 $content[] = '</div>';
2119 $content[] = '</div>';
2120
2121 $content[] = '</div>';
2122
2123 $content[] = '<div class="ays-chart-dicount-wrap-box ays-chart-dicount-wrap-text-box">';
2124 $content[] = '<div>';
2125
2126 $content[] = '<span class="ays-chart-christmas-top-bundle-title">';
2127 $content[] = sprintf(
2128 /* translators: %s is the Chart Builder plugin URL with version parameter. */
2129 __(
2130 "<span><a href='%s' class='ays-chart-christmas-top-bundle-title-link' target='_blank'>Christmas Sale</a></span>",
2131 'chart-builder'
2132 ),
2133 "https://ays-pro.com/wordpress/chart-builder?utm_source=dashboard&utm_medium=chart-free&utm_campaign=christmas-sale-banner" . CHART_BUILDER_VERSION
2134 );
2135 $content[] = '</span>';
2136
2137 $content[] = '</br>';
2138
2139 $content[] = '<span class="ays-chart-christmas-top-bundle-desc">';
2140 $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">';
2141 $content[] = __( "20% Extra OFF", 'chart-builder' );
2142 $content[] = '</a>';
2143 $content[] = '</span>';
2144 $content[] = '</div>';
2145
2146 $content[] = '<div style="position: absolute;right: 10px;bottom: 1px;" class="ays-chart-dismiss-buttons-container-for-form">';
2147
2148 $content[] = '<form action="" method="POST">';
2149 $content[] = '<div id="ays-chart-dismiss-buttons-content">';
2150 if( current_user_can( 'manage_options' ) ){
2151 $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>';
2152 $content[] = wp_nonce_field( CHART_BUILDER_NAME . '-sale-banner' , CHART_BUILDER_NAME . '-sale-banner' );
2153 }
2154 $content[] = '</div>';
2155 $content[] = '</form>';
2156
2157 $content[] = '</div>';
2158
2159 $content[] = '</div>';
2160
2161 $content[] = '<div class="ays-chart-dicount-wrap-box ays-chart-christmas-top-bundle-coupon-text-box">';
2162 $content[] = '<div class="ays-chart-christmas-top-bundle-coupon-row">';
2163 $content[] = 'xmas20off';
2164 $content[] = '</div>';
2165 $content[] = '<div class="ays-chart-christmas-top-bundle-text-row">';
2166 $content[] = __( '20% Extra Discount Coupon', 'chart-builder' );
2167 $content[] = '</div>';
2168 $content[] = '</div>';
2169
2170 $content[] = '<div class="ays-chart-dicount-wrap-box ays-chart-dicount-wrap-button-box">';
2171 $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>';
2172 $content[] = '<span class="ays-chart-dicount-one-time-text">';
2173 $content[] = __( "One-time payment", 'chart-builder' );
2174 $content[] = '</span>';
2175 $content[] = '</div>';
2176 $content[] = '</div>';
2177 $content[] = '</div>';
2178
2179 $content = implode( '', $content );
2180 echo wp_kses_post( html_entity_decode( $content, ENT_QUOTES, 'UTF-8' ) );
2181 }
2182 }
2183
2184 // Halloween Bundle 2025
2185 public function ays_chart_new_halloween_bundle_message_2025($ishmar){
2186 if($ishmar == 0 ){
2187 $content = array();
2188
2189 $date = time() + (int) ( get_option( 'gmt_offset' ) * HOUR_IN_SECONDS);
2190 $now_date = date('M d, Y H:i:s', $date);
2191
2192 $start_date = strtotime('2025-09-08');
2193 $end_date = strtotime('2025-10-31');
2194 $diff_end = $end_date - $date;
2195
2196 $style_attr = '';
2197 if( $diff_end < 0 ){
2198 $style_attr = 'style="display:none;"';
2199 }
2200
2201 $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);
2202
2203 $content[] = '
2204 <div id="ays-chart-halloween-banner-2025-main" class="ays-chart-halloween-banner-2025-main ays_chart_dicount_info notice notice-success is-dismissible">
2205 <div class="ays-chart-halloween-banner-2025-content">
2206 <div class="ays-chart-halloween-banner-2025-left">
2207 <div class="ays-chart-halloween-banner-2025-text">
2208 <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>
2209 <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>
2210 </div>
2211 </div>
2212
2213 <div class="ays-chart-halloween-banner-2025-center">';
2214
2215 $content[] = '<div id="ays-chart-halloween-banner-2025-countdown" class="ays-chart-halloween-banner-2025-countdown" ' . $style_attr . '>';
2216 $content[] = '<div class="ays-chart-halloween-banner-2025-countdown-timer">';
2217 $content[] = '<div class="ays-chart-halloween-banner-2025-countdown-item">';
2218 $content[] = '<div class="ays-chart-halloween-banner-2025-countdown-value" id="ays-chart-halloween-banner-2025-days">00</div>';
2219 $content[] = '<div class="ays-chart-halloween-banner-2025-countdown-label">' . __('days', 'chart-builder') . '</div>';
2220 $content[] = '</div>';
2221 $content[] = '<div class="ays-chart-halloween-banner-2025-countdown-separator">:</div>';
2222 $content[] = '<div class="ays-chart-halloween-banner-2025-countdown-item">';
2223 $content[] = '<div class="ays-chart-halloween-banner-2025-countdown-value" id="ays-chart-halloween-banner-2025-hours">00</div>';
2224 $content[] = '<div class="ays-chart-halloween-banner-2025-countdown-label">' . __('hours', 'chart-builder') . '</div>';
2225 $content[] = '</div>';
2226 $content[] = '<div class="ays-chart-halloween-banner-2025-countdown-separator">:</div>';
2227 $content[] = '<div class="ays-chart-halloween-banner-2025-countdown-item">';
2228 $content[] = '<div class="ays-chart-halloween-banner-2025-countdown-value" id="ays-chart-halloween-banner-2025-minutes">00</div>';
2229 $content[] = '<div class="ays-chart-halloween-banner-2025-countdown-label">' . __('minutes', 'chart-builder') . '</div>';
2230 $content[] = '</div>';
2231 $content[] = '<div class="ays-chart-halloween-banner-2025-countdown-separator">:</div>';
2232 $content[] = '<div class="ays-chart-halloween-banner-2025-countdown-item">';
2233 $content[] = '<div class="ays-chart-halloween-banner-2025-countdown-value" id="ays-chart-halloween-banner-2025-seconds">00</div>';
2234 $content[] = '<div class="ays-chart-halloween-banner-2025-countdown-label">' . __('seconds', 'chart-builder') . '</div>';
2235 $content[] = '</div>';
2236 $content[] = '</div>';
2237 $content[] = '</div>';
2238
2239 $content[] = '</div>
2240
2241 <div class="ays-chart-halloween-banner-2025-right">
2242 <div class="ays-chart-halloween-banner-2025-pumpkin">
2243 <svg width="36" height="36" viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
2244 <g clip-path="url(#clip0_177_40)">
2245 <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"/>
2246 <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"/>
2247 <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"/>
2248 </g>
2249 <defs>
2250 <clipPath id="clip0_177_40">
2251 <rect width="36" height="36" fill="white"/>
2252 </clipPath>
2253 </defs>
2254 </svg>
2255 </div>
2256
2257
2258
2259 <div class="ays-chart-halloween-banner-2025-discount-section">
2260 <div class="ays-chart-halloween-banner-2025-discount">25% OFF</div>
2261 <div class="ays-chart-halloween-banner-2025-coupon-wrapper">
2262 <div class="ays-chart-halloween-banner-2025-coupon-box" onclick="aysChartHalloweenCopyToClipboard(\'HALLOWEEN25\')" title="Click to copy">
2263 <span class="ays-chart-halloween-banner-2025-coupon-text">HALLOWEEN25</span>
2264 <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">
2265 <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"/>
2266 </svg>
2267 </div>
2268 </div>
2269 <a href="'. $ays_chart_cta_button_link .'" class="ays-chart-halloween-banner-2025-upgrade" target="_blank">Upgrade Now</a>
2270 </div>';
2271
2272 if( current_user_can( 'manage_options' ) ){
2273 $content[] = '<div id="ays-chart-dismiss-buttons-content">';
2274 $content[] = '<form action="" method="POST" style="position: absolute; bottom: -5px; right: 0; color: #fff;">';
2275 $content[] = '<button class="btn btn-link ays-button" name="ays_chart_sale_btn" style="color: darkgrey; font-size: 11px;">'. __( "Dismiss ad", 'chart-builder' ) .'</button>';
2276 $content[] = wp_nonce_field( CHART_BUILDER_NAME . '-sale-banner' , CHART_BUILDER_NAME . '-sale-banner' );
2277 $content[] = '</form>';
2278 $content[] = '</div>';
2279 }
2280
2281 $content[] = '
2282 </div>
2283 </div>
2284 </div>';
2285
2286 $content[] = '<style id="ays-chart-progress-banner-styles-inline-css">';
2287 $content[] = '
2288 .ays-chart-halloween-banner-2025-main {
2289 background: linear-gradient(135deg, #1A0F2E 100%, #2D1B4E 0%);
2290 background-image: url("' . esc_attr( CHART_BUILDER_ADMIN_URL ) . '/images/halloween-banner-background-image-remove.png"), linear-gradient(135deg, #2D1B4E 0%, #1A0F2E 100%);
2291 background-position: left center, center;
2292 background-repeat: no-repeat, no-repeat;
2293 background-size: auto 100%, cover;
2294 padding: 20px 30px 20px 130px;
2295 border-radius: 12px;
2296 color: white;
2297 margin: 20px 0;
2298 border: 0;
2299 box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
2300 overflow: hidden;
2301 }
2302
2303 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-content {
2304 display: flex;
2305 align-items: center;
2306 justify-content: space-between;
2307 gap: 30px;
2308 }
2309
2310 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-left {
2311 display: flex;
2312 align-items: center;
2313 gap: 20px;
2314 }
2315
2316 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-center {
2317 display: flex;
2318 align-items: center;
2319 justify-content: center;
2320 flex: 1;
2321 max-width: 350px;
2322 }
2323
2324 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-right {
2325 display: flex;
2326 align-items: center;
2327 gap: 15px;
2328 flex-shrink: 0;
2329 }
2330
2331 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-icon {
2332 flex-shrink: 0;
2333 }
2334
2335 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-pumpkin svg {
2336 display: inline !important;
2337 border: none !important;
2338 box-shadow: none !important;
2339 height: 1em !important;
2340 width: 1em !important;
2341 margin: 0 0.07em !important;
2342 vertical-align: -0.1em !important;
2343 background: none !important;
2344 padding: 0 !important;
2345 }
2346
2347 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-orb {
2348 width: 80px;
2349 height: 80px;
2350 background: linear-gradient(135deg, #8B5CF6 0%, #6D28D9 100%);
2351 border-radius: 50%;
2352 display: flex;
2353 align-items: center;
2354 justify-content: center;
2355 box-shadow: 0 0 30px rgba(139, 92, 246, 0.6);
2356 border: 3px solid rgba(168, 85, 247, 0.4);
2357 }
2358
2359 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-question {
2360 font-size: 48px;
2361 font-weight: 700;
2362 color: #E9D5FF;
2363 }
2364
2365 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-bat {
2366 font-size: 20px;
2367 opacity: 0.8;
2368 }
2369
2370 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-bat-1 {
2371 margin-left: -100px;
2372 margin-top: -40px;
2373 }
2374
2375 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-bat-2 {
2376 margin-left: -110px;
2377 margin-top: 35px;
2378 }
2379
2380 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-sparkle {
2381 font-size: 12px;
2382 opacity: 0.7;
2383 }
2384
2385 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-sparkle-1 {
2386 margin-left: -95px;
2387 margin-top: -60px;
2388 }
2389
2390 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-sparkle-2 {
2391 margin-left: -70px;
2392 margin-top: -15px;
2393 }
2394
2395 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-sparkle-3 {
2396 margin-left: -120px;
2397 margin-top: 10px;
2398 }
2399
2400 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-text {
2401 flex: 1;
2402 }
2403
2404 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-title {
2405 font-size: 24px;
2406 font-weight: 700;
2407 margin: 0 0 8px 0;
2408 line-height: 1.2;
2409 color: #fff;
2410 text-transform: uppercase;
2411 letter-spacing: 1px;
2412 }
2413
2414 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-title a {
2415 color: #FB923C;
2416 text-decoration: underline;
2417 }
2418
2419 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-subtitle {
2420 font-size: 16px;
2421 margin: 0;
2422 opacity: 0.9;
2423 font-weight: 400;
2424 color: #E9D5FF;
2425 }
2426
2427 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-description {
2428 font-size: 14px;
2429 margin: 0;
2430 opacity: 0.85;
2431 line-height: 1.5;
2432 color: #D8B4FE;
2433 }
2434
2435 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-pumpkin {
2436 font-size: 64px;
2437 filter: drop-shadow(0 0 20px rgba(251, 146, 60, 0.8));
2438 flex-shrink: 0;
2439 }
2440
2441 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-discount-section {
2442 display: flex;
2443 flex-direction: column;
2444 align-items: center;
2445 gap: 10px;
2446 }
2447
2448 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-discount {
2449 font-size: 36px;
2450 font-weight: 700;
2451 color: #FB923C;
2452 text-shadow: 0 0 20px rgba(251, 146, 60, 0.6);
2453 margin: 0;
2454 line-height: 1;
2455 }
2456
2457 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-coupon-wrapper {
2458 margin-bottom: 5px;
2459 }
2460
2461 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-coupon-box {
2462 border: 2px dashed rgba(255, 255, 255, 0.4);
2463 padding: 6px 12px;
2464 border-radius: 6px;
2465 background: rgba(255, 255, 255, 0.1);
2466 cursor: pointer;
2467 transition: all 0.3s ease;
2468 display: flex;
2469 align-items: center;
2470 gap: 6px;
2471 backdrop-filter: blur(10px);
2472 }
2473
2474 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-coupon-box:hover {
2475 background: rgba(255, 255, 255, 0.2);
2476 border-color: rgba(255, 255, 255, 0.6);
2477 transform: translateY(-1px);
2478 }
2479
2480 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-coupon-text {
2481 font-size: 14px;
2482 font-weight: 700;
2483 letter-spacing: 1px;
2484 color: #fff;
2485 font-family: monospace;
2486 }
2487
2488 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-copy-icon {
2489 opacity: 0.8;
2490 transition: opacity 0.3s ease;
2491 }
2492
2493 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-coupon-box:hover .ays-chart-halloween-banner-2025-copy-icon {
2494 opacity: 1;
2495 }
2496
2497 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-upgrade {
2498 background: linear-gradient(135deg, #FB923C 0%, #F97316 100%);
2499 color: white;
2500 border: none;
2501 padding: 12px 28px;
2502 border-radius: 8px;
2503 font-size: 16px;
2504 font-weight: 600;
2505 cursor: pointer;
2506 transition: all 0.3s ease;
2507 box-shadow: 0 4px 16px rgba(251, 146, 60, 0.5);
2508 text-decoration: none;
2509 display: inline-flex;
2510 align-items: center;
2511 text-align: center;
2512 }
2513
2514 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-upgrade:hover {
2515 transform: translateY(-2px);
2516 box-shadow: 0 6px 20px rgba(251, 146, 60, 0.7);
2517 text-decoration: none;
2518 color: white;
2519 }
2520
2521 .ays-chart-halloween-banner-2025-main .notice-dismiss:before {
2522 color: #fff;
2523 }
2524
2525 .ays-chart-halloween-banner-2025-copy-notification {
2526 position: fixed;
2527 top: 50%;
2528 left: 50%;
2529 transform: translate(-50%, -50%);
2530 background: rgba(0, 0, 0, 0.8);
2531 color: white;
2532 padding: 12px 24px;
2533 border-radius: 8px;
2534 font-size: 14px;
2535 z-index: 10000;
2536 opacity: 0;
2537 transition: opacity 0.3s ease;
2538 }
2539
2540 .ays-chart-halloween-banner-2025-copy-notification.show {
2541 opacity: 1;
2542 }
2543
2544 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-countdown-timer {
2545 display: flex;
2546 align-items: center;
2547 justify-content: center;
2548 gap: 8px;
2549 }
2550
2551 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-countdown-item {
2552 background: rgba(255, 255, 255, 0.15);
2553 border-radius: 8px;
2554 padding: 8px 12px;
2555 min-width: 60px;
2556 backdrop-filter: blur(10px);
2557 }
2558
2559 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-countdown-value {
2560 font-size: 24px;
2561 font-weight: 700;
2562 line-height: 1;
2563 margin-bottom: 4px;
2564 color: #fff;
2565 text-align: center;
2566 }
2567
2568 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-countdown-label {
2569 font-size: 11px;
2570 opacity: 0.8;
2571 text-transform: lowercase;
2572 text-align: center;
2573 }
2574
2575 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-countdown-separator {
2576 font-size: 24px;
2577 font-weight: 700;
2578 opacity: 0.6;
2579 margin: 0 4px;
2580 }
2581
2582 @media (min-width: 1200px) {
2583 .ays-chart-halloween-banner-2025-main .wp-core-ui .notice.is-dismissible {
2584 padding-right: 60px;
2585 }
2586 }
2587
2588 @media (max-width: 1200px) {
2589
2590 div.ays-chart-halloween-banner-2025-main {
2591 padding: 20px 30px;
2592 }
2593
2594 div.ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-pumpkin {
2595 display: none;
2596 }
2597
2598 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-subtitle,
2599 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-title {
2600 text-align: center;
2601 }
2602
2603 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-content {
2604 flex-wrap: wrap;
2605 gap: 20px;
2606 }
2607
2608 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-left {
2609 width: 100%;
2610 }
2611
2612 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-center {
2613 width: 100%;
2614 max-width: 100%;
2615 text-align: center;
2616 }
2617
2618 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-right {
2619 width: 100%;
2620 justify-content: center;
2621 }
2622 }
2623
2624 @media (max-width: 786px) {
2625 #ays-chart-halloween-banner-2025-main {
2626 display: none !important;
2627 }
2628 }
2629
2630 @media (max-width: 768px) {
2631 .ays-chart-halloween-banner-2025-main {
2632 padding: 15px 20px;
2633 margin: 15px 0;
2634 }
2635
2636 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-title {
2637 font-size: 20px;
2638 }
2639
2640 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-subtitle {
2641 font-size: 14px;
2642 }
2643
2644 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-description {
2645 font-size: 13px;
2646 }
2647
2648 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-pumpkin {
2649 font-size: 48px;
2650 }
2651
2652 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-discount {
2653 font-size: 28px;
2654 }
2655
2656 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-upgrade {
2657 padding: 10px 20px;
2658 font-size: 14px;
2659 }
2660 }
2661
2662 @media (max-width: 480px) {
2663 .ays-chart-halloween-banner-2025-main {
2664 padding: 12px 15px;
2665 }
2666
2667 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-orb {
2668 width: 60px;
2669 height: 60px;
2670 }
2671
2672 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-question {
2673 font-size: 36px;
2674 }
2675
2676 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-title {
2677 font-size: 18px;
2678 }
2679
2680 .ays-chart-halloween-banner-2025-main .ays-chart-halloween-banner-2025-coupon-text {
2681 font-size: 12px;
2682 }
2683 }
2684 ';
2685
2686 $content[] = '</style>';
2687
2688 $content[] = '<script>';
2689 $content[] = "
2690 function aysChartHalloweenCopyToClipboard(text) {
2691 // Create a temporary textarea element
2692 var textarea = document.createElement('textarea');
2693 textarea.value = text;
2694 textarea.style.position = 'fixed';
2695 textarea.style.opacity = '0';
2696 document.body.appendChild(textarea);
2697
2698 // Select and copy the text
2699 textarea.select();
2700 textarea.setSelectionRange(0, 99999); // For mobile devices
2701
2702 try {
2703 document.execCommand('copy');
2704 aysChartHalloweenShowCopyNotification('Coupon code copied!');
2705 } catch (err) {
2706 console.error('Failed to copy text: ', err);
2707 }
2708
2709 // Remove the temporary textarea
2710 document.body.removeChild(textarea);
2711 }
2712
2713 function aysChartHalloweenShowCopyNotification(message) {
2714 // Check if notification already exists
2715 var existingNotification = document.querySelector('.ays-chart-halloween-banner-2025-copy-notification');
2716 if (existingNotification) {
2717 document.body.removeChild(existingNotification);
2718 }
2719
2720 // Create notification element
2721 var notification = document.createElement('div');
2722 notification.className = 'ays-chart-halloween-banner-2025-copy-notification';
2723 notification.textContent = message;
2724 document.body.appendChild(notification);
2725
2726 // Show notification with animation
2727 setTimeout(function() {
2728 notification.classList.add('show');
2729 }, 10);
2730
2731 // Hide and remove notification after 2 seconds
2732 setTimeout(function() {
2733 notification.classList.remove('show');
2734 setTimeout(function() {
2735 if (notification.parentNode) {
2736 document.body.removeChild(notification);
2737 }
2738 }, 300);
2739 }, 2000);
2740 }
2741
2742 (function() {
2743 var endDate = new Date('". date('Y-m-d H:i:s', $end_date) ."').getTime();
2744
2745 function updateCountdown() {
2746 var now = new Date().getTime();
2747 var distance = endDate - now;
2748
2749 if (distance < 0) {
2750 clearInterval(updateCountdown);
2751 document.getElementById('ays-chart-halloween-banner-2025-progress-banner-countdown').style.display = 'none';
2752 return;
2753 }
2754
2755 var days = Math.floor(distance / (1000 * 60 * 60 * 24));
2756 var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
2757 var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
2758 var seconds = Math.floor((distance % (1000 * 60)) / 1000);
2759
2760 function padZero(num) {
2761 return num < 10 ? '0' + num : num;
2762 }
2763
2764 document.getElementById('ays-chart-halloween-banner-2025-days').textContent = padZero(days);
2765 document.getElementById('ays-chart-halloween-banner-2025-hours').textContent = padZero(hours);
2766 document.getElementById('ays-chart-halloween-banner-2025-minutes').textContent = padZero(minutes);
2767 document.getElementById('ays-chart-halloween-banner-2025-seconds').textContent = padZero(seconds);
2768 }
2769
2770 updateCountdown();
2771 setInterval(updateCountdown, 1000);
2772 })()";
2773 $content[] = '</script>';
2774
2775 $content = implode( '', $content );
2776 echo ($content);
2777 }
2778 }
2779
2780 // Black Friday
2781 public static function ays_chart_black_friday_message($ishmar){
2782 if($ishmar == 0 ){
2783 $content = array();
2784
2785 $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);
2786
2787 $content[] = '<div id="ays-chart-dicount-black-friday-month-main" class="ays-chart notice notice-success is-dismissible ays_chart_dicount_info">';
2788 $content[] = '<div id="ays-chart-dicount-black-friday-month" class="ays_chart_dicount_month">';
2789 $content[] = '<div class="ays-chart-dicount-black-friday-box">';
2790 $content[] = '<div class="ays-chart-dicount-black-friday-wrap-box ays-chart-dicount-black-friday-wrap-box-80" style="width: 70%;">';
2791 $content[] = '<div class="">';
2792 $content[] = '<div class="ays-chart-dicount-black-friday-title-row" >' . __( 'Coupon Code', "ays-popup-box" ) .' ' . '</div>';
2793 $content[] = '<div class="ays-chart-dicount-black-friday-title-row">';
2794
2795 $content[] = '
2796 <span class="ays-chart-dicount-black-friday-banner-2025-coupon-wrapper">
2797 <span class="ays-chart-dicount-black-friday-banner-2025-coupon-box" onclick="aysChartHalloweenCopyToClipboard(\'FREE2PROBF\')" title="Click to copy">
2798 <span class="ays-chart-dicount-black-friday-banner-2025-coupon-text">FREE2PROBF</span>
2799 <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">
2800 <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"/>
2801 </svg>
2802 </span>
2803 </span>';
2804 $content[] = '</div> ';
2805 $content[] = '</div>';
2806
2807 $content[] = '</div>';
2808
2809 $content[] = '<div class="ays-chart-dicount-black-friday-wrap-box ays-chart-dicount-black-friday-wrap-text-box">';
2810 $content[] = '<div class="ays-chart-dicount-black-friday-text-row">' . '30% off' . '</div>';
2811 $content[] = '</div>';
2812
2813 $content[] = '<div class="ays-chart-dicount-black-friday-wrap-box" style="width: 25%;">';
2814 $content[] = '<div id="ays-chart-countdown-main-container">';
2815 $content[] = '<div class="ays-chart-countdown-container">';
2816 $content[] = '<div id="ays-chart-countdown" style="display: block;">';
2817 $content[] = '<ul>';
2818 $content[] = '<li><span id="ays-chart-countdown-days"></span>' . __( 'Days', "ays-popup-box" ) . '</li>';
2819 $content[] = '<li><span id="ays-chart-countdown-hours"></span>' . __( 'Hours', "ays-popup-box" ) . '</li>';
2820 $content[] = '<li><span id="ays-chart-countdown-minutes"></span>' . __( 'Minutes', "ays-popup-box" ) . '</li>';
2821 $content[] = '<li><span id="ays-chart-countdown-seconds"></span>' . __( 'Seconds', "ays-popup-box" ) . '</li>';
2822 $content[] = '</ul>';
2823 $content[] = '</div>';
2824 $content[] = '<div id="ays-chart-countdown-content" class="emoji" style="display: none;">';
2825 $content[] = '<span></span>';
2826 $content[] = '<span></span>';
2827 $content[] = '<span></span>';
2828 $content[] = '<span></span>';
2829 $content[] = '</div>';
2830 $content[] = '</div>';
2831 $content[] = '</div>';
2832 $content[] = '</div>';
2833
2834 $content[] = '<div class="ays-chart-dicount-black-friday-wrap-box" style="width: 25%;">';
2835 $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>';
2836 $content[] = '</div>';
2837 $content[] = '</div>';
2838 $content[] = '</div>';
2839
2840 $content[] = '<div style="position: absolute;right: 0;bottom: 1px;" class="ays-chart-dismiss-buttons-container-for-form-black-friday">';
2841 $content[] = '<form action="" method="POST">';
2842 $content[] = '<div id="ays-chart-dismiss-buttons-content">';
2843 if( current_user_can( 'manage_options' ) ){
2844 $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>';
2845 $content[] = wp_nonce_field( CHART_BUILDER_NAME . '-sale-banner' , CHART_BUILDER_NAME . '-sale-banner' );
2846 }
2847 $content[] = '</div>';
2848 $content[] = '</form>';
2849 $content[] = '</div>';
2850 $content[] = '</div>';
2851
2852 $content[] = '<script>';
2853 $content[] = "
2854 function aysChartHalloweenCopyToClipboard(text) {
2855 // Create a temporary textarea element
2856 var textarea = document.createElement('textarea');
2857 textarea.value = text;
2858 textarea.style.position = 'fixed';
2859 textarea.style.opacity = '0';
2860 document.body.appendChild(textarea);
2861
2862 // Select and copy the text
2863 textarea.select();
2864 textarea.setSelectionRange(0, 99999); // For mobile devices
2865
2866 try {
2867 document.execCommand('copy');
2868 aysChartHalloweenShowCopyNotification('Coupon code copied!');
2869 } catch (err) {
2870 console.error('Failed to copy text: ', err);
2871 }
2872
2873 // Remove the temporary textarea
2874 document.body.removeChild(textarea);
2875 }
2876
2877 function aysChartHalloweenShowCopyNotification(message) {
2878 // Check if notification already exists
2879 var existingNotification = document.querySelector('.ays-chart-discount-black-friday-banner-2025-copy-notification');
2880 if (existingNotification) {
2881 document.body.removeChild(existingNotification);
2882 }
2883
2884 // Create notification element
2885 var notification = document.createElement('div');
2886 notification.className = 'ays-chart-discount-black-friday-banner-2025-copy-notification';
2887 notification.textContent = message;
2888 document.body.appendChild(notification);
2889
2890 // Show notification with animation
2891 setTimeout(function() {
2892 notification.classList.add('show');
2893 }, 10);
2894
2895 // Hide and remove notification after 2 seconds
2896 setTimeout(function() {
2897 notification.classList.remove('show');
2898 setTimeout(function() {
2899 if (notification.parentNode) {
2900 document.body.removeChild(notification);
2901 }
2902 }, 300);
2903 }, 2000);
2904 }";
2905 $content[] = '</script>';
2906
2907 $content[] = '<style>';
2908 $content[] = '
2909 /* Black friday banner start */
2910 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}}
2911 ';
2912 $content[] = '</style>';
2913
2914 $content = implode( '', $content );
2915
2916 echo $content;
2917 }
2918 }
2919
2920 // Christmas Banner 2025
2921 public static function ays_chart_christmas_banner_message_2025($ishmar){
2922 if($ishmar == 0 ){
2923 $content = array();
2924
2925 $svg_icon = '<svg width="21" height="22" viewBox="0 0 21 22" fill="none" xmlns="http://www.w3.org/2000/svg">
2926 <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"/>
2927 </svg>
2928 ';
2929
2930 $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);
2931
2932 $content[] = '<div id="ays-chart-christmas-banner-main" class="notice notice-success is-dismissible ays-chart-christmas-banner-info ays_chart_dicount_info">';
2933 $content[] = '<div id="ays-chart-christmas-banner-month" class="ays-chart-christmas-banner-month">';
2934
2935 // Background effects
2936 $content[] = '<div class="ays-chart-christmas-banner-bg-effects">';
2937 $content[] = '<div class="ays-chart-christmas-banner-bg-gradient-1"></div>';
2938 $content[] = '<div class="ays-chart-christmas-banner-bg-gradient-2"></div>';
2939
2940 // Snowflakes
2941 $content[] = '<div class="ays-chart-christmas-banner-snowflake" style="left: 5%; animation-delay: 0s; animation-duration: 8s;">'. $svg_icon .'</div>';
2942 $content[] = '<div class="ays-chart-christmas-banner-snowflake" style="left: 15%; animation-delay: 2s; animation-duration: 10s;">'. $svg_icon .'</div>';
2943 $content[] = '<div class="ays-chart-christmas-banner-snowflake" style="left: 25%; animation-delay: 4s; animation-duration: 9s;">'. $svg_icon .'</div>';
2944 $content[] = '<div class="ays-chart-christmas-banner-snowflake" style="left: 75%; animation-delay: 1s; animation-duration: 11s;">'. $svg_icon .'</div>';
2945 $content[] = '<div class="ays-chart-christmas-banner-snowflake" style="left: 85%; animation-delay: 3s; animation-duration: 8s;">'. $svg_icon .'</div>';
2946 $content[] = '<div class="ays-chart-christmas-banner-snowflake" style="left: 92%; animation-delay: 5s; animation-duration: 10s;">'. $svg_icon .'</div>';
2947
2948 // Sparkles
2949 $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">';
2950 $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"/>';
2951 $content[] = '</svg>';
2952 $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">';
2953 $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"/>';
2954 $content[] = '</svg>';
2955 $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">';
2956 $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"/>';
2957 $content[] = '</svg>';
2958 $content[] = '</div>';
2959
2960 // Main content
2961 $content[] = '<div class="ays-chart-christmas-banner-content">';
2962 $content[] = '<div class="ays-chart-christmas-banner-left">';
2963 // Gift icon with hat
2964 $content[] = '<div class="ays-chart-christmas-banner-gift-wrapper">';
2965 $content[] = '<svg class="ays-chart-christmas-banner-gift-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">';
2966 $content[] = '<rect x="3" y="8" width="18" height="4" rx="1"></rect>';
2967 $content[] = '<path d="M12 8v13"></path>';
2968 $content[] = '<path d="M19 12v7a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2v-7"></path>';
2969 $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>';
2970 $content[] = '</svg>';
2971 $content[] = '<div class="ays-chart-christmas-banner-hat">';
2972 $content[] = '<svg viewBox="0 0 24 24" fill="none" class="ays-chart-christmas-banner-hat-svg">';
2973 $content[] = '<path d="M12 2L4 14h16L12 2z" fill="hsl(0 80% 45%)"></path>';
2974 $content[] = '<path d="M4 14c0 2 3.5 3 8 3s8-1 8-3" fill="hsl(0 0% 100%)"></path>';
2975 $content[] = '<circle cx="12" cy="3" r="2" fill="hsl(0 0% 100%)"></circle>';
2976 $content[] = '</svg>';
2977 $content[] = '</div>';
2978 $content[] = '</div>';
2979
2980 $content[] = '<div class="ays-chart-christmas-banner-special-label">';
2981 $content[] = '<div class="ays-chart-christmas-banner-special-label-name">';
2982 $content[] = '<a href="'. $ays_chart_cta_button_link .'" class="ays-chart-christmas-banner-special-label-name-link" target="_blank">';
2983 $content[] = __( 'Chart Builder', "chart-builder" );
2984 $content[] = '</a>';
2985 $content[] = '</div>';
2986
2987 $content[] = '<div>✦ ' . __( 'CHRISTMAS SPECIAL', "chart-builder" ) . ' ✦</div>';
2988 $content[] = '</div>';
2989 $content[] = '</div>';
2990
2991 $content[] = '<div class="ays-chart-christmas-banner-center">';
2992 $content[] = '<div class="ays-chart-christmas-banner-discount-text">25% OFF</div>';
2993 $content[] = '<div class="ays-chart-christmas-banner-limited-offer">' . __( 'Limited time offer', "chart-builder" ) . '</div>';
2994 $content[] = '</div>';
2995
2996 $content[] = '<div class="ays-chart-christmas-banner-right">';
2997 $content[] = '<div class="ays-chart-christmas-banner-coupon-box" onclick="aysChartChristmasCopyToClipboard(\'XMAS25\')" title="' . __( 'Click to copy', "chart-builder" ) . '">';
2998 $content[] = '<span class="ays-chart-christmas-banner-coupon-text">XMAS25</span>';
2999 $content[] = '<svg class="ays-chart-christmas-banner-copy-icon" width="16" height="16" viewBox="0 0 16 16" fill="none">';
3000 $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"/>';
3001 $content[] = '</svg>';
3002 $content[] = '</div>';
3003
3004 $content[] = '<a href="'. $ays_chart_cta_button_link .'" class="ays-chart-christmas-banner-buy-now-btn" target="_blank">';
3005 $content[] = __( 'Buy Now', "chart-builder" );
3006 $content[] = '</a>';
3007 $content[] = '</div>';
3008 $content[] = '</div>';
3009
3010 $content[] = '</div>';
3011
3012 if( current_user_can( 'manage_options' ) ){
3013 $content[] = '<div id="ays-chart-dismiss-buttons-content">';
3014 $content[] = '<form action="" method="POST" style="position: absolute; bottom: 0; right: 0; color: #fff;">';
3015 $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>';
3016 $content[] = wp_nonce_field( CHART_BUILDER_NAME . '-sale-banner' , CHART_BUILDER_NAME . '-sale-banner' );
3017 $content[] = '</form>';
3018 $content[] = '</div>';
3019 }
3020
3021 $content[] = '</div>';
3022
3023 $content[] = '<script>';
3024 $content[] = "
3025 function aysChartChristmasCopyToClipboard(text) {
3026 var textarea = document.createElement('textarea');
3027 textarea.value = text;
3028 textarea.style.position = 'fixed';
3029 textarea.style.opacity = '0';
3030 document.body.appendChild(textarea);
3031
3032 textarea.select();
3033 textarea.setSelectionRange(0, 99999);
3034
3035 try {
3036 document.execCommand('copy');
3037 aysChartChristmasShowCopyNotification('" . __( 'Coupon code copied!', "chart-builder" ) . "');
3038 } catch (err) {
3039 console.error('Failed to copy text: ', err);
3040 }
3041
3042 document.body.removeChild(textarea);
3043 }
3044
3045 function aysChartChristmasShowCopyNotification(message) {
3046 var existingNotification = document.querySelector('.ays-chart-christmas-banner-copy-notification');
3047 if (existingNotification) {
3048 document.body.removeChild(existingNotification);
3049 }
3050
3051 var notification = document.createElement('div');
3052 notification.className = 'ays-chart-christmas-banner-copy-notification';
3053 notification.textContent = message;
3054 document.body.appendChild(notification);
3055
3056 setTimeout(function() {
3057 notification.classList.add('show');
3058 }, 10);
3059
3060 setTimeout(function() {
3061 notification.classList.remove('show');
3062 setTimeout(function() {
3063 if (notification.parentNode) {
3064 document.body.removeChild(notification);
3065 }
3066 }, 300);
3067 }, 2000);
3068 }";
3069 $content[] = '</script>';
3070
3071 $content[] = '<style>';
3072 $content[] = '
3073 /* Christmas banner start */
3074
3075 div#ays-chart-christmas-banner-main .btn-link {
3076 background-color: transparent;
3077 display: inline-block;
3078 font-weight: 400;
3079 text-align: center;
3080 white-space: nowrap;
3081 vertical-align: middle;
3082 -webkit-user-select: none;
3083 -moz-user-select: none;
3084 -ms-user-select: none;
3085 user-select: none;
3086 border: 1px solid transparent;
3087 padding: .375rem .75rem;
3088 font-size: 12px;
3089 line-height: 1.5;
3090 border-radius: .25rem;
3091 color: rgba(255, 255, 255, .6);
3092 }
3093
3094 div#ays-chart-christmas-banner-main.ays-chart-christmas-banner-info {
3095 background: linear-gradient(to right, hsl(0, 70%, 28%), hsl(0, 65%, 38%), hsl(0, 70%, 28%));
3096 padding: unset;
3097 border-left: 0;
3098 position: relative;
3099 }
3100
3101 #ays-chart-christmas-banner-main .ays-chart-christmas-banner-month {
3102 position: relative;
3103 padding: 15px 40px;
3104 overflow: hidden;
3105 }
3106
3107 /* Background effects */
3108 .ays-chart-christmas-banner-bg-effects {
3109 position: absolute;
3110 top: 0;
3111 left: 0;
3112 right: 0;
3113 bottom: 0;
3114 pointer-events: none;
3115 z-index: 1;
3116 }
3117
3118 .ays-chart-christmas-banner-bg-gradient-1 {
3119 position: absolute;
3120 top: 0;
3121 left: 30%;
3122 width: 40%;
3123 height: 100%;
3124 background: radial-gradient(circle, rgba(202, 43, 43, 0.5) 0%, transparent 60%);
3125 opacity: 0.4;
3126 }
3127
3128 .ays-chart-christmas-banner-bg-gradient-2 {
3129 position: absolute;
3130 top: 0;
3131 right: 15%;
3132 width: 35%;
3133 height: 100%;
3134 background: radial-gradient(circle, rgba(246, 201, 85, 0.15) 0%, transparent 50%);
3135 opacity: 0.3;
3136 }
3137
3138 .ays-chart-christmas-banner-snowflake {
3139 position: absolute;
3140 color: rgba(255, 255, 255, 0.2);
3141 font-size: 20px;
3142 animation: ays-chart-christmas-snowfall linear infinite;
3143 top: -10px;
3144 }
3145
3146 @keyframes ays-chart-christmas-snowfall {
3147 0% {
3148 transform: translateY(-10px) rotate(0deg);
3149 opacity: 0;
3150 }
3151 10% {
3152 opacity: 0.8;
3153 }
3154 90% {
3155 opacity: 0.8;
3156 }
3157 100% {
3158 transform: translateY(100%) rotate(360deg);
3159 opacity: 0;
3160 }
3161 }
3162
3163 .ays-chart-christmas-banner-sparkle {
3164 position: absolute;
3165 color: hsl(43, 90%, 65%);
3166 animation: ays-chart-christmas-twinkle 2s ease-in-out infinite;
3167 }
3168
3169 @keyframes ays-chart-christmas-twinkle {
3170 0%, 100% {
3171 opacity: 0.3;
3172 transform: scale(0.8);
3173 }
3174 50% {
3175 opacity: 1;
3176 transform: scale(1.2);
3177 }
3178 }
3179
3180 /* Main content */
3181 .ays-chart-christmas-banner-content {
3182 position: relative;
3183 display: flex;
3184 align-items: center;
3185 justify-content: space-between;
3186 z-index: 2;
3187 }
3188
3189 /* Left section */
3190 .ays-chart-christmas-banner-left {
3191 display: flex;
3192 align-items: center;
3193 gap: 50px;
3194 }
3195
3196 .ays-chart-christmas-banner-gift-wrapper {
3197 position: relative;
3198 animation: ays-chart-christmas-float 3s ease-in-out infinite;
3199 }
3200
3201 .ays-chart-christmas-banner-gift-icon {
3202 width: 48px;
3203 height: 48px;
3204 color: rgba(255, 247, 237, 0.9);
3205 }
3206
3207 @keyframes ays-chart-christmas-float {
3208 0%, 100% {
3209 transform: translateY(0);
3210 }
3211 50% {
3212 transform: translateY(-5px);
3213 }
3214 }
3215
3216 .ays-chart-christmas-banner-hat {
3217 position: absolute;
3218 top: -12px;
3219 right: -4px;
3220 width: 24px;
3221 height: 24px;
3222 }
3223
3224 .ays-chart-christmas-banner-hat-svg {
3225 width: 100%;
3226 height: 100%;
3227 }
3228
3229 .ays-chart-christmas-banner-special-label {
3230 color: hsl(43, 90%, 65%);
3231 font-size: 14px;
3232 font-weight: 500;
3233 text-transform: uppercase;
3234 letter-spacing: 1px;
3235 /* font-family: "Outfit", sans-serif; */
3236 }
3237
3238 .ays-chart-christmas-banner-special-label-name {
3239 color: #fffaf0;
3240 text-align: center;
3241 }
3242
3243 div#ays-chart-christmas-banner-main .ays-chart-christmas-banner-special-label-name-link {
3244 color: #fffaf0;
3245 box-shadow: unset;
3246 }
3247
3248 /* Center section */
3249 .ays-chart-christmas-banner-center {
3250 display: flex;
3251 flex-direction: row;
3252 text-align: center;
3253 justify-content: center;
3254 align-items: center;
3255 gap: 30px;
3256 }
3257
3258 .ays-chart-christmas-banner-discount-text {
3259 font-family: "Outfit", sans-serif;
3260 font-weight: 800;
3261 font-size: 30px;
3262 color: hsl(40, 100%, 97%);
3263 letter-spacing: -1px;
3264 line-height: 1;
3265 }
3266
3267 .ays-chart-christmas-banner-limited-offer {
3268 color: rgba(255, 247, 237, 0.7);
3269 font-size: 13px;
3270 font-weight: 500;
3271 }
3272
3273 /* Right section */
3274 .ays-chart-christmas-banner-right {
3275 display: flex;
3276 align-items: center;
3277 gap: 20px;
3278 }
3279
3280 .ays-chart-christmas-banner-coupon-box {
3281 border: 2px dashed rgba(255, 255, 255, 0.4);
3282 padding: 8px 16px;
3283 border-radius: 6px;
3284 background: rgba(255, 255, 255, 0.1);
3285 cursor: pointer;
3286 transition: all 0.3s;
3287 display: flex;
3288 align-items: center;
3289 gap: 8px;
3290 backdrop-filter: blur(10px);
3291 }
3292
3293 .ays-chart-christmas-banner-coupon-box:hover {
3294 background: rgba(255, 255, 255, 0.2);
3295 border-color: rgba(255, 255, 255, 0.6);
3296 transform: translateY(-1px);
3297 }
3298
3299 .ays-chart-christmas-banner-coupon-text {
3300 font-size: 16px;
3301 font-weight: 700;
3302 letter-spacing: 1px;
3303 color: #fff;
3304 font-family: monospace;
3305 }
3306
3307 .ays-chart-christmas-banner-copy-icon {
3308 opacity: 0.8;
3309 transition: opacity 0.3s;
3310 }
3311
3312 .ays-chart-christmas-banner-coupon-box:hover .ays-chart-christmas-banner-copy-icon {
3313 opacity: 1;
3314 }
3315
3316 #ays-chart-christmas-banner-main .ays-chart-christmas-banner-buy-now-btn {
3317 background-color: #fbe19f;
3318 color: hsl(0, 72%, 35%);
3319 padding: 10px 30px;
3320 border-radius: 9999px;
3321 font-size: 16px;
3322 font-weight: 600;
3323 font-family: "Outfit", sans-serif;
3324 border: none;
3325 cursor: pointer;
3326 transition: all 0.3s;
3327 text-decoration: none;
3328 display: flex;
3329 align-items: center;
3330 gap: 6px;
3331 box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15), 0 0 30px rgba(246, 201, 85, 0.2);
3332 }
3333
3334 #ays-chart-christmas-banner-main .ays-chart-christmas-banner-buy-now-btn:hover {
3335 background-color: #f2d58c;
3336 transform: scale(1.05);
3337 box-shadow: 0 8px 30px rgba(0, 0, 0, 0.2), 0 0 40px rgba(246, 201, 85, 0.3);
3338 }
3339
3340 .ays-chart-christmas-banner-btn-arrow {
3341 display: inline-block;
3342 transition: transform 0.3s;
3343 }
3344
3345 .ays-chart-christmas-banner-buy-now-btn:hover .ays-chart-christmas-banner-btn-arrow {
3346 transform: translateX(4px);
3347 }
3348
3349 /* Notification */
3350 .ays-chart-christmas-banner-copy-notification {
3351 position: fixed;
3352 top: 50%;
3353 left: 50%;
3354 transform: translate(-50%, -50%);
3355 background: rgba(0, 0, 0, 0.8);
3356 color: #fff;
3357 padding: 12px 24px;
3358 border-radius: 8px;
3359 font-size: 14px;
3360 z-index: 10000;
3361 opacity: 0;
3362 transition: opacity 0.3s;
3363 }
3364
3365 .ays-chart-christmas-banner-copy-notification.show {
3366 opacity: 1;
3367 }
3368
3369 /* Dismiss button */
3370 #ays-chart-christmas-banner-main #ays-chart-christmas-banner-dismiss-content {
3371 display: flex;
3372 justify-content: center;
3373 }
3374
3375 #ays-chart-christmas-banner-main #ays-chart-christmas-banner-dismiss-content .ays-button {
3376 margin: 0 !important;
3377 font-size: 13px;
3378 color: rgba(150, 147, 147, 0.69);
3379 }
3380
3381 /* Responsive */
3382 @media (max-width: 1024px) {
3383 .ays-chart-christmas-banner-discount-text {
3384 font-size: 40px;
3385 }
3386 .ays-chart-christmas-banner-content {
3387 flex-wrap: wrap;
3388 }
3389 }
3390
3391 @media (max-width: 768px) {
3392 #ays-chart-christmas-banner-main {
3393 display: none !important;
3394 }
3395 }
3396 /* Christmas banner end */
3397 ';
3398 $content[] = '</style>';
3399
3400 $content = implode( '', $content );
3401
3402 echo $content;
3403 }
3404 }
3405
3406 public function ays_chart_update_banner_time(){
3407 if (!current_user_can('manage_options')) {
3408 return array('error' => 'Insufficient permissions');
3409 }
3410
3411 $date = time() + ( 3 * 24 * 60 * 60 ) + (int) ( get_option( 'gmt_offset' ) * HOUR_IN_SECONDS);
3412 // $date = time() + ( 60 ) + (int) ( get_option( 'gmt_offset' ) * HOUR_IN_SECONDS); // for testing | 1 min
3413 $next_3_days = gmdate('M d, Y H:i:s', $date);
3414
3415 $ays_chart_banner_time = get_option('ays_chart_20_bundle_banner_time');
3416
3417 if ( !$ays_chart_banner_time || is_null( $ays_chart_banner_time ) ) {
3418 update_option('ays_chart_20_bundle_banner_time', $next_3_days );
3419 }
3420
3421 $get_ays_chart_banner_time = get_option('ays_chart_20_bundle_banner_time');
3422
3423 $val = 60*60*24*0.5; // half day
3424 // $val = 60; // for testing | 1 min
3425
3426 $current_date = current_time( 'mysql' );
3427 $date_diff = strtotime($current_date) - intval(strtotime($get_ays_chart_banner_time));
3428
3429 $days_diff = $date_diff / $val;
3430 if(intval($days_diff) > 0 ){
3431 update_option('ays_chart_20_bundle_banner_time', $next_3_days);
3432 $get_ays_chart_banner_time = get_option('ays_chart_20_bundle_banner_time');
3433 }
3434
3435 return $get_ays_chart_banner_time;
3436 }
3437
3438
3439 public function ays_chart_add_body_class( $classes ) {
3440 global $pagenow;
3441
3442 if ( $pagenow === 'admin.php' ) {
3443 $page = isset( $_GET['page'] ) ? sanitize_key( $_GET['page'] ) : '';
3444
3445 if ( strpos( $page, $this->plugin_name ) === 0 ) {
3446 $classes .= ' ays-chart-builder-admin';
3447 }
3448 }
3449
3450 return $classes;
3451 }
3452
3453 public function author_user_search() {
3454 check_ajax_referer( 'cbuilder-author-user-search', 'security' );
3455 $params = isset($_REQUEST['params']) ? sanitize_text_field(wp_unslash($_REQUEST['params'])) : array();
3456 $search = isset($params['search']) && $params['search'] != '' ? sanitize_text_field( $params['search'] ) : null;
3457 $checked = isset($params['val']) && $params['val'] !='' ? sanitize_text_field( $params['val'] ) : null;
3458 $args = 'search=';
3459 if ($search !== null) {
3460 $args .= '*';
3461 $args .= $search;
3462 $args .= '*';
3463 }
3464
3465 $users = get_users($args);
3466
3467 $content_text = array(
3468 'results' => array()
3469 );
3470
3471 foreach ($users as $key => $value) {
3472 if ($checked !== null) {
3473 if ( !is_array( $checked ) ) {
3474 $checked2 = $checked;
3475 $checked = array();
3476 $checked[] = absint($checked2);
3477 }
3478 if (in_array($value->ID, $checked)) {
3479 continue;
3480 } else {
3481 $content_text['results'][] = array(
3482 'id' => $value->ID,
3483 'text' => $value->data->display_name,
3484 );
3485 }
3486 } else {
3487 $content_text['results'][] = array(
3488 'id' => $value->ID,
3489 'text' => $value->data->display_name,
3490 );
3491 }
3492 }
3493
3494 ob_end_clean();
3495 echo json_encode($content_text);
3496 wp_die();
3497 }
3498
3499 /**
3500 * Determine if the plugin/addon installations are allowed.
3501 *
3502 * @since 6.4.0.4
3503 *
3504 * @param string $type Should be `plugin` or `addon`.
3505 *
3506 * @return bool
3507 */
3508 public static function ays_chart_can_install( $type ) {
3509
3510 return self::ays_chart_can_do( 'install', $type );
3511 }
3512
3513 /**
3514 * Determine if the plugin/addon activations are allowed.
3515 *
3516 * @since 6.4.0.4
3517 *
3518 * @param string $type Should be `plugin` or `addon`.
3519 *
3520 * @return bool
3521 */
3522 public static function ays_chart_can_activate( $type ) {
3523
3524 return self::ays_chart_can_do( 'activate', $type );
3525 }
3526
3527 /**
3528 * Determine if the plugin/addon installations/activations are allowed.
3529 *
3530 * @since 6.4.0.4
3531 *
3532 * @param string $what Should be 'activate' or 'install'.
3533 * @param string $type Should be `plugin` or `addon`.
3534 *
3535 * @return bool
3536 */
3537 public static function ays_chart_can_do( $what, $type ) {
3538
3539 if ( ! in_array( $what, array( 'install', 'activate' ), true ) ) {
3540 return false;
3541 }
3542
3543 if ( ! in_array( $type, array( 'plugin', 'addon' ), true ) ) {
3544 return false;
3545 }
3546
3547 $capability = $what . '_plugins';
3548
3549 if ( ! current_user_can( $capability ) ) {
3550 return false;
3551 }
3552
3553 // Determine whether file modifications are allowed and it is activation permissions checking.
3554 if ( $what === 'install' && ! wp_is_file_mod_allowed( 'ays_chart_can_install' ) ) {
3555 return false;
3556 }
3557
3558 // All plugin checks are done.
3559 if ( $type === 'plugin' ) {
3560 return true;
3561 }
3562 return false;
3563 }
3564
3565 /**
3566 * Activate plugin.
3567 *
3568 * @since 1.0.0
3569 * @since 6.4.0.4 Updated the permissions checking.
3570 */
3571 public function ays_chart_activate_plugin() {
3572
3573 // Run a security check.
3574 check_ajax_referer( $this->plugin_name . '-install-plugin-nonce', '_ajax_nonce' );
3575
3576
3577 // Check for permissions.
3578 if ( ! current_user_can( 'activate_plugins' ) ) {
3579 wp_send_json_error( esc_html__( 'Plugin activation is disabled for you on this site.', 'chart-builder' ) );
3580 }
3581
3582 $type = 'addon';
3583
3584 if ( isset( $_POST['plugin'] ) ) {
3585
3586 if ( ! empty( $_POST['type'] ) ) {
3587 $type = sanitize_key( $_POST['type'] );
3588 }
3589
3590 $plugin = sanitize_text_field( wp_unslash( $_POST['plugin'] ) );
3591 $activate = activate_plugins( $plugin );
3592
3593 if ( ! is_wp_error( $activate ) ) {
3594 if ( $type === 'plugin' ) {
3595 wp_send_json_success( esc_html__( 'Plugin activated.', 'chart-builder' ) );
3596 } else {
3597 ( esc_html__( 'Addon activated.', 'chart-builder' ) );
3598 }
3599 }
3600 }
3601
3602 if ( $type === 'plugin' ) {
3603 wp_send_json_error( esc_html__( 'Could not activate the plugin. Please activate it on the Plugins page.', 'chart-builder' ) );
3604 }
3605
3606 wp_send_json_error( esc_html__( 'Could not activate the addon. Please activate it on the Plugins page.', 'chart-builder' ) );
3607 }
3608
3609 /**
3610 * Install addon.
3611 *
3612 * @since 1.0.0
3613 * @since 6.4.0.4 Updated the permissions checking.
3614 */
3615 public function ays_chart_install_plugin() {
3616
3617 // Run a security check.
3618 check_ajax_referer( $this->plugin_name . '-install-plugin-nonce', '_ajax_nonce' );
3619
3620
3621 $generic_error = esc_html__( 'There was an error while performing your request.', 'chart-builder' );
3622 $type = ! empty( $_POST['type'] ) ? sanitize_key( $_POST['type'] ) : '';
3623
3624 // Check if new installations are allowed.
3625 if ( ! self::ays_chart_can_install( $type ) ) {
3626 wp_send_json_error( $generic_error );
3627 }
3628
3629 $error = $type === 'plugin'
3630 ? esc_html__( 'Could not install the plugin. Please download and install it manually.', 'chart-builder' )
3631 : "";
3632
3633 $plugin_url = ! empty( $_POST['plugin'] ) ? esc_url_raw( wp_unslash( $_POST['plugin'] ) ) : '';
3634
3635 if ( empty( $plugin_url ) ) {
3636 wp_send_json_error( $error );
3637 }
3638
3639 // Prepare variables.
3640 $url = esc_url_raw(
3641 add_query_arg(
3642 [
3643 'page' => 'chart-builder-featured-plugins',
3644 ],
3645 admin_url( 'admin.php' )
3646 )
3647 );
3648
3649 ob_start();
3650 $creds = request_filesystem_credentials( $url, '', false, false, null );
3651
3652 // Hide the filesystem credentials form.
3653 ob_end_clean();
3654
3655 // Check for file system permissions.
3656 if ( $creds === false ) {
3657 wp_send_json_error( $error );
3658 }
3659
3660 if ( ! WP_Filesystem( $creds ) ) {
3661 wp_send_json_error( $error );
3662 }
3663
3664 /*
3665 * We do not need any extra credentials if we have gotten this far, so let's install the plugin.
3666 */
3667 require_once CHART_BUILDER_DIR . 'includes/admin/class-chart-builder-upgrader.php';
3668 require_once CHART_BUILDER_DIR . 'includes/admin/class-chart-builder-install-skin.php';
3669 require_once CHART_BUILDER_DIR . 'includes/admin/class-chart-builder-skin.php';
3670
3671
3672 // Do not allow WordPress to search/download translations, as this will break JS output.
3673 remove_action( 'upgrader_process_complete', array( 'Language_Pack_Upgrader', 'async_upgrade' ), 20 );
3674
3675 // Create the plugin upgrader with our custom skin.
3676 $installer = new ChartBuilder\Helpers\ChartBuilderPluginSilentUpgrader( new Chart_Builder_Install_Skin() );
3677
3678 // Error check.
3679 if ( ! method_exists( $installer, 'install' ) ) {
3680 wp_send_json_error( $error );
3681 }
3682
3683 $installer->install( $plugin_url );
3684
3685 // Flush the cache and return the newly installed plugin basename.
3686 wp_cache_flush();
3687
3688 $plugin_basename = $installer->plugin_info();
3689
3690 if ( empty( $plugin_basename ) ) {
3691 wp_send_json_error( $error );
3692 }
3693
3694 $result = array(
3695 'msg' => $generic_error,
3696 'is_activated' => false,
3697 'basename' => $plugin_basename,
3698 );
3699
3700 // Check for permissions.
3701 if ( ! current_user_can( 'activate_plugins' ) ) {
3702 $result['msg'] = $type === 'plugin' ? esc_html__( 'Plugin installed.', 'chart-builder' ) : "";
3703
3704 wp_send_json_success( $result );
3705 }
3706
3707 // Activate the plugin silently.
3708 $activated = activate_plugin( $plugin_basename );
3709 remove_action( 'activated_plugin', array( 'ays_sccp_activation_redirect_method', 'gallery_p_gallery_activation_redirect_method', 'poll_maker_activation_redirect_method' ), 100 );
3710
3711 if ( ! is_wp_error( $activated ) ) {
3712
3713 $result['is_activated'] = true;
3714 $result['msg'] = $type === 'plugin' ? esc_html__( 'Plugin installed and activated.', 'chart-builder' ) : esc_html__( 'Addon installed and activated.', 'chart-builder' );
3715
3716 wp_send_json_success( $result );
3717 }
3718
3719 // Fallback error just in case.
3720 wp_send_json_error( $result );
3721 }
3722
3723 /**
3724 * List of AM plugins that we propose to install.
3725 *
3726 * @since 6.4.0.4
3727 *
3728 * @return array
3729 */
3730 protected function get_am_plugins() {
3731 if ( !isset( $_SESSION ) ) {
3732 session_start();
3733 }
3734
3735 $images_url = CHART_BUILDER_ADMIN_URL . '/images/icons/';
3736
3737 $plugin_slug = array(
3738 'fox-lms',
3739 'quiz-maker',
3740 'survey-maker',
3741 'poll-maker',
3742 'chart-builder',
3743 'ays-popup-box',
3744 'secure-copy-content-protection',
3745 'gallery-photo-gallery',
3746 'ays-chatgpt-assistant',
3747 'easy-form',
3748 );
3749
3750 $plugin_url_arr = array();
3751 foreach ($plugin_slug as $key => $slug) {
3752 if ( isset( $_SESSION['ays_chart_our_product_links'] ) && !empty( $_SESSION['ays_chart_our_product_links'] )
3753 && isset( $_SESSION['ays_chart_our_product_links'][$slug] ) && !empty( $_SESSION['ays_chart_our_product_links'][$slug] ) ) {
3754 $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])) : "";
3755 } else {
3756 $latest_version = $this->ays_chart_get_latest_plugin_version($slug);
3757 $plugin_url = 'https://downloads.wordpress.org/plugin/'. $slug .'.zip';
3758 if ( $latest_version != '' ) {
3759 $plugin_url = 'https://downloads.wordpress.org/plugin/'. $slug .'.'. $latest_version .'.zip';
3760 $_SESSION['ays_chart_our_product_links'][$slug] = $plugin_url;
3761 }
3762 }
3763
3764 $plugin_url_arr[$slug] = $plugin_url;
3765 }
3766
3767 $plugins_array = array(
3768 'fox-lms/fox-lms.php' => array(
3769 'icon' => $images_url . 'icon-fox-lms-128x128.png',
3770 'name' => __( 'Fox LMS', 'chart-builder' ),
3771 'desc' => __( 'Build and manage online courses directly on your WordPress site.', 'chart-builder' ),
3772 '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' ),
3773 'wporg' => 'https://wordpress.org/plugins/fox-lms/',
3774 'buy_now' => 'https://foxlms.com/pricing/?utm_source=dashboard&utm_medium=chart-free&utm_campaign=fox-lms-our-products-page',
3775 'url' => $plugin_url_arr['fox-lms'],
3776 ),
3777 'quiz-maker/quiz-maker.php' => array(
3778 'icon' => $images_url . 'icon-quiz-128x128.png',
3779 'name' => __( 'Quiz Maker', 'chart-builder' ),
3780 'desc' => __( 'Create powerful and engaging quizzes, tests, and exams in minutes.', 'chart-builder' ),
3781 'desc_hidden' => __( 'Build an unlimited number of quizzes and questions.', 'chart-builder' ),
3782 'wporg' => 'https://wordpress.org/plugins/quiz-maker/',
3783 'buy_now' => 'https://ays-pro.com/wordpress/quiz-maker/',
3784 'url' => $plugin_url_arr['quiz-maker'],
3785 ),
3786 'survey-maker/survey-maker.php' => array(
3787 'icon' => $images_url . 'icon-survey-128x128.png',
3788 'name' => __( 'Survey Maker', 'chart-builder' ),
3789 'desc' => __( 'Make amazing online surveys and get real-time feedback quickly and easily.', 'chart-builder' ),
3790 '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' ),
3791 'wporg' => 'https://wordpress.org/plugins/survey-maker/',
3792 'buy_now' => 'https://ays-pro.com/wordpress/survey-maker',
3793 'url' => $plugin_url_arr['survey-maker'],
3794 ),
3795 'poll-maker/poll-maker-ays.php' => array(
3796 'icon' => $images_url . 'icon-poll-128x128.png',
3797 'name' => __( 'Poll Maker', 'chart-builder' ),
3798 'desc' => __( 'Create amazing online polls for your WordPress website super easily.', 'chart-builder' ),
3799 'desc_hidden' => __( 'Build up various types of polls in a minute and get instant feedback on any topic or product.', 'chart-builder' ),
3800 'wporg' => 'https://wordpress.org/plugins/poll-maker/',
3801 'buy_now' => 'https://ays-pro.com/wordpress/poll-maker/',
3802 'url' => $plugin_url_arr['poll-maker'],
3803 ),
3804 'ays-popup-box/ays-pb.php' => array(
3805 'icon' => $images_url . 'icon-popup-128x128.png',
3806 'name' => __( 'Popup Box', 'chart-builder' ),
3807 'desc' => __( 'Popup everything you want! Create informative and promotional popups all in one plugin.', 'chart-builder' ),
3808 'desc_hidden' => __( 'Attract your visitors and convert them into email subscribers and paying customers.', 'chart-builder' ),
3809 'wporg' => 'https://wordpress.org/plugins/ays-popup-box/',
3810 'buy_now' => 'https://ays-pro.com/wordpress/popup-box/',
3811 'url' => $plugin_url_arr['ays-popup-box'],
3812 ),
3813 'secure-copy-content-protection/secure-copy-content-protection.php' => array(
3814 'icon' => $images_url . 'icon-sccp-128x128.png',
3815 'name' => __( 'Secure Copy Content Protection', 'chart-builder' ),
3816 'desc' => __( 'Disable the right click, copy paste, content selection and copy shortcut keys on your website.', 'chart-builder' ),
3817 'desc_hidden' => __( 'Protect web content from being plagiarized. Prevent plagiarism from your website with this easy to use plugin.', 'chart-builder' ),
3818 'wporg' => 'https://wordpress.org/plugins/secure-copy-content-protection/',
3819 'buy_now' => 'https://ays-pro.com/wordpress/secure-copy-content-protection/',
3820 'url' => $plugin_url_arr['secure-copy-content-protection'],
3821 ),
3822 'gallery-photo-gallery/gallery-photo-gallery.php' => array(
3823 'icon' => $images_url . 'icon-gallery-128x128.png',
3824 'name' => __( 'Gallery Photo Gallery', 'chart-builder' ),
3825 'desc' => __( 'Create unlimited galleries and include unlimited images in those galleries.', 'chart-builder' ),
3826 'desc_hidden' => __( 'Represent images in an attractive way. Attract people with your own single and multiple free galleries from your photo library.', 'chart-builder' ),
3827 'wporg' => 'https://wordpress.org/plugins/gallery-photo-gallery/',
3828 'buy_now' => 'https://ays-pro.com/wordpress/photo-gallery/',
3829 'url' => $plugin_url_arr['gallery-photo-gallery'],
3830 ),
3831 'ays-chatgpt-assistant/ays-chatgpt-assistant.php' => array(
3832 'icon' => $images_url . 'icon-chatgpt-128x128.png',
3833 'name' => __( 'AI Assistant with ChatGPT', 'chart-builder' ),
3834 'desc' => __( 'ChatGPT AI Assistant plugin gives you the ability to automate various tasks related to content creation and programming.', 'chart-builder' ),
3835 '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' ),
3836 'wporg' => 'https://wordpress.org/plugins/ays-chatgpt-assistant/',
3837 'buy_now' => 'https://ays-pro.com/wordpress/chatgpt-assistant',
3838 'url' => $plugin_url_arr['ays-chatgpt-assistant'],
3839 ),
3840 'easy-form/easy-form.php' => array(
3841 'icon' => $images_url . 'icon-form-128x128.png',
3842 'name' => __( 'Easy Form', 'chart-builder' ),
3843 'desc' => __( 'Choose the best WordPress form builder plugin. ', 'chart-builder' ),
3844 'desc_hidden' => __( 'Create contact forms, payment forms, surveys, and many more custom forms. Build forms easily with us.', 'chart-builder' ),
3845 'wporg' => 'https://wordpress.org/plugins/easy-form/',
3846 'buy_now' => 'https://ays-pro.com/wordpress/easy-form',
3847 'url' => $plugin_url_arr['easy-form'],
3848 ),
3849 );
3850
3851 return $plugins_array;
3852 }
3853
3854 protected function ays_chart_get_latest_plugin_version( $slug ){
3855
3856 if ( is_null( $slug ) || empty($slug) ) {
3857 return "";
3858 }
3859
3860 $version_latest = "";
3861
3862 if ( ! function_exists( 'plugins_api' ) ) {
3863 require_once( ABSPATH . 'wp-admin/includes/plugin-install.php' );
3864 }
3865
3866 // set the arguments to get latest info from repository via API ##
3867 $args = array(
3868 'slug' => $slug,
3869 'fields' => array(
3870 'version' => true,
3871 )
3872 );
3873
3874 /** Prepare our query */
3875 $call_api = plugins_api( 'plugin_information', $args );
3876
3877 /** Check for Errors & Display the results */
3878 if ( is_wp_error( $call_api ) ) {
3879 $api_error = $call_api->get_error_message();
3880 } else {
3881
3882 //echo $call_api;
3883 // everything ##
3884 if ( ! empty( $call_api->version ) ) {
3885 $version_latest = $call_api->version;
3886 }
3887 }
3888
3889 return $version_latest;
3890 }
3891
3892 /**
3893 * Get AM plugin data to display in the Addons section of About tab.
3894 *
3895 * @since 6.4.0.4
3896 *
3897 * @param string $plugin Plugin slug.
3898 * @param array $details Plugin details.
3899 * @param array $all_plugins List of all plugins.
3900 *
3901 * @return array
3902 */
3903 protected function get_plugin_data( $plugin, $details, $all_plugins ) {
3904
3905 $have_pro = ( ! empty( $details['pro'] ) && ! empty( $details['pro']['plug'] ) );
3906 $show_pro = false;
3907
3908 $plugin_data = array();
3909
3910 if ( $have_pro ) {
3911 if ( array_key_exists( $plugin, $all_plugins ) ) {
3912 if ( is_plugin_active( $plugin ) ) {
3913 $show_pro = true;
3914 }
3915 }
3916 if ( array_key_exists( $details['pro']['plug'], $all_plugins ) ) {
3917 $show_pro = true;
3918 }
3919 if ( $show_pro ) {
3920 $plugin = $details['pro']['plug'];
3921 $details = $details['pro'];
3922 }
3923 }
3924
3925 if ( array_key_exists( $plugin, $all_plugins ) ) {
3926 if ( is_plugin_active( $plugin ) ) {
3927 // Status text/status.
3928 $plugin_data['status_class'] = 'status-active';
3929 $plugin_data['status_text'] = esc_html__( 'Active', 'chart-builder' );
3930 // Button text/status.
3931 $plugin_data['action_class'] = $plugin_data['status_class'] . ' ays-chart-card__btn-info disabled';
3932 $plugin_data['action_text'] = esc_html__( 'Activated', 'chart-builder' );
3933 $plugin_data['plugin_src'] = esc_attr( $plugin );
3934 } else {
3935 // Status text/status.
3936 $plugin_data['status_class'] = 'status-installed';
3937 $plugin_data['status_text'] = esc_html__( 'Inactive', 'chart-builder' );
3938 // Button text/status.
3939 $plugin_data['action_class'] = $plugin_data['status_class'] . ' ays-chart-card__btn-info';
3940 $plugin_data['action_text'] = esc_html__( 'Activate', 'chart-builder' );
3941 $plugin_data['plugin_src'] = esc_attr( $plugin );
3942 }
3943 } else {
3944 // Doesn't exist, install.
3945 // Status text/status.
3946 $plugin_data['status_class'] = 'status-missing';
3947
3948 if ( isset( $details['act'] ) && 'go-to-url' === $details['act'] ) {
3949 $plugin_data['status_class'] = 'status-go-to-url';
3950 }
3951 $plugin_data['status_text'] = esc_html__( 'Not Installed', 'chart-builder' );
3952 // Button text/status.
3953 $plugin_data['action_class'] = $plugin_data['status_class'] . ' ays-chart-card__btn-info';
3954 $plugin_data['action_text'] = esc_html__( 'Install Plugin', 'chart-builder' );
3955 $plugin_data['plugin_src'] = esc_url( $details['url'] );
3956 }
3957
3958 $plugin_data['details'] = $details;
3959
3960 return $plugin_data;
3961 }
3962
3963 /**
3964 * Display the Addons section of About tab.
3965 *
3966 * @since 6.4.0.4
3967 */
3968 public function output_about_addons() {
3969
3970 if ( ! function_exists( 'get_plugins' ) ) {
3971 require_once ABSPATH . 'wp-admin/includes/plugin.php';
3972 }
3973
3974 $all_plugins = get_plugins();
3975 $am_plugins = $this->get_am_plugins();
3976 $can_install_plugins = self::ays_chart_can_install( 'plugin' );
3977 $can_activate_plugins = self::ays_chart_can_activate( 'plugin' );
3978
3979 $content = '';
3980 $content.= '<div class="ays-chart-cards-block">';
3981 foreach ( $am_plugins as $plugin => $details ){
3982
3983 $plugin_data = $this->get_plugin_data( $plugin, $details, $all_plugins );
3984 $plugin_ready_to_activate = $can_activate_plugins
3985 && isset( $plugin_data['status_class'] )
3986 && $plugin_data['status_class'] === 'status-installed';
3987 $plugin_not_activated = ! isset( $plugin_data['status_class'] )
3988 || $plugin_data['status_class'] !== 'status-active';
3989
3990 $plugin_action_class = ( isset( $plugin_data['action_class'] ) && esc_attr( $plugin_data['action_class'] ) != "" ) ? esc_attr( $plugin_data['action_class'] ) : "";
3991
3992 $plugin_action_class_disbaled = "";
3993 if ( strpos($plugin_action_class, 'status-active') !== false ) {
3994 $plugin_action_class_disbaled = "disbaled='true'";
3995 }
3996
3997 $content .= '
3998 <div class="ays-chart-card">
3999 <div class="ays-chart-card__content flexible">
4000 <div class="ays-chart-card__content-img-box">
4001 <img class="ays-chart-card__img" src="'. esc_url( $plugin_data['details']['icon'] ) .'" alt="'. esc_attr( $plugin_data['details']['name'] ) .'">
4002 </div>
4003 <div class="ays-chart-card__text-block">
4004 <h5 class="ays-chart-card__title">'. esc_html( $plugin_data['details']['name'] ) .'</h5>
4005 <p class="ays-chart-card__text">'. wp_kses_post( $plugin_data['details']['desc'] ) .'
4006 <span class="ays-chart-card__text-hidden">
4007 '. wp_kses_post( $plugin_data['details']['desc_hidden'] ) .'
4008 </span>
4009 </p>
4010 </div>
4011 </div>
4012 <div class="ays-chart-card__footer">';
4013 if ( $can_install_plugins || $plugin_ready_to_activate || ! $details['wporg'] ) {
4014 $content .= '<button class="'. esc_attr( $plugin_data['action_class'] ) .'" data-plugin="'. esc_attr( $plugin_data['plugin_src'] ) .'" data-type="plugin" '. $plugin_action_class_disbaled .'>
4015 '. wp_kses_post( $plugin_data['action_text'] ) .'
4016 </button>';
4017 }
4018 elseif ( $plugin_not_activated ) {
4019 $content .= '<a href="'. esc_url( $details['wporg'] ) .'" target="_blank" rel="noopener noreferrer">
4020 '. esc_html_e( 'WordPress.org', 'chart-builder' ) .'
4021 <span aria-hidden="true" class="dashicons dashicons-external"></span>
4022 </a>';
4023 }
4024 $content .='
4025 <a target="_blank" href="'. esc_url( $plugin_data['details']['buy_now'] ) .'" class="ays-chart-card__btn-primary">'. __('Buy Now', 'chart-builder') .'</a>
4026 </div>
4027 </div>';
4028 }
4029 $install_plugin_nonce = wp_create_nonce( $this->plugin_name . '-install-plugin-nonce' );
4030 $content.= '<input type="hidden" id="ays_chart_ajax_install_plugin_nonce" name="ays_chart_ajax_install_plugin_nonce" value="'. $install_plugin_nonce .'">';
4031 $content.= '</div>';
4032
4033 echo html_entity_decode($content);
4034 }
4035
4036 /**
4037 * Returns the data from Quiz maker.
4038 *
4039 * @access public
4040 */
4041 public function fetch_quiz_maker_data(){
4042 check_ajax_referer( 'cbuilder-fetch-quiz-maker-data', 'security' );
4043
4044 $params = isset($_REQUEST['params']) ? $_REQUEST['params'] : array();
4045 if ( !isset($params) || empty($params) ) {
4046 return array(
4047 'success' => false,
4048 'data' => array(
4049 'msg' => __( "Something went wrong.", "chart-builder" )
4050 )
4051 );
4052 }
4053
4054 $query = isset($params['query']) && $params['query'] !== '' ? $params['query'] : '';
4055 if ( $query == '' ) {
4056 return array(
4057 'success' => false,
4058 'data' => array(
4059 'msg' => __( "No data given.", "chart-builder" )
4060 )
4061 );
4062 }
4063 $quiz_id = isset($params['quizID']) && $params['quizID'] !== '' ? $params['quizID'] : null;
4064 $user_id = get_current_user_id();
4065
4066 $return_results = CBFunctions()->get_quiz_query($query, $quiz_id, $user_id);
4067
4068 if (empty($return_results)) {
4069 return array(
4070 'success' => false,
4071 'data' => array(
4072 'msg' => __( "Something went wrong.", "chart-builder" )
4073 )
4074 );
4075 }
4076
4077 $result_values = $return_results['result'];
4078 $query = $return_results['query'];
4079
4080 if (empty($result_values)) {
4081 return array(
4082 'success' => false,
4083 'data' => array(
4084 'msg' => $return_results['message']
4085 )
4086 );
4087 }
4088
4089 if (count($return_results['result'][0]) != 1 ) {
4090 $results = array();
4091 $headers = array();
4092 if ( $result_values ) {
4093 $row_num = 0;
4094 foreach ( $result_values as $row ) {
4095 $result = array();
4096 foreach ( $row as $k => $v ) {
4097 $result[] = $v;
4098 if ( $row_num === 0 ) {
4099 $headers[] = $k;
4100 }
4101 }
4102 $results[] = $result;
4103 $row_num++;
4104 }
4105 }
4106 } else if (count($return_results['result'][0]) == 1) {
4107 $results = array();
4108 $headers = array();
4109 if ( $result_values ) {
4110 $row_num = 0;
4111 foreach ( $result_values as $index => $row ) {
4112 $result = array();
4113 foreach ( $row as $k => $v ) {
4114 $result[] = strval($index) + 1;
4115 $result[] = $v;
4116 if ( $row_num === 0 ) {
4117 $headers[] = 'Quiz';
4118 $headers[] = $k;
4119 }
4120 }
4121 $results[] = $result;
4122 $row_num++;
4123 }
4124 }
4125 }
4126
4127 if (empty($results)) {
4128 return array(
4129 'success' => false,
4130 'data' => array(
4131 'msg' => $return_results['message']
4132 )
4133 );
4134 }
4135
4136 foreach ($results as $key => $value) {
4137 if (!isset($value) || count($value) <= 1 && $key != 0) {
4138 unset($results[$key]);
4139 }
4140 }
4141
4142 array_unshift($results, $headers);
4143 $results = array_values( $results );
4144 $data = $results;
4145
4146 $headers = $results[0];
4147 unset( $results[0] );
4148
4149 $html = CBFunctions()->get_table_html( $headers, $results );
4150
4151 return array(
4152 'success' => true,
4153 'data' => array(
4154 'table' => $html,
4155 'data' => $data
4156 )
4157 );
4158 }
4159
4160 /**
4161 * Saves the Quiz maker data.
4162 *
4163 * @access public
4164 */
4165 public function save_quiz_maker_data() {
4166 check_ajax_referer( 'cbuilder-save-quiz-maker-data', 'security' );
4167
4168 $params = isset($_REQUEST['params']) ? $_REQUEST['params'] : array();
4169 if ( !isset($params) || empty($params) ) {
4170 return array(
4171 'success' => false,
4172 'data' => array(
4173 'msg' => __( "Something went wrong.", "chart-builder" )
4174 )
4175 );
4176 }
4177
4178 $query_id = isset($params['query']) && $params['query'] !== '' ? $params['query'] : '';
4179 if ( $query_id == '' ) {
4180 return array(
4181 'success' => false,
4182 'data' => array(
4183 'msg' => __( "No data given.", "chart-builder" )
4184 )
4185 );
4186 }
4187
4188 $chart_id = isset( $params['chart_id'] ) ? absint( $params['chart_id'] ) : 0;
4189 $quiz_id = isset($params['quizID']) && $params['quizID'] !== '' ? $params['quizID'] : 0;
4190 $user_id = get_current_user_id();
4191
4192 if ( $chart_id >= 0 ) {
4193
4194 $return_results = CBFunctions()->get_quiz_query($query_id, $quiz_id, $user_id);
4195
4196 if (empty($return_results)) {
4197 return array(
4198 'success' => false,
4199 'data' => array(
4200 'msg' => __( "Something went wrong.", "chart-builder" )
4201 )
4202 );
4203 }
4204
4205 $result_values = $return_results['result'];
4206 $query = $return_results['query'];
4207
4208 if (empty($result_values)) {
4209 return array(
4210 'success' => false,
4211 'data' => array(
4212 'msg' => $return_results['message']
4213 )
4214 );
4215 }
4216
4217 if ( !empty($result_values) && count($return_results['result'][0]) != 1 ) {
4218 $results = array();
4219 $headers = array();
4220 if ( $result_values ) {
4221 $row_num = 0;
4222 foreach ( $result_values as $row ) {
4223 $result = array();
4224 foreach ( $row as $k => $v ) {
4225 $result[] = $v;
4226 if ( $row_num === 0 ) {
4227 $headers[] = $k;
4228 }
4229 }
4230 $results[] = $result;
4231 $row_num++;
4232 }
4233 }
4234 } else if (count($return_results['result'][0]) == 1) {
4235 $results = array();
4236 $headers = array();
4237 if ( $result_values ) {
4238 $row_num = 0;
4239 foreach ( $result_values as $index => $row ) {
4240 $result = array();
4241 foreach ( $row as $k => $v ) {
4242 $result[] = strval($index) + 1;
4243 $result[] = $v;
4244 if ( $row_num === 0 ) {
4245 $headers[] = 'Quiz';
4246 $headers[] = $k;
4247 }
4248 }
4249 $results[] = $result;
4250 $row_num++;
4251 }
4252 }
4253 }
4254
4255 $source_type = 'quiz_maker';
4256 $option_name_for_data = $chart_id == 0 ? 'ays_chart_quiz_maker_results_temp' : 'ays_chart_quiz_maker_results_' . $chart_id;
4257 $option_name_for_quiz = $chart_id == 0 ? 'ays_chart_quiz_maker_quiz_data_temp' : 'ays_chart_quiz_maker_quiz_data_' . $chart_id;
4258
4259 update_option( $option_name_for_data, array(
4260 'source_type' => $source_type,
4261 'source' => $query,
4262 'data' => $results,
4263 ) );
4264 update_option( $option_name_for_quiz, array(
4265 'quiz_query' => $query_id,
4266 'quiz_id' => $quiz_id
4267 ) );
4268
4269 } else {
4270 return array(
4271 'success' => false,
4272 'data' => array(
4273 'msg' => __( 'Given incorrect Chart ID.', "chart-builder")
4274 )
4275 );
4276 }
4277
4278 return array(
4279 'success' => true,
4280 'data' => array(
4281 'msg' => __( 'Data was successfully saved.', "chart-builder" )
4282 )
4283 );
4284 }
4285
4286 /**
4287 * Chart page action hooks
4288 */
4289
4290 /**
4291 * Chart page sources contents
4292 * @param $args
4293 */
4294 public function ays_chart_page_source_contents( $args ){
4295 $chart_source_type = $args['chart_source_type'];
4296
4297 if ($chart_source_type === 'chart-js') {
4298 $sources_contents = apply_filters( 'ays_cb_chart_page_sources_contents_settings_chartjs', array(), $args );
4299 } else {
4300 $sources_contents = apply_filters( 'ays_cb_chart_page_sources_contents_settings', array(), $args );
4301 }
4302
4303 $source_type = $args['source_type'];
4304
4305 $sources = array();
4306 foreach ( $sources_contents as $key => $sources_content ) {
4307 $collapsed = $key == $source_type ? 'false' : 'true';
4308
4309 $content = '<fieldset class="ays-accordion-options-container" data-collapsed="'. $collapsed .'">';
4310 if( isset( $sources_content['title'] ) ){
4311 $content .= '<legend class="ays-accordion-options-header">';
4312 $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">
4313 <g>
4314 <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" />
4315 </g>
4316 </svg>';
4317
4318 $content .= '<span>'. $sources_content['title'] .'</span></legend>';
4319 }
4320
4321 $content .= '<div class="ays-accordion-options-content">';
4322 $content .= $sources_content['content'];
4323 $content .= '</div>';
4324
4325 $content .= '</fieldset>';
4326
4327 $sources[] = $content;
4328 }
4329 $content_for_escape = implode('' , $sources );
4330 echo html_entity_decode( esc_html($content_for_escape) );
4331 }
4332
4333 public function source_contents_import_from_csv_settings( $sources, $args ){
4334 $html_class_prefix = $args['html_class_prefix'];
4335 $html_name_prefix = $args['html_name_prefix'];
4336
4337 ob_start();
4338 ?>
4339 <div class="ays-accordion-data-main-wrap ays-pro-features-v2-main-box" style="padding:10px;">
4340 <div class="ays-pro-features-v2-big-buttons-box">
4341 <a href="https://www.youtube.com/watch?v=tZ8K3y0qOEY" target="_blank" class="ays-pro-features-v2-video-button">
4342 <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>
4343 <div class="ays-pro-features-v2-video-text">
4344 <?php echo esc_html__("Watch Video" , "chart-builder"); ?>
4345 </div>
4346 </a>
4347 <a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-pro-features-v2-upgrade-button">
4348 <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>
4349 <div class="ays-pro-features-v2-upgrade-text">
4350 <?php echo esc_html__("Upgrade" , "chart-builder"); ?>
4351 </div>
4352 </a>
4353 </div>
4354 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-main ays-accordion-data-main-wrap">
4355 <div class="<?php echo esc_attr($html_class_prefix) ?>file-import-form">
4356 <h6><?php echo esc_html__("Choose what kind of data would you like to upload.", "chart-builder"); ?></h6>
4357 <select class="form-select" style="max-width: none;" id="<?php echo esc_attr($html_class_prefix) ?>import-files-file-type">
4358 <option value="csv">CSV File</option>
4359 </select>
4360 <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>
4361 <p class="<?php echo esc_attr($html_class_prefix) ?>csv-export-example" style="font-size: 15px; font-style: italic;">Example:
4362 <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>
4363 </p>
4364 <div>
4365 <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" />
4366 </div>
4367 <div class='ays-chart-file-import-success'></div>
4368 <div class='ays-chart-file-import-error'></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-file-import-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-file-import-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-file-import-save">
4378 <?php echo esc_html__( 'Save data', "chart-builder" ); ?>
4379 </button>
4380 </div>
4381 </div>
4382 </div>
4383 </div>
4384 <?php
4385 $content = ob_get_clean();
4386
4387 $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") . '">
4388 <i class="ays_fa ays_fa_info_circle"></i>
4389 </a>';
4390
4391 $sources['file_import'] = array(
4392 'content' => $content,
4393 'title' => $title
4394 );
4395
4396 return $sources;
4397 }
4398
4399 public function source_contents_import_from_db_settings( $sources, $args ){
4400 $html_class_prefix = $args['html_class_prefix'];
4401 $html_name_prefix = $args['html_name_prefix'];
4402
4403 ob_start();
4404 ?>
4405 <div class="ays-accordion-data-main-wrap ays-pro-features-v2-main-box" style="padding:10px;">
4406 <div class="ays-pro-features-v2-big-buttons-box">
4407 <a href="https://www.youtube.com/watch?v=tZ8K3y0qOEY" target="_blank" class="ays-pro-features-v2-video-button">
4408 <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>
4409 <div class="ays-pro-features-v2-video-text">
4410 <?php echo esc_html__("Watch Video" , "chart-builder"); ?>
4411 </div>
4412 </a>
4413 <a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-pro-features-v2-upgrade-button">
4414 <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>
4415 <div class="ays-pro-features-v2-upgrade-text">
4416 <?php echo esc_html__("Upgrade" , "chart-builder"); ?>
4417 </div>
4418 </a>
4419 </div>
4420 <div class="<?php echo esc_attr( $html_class_prefix ) ?>source-data-main-wrap ays-accordion-data-main-wrap ">
4421 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-main">
4422 <div id="ays-chart-db-query">
4423 <div class="<?php echo esc_attr($html_class_prefix) ?>-db-query-form">
4424 <div id="db-query-form">
4425 <input type="hidden" name="chart_id" value="1">
4426 <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>
4427 <div class='db-wizard-success'></div>
4428 <div class='db-wizard-error'></div>
4429 </div>
4430 <div class="ays-chart-db-query-form-button ays-chart-buttons-group">
4431 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-query-fetch">
4432 <?php echo esc_html__( 'Show Results', "chart-builder" ); ?>
4433 </button>
4434 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-query-show-on-chart">
4435 <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>
4436 <?php echo esc_html__( 'Preview', "chart-builder" ); ?>
4437 </button>
4438 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-query-save">
4439 <?php echo esc_html__( 'Save data', "chart-builder" ); ?>
4440 </button>
4441 </div>
4442 </div>
4443 <div class="db-wizard-hints">
4444 <ul>
4445 <!-- <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> -->
4446 <li>
4447 <?php
4448 echo sprintf(
4449 /* translators: %1$s and %2$s are HTML span tags for styling. */
4450 esc_html__( 'Use %1$sControl+Space%2$s for autocompleting keywords or table names.', 'chart-builder' ),
4451 '<span class="ays-chart-emboss">',
4452 '</span>'
4453 );
4454 ?>
4455 </li>
4456 </ul>
4457 </div>
4458 </div>
4459 </div>
4460 </div>
4461 </div>
4462 <?php
4463 $content = ob_get_clean();
4464
4465 $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') . '">
4466 <i class="ays_fa ays_fa_info_circle"></i>
4467 </a>';
4468
4469 $sources['import_from_db'] = array(
4470 'content' => $content,
4471 'title' => $title
4472 );
4473
4474 return $sources;
4475 }
4476
4477 public function source_contents_import_from_external_db_settings( $sources, $args ){
4478 $html_class_prefix = $args['html_class_prefix'];
4479 $html_name_prefix = $args['html_name_prefix'];
4480
4481 ob_start();
4482 ?>
4483 <div class="ays-accordion-data-main-wrap ays-pro-features-v2-main-box" style="padding:10px;">
4484 <div class="ays-pro-features-v2-big-buttons-box">
4485 <a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-pro-features-v2-upgrade-button">
4486 <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>
4487 <div class="ays-pro-features-v2-upgrade-text">
4488 <?php echo esc_html__("Upgrade" , "chart-builder"); ?>
4489 </div>
4490 </a>
4491 </div>
4492 <div class="<?php echo esc_attr($html_class_prefix) ?>source-data-main-wrap ays-accordion-data-main-wrap ">
4493 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-main">
4494 <div class="form-group row mb-2">
4495 <div class="col-sm-8 <?php echo esc_attr($html_class_prefix) ?>option-title">
4496 <label class="form-label">
4497 <?php echo esc_html(__('Use custom database settings for this chart', "chart-builder")); ?>
4498 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __(".","chart-builder") ); ?>">
4499 <i class="ays_fa ays_fa_info_circle"></i>
4500 </a>
4501 </label>
4502 </div>
4503 <div class="col-sm-3 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
4504 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
4505 <input class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch" type="checkbox" />
4506 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
4507 </label>
4508 </div>
4509 </div>
4510 <div id="ays-chart-external-db-query">
4511 <div class="<?php echo esc_attr($html_class_prefix) ?>-db-query-form">
4512 <div id="external-db-query-form">
4513 <input type="hidden" name="chart_id" value="1">
4514 <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>
4515 <div class='db-wizard-success'></div>
4516 <div class='db-wizard-error'></div>
4517 </div>
4518 <div class="ays-chart-db-query-form-button ays-chart-buttons-group">
4519 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-external-query-fetch">
4520 <?php echo esc_html__( 'Show Results', "chart-builder" ); ?>
4521 </button>
4522 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-external-query-show-on-chart">
4523 <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>
4524 <?php echo esc_html__( 'Preview', "chart-builder" ); ?>
4525 </button>
4526 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-external-query-save">
4527 <?php echo esc_html__( 'Save data', "chart-builder" ); ?>
4528 </button>
4529 </div>
4530 </div>
4531 <div class="db-wizard-hints">
4532 <ul>
4533 <!-- <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> -->
4534 <li>
4535 <?php
4536 echo sprintf(
4537 /* translators: %1$s and %2$s are HTML span tags for styling. */
4538 esc_html__( 'Use %1$sControl+Space%2$s for autocompleting keywords or table names.', 'chart-builder' ),
4539 '<span class="ays-chart-emboss">',
4540 '</span>'
4541 );
4542 ?>
4543 </li>
4544 </ul>
4545 </div>
4546 </div>
4547 </div>
4548 </div>
4549 </div>
4550 <?php
4551 $content = ob_get_clean();
4552
4553 $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') . '">
4554 <i class="ays_fa ays_fa_info_circle"></i>
4555 </a>';
4556
4557 $sources['import_from_external_db'] = array(
4558 'content' => $content,
4559 'title' => $title
4560 );
4561
4562 return $sources;
4563 }
4564
4565 public function source_contents_quiz_maker_integration_settings( $sources, $args ){
4566 global $wpdb;
4567 $chart_id = $args['chart_id'];
4568 $html_class_prefix = $args['html_class_prefix'];
4569 $html_name_prefix = $args['html_name_prefix'];
4570 $source = $args['source'];
4571 $settings = $args['settings'];
4572 $quiz_queries = $args['quiz_queries'];
4573 $quiz_query_tooltips = $args['quiz_query_tooltips'];
4574 $quiz_id = $args['quiz_id'];
4575 $quiz_query = $args['quiz_query'];
4576
4577 if ( !is_plugin_active('quiz-maker/quiz-maker.php') ) {
4578 // $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") . '">
4579 // <i class="ays_fa ays_fa_info_circle"></i>
4580 // </a>', '<br>', '<b>', '</b>');
4581 // $content = $this->blockquote_content_quiz;
4582 // $sources['quiz_maker'] = array(
4583 // 'content' => $content,
4584 // 'title' => $title
4585 // );
4586
4587 return $sources;
4588 }
4589 $quizes = $wpdb->get_results( // phpcs:ignore
4590 $wpdb->prepare(
4591 "SELECT `title`, `id` FROM {$wpdb->prefix}aysquiz_quizes
4592 WHERE `published` = %d AND `question_ids` <> %s",
4593 1,
4594 ''
4595 ),
4596 ARRAY_A
4597 );
4598
4599
4600 ob_start();
4601 ?>
4602 <div class="ays-accordion-data-main-wrap">
4603 <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">
4604 <div id="<?php echo esc_attr($html_class_prefix) ?>quiz-maker-form">
4605 <input type="hidden" class="<?php echo esc_attr($html_class_prefix) ?>chart-id" value="<?php echo esc_attr($chart_id) ?>">
4606 <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">
4607 <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' ) ?>">
4608 <i class="ays_fa ays_fa_info_circle"></i>
4609 </a>
4610 <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">
4611 <option value=""><?php echo esc_html__( "Select query", "chart-builder" ) ?></option>
4612 <?php foreach ( $quiz_queries as $id => $q):
4613 $disabled = preg_replace('/[^0-9]/', '', $id) <= 6 ? "false" : "true" ; ?>
4614 <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>
4615 <?php endforeach; ?>
4616 </select>
4617 </div>
4618 <div class="<?php echo esc_attr($html_class_prefix) ?>select-quiz-maker-quiz-container">
4619 <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">
4620 <option value="0"><?php echo esc_html__( "Select quiz", "chart-builder" ) ?></option>
4621 <?php foreach ( $quizes as $quiz): ?>
4622 <option value="<?php echo esc_attr($quiz['id']) ?>" <?php echo $quiz_id == $quiz['id'] ? 'selected' : '' ?> ><?php echo esc_html($quiz['title'] )?></option>
4623 <?php endforeach; ?>
4624 </select>
4625 </div>
4626 <div id="ays-chart-quiz-maker-success"></div>
4627 <div id="ays-chart-quiz-maker-error"></div>
4628 <div class="ays-chart-buttons-group">
4629 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-quiz-maker-fetch">
4630 <?php echo esc_html__( 'Show Results', "chart-builder" ); ?>
4631 </button>
4632 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-quiz-maker-show-on-chart">
4633 <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>
4634 <?php echo esc_html__( 'Preview', "chart-builder" ); ?>
4635 </button>
4636 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-quiz-maker-save">
4637 <?php echo esc_html__( 'Save data', "chart-builder" ); ?>
4638 </button>
4639 </div>
4640 </div>
4641 <div>
4642 <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>
4643 </div>
4644 </div>
4645 </div>
4646 <?php
4647 $content = ob_get_clean();
4648
4649 $title = sprintf(
4650 /* translators: %1$s: Line break, %2$s: Opening bold tag, %3$s: Closing bold tag. */
4651 __( 'Get Quiz Maker data', 'chart-builder' ) .
4652 ' <a class="ays_help" data-bs-toggle="tooltip" data-bs-html="true" title="' .
4653 /* translators: %1$s: Line break, %2$s: Opening bold tag, %3$s: Closing bold tag. */
4654 __( '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' ) . '">
4655 <i class="ays_fa ays_fa_info_circle"></i>
4656 </a>',
4657 '<br>', '<b>', '</b>'
4658 );
4659 $sources['quiz_maker'] = array(
4660 'content' => $content,
4661 'title' => $title
4662 );
4663
4664 return $sources;
4665 }
4666
4667 public function source_contents_woocommerce_integration_settings( $sources, $args ){
4668 if ( !is_plugin_active('woocommerce/woocommerce.php') ) {
4669 return $sources;
4670 }
4671
4672 $chart_id = $args['chart_id'];
4673 $html_class_prefix = $args['html_class_prefix'];
4674 $html_name_prefix = $args['html_name_prefix'];
4675 ob_start();
4676 ?>
4677 <div class="ays-accordion-data-main-wrap ays-accordion-data-main-wrap-woocommerce ays-pro-features-v2-main-box" style="padding:10px;">
4678 <div class="ays-pro-features-v2-big-buttons-box">
4679 <div class="ays-pro-features-v2-video-button"></div>
4680 <a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-pro-features-v2-upgrade-button">
4681 <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>
4682 <div class="ays-pro-features-v2-upgrade-text">
4683 <?php echo esc_html__("Upgrade" , "chart-builder"); ?>
4684 </div>
4685 </a>
4686 </div>
4687 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-main ays-accordion-data-main-wrap ">
4688 <div id="ays-chart-woocommerce-datas">
4689 <div class="<?php echo esc_attr($html_class_prefix) ?>woocommerce-datas-form">
4690 <div id="woocommerce-datas-form">
4691 <input type="hidden" name="chart_id" value="<?php echo esc_attr( $chart_id )?>">
4692 <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" >
4693 <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' ) ?>">
4694 <i class="ays_fa ays_fa_info_circle"></i>
4695 </a>
4696 <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]">
4697 <option value=""><?php echo esc_html__( 'Select query', 'chart-builder') ?></option>
4698 </select>
4699 </div>
4700 <div class='ays-chart-woocommerce-datas-success'></div>
4701 <div class='ays-chart-woocommerce-datas-error'></div>
4702 </div>
4703 <div class="ays-chart-buttons-group">
4704 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-woocommerce-datas-fetch">
4705 <?php echo esc_html__( 'Show Results', "chart-builder" ); ?>
4706 </button>
4707 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-woocommerce-datas-show-on-chart">
4708 <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>
4709 <?php echo esc_html__( 'Preview', "chart-builder" ); ?>
4710 </button>
4711 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns" id="ays-chart-woocommerce-datas-save">
4712 <?php echo esc_html__( 'Save data', "chart-builder" ); ?>
4713 </button>
4714 </div>
4715 </div>
4716 </div>
4717 </div>
4718 </div>
4719 <?php
4720 $content = ob_get_clean();
4721
4722 $title = sprintf(
4723 /* translators: %1$s: Line break, %2$s: Opening bold tag, %3$s: Closing bold tag. */
4724 esc_html__( 'Get WooCommerce data', 'chart-builder' ) .
4725 ' <a class="ays_help" data-bs-toggle="tooltip" data-bs-html="true" title="' .
4726 /* translators: %1$s: Line break, %2$s: Opening bold tag, %3$s: Closing bold tag. */
4727 __( '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' ) . '">
4728 <i class="ays_fa ays_fa_info_circle"></i>
4729 </a>',
4730 '<br>', '<b>', '</b>'
4731 );
4732 $sources['woocommerce'] = array(
4733 'content' => $content,
4734 'title' => $title
4735 );
4736
4737 return $sources;
4738 }
4739
4740 public function source_contents_manual_settings( $sources, $args ){
4741 $html_class_prefix = $args['html_class_prefix'];
4742 $html_name_prefix = $args['html_name_prefix'];
4743 $source = $args['source'];
4744 $source = isset($source["commonTypeCharts"]) ? $source["commonTypeCharts"] : $source;
4745 $settings = $args['settings'];
4746 $source_chart_type = $args['source_chart_type'];
4747 // phpcs:ignore WordPress.Security.NonceVerification.Recommended
4748 $action = isset($_GET['action']) ? sanitize_text_field(wp_unslash($_GET['action'])) : 'add';
4749
4750 if (isset($source) && !empty($source)) {
4751 if ( !isset( $source[0] ) ) {
4752 if (count($source[1]) > 2) {
4753 $titles = array();
4754 for ($i = 0; $i < count($source[1]); $i++) {
4755 array_push($titles, __("Title", 'chart-builder').$i);
4756 }
4757 $source[0] = $titles;
4758 } else {
4759 $source[0] = array(
4760 __("Country", 'chart-builder'),
4761 __("Population", 'chart-builder'),
4762 );
4763 }
4764
4765 ksort($source);
4766 }
4767 }
4768
4769 if ($action == 'add') {
4770 foreach ($source as $key => $row) {
4771 $source[$key] = array_slice($row, 0, 2);
4772 }
4773 } else if ($action == 'edit') {
4774 if ($source_chart_type == 'pie_chart' || $source_chart_type == 'donut_chart') {
4775 foreach ($source as $key => $row) {
4776 $source[$key] = array_slice($row, 0, 2);
4777 }
4778 }
4779 }
4780 ob_start();
4781 ?>
4782 <div class="ays-accordion-data-main-wrap">
4783 <div class="<?php echo esc_attr($html_class_prefix) ?>source-data-main-wrap">
4784 <?php if($source_chart_type != 'org_chart'): ?>
4785 <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">
4786 <!-- <div class="<//?= $html_class_prefix ?>icons-box">
4787 <img class="<//?= $html_class_prefix ?>add-new-row" src="<//?php echo CHART_BUILDER_ADMIN_URL; ?>/images/icons/add-circle-outline.svg">
4788 </div> -->
4789 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-content-container">
4790 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-content">
4791 <?php if(!empty($source)):
4792 foreach($source as $source_id => $source_value):
4793 if(!empty($source_value) ):
4794 if ($source_id == 0): ?>
4795 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-edit-block" data-source-id = "<?php echo esc_attr($source_id); ?>">
4796 <div class="ays-chart-empty-data-table-cell"></div>
4797 <?php foreach($source_value as $each_source_id => $each_source_value): ?>
4798 <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); ?>">
4799 <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">
4800 <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;" />
4801 </svg>
4802 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-titles-box-item">
4803 <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'" : "" ?>>
4804 <?php if ($each_source_id !== 0): ?>
4805 <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">
4806 <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;" />
4807 </svg>
4808 <?php endif; ?>
4809 </div>
4810 </div>
4811 <?php endforeach; ?>
4812 </div>
4813 <?php else: ?>
4814 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-edit-block" data-source-id = "<?php echo esc_attr($source_id); ?>">
4815 <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">
4816 <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512">
4817 <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;" />
4818 </svg>
4819 </div>
4820 <div class="<?php echo esc_attr($html_class_prefix) ?>icons-box <?php echo esc_attr($html_class_prefix) ?>icons-remove-box">
4821 <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">
4822 <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;" />
4823 </svg>
4824 </div>
4825 <?php foreach($source_value as $each_source_id => $each_source_value): ?>
4826 <?php if ($each_source_id == 0): ?>
4827 <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); ?>">
4828 <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)); ?>">
4829 </div>
4830 <?php else: ?>
4831 <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); ?>">
4832 <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">
4833 </div>
4834 <?php endif; ?>
4835 <?php endforeach; ?>
4836 </div>
4837 <?php endif; ?>
4838 <?php endif; ?>
4839 <?php endforeach; ?>
4840 <?php else:?>
4841 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-edit-block">
4842 <div style="height: 63.11px; padding: 0 15px;"></div>
4843 <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">
4844 <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">
4845 <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;" />
4846 </svg>
4847 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-titles-box-item">
4848 <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'>
4849 <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">
4850 <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;" />
4851 </svg>
4852 </div>
4853 </div>
4854 </div>
4855 <div class = "<?php echo esc_attr($html_class_prefix) ?>chart-source-data-edit-block" data-source-id="1">
4856 <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">
4857 <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512">
4858 <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" />
4859 </svg>
4860 </div>
4861 <div class="<?php echo esc_attr($html_class_prefix) ?>icons-box <?php echo esc_attr($html_class_prefix) ?>icons-remove-box" >
4862 <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">
4863 <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;" />
4864 </svg>
4865 </div>
4866 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-input-box">
4867 <input type="text" class="ays-text-input form-control" name="<?php echo esc_attr($html_name_prefix); ?>chart_source_data[1][]" >
4868 </div>
4869 <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">
4870 <input type="number" class="ays-text-input form-control" name="<?php echo esc_attr($html_name_prefix); ?>chart_source_data[1][]" step="any">
4871 </div>
4872 </div>
4873 <?php endif; ?>
4874 </div>
4875 <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">
4876 <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">
4877 <?php echo esc_html__( 'Add column', "chart-builder" ); ?>
4878 </div>
4879 </div>
4880 <div class="<?php echo esc_attr($html_class_prefix) ?>icons-box <?php echo esc_attr($html_class_prefix) ?>add-new-row-box">
4881 <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">
4882 <?php echo esc_html__( 'Add row', "chart-builder" ); ?>
4883 </div>
4884 <br>
4885 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns <?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttn">
4886 <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>
4887 <?php echo esc_html__( 'Preview', "chart-builder" ); ?>
4888 </button>
4889 </div>
4890 <?php endif; ?>
4891 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-main-org-type display_none cb-changable-manual cb-org_chart-manual">
4892 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-content-org-type">
4893 <ul id="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-edit-tree-content">
4894 </ul>
4895 </div>
4896 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns <?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttn">
4897 <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>
4898 <?php echo esc_html__( 'Preview', "chart-builder" ); ?>
4899 </button>
4900 </div>
4901 </div>
4902 </div>
4903 <?php
4904 $content = ob_get_clean();
4905
4906 $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") . '">
4907 <i class="ays_fa ays_fa_info_circle"></i>
4908 </a>';
4909
4910 $sources['manual'] = array(
4911 'content' => $content,
4912 'title' => $title
4913 );
4914
4915 return $sources;
4916 }
4917
4918 public function source_contents_manual_settings_chartjs( $sources, $args ){
4919 $html_class_prefix = $args['html_class_prefix'];
4920 $html_name_prefix = $args['html_name_prefix'];
4921 $source = $args['source'];
4922 $source = isset($source["commonTypeCharts"]) ? $source["commonTypeCharts"] : $source;
4923 $settings = $args['settings'];
4924 $source_chart_type = $args['source_chart_type'];
4925 // phpcs:ignore WordPress.Security.NonceVerification.Recommended
4926 $action = isset($_GET['action']) ? sanitize_text_field((wp_unslash($_GET['action']))) : 'add';
4927
4928 ob_start();
4929 ?>
4930 <div class="ays-accordion-data-main-wrap">
4931 <div class="<?php echo esc_attr($html_class_prefix) ?>source-data-main-wrap">
4932 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-main <?php echo esc_attr($html_class_prefix) ?>chart-source-data-manual">
4933 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-content-container">
4934 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-content">
4935 <?php if(!empty($source)):
4936 foreach($source as $source_id => $source_value):
4937 if(!empty($source_value) ):
4938 if ($source_id == 0): ?>
4939 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-edit-block" data-source-id = "<?php echo esc_attr($source_id); ?>">
4940 <div class="ays-chart-empty-data-table-cell"></div>
4941 <?php foreach($source_value as $each_source_id => $each_source_value): ?>
4942 <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); ?>">
4943 <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">
4944 <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;" />
4945 </svg>
4946 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-titles-box-item">
4947 <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'" : "" ?>>
4948 <?php if ($each_source_id !== 0): ?>
4949 <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">
4950 <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;" />
4951 </svg>
4952 <?php endif; ?>
4953 </div>
4954 </div>
4955 <?php endforeach; ?>
4956 </div>
4957 <?php else: ?>
4958 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-edit-block" data-source-id = "<?php echo esc_attr($source_id); ?>">
4959 <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">
4960 <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512">
4961 <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;" />
4962 </svg>
4963 </div>
4964 <div class="<?php echo esc_attr($html_class_prefix) ?>icons-box <?php echo esc_attr($html_class_prefix) ?>icons-remove-box">
4965 <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">
4966 <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;" />
4967 </svg>
4968 </div>
4969 <?php foreach($source_value as $each_source_id => $each_source_value): ?>
4970 <?php if ($each_source_id == 0): ?>
4971 <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); ?>">
4972 <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)); ?>">
4973 </div>
4974 <?php else: ?>
4975 <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); ?>">
4976 <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">
4977 </div>
4978 <?php endif; ?>
4979 <?php endforeach; ?>
4980 </div>
4981 <?php endif; ?>
4982 <?php endif; ?>
4983 <?php endforeach; ?>
4984 <?php else:?>
4985 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-edit-block">
4986 <div style="height: 63.11px; padding: 0 15px;"></div>
4987 <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">
4988 <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">
4989 <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;" />
4990 </svg>
4991 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-titles-box-item">
4992 <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'>
4993 <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">
4994 <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;" />
4995 </svg>
4996 </div>
4997 </div>
4998 </div>
4999 <div class = "<?php echo esc_attr($html_class_prefix) ?>chart-source-data-edit-block" data-source-id="1">
5000 <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">
5001 <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512">
5002 <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" />
5003 </svg>
5004 </div>
5005 <div class="<?php echo esc_attr($html_class_prefix) ?>icons-box <?php echo esc_attr($html_class_prefix) ?>icons-remove-box" >
5006 <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">
5007 <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;" />
5008 </svg>
5009 </div>
5010 <div class="<?php echo esc_attr($html_class_prefix) ?>chart-source-data-input-box">
5011 <input type="text" class="ays-text-input form-control" name="<?php echo esc_attr($html_name_prefix); ?>chart_source_data[1][]" >
5012 </div>
5013 <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">
5014 <input type="number" class="ays-text-input form-control" name="<?php echo esc_attr($html_name_prefix); ?>chart_source_data[1][]" step="any">
5015 </div>
5016 </div>
5017 <?php endif; ?>
5018 </div>
5019 <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">
5020 <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">
5021 <?php echo esc_html__( 'Add column', "chart-builder" ); ?>
5022 </div>
5023 </div>
5024 <div class="<?php echo esc_attr($html_class_prefix) ?>icons-box <?php echo esc_attr($html_class_prefix) ?>add-new-row-box">
5025 <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">
5026 <?php echo esc_html__( 'Add row', "chart-builder" ); ?>
5027 </div>
5028 <br>
5029 <button class="<?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttns <?php echo esc_attr($html_class_prefix) ?>show-on-chart-bttn">
5030 <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>
5031 <?php echo esc_html__( 'Preview', "chart-builder" ); ?>
5032 </button>
5033 </div>
5034 </div>
5035 </div>
5036 <?php
5037 $content = ob_get_clean();
5038
5039 $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") . '">
5040 <i class="ays_fa ays_fa_info_circle"></i>
5041 </a>';
5042
5043 $sources['manual'] = array(
5044 'content' => $content,
5045 'title' => $title
5046 );
5047
5048 return $sources;
5049 }
5050
5051 /**
5052 * Chart page settings contents
5053 * @param $args
5054 */
5055 public function ays_chart_page_settings_contents( $args ){
5056 $chart_source_type = $args['chart_source_type'];
5057
5058 if ($chart_source_type === 'chart-js') {
5059 $sources_contents = apply_filters( 'ays_cb_chart_page_settings_contents_settings_chartjs', array(), $args );
5060 } else {
5061 $sources_contents = apply_filters( 'ays_cb_chart_page_settings_contents_settings', array(), $args );
5062 }
5063
5064 $sources = array();
5065 foreach ( $sources_contents as $key => $sources_content ) {
5066 $collapsed = $key == 'general_settings' ? 'false' : 'true';
5067
5068 $content = '<fieldset class="ays-accordion-options-container" data-collapsed="' . $collapsed . '">';
5069 if(isset($sources_content['title'])){
5070 $content .= '<legend class="ays-accordion-options-header">';
5071 $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">
5072 <g>
5073 <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" />
5074 </g>
5075 </svg>';
5076
5077 $content .= '<span>'. esc_html($sources_content['title']) .'</span></legend>';
5078 }
5079
5080 $content .= '<div class="ays-accordion-options-content">';
5081 $content .= $sources_content['content'];
5082 $content .= '</div>';
5083
5084 $content .= '</fieldset>';
5085
5086 $sources[] = $content;
5087 }
5088 $content_for_escape = implode('' , $sources );
5089 echo html_entity_decode( $content_for_escape );
5090 }
5091
5092 public function settings_contents_general_settings( $sources, $args ){
5093 $html_class_prefix = $args['html_class_prefix'];
5094 $html_name_prefix = $args['html_name_prefix'];
5095 $chart_description = $args['chart_description'];
5096 $create_author_data = $args['create_author_data'];
5097 $status = $args['status'];
5098 $settings = $args['settings'];
5099
5100 $show_title = $settings['show_title'];
5101 $show_description = $settings['show_description'];
5102 $enable_interactivity = $settings['enable_interactivity'];
5103 $maximized_view = $settings['maximized_view'];
5104
5105 ob_start();
5106 ?>
5107 <div class="ays-accordion-data-main-wrap">
5108 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
5109 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5110 <div class="col-sm-5 <?php echo esc_attr($html_class_prefix) ?>option-title">
5111 <label for="ays-status" class="form-label">
5112 <?php echo esc_html(__('Status', "chart-builder")); ?>
5113 <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") ); ?>">
5114 <i class="ays_fa ays_fa_info_circle"></i>
5115 </a>
5116 </label>
5117 </div>
5118 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5119 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5120 <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' : ''; ?> >
5121 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5122 </label>
5123 </div>
5124 </div> <!-- Status -->
5125 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5126 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5127 <label for="ays-chart-description" class="form-label">
5128 <?php echo esc_html(__( "Description", "chart-builder" )); ?>
5129 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Set the chart description","chart-builder") ); ?>">
5130 <i class="ays_fa ays_fa_info_circle"></i>
5131 </a>
5132 </label>
5133 </div>
5134 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5135 <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>
5136 </div>
5137 </div> <!-- Chart description -->
5138 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5139 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5140 <label for="ays-chart-create-author" class="form-label">
5141 <?php echo esc_html(__('Change the author of the current chart',"chart-builder")); ?>
5142 <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")); ?>">
5143 <i class="ays_fa ays_fa_info_circle"></i>
5144 </a>
5145 </label>
5146 </div>
5147 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5148 <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">
5149 <option value=""><?php echo esc_html(__('Select User',"chart-builder"))?></option>
5150 <?php if (isset($create_author_data['ID'])) : ?>
5151 <option value="<?php echo esc_html($create_author_data['ID'])?>" selected><?php echo esc_html($create_author_data['display_name'])?></option>
5152 <?php endif; ?>
5153 </select>
5154 </div>
5155 </div> <!-- Change chart author -->
5156 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5157 <div class="col-sm-5 <?php echo esc_attr($html_class_prefix) ?>option-title">
5158 <label for="ays-chart-show-title" class="form-label">
5159 <?php echo esc_html(__('Show chart title', "chart-builder")); ?>
5160 <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") ); ?>">
5161 <i class="ays_fa ays_fa_info_circle"></i>
5162 </a>
5163 </label>
5164 </div>
5165 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5166 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5167 <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); ?> >
5168 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5169 </label>
5170 </div>
5171 </div> <!-- Show title -->
5172 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5173 <div class="col-sm-5 <?php echo esc_attr($html_class_prefix) ?>option-title">
5174 <label for="ays-chart-show-description" class="form-label">
5175 <?php echo esc_html(__('Show chart description', "chart-builder")); ?>
5176 <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") ); ?>">
5177 <i class="ays_fa ays_fa_info_circle"></i>
5178 </a>
5179 </label>
5180 </div>
5181 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5182 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5183 <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); ?> >
5184 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5185 </label>
5186 </div>
5187 </div> <!-- Show description -->
5188 <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">
5189 <div class="col-sm-5 <?php echo esc_attr($html_class_prefix) ?>option-title">
5190 <label for="ays-chart-option-enable-interactivity" class="form-label">
5191 <?php echo esc_html(__('Enable interactivity', "chart-builder")); ?>
5192 <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") ); ?>">
5193 <i class="ays_fa ays_fa_info_circle"></i>
5194 </a>
5195 </label>
5196 </div>
5197 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5198 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5199 <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); ?> >
5200 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5201 </label>
5202 </div>
5203 </div> <!-- Enable interactivity -->
5204 <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">
5205 <div class="col-sm-5 <?php echo esc_attr($html_class_prefix) ?>option-title">
5206 <label for="ays-chart-option-maximized-view" class="form-label">
5207 <?php echo esc_html(__('Maximized view', "chart-builder")); ?>
5208 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("If checked, maximizes the area of the chart.","chart-builder") ); ?>">
5209 <i class="ays_fa ays_fa_info_circle"></i>
5210 </a>
5211 </label>
5212 </div>
5213 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5214 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5215 <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); ?> >
5216 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5217 </label>
5218 </div>
5219 </div> <!-- Maximized view -->
5220 </div>
5221 </div>
5222 <?php
5223 $content = ob_get_clean();
5224
5225 $title = __( 'General Settings', "chart-builder" );
5226
5227 $sources['general_settings'] = array(
5228 'content' => $content,
5229 'title' => $title
5230 );
5231
5232 return $sources;
5233 }
5234
5235 public function settings_contents_general_settings_chartjs( $sources, $args ){
5236 $html_class_prefix = $args['html_class_prefix'];
5237 $html_name_prefix = $args['html_name_prefix'];
5238 $chart_description = $args['chart_description'];
5239 $create_author_data = $args['create_author_data'];
5240 $status = $args['status'];
5241 $settings = $args['settings'];
5242
5243 $show_title = $settings['show_title'];
5244 $show_description = $settings['show_description'];
5245
5246 ob_start();
5247 ?>
5248 <div class="ays-accordion-data-main-wrap">
5249 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
5250 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5251 <div class="col-sm-5 <?php echo esc_attr($html_class_prefix) ?>option-title">
5252 <label for="ays-status" class="form-label">
5253 <?php echo esc_html(__('Status', "chart-builder")); ?>
5254 <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") ); ?>">
5255 <i class="ays_fa ays_fa_info_circle"></i>
5256 </a>
5257 </label>
5258 </div>
5259 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5260 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5261 <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' : ''; ?> >
5262 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5263 </label>
5264 </div>
5265 </div> <!-- Status -->
5266 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5267 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5268 <label for="ays-chart-description" class="form-label">
5269 <?php echo esc_html(__( "Description", "chart-builder" )); ?>
5270 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Set the chart description","chart-builder") ); ?>">
5271 <i class="ays_fa ays_fa_info_circle"></i>
5272 </a>
5273 </label>
5274 </div>
5275 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5276 <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>
5277 </div>
5278 </div> <!-- Chart description -->
5279 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5280 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5281 <label for="ays-chart-create-author" class="form-label">
5282 <?php echo esc_html(__('Change the author of the current chart',"chart-builder")); ?>
5283 <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")); ?>">
5284 <i class="ays_fa ays_fa_info_circle"></i>
5285 </a>
5286 </label>
5287 </div>
5288 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5289 <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">
5290 <option value=""><?php echo esc_html(__('Select User',"chart-builder"))?></option>
5291 <?php if (isset($create_author_data['ID'])) : ?>
5292 <option value="<?php echo esc_html($create_author_data['ID'])?>" selected><?php echo esc_html($create_author_data['display_name'])?></option>
5293 <?php endif; ?>
5294 </select>
5295 </div>
5296 </div> <!-- Change chart author -->
5297 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5298 <div class="col-sm-5 <?php echo esc_attr($html_class_prefix) ?>option-title">
5299 <label for="ays-chart-show-title" class="form-label">
5300 <?php echo esc_html(__('Show chart title', "chart-builder")); ?>
5301 <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") ); ?>">
5302 <i class="ays_fa ays_fa_info_circle"></i>
5303 </a>
5304 </label>
5305 </div>
5306 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5307 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5308 <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); ?> >
5309 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5310 </label>
5311 </div>
5312 </div> <!-- Show title -->
5313 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5314 <div class="col-sm-5 <?php echo esc_attr($html_class_prefix) ?>option-title">
5315 <label for="ays-chart-show-description" class="form-label">
5316 <?php echo esc_html(__('Show chart description', "chart-builder")); ?>
5317 <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") ); ?>">
5318 <i class="ays_fa ays_fa_info_circle"></i>
5319 </a>
5320 </label>
5321 </div>
5322 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5323 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5324 <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); ?> >
5325 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5326 </label>
5327 </div>
5328 </div> <!-- Show description -->
5329 </div>
5330 </div>
5331 <?php
5332 $content = ob_get_clean();
5333
5334 $title = __( 'General Settings', "chart-builder" );
5335
5336 $sources['general_settings'] = array(
5337 'content' => $content,
5338 'title' => $title
5339 );
5340
5341 return $sources;
5342 }
5343
5344 public function settings_contents_tooltip_settings( $sources, $args ){
5345 $html_class_prefix = $args['html_class_prefix'];
5346 $html_name_prefix = $args['html_name_prefix'];
5347 $settings = $args['settings'];
5348
5349 $tooltip_trigger_options = $settings['tooltip_trigger_options'];
5350 $tooltip_trigger = $settings['tooltip_trigger'];
5351 $show_color_code = $settings['show_color_code'];
5352 $tooltip_italic = $settings['tooltip_italic'];
5353 $tooltip_bold = $settings['tooltip_bold'];
5354 $tooltip_bold_options = $settings['tooltip_bold_options'];
5355 $tooltip_text_color = $settings['tooltip_text_color'];
5356 $tooltip_font_size = $settings['tooltip_font_size'];
5357
5358 ob_start();
5359 ?>
5360 <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">
5361 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
5362 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5363 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5364 <label for="ays-chart-option-tooltip-trigger">
5365 <?php echo esc_html(__( "Trigger", "chart-builder" )); ?>
5366 <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") )); ?>">
5367 <i class="ays_fa ays_fa_info_circle"></i>
5368 </a>
5369 </label>
5370 </div>
5371 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5372 <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]">
5373 <?php
5374 foreach ( $tooltip_trigger_options as $option_slug => $option ):
5375 $selected = ( $tooltip_trigger == $option_slug ) ? 'selected' : '';
5376 ?>
5377 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
5378 <?php
5379 endforeach;
5380 ?>
5381 </select>
5382 </div>
5383 </div> <!-- Trigger -->
5384 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5385 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5386 <label for="ays-chart-option-show-color-code">
5387 <?php echo esc_html(__( "Show Color Code", "chart-builder" )); ?>
5388 <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") ); ?>">
5389 <i class="ays_fa ays_fa_info_circle"></i>
5390 </a>
5391 </label>
5392 </div>
5393 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5394 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5395 <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); ?> >
5396 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5397 </label>
5398 </div>
5399 </div> <!-- Show Color Code -->
5400 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5401 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5402 <label for="ays-chart-option-tooltip-text-color">
5403 <?php echo esc_html(__( "Text color", "chart-builder" )); ?>
5404 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the tooltip text.","chart-builder") ); ?>">
5405 <i class="ays_fa ays_fa_info_circle"></i>
5406 </a>
5407 </label>
5408 </div>
5409 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5410 <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) ?>">
5411 </div>
5412 </div> <!-- Text color -->
5413 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5414 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5415 <label for="ays-chart-option-tooltip-font-size" class="form-label">
5416 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
5417 <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") )); ?>">
5418 <i class="ays_fa ays_fa_info_circle"></i>
5419 </a>
5420 </label>
5421 </div>
5422 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5423 <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) ?>">
5424 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
5425 </div>
5426 </div> <!-- Font size -->
5427 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5428 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5429 <label for="ays-chart-option-tooltip-italic">
5430 <?php echo esc_html(__( "Italic text", "chart-builder" )); ?>
5431 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable this option to make chart tooltip text italic.","chart-builder") ); ?>">
5432 <i class="ays_fa ays_fa_info_circle"></i>
5433 </a>
5434 </label>
5435 </div>
5436 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5437 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5438 <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); ?> >
5439 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5440 </label>
5441 </div>
5442 </div> <!-- Italic text -->
5443 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5444 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5445 <label for="ays-chart-option-tooltip-bold">
5446 <?php echo esc_html(__( "Bold text", "chart-builder" )); ?>
5447 <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") )); ?>">
5448 <i class="ays_fa ays_fa_info_circle"></i>
5449 </a>
5450 </label>
5451 </div>
5452 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5453 <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]">
5454 <?php
5455 foreach ( $tooltip_bold_options as $option_slug => $option ):
5456 $selected = ( $tooltip_bold == $option_slug ) ? 'selected' : '';
5457 ?>
5458 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
5459 <?php
5460 endforeach;
5461 ?>
5462 </select>
5463 </div>
5464 </div> <!-- Bold text -->
5465 </div>
5466 </div>
5467 <?php
5468 $content = ob_get_clean();
5469
5470 $title = __( 'Tooltip', "chart-builder" );
5471
5472 $sources['tooltip'] = array(
5473 'content' => $content,
5474 'title' => $title
5475 );
5476
5477 return $sources;
5478 }
5479
5480 public function settings_contents_tooltip_settings_chartjs( $sources, $args ){
5481 $html_class_prefix = $args['html_class_prefix'];
5482 $html_name_prefix = $args['html_name_prefix'];
5483 $settings = $args['settings'];
5484
5485 $tooltip_text_color = $settings['tooltip_text_color'];
5486 $show_color_code = $settings['show_color_code'];
5487 $tooltip_italic = $settings['tooltip_italic'];
5488
5489 ob_start();
5490 ?>
5491 <div class="ays-accordion-data-main-wrap ">
5492 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
5493 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5494 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5495 <label for="ays-chart-option-show-color-code">
5496 <?php echo esc_html(__( "Show Color Code", "chart-builder" )); ?>
5497 <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") ); ?>">
5498 <i class="ays_fa ays_fa_info_circle"></i>
5499 </a>
5500 </label>
5501 </div>
5502 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5503 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5504 <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); ?> >
5505 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5506 </label>
5507 </div>
5508 </div> <!-- Show Color Code -->
5509 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5510 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5511 <label for="ays-chart-option-tooltip-text-color">
5512 <?php echo esc_html(__( "Text color", "chart-builder" )); ?>
5513 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the tooltip text.","chart-builder") ); ?>">
5514 <i class="ays_fa ays_fa_info_circle"></i>
5515 </a>
5516 </label>
5517 </div>
5518 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5519 <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) ?>">
5520 </div>
5521 </div> <!-- Text color -->
5522 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5523 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5524 <label for="ays-chart-option-tooltip-italic">
5525 <?php echo esc_html(__( "Italic text", "chart-builder" )); ?>
5526 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable this option to make chart tooltip text italic.","chart-builder") ); ?>">
5527 <i class="ays_fa ays_fa_info_circle"></i>
5528 </a>
5529 </label>
5530 </div>
5531 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5532 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5533 <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); ?> >
5534 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5535 </label>
5536 </div>
5537 </div> <!-- Italic text -->
5538 </div>
5539 </div>
5540 <?php
5541 $content = ob_get_clean();
5542
5543 $title = __( 'Tooltip', "chart-builder" );
5544
5545 $sources['tooltip'] = array(
5546 'content' => $content,
5547 'title' => $title
5548 );
5549
5550 return $sources;
5551 }
5552
5553 public function settings_contents_legend_settings( $sources, $args ){
5554 $html_class_prefix = $args['html_class_prefix'];
5555 $html_name_prefix = $args['html_name_prefix'];
5556 $settings = $args['settings'];
5557 $legend_positions = $settings['legend_positions'];
5558 $legend_position = $settings['legend_position'];
5559 $legend_alignments = $settings['legend_alignments'];
5560 $legend_alignment = $settings['legend_alignment'];
5561 $legend_color = $settings['legend_color'];
5562 $legend_font_size = $settings['legend_font_size'];
5563 $legend_bold = $settings['legend_bold'];
5564 $legend_italic = $settings['legend_italic'];
5565
5566 ob_start();
5567 ?>
5568 <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">
5569 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
5570 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5571 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5572 <label for="ays-chart-option-legend-position">
5573 <?php echo esc_html(__( "Position", "chart-builder" )); ?>
5574 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr(htmlspecialchars( __("Choose the appropriate position for the chart legend.","chart-builder") )); ?>">
5575 <i class="ays_fa ays_fa_info_circle"></i>
5576 </a>
5577 </label>
5578 </div>
5579 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5580 <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]">
5581 <?php
5582 foreach ( $legend_positions as $option_slug => $option ):
5583 $selected = ( $legend_position == $option_slug ) ? 'selected' : '';
5584
5585 $type_class = '';
5586 if ($option_slug == 'left') {
5587 $type_class = ' cb-changable-opt cb-pie_chart-opt cb-donut_chart-opt ';
5588 } else if ($option_slug == 'in') {
5589 $type_class = ' cb-changable-opt cb-bar_chart-opt cb-column_chart-opt cb-line_chart-opt ';
5590 } else if ($option_slug == 'labeled') {
5591 $type_class = ' cb-changable-opt cb-pie_chart-opt cb-donut_chart-opt ';
5592 }
5593
5594 ?>
5595
5596 <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>
5597 <?php
5598 endforeach;
5599 ?>
5600 </select>
5601 </div>
5602 </div> <!-- Legend position -->
5603 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5604 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5605 <label for="ays-chart-option-legend-alignment">
5606 <?php echo esc_html(__( "Alignment", "chart-builder" )); ?>
5607 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr(htmlspecialchars( __("Choose the appropriate alignment for the chart legend.","chart-builder") )); ?>">
5608 <i class="ays_fa ays_fa_info_circle"></i>
5609 </a>
5610 </label>
5611 </div>
5612 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5613 <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]">
5614 <?php
5615 foreach ( $legend_alignments as $option_slug => $option ):
5616 $selected = ( $legend_alignment == $option_slug ) ? 'selected' : '';
5617 ?>
5618 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
5619 <?php
5620 endforeach;
5621 ?>
5622 </select>
5623 </div>
5624 </div> <!-- Legend alignment -->
5625 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5626 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5627 <label for="ays-chart-option-legend-font-color">
5628 <?php echo esc_html(__( "Font Color", "chart-builder" )); ?>
5629 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr(htmlspecialchars( __("Choose the font color for the chart legend.","chart-builder") )); ?>">
5630 <i class="ays_fa ays_fa_info_circle"></i>
5631 </a>
5632 </label>
5633 </div>
5634 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5635 <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) ?>">
5636 </div>
5637 </div> <!-- Legend font color -->
5638 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5639 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5640 <label for="ays-chart-option-legend-font-size" class="form-label">
5641 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
5642 <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") )); ?>">
5643 <i class="ays_fa ays_fa_info_circle"></i>
5644 </a>
5645 </label>
5646 </div>
5647 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5648 <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) ?>">
5649 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
5650 </div>
5651 </div> <!-- Font size -->
5652 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5653 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5654 <label for="ays-chart-option-legend-italic">
5655 <?php echo esc_html(__( "Italic text", "chart-builder" )); ?>
5656 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable this option to make chart legend text italic.","chart-builder") ); ?>">
5657 <i class="ays_fa ays_fa_info_circle"></i>
5658 </a>
5659 </label>
5660 </div>
5661 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5662 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5663 <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); ?> >
5664 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5665 </label>
5666 </div>
5667 </div> <!-- Italic text -->
5668 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5669 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5670 <label for="ays-chart-option-legend-bold">
5671 <?php echo esc_html(__( "Bold text", "chart-builder" )); ?>
5672 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable this option to make chart legend text bold.","chart-builder") ); ?>">
5673 <i class="ays_fa ays_fa_info_circle"></i>
5674 </a>
5675 </label>
5676 </div>
5677 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5678 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5679 <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); ?> >
5680 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5681 </label>
5682 </div>
5683 </div> <!-- Bold text -->
5684 </div>
5685 </div>
5686 <?php
5687 $content = ob_get_clean();
5688
5689 $title = __( 'Legend', "chart-builder" );
5690
5691 $sources['legend'] = array(
5692 'content' => $content,
5693 'title' => $title
5694 );
5695
5696 return $sources;
5697 }
5698
5699 public function settings_contents_legend_settings_chartjs( $sources, $args ){
5700 $html_class_prefix = $args['html_class_prefix'];
5701 $html_name_prefix = $args['html_name_prefix'];
5702 $settings = $args['settings'];
5703 $legend_positions = $settings['legend_positions'];
5704 $legend_position = $settings['legend_position'];
5705 $legend_alignments = $settings['legend_alignments'];
5706 $legend_alignment = $settings['legend_alignment'];
5707 $legend_color = $settings['legend_color'];
5708 $legend_font_size = $settings['legend_font_size'];
5709 $legend_reverse = $settings['legend_reverse'];
5710 $legend_bold = $settings['legend_bold'];
5711 $legend_italic = $settings['legend_italic'];
5712 ob_start();
5713 ?>
5714 <div class="ays-accordion-data-main-wrap">
5715 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
5716 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5717 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5718 <label for="ays-chart-option-legend-position">
5719 <?php echo esc_html(__( "Position", "chart-builder" )); ?>
5720 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr(htmlspecialchars( __("Choose the appropriate position for the chart legend.","chart-builder") )); ?>">
5721 <i class="ays_fa ays_fa_info_circle"></i>
5722 </a>
5723 </label>
5724 </div>
5725 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5726 <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]">
5727 <?php
5728 foreach ( $legend_positions as $option_slug => $option ):
5729 $selected = ( $legend_position == $option_slug ) ? 'selected' : '';
5730 ?>
5731 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?> ><?php echo esc_html($option); ?></option>
5732 <?php
5733 endforeach;
5734 ?>
5735 </select>
5736 </div>
5737 </div> <!-- Legend position -->
5738 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5739 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5740 <label for="ays-chart-option-legend-alignment">
5741 <?php echo esc_html(__( "Alignment", "chart-builder" )); ?>
5742 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr(htmlspecialchars( __("Choose the appropriate alignment for the chart legend.","chart-builder") )); ?>">
5743 <i class="ays_fa ays_fa_info_circle"></i>
5744 </a>
5745 </label>
5746 </div>
5747 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5748 <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]">
5749 <?php
5750 foreach ( $legend_alignments as $option_slug => $option ):
5751 $selected = ( $legend_alignment == $option_slug ) ? 'selected' : '';
5752 ?>
5753 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
5754 <?php
5755 endforeach;
5756 ?>
5757 </select>
5758 </div>
5759 </div> <!-- Legend alignment -->
5760 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5761 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5762 <label for="ays-chart-option-legend-font-color">
5763 <?php echo esc_html(__( "Font Color", "chart-builder" )); ?>
5764 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr(htmlspecialchars( __("Choose the font color for the chart legend.","chart-builder") )); ?>">
5765 <i class="ays_fa ays_fa_info_circle"></i>
5766 </a>
5767 </label>
5768 </div>
5769 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5770 <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) ?>">
5771 </div>
5772 </div> <!-- Legend font color -->
5773 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5774 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5775 <label for="ays-chart-option-legend-font-size" class="form-label">
5776 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
5777 <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") )); ?>">
5778 <i class="ays_fa ays_fa_info_circle"></i>
5779 </a>
5780 </label>
5781 </div>
5782 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5783 <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) ?>">
5784 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
5785 </div>
5786 </div> <!-- Font size -->
5787 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5788 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5789 <label for="ays-chart-option-legend-italic">
5790 <?php echo esc_html(__( "Italic text", "chart-builder" )); ?>
5791 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable this option to make chart legend text italic.","chart-builder") ); ?>">
5792 <i class="ays_fa ays_fa_info_circle"></i>
5793 </a>
5794 </label>
5795 </div>
5796 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5797 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5798 <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); ?> >
5799 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5800 </label>
5801 </div>
5802 </div> <!-- Italic text -->
5803 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5804 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5805 <label for="ays-chart-option-legend-bold">
5806 <?php echo esc_html(__( "Bold text", "chart-builder" )); ?>
5807 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable this option to make chart legend text bold.","chart-builder") ); ?>">
5808 <i class="ays_fa ays_fa_info_circle"></i>
5809 </a>
5810 </label>
5811 </div>
5812 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5813 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5814 <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); ?> >
5815 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5816 </label>
5817 </div>
5818 </div> <!-- Bold text -->
5819 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt">
5820 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5821 <label for="ays-chart-option-legend-revers">
5822 <?php echo esc_html(__( "Show datasets in reverse order", "chart-builder" )); ?>
5823 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable this toggle to show datasets in reverse ordering.","chart-builder") ); ?>">
5824 <i class="ays_fa ays_fa_info_circle"></i>
5825 </a>
5826 </label>
5827 </div>
5828 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5829 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5830 <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); ?> >
5831 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5832 </label>
5833 </div>
5834 </div> <!-- reverse datasets -->
5835 </div>
5836 </div>
5837 <?php
5838 $content = ob_get_clean();
5839
5840 $title = __( 'Legend', "chart-builder" );
5841
5842 $sources['legend'] = array(
5843 'content' => $content,
5844 'title' => $title
5845 );
5846
5847 return $sources;
5848 }
5849
5850 public function settings_contents_horizontal_axis_settings( $sources, $args ){
5851 $html_class_prefix = $args['html_class_prefix'];
5852 $html_name_prefix = $args['html_name_prefix'];
5853 $settings = $args['settings'];
5854
5855 $haxis_title = $settings['haxis_title'];
5856 $axes_text_positions = $settings['axes_text_positions'];
5857 $haxis_text_position = $settings['haxis_text_position'];
5858 $haxis_direction = $settings['haxis_direction'];
5859 $haxis_text_color = $settings['haxis_text_color'];
5860 $haxis_baseline_color = $settings['haxis_baseline_color'];
5861 $haxis_slanted_options = $settings['haxis_slanted_options'];
5862 $haxis_slanted = $settings['haxis_slanted'];
5863 $haxis_slanted_text_angle = $settings['haxis_slanted_text_angle'];
5864 $haxis_show_text_every = $settings['haxis_show_text_every'];
5865 $haxis_format_options = $settings['axes_format_options'];
5866 $haxis_format = $settings['haxis_format'];
5867 $haxis_enable_divide_percent = $settings['haxis_enable_divide_percent'];
5868 $haxis_label_font_size = $settings['haxis_label_font_size'];
5869 $haxis_max_value = $settings['haxis_max_value'];
5870 $haxis_min_value = $settings['haxis_min_value'];
5871 $haxis_text_font_size = $settings['haxis_text_font_size'];
5872 $haxis_label_color = $settings['haxis_label_color'];
5873 $haxis_bold = $settings['haxis_bold'];
5874 $haxis_italic = $settings['haxis_italic'];
5875 $haxis_title_bold = $settings['haxis_title_bold'];
5876 $haxis_title_italic = $settings['haxis_title_italic'];
5877 $haxis_gridlines_count = $settings['haxis_gridlines_count'];
5878 $haxis_gridlines_color = $settings['haxis_gridlines_color'];
5879 $haxis_minor_gridlines_color = $settings['haxis_minor_gridlines_color'];
5880
5881 ob_start();
5882 ?>
5883 <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">
5884 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
5885 <h6>Label</h6>
5886 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5887 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5888 <label for="ays-chart-option-haxis-title" class="form-label">
5889 <?php echo esc_html(__( "Label", "chart-builder" )); ?>
5890 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The title of the horizontal axis","chart-builder") ); ?>">
5891 <i class="ays_fa ays_fa_info_circle"></i>
5892 </a>
5893 </label>
5894 </div>
5895 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5896 <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) ?>">
5897 </div>
5898 </div> <!-- Horizontal axis label -->
5899 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5900 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5901 <label for="ays-chart-option-haxis-label-font-size" class="form-label">
5902 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
5903 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The font size of the horizontal axis label.","chart-builder") ); ?>">
5904 <i class="ays_fa ays_fa_info_circle"></i>
5905 </a>
5906 </label>
5907 </div>
5908 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5909 <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) ?>">
5910 </div>
5911 </div> <!-- Horizontal axis label font size -->
5912 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5913 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5914 <label for="ays-chart-option-haxis-label-color">
5915 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
5916 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the horizontal axis label.","chart-builder") ); ?>">
5917 <i class="ays_fa ays_fa_info_circle"></i>
5918 </a>
5919 </label>
5920 </div>
5921 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5922 <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) ?>">
5923 </div>
5924 </div> <!-- Horizontal axis label color -->
5925 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5926 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5927 <label for="ays-chart-option-haxis-title-italic">
5928 <?php echo esc_html(__( "Italic", "chart-builder" )); ?>
5929 <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") ); ?>">
5930 <i class="ays_fa ays_fa_info_circle"></i>
5931 </a>
5932 </label>
5933 </div>
5934 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5935 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5936 <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); ?> >
5937 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5938 </label>
5939 </div>
5940 </div> <!-- Italic label -->
5941 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5942 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5943 <label for="ays-chart-option-haxis-title-bold">
5944 <?php echo esc_html(__( "Bold", "chart-builder" )); ?>
5945 <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") ); ?>">
5946 <i class="ays_fa ays_fa_info_circle"></i>
5947 </a>
5948 </label>
5949 </div>
5950 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5951 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
5952 <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); ?> >
5953 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
5954 </label>
5955 </div>
5956 </div> <!-- Bold label -->
5957 <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">
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-haxis-show-text-every" class="form-label">
5960 <?php echo esc_html(__( "Interval", "chart-builder" )); ?>
5961 <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") ); ?>">
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) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
5967 <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">
5968 </div>
5969 </div> <!-- Label interval -->
5970
5971 <br>
5972 <h6>Text</h6>
5973 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5974 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5975 <label for="ays-chart-option-haxis-text-position" class="form-label">
5976 <?php echo esc_html(__( "Position", "chart-builder" )); ?>
5977 <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") ); ?>">
5978 <i class="ays_fa ays_fa_info_circle"></i>
5979 </a>
5980 </label>
5981 </div>
5982 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
5983 <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]">
5984 <?php
5985 foreach ( $axes_text_positions as $option_slug => $option ):
5986 $selected = ( $haxis_text_position == $option_slug ) ? 'selected' : '';
5987 ?>
5988 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
5989 <?php
5990 endforeach;
5991 ?>
5992 </select>
5993 </div>
5994 </div> <!-- Horizontal axis text position -->
5995 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
5996 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
5997 <label for="ays-chart-option-haxis-text-color">
5998 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
5999 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the horizontal axis text.","chart-builder") ); ?>">
6000 <i class="ays_fa ays_fa_info_circle"></i>
6001 </a>
6002 </label>
6003 </div>
6004 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6005 <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) ?>">
6006 </div>
6007 </div> <!-- Horizontal axis text color -->
6008 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6009 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6010 <label for="ays-chart-option-haxis-text-font-size" class="form-label">
6011 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
6012 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The font size of the horizontal axis text.","chart-builder") ); ?>">
6013 <i class="ays_fa ays_fa_info_circle"></i>
6014 </a>
6015 </label>
6016 </div>
6017 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6018 <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) ?>">
6019 </div>
6020 </div> <!-- Horizontal axis text font size -->
6021 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6022 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6023 <label for="ays-chart-option-haxis-text-direction">
6024 <?php echo esc_html(__( "Reverse Direction", "chart-builder" )); ?>
6025 <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") ); ?>">
6026 <i class="ays_fa ays_fa_info_circle"></i>
6027 </a>
6028 </label>
6029 </div>
6030 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6031 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6032 <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); ?> >
6033 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6034 </label>
6035 </div>
6036 </div> <!-- Horizontal axis text direction -->
6037 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6038 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6039 <label for="ays-chart-option-haxis-italic">
6040 <?php echo esc_html(__( "Italic", "chart-builder" )); ?>
6041 <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") ); ?>">
6042 <i class="ays_fa ays_fa_info_circle"></i>
6043 </a>
6044 </label>
6045 </div>
6046 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6047 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6048 <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); ?> >
6049 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6050 </label>
6051 </div>
6052 </div> <!-- Italic text -->
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-haxis-bold">
6056 <?php echo esc_html(__( "Bold", "chart-builder" )); ?>
6057 <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") ); ?>">
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-haxis-bold" type="checkbox" name="<?php echo esc_attr($html_name_prefix); ?>settings[haxis_bold]" value="on" <?php echo esc_attr($haxis_bold); ?> >
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> <!-- Bold text -->
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-haxis-slanted-text" class="form-label">
6072 <?php echo esc_html(__( "Slanted text", "chart-builder" )); ?>
6073 <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") ); ?>">
6074 <i class="ays_fa ays_fa_info_circle"></i>
6075 </a>
6076 </label>
6077 </div>
6078 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6079 <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]">
6080 <?php
6081 foreach ( $haxis_slanted_options as $option_slug => $option ):
6082 $selected = ( $haxis_slanted == $option_slug ) ? 'selected' : '';
6083 ?>
6084 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
6085 <?php
6086 endforeach;
6087 ?>
6088 </select>
6089 </div>
6090 </div> <!-- Horizontal axis slanted text -->
6091 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section <?php echo ($haxis_slanted == 'false') ? 'display_none' : ''; ?>">
6092 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6093 <label for="ays-chart-option-haxis-slanted-text-angle" class="form-label">
6094 <?php echo esc_html(__( "Slanted text angle", "chart-builder" )); ?>
6095 <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") ); ?>">
6096 <i class="ays_fa ays_fa_info_circle"></i>
6097 </a>
6098 </label>
6099 </div>
6100 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6101 <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">
6102 </div>
6103 </div> <!-- Horizontal axis slanted text angle -->
6104
6105 <br>
6106 <h6>Gridlines</h6>
6107 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6108 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6109 <label for="ays-chart-option-haxis-gridlines-count" class="form-label">
6110 <?php echo esc_html(__( "Count", "chart-builder" )); ?>
6111 <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") ); ?>">
6112 <i class="ays_fa ays_fa_info_circle"></i>
6113 </a>
6114 </label>
6115 </div>
6116 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6117 <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) ?>">
6118 </div>
6119 </div> <!-- Horizontal axis gridlines count -->
6120 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6121 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6122 <label for="ays-chart-option-haxis-gridlines-color">
6123 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
6124 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the horizontal axis gridlines.","chart-builder") ); ?>">
6125 <i class="ays_fa ays_fa_info_circle"></i>
6126 </a>
6127 </label>
6128 </div>
6129 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6130 <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) ?>">
6131 </div>
6132 </div> <!-- Horizontal axis gridlines color -->
6133 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6134 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6135 <label for="ays-chart-option-haxis-minor-gridlines-color">
6136 <?php echo esc_html(__( "Minor gridlines color", "chart-builder" )); ?>
6137 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the horizontal axis minor gridlines.","chart-builder") ); ?>">
6138 <i class="ays_fa ays_fa_info_circle"></i>
6139 </a>
6140 </label>
6141 </div>
6142 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6143 <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) ?>">
6144 </div>
6145 </div> <!-- Horizontal axis minor gridlines color -->
6146 <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">
6147 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6148 <label for="ays-chart-option-haxis-baseline-color">
6149 <?php echo esc_html(__( "Baseline color", "chart-builder" )); ?>
6150 <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") ); ?>">
6151 <i class="ays_fa ays_fa_info_circle"></i>
6152 </a>
6153 </label>
6154 </div>
6155 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6156 <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) ?>">
6157 </div>
6158 </div> <!-- Horizontal axis baseline color -->
6159
6160 <br class="cb-changable-opt cb-bar_chart-opt " >
6161 <h6 class="cb-changable-opt cb-bar_chart-opt">Format</h6>
6162 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-bar_chart-opt " >
6163 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6164 <label for="ays-chart-option-haxis-format" class="form-label">
6165 <?php echo esc_html(__( "Format", "chart-builder" )); ?>
6166 <a class="ays_help" data-bs-toggle="tooltip" data-bs-html="true" title="<?php
6167 echo esc_attr( sprintf(
6168 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6169 "<p>" . __('A format string for numeric axis labels. You can choose any of the following:', "chart-builder") . "</p><ul class='ays_tooltop_ul'><li>" .
6170 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6171 __('%1$sNone:%2$s Displays numbers with no formatting (e.g., 8000000)', "chart-builder") . "</li><li>" .
6172 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6173 __('%1$sDecimal:%2$s Displays numbers with thousands separators (e.g., 8,000,000)', "chart-builder") . "</li><li>" .
6174 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6175 __('%1$sScientific:%2$s Displays numbers in scientific notation (e.g., 8e6)', "chart-builder") . "</li><li>" .
6176 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6177 __('%1$sCurrency:%2$s Displays numbers in the local currency (e.g., $8,000,000.00)', "chart-builder") . "</li><li>" .
6178 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6179 __('%1$sPercent:%2$s Displays numbers as percentages (e.g., 800,000,000%%)', "chart-builder") . "</li><li>" .
6180 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6181 __('%1$sShort:%2$s Displays abbreviated numbers (e.g., 8M)', "chart-builder") . "</li><li>" .
6182 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6183 __('%1$sLong:%2$s Displays numbers as full words (e.g., 8 million)', "chart-builder") . "</li></ul>",
6184 '<em>', '</em>',
6185 '<em>', '</em>',
6186 '<em>', '</em>',
6187 '<em>', '</em>',
6188 '<em>', '</em>',
6189 '<em>', '</em>',
6190 '<em>', '</em>'
6191 ));
6192 ?>">
6193 <i class="ays_fa ays_fa_info_circle"></i>
6194 </a>
6195 </label>
6196 </div>
6197 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6198 <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]">
6199 <?php
6200 foreach ( $haxis_format_options as $option_slug => $option ):
6201 $selected = ( $haxis_format == $option_slug ) ? 'selected' : '';
6202 ?>
6203 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
6204 <?php
6205 endforeach;
6206 ?>
6207 </select>
6208 </div>
6209 </div> <!-- Horizontal axis format -->
6210 <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;'; ?>">
6211 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6212 <label for="ays-chart-option-haxis-enable-divide-percent">
6213 <?php echo esc_html(__( "Remove Extra Zeros ", "chart-builder" )); ?>
6214 <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") ); ?>">
6215 <i class="ays_fa ays_fa_info_circle"></i>
6216 </a>
6217 </label>
6218 </div>
6219 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6220 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6221 <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); ?> >
6222 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6223 </label>
6224 </div>
6225 </div> <!--Remove Extra Zeros"-->
6226 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-bar_chart-opt" >
6227 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6228 <label for="ays-chart-option-haxis-max-value" class="form-label">
6229 <?php echo esc_html(__( "Max value", "chart-builder" )); ?>
6230 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The maximum value of the axis.","chart-builder") ); ?>">
6231 <i class="ays_fa ays_fa_info_circle"></i>
6232 </a>
6233 </label>
6234 </div>
6235 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6236 <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) ?>">
6237 </div>
6238 </div> <!-- Horizontal axis max value -->
6239 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-bar_chart-opt" >
6240 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6241 <label for="ays-chart-option-haxis-min-value" class="form-label">
6242 <?php echo esc_html(__( "Min value", "chart-builder" )); ?>
6243 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The minimum value of the axis.","chart-builder") ); ?>">
6244 <i class="ays_fa ays_fa_info_circle"></i>
6245 </a>
6246 </label>
6247 </div>
6248 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6249 <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) ?>">
6250 </div>
6251 </div> <!-- Horizontal axis min value -->
6252 </div>
6253 </div>
6254 <?php
6255 $content = ob_get_clean();
6256
6257 $title = __( 'Horizontal Axis Settings', "chart-builder" );
6258
6259 $sources['horizontal_axis'] = array(
6260 'content' => $content,
6261 'title' => $title
6262 );
6263
6264 return $sources;
6265 }
6266
6267 public function settings_contents_vertical_axis_settings( $sources, $args ){
6268 $html_class_prefix = $args['html_class_prefix'];
6269 $html_name_prefix = $args['html_name_prefix'];
6270 $settings = $args['settings'];
6271
6272 $vaxis_title = $settings['vaxis_title'];
6273 $axes_text_positions = $settings['axes_text_positions'];
6274 $vaxis_text_position = $settings['vaxis_text_position'];
6275 $vaxis_direction = $settings['vaxis_direction'];
6276 $vaxis_text_color = $settings['vaxis_text_color'];
6277 $vaxis_baseline_color = $settings['vaxis_baseline_color'];
6278 $vaxis_format_options = $settings['axes_format_options'];
6279 $vaxis_format = $settings['vaxis_format'];
6280 $vaxis_enable_divide_percent = $settings['vaxis_enable_divide_percent'];
6281 $vaxis_label_font_size = $settings['vaxis_label_font_size'];
6282 $vaxis_max_value = $settings['vaxis_max_value'];
6283 $vaxis_min_value = $settings['vaxis_min_value'];
6284 $vaxis_text_font_size = $settings['vaxis_text_font_size'];
6285 $vaxis_label_color = $settings['vaxis_label_color'];
6286 $vaxis_bold = $settings['vaxis_bold'];
6287 $vaxis_italic = $settings['vaxis_italic'];
6288 $vaxis_title_bold = $settings['vaxis_title_bold'];
6289 $vaxis_title_italic = $settings['vaxis_title_italic'];
6290 $vaxis_gridlines_count = $settings['vaxis_gridlines_count'];
6291 $vaxis_gridlines_color = $settings['vaxis_gridlines_color'];
6292 $vaxis_minor_gridlines_color = $settings['vaxis_minor_gridlines_color'];
6293
6294 ob_start();
6295 ?>
6296 <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">
6297 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
6298 <h6>Label</h6>
6299 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6300 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6301 <label for="ays-chart-option-vaxis-title" class="form-label">
6302 <?php echo esc_html(__( "Label", "chart-builder" )); ?>
6303 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The title of the vertical axis","chart-builder") ); ?>">
6304 <i class="ays_fa ays_fa_info_circle"></i>
6305 </a>
6306 </label>
6307 </div>
6308 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6309 <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) ?>">
6310 </div>
6311 </div> <!-- Vertical axis label -->
6312 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6313 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6314 <label for="ays-chart-option-vaxis-label-font-size" class="form-label">
6315 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
6316 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The font size of the vertical axis label.","chart-builder") ); ?>">
6317 <i class="ays_fa ays_fa_info_circle"></i>
6318 </a>
6319 </label>
6320 </div>
6321 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6322 <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) ?>">
6323 </div>
6324 </div> <!-- Vertical axis label font size -->
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-vaxis-label-color">
6328 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
6329 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the horizontal axis label.","chart-builder") ); ?>">
6330 <i class="ays_fa ays_fa_info_circle"></i>
6331 </a>
6332 </label>
6333 </div>
6334 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6335 <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) ?>">
6336 </div>
6337 </div> <!-- Vertical axis label color -->
6338 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6339 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6340 <label for="ays-chart-option-vaxis-title-italic">
6341 <?php echo esc_html(__( "Italic", "chart-builder" )); ?>
6342 <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") ); ?>">
6343 <i class="ays_fa ays_fa_info_circle"></i>
6344 </a>
6345 </label>
6346 </div>
6347 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6348 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6349 <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); ?> >
6350 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6351 </label>
6352 </div>
6353 </div> <!-- Italic label -->
6354 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6355 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6356 <label for="ays-chart-option-vaxis-title-bold">
6357 <?php echo esc_html(__( "Bold", "chart-builder" )); ?>
6358 <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") ); ?>">
6359 <i class="ays_fa ays_fa_info_circle"></i>
6360 </a>
6361 </label>
6362 </div>
6363 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6364 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6365 <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); ?> >
6366 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6367 </label>
6368 </div>
6369 </div> <!-- Bold label -->
6370
6371 <br>
6372 <h6>Text</h6>
6373 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6374 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6375 <label for="ays-chart-option-vaxis-text-position" class="form-label">
6376 <?php echo esc_html(__( "Position", "chart-builder" )); ?>
6377 <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") ); ?>">
6378 <i class="ays_fa ays_fa_info_circle"></i>
6379 </a>
6380 </label>
6381 </div>
6382 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6383 <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]">
6384 <?php
6385 foreach ( $axes_text_positions as $option_slug => $option ):
6386 $selected = ( $vaxis_text_position == $option_slug ) ? 'selected' : '';
6387 ?>
6388 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
6389 <?php
6390 endforeach;
6391 ?>
6392 </select>
6393 </div>
6394 </div> <!-- Vertical axis text position -->
6395 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6396 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6397 <label for="ays-chart-option-vaxis-text-color">
6398 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
6399 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the vertical axis text.","chart-builder") ); ?>">
6400 <i class="ays_fa ays_fa_info_circle"></i>
6401 </a>
6402 </label>
6403 </div>
6404 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6405 <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) ?>">
6406 </div>
6407 </div> <!-- Vertical axis text color -->
6408 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6409 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6410 <label for="ays-chart-option-vaxis-text-font-size" class="form-label">
6411 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
6412 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The font size of the horizontal axis text.","chart-builder") ); ?>">
6413 <i class="ays_fa ays_fa_info_circle"></i>
6414 </a>
6415 </label>
6416 </div>
6417 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6418 <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) ?>">
6419 </div>
6420 </div> <!-- Vertical axis text font size -->
6421 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6422 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6423 <label for="ays-chart-option-vaxis-text-direction">
6424 <?php echo esc_html(__( "Reverse Direction", "chart-builder" )); ?>
6425 <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") ); ?>">
6426 <i class="ays_fa ays_fa_info_circle"></i>
6427 </a>
6428 </label>
6429 </div>
6430 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6431 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6432 <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); ?> >
6433 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6434 </label>
6435 </div>
6436 </div> <!-- Vertical axis text direction -->
6437 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6438 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6439 <label for="ays-chart-option-vaxis-italic">
6440 <?php echo esc_html(__( "Italic text", "chart-builder" )); ?>
6441 <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") ); ?>">
6442 <i class="ays_fa ays_fa_info_circle"></i>
6443 </a>
6444 </label>
6445 </div>
6446 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6447 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6448 <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); ?> >
6449 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6450 </label>
6451 </div>
6452 </div> <!-- Italic text -->
6453 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6454 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6455 <label for="ays-chart-option-vaxis-bold">
6456 <?php echo esc_html(__( "Bold text", "chart-builder" )); ?>
6457 <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") ); ?>">
6458 <i class="ays_fa ays_fa_info_circle"></i>
6459 </a>
6460 </label>
6461 </div>
6462 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6463 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6464 <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); ?> >
6465 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6466 </label>
6467 </div>
6468 </div> <!-- Bold text -->
6469
6470 <br>
6471 <h6>Gridlines</h6>
6472 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6473 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6474 <label for="ays-chart-option-vaxis-gridlines-count" class="form-label">
6475 <?php echo esc_html(__( "Count", "chart-builder" )); ?>
6476 <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") ); ?>">
6477 <i class="ays_fa ays_fa_info_circle"></i>
6478 </a>
6479 </label>
6480 </div>
6481 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6482 <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) ?>">
6483 </div>
6484 </div> <!-- Vertical axis gridlines count -->
6485 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6486 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6487 <label for="ays-chart-option-vaxis-gridlines-color">
6488 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
6489 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the vertical axis gridlines.","chart-builder") ); ?>">
6490 <i class="ays_fa ays_fa_info_circle"></i>
6491 </a>
6492 </label>
6493 </div>
6494 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6495 <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) ?>">
6496 </div>
6497 </div> <!-- Vertical axis gridlines color -->
6498 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6499 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6500 <label for="ays-chart-option-vaxis-minor-gridlines-color">
6501 <?php echo esc_html(__( "Minor gridlines color", "chart-builder" )); ?>
6502 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the vertical axis minor gridlines.","chart-builder") ); ?>">
6503 <i class="ays_fa ays_fa_info_circle"></i>
6504 </a>
6505 </label>
6506 </div>
6507 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6508 <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) ?>">
6509 </div>
6510 </div> <!-- Vertical axis minor gridlines color -->
6511 <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">
6512 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6513 <label for="ays-chart-option-vaxis-baseline-color">
6514 <?php echo esc_html(__( "Baseline color", "chart-builder" )); ?>
6515 <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") ); ?>">
6516 <i class="ays_fa ays_fa_info_circle"></i>
6517 </a>
6518 </label>
6519 </div>
6520 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6521 <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) ?>">
6522 </div>
6523 </div> <!-- Vertical axis baseline color -->
6524
6525 <br class="cb-changable-opt cb-column_chart-opt cb-line_chart-opt">
6526 <h6 class="cb-changable-opt cb-column_chart-opt cb-line_chart-opt">Format</h6>
6527 <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">
6528 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6529 <label for="ays-chart-option-vaxis-format" class="form-label">
6530 <?php echo esc_html(__( "Format", "chart-builder" )); ?>
6531 <a class="ays_help" data-bs-toggle="tooltip" data-bs-html="true" title="<?php
6532 echo esc_attr( sprintf(
6533 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6534 "<p>" . __('A format string for numeric axis labels. You can choose any of the following:', "chart-builder") . "</p><ul class='ays_tooltop_ul'><li>" .
6535 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6536 __('%1$sNone:%2$s Displays numbers with no formatting (e.g., 8000000)', "chart-builder") . "</li><li>" .
6537 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6538 __('%1$sDecimal:%2$s Displays numbers with thousands separators (e.g., 8,000,000)', "chart-builder") . "</li><li>" .
6539 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6540 __('%1$sScientific:%2$s Displays numbers in scientific notation (e.g., 8e6)', "chart-builder") . "</li><li>" .
6541 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6542 __('%1$sCurrency:%2$s Displays numbers in the local currency (e.g., $8,000,000.00)', "chart-builder") . "</li><li>" .
6543 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6544 __('%1$sPercent:%2$s Displays numbers as percentages (e.g., 800,000,000%%)', "chart-builder") . "</li><li>" .
6545 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6546 __('%1$sShort:%2$s Displays abbreviated numbers (e.g., 8M)', "chart-builder") . "</li><li>" .
6547 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6548 __('%1$sLong:%2$s Displays numbers as full words (e.g., 8 million)', "chart-builder") . "</li></ul>",
6549 '<em>', '</em>',
6550 '<em>', '</em>',
6551 '<em>', '</em>',
6552 '<em>', '</em>',
6553 '<em>', '</em>',
6554 '<em>', '</em>',
6555 '<em>', '</em>'
6556 ));
6557 ?>">
6558 <i class="ays_fa ays_fa_info_circle"></i>
6559 </a>
6560 </label>
6561 </div>
6562 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6563 <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]">
6564 <?php
6565 foreach ( $vaxis_format_options as $option_slug => $option ):
6566 $selected = ( $vaxis_format == $option_slug ) ? 'selected' : '';
6567 ?>
6568 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
6569 <?php
6570 endforeach;
6571 ?>
6572 </select>
6573 </div>
6574 </div> <!-- Vertical axis format -->
6575 <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;'; ?>">
6576 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6577 <label for="ays-chart-option-vaxis-enable-divide-percent">
6578 <?php echo esc_html(__( "Remove Extra Zeros", "chart-builder" )); ?>
6579 <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") ); ?>">
6580 <i class="ays_fa ays_fa_info_circle"></i>
6581 </a>
6582 </label>
6583 </div>
6584 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6585 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6586 <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); ?> >
6587 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6588 </label>
6589 </div>
6590 </div> <!--Remove Extra Zeros-->
6591 <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">
6592 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6593 <label for="ays-chart-option-vaxis-max-value" class="form-label">
6594 <?php echo esc_html(__( "Max value", "chart-builder" )); ?>
6595 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The maximum value of the axis.","chart-builder") ); ?>">
6596 <i class="ays_fa ays_fa_info_circle"></i>
6597 </a>
6598 </label>
6599 </div>
6600 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6601 <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) ?>">
6602 </div>
6603 </div> <!-- Vertical axis max value -->
6604 <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">
6605 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6606 <label for="ays-chart-option-vaxis-min-value" class="form-label">
6607 <?php echo esc_html(__( "Min value", "chart-builder" )); ?>
6608 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The minimum value of the axis.","chart-builder") ); ?>">
6609 <i class="ays_fa ays_fa_info_circle"></i>
6610 </a>
6611 </label>
6612 </div>
6613 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6614 <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) ?>">
6615 </div>
6616 </div> <!-- Vertical axis min value -->
6617 </div>
6618 </div>
6619 <?php
6620 $content = ob_get_clean();
6621
6622 $title = __( 'Vertical Axis Settings', "chart-builder" );
6623
6624 $sources['vertical_axis'] = array(
6625 'content' => $content,
6626 'title' => $title
6627 );
6628
6629 return $sources;
6630 }
6631
6632 public function settings_contents_animation_settings( $sources, $args ) {
6633 $html_class_prefix = $args['html_class_prefix'];
6634 $html_name_prefix = $args['html_name_prefix'];
6635 $settings = $args['settings'];
6636
6637 $enable_animation = $settings['enable_animation'];
6638 $animation_duration = $settings['animation_duration'];
6639 $animation_startup = $settings['animation_startup'];
6640 $animation_easing_options = $settings['animation_easing_options'];
6641 $animation_easing = $settings['animation_easing'];
6642
6643 ob_start();
6644 ?>
6645 <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">
6646 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
6647 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6648 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6649 <label for="ays-chart-option-enable-animation">
6650 <?php echo esc_html(__( "Enable chart animation", "chart-builder" )); ?>
6651 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Enable chart animation.","chart-builder") ); ?>">
6652 <i class="ays_fa ays_fa_info_circle"></i>
6653 </a>
6654 </label>
6655 </div>
6656 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6657 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6658 <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); ?> >
6659 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6660 </label>
6661 </div>
6662 </div> <!-- Enable animation -->
6663 <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'; ?>">
6664 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6665 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6666 <label for="ays-chart-option-animation-duration" class="form-label">
6667 <?php echo esc_html(__( "Duration", "chart-builder" )); ?>
6668 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The duration of the chart animation, in milliseconds.","chart-builder") ); ?>">
6669 <i class="ays_fa ays_fa_info_circle"></i>
6670 </a>
6671 </label>
6672 </div>
6673 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6674 <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) ?>">
6675 </div>
6676 </div> <!-- Animation duration -->
6677 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6678 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6679 <label for="ays-chart-option-animation-startup">
6680 <?php echo esc_html(__( "Startup", "chart-builder" )); ?>
6681 <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") ); ?>">
6682 <i class="ays_fa ays_fa_info_circle"></i>
6683 </a>
6684 </label>
6685 </div>
6686 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6687 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6688 <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); ?> >
6689 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6690 </label>
6691 </div>
6692 </div> <!-- Animation startup -->
6693 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
6694 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6695 <label for="ays-chart-option-animation-easing" class="form-label">
6696 <?php echo esc_html(__( "Easing", "chart-builder" )); ?>
6697 <a class="ays_help" data-bs-toggle="tooltip" data-bs-html="true" title="<?php
6698 echo esc_attr( sprintf(
6699 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6700 "<p>" . __('The easing function applied to the chart animation. The following options are available:', "chart-builder") . "</p><ul class='ays_tooltop_ul'><li>" .
6701 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6702 __('%1$sLinear:%2$s Constant speed.', "chart-builder") . "</li><li>" .
6703 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6704 __('%1$sEase in:%2$s Start slow and speed up.', "chart-builder") . "</li><li>" .
6705 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6706 __('%1$sEase out:%2$s Start fast and slow down.', "chart-builder") . "</li><li>" .
6707 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
6708 __('%1$sEase in and out:%2$s Start slow, speed up, then slow down.', "chart-builder") . "</li></ul>",
6709 '<em>', '</em>',
6710 '<em>', '</em>',
6711 '<em>', '</em>',
6712 '<em>', '</em>'
6713 ));
6714 ?>">
6715 <i class="ays_fa ays_fa_info_circle"></i>
6716 </a>
6717 </label>
6718 </div>
6719 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
6720 <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]">
6721 <?php
6722 foreach ( $animation_easing_options as $option_slug => $option ):
6723 $selected = ( $animation_easing == $option_slug ) ? 'selected' : '';
6724 ?>
6725 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
6726 <?php
6727 endforeach;
6728 ?>
6729 </select>
6730 </div>
6731 </div> <!-- Animation easing -->
6732 <div>
6733 </div>
6734 </div>
6735 <?php
6736 $content = ob_get_clean();
6737
6738 $title = __( 'Chart animation', "chart-builder" );
6739
6740 $sources['animation'] = array(
6741 'content' => $content,
6742 'title' => $title
6743 );
6744
6745 return $sources;
6746 }
6747
6748 public function settings_contents_live_chart_settings( $sources, $args ) {
6749 $html_class_prefix = $args['html_class_prefix'];
6750 $html_name_prefix = $args['html_name_prefix'];
6751
6752 ob_start();
6753 ?>
6754 <div class="ays-accordion-data-main-wrap <?php echo esc_attr($html_class_prefix) ?>options-live-chart-settings-tab">
6755 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
6756 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section ays-pro-features-v2-main-box">
6757 <div class="ays-pro-features-v2-small-buttons-box-middle ays-pro-features-v2-big-buttons-box">
6758 <a href="https://www.youtube.com/watch?v=lhTqZmFUNz4" target="_blank" class="ays-pro-features-v2-video-button">
6759 <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>
6760 <div class="ays-pro-features-v2-video-text">
6761 <?php echo esc_html(__("Watch Video" , "chart-builder")); ?>
6762 </div>
6763 </a>
6764 <a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-pro-features-v2-upgrade-button">
6765 <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>
6766 <div class="ays-pro-features-v2-upgrade-text">
6767 <?php echo esc_html(__("Upgrade" , "chart-builder")); ?>
6768 </div>
6769 </a>
6770 </div>
6771 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6772 <label for="ays-chart-option-enable-live-chart">
6773 <?php echo esc_html(__( "Enable live chart", "chart-builder" )); ?>
6774 <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") ); ?>">
6775 <i class="ays_fa ays_fa_info_circle"></i>
6776 </a>
6777 </label>
6778 </div>
6779 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6780 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6781 <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">
6782 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6783 </label>
6784 </div>
6785 </div> <!-- Enable live chart -->
6786 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section ays-pro-features-v2-main-box">
6787 <div class="ays-pro-features-v2-small-buttons-box-middle ays-pro-features-v2-big-buttons-box">
6788 <a href="https://www.youtube.com/watch?v=lhTqZmFUNz4" target="_blank" class="ays-pro-features-v2-video-button">
6789 <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>
6790 <div class="ays-pro-features-v2-video-text">
6791 <?php echo esc_html(__("Watch Video" , "chart-builder")); ?>
6792 </div>
6793 </a>
6794 <a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-pro-features-v2-upgrade-button">
6795 <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>
6796 <div class="ays-pro-features-v2-upgrade-text">
6797 <?php echo esc_html(__("Upgrade" , "chart-builder")); ?>
6798 </div>
6799 </a>
6800 </div>
6801 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6802 <label for="ays-chart-option-live-chart-interval" class="form-label">
6803 <?php echo esc_html(__( "Interval", "chart-builder" )); ?>
6804 <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") ); ?>">
6805 <i class="ays_fa ays_fa_info_circle"></i>
6806 </a>
6807 </label>
6808 </div>
6809 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6810 <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">
6811 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">ms</div>
6812 </div>
6813 </div> <!-- Live chart interval -->
6814 </div>
6815 </div>
6816 <?php
6817 $content = ob_get_clean();
6818
6819 $title = __( 'Live Chart', "chart-builder" );
6820
6821 $sources['live_chart'] = array(
6822 'content' => $content,
6823 'title' => $title
6824 );
6825
6826 return $sources;
6827
6828 }
6829
6830 public function settings_contents_export_options( $sources, $args ){
6831 $html_class_prefix = $args['html_class_prefix'];
6832 $html_name_prefix = $args['html_name_prefix'];
6833 $settings = $args['settings'];
6834
6835 $enable_img = $settings['enable_img'];
6836
6837 ob_start();
6838 ?>
6839 <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">
6840 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
6841 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section ays-pro-features-v2-main-box">
6842 <div class="ays-pro-features-v2-small-buttons-box-middle ays-pro-features-v2-big-buttons-box">
6843 <a href="https://www.youtube.com/watch?v=9UqLXG5NU_I" target="_blank" class="ays-pro-features-v2-video-button">
6844 <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>
6845 <div class="ays-pro-features-v2-video-text">
6846 <?php echo esc_html(__("Watch Video" , "chart-builder")); ?>
6847 </div>
6848 </a>
6849 <a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-pro-features-v2-upgrade-button">
6850 <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>
6851 <div class="ays-pro-features-v2-upgrade-text">
6852 <?php echo esc_html(__("Upgrade" , "chart-builder")); ?>
6853 </div>
6854 </a>
6855 </div>
6856 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6857 <label for="ays-chart-option-export-print">
6858 <?php echo esc_html(__( "Print chart", "chart-builder" )); ?>
6859 <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") ); ?>">
6860 <i class="ays_fa ays_fa_info_circle"></i>
6861 </a>
6862 </label>
6863 </div>
6864 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6865 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6866 <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">
6867 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6868 </label>
6869 </div>
6870 </div> <!-- Print option end -->
6871 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section ays-pro-features-v2-main-box">
6872 <div class="ays-pro-features-v2-small-buttons-box-middle ays-pro-features-v2-big-buttons-box">
6873 <a href="https://www.youtube.com/watch?v=9UqLXG5NU_I" target="_blank" class="ays-pro-features-v2-video-button">
6874 <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>
6875 <div class="ays-pro-features-v2-video-text">
6876 <?php echo esc_html(__("Watch Video" , "chart-builder")); ?>
6877 </div>
6878 </a>
6879 <a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-pro-features-v2-upgrade-button">
6880 <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>
6881 <div class="ays-pro-features-v2-upgrade-text">
6882 <?php echo esc_html(__("Upgrade" , "chart-builder")); ?>
6883 </div>
6884 </a>
6885 </div>
6886 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6887 <label for="ays-chart-option-export-Excel">
6888 <?php echo esc_html(__( "Excel download", "chart-builder" )); ?>
6889 <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") ); ?>">
6890 <i class="ays_fa ays_fa_info_circle"></i>
6891 </a>
6892 </label>
6893 </div>
6894 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6895 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6896 <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">
6897 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6898 </label>
6899 </div>
6900 </div> <!-- Excel option end -->
6901 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section ays-pro-features-v2-main-box">
6902 <div class="ays-pro-features-v2-small-buttons-box-middle ays-pro-features-v2-big-buttons-box">
6903 <a href="https://www.youtube.com/watch?v=9UqLXG5NU_I" target="_blank" class="ays-pro-features-v2-video-button">
6904 <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>
6905 <div class="ays-pro-features-v2-video-text">
6906 <?php echo esc_html(__("Watch Video" , "chart-builder")); ?>
6907 </div>
6908 </a>
6909 <a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-pro-features-v2-upgrade-button">
6910 <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>
6911 <div class="ays-pro-features-v2-upgrade-text">
6912 <?php echo esc_html(__("Upgrade" , "chart-builder")); ?>
6913 </div>
6914 </a>
6915 </div>
6916 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6917 <label for="ays-chart-option-export-CSV">
6918 <?php echo esc_html(__( "CSV download", "chart-builder" )); ?>
6919 <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") ); ?>">
6920 <i class="ays_fa ays_fa_info_circle"></i>
6921 </a>
6922 </label>
6923 </div>
6924 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6925 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6926 <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">
6927 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6928 </label>
6929 </div>
6930 </div> <!-- CSV option end -->
6931 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section ays-pro-features-v2-main-box">
6932 <div class="ays-pro-features-v2-small-buttons-box-middle ays-pro-features-v2-big-buttons-box">
6933 <a href="https://www.youtube.com/watch?v=9UqLXG5NU_I" target="_blank" class="ays-pro-features-v2-video-button">
6934 <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>
6935 <div class="ays-pro-features-v2-video-text">
6936 <?php echo esc_html(__("Watch Video" , "chart-builder")); ?>
6937 </div>
6938 </a>
6939 <a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-pro-features-v2-upgrade-button">
6940 <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>
6941 <div class="ays-pro-features-v2-upgrade-text">
6942 <?php echo esc_html(__("Upgrade" , "chart-builder")); ?>
6943 </div>
6944 </a>
6945 </div>
6946 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6947 <label for="ays-chart-option-export-Copy">
6948 <?php echo esc_html(__( "Copy chart data", "chart-builder" )); ?>
6949 <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") ); ?>">
6950 <i class="ays_fa ays_fa_info_circle"></i>
6951 </a>
6952 </label>
6953 </div>
6954 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6955 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6956 <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">
6957 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6958 </label>
6959 </div>
6960 </div> <!-- Copy option end -->
6961 <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">
6962 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
6963 <label for="ays-chart-option-export-img">
6964 <?php echo esc_html(__( "Download chart image", "chart-builder" )); ?>
6965 <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") ); ?>">
6966 <i class="ays_fa ays_fa_info_circle"></i>
6967 </a>
6968 </label>
6969 </div>
6970 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
6971 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
6972 <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)?> >
6973 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
6974 </label>
6975 </div>
6976 </div> <!-- IMG option end -->
6977 </div>
6978 </div>
6979 <?php
6980
6981 $content = ob_get_clean();
6982
6983 $title = __( 'Frontend Actions', "chart-builder" );
6984
6985 $sources['export_options'] = array(
6986 'content' => $content,
6987 'title' => $title
6988 );
6989
6990 return $sources;
6991 }
6992
6993 /**
6994 * Chart page styles contents
6995 * @param $args
6996 */
6997 public function ays_chart_page_styles_contents( $args ){
6998 $chart_source_type = $args['chart_source_type'];
6999
7000 if ($chart_source_type === 'chart-js') {
7001 $sources_contents = apply_filters( 'ays_cb_chart_page_styles_contents_settings_chartjs', array(), $args );
7002 } else {
7003 $sources_contents = apply_filters( 'ays_cb_chart_page_styles_contents_settings', array(), $args );
7004 }
7005
7006 $sources = array();
7007 foreach ( $sources_contents as $key => $sources_content ) {
7008 $collapsed = $key == 'chart' ? 'false' : 'true';
7009
7010 $content = '<fieldset class="ays-accordion-options-container" data-collapsed="' . $collapsed . '">';
7011 if(isset($sources_content['title'])){
7012 $content .= '<legend class="ays-accordion-options-header">';
7013 $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">
7014 <g>
7015 <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" />
7016 </g>
7017 </svg>';
7018
7019 $content .= '<span>'. esc_html($sources_content['title']) .'</span></legend>';
7020 }
7021
7022 $content .= '<div class="ays-accordion-options-content">';
7023 $content .= $sources_content['content'];
7024 $content .= '</div>';
7025
7026 $content .= '</fieldset>';
7027
7028 $sources[] = $content;
7029 }
7030 $content_for_escape = implode('' , $sources );
7031 echo html_entity_decode( esc_html($content_for_escape) );
7032 }
7033
7034 public function settings_contents_chart_styles_settings( $sources, $args ){
7035 $html_class_prefix = $args['html_class_prefix'];
7036 $html_name_prefix = $args['html_name_prefix'];
7037 $settings = $args['settings'];
7038
7039 $width = $settings['width'];
7040 $width_format = $settings['width_format'];
7041 $title_positions = $settings['title_positions'];
7042 $position = $settings['position'];
7043 $width_format_options = $settings['width_format_options'];
7044 $responsive_width = $settings['responsive_width'];
7045 $height = $settings['height'];
7046 $height_format = $settings['height_format'];
7047 $font_size = $settings['font_size'];
7048 $org_chart_font_size_options = $settings['org_chart_font_size_options'];
7049 $org_chart_font_size = $settings['org_chart_font_size'];
7050 $background_color = $settings['background_color'];
7051 $transparent_background = $settings['transparent_background'];
7052 $border_width = $settings['border_width'];
7053 $border_width_with_title = $settings['border_width_with_title'];
7054 $border_radius_with_title = $settings['border_radius_with_title'];
7055 $border_color_with_title = $settings['border_color_with_title'];
7056 $border_style_with_title = $settings['border_style_with_title'];
7057 $border_style = $settings['border_style'];
7058 $border_styles = $settings['border_styles'];
7059 $border_radius = $settings['border_radius'];
7060 $border_color = $settings['border_color'];
7061 $box_shadow = $settings['box_shadow'];
7062 $box_shadow_color = $settings['box_shadow_color'];
7063 $padding_outer = $settings['padding_outer'];
7064 ob_start();
7065 ?>
7066 <div class="ays-accordion-data-main-wrap">
7067 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
7068 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7069 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7070 <label for="ays-chart-option-width" class="form-label">
7071 <?php echo esc_html(__( "Width", "chart-builder" )); ?>
7072 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The width of the chart container, in percents.","chart-builder") ); ?>">
7073 <i class="ays_fa ays_fa_info_circle"></i>
7074 </a>
7075 </label>
7076 </div>
7077 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7078 <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) ?>">
7079 <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]">
7080 <?php
7081 foreach ( $width_format_options as $option_slug => $option ):
7082 $selected = ( $width_format == $option_slug ) ? 'selected' : '';
7083 ?>
7084 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7085 <?php
7086 endforeach;
7087 ?>
7088 </select>
7089 </div>
7090 </div> <!-- Width -->
7091 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7092 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7093 <label for="ays-chart-option-responsive-width" class="form-label">
7094 <?php echo esc_html(__( "Responsive Width", "chart-builder" )); ?>
7095 <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") ); ?>">
7096 <i class="ays_fa ays_fa_info_circle"></i>
7097 </a>
7098 </label>
7099 </div>
7100 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7101 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
7102 <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); ?> >
7103 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
7104 </label>
7105 </div>
7106 </div> <!-- Responsive Width -->
7107 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7108 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7109 <label for="ays-chart-option-position">
7110 <?php echo esc_html(__( "Position", "chart-builder" )); ?>
7111 <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") ); ?>">
7112 <i class="ays_fa ays_fa_info_circle"></i>
7113 </a>
7114 </label>
7115 </div>
7116 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7117 <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]">
7118 <?php
7119 foreach ( $title_positions as $option_slug => $option ):
7120 $selected = ( $position == $option_slug ) ? 'selected' : '';
7121 ?>
7122 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7123 <?php
7124 endforeach;
7125 ?>
7126 </select>
7127 </div>
7128 </div> <!-- Position -->
7129 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7130 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7131 <label for="ays-chart-option-height" class="form-label">
7132 <?php echo esc_html(__( "Height", "chart-builder" )); ?>
7133 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The height of the chart container, in pixels.","chart-builder") ); ?>">
7134 <i class="ays_fa ays_fa_info_circle"></i>
7135 </a>
7136 </label>
7137 </div>
7138 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7139 <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) ?>">
7140 <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]">
7141 <?php
7142 foreach ( $width_format_options as $option_slug => $option ):
7143 $selected = ( $height_format == $option_slug ) ? 'selected' : '';
7144 ?>
7145 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7146 <?php
7147 endforeach;
7148 ?>
7149 </select>
7150 </div>
7151 </div> <!-- Height -->
7152 <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">
7153 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7154 <label for="ays-chart-option-font-size" class="form-label">
7155 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
7156 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The font size of the chart text.","chart-builder") ); ?>">
7157 <i class="ays_fa ays_fa_info_circle"></i>
7158 </a>
7159 </label>
7160 </div>
7161 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7162 <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) ?>">
7163 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
7164 </div>
7165 </div> <!-- Font size -->
7166 <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">
7167 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7168 <label for="ays-chart-option-org-chart-font-size" class="form-label">
7169 <?php echo esc_html(__( "Element size", 'chart-builder' )); ?>
7170 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The size of the chart element.","chart-builder") ); ?>">
7171 <i class="ays_fa ays_fa_info_circle"></i>
7172 </a>
7173 </label>
7174 </div>
7175 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7176 <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]">
7177 <?php
7178 foreach ( $org_chart_font_size_options as $option_slug => $option ):
7179 $selected = ( $org_chart_font_size == $option_slug ) ? 'selected' : '';
7180 ?>
7181 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_attr($option); ?></option>
7182 <?php
7183 endforeach;
7184 ?>
7185 </select>
7186 </div>
7187 </div> <!-- Font size for org type -->
7188 <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">
7189 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7190 <label for="ays-chart-option-background-color">
7191 <?php echo esc_html(__( "Background Color", "chart-builder" )); ?>
7192 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The background color of the chart container.","chart-builder") ); ?>">
7193 <i class="ays_fa ays_fa_info_circle"></i>
7194 </a>
7195 </label>
7196 </div>
7197 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7198 <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) ?>">
7199 </div>
7200 </div> <!-- Background color -->
7201 <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">
7202 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7203 <label for="ays-chart-option-transparent-background" class="form-label">
7204 <?php echo esc_html(__( "Transparent background", "chart-builder" )); ?>
7205 <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") ); ?>">
7206 <i class="ays_fa ays_fa_info_circle"></i>
7207 </a>
7208 </label>
7209 </div>
7210 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7211 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
7212 <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); ?> >
7213 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
7214 </label>
7215 </div>
7216 </div> <!-- Transparent background -->
7217 <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">
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-width">
7220 <?php echo esc_html(__( "Border Width", "chart-builder" )); ?>
7221 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The width of the chart container border.","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-width" type="number" name="<?php echo esc_attr($html_name_prefix); ?>settings[border_width]" value="<?php echo esc_attr($border_width) ?>">
7228 </div>
7229 </div> <!-- Border Width -->
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">
7233 <?php echo esc_html(__( "Border Color", "chart-builder" )); ?>
7234 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The border color of the chart container.","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) ?>input-align-right">
7240 <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) ?>">
7241 </div>
7242 </div> <!-- Border color -->
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-radius">
7246 <?php echo esc_html(__( "Border Radius", "chart-builder" )); ?>
7247 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The border radius of the chart container.","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 <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) ?>">
7254 </div>
7255 </div> <!-- Border radius -->
7256 <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">
7257 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7258 <label for="ays-chart-option-border-style">
7259 <?php echo esc_html(__( "Border Style", "chart-builder" )); ?>
7260 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The style of the chart container border.","chart-builder") ); ?>">
7261 <i class="ays_fa ays_fa_info_circle"></i>
7262 </a>
7263 </label>
7264 </div>
7265 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7266 <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]">
7267 <?php
7268 foreach ( $border_styles as $option_slug => $option ):
7269 $selected = ( $border_style == $option_slug ) ? 'selected' : '';
7270 ?>
7271 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7272 <?php
7273 endforeach;
7274 ?>
7275 </select>
7276 </div>
7277 </div> <!-- Border style -->
7278 <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">
7279 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7280 <label for="ays-chart-option-box-shadow" class="form-label">
7281 <?php echo esc_html(__( "Box Shadow", "chart-builder" )); ?>
7282 <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") ); ?>">
7283 <i class="ays_fa ays_fa_info_circle"></i>
7284 </a>
7285 </label>
7286 </div>
7287 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7288 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
7289 <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); ?> >
7290 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
7291 </label>
7292 </div>
7293 </div> <!-- box shadow -->
7294 <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">
7295 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7296 <label for="ays-chart-option-box-shadow-color" class="form-label">
7297 <?php echo esc_html(__( "Box Shadow Color", "chart-builder" )); ?>
7298 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Choose chart container's box shadow color.","chart-builder") ); ?>">
7299 <i class="ays_fa ays_fa_info_circle"></i>
7300 </a>
7301 </label>
7302 </div>
7303 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7304 <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) ?>">
7305 </div>
7306 </div> <!-- box shadow color -->
7307 <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">
7308 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7309 <label for="ays-chart-option-border-width-with-title">
7310 <?php echo esc_html(__( "Border Width (including title)", "chart-builder" )); ?>
7311 <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") ); ?>">
7312 <i class="ays_fa ays_fa_info_circle"></i>
7313 </a>
7314 </label>
7315 </div>
7316 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7317 <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) ?>">
7318 </div>
7319 </div> <!-- Border Width with title -->
7320 <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">
7321 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7322 <label for="ays-chart-option-border-radius-with-title">
7323 <?php echo esc_html(__( "Border radius (including title)", "chart-builder" )); ?>
7324 <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") ); ?>">
7325 <i class="ays_fa ays_fa_info_circle"></i>
7326 </a>
7327 </label>
7328 </div>
7329 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7330 <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) ?>">
7331 </div>
7332 </div> <!-- Border radius with title -->
7333 <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">
7334 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7335 <label for="ays-chart-option-border-color-with-title">
7336 <?php echo esc_html(__( "Border Color (including title)", "chart-builder" )); ?>
7337 <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") ); ?>">
7338 <i class="ays_fa ays_fa_info_circle"></i>
7339 </a>
7340 </label>
7341 </div>
7342 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7343 <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) ?>">
7344 </div>
7345 </div> <!-- Border color with title -->
7346 <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">
7347 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7348 <label for="ays-chart-option-border-style-with-title">
7349 <?php echo esc_html(__( "Border Style (including title)", "chart-builder" )); ?>
7350 <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") ); ?>">
7351 <i class="ays_fa ays_fa_info_circle"></i>
7352 </a>
7353 </label>
7354 </div>
7355 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7356 <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]">
7357 <?php
7358 foreach ( $border_styles as $option_slug => $option ):
7359 $selected = ( $border_style_with_title == $option_slug ) ? 'selected' : '';
7360 ?>
7361 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7362 <?php
7363 endforeach;
7364 ?>
7365 </select>
7366 </div>
7367 </div> <!-- Border style with title -->
7368 <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">
7369 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7370 <label for="ays-chart-option-padding-outer">
7371 <?php echo esc_html(__( "Padding", "chart-builder" )); ?>
7372 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The padding of the chart container.","chart-builder") ); ?>">
7373 <i class="ays_fa ays_fa_info_circle"></i>
7374 </a>
7375 </label>
7376 </div>
7377 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7378 <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) ?>">
7379 </div>
7380 </div> <!-- Padding outer -->
7381 </div>
7382 </div>
7383 <?php
7384 $content = ob_get_clean();
7385
7386 $title = __( 'Chart', "chart-builder" );
7387
7388 $sources['chart'] = array(
7389 'content' => $content,
7390 'title' => $title
7391 );
7392
7393 return $sources;
7394 }
7395
7396 public function settings_contents_chart_styles_settings_chartjs( $sources, $args ){
7397 $html_class_prefix = $args['html_class_prefix'];
7398 $html_name_prefix = $args['html_name_prefix'];
7399 $settings = $args['settings'];
7400 $border_width_with_title = $settings['border_width_with_title'];
7401 $border_radius_with_title = $settings['border_radius_with_title'];
7402 $border_color_with_title = $settings['border_color_with_title'];
7403 $border_style_with_title = $settings['border_style_with_title'];
7404 $width = $settings['width'];
7405 $width_format = $settings['width_format'];
7406 $height = $settings['height'];
7407 $height_format = $settings['height_format'];
7408 $width_format_options = $settings['width_format_options'];
7409 $border_width = $settings['border_width'];
7410 $border_radius = $settings['border_radius'];
7411 $border_color = $settings['border_color'];
7412 $background_color_chart = $settings['background_color_chart'];
7413 $border_style = $settings['border_style'];
7414 $border_styles = $settings['border_styles'];
7415 $box_shadow = $settings['box_shadow'];
7416 $box_shadow_color = $settings['box_shadow_color'];
7417 $padding_outer = $settings['padding_outer'];
7418 ob_start();
7419 ?>
7420 <div class="ays-accordion-data-main-wrap">
7421 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
7422 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7423 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7424 <label for="ays-chart-option-width" class="form-label">
7425 <?php echo esc_html(__( "Width", "chart-builder" )); ?>
7426 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The width of the chart container, in percents.","chart-builder") ); ?>">
7427 <i class="ays_fa ays_fa_info_circle"></i>
7428 </a>
7429 </label>
7430 </div>
7431 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7432 <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) ?>">
7433 <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]">
7434 <?php
7435 foreach ( $width_format_options as $option_slug => $option ):
7436 $selected = ( $width_format == $option_slug ) ? 'selected' : '';
7437 ?>
7438 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7439 <?php
7440 endforeach;
7441 ?>
7442 </select>
7443 </div>
7444 </div> <!-- Width -->
7445 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7446 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7447 <label for="ays-chart-option-height" class="form-label">
7448 <?php echo esc_html(__( "Height", "chart-builder" )); ?>
7449 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The height of the chart container, in pixels.","chart-builder") ); ?>">
7450 <i class="ays_fa ays_fa_info_circle"></i>
7451 </a>
7452 </label>
7453 </div>
7454 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7455 <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) ?>">
7456 <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]">
7457 <?php
7458 foreach ( $width_format_options as $option_slug => $option ):
7459 $selected = ( $height_format == $option_slug ) ? 'selected' : '';
7460 ?>
7461 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7462 <?php
7463 endforeach;
7464 ?>
7465 </select>
7466 </div>
7467 </div> <!-- Height -->
7468 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7469 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7470 <label for="ays-chart-option-border-width">
7471 <?php echo esc_html(__( "Border Width", "chart-builder" )); ?>
7472 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The width of the chart container border.","chart-builder") ); ?>">
7473 <i class="ays_fa ays_fa_info_circle"></i>
7474 </a>
7475 </label>
7476 </div>
7477 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7478 <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) ?>">
7479 </div>
7480 </div> <!-- Border Width -->
7481 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7482 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7483 <label for="ays-chart-option-border-radius">
7484 <?php echo esc_html(__( "Border Radius", "chart-builder" )); ?>
7485 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The radius of the chart container border.","chart-builder") ); ?>">
7486 <i class="ays_fa ays_fa_info_circle"></i>
7487 </a>
7488 </label>
7489 </div>
7490 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7491 <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) ?>">
7492 </div>
7493 </div> <!-- Border Radius -->
7494 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7495 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7496 <label for="ays-chart-option-border-color">
7497 <?php echo esc_html(__( "Border Color", "chart-builder" )); ?>
7498 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The border color of the chart container.","chart-builder") ); ?>">
7499 <i class="ays_fa ays_fa_info_circle"></i>
7500 </a>
7501 </label>
7502 </div>
7503 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7504 <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) ?>">
7505 </div>
7506 </div> <!-- Border color -->
7507 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7508 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7509 <label for="ays-chart-option-border-style">
7510 <?php echo esc_html(__( "Border Style", "chart-builder" )); ?>
7511 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The style of the chart container border.","chart-builder") ); ?>">
7512 <i class="ays_fa ays_fa_info_circle"></i>
7513 </a>
7514 </label>
7515 </div>
7516 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7517 <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]">
7518 <?php
7519 foreach ( $border_styles as $option_slug => $option ):
7520 $selected = ( $border_style == $option_slug ) ? 'selected' : '';
7521 ?>
7522 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7523 <?php
7524 endforeach;
7525 ?>
7526 </select>
7527 </div>
7528 </div> <!-- Border style -->
7529 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7530 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7531 <label for="ays-chart-option-backgorund-color">
7532 <?php echo esc_html(__( "Background Color", "chart-builder" )); ?>
7533 <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") ); ?>">
7534 <i class="ays_fa ays_fa_info_circle"></i>
7535 </a>
7536 </label>
7537 </div>
7538 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7539 <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) ?>">
7540 </div>
7541 </div><!-- Background color -->
7542
7543 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7544 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7545 <label for="ays-chart-option-box-shadow" class="form-label">
7546 <?php echo esc_html(__( "Box Shadow", "chart-builder" )); ?>
7547 <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") ); ?>">
7548 <i class="ays_fa ays_fa_info_circle"></i>
7549 </a>
7550 </label>
7551 </div>
7552 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7553 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
7554 <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); ?> >
7555 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
7556 </label>
7557 </div>
7558 </div> <!-- box shadow -->
7559 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7560 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7561 <label for="ays-chart-option-box-shadow-color" class="form-label">
7562 <?php echo esc_html(__( "Box Shadow Color", "chart-builder" )); ?>
7563 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Choose chart container's box shadow color.","chart-builder") ); ?>">
7564 <i class="ays_fa ays_fa_info_circle"></i>
7565 </a>
7566 </label>
7567 </div>
7568 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7569 <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) ?>">
7570 </div>
7571 </div> <!-- box shadow color -->
7572 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7573 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7574 <label for="ays-chart-option-border-width-with-title">
7575 <?php echo esc_html(__( "Border Width (including title)", "chart-builder" )); ?>
7576 <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") ); ?>">
7577 <i class="ays_fa ays_fa_info_circle"></i>
7578 </a>
7579 </label>
7580 </div>
7581 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7582 <input class="ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input" id="ays-chart-option-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) ?>">
7583 </div>
7584 </div> <!-- Border Width with title -->
7585 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7586 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7587 <label for="ays-chart-option-border-radius-with-title">
7588 <?php echo esc_html(__( "Border Radius (including title)", "chart-builder" )); ?>
7589 <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") ); ?>">
7590 <i class="ays_fa ays_fa_info_circle"></i>
7591 </a>
7592 </label>
7593 </div>
7594 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7595 <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) ?>">
7596 </div>
7597 </div> <!-- Border radius with title -->
7598 <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">
7599 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7600 <label for="ays-chart-option-border-color-with-title">
7601 <?php echo esc_html(__( "Border Color (including title)", "chart-builder" )); ?>
7602 <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") ); ?>">
7603 <i class="ays_fa ays_fa_info_circle"></i>
7604 </a>
7605 </label>
7606 </div>
7607 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7608 <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) ?>">
7609 </div>
7610 </div> <!-- Border colro with title -->
7611 <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">
7612 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7613 <label for="ays-chart-option-border-style-with-title">
7614 <?php echo esc_html(__( "Border Style (including title)", "chart-builder" )); ?>
7615 <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") ); ?>">
7616 <i class="ays_fa ays_fa_info_circle"></i>
7617 </a>
7618 </label>
7619 </div>
7620 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7621 <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]">
7622 <?php
7623 foreach ( $border_styles as $option_slug => $option ):
7624 $selected = ( $border_style_with_title == $option_slug ) ? 'selected' : '';
7625 ?>
7626 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7627 <?php
7628 endforeach;
7629 ?>
7630 </select>
7631 </div>
7632 </div> <!-- Border style with title -->
7633 <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">
7634 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7635 <label for="ays-chart-option-padding-outer">
7636 <?php echo esc_html(__( "Padding", "chart-builder" )); ?>
7637 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The padding of the chart container.","chart-builder") ); ?>">
7638 <i class="ays_fa ays_fa_info_circle"></i>
7639 </a>
7640 </label>
7641 </div>
7642 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7643 <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) ?>">
7644 </div>
7645 </div> <!-- Padding outer -->
7646 </div>
7647 </div>
7648 <?php
7649 $content = ob_get_clean();
7650
7651 $title = __( 'Chart', "chart-builder" );
7652
7653 $sources['chart'] = array(
7654 'content' => $content,
7655 'title' => $title
7656 );
7657
7658 return $sources;
7659 }
7660
7661 public function settings_contents_chart_area_styles_settings( $sources, $args ){
7662 $html_class_prefix = $args['html_class_prefix'];
7663 $html_name_prefix = $args['html_name_prefix'];
7664 $settings = $args['settings'];
7665
7666 $chart_background_color = $settings['chart_background_color'];
7667 $chart_border_color = $settings['chart_border_color'];
7668 $chart_left_margin = $settings['chart_left_margin'];
7669 $chart_right_margin = $settings['chart_right_margin'];
7670 $chart_top_margin = $settings['chart_top_margin'];
7671 $chart_bottom_margin = $settings['chart_bottom_margin'];
7672 $chart_border_width = $settings['chart_border_width'];
7673 ob_start();
7674 ?>
7675 <div class="ays-accordion-data-main-wrap">
7676 <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">
7677 <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">
7678 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7679 <label for="ays-chart-option-chart-background-color">
7680 <?php echo esc_html(__( "Background Color", "chart-builder" )); ?>
7681 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The background color of the chart area.","chart-builder") ); ?>">
7682 <i class="ays_fa ays_fa_info_circle"></i>
7683 </a>
7684 </label>
7685 </div>
7686 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7687 <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) ?>">
7688 </div>
7689 </div> <!-- Chart Area background color -->
7690 <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">
7691 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7692 <label for="ays-chart-option-chart-border-width">
7693 <?php echo esc_html(__( "Border Width", "chart-builder" )); ?>
7694 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The border width of the chart area.","chart-builder") ); ?>">
7695 <i class="ays_fa ays_fa_info_circle"></i>
7696 </a>
7697 </label>
7698 </div>
7699 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7700 <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) ?>">
7701 </div>
7702 </div> <!-- Chart Area Border Width -->
7703 <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">
7704 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7705 <label for="ays-chart-option-chart-border-color">
7706 <?php echo esc_html(__( "Border Color", "chart-builder" )); ?>
7707 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The border color of the chart area.","chart-builder") ); ?>">
7708 <i class="ays_fa ays_fa_info_circle"></i>
7709 </a>
7710 </label>
7711 </div>
7712 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7713 <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) ?>">
7714 </div>
7715 </div> <!-- Chart Area border color -->
7716 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7717 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7718 <label for="ays-chart-option-chart-left-margin">
7719 <?php echo esc_html(__( "Left Margin", "chart-builder" )); ?>
7720 <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") ); ?>">
7721 <i class="ays_fa ays_fa_info_circle"></i>
7722 </a>
7723 </label>
7724 </div>
7725 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7726 <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) ?>">
7727 </div>
7728 </div> <!-- Chart Area Left Margin -->
7729 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7730 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7731 <label for="ays-chart-option-chart-right-margin">
7732 <?php echo esc_html(__( "Right Margin", "chart-builder" )); ?>
7733 <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") ); ?>">
7734 <i class="ays_fa ays_fa_info_circle"></i>
7735 </a>
7736 </label>
7737 </div>
7738 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7739 <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) ?>">
7740 </div>
7741 </div> <!-- Chart Area Right Margin -->
7742 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7743 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7744 <label for="ays-chart-option-chart-top-margin">
7745 <?php echo esc_html(__( "Top Margin", "chart-builder" )); ?>
7746 <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") ); ?>">
7747 <i class="ays_fa ays_fa_info_circle"></i>
7748 </a>
7749 </label>
7750 </div>
7751 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7752 <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) ?>">
7753 </div>
7754 </div> <!-- Chart Area Top Margin -->
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-chart-bottom-margin">
7758 <?php echo esc_html(__( "Bottom Margin", "chart-builder" )); ?>
7759 <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") ); ?>">
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-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) ?>">
7766 </div>
7767 </div> <!-- Chart Area Bottom Margin -->
7768 </div>
7769 </div>
7770 <?php
7771 $content = ob_get_clean();
7772
7773 $title = __( 'Chart Area', "chart-builder" );
7774
7775 $sources['chart_area'] = array(
7776 'content' => $content,
7777 'title' => $title
7778 );
7779
7780 return $sources;
7781 }
7782
7783 public function settings_contents_title_styles_settings( $sources, $args ){
7784 $html_class_prefix = $args['html_class_prefix'];
7785 $html_name_prefix = $args['html_name_prefix'];
7786 $settings = $args['settings'];
7787
7788 $title_color = $settings['title_color'];
7789 $title_shadow_color = $settings['title_shadow_color'];
7790 $title_font_size = $settings['title_font_size'];
7791 $title_gap = $settings['title_gap'];
7792 $title_gap_description = $settings['title_gap_description'];
7793 $title_positions = $settings['title_positions'];
7794 $title_position = $settings['title_position'];
7795 $title_bold = $settings['title_bold'];
7796 $title_text_shadow = $settings['title_text_shadow'];
7797 $title_italic = $settings['title_italic'];
7798 $text_transforms = $settings['text_transforms'];
7799 $text_decorations = $settings['text_decorations'];
7800 $title_text_transform = $settings['title_text_transform'];
7801 $title_text_decoration = $settings['title_text_decoration'];
7802 $title_letter_spacing = $settings['title_letter_spacing'];
7803 ob_start();
7804 ?>
7805 <div class="ays-accordion-data-main-wrap">
7806 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
7807 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7808 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7809 <label for="ays-chart-option-title-color">
7810 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
7811 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the chart title.","chart-builder") ); ?>">
7812 <i class="ays_fa ays_fa_info_circle"></i>
7813 </a>
7814 </label>
7815 </div>
7816 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7817 <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) ?>">
7818 </div>
7819 </div> <!-- Chart title color -->
7820 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7821 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7822 <label for="ays-chart-option-title-font-size" class="form-label">
7823 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
7824 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The font size of the chart title.","chart-builder") ); ?>">
7825 <i class="ays_fa ays_fa_info_circle"></i>
7826 </a>
7827 </label>
7828 </div>
7829 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7830 <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) ?>">
7831 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
7832 </div>
7833 </div> <!-- Chart title font size -->
7834 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7835 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7836 <label for="ays-chart-option-title-bold" class="form-label">
7837 <?php echo esc_html(__( "Bold text", "chart-builder" )); ?>
7838 <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") ); ?>">
7839 <i class="ays_fa ays_fa_info_circle"></i>
7840 </a>
7841 </label>
7842 </div>
7843 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7844 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
7845 <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); ?> >
7846 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
7847 </label>
7848 </div>
7849 </div> <!-- Title bold -->
7850 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7851 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7852 <label for="ays-chart-option-title-italic" class="form-label">
7853 <?php echo esc_html(__( "Italic text", "chart-builder" )); ?>
7854 <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") ); ?>">
7855 <i class="ays_fa ays_fa_info_circle"></i>
7856 </a>
7857 </label>
7858 </div>
7859 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7860 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
7861 <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); ?> >
7862 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
7863 </label>
7864 </div>
7865 </div> <!-- Title italic -->
7866 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7867 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7868 <label for="ays-chart-option-title-position">
7869 <?php echo esc_html(__( "Position", "chart-builder" )); ?>
7870 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The position of the chart title.","chart-builder") ); ?>">
7871 <i class="ays_fa ays_fa_info_circle"></i>
7872 </a>
7873 </label>
7874 </div>
7875 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7876 <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]">
7877 <?php
7878 foreach ( $title_positions as $option_slug => $option ):
7879 $selected = ( $title_position == $option_slug ) ? 'selected' : '';
7880 ?>
7881 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7882 <?php
7883 endforeach;
7884 ?>
7885 </select>
7886 </div>
7887 </div> <!-- Title position -->
7888 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7889 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7890 <label for="ays-chart-option-title-gap" class="form-label">
7891 <?php echo esc_html(__( "Gap", "chart-builder" )); ?>
7892 <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") ); ?>">
7893 <i class="ays_fa ays_fa_info_circle"></i>
7894 </a>
7895 </label>
7896 </div>
7897 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7898 <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) ?>">
7899 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
7900 </div>
7901 </div> <!-- Chart title gap -->
7902 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7903 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7904 <label for="ays-chart-option-title-gap-description" class="form-label">
7905 <?php echo esc_html(__( "Distance from description", "chart-builder" )); ?>
7906 <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") ); ?>">
7907 <i class="ays_fa ays_fa_info_circle"></i>
7908 </a>
7909 </label>
7910 </div>
7911 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7912 <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) ?>">
7913 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
7914 </div>
7915 </div> <!-- Chart title gap -->
7916 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7917 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7918 <label for="ays-chart-option-title-text-transform">
7919 <?php echo esc_html(__( "Text-transform", "chart-builder" )); ?>
7920 <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") ); ?>">
7921 <i class="ays_fa ays_fa_info_circle"></i>
7922 </a>
7923 </label>
7924 </div>
7925 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7926 <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]">
7927 <?php
7928 foreach ( $text_transforms as $option_slug => $option ):
7929 $selected = ( $title_text_transform == $option_slug ) ? 'selected' : '';
7930 ?>
7931 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7932 <?php
7933 endforeach;
7934 ?>
7935 </select>
7936 </div>
7937 </div> <!-- Title text transform -->
7938 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7939 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7940 <label for="ays-chart-option-title-letter-spacing" class="form-label">
7941 <?php echo esc_html(__( "Letter spacing", "chart-builder" )); ?>
7942 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Specify the space between the chart title letters.","chart-builder") ); ?>">
7943 <i class="ays_fa ays_fa_info_circle"></i>
7944 </a>
7945 </label>
7946 </div>
7947 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7948 <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) ?>">
7949 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
7950 </div>
7951 </div> <!-- Chart title letter spacing -->
7952 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7953 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7954 <label for="ays-chart-option-title-text-decoration">
7955 <?php echo esc_html(__( "Text-decoration", "chart-builder" )); ?>
7956 <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") ); ?>">
7957 <i class="ays_fa ays_fa_info_circle"></i>
7958 </a>
7959 </label>
7960 </div>
7961 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
7962 <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]">
7963 <?php
7964 foreach ( $text_decorations as $option_slug => $option ):
7965 $selected = ( $title_text_decoration == $option_slug ) ? 'selected' : '';
7966 ?>
7967 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
7968 <?php
7969 endforeach;
7970 ?>
7971 </select>
7972 </div>
7973 </div> <!-- Title text decoration -->
7974 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7975 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7976 <label for="ays-chart-option-title-text-shadow" class="form-label">
7977 <?php echo esc_html(__( "Text shadow", "chart-builder" )); ?>
7978 <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") ); ?>">
7979 <i class="ays_fa ays_fa_info_circle"></i>
7980 </a>
7981 </label>
7982 </div>
7983 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
7984 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
7985 <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); ?> >
7986 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
7987 </label>
7988 </div>
7989 </div> <!-- Title bold -->
7990 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
7991 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
7992 <label for="ays-chart-option-title-shadow-color">
7993 <?php echo esc_html(__( "Text Shadow Color", "chart-builder" )); ?>
7994 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The text shadow color of the chart title.","chart-builder") ); ?>">
7995 <i class="ays_fa ays_fa_info_circle"></i>
7996 </a>
7997 </label>
7998 </div>
7999 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8000 <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) ?>">
8001 </div>
8002 </div> <!-- Chart title color -->
8003 </div>
8004 </div>
8005 <?php
8006 $content = ob_get_clean();
8007
8008 $title = __( 'Title', "chart-builder" );
8009
8010 $sources['title'] = array(
8011 'content' => $content,
8012 'title' => $title
8013 );
8014
8015 return $sources;
8016 }
8017
8018 public function settings_contents_title_styles_settings_chartjs( $sources, $args ){
8019 $html_class_prefix = $args['html_class_prefix'];
8020 $html_name_prefix = $args['html_name_prefix'];
8021 $settings = $args['settings'];
8022
8023 $title_color = $settings['title_color'];
8024 $title_shadow_color = $settings['title_shadow_color'];
8025 $title_font_size = $settings['title_font_size'];
8026 $title_gap = $settings['title_gap'];
8027 $title_gap_description = $settings['title_gap_description'];
8028 $title_positions = $settings['title_positions'];
8029 $title_position = $settings['title_position'];
8030 $title_bold = $settings['title_bold'];
8031 $title_text_shadow = $settings['title_text_shadow'];
8032 $title_italic = $settings['title_italic'];
8033 $text_transforms = $settings['text_transforms'];
8034 $text_decorations = $settings['text_decorations'];
8035 $title_text_transform = $settings['title_text_transform'];
8036 $title_text_decoration = $settings['title_text_decoration'];
8037 $title_letter_spacing = $settings['title_letter_spacing'];
8038 ob_start();
8039 ?>
8040 <div class="ays-accordion-data-main-wrap">
8041 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
8042 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8043 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8044 <label for="ays-chart-option-title-color">
8045 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
8046 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the chart title.","chart-builder") ); ?>">
8047 <i class="ays_fa ays_fa_info_circle"></i>
8048 </a>
8049 </label>
8050 </div>
8051 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8052 <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) ?>">
8053 </div>
8054 </div> <!-- Chart title color -->
8055 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8056 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8057 <label for="ays-chart-option-title-font-size" class="form-label">
8058 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
8059 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The font size of the chart title.","chart-builder") ); ?>">
8060 <i class="ays_fa ays_fa_info_circle"></i>
8061 </a>
8062 </label>
8063 </div>
8064 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8065 <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) ?>">
8066 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
8067 </div>
8068 </div> <!-- Chart title font size -->
8069 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8070 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8071 <label for="ays-chart-option-title-bold" class="form-label">
8072 <?php echo esc_html(__( "Bold text", "chart-builder" )); ?>
8073 <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") ); ?>">
8074 <i class="ays_fa ays_fa_info_circle"></i>
8075 </a>
8076 </label>
8077 </div>
8078 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8079 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
8080 <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); ?> >
8081 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
8082 </label>
8083 </div>
8084 </div> <!-- Title bold -->
8085 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8086 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8087 <label for="ays-chart-option-title-italic" class="form-label">
8088 <?php echo esc_html(__( "Italic text", "chart-builder" )); ?>
8089 <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") ); ?>">
8090 <i class="ays_fa ays_fa_info_circle"></i>
8091 </a>
8092 </label>
8093 </div>
8094 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8095 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
8096 <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); ?> >
8097 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
8098 </label>
8099 </div>
8100 </div> <!-- Title italic -->
8101 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8102 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8103 <label for="ays-chart-option-title-position">
8104 <?php echo esc_html(__( "Position", "chart-builder" )); ?>
8105 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The position of the chart title.","chart-builder") ); ?>">
8106 <i class="ays_fa ays_fa_info_circle"></i>
8107 </a>
8108 </label>
8109 </div>
8110 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8111 <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]">
8112 <?php
8113 foreach ( $title_positions as $option_slug => $option ):
8114 $selected = ( $title_position == $option_slug ) ? 'selected' : '';
8115 ?>
8116 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8117 <?php
8118 endforeach;
8119 ?>
8120 </select>
8121 </div>
8122 </div> <!-- Title position -->
8123 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8124 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8125 <label for="ays-chart-option-title-gap" class="form-label">
8126 <?php echo esc_html(__( "Gap", "chart-builder" )); ?>
8127 <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") ); ?>">
8128 <i class="ays_fa ays_fa_info_circle"></i>
8129 </a>
8130 </label>
8131 </div>
8132 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8133 <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) ?>">
8134 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
8135 </div>
8136 </div> <!-- Chart title gap -->
8137 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8138 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8139 <label for="ays-chart-option-title-gap-description" class="form-label">
8140 <?php echo esc_html(__( "Distance from description", "chart-builder" )); ?>
8141 <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") ); ?>">
8142 <i class="ays_fa ays_fa_info_circle"></i>
8143 </a>
8144 </label>
8145 </div>
8146 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8147 <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) ?>">
8148 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
8149 </div>
8150 </div> <!-- Chart title gap -->
8151 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8152 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8153 <label for="ays-chart-option-title-text-transform">
8154 <?php echo esc_html(__( "Text-transform", "chart-builder" )); ?>
8155 <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") ); ?>">
8156 <i class="ays_fa ays_fa_info_circle"></i>
8157 </a>
8158 </label>
8159 </div>
8160 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8161 <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]">
8162 <?php
8163 foreach ( $text_transforms as $option_slug => $option ):
8164 $selected = ( $title_text_transform == $option_slug ) ? 'selected' : '';
8165 ?>
8166 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8167 <?php
8168 endforeach;
8169 ?>
8170 </select>
8171 </div>
8172 </div> <!-- Title text transform -->
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-title-letter-spacing" class="form-label">
8176 <?php echo esc_html(__( "Letter spacing", "chart-builder" )); ?>
8177 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Specify the space between the chart title letters.","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 <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) ?>">
8184 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
8185 </div>
8186 </div> <!-- Chart title letter spacing -->
8187 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8188 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8189 <label for="ays-chart-option-title-text-decoration">
8190 <?php echo esc_html(__( "Text-decoration", "chart-builder" )); ?>
8191 <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") ); ?>">
8192 <i class="ays_fa ays_fa_info_circle"></i>
8193 </a>
8194 </label>
8195 </div>
8196 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8197 <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]">
8198 <?php
8199 foreach ( $text_decorations as $option_slug => $option ):
8200 $selected = ( $title_text_decoration == $option_slug ) ? 'selected' : '';
8201 ?>
8202 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8203 <?php
8204 endforeach;
8205 ?>
8206 </select>
8207 </div>
8208 </div> <!-- Title text decoration -->
8209 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8210 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8211 <label for="ays-chart-option-title-text-shadow" class="form-label">
8212 <?php echo esc_html(__( "Text shadow", "chart-builder" )); ?>
8213 <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") ); ?>">
8214 <i class="ays_fa ays_fa_info_circle"></i>
8215 </a>
8216 </label>
8217 </div>
8218 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8219 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
8220 <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); ?> >
8221 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
8222 </label>
8223 </div>
8224 </div> <!-- Title bold -->
8225 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8226 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8227 <label for="ays-chart-option-title-shadow-color">
8228 <?php echo esc_html(__( "Text Shadow Color", "chart-builder" )); ?>
8229 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The text shadow color of the chart title.","chart-builder") ); ?>">
8230 <i class="ays_fa ays_fa_info_circle"></i>
8231 </a>
8232 </label>
8233 </div>
8234 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8235 <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) ?>">
8236 </div>
8237 </div> <!-- Chart title color -->
8238 </div>
8239 </div>
8240 <?php
8241 $content = ob_get_clean();
8242
8243 $title = __( 'Title', "chart-builder" );
8244
8245 $sources['title'] = array(
8246 'content' => $content,
8247 'title' => $title
8248 );
8249
8250 return $sources;
8251 }
8252
8253 public function settings_contents_description_styles_settings( $sources, $args ){
8254 $html_class_prefix = $args['html_class_prefix'];
8255 $html_name_prefix = $args['html_name_prefix'];
8256 $settings = $args['settings'];
8257
8258 $description_color = $settings['description_color'];
8259 $description_font_size = $settings['description_font_size'];
8260 $title_positions = $settings['title_positions'];
8261 $description_position = $settings['description_position'];
8262 $description_bold = $settings['description_bold'];
8263 $description_text_shadow = $settings['description_text_shadow'];
8264 $description_shadow_color = $settings['description_shadow_color'];
8265 $description_italic = $settings['description_italic'];
8266 $text_transforms = $settings['text_transforms'];
8267 $text_decorations = $settings['text_decorations'];
8268 $description_text_transform = $settings['description_text_transform'];
8269 $description_text_decoration = $settings['description_text_decoration'];
8270 $description_letter_spacing = $settings['description_letter_spacing'];
8271
8272 ob_start();
8273 ?>
8274 <div class="ays-accordion-data-main-wrap">
8275 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
8276 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8277 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8278 <label for="ays-chart-option-description-color">
8279 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
8280 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the chart description.","chart-builder") ); ?>">
8281 <i class="ays_fa ays_fa_info_circle"></i>
8282 </a>
8283 </label>
8284 </div>
8285 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8286 <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) ?>">
8287 </div>
8288 </div> <!-- Chart description color -->
8289 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8290 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8291 <label for="ays-chart-option-description-font-size" class="form-label">
8292 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
8293 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The font size of the chart description.","chart-builder") ); ?>">
8294 <i class="ays_fa ays_fa_info_circle"></i>
8295 </a>
8296 </label>
8297 </div>
8298 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8299 <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) ?>">
8300 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
8301 </div>
8302 </div> <!-- Chart description font size -->
8303 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8304 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8305 <label for="ays-chart-option-description-bold" class="form-label">
8306 <?php echo esc_html(__( "Bold text", "chart-builder" )); ?>
8307 <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") ); ?>">
8308 <i class="ays_fa ays_fa_info_circle"></i>
8309 </a>
8310 </label>
8311 </div>
8312 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8313 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
8314 <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); ?> >
8315 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
8316 </label>
8317 </div>
8318 </div> <!-- Description bold -->
8319 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8320 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8321 <label for="ays-chart-option-description-italic" class="form-label">
8322 <?php echo esc_html(__( "Italic text", "chart-builder" )); ?>
8323 <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") ); ?>">
8324 <i class="ays_fa ays_fa_info_circle"></i>
8325 </a>
8326 </label>
8327 </div>
8328 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8329 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
8330 <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); ?> >
8331 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
8332 </label>
8333 </div>
8334 </div> <!-- Description italic -->
8335 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8336 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8337 <label for="ays-chart-option-description-position">
8338 <?php echo esc_html(__( "Position", "chart-builder" )); ?>
8339 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The position of the chart description.","chart-builder") ); ?>">
8340 <i class="ays_fa ays_fa_info_circle"></i>
8341 </a>
8342 </label>
8343 </div>
8344 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8345 <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]">
8346 <?php
8347 foreach ( $title_positions as $option_slug => $option ):
8348 $selected = ( $description_position == $option_slug ) ? 'selected' : '';
8349 ?>
8350 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8351 <?php
8352 endforeach;
8353 ?>
8354 </select>
8355 </div>
8356 </div> <!-- Description position -->
8357 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8358 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8359 <label for="ays-chart-option-description-text-transform">
8360 <?php echo esc_html(__( "Text-transform", "chart-builder" )); ?>
8361 <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") ); ?>">
8362 <i class="ays_fa ays_fa_info_circle"></i>
8363 </a>
8364 </label>
8365 </div>
8366 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8367 <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]">
8368 <?php
8369 foreach ( $text_transforms as $option_slug => $option ):
8370 $selected = ( $description_text_transform == $option_slug ) ? 'selected' : '';
8371 ?>
8372 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8373 <?php
8374 endforeach;
8375 ?>
8376 </select>
8377 </div>
8378 </div> <!-- description text transform -->
8379 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8380 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8381 <label for="ays-chart-option-description-letter-spacing" class="form-label">
8382 <?php echo esc_html(__( "Letter spacing", "chart-builder" )); ?>
8383 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Specify the space between the chart description letters.","chart-builder") ); ?>">
8384 <i class="ays_fa ays_fa_info_circle"></i>
8385 </a>
8386 </label>
8387 </div>
8388 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8389 <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) ?>">
8390 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
8391 </div>
8392 </div> <!-- Chart description letter spacing -->
8393 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8394 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8395 <label for="ays-chart-option-description-text-decoration">
8396 <?php echo esc_html(__( "Text-decoration", "chart-builder" )); ?>
8397 <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") ); ?>">
8398 <i class="ays_fa ays_fa_info_circle"></i>
8399 </a>
8400 </label>
8401 </div>
8402 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8403 <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]">
8404 <?php
8405 foreach ( $text_decorations as $option_slug => $option ):
8406 $selected = ( $description_text_decoration == $option_slug ) ? 'selected' : '';
8407 ?>
8408 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8409 <?php
8410 endforeach;
8411 ?>
8412 </select>
8413 </div>
8414 </div> <!-- description text decoration -->
8415 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8416 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8417 <label for="ays-chart-option-description-text-shadow" class="form-label">
8418 <?php echo esc_html(__( "Text shadow", "chart-builder" )); ?>
8419 <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") ); ?>">
8420 <i class="ays_fa ays_fa_info_circle"></i>
8421 </a>
8422 </label>
8423 </div>
8424 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8425 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
8426 <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); ?> >
8427 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
8428 </label>
8429 </div>
8430 </div> <!-- description bold -->
8431 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8432 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8433 <label for="ays-chart-option-description-shadow-color">
8434 <?php echo esc_html(__( "Text Shadow Color", "chart-builder" )); ?>
8435 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The text shadow color of the chart description.","chart-builder") ); ?>">
8436 <i class="ays_fa ays_fa_info_circle"></i>
8437 </a>
8438 </label>
8439 </div>
8440 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8441 <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) ?>">
8442 </div>
8443 </div> <!-- Chart title color -->
8444 </div>
8445 </div>
8446 <?php
8447 $content = ob_get_clean();
8448
8449 $title = __( 'Description', "chart-builder" );
8450
8451 $sources['description'] = array(
8452 'content' => $content,
8453 'title' => $title
8454 );
8455
8456 return $sources;
8457 }
8458
8459 public function settings_contents_description_styles_settings_chartjs( $sources, $args ){
8460 $html_class_prefix = $args['html_class_prefix'];
8461 $html_name_prefix = $args['html_name_prefix'];
8462 $settings = $args['settings'];
8463
8464 $description_color = $settings['description_color'];
8465 $description_font_size = $settings['description_font_size'];
8466 $title_positions = $settings['title_positions'];
8467 $description_position = $settings['description_position'];
8468 $description_bold = $settings['description_bold'];
8469 $description_text_shadow = $settings['description_text_shadow'];
8470 $description_shadow_color = $settings['description_shadow_color'];
8471 $description_italic = $settings['description_italic'];
8472 $text_transforms = $settings['text_transforms'];
8473 $text_decorations = $settings['text_decorations'];
8474 $description_text_transform = $settings['description_text_transform'];
8475 $description_text_decoration = $settings['description_text_decoration'];
8476 $description_letter_spacing = $settings['description_letter_spacing'];
8477
8478 ob_start();
8479 ?>
8480 <div class="ays-accordion-data-main-wrap">
8481 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
8482 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8483 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8484 <label for="ays-chart-option-description-color">
8485 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
8486 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the chart description.","chart-builder") ); ?>">
8487 <i class="ays_fa ays_fa_info_circle"></i>
8488 </a>
8489 </label>
8490 </div>
8491 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8492 <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) ?>">
8493 </div>
8494 </div> <!-- Chart description color -->
8495 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8496 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8497 <label for="ays-chart-option-description-font-size" class="form-label">
8498 <?php echo esc_html(__( "Font size", "chart-builder" )); ?>
8499 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The font size of the chart description.","chart-builder") ); ?>">
8500 <i class="ays_fa ays_fa_info_circle"></i>
8501 </a>
8502 </label>
8503 </div>
8504 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8505 <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) ?>">
8506 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
8507 </div>
8508 </div> <!-- Chart description font size -->
8509 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
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-description-bold" class="form-label">
8512 <?php echo esc_html(__( "Bold text", "chart-builder" )); ?>
8513 <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") ); ?>">
8514 <i class="ays_fa ays_fa_info_circle"></i>
8515 </a>
8516 </label>
8517 </div>
8518 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8519 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
8520 <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); ?> >
8521 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
8522 </label>
8523 </div>
8524 </div> <!-- Description bold -->
8525 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8526 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8527 <label for="ays-chart-option-description-italic" class="form-label">
8528 <?php echo esc_html(__( "Italic text", "chart-builder" )); ?>
8529 <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") ); ?>">
8530 <i class="ays_fa ays_fa_info_circle"></i>
8531 </a>
8532 </label>
8533 </div>
8534 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8535 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
8536 <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); ?> >
8537 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
8538 </label>
8539 </div>
8540 </div> <!-- Description italic -->
8541 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8542 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8543 <label for="ays-chart-option-description-position">
8544 <?php echo esc_html(__( "Position", "chart-builder" )); ?>
8545 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The position of the chart description.","chart-builder") ); ?>">
8546 <i class="ays_fa ays_fa_info_circle"></i>
8547 </a>
8548 </label>
8549 </div>
8550 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8551 <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]">
8552 <?php
8553 foreach ( $title_positions as $option_slug => $option ):
8554 $selected = ( $description_position == $option_slug ) ? 'selected' : '';
8555 ?>
8556 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8557 <?php
8558 endforeach;
8559 ?>
8560 </select>
8561 </div>
8562 </div> <!-- Description position -->
8563 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8564 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8565 <label for="ays-chart-option-description-text-transform">
8566 <?php echo esc_html(__( "Text-transform", "chart-builder" )); ?>
8567 <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") ); ?>">
8568 <i class="ays_fa ays_fa_info_circle"></i>
8569 </a>
8570 </label>
8571 </div>
8572 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8573 <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]">
8574 <?php
8575 foreach ( $text_transforms as $option_slug => $option ):
8576 $selected = ( $description_text_transform == $option_slug ) ? 'selected' : '';
8577 ?>
8578 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8579 <?php
8580 endforeach;
8581 ?>
8582 </select>
8583 </div>
8584 </div> <!-- description text transform -->
8585 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8586 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8587 <label for="ays-chart-option-description-letter-spacing" class="form-label">
8588 <?php echo esc_html(__( "Letter spacing", "chart-builder" )); ?>
8589 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Specify the space between the chart description letters.","chart-builder") ); ?>">
8590 <i class="ays_fa ays_fa_info_circle"></i>
8591 </a>
8592 </label>
8593 </div>
8594 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8595 <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) ?>">
8596 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
8597 </div>
8598 </div> <!-- Chart description letter spacing -->
8599 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8600 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8601 <label for="ays-chart-option-description-text-decoration">
8602 <?php echo esc_html(__( "Text-decoration", "chart-builder" )); ?>
8603 <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") ); ?>">
8604 <i class="ays_fa ays_fa_info_circle"></i>
8605 </a>
8606 </label>
8607 </div>
8608 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8609 <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]">
8610 <?php
8611 foreach ( $text_decorations as $option_slug => $option ):
8612 $selected = ( $description_text_decoration == $option_slug ) ? 'selected' : '';
8613 ?>
8614 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8615 <?php
8616 endforeach;
8617 ?>
8618 </select>
8619 </div>
8620 </div> <!-- description text decoration -->
8621 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8622 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8623 <label for="ays-chart-option-description-text-shadow" class="form-label">
8624 <?php echo esc_html(__( "Text shadow", "chart-builder" )); ?>
8625 <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") ); ?>">
8626 <i class="ays_fa ays_fa_info_circle"></i>
8627 </a>
8628 </label>
8629 </div>
8630 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8631 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
8632 <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); ?> >
8633 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
8634 </label>
8635 </div>
8636 </div> <!-- description bold -->
8637 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
8638 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8639 <label for="ays-chart-option-description-shadow-color">
8640 <?php echo esc_html(__( "Text Shadow Color", "chart-builder" )); ?>
8641 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The text shadow color of the chart description.","chart-builder") ); ?>">
8642 <i class="ays_fa ays_fa_info_circle"></i>
8643 </a>
8644 </label>
8645 </div>
8646 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8647 <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) ?>">
8648 </div>
8649 </div> <!-- Chart title color -->
8650 </div>
8651 </div>
8652 <?php
8653 $content = ob_get_clean();
8654
8655 $title = __( 'Description', "chart-builder" );
8656
8657 $sources['description'] = array(
8658 'content' => $content,
8659 'title' => $title
8660 );
8661
8662 return $sources;
8663 }
8664
8665 /**
8666 * Chart page settings contents
8667 * @param $args
8668 */
8669 public function ays_chart_page_advanced_settings_contents( $args ){
8670 $chart_source_type = $args['chart_source_type'];
8671
8672 if ($chart_source_type === 'chart-js') {
8673 if ($args['source_chart_type'] !== 'pie_chart') {return;}
8674 $sources_contents = apply_filters( 'ays_cb_chart_page_advanced_settings_contents_settings_chartjs', array(), $args );
8675 } else {
8676 $sources_contents = apply_filters( 'ays_cb_chart_page_advanced_settings_contents_settings', array(), $args );
8677 }
8678
8679 $sources = array();
8680 foreach ( $sources_contents as $key => $sources_content ) {
8681 $collapsed = $key == 'advanced_settings' ? 'false' : 'true';
8682
8683 $content = '<fieldset class="ays-accordion-options-container" data-collapsed="' . $collapsed . '">';
8684 if(isset($sources_content['title'])){
8685 $content .= '<legend class="ays-accordion-options-header">';
8686 $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">
8687 <g>
8688 <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" />
8689 </g>
8690 </svg>';
8691
8692 $content .= '<span>'. esc_html($sources_content['title']) .'</span></legend>';
8693 }
8694
8695 $content .= '<div class="ays-accordion-options-content">';
8696 $content .= $sources_content['content'];
8697 $content .= '</div>';
8698
8699 $content .= '</fieldset>';
8700
8701 $sources[] = $content;
8702 }
8703 $content_for_escape = implode('' , $sources );
8704 echo html_entity_decode( esc_html($content_for_escape) );
8705 }
8706
8707 public function settings_contents_advanced_settings( $sources, $args ){
8708 $html_class_prefix = $args['html_class_prefix'];
8709 $html_name_prefix = $args['html_name_prefix'];
8710 $settings = $args['settings'];
8711 $tab_title = $args['tab_name'];
8712
8713 $rotation_degree = $settings['rotation_degree'];
8714 $reverse_categories = $settings['reverse_categories'];
8715 $slice_border_color = $settings['slice_border_color'];
8716 $slice_texts = $settings['slice_texts'];
8717 $slice_text = $settings['slice_text'];
8718 $tooltip_text_options = $settings['tooltip_text_options'];
8719 $tooltip_text = $settings['tooltip_text'];
8720 $is_stacked = $settings['is_stacked'];
8721 $focus_target_options = $settings['focus_target_options'];
8722 $focus_target = $settings['focus_target'];
8723 $multiple_data_format_options = $settings['multiple_data_format_options'];
8724 $multiple_data_format = $settings['multiple_data_format'];
8725 $opacity = $settings['opacity'];
8726 $group_width = $settings['group_width'];
8727 $group_width_format = $settings['group_width_format'];
8728 $group_width_format_options = $settings['group_width_format_options'];
8729 $line_width = $settings['line_width'];
8730 $data_grouping_limit = $settings['data_grouping_limit'];
8731 $data_grouping_label = $settings['data_grouping_label'];
8732 $data_grouping_color = $settings['data_grouping_color'];
8733 $multiple_selection = $settings['multiple_selection'];
8734 $point_shape_options = $settings['point_shape_options'];
8735 $point_shape = $settings['point_shape'];
8736 $crosshair_trigger_options = $settings['crosshair_trigger_options'];
8737 $crosshair_trigger = $settings['crosshair_trigger'];
8738 $crosshair_orientation_options = $settings['crosshair_orientation_options'];
8739 $crosshair_orientation = $settings['crosshair_orientation'];
8740 $crosshair_opacity = $settings['crosshair_opacity'];
8741 $dash_style = $settings['dash_style'];
8742 $point_size = $settings['point_size'];
8743 $donut_hole_size = $settings['donut_hole_size'];
8744 $orientation = $settings['orientation'];
8745 $fill_nulls = $settings['fill_nulls'];
8746 $allow_collapse = $settings['allow_collapse'];
8747 $org_classname = $settings['org_classname'];
8748 $org_node_background_color = $settings['org_node_background_color'];
8749 $org_node_padding = $settings['org_node_padding'];
8750 $org_node_border_radius = $settings['org_node_border_radius'];
8751 $org_node_border_width = $settings['org_node_border_width'];
8752 $org_node_border_color = $settings['org_node_border_color'];
8753 $org_node_text_color = $settings['org_node_text_color'];
8754 $org_node_text_font_size = $settings['org_node_text_font_size'];
8755 $org_node_description_font_color = $settings['org_node_description_font_color'];
8756 $org_node_description_font_size = $settings['org_node_description_font_size'];
8757 $org_selected_classname = $settings['org_selected_classname'];
8758 $org_selected_node_background_color = $settings['org_selected_node_background_color'];
8759 $org_selected_node_text_color = $settings['org_selected_node_text_color'];
8760
8761 ob_start();
8762 ?>
8763 <div class="ays-accordion-data-main-wrap">
8764 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap <?php echo esc_attr($html_class_prefix) ?>advanced-settings-data-wrap">
8765 <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">
8766 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8767 <label for="ays-chart-option-rotation-degree" class="form-label">
8768 <?php echo esc_html(__( "Degree of chart rotation", "chart-builder" )); ?>
8769 <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") ); ?>">
8770 <i class="ays_fa ays_fa_info_circle"></i>
8771 </a>
8772 </label>
8773 </div>
8774 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8775 <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) ?>">
8776 </div>
8777 </div> <!-- Rotation degree -->
8778 <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">
8779 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8780 <label for="ays-chart-option-reverse-categories">
8781 <?php echo esc_html(__( "Reverse Categories", "chart-builder" )); ?>
8782 <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") ); ?>">
8783 <i class="ays_fa ays_fa_info_circle"></i>
8784 </a>
8785 </label>
8786 </div>
8787 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8788 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
8789 <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); ?> >
8790 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
8791 </label>
8792 </div>
8793 </div> <!-- Reverse Categories -->
8794 <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">
8795 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8796 <label for="ays-chart-option-slice-border-color">
8797 <?php echo esc_html(__( "Slice Border Color", "chart-builder" )); ?>
8798 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the slice borders.","chart-builder") ); ?>">
8799 <i class="ays_fa ays_fa_info_circle"></i>
8800 </a>
8801 </label>
8802 </div>
8803 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8804 <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) ?>">
8805 </div>
8806 </div> <!-- Slice border color -->
8807 <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">
8808 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8809 <label for="ays-chart-option-slice-text">
8810 <?php echo esc_html(__( "Slice text", "chart-builder" )); ?>
8811 <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") ); ?>">
8812 <i class="ays_fa ays_fa_info_circle"></i>
8813 </a>
8814 </label>
8815 </div>
8816 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8817 <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]">
8818 <?php
8819 foreach ( $slice_texts as $option_slug => $option ):
8820 $selected = ( $slice_text == $option_slug ) ? 'selected' : '';
8821 ?>
8822 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8823 <?php
8824 endforeach;
8825 ?>
8826 </select>
8827 </div>
8828 </div> <!-- Slice text -->
8829 <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">
8830 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8831 <label for="ays-chart-option-tooltip-text">
8832 <?php echo esc_html(__( "Slice tooltip text", "chart-builder" )); ?>
8833 <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") ); ?>">
8834 <i class="ays_fa ays_fa_info_circle"></i>
8835 </a>
8836 </label>
8837 </div>
8838 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8839 <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]">
8840 <?php
8841 foreach ( $tooltip_text_options as $option_slug => $option ):
8842 $selected = ( $tooltip_text == $option_slug ) ? 'selected' : '';
8843 ?>
8844 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8845 <?php
8846 endforeach;
8847 ?>
8848 </select>
8849 </div>
8850 </div> <!-- Slice tooltip Text -->
8851 <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">
8852 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8853 <label for="ays-chart-option-data-grouping-limit" class="form-label">
8854 <?php echo esc_html(__( "Chart Data Grouping Limit", "chart-builder" )); ?>
8855 <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") ); ?>">
8856 <i class="ays_fa ays_fa_info_circle"></i>
8857 </a>
8858 </label>
8859 </div>
8860 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8861 <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">
8862 </div>
8863 </div> <!-- Data Grouping Limit -->
8864 <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">
8865 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8866 <label for="ays-chart-option-data-grouping-label" class="form-label">
8867 <?php echo esc_html(__( "Chart Data Grouping Label", "chart-builder" )); ?>
8868 <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") ); ?>">
8869 <i class="ays_fa ays_fa_info_circle"></i>
8870 </a>
8871 </label>
8872 </div>
8873 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8874 <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) ?>">
8875 </div>
8876 </div> <!-- Data Grouping Label -->
8877 <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">
8878 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8879 <label for="ays-chart-option-data-grouping-color">
8880 <?php echo esc_html(__( "Chart Data Grouping Color", "chart-builder" )); ?>
8881 <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") ); ?>">
8882 <i class="ays_fa ays_fa_info_circle"></i>
8883 </a>
8884 </label>
8885 </div>
8886 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8887 <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) ?>">
8888 </div>
8889 </div> <!-- Data Grouping Color -->
8890 <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">
8891 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8892 <label for="ays-chart-option-is-stacked">
8893 <?php echo esc_html(__( "Is stacked", "chart-builder" )); ?>
8894 <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") ); ?>">
8895 <i class="ays_fa ays_fa_info_circle"></i>
8896 </a>
8897 </label>
8898 </div>
8899 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8900 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
8901 <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); ?> >
8902 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
8903 </label>
8904 </div>
8905 </div> <!-- Is stacked -->
8906 <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">
8907 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8908 <label for="ays-chart-option-focus-target">
8909 <?php echo esc_html(__( "Focus target", "chart-builder" )); ?>
8910 <a class="ays_help" data-bs-toggle="tooltip" data-bs-html="true" title="<?php
8911 echo esc_html( sprintf(
8912 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
8913 "<p>" . __('There are two ways to focus the data table elements.', "chart-builder") . "</p><ul class='ays_tooltop_ul'><li>" .
8914 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
8915 __('%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>" .
8916 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
8917 __('%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>",
8918 '<em>', '</em>',
8919 '<em>', '</em>'
8920 ));
8921 ?>">
8922 <i class="ays_fa ays_fa_info_circle"></i>
8923 </a>
8924 </label>
8925 </div>
8926 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8927 <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]">
8928 <?php
8929 foreach ( $focus_target_options as $option_slug => $option ):
8930 $selected = ( $focus_target == $option_slug ) ? 'selected' : '';
8931 ?>
8932 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8933 <?php
8934 endforeach;
8935 ?>
8936 </select>
8937 </div>
8938 </div> <!-- Focus target -->
8939 <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">
8940 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8941 <label for="ays-chart-option-opacity" class="form-label">
8942 <?php echo esc_html(__( "Opacity", "chart-builder" )); ?>
8943 <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") ); ?>">
8944 <i class="ays_fa ays_fa_info_circle"></i>
8945 </a>
8946 </label>
8947 </div>
8948 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8949 <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">
8950 </div>
8951 </div> <!-- Data opacity -->
8952 <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">
8953 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8954 <label for="ays-chart-option-group-width">
8955 <?php echo esc_html(__( "Bar width", "chart-builder" )); ?>
8956 <a class="ays_help" data-bs-toggle="tooltip" data-bs-html="true" title="<?php
8957 echo esc_html( sprintf(
8958 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
8959 "<p>" . __('The width of the bars, specified in either of these formats:', "chart-builder") . "</p><ul class='ays_tooltop_ul'><li>" .
8960 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
8961 __('%1$sPixels:%2$s Set the width of the bars in pixels.', "chart-builder") . "</li><li>" .
8962 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
8963 __('%1$sPercentage:%2$s Set the width of the bars in percentage.', "chart-builder") . "</li></ul>",
8964 '<em>', '</em>',
8965 '<em>', '</em>'
8966 ));
8967 ?>">
8968 <i class="ays_fa ays_fa_info_circle"></i>
8969 </a>
8970 </label>
8971 </div>
8972 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
8973 <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) ?>">
8974 <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]">
8975 <?php
8976 foreach ( $group_width_format_options as $option_slug => $option ):
8977 $selected = ( $group_width_format == $option_slug ) ? 'selected' : '';
8978 ?>
8979 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
8980 <?php
8981 endforeach;
8982 ?>
8983 </select>
8984 </div>
8985 </div> <!-- Bars width -->
8986 <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">
8987 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
8988 <label for="ays-chart-option-line-width" class="form-label">
8989 <?php echo esc_html(__( "Line width", "chart-builder" )); ?>
8990 <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") ); ?>">
8991 <i class="ays_fa ays_fa_info_circle"></i>
8992 </a>
8993 </label>
8994 </div>
8995 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
8996 <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) ?>">
8997 </div>
8998 </div> <!-- Line width -->
8999 <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">
9000 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9001 <label for="ays-chart-option-multiple-selection">
9002 <?php echo esc_html(__( "Multiple data selection", "chart-builder" )); ?>
9003 <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") ); ?>">
9004 <i class="ays_fa ays_fa_info_circle"></i>
9005 </a>
9006 </label>
9007 </div>
9008 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9009 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
9010 <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); ?> >
9011 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
9012 </label>
9013 </div>
9014 </div> <!-- Multiple data selection -->
9015 <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">
9016 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9017 <label for="ays-chart-option-multiple-data-format">
9018 <?php echo esc_html(__( "Multiple data format", "chart-builder" )); ?>
9019 <a class="ays_help" data-bs-toggle="tooltip" data-bs-html="true" title="<?php
9020 echo esc_html( sprintf(
9021 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
9022 "<p>" . __('How multiple data selections are rolled up into tooltips:', "chart-builder") . "</p><ul class='ays_tooltop_ul'><li>" .
9023 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
9024 __('%1$sCategory:%2$s Group selected data by row titles.', "chart-builder") . "</li><li>" .
9025 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
9026 __('%1$sSeries:%2$s Group selected data by column titles.', "chart-builder") . "</li><li>" .
9027 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
9028 __('%1$sAuto:%2$s Group selected data by row titles, if they have the same titles or by column titles', "chart-builder") . "</li><li>" .
9029 /* translators: %1$s: Opening <em> tag, %2$s: Closing <em> tag */
9030 __('%1$sNone:%2$s Show only one tooltip per selection.', "chart-builder") . "</li></ul>",
9031 '<em>', '</em>',
9032 '<em>', '</em>',
9033 '<em>', '</em>',
9034 '<em>', '</em>'
9035 ));
9036 ?>">
9037 <i class="ays_fa ays_fa_info_circle"></i>
9038 </a>
9039 </label>
9040 </div>
9041 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
9042 <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]">
9043 <?php
9044 foreach ( $multiple_data_format_options as $option_slug => $option ):
9045 $selected = ( $multiple_data_format == $option_slug ) ? 'selected' : '';
9046 ?>
9047 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
9048 <?php
9049 endforeach;
9050 ?>
9051 </select>
9052 </div>
9053 </div> <!-- Multiple data format -->
9054 <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">
9055 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9056 <label for="ays-chart-option-point-shape">
9057 <?php echo esc_html(__( "Point shape", "chart-builder" )); ?>
9058 <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") ); ?>">
9059 <i class="ays_fa ays_fa_info_circle"></i>
9060 </a>
9061 </label>
9062 </div>
9063 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
9064 <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]">
9065 <?php
9066 foreach ( $point_shape_options as $option_slug => $option ):
9067 $selected = ( $point_shape == $option_slug ) ? 'selected' : '';
9068 ?>
9069 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
9070 <?php
9071 endforeach;
9072 ?>
9073 </select>
9074 </div>
9075 </div> <!-- Point shape -->
9076 <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">
9077 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9078 <label for="ays-chart-option-point-size" class="form-label">
9079 <?php echo esc_html(__( "Point size", "chart-builder" )); ?>
9080 <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") ); ?>">
9081 <i class="ays_fa ays_fa_info_circle"></i>
9082 </a>
9083 </label>
9084 </div>
9085 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9086 <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) ?>">
9087 </div>
9088 </div> <!-- Point size -->
9089 <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">
9090 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9091 <label for="ays-chart-option-orientation">
9092 <?php echo esc_html(__( "Rotate Vertical", "chart-builder" )); ?>
9093 <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") ); ?>">
9094 <i class="ays_fa ays_fa_info_circle"></i>
9095 </a>
9096 </label>
9097 </div>
9098 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9099 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
9100 <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); ?> >
9101 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
9102 </label>
9103 </div>
9104 </div> <!-- Orientation -->
9105 <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">
9106 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9107 <label for="ays-chart-option-fill-nulls">
9108 <?php echo esc_html(__( "Autofill nulls", "chart-builder" )); ?>
9109 <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") ); ?>">
9110 <i class="ays_fa ays_fa_info_circle"></i>
9111 </a>
9112 </label>
9113 </div>
9114 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9115 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
9116 <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); ?> >
9117 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
9118 </label>
9119 </div>
9120 </div> <!-- Autofill nulls -->
9121 <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">
9122 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9123 <label for="ays-chart-option-crosshair-trigger">
9124 <?php echo esc_html(__( "Crosshair trigger", "chart-builder" )); ?>
9125 <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") ); ?>">
9126 <i class="ays_fa ays_fa_info_circle"></i>
9127 </a>
9128 </label>
9129 </div>
9130 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
9131 <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]">
9132 <?php
9133 foreach ( $crosshair_trigger_options as $option_slug => $option ):
9134 $selected = ( $crosshair_trigger == $option_slug ) ? 'selected' : '';
9135 ?>
9136 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
9137 <?php
9138 endforeach;
9139 ?>
9140 </select>
9141 </div>
9142 </div> <!-- Crosshair trigger -->
9143 <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">
9144 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9145 <label for="ays-chart-option-crosshair-orientation">
9146 <?php echo esc_html(__( "Crosshair orientation", "chart-builder" )); ?>
9147 <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") ); ?>">
9148 <i class="ays_fa ays_fa_info_circle"></i>
9149 </a>
9150 </label>
9151 </div>
9152 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
9153 <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]">
9154 <?php
9155 foreach ( $crosshair_orientation_options as $option_slug => $option ):
9156 $selected = ( $crosshair_orientation == $option_slug ) ? 'selected' : '';
9157 ?>
9158 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
9159 <?php
9160 endforeach;
9161 ?>
9162 </select>
9163 </div>
9164 </div> <!-- Crosshair orientation -->
9165 <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">
9166 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9167 <label for="ays-chart-option-crosshair-opacity" class="form-label">
9168 <?php echo esc_html(__( "Crosshair opacity", "chart-builder" )); ?>
9169 <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") ); ?>">
9170 <i class="ays_fa ays_fa_info_circle"></i>
9171 </a>
9172 </label>
9173 </div>
9174 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9175 <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">
9176 </div>
9177 </div> <!-- Crosshair opacity -->
9178 <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">
9179 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9180 <label for="ays-chart-option-dash-style" class="form-label">
9181 <?php echo esc_html(__( "Dash Pattern", "chart-builder" )); ?>
9182 <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") ); ?>">
9183 <i class="ays_fa ays_fa_info_circle"></i>
9184 </a>
9185 </label>
9186 </div>
9187 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9188 <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) ?>">
9189 </div>
9190 </div> <!-- Line dash pattern -->
9191 <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">
9192 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9193 <label for="ays-chart-option-donut-hole-size">
9194 <?php echo esc_html(__( "Hole size", 'chart-builder' )); ?>
9195 </label>
9196 </div>
9197 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right <?php echo esc_attr($html_class_prefix) ?>option-input">
9198 <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) ?>">
9199 </div>
9200 </div> <!-- Donut hole size -->
9201 <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">
9202 <div class="ays-pro-features-v2-small-buttons-box-middle ays-pro-features-v2-big-buttons-box">
9203 <div class="ays-pro-features-v2-video-button"></div>
9204 <a href="https://ays-pro.com/wordpress/chart-builder" target="_blank" class="ays-pro-features-v2-upgrade-button">
9205 <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>
9206 <div class="ays-pro-features-v2-upgrade-text">
9207 <?php echo esc_html(__("Upgrade" , "chart-builder")); ?>
9208 </div>
9209 </a>
9210 </div>
9211 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix )?>option-title">
9212 <label for="ays-chart-option-curve-type">
9213 <?php echo esc_html(__( "Line curve type", "chart-builder" )); ?>
9214 </label>
9215 </div>
9216 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
9217 <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]">
9218 <option><?php echo esc_html(__( "Straight", "chart-builder" )); ?></option>
9219 </select>
9220 </div>
9221 </div> <!-- Line curve type -->
9222 <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">
9223 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9224 <label for="ays-chart-option-allow-collapse">
9225 <?php echo esc_html(__( "Allow collapse", "chart-builder" )); ?>
9226 <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") ); ?>">
9227 <i class="ays_fa ays_fa_info_circle"></i>
9228 </a>
9229 </label>
9230 </div>
9231 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9232 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
9233 <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); ?> >
9234 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
9235 </label>
9236 </div>
9237 </div> <!-- Allow collapse -->
9238 <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">
9239 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9240 <label for="ays-chart-option-org-node-description-font-color">
9241 <?php echo esc_html(__( "Description color", "chart-builder" )); ?>
9242 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Description text color of the node.","chart-builder") ); ?>">
9243 <i class="ays_fa ays_fa_info_circle"></i>
9244 </a>
9245 </label>
9246 </div>
9247 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9248 <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) ?>">
9249 </div>
9250 </div> <!-- Org Node Description color -->
9251 <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">
9252 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9253 <label for="ays-chart-option-org-node-description-font-size" class="form-label">
9254 <?php echo esc_html(__( "Description font size", "chart-builder" )); ?>
9255 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Description font size of the node.","chart-builder") ); ?>">
9256 <i class="ays_fa ays_fa_info_circle"></i>
9257 </a>
9258 </label>
9259 </div>
9260 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9261 <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) ?>">
9262 </div>
9263 </div> <!-- Org Node Description font size -->
9264 <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">
9265 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9266 <label for="ays-chart-option-org-classname" class="form-label">
9267 <?php echo esc_html(__( "Custom CSS class", "chart-builder" )); ?>
9268 <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") ); ?>">
9269 <i class="ays_fa ays_fa_info_circle"></i>
9270 </a>
9271 </label>
9272 </div>
9273 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
9274 <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) ?>">
9275 </div>
9276 </div> <!-- Org custom class -->
9277 <div class="form-group mb-2 cb-changable-opt cb-org_chart-opt display_none">
9278 <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">
9279 <br>
9280 <blockquote>
9281 <?php echo sprintf(
9282 /* translators: %1$s: Opening <strong> tag, %2$s: Closing </strong> tag */
9283 esc_html(__( '%1$sNote:%2$s Custom CSS class must be set for the options below to take effect.', 'chart-builder' )), '<strong>', '</strong>'); ?>
9284 </blockquote>
9285 <br>
9286 </div>
9287 <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">
9288 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9289 <label for="ays-chart-option-org-node-background-color">
9290 <?php echo esc_html(__( "Background color", "chart-builder" )); ?>
9291 <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") ); ?>">
9292 <i class="ays_fa ays_fa_info_circle"></i>
9293 </a>
9294 </label>
9295 </div>
9296 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9297 <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) ?>">
9298 </div>
9299 </div> <!-- Org Node Background color -->
9300 <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">
9301 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9302 <label for="ays-chart-option-org-node-padding" class="form-label">
9303 <?php echo esc_html(__( "Padding", "chart-builder" )); ?>
9304 <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") ); ?>">
9305 <i class="ays_fa ays_fa_info_circle"></i>
9306 </a>
9307 </label>
9308 </div>
9309 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9310 <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) ?>">
9311 </div>
9312 </div> <!-- Org Node Padding -->
9313 <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">
9314 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9315 <label for="ays-chart-option-org-node-border-radius" class="form-label">
9316 <?php echo esc_html(__( "Border radius", "chart-builder" )); ?>
9317 <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") ); ?>">
9318 <i class="ays_fa ays_fa_info_circle"></i>
9319 </a>
9320 </label>
9321 </div>
9322 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9323 <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) ?>">
9324 </div>
9325 </div> <!-- Org Node Border radius -->
9326 <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">
9327 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9328 <label for="ays-chart-option-org-node-border-width" class="form-label">
9329 <?php echo esc_html(__( "Border width", "chart-builder" )); ?>
9330 <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") ); ?>">
9331 <i class="ays_fa ays_fa_info_circle"></i>
9332 </a>
9333 </label>
9334 </div>
9335 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9336 <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) ?>">
9337 </div>
9338 </div> <!-- Org Node Border width -->
9339 <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">
9340 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9341 <label for="ays-chart-option-org-node-border-color">
9342 <?php echo esc_html(__( "Border color", "chart-builder" )); ?>
9343 <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") ); ?>">
9344 <i class="ays_fa ays_fa_info_circle"></i>
9345 </a>
9346 </label>
9347 </div>
9348 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9349 <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) ?>">
9350 </div>
9351 </div> <!-- Org Node Background color -->
9352 <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">
9353 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9354 <label for="ays-chart-option-org-node-text-color">
9355 <?php echo esc_html(__( "Text color", "chart-builder" )); ?>
9356 <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") ); ?>">
9357 <i class="ays_fa ays_fa_info_circle"></i>
9358 </a>
9359 </label>
9360 </div>
9361 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9362 <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) ?>">
9363 </div>
9364 </div> <!-- Org Node Text color -->
9365 <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">
9366 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9367 <label for="ays-chart-option-org-node-text-font-size" class="form-label">
9368 <?php echo esc_html(__( "Text font size", "chart-builder" )); ?>
9369 <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") ); ?>">
9370 <i class="ays_fa ays_fa_info_circle"></i>
9371 </a>
9372 </label>
9373 </div>
9374 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9375 <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) ?>">
9376 </div>
9377 </div> <!-- Org Node Text font size -->
9378 </div> <!-- Org custom class options -->
9379 <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">
9380 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9381 <label for="ays-chart-option-org-selected-classname" class="form-label">
9382 <?php echo esc_html(__( "Selected node custom CSS class", "chart-builder" )); ?>
9383 <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") ); ?>">
9384 <i class="ays_fa ays_fa_info_circle"></i>
9385 </a>
9386 </label>
9387 </div>
9388 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
9389 <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) ?>">
9390 </div>
9391 </div> <!-- Org custom selected class -->
9392 <div class="form-group mb-2 cb-changable-opt cb-org_chart-opt display_none">
9393 <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">
9394 <br>
9395 <blockquote>
9396 <?php echo sprintf(
9397 /* translators: %1$s: Opening <strong> tag, %2$s: Closing </strong> tag */
9398 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' )),
9399 '<strong>',
9400 '</strong>'
9401 ); ?>
9402 </blockquote>
9403 <br>
9404 </div>
9405 <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">
9406 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9407 <label for="ays-chart-option-org-selected-node-background-color">
9408 <?php echo esc_html(__( "Background color", "chart-builder" )); ?>
9409 <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") ); ?>">
9410 <i class="ays_fa ays_fa_info_circle"></i>
9411 </a>
9412 </label>
9413 </div>
9414 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9415 <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) ?>">
9416 </div>
9417 </div> <!-- Org selected Node Background color -->
9418 <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">
9419 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9420 <label for="ays-chart-option-org-selected-node-text-color">
9421 <?php echo esc_html(__( "Text color", "chart-builder" )); ?>
9422 <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") ); ?>">
9423 <i class="ays_fa ays_fa_info_circle"></i>
9424 </a>
9425 </label>
9426 </div>
9427 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9428 <input 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) ?>">
9429 </div>
9430 </div> <!-- Org selected Node text color -->
9431 </div> <!-- Org custom selected class options -->
9432 </div>
9433 </div>
9434 <?php
9435 $content = ob_get_clean();
9436
9437 $sources['advanced_settings'] = array(
9438 'content' => $content,
9439 'title' => $tab_title
9440 );
9441
9442 return $sources;
9443 }
9444
9445 public function settings_contents_advanced_settings_chartjs( $sources, $args ){
9446 $html_class_prefix = $args['html_class_prefix'];
9447 $html_name_prefix = $args['html_name_prefix'];
9448 $settings = $args['settings'];
9449 $tab_title = $args['tab_name'];
9450
9451 $outer_radius = $settings['outer_radius'];
9452 $slice_spacing = $settings['slice_spacing'];
9453 $circumference = $settings['circumference'];
9454 $start_angle = $settings['start_angle'];
9455 $slice_border_color = $settings['slice_border_color'];
9456 $slice_border_width = $settings['slice_border_width'];
9457 // $index_axis = $settings['index_axis'];
9458
9459 ob_start();
9460 ?>
9461 <div class="ays-accordion-data-main-wrap">
9462 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap <?php echo esc_attr($html_class_prefix) ?>advanced-settings-data-wrap">
9463 <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">
9464 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9465 <label for="ays-chart-option-outer-radius" class="form-label">
9466 <?php echo esc_html(__( "Outer Radius", "chart-builder" )); ?>
9467 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The outer radius of the chart.","chart-builder") ); ?>">
9468 <i class="ays_fa ays_fa_info_circle"></i>
9469 </a>
9470 </label>
9471 </div>
9472 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
9473 <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) ?>">
9474 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
9475 </div>
9476 </div> <!-- Outer Radius -->
9477 <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">
9478 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9479 <label for="ays-chart-option-slice-spacing" class="form-label">
9480 <?php echo esc_html(__( "Slices Spacing", "chart-builder" )); ?>
9481 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Fixed arc offset (in pixels).","chart-builder") ); ?>">
9482 <i class="ays_fa ays_fa_info_circle"></i>
9483 </a>
9484 </label>
9485 </div>
9486 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
9487 <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) ?>">
9488 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">px</div>
9489 </div>
9490 </div> <!-- Slice Spacing -->
9491 <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">
9492 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9493 <label for="ays-chart-option-circumference" class="form-label">
9494 <?php echo esc_html(__( "Arc Coverage", "chart-builder" )); ?>
9495 <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") ); ?>">
9496 <i class="ays_fa ays_fa_info_circle"></i>
9497 </a>
9498 </label>
9499 </div>
9500 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
9501 <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) ?>">
9502 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">°</div>
9503 </div>
9504 </div> <!-- Arc Coverage -->
9505 <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">
9506 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9507 <label for="ays-chart-option-start-angle" class="form-label">
9508 <?php echo esc_html(__( "Start Angle", "chart-builder" )); ?>
9509 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("Starting angle to draw arcs from.","chart-builder") ); ?>">
9510 <i class="ays_fa ays_fa_info_circle"></i>
9511 </a>
9512 </label>
9513 </div>
9514 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
9515 <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) ?>">
9516 <div class="<?php echo esc_attr($html_class_prefix) ?>option-desc-box">°</div>
9517 </div>
9518 </div> <!-- Start Angle -->
9519 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt ">
9520 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9521 <label for="ays-chart-option-slice-border-width">
9522 <?php echo esc_html(__( "Border Width", "chart-builder" )); ?>
9523 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The width of the slice borders.","chart-builder") ); ?>">
9524 <i class="ays_fa ays_fa_info_circle"></i>
9525 </a>
9526 </label>
9527 </div>
9528 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input">
9529 <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) ?>">
9530 </div>
9531 </div> <!-- Border Width -->
9532 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section cb-changable-opt cb-pie_chart-opt ">
9533 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9534 <label for="ays-chart-option-slice-border-color">
9535 <?php echo esc_html(__( "Border Color", "chart-builder" )); ?>
9536 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color of the slice borders.","chart-builder") ); ?>">
9537 <i class="ays_fa ays_fa_info_circle"></i>
9538 </a>
9539 </label>
9540 </div>
9541 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9542 <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) ?>">
9543 </div>
9544 </div> <!-- Slice border color -->
9545 <!-- <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">
9546 <div class="col-sm-5 d-flex align-items-center <?php // echo esc_attr($html_class_prefix) ?>option-title">
9547 <label for="ays-chart-option-index-axis">
9548 <?php // echo esc_html(__( "Horizontal ", "chart-builder" )); ?>
9549 <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") ); ?>">
9550 <i class="ays_fa ays_fa_info_circle"></i>
9551 </a>
9552 </label>
9553 </div>
9554 <div class="col-sm-7 py-1 <?php // echo esc_attr($html_class_prefix) ?>input-align-right">
9555 <label class="<?php // echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
9556 <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); ?> >
9557 <span class="<?php // echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php // echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
9558 </label>
9559 </div>
9560 </div> Reverse Categories -->
9561 </div>
9562 </div>
9563 <?php
9564 $content = ob_get_clean();
9565
9566 $sources['advanced_settings'] = array(
9567 'content' => $content,
9568 'title' => $tab_title
9569 );
9570
9571 return $sources;
9572 }
9573
9574 public function settings_contents_slices_settings( $sources, $args ){
9575 $html_class_prefix = $args['html_class_prefix'];
9576 $html_name_prefix = $args['html_name_prefix'];
9577 $settings = $args['settings'];
9578 $source = $args['source'];
9579 $source = isset($source["commonTypeCharts"]) ? $source["commonTypeCharts"] : $source;
9580 $source_chart_type = $args['source_chart_type'];
9581 $settings = $args['settings'];
9582 $title_row = array_shift($source);
9583
9584 if (isset($source) && !empty($source)) {
9585 if ( !isset( $source[0] ) ) {
9586 if (count($source[1]) > 2) {
9587 $titles = array();
9588 for ($i = 0; $i < count($source[1]); $i++) {
9589 array_push($titles, __("Title", 'chart-builder').$i);
9590 }
9591 $source[0] = $titles;
9592 } else {
9593 $source[0] = array(
9594 __("Country", 'chart-builder'),
9595 __("Population", 'chart-builder'),
9596 );
9597 }
9598
9599 ksort($source);
9600 }
9601 }
9602
9603 if ($source_chart_type == 'pie_chart' || $source_chart_type == 'donut_chart') {
9604 foreach ($source as $key => $row) {
9605 $source[$key] = array_slice($row, 0, 2);
9606 }
9607 }
9608
9609 ob_start();
9610 if ($source_chart_type == 'pie_chart' || $source_chart_type == 'donut_chart') {
9611 $slice_color = $settings['slice_color'];
9612 $slice_colors_default = $settings['slice_colors_default'];
9613 $slice_offset = $settings['slice_offset'];
9614 $slice_text_color = $settings['slice_text_color'];
9615
9616 ?>
9617 <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">
9618 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
9619 <div class="<?php echo esc_attr($html_class_prefix) ?>slices-settings">
9620 <?php
9621 foreach ( $source as $key => $val ):
9622 ?>
9623 <fieldset class="ays-slices-accordion-options-container <?php echo esc_attr($html_class_prefix) ?>options-slices-<?php echo esc_attr($key); ?>" data-collapsed="true">
9624 <legend class="ays-slices-accordion-options-header">
9625 <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">
9626 <g>
9627 <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" />
9628 </g>
9629 </svg>
9630 <span><?php echo esc_html($val[0]); ?></span>
9631 </legend>
9632 <div class="ays-slices-accordion-options-content ays-slices-accordion-options-content">
9633 <div class="ays-slices-accordion-data-main-wrap">
9634 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
9635 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
9636 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9637 <label for="ays-chart-option-slice-color">
9638 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
9639 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color to use for this slice.","chart-builder") ); ?>">
9640 <i class="ays_fa ays_fa_info_circle"></i>
9641 </a>
9642 </label>
9643 </div>
9644 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9645 <input type="color"
9646 id="ays-chart-option-slice-color-<?php echo esc_attr($key); ?>"
9647 class="ays-chart-option-slice-color form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker"
9648 name="<?php echo esc_attr($html_name_prefix); ?>settings[slice_color][<?php echo esc_attr($key); ?>]"
9649 value="<?php echo isset($slice_color[$key]) ? esc_attr($slice_color[$key]) : esc_attr($slice_colors_default[$key]); ?>"
9650 data-slice-id="<?php echo esc_attr($key); ?>">
9651 </div>
9652 </div> <!-- Slice color -->
9653 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
9654 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9655 <label for="ays-chart-option-slice-offset" class="form-label">
9656 <?php echo esc_html(__( "Offset", "chart-builder" )); ?>
9657 <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") ); ?>">
9658 <i class="ays_fa ays_fa_info_circle"></i>
9659 </a>
9660 </label>
9661 </div>
9662 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>option-input <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9663 <input type="number"
9664 id="ays-chart-option-slice-offset-<?php echo esc_attr($key); ?>"
9665 class="ays-chart-option-slice-offset ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input"
9666 name="<?php echo esc_attr($html_name_prefix); ?>settings[slice_offset][<?php echo esc_attr($key); ?>]"
9667 value="<?php echo isset($slice_offset[$key]) ? esc_attr($slice_offset[$key]) : 0 ; ?>"
9668 data-slice-id="<?php echo esc_attr($key); ?>"
9669 step=".01" min="0.0" max="1.0">
9670 </div>
9671 </div> <!-- Slice offset -->
9672 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
9673 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9674 <label for="ays-chart-option-slice-text-color">
9675 <?php echo esc_html(__( "Text color", "chart-builder" )); ?>
9676 <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") ); ?>">
9677 <i class="ays_fa ays_fa_info_circle"></i>
9678 </a>
9679 </label>
9680 </div>
9681 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9682 <input type="color"
9683 id="ays-chart-option-slice-text-color-<?php echo esc_attr($key); ?>"
9684 class="ays-chart-option-slice-text-color form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker"
9685 name="<?php echo esc_attr($html_name_prefix); ?>settings[slice_text_color][<?php echo esc_attr($key); ?>]"
9686 value="<?php echo isset($slice_text_color[$key]) ? esc_attr($slice_text_color[$key]) : '#ffffff'; ?>"
9687 data-slice-id="<?php echo esc_attr($key); ?>">
9688 </div>
9689 </div> <!-- Slice color -->
9690 </div>
9691 </div>
9692 </div>
9693 </fieldset>
9694 <?php
9695 endforeach;
9696 ?>
9697 </div>
9698 </div>
9699 <br>
9700 <blockquote>
9701 <?php echo esc_html(__( "Save the chart to update the data.", "chart-builder" )); ?>
9702 </blockquote>
9703 </div>
9704 <?php
9705
9706 } else {
9707 ?>
9708 <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>
9709 <?php
9710 }
9711
9712 $content = ob_get_clean();
9713
9714 $title = esc_html(__( 'Slices settings', 'chart-builder' ));
9715
9716 $sources['slices_settings'] = array(
9717 'content' => $content,
9718 'title' => $title
9719 );
9720
9721 return $sources;
9722 }
9723
9724 public function settings_contents_slices_settings_chartjs( $sources, $args ){
9725 $html_class_prefix = $args['html_class_prefix'];
9726 $html_name_prefix = $args['html_name_prefix'];
9727 $settings = $args['settings'];
9728 $source = $args['source'];
9729 $source = isset($source["commonTypeCharts"]) ? $source["commonTypeCharts"] : $source;
9730 $source_chart_type = $args['source_chart_type'];
9731 $settings = $args['settings'];
9732 $title_row = array_shift($source);
9733
9734 if (isset($source) && !empty($source)) {
9735 if ( !isset( $source[0] ) ) {
9736 if (count($source[1]) > 2) {
9737 $titles = array();
9738 for ($i = 0; $i < count($source[1]); $i++) {
9739 array_push($titles, __("Title", 'chart-builder').$i);
9740 }
9741 $source[0] = $titles;
9742 } else {
9743 $source[0] = array(
9744 __("Country", 'chart-builder'),
9745 __("Population", 'chart-builder'),
9746 );
9747 }
9748
9749 ksort($source);
9750 }
9751 }
9752
9753 if ($source_chart_type == 'pie_chart') {
9754 foreach ($source as $key => $row) {
9755 $source[$key] = array_slice($row, 0, 2);
9756 }
9757 }
9758
9759 ob_start();
9760 if ($source_chart_type == 'pie_chart') {
9761 $slice_color = $settings['slice_color'];
9762 $slices_border_color = $settings['slices_border_color'];
9763 $slice_colors_default = $settings['slice_colors_default'];
9764
9765 ?>
9766 <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">
9767 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
9768 <div class="<?php echo esc_attr($html_class_prefix) ?>slices-settings">
9769 <?php
9770 foreach ( $source as $key => $val ):
9771 ?>
9772 <fieldset class="ays-slices-accordion-options-container <?php echo esc_attr($html_class_prefix) ?>options-slices-<?php echo esc_attr($key); ?>" data-collapsed="true">
9773 <legend class="ays-slices-accordion-options-header">
9774 <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">
9775 <g>
9776 <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" />
9777 </g>
9778 </svg>
9779 <span><?php echo esc_html($val[0]); ?></span>
9780 </legend>
9781 <div class="ays-slices-accordion-options-content ays-slices-accordion-options-content">
9782 <div class="ays-slices-accordion-data-main-wrap">
9783 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
9784 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
9785 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9786 <label for="ays-chart-option-slice-color">
9787 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
9788 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color to use for this slice.","chart-builder") ); ?>">
9789 <i class="ays_fa ays_fa_info_circle"></i>
9790 </a>
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-slice-color-<?php echo esc_attr($key); ?>"
9796 class="ays-chart-option-slice-color form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker"
9797 name="<?php echo esc_attr($html_name_prefix); ?>settings[slice_color][<?php echo esc_attr($key); ?>]"
9798 value="<?php echo isset($slice_color[$key]) ? esc_attr($slice_color[$key]) : esc_attr($slice_colors_default[$key]); ?>"
9799 data-slice-id="<?php echo esc_attr($key); ?>">
9800 </div>
9801 </div> <!-- Slice 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-slice-border-color">
9805 <?php echo esc_html(__( "Border Color", "chart-builder" )); ?>
9806 <a class="ays_help" data-bs-toggle="tooltip" title="<?php echo esc_attr( __("The color to use for this slice border.","chart-builder") ); ?>">
9807 <i class="ays_fa ays_fa_info_circle"></i>
9808 </a>
9809 </label>
9810 </div>
9811 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9812 <input type="color"
9813 id="ays-chart-option-slice-border-color-<?php echo esc_attr($key); ?>"
9814 class="ays-chart-option-slice-border-color form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker"
9815 name="<?php echo esc_attr($html_name_prefix); ?>settings[slices_border_color][<?php echo esc_attr($key); ?>]"
9816 value="<?php echo isset($slices_border_color[$key]) ? esc_attr($slices_border_color[$key]) : esc_attr($settings['slice_border_color']); ?>"
9817 data-slice-id="<?php echo esc_attr($key); ?>">
9818 </div>
9819 </div> <!-- Slice border color -->
9820 </div>
9821 </div>
9822 </div>
9823 </fieldset>
9824 <?php
9825 endforeach;
9826 ?>
9827 </div>
9828 </div>
9829 <br>
9830 <blockquote>
9831 <?php echo esc_html(__( "Save the chart to update the data.", "chart-builder" )); ?>
9832 </blockquote>
9833 </div>
9834 <?php
9835
9836 } else {
9837 ?>
9838 <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>
9839 <?php
9840 }
9841
9842 $content = ob_get_clean();
9843
9844 $title = esc_html(__( 'Slices settings', 'chart-builder' ));
9845
9846 $sources['slices_settings'] = array(
9847 'content' => $content,
9848 'title' => $title
9849 );
9850
9851 return $sources;
9852 }
9853
9854 public function settings_contents_series_settings( $sources, $args ){
9855 $html_class_prefix = $args['html_class_prefix'];
9856 $html_name_prefix = $args['html_name_prefix'];
9857 $settings = $args['settings'];
9858 $source = $args['source'];
9859 $source = isset($source["commonTypeCharts"]) ? $source["commonTypeCharts"] : $source;
9860 $source_chart_type = $args['source_chart_type'];
9861
9862 $line_width = $settings['line_width'];
9863 $point_size = $settings['point_size'];
9864 $point_shape_options = $settings['point_shape_options'];
9865 $point_shape = $settings['point_shape'];
9866
9867 if (isset($source) && !empty($source)) {
9868 if ( !isset( $source[0] ) ) {
9869 if (count($source[1]) > 2) {
9870 $titles = array();
9871 for ($i = 0; $i < count($source[1]); $i++) {
9872 array_push($titles, __("Title", "chart-builder").$i);
9873 }
9874 $source[0] = $titles;
9875 } else {
9876 $source[0] = array(
9877 __("Country", "chart-builder"),
9878 __("Population", "chart-builder"),
9879 );
9880 }
9881
9882 ksort($source);
9883 }
9884 }
9885
9886 if ($source_chart_type == 'pie_chart' || $source_chart_type == 'donut_chart') {
9887 foreach ($source as $key => $row) {
9888 $source[$key] = array_slice($row, 0, 2);
9889 }
9890 }
9891
9892 ob_start();
9893 if ($source_chart_type == 'pie_chart' || $source_chart_type == 'line_chart' || $source_chart_type == 'bar_chart' || $source_chart_type == 'column_chart') {
9894 $series_row = array_shift($source);
9895 $title = array_shift($series_row);
9896 $series_color = $settings['series_color'];
9897 $series_colors_default = $settings['series_colors_default'];
9898 $series_format = $settings['series_format'];
9899 $series_visible_in_legend = $settings['series_visible_in_legend'];
9900 $series_line_width = $settings['series_line_width'];
9901 $series_point_size = $settings['series_point_size'];
9902 $series_point_shape = $settings['series_point_shape'];
9903
9904 ?>
9905 <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">
9906 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
9907 <div class="<?php echo esc_attr($html_class_prefix) ?>series-settings">
9908 <?php
9909 foreach ( $series_row as $key => $val ):
9910 ?>
9911 <fieldset class="ays-series-accordion-options-container <?php echo esc_attr($html_class_prefix) ?>options-series-<?php echo esc_attr($key); ?>" data-collapsed="true">
9912 <legend class="ays-series-accordion-options-header">
9913 <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">
9914 <g>
9915 <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" />
9916 </g>
9917 </svg>
9918 <span><?php echo esc_attr($val); ?></span>
9919 </legend>
9920 <div class="ays-series-accordion-options-content ays-series-accordion-options-content">
9921 <div class="ays-series-accordion-data-main-wrap">
9922 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
9923 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
9924 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9925 <label for="ays-chart-option-series-color">
9926 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
9927 </label>
9928 </div>
9929 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9930 <input type="color"
9931 id="ays-chart-option-series-color-<?php echo esc_attr($key); ?>"
9932 class="ays-chart-option-series-color form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker"
9933 name="<?php echo esc_attr($html_name_prefix); ?>settings[series_color][<?php echo esc_attr($key); ?>]"
9934 value="<?php echo isset($series_color[$key]) ? esc_attr($series_color[$key]) : esc_attr($series_colors_default[$key]); ?>"
9935 data-series-id="<?php echo esc_attr($key); ?>">
9936 </div>
9937 </div> <!-- series color -->
9938 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
9939 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9940 <label for="ays-chart-option-series-visible-in-legend">
9941 <?php echo esc_html(__( "Visible in legend", "chart-builder" )); ?>
9942 <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") ); ?>">
9943 <i class="ays_fa ays_fa_info_circle"></i>
9944 </a>
9945 </label>
9946 </div>
9947 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9948 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
9949 <input type="checkbox"
9950 id="ays-chart-option-series-visible-in-legend-<?php echo esc_attr($key); ?>"
9951 class="ays-chart-option-series-visible-in-legend <?php echo esc_attr($html_class_prefix) ?>toggle-switch"
9952 name="<?php echo esc_attr($html_name_prefix); ?>settings[series_visible_in_legend][<?php echo esc_attr($key); ?>]"
9953 value="on"
9954 data-series-id="<?php echo esc_attr($key); ?>"
9955 <?php echo isset($series_visible_in_legend[$key]) && $series_visible_in_legend[$key] == 'on' ? 'checked' : (!isset($series_color[$key]) ? 'checked' : ''); ?> >
9956 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
9957 </label>
9958 </div>
9959 </div> <!-- Series visible in legend -->
9960 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
9961 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9962 <label for="ays-chart-option-series-color">
9963 <?php echo esc_html(__( "Format", "chart-builder" )); ?>
9964 <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") ); ?>">
9965 <i class="ays_fa ays_fa_info_circle"></i>
9966 </a>
9967 </label>
9968 </div>
9969 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9970 <input type="text"
9971 id="ays-chart-option-series-format-<?php echo $key; ?>"
9972 class="ays-chart-option-series-format ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input"
9973 name="<?php echo esc_attr($html_name_prefix); ?>settings[series_format][<?php echo $key; ?>]"
9974 value="<?php echo isset($series_format[$key]) && '' !== $series_format[$key] ? esc_attr($series_format[$key]) : ''; ?>"
9975 data-series-id="<?php echo $key; ?>">
9976 </div>
9977 </div> <!-- Format -->
9978 <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">
9979 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9980 <label for="ays-chart-option-series-line-width">
9981 <?php echo esc_html(__( "Line width", "chart-builder" )); ?>
9982 <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") ); ?>">
9983 <i class="ays_fa ays_fa_info_circle"></i>
9984 </a>
9985 </label>
9986 </div>
9987 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
9988 <input type="number"
9989 id="ays-chart-option-series-line-width-<?php echo esc_attr($key); ?>"
9990 class="ays-chart-option-series-line-width ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input"
9991 name="<?php echo esc_attr($html_name_prefix); ?>settings[series_line_width][<?php echo esc_attr($key); ?>]"
9992 value="<?php echo isset($series_line_width[$key]) ? esc_attr($series_line_width[$key]) : esc_attr($line_width); ?>"
9993 data-series-id="<?php echo esc_attr($key); ?>">
9994 </div>
9995 </div> <!-- Line width -->
9996 <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">
9997 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
9998 <label for="ays-chart-option-series-point-size">
9999 <?php echo esc_html(__( "Point size", "chart-builder" )); ?>
10000 <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") ); ?>">
10001 <i class="ays_fa ays_fa_info_circle"></i>
10002 </a>
10003 </label>
10004 </div>
10005 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
10006 <input type="number"
10007 id="ays-chart-option-series-point-size-<?php echo esc_attr($key); ?>"
10008 class="ays-chart-option-series-point-size ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input"
10009 name="<?php echo esc_attr($html_name_prefix); ?>settings[series_point_size][<?php echo esc_attr($key); ?>]"
10010 value="<?php echo isset($series_point_size[$key]) ? esc_attr($series_point_size[$key]) : esc_attr($point_size); ?>"
10011 data-series-id="<?php echo esc_attr($key); ?>">
10012 </div>
10013 </div> <!-- Point size -->
10014 <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">
10015 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
10016 <label for="ays-chart-option-series-point-shape">
10017 <?php echo esc_html(__( "Point shape", "chart-builder" )); ?>
10018 <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") ); ?>">
10019 <i class="ays_fa ays_fa_info_circle"></i>
10020 </a>
10021 </label>
10022 </div>
10023 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
10024 <select
10025 id="ays-chart-option-series-point-shape-<?php echo esc_attr($key); ?>"
10026 class="ays-chart-option-series-point-shape <?php echo esc_attr($html_class_prefix) ?>option-select-input form-select"
10027 name="<?php echo esc_attr($html_name_prefix); ?>settings[series_point_shape][<?php echo esc_attr($key); ?>]"
10028 data-series-id="<?php echo esc_attr($key); ?>">
10029 >
10030 <?php
10031 $value = isset($series_point_shape[$key]) ? esc_attr($series_point_shape[$key]) : $point_shape;
10032 foreach ( $point_shape_options as $option_slug => $option ):
10033 $selected = ( $value === $option_slug ) ? 'selected' : '';
10034 ?>
10035 <option value="<?php echo esc_attr($option_slug); ?>" <?php echo esc_attr($selected); ?>><?php echo esc_html($option); ?></option>
10036 <?php
10037 endforeach;
10038 ?>
10039 </select>
10040 </div>
10041 </div> <!-- Point shape -->
10042 </div>
10043 </div>
10044 </div>
10045 </fieldset>
10046 <?php
10047 endforeach;
10048 ?>
10049 </div>
10050 </div>
10051 <br>
10052 <blockquote>
10053 <?php echo esc_html(__( "Save the chart to update the data.", 'chart-builder' )); ?>
10054 <br>
10055 <?php echo sprintf(
10056 /* translators: %1$s: Opening <strong> tag, %2$s: Closing </strong> tag */
10057 esc_html(__( '%1$sNote:%2$s If you are not able to set the options, disable the row settings feature.', 'chart-builder' )),
10058 '<strong>',
10059 '</strong>'
10060 ); ?>
10061 </blockquote>
10062 </div>
10063 <?php
10064
10065 } else {
10066 ?>
10067 <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>
10068 <?php
10069 }
10070
10071 $content = ob_get_clean();
10072
10073 $title = __( 'Series settings', "chart-builder" );
10074
10075 $sources['series_settings'] = array(
10076 'content' => $content,
10077 'title' => $title
10078 );
10079
10080 return $sources;
10081 }
10082
10083 public function settings_contents_row_settings( $sources, $args ){
10084 $html_class_prefix = $args['html_class_prefix'];
10085 $html_name_prefix = $args['html_name_prefix'];
10086 $settings = $args['settings'];
10087 $source = $args['source'];
10088 $source = isset($source["commonTypeCharts"]) ? $source["commonTypeCharts"] : $source;
10089 $source_chart_type = $args['source_chart_type'];
10090
10091 if (isset($source) && !empty($source)) {
10092 if ( !isset( $source[0] ) ) {
10093 if (count($source[1]) > 2) {
10094 $titles = array();
10095 for ($i = 0; $i < count($source[1]); $i++) {
10096 array_push($titles, __("Title", 'chart-builder').$i);
10097 }
10098 $source[0] = $titles;
10099 } else {
10100 $source[0] = array(
10101 __("Country", 'chart-builder'),
10102 __("Population", 'chart-builder'),
10103 );
10104 }
10105
10106 ksort($source);
10107 }
10108 }
10109
10110 array_shift($source);
10111 $rows = array_column($source, 0);
10112
10113 $enable_row_settings = $settings['enable_row_settings'];
10114 $series_color = $settings['series_color'][0] ?? '#3366cc';
10115 $rows_color = $settings['rows_color'];
10116 $rows_opacity = $settings['rows_opacity'];
10117
10118 ob_start();
10119 ?>
10120 <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">
10121 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
10122 <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">
10123 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
10124 <label for="ays-chart-option-enable-row-settings">
10125 <?php echo esc_html(__( "Enable row settings", "chart-builder" )); ?>
10126 <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") ); ?>">
10127 <i class="ays_fa ays_fa_info_circle"></i>
10128 </a>
10129 </label>
10130 </div>
10131 <div class="col-sm-7 py-1 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
10132 <label class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-switch">
10133 <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); ?> >
10134 <span class="<?php echo esc_attr($html_class_prefix) ?>toggle-switch-slider <?php echo esc_attr($html_class_prefix) ?>toggle-switch-round"></span>
10135 </label>
10136 </div>
10137 </div> <!-- Enable row settings -->
10138 <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'; ?>">
10139 <br>
10140 <?php
10141 foreach ( $rows as $key => $val ):
10142 ?>
10143 <fieldset class="ays-rows-accordion-options-container <?php echo esc_attr($html_class_prefix) ?>options-rows-<?php echo esc_attr($key); ?>" data-collapsed="true">
10144 <legend class="ays-rows-accordion-options-header">
10145 <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">
10146 <g>
10147 <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" />
10148 </g>
10149 </svg>
10150 <span><?php echo esc_html($val); ?></span>
10151 </legend>
10152 <div class="ays-rows-accordion-options-content ays-rows-accordion-options-content">
10153 <div class="ays-rows-accordion-data-main-wrap">
10154 <div class="<?php echo esc_attr($html_class_prefix) ?>settings-data-main-wrap">
10155 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
10156 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
10157 <label for="ays-chart-option-rows-color">
10158 <?php echo esc_html(__( "Color", "chart-builder" )); ?>
10159 </label>
10160 </div>
10161 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
10162 <input type="color"
10163 id="ays-chart-option-rows-color-<?php echo esc_attr($key); ?>"
10164 class="ays-chart-option-rows-color form-control-color <?php echo esc_attr($html_class_prefix) ?>option-color-picker"
10165 name="<?php echo esc_attr($html_name_prefix); ?>settings[rows_color][<?php echo esc_attr($key); ?>]"
10166 value="<?php echo isset($rows_color[$key]) && '' !== $rows_color[$key] ? esc_attr($rows_color[$key]) : esc_attr($series_color); ?>"
10167 data-rows-id="<?php echo esc_attr($key); ?>">
10168 </div>
10169 </div> <!-- color -->
10170 <div class="form-group row mb-2 <?php echo esc_attr($html_class_prefix) ?>options-section">
10171 <div class="col-sm-5 d-flex align-items-center <?php echo esc_attr($html_class_prefix) ?>option-title">
10172 <label for="ays-chart-option-rows-color">
10173 <?php echo esc_html(__( "Opacity", "chart-builder" )); ?>
10174 </label>
10175 </div>
10176 <div class="col-sm-7 <?php echo esc_attr($html_class_prefix) ?>input-align-right">
10177 <input type="number"
10178 id="ays-chart-option-rows-opacity-<?php echo esc_attr($key); ?>"
10179 class="ays-chart-option-rows-opacity ays-text-input form-control <?php echo esc_attr($html_class_prefix) ?>option-text-input"
10180 name="<?php echo esc_attr($html_name_prefix); ?>settings[rows_opacity][<?php echo esc_attr($key); ?>]"
10181 value="<?php echo isset($rows_opacity[$key]) && '' !== $rows_opacity[$key] ? esc_attr($rows_opacity[$key]) : 1.0; ?>"
10182 data-rows-id="<?php echo esc_attr($key); ?>"
10183 step=".1" min="0" max="1">
10184 </div>
10185 </div> <!-- opacity -->
10186 </div>
10187 </div>
10188 </div>
10189 </fieldset>
10190 <?php
10191 endforeach;
10192 ?>
10193 <br>
10194 <blockquote>
10195 <?php echo esc_html(__( "Save the chart to update the data.", 'chart-builder' )); ?>
10196 <br>
10197 <?php echo sprintf(
10198 /* translators: %1$s: Opening <strong> tag, %2$s: Closing </strong> tag */
10199 esc_html(__( '%1$sNote:%2$s The applied styles will work only if the chart has one column.', 'chart-builder' )),
10200 '<strong>',
10201 '</strong>'
10202 ); ?>
10203 </blockquote>
10204 </div>
10205 <div class="<?php echo esc_attr($html_class_prefix) ?>not-hidden-options-section <?php echo $enable_row_settings === 'checked' ? 'display_none' : ''; ?>">
10206 <br>
10207 <blockquote>
10208 <?php echo sprintf(
10209 /* translators: %1$s: Opening <strong> tag, %2$s: Closing </strong> tag */
10210 esc_html(__( '%1$sNote:%2$s If this option is disabled, the general options will be set from the series settings.', 'chart-builder' )),
10211 '<strong>',
10212 '</strong>'
10213 ); ?>
10214 </blockquote>
10215 </div>
10216 </div>
10217 </div>
10218 <?php
10219 $content = ob_get_clean();
10220
10221 $title = __( 'Row settings', "chart-builder" );
10222
10223 $sources['row_settings'] = array(
10224 'content' => $content,
10225 'title' => $title
10226 );
10227
10228 return $sources;
10229 }
10230
10231 public function ays_chart_disable_all_notice_from_plugin() {
10232 if (!function_exists('get_current_screen')) {
10233 return;
10234 }
10235
10236 $screen = get_current_screen();
10237
10238 if (empty($screen) || strpos($screen->id, $this->plugin_name) === false) {
10239 return;
10240 }
10241
10242 global $wp_filter;
10243
10244 // Keep plugin-specific notices
10245 $our_plugin_notices = array();
10246
10247 $exclude_functions = [
10248 'chart_builder_general_admin_notice',
10249 ];
10250
10251 if (!empty($wp_filter['admin_notices'])) {
10252 foreach ($wp_filter['admin_notices']->callbacks as $priority => $callbacks) {
10253 foreach ($callbacks as $key => $callback) {
10254 // For class-based methods
10255 if (
10256 is_array($callback['function']) &&
10257 is_object($callback['function'][0]) &&
10258 get_class($callback['function'][0]) === __CLASS__
10259 ) {
10260 $our_plugin_notices[$priority][$key] = $callback;
10261 }
10262 // For standalone functions
10263 elseif (
10264 is_string($callback['function']) &&
10265 in_array($callback['function'], $exclude_functions)
10266 ) {
10267 $our_plugin_notices[$priority][$key] = $callback;
10268 }
10269 }
10270 }
10271 }
10272
10273 // Remove all notices
10274 remove_all_actions('admin_notices');
10275 remove_all_actions('all_admin_notices');
10276
10277 // Re-add only your plugin's notices
10278 foreach ($our_plugin_notices as $priority => $callbacks) {
10279 foreach ($callbacks as $callback) {
10280 add_action('admin_notices', $callback['function'], $priority);
10281 }
10282 }
10283 }
10284
10285 }
10286