PluginProbe
Booking Calendar / 11.8.4
Booking Calendar v11.8.4
11.8.4 11.8.3 11.8.2 11.8.1 11.8 11.7 11.6.1 11.6 11.5 11.4.3 11.4.2 11.4.1 11.4 11.3 11.2.1 11.2 11.1 11.0 10.15.7 10.15.6 10.1.3 10.10 10.10.1 10.10.2 10.11 All 204 releases
booking / includes / __js / admin / settings / ui_sidebar_left__actions.js

ui_sidebar_left__actions.js in Booking Calendar 11.8.4, at includes/__js/admin/settings/ui_sidebar_left__actions.js

504 lines 19.6 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 "use strict";
2 // =====================================================================================================================
3 // == Left Bar - expand / colapse functions ==
4 // =====================================================================================================================
5
6 /**
7 * Save user's preferred left sidebar mode.
8 *
9 * @param string mode
10 */
11 function wpbc_admin_ui__sidebar_left__save_mode( mode ) {
12 var allowed_modes = [ 'min', 'compact', 'max' ];
13
14 if ( allowed_modes.indexOf( mode ) === -1 ) {
15 return;
16 }
17
18 var $saver = jQuery( '#wpbc_left_sidebar_view_mode_saver' );
19
20 if ( ! $saver.length ) {
21 return;
22 }
23
24 if ( 'function' !== typeof wpbc_save_custom_user_data_from_element ) {
25 return;
26 }
27
28 $saver.data( 'wpbc-u-save-value', mode );
29 $saver.attr( 'data-wpbc-u-save-value', mode );
30
31 wpbc_save_custom_user_data_from_element( $saver.get( 0 ) );
32 }
33
34 /**
35 * Reveal the active item inside the scrollable left navigation.
36 *
37 * The active item itself is aligned with a small leading offset, regardless of
38 * its position inside a root section. Scrolling is applied only to SimpleBar's
39 * internal scroll element so the WordPress administration document does not
40 * move.
41 *
42 * @param {Object|null|undefined} simplebar_instance Optional initialized SimpleBar instance.
43 * @return {void}
44 */
45 function wpbc_admin_ui__sidebar_left__scroll_to_active_item( simplebar_instance ) {
46 var left_navigation_element = document.querySelector( '.wpbc_ui_el__vert_left_bar__content' );
47
48 if (
49 ! simplebar_instance
50 && 'undefined' !== typeof SimpleBar
51 && SimpleBar.instances
52 && left_navigation_element
53 ) {
54 simplebar_instance = SimpleBar.instances.get( left_navigation_element );
55 }
56
57 if (
58 ! simplebar_instance
59 || 'function' !== typeof simplebar_instance.getScrollElement
60 || 'function' !== typeof simplebar_instance.getContentElement
61 ) {
62 return;
63 }
64
65 window.requestAnimationFrame( function () {
66 var scroll_element = simplebar_instance.getScrollElement();
67 var content_element = simplebar_instance.getContentElement();
68
69 if (
70 ! scroll_element
71 || ! content_element
72 || ! content_element.closest( '.wpbc_ui_el__vert_left_bar__content' )
73 ) {
74 return;
75 }
76
77 simplebar_instance.recalculate();
78
79 var active_item = content_element.querySelector( '.wpbc_ui_el__vert_nav_item.active' );
80
81 if ( ! active_item || null === active_item.offsetParent || 0 >= scroll_element.clientHeight ) {
82 return;
83 }
84
85 var scroll_rect = scroll_element.getBoundingClientRect();
86 var active_rect = active_item.getBoundingClientRect();
87 var current_top = scroll_element.scrollTop;
88 var leading_offset = 85;
89 var active_top = current_top + active_rect.top - scroll_rect.top;
90 var target_top = active_top - leading_offset;
91
92 var maximum_top = Math.max( 0, scroll_element.scrollHeight - scroll_element.clientHeight );
93
94 scroll_element.scrollTop = Math.max( 0, Math.min( Math.round( target_top ), maximum_top ) );
95 } );
96 }
97
98 /**
99 * Expand Vertical Left Bar.
100 *
101 * @param bool is_save_user_state Save this mode as user's preference.
102 */
103 function wpbc_admin_ui__sidebar_left__do_max( is_save_user_state ) {
104 jQuery( '.wpbc_settings_page_wrapper' ).removeClass( 'min max compact none' );
105 jQuery( '.wpbc_settings_page_wrapper' ).addClass( 'max' );
106 jQuery( '.wpbc_ui__top_nav__btn_open_left_vertical_nav' ).addClass( 'wpbc_ui__hide' );
107 jQuery( '.wpbc_ui__top_nav__btn_hide_left_vertical_nav' ).removeClass( 'wpbc_ui__hide' );
108
109 jQuery( '.wp-admin' ).removeClass( 'wpbc_page_wrapper_left_min wpbc_page_wrapper_left_max wpbc_page_wrapper_left_compact wpbc_page_wrapper_left_none' );
110 jQuery( '.wp-admin' ).addClass( 'wpbc_page_wrapper_left_max' );
111 wpbc_admin_ui__sidebar_left__scroll_to_active_item();
112
113 if ( is_save_user_state ) {
114 wpbc_admin_ui__sidebar_left__save_mode( 'max' );
115 }
116 }
117
118 /**
119 * Hide Vertical Left Bar.
120 *
121 * @param bool is_save_user_state Save this mode as user's preference.
122 */
123 function wpbc_admin_ui__sidebar_left__do_min( is_save_user_state ) {
124 jQuery( '.wpbc_settings_page_wrapper' ).removeClass( 'min max compact none' );
125 jQuery( '.wpbc_settings_page_wrapper' ).addClass( 'min' );
126 jQuery( '.wpbc_ui__top_nav__btn_open_left_vertical_nav' ).removeClass( 'wpbc_ui__hide' );
127 jQuery( '.wpbc_ui__top_nav__btn_hide_left_vertical_nav' ).addClass( 'wpbc_ui__hide' );
128
129 jQuery( '.wp-admin' ).removeClass( 'wpbc_page_wrapper_left_min wpbc_page_wrapper_left_max wpbc_page_wrapper_left_compact wpbc_page_wrapper_left_none' );
130 jQuery( '.wp-admin' ).addClass( 'wpbc_page_wrapper_left_min' );
131
132 if ( is_save_user_state ) {
133 wpbc_admin_ui__sidebar_left__save_mode( 'min' );
134 }
135 }
136
137 /**
138 * Colapse Vertical Left Bar.
139 *
140 * @param bool is_save_user_state Save this mode as user's preference.
141 */
142 function wpbc_admin_ui__sidebar_left__do_compact( is_save_user_state ) {
143 jQuery( '.wpbc_settings_page_wrapper' ).removeClass( 'min max compact none' );
144 jQuery( '.wpbc_settings_page_wrapper' ).addClass( 'compact' );
145 jQuery( '.wpbc_ui__top_nav__btn_open_left_vertical_nav' ).removeClass( 'wpbc_ui__hide' );
146 jQuery( '.wpbc_ui__top_nav__btn_hide_left_vertical_nav' ).addClass( 'wpbc_ui__hide' );
147
148 jQuery( '.wp-admin' ).removeClass( 'wpbc_page_wrapper_left_min wpbc_page_wrapper_left_max wpbc_page_wrapper_left_compact wpbc_page_wrapper_left_none' );
149 jQuery( '.wp-admin' ).addClass( 'wpbc_page_wrapper_left_compact' );
150 wpbc_admin_ui__sidebar_left__scroll_to_active_item();
151
152 if ( is_save_user_state ) {
153 wpbc_admin_ui__sidebar_left__save_mode( 'compact' );
154 }
155 }
156
157 /**
158 * Completely Hide Vertical Left Bar.
159 */
160 function wpbc_admin_ui__sidebar_left__do_hide() {
161 jQuery( '.wpbc_settings_page_wrapper' ).removeClass( 'min max compact none' );
162 jQuery( '.wpbc_settings_page_wrapper' ).addClass( 'none' );
163 jQuery( '.wpbc_ui__top_nav__btn_open_left_vertical_nav' ).removeClass( 'wpbc_ui__hide' );
164 jQuery( '.wpbc_ui__top_nav__btn_hide_left_vertical_nav' ).addClass( 'wpbc_ui__hide' );
165 // Hide top "Menu" button with divider.
166 jQuery( '.wpbc_ui__top_nav__btn_show_left_vertical_nav,.wpbc_ui__top_nav__btn_show_left_vertical_nav_divider' ).addClass( 'wpbc_ui__hide' );
167
168 jQuery( '.wp-admin' ).removeClass( 'wpbc_page_wrapper_left_min wpbc_page_wrapper_left_max wpbc_page_wrapper_left_compact wpbc_page_wrapper_left_none' );
169 jQuery( '.wp-admin' ).addClass( 'wpbc_page_wrapper_left_none' );
170 }
171
172 /**
173 * Action on click "Go Back" - show root menu
174 * or some other section in left sidebar.
175 *
176 * @param string menu_to_show - menu slug.
177 */
178 function wpbc_admin_ui__sidebar_left__show_section( menu_to_show ) {
179 jQuery( '.wpbc_ui_el__vert_left_bar__section' ).addClass( 'wpbc_ui__hide' )
180 jQuery( '.wpbc_ui_el__vert_left_bar__section_' + menu_to_show ).removeClass( 'wpbc_ui__hide' );
181 }
182
183 // =====================================================================================================================
184 // == Right Side Bar - expand / colapse functions ==
185 // =====================================================================================================================
186
187 /**
188 * Synchronize the document body marker for the expanded right sidebar.
189 *
190 * The marker is domain-neutral so individual administration pages can adjust
191 * their presentation without duplicating right-sidebar state handling.
192 *
193 * @param {boolean} is_open Whether the right sidebar is fully expanded.
194 * @return {void}
195 */
196 function wpbc_admin_ui__sidebar_right__set_body_open_state( is_open ) {
197 jQuery( 'body' ).toggleClass( 'wpbc_ui_el__vert_right_bar__wrapper_opened', !! is_open );
198 }
199
200 /**
201 * Expand Vertical Right Bar.
202 */
203 function wpbc_admin_ui__sidebar_right__do_max() {
204 jQuery( '.wpbc_settings_page_wrapper' ).removeClass( 'min_right max_right compact_right none_right' );
205 jQuery( '.wpbc_settings_page_wrapper' ).addClass( 'max_right' );
206 jQuery( '.wpbc_ui__top_nav__btn_open_right_vertical_nav' ).addClass( 'wpbc_ui__hide' );
207 jQuery( '.wpbc_ui__top_nav__btn_hide_right_vertical_nav' ).removeClass( 'wpbc_ui__hide' );
208 wpbc_admin_ui__sidebar_right__set_body_open_state( true );
209 }
210
211 /**
212 * Hide Vertical Right Bar.
213 */
214 function wpbc_admin_ui__sidebar_right__do_min() {
215 jQuery( '.wpbc_settings_page_wrapper' ).removeClass( 'min_right max_right compact_right none_right' );
216 jQuery( '.wpbc_settings_page_wrapper' ).addClass( 'min_right' );
217 jQuery( '.wpbc_ui__top_nav__btn_open_right_vertical_nav' ).removeClass( 'wpbc_ui__hide' );
218 jQuery( '.wpbc_ui__top_nav__btn_hide_right_vertical_nav' ).addClass( 'wpbc_ui__hide' );
219 wpbc_admin_ui__sidebar_right__set_body_open_state( false );
220 }
221
222 /**
223 * Colapse Vertical Right Bar.
224 */
225 function wpbc_admin_ui__sidebar_right__do_compact() {
226 jQuery( '.wpbc_settings_page_wrapper' ).removeClass( 'min_right max_right compact_right none_right' );
227 jQuery( '.wpbc_settings_page_wrapper' ).addClass( 'compact_right' );
228 jQuery( '.wpbc_ui__top_nav__btn_open_right_vertical_nav' ).removeClass( 'wpbc_ui__hide' );
229 jQuery( '.wpbc_ui__top_nav__btn_hide_right_vertical_nav' ).addClass( 'wpbc_ui__hide' );
230 wpbc_admin_ui__sidebar_right__set_body_open_state( false );
231 }
232
233 /**
234 * Completely Hide Vertical Right Bar.
235 */
236 function wpbc_admin_ui__sidebar_right__do_hide() {
237 jQuery( '.wpbc_settings_page_wrapper' ).removeClass( 'min_right max_right compact_right none_right' );
238 jQuery( '.wpbc_settings_page_wrapper' ).addClass( 'none_right' );
239 jQuery( '.wpbc_ui__top_nav__btn_open_right_vertical_nav' ).removeClass( 'wpbc_ui__hide' );
240 jQuery( '.wpbc_ui__top_nav__btn_hide_right_vertical_nav' ).addClass( 'wpbc_ui__hide' );
241 // Hide top "Menu" button with divider.
242 jQuery( '.wpbc_ui__top_nav__btn_show_right_vertical_nav,.wpbc_ui__top_nav__btn_show_right_vertical_nav_divider' ).addClass( 'wpbc_ui__hide' );
243 wpbc_admin_ui__sidebar_right__set_body_open_state( false );
244 }
245
246 /**
247 * Restore the body marker when a page renders with the right sidebar open.
248 */
249 jQuery( document ).ready( function () {
250 wpbc_admin_ui__sidebar_right__set_body_open_state( 0 < jQuery( '.wpbc_settings_page_wrapper.max_right' ).length );
251 } );
252
253 /**
254 * Collapse an expanded right sidebar after an opted-in page-content click.
255 *
256 * Pages enable this behavior through the page-structure
257 * right_vertical_sidebar__content_click_collapse_mode option. Interactive
258 * controls that open or retain sidebar content can opt out by placing the
259 * data-wpbc-right-sidebar-keep-open attribute on themselves or an ancestor.
260 *
261 * @param {MouseEvent} event Content click event captured before catalog rows.
262 * @return {void}
263 */
264 function wpbc_admin_ui__sidebar_right__collapse_from_content_click( event ) {
265 var event_target = event.target && 1 === event.target.nodeType ? event.target : null;
266 var content_element = event_target && 'function' === typeof event_target.closest
267 ? event_target.closest( '.wpbc_settings_page_wrapper[data-wpbc-right-sidebar-content-click-collapse-mode] > .wpbc_settings_page_content' )
268 : null;
269 var $content;
270 var $wrapper;
271 var collapse_mode;
272 var before_collapse_event;
273
274 if ( ! content_element ) {
275 return;
276 }
277
278 $content = jQuery( content_element );
279 $wrapper = $content.closest( '.wpbc_settings_page_wrapper' );
280 collapse_mode = String( $wrapper.attr( 'data-wpbc-right-sidebar-content-click-collapse-mode' ) || '' );
281
282 if ( ! $wrapper.hasClass( 'max_right' ) || [ 'min', 'compact', 'none' ].indexOf( collapse_mode ) === -1 ) {
283 return;
284 }
285 if ( jQuery( event.target ).closest( '[data-wpbc-right-sidebar-keep-open]' ).length ) {
286 return;
287 }
288
289 /*
290 * This click belongs to the open-sidebar dismissal layer. Consume it before
291 * domain row handlers run so the same pointer action cannot close one
292 * inspector and immediately open another one underneath it.
293 */
294 event.preventDefault();
295 event.stopImmediatePropagation();
296
297 before_collapse_event = jQuery.Event( 'wpbc:right-sidebar-before-content-collapse' );
298 $wrapper.trigger( before_collapse_event, [ event ] );
299 if ( before_collapse_event.isDefaultPrevented() ) {
300 return;
301 }
302
303 if ( 'compact' === collapse_mode ) {
304 wpbc_admin_ui__sidebar_right__do_compact();
305 } else if ( 'none' === collapse_mode ) {
306 wpbc_admin_ui__sidebar_right__do_hide();
307 } else {
308 wpbc_admin_ui__sidebar_right__do_min();
309 }
310
311 jQuery( document ).trigger( 'wpbc_setup_wizard_layout_changed' );
312 }
313
314 document.addEventListener( 'click', wpbc_admin_ui__sidebar_right__collapse_from_content_click, true );
315
316
317 /**
318 * Action on click "Go Back" - show root menu
319 * or some other section in right sidebar.
320 *
321 * @param string menu_to_show - menu slug.
322 */
323 function wpbc_admin_ui__sidebar_right__show_section( menu_to_show ) {
324 jQuery( '.wpbc_ui_el__vert_right_bar__section' ).addClass( 'wpbc_ui__hide' )
325 jQuery( '.wpbc_ui_el__vert_right_bar__section_' + menu_to_show ).removeClass( 'wpbc_ui__hide' );
326 }
327
328 // =====================================================================================================================
329 // == End Right Side Bar section ==
330 // =====================================================================================================================
331
332 /**
333 * Get anchor(s) array from URL.
334 * Doc: https://developer.mozilla.org/en-US/docs/Web/API/Location
335 *
336 * @returns {*[]}
337 */
338 function wpbc_url_get_anchors_arr() {
339 var hashes = window.location.hash.replace( '%23', '#' );
340 var hashes_arr = hashes.split( '#' );
341 var result = [];
342 var hashes_arr_length = hashes_arr.length;
343
344 for ( var i = 0; i < hashes_arr_length; i++ ) {
345 if ( hashes_arr[i].length > 0 ) {
346 result.push( hashes_arr[i] );
347 }
348 }
349 return result;
350 }
351
352 /**
353 * Auto Expand Settings section based on URL anchor, after page loaded.
354 */
355 jQuery( document ).ready( function () { wpbc_admin_ui__redirect_legacy_general_availability_url(); } );
356 jQuery( document ).ready( function () { wpbc_admin_ui__do_expand_section(); setTimeout( 'wpbc_admin_ui__do_expand_section', 10 ); } );
357 jQuery( document ).ready( function () { wpbc_admin_ui__do_expand_section(); setTimeout( 'wpbc_admin_ui__do_expand_section', 150 ); } );
358
359 /**
360 * Redirect old Settings > Availability anchors to the dedicated General Availability page.
361 */
362 function wpbc_admin_ui__redirect_legacy_general_availability_url() {
363
364 if (
365 ( window.location.href.indexOf( 'page=wpbc-settings' ) > -1 )
366 && (
367 ( window.location.hash.indexOf( 'wpbc_general_settings_availability_metabox' ) > -1 )
368 || ( window.location.hash.indexOf( 'wpbc_general_settings_availability_tab' ) > -1 )
369 )
370 ) {
371 window.location.replace( window.location.href.split( '?' )[0] + '?page=wpbc-availability&tab=general_availability' );
372 }
373 }
374
375 /**
376 * Expand section in General Settings page and select Menu item.
377 */
378 function wpbc_admin_ui__do_expand_section() {
379
380 // window.location.hash = #section_id / doc: https://developer.mozilla.org/en-US/docs/Web/API/Location .
381 var anchors_arr = wpbc_url_get_anchors_arr();
382 var anchors_arr_length = anchors_arr.length;
383
384 if ( anchors_arr_length > 0 ) {
385 var one_anchor_prop_value = anchors_arr[0].split( 'do_expand__' );
386 if ( one_anchor_prop_value.length > 1 ) {
387
388 // 'wpbc_general_settings_calendar_metabox'
389 var section_to_show = one_anchor_prop_value[1];
390 var section_id_to_show = '#' + section_to_show;
391
392
393 // -- Remove selected background in all left menu items ---------------------------------------------------
394 jQuery( '.wpbc_ui_el__vert_nav_item ' ).removeClass( 'active' );
395 // Set left menu selected.
396 jQuery( '.do_expand__' + section_to_show + '_link' ).addClass( 'active' );
397 var selected_title = jQuery( '.do_expand__' + section_to_show + '_link a .wpbc_ui_el__vert_nav_title ' ).text();
398
399 // Expand section, if it colapsed.
400 if ( ! jQuery( '.do_expand__' + section_to_show + '_link' ).parents( '.wpbc_ui_el__level__folder' ).hasClass( 'expanded' ) ) {
401 jQuery( '.wpbc_ui_el__level__folder' ).removeClass( 'expanded' );
402 jQuery( '.do_expand__' + section_to_show + '_link' ).parents( '.wpbc_ui_el__level__folder' ).addClass( 'expanded' );
403 }
404
405 // -- Expand section ---------------------------------------------------------------------------------------
406 var container_to_hide_class = '.postbox';
407 // Hide sections '.postbox' in admin page and show specific one.
408 jQuery( '.wpbc_admin_page ' + container_to_hide_class ).hide();
409 jQuery( '.wpbc_container_always_hide__on_left_nav_click' ).hide();
410 jQuery( section_id_to_show ).show();
411
412 // Show all other sections, if provided in URL: ..?page=wpbc-settings#do_expand__wpbc_general_settings_capacity_metabox#wpbc_general_settings_capacity_upgrade_metabox .
413 for ( let i = 1; i < anchors_arr_length; i++ ) {
414 jQuery( '#' + anchors_arr[i] ).show();
415 }
416
417 if ( false ) {
418 var targetOffset = wpbc_scroll_to( section_id_to_show );
419 }
420
421 // -- Set Value to Input about selected Nav element --------------------------------------------------------------- // FixIn: 9.8.6.1.
422 var section_id_tab = section_id_to_show.substring( 0, section_id_to_show.length - 8 ) + '_tab';
423 if ( container_to_hide_class == section_id_to_show ) {
424 section_id_tab = '#wpbc_general_settings_all_tab'
425 }
426 if ( '#wpbc_general_settings_capacity_metabox,#wpbc_general_settings_capacity_upgrade_metabox' == section_id_to_show ) {
427 section_id_tab = '#wpbc_general_settings_capacity_tab'
428 }
429 jQuery( '#form_visible_section' ).val( section_id_tab );
430 }
431
432 // Like blinking some elements.
433 wpbc_admin_ui__do__anchor__another_actions();
434 }
435 }
436
437 function wpbc_admin_ui__is_in_mobile_screen_size() {
438 return wpbc_admin_ui__is_in_this_screen_size( 605 );
439 }
440
441 function wpbc_admin_ui__is_in_this_screen_size(size) {
442 return (window.screen.width <= size);
443 }
444
445 /**
446 * Open settings page | Expand section | Select Menu item.
447 */
448 function wpbc_admin_ui__do__open_url__expand_section(url, section_id) {
449
450 // window.location.href = url + '&do_expand=' + section_id + '#do_expand__' + section_id; //.
451 window.location.href = url + '#do_expand__' + section_id;
452
453 if ( wpbc_admin_ui__is_in_mobile_screen_size() ) {
454 wpbc_admin_ui__sidebar_left__do_min();
455 }
456
457 wpbc_admin_ui__do_expand_section();
458 }
459
460
461 /**
462 * Check for Other actions: Like blinking some elements in settings page. E.g. Days selection or change-over days.
463 */
464 function wpbc_admin_ui__do__anchor__another_actions() {
465
466 var anchors_arr = wpbc_url_get_anchors_arr();
467 var anchors_arr_length = anchors_arr.length;
468
469 // Other actions: Like blinking some elements.
470 for ( var i = 0; i < anchors_arr_length; i++ ) {
471
472 var this_anchor = anchors_arr[i];
473
474 var this_anchor_prop_value = this_anchor.split( 'do_other_actions__' );
475
476 if ( this_anchor_prop_value.length > 1 ) {
477
478 var section_action = this_anchor_prop_value[1];
479
480 switch ( section_action ) {
481
482 case 'blink_day_selections':
483 // wpbc_ui_settings__panel__click( '#wpbc_general_settings_calendar_tab a', '#wpbc_general_settings_calendar_metabox', 'Days Selection' );.
484 wpbc_blink_element( '.wpbc_tr_set_gen_booking_type_of_day_selections', 4, 350 );
485 wpbc_scroll_to( '.wpbc_tr_set_gen_booking_type_of_day_selections' );
486 break;
487
488 case 'blink_change_over_days':
489 // wpbc_ui_settings__panel__click( '#wpbc_general_settings_calendar_tab a', '#wpbc_general_settings_calendar_metabox', 'Changeover Days' );.
490 wpbc_blink_element( '.wpbc_tr_set_gen_booking_range_selection_time_is_active', 4, 350 );
491 wpbc_scroll_to( '.wpbc_tr_set_gen_booking_range_selection_time_is_active' );
492 break;
493
494 case 'blink_captcha':
495 wpbc_blink_element( '.wpbc_tr_set_gen_booking_is_use_captcha', 4, 350 );
496 wpbc_scroll_to( '.wpbc_tr_set_gen_booking_is_use_captcha' );
497 break;
498
499 default:
500 }
501 }
502 }
503 }
504