PluginProbe
Booking Calendar / 11.8.2
Booking Calendar v11.8.2
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 10.11.2 All 203 releases
booking / js / wpbc-gutenberg.js

wpbc-gutenberg.js in Booking Calendar 11.8.2, at js/wpbc-gutenberg.js

2,022 lines 79.7 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /**
2 * @version 1.0
3 * @package Booking Calendar
4 * @subpackage Getenberg integration
5 * @category inserting into posts
6 *
7 * @author wpdevelop
8 * @link https://wpbookingcalendar.com/
9 * @email info@wpbookingcalendar.com
10 *
11 * @modified 2018-08-23Probably you updated your paid version of Booking Calendar
12 */
13
14 // FixIn: 8.3.3.99.
15
16 var wpbc_gutenberg_active_block_target = {
17 block_id: '',
18 set_attributes: null
19 };
20
21 /*
22 window.wp.blocks,
23 window.wp.components,
24 window.wp.element
25
26 */
27 //( function( blocks, components, element ) {
28
29 /**
30 * Open the Booking Calendar block configurator for a specific block.
31 *
32 * This helper receives the clicked element directly because WordPress 7.1 renders
33 * the editor canvas in an iframe whose events and DOM are not available through
34 * the parent admin document.
35 *
36 * @param {string} block_id Gutenberg client ID for the block.
37 * @param {string|number} popup_tab_index Legacy configurator tab index.
38 * @param {string} popup_shortcode_id Modern configurator section ID.
39 * @param {Element|null} trigger_element Element that opened the configurator.
40 * @param {Function|null} set_attributes Attribute updater from the live block edit instance.
41 * @return {boolean} Whether the configurator was opened.
42 */
43 function wpbc_gutenberg_open_configurator( block_id, popup_tab_index, popup_shortcode_id, trigger_element, set_attributes ) {
44 var block_wrapper;
45 var normalized_tab_index = parseInt( popup_tab_index, 10 );
46
47 if ( ! block_id || ( 'function' !== typeof wpbc_tiny_btn_click ) ) {
48 return false;
49 }
50
51 if ( isNaN( normalized_tab_index ) ) {
52 normalized_tab_index = 0;
53 }
54
55 if ( trigger_element && ( 'function' === typeof trigger_element.closest ) ) {
56 block_wrapper = trigger_element.closest( 'div[data-block]' );
57 if ( block_wrapper ) {
58 block_wrapper.classList.remove( 'is-selected' );
59 }
60 }
61
62 wpbc_tiny_btn_click( '' );
63 jQuery( '#wpbc_text_gettenberg_section_id' ).val( block_id );
64 wpbc_gutenberg_active_block_target = {
65 block_id: block_id,
66 set_attributes: ( 'function' === typeof set_attributes ) ? set_attributes : null
67 };
68
69 if ( popup_shortcode_id && jQuery( '#wpbc_shortcode_config__nav_tab__' + popup_shortcode_id + ' a' ).length ) {
70 jQuery( '#wpbc_shortcode_config__nav_tab__' + popup_shortcode_id + ' a' ).first().trigger( 'click' );
71 } else {
72 jQuery( '#wpbc_tiny_modal .wpdvlp-top-tabs a.nav-tab' ).eq( normalized_tab_index ).trigger( 'click' );
73 }
74
75 return true;
76 }
77
78 /**
79 * Handle the React click event for the block configuration control.
80 *
81 * @param {Event} event React synthetic click event from the editor iframe.
82 * @param {Function} set_attributes Attribute updater from the live block edit instance.
83 * @return {boolean} Whether the configurator was opened.
84 */
85 function wpbc_gutenberg_handle_configure_click( event, set_attributes ) {
86 var trigger_element = event.currentTarget;
87
88 event.preventDefault();
89 event.stopPropagation();
90
91 return wpbc_gutenberg_open_configurator(
92 trigger_element.getAttribute( 'data_block_id' ),
93 trigger_element.getAttribute( 'popup_tab_index' ),
94 trigger_element.getAttribute( 'popup_shortcode_id' ),
95 trigger_element,
96 set_attributes
97 );
98 }
99
100 /**
101 * Handle the React click event for the preview's edit control.
102 *
103 * @param {Event} event React synthetic click event from the editor iframe.
104 * @return {boolean} Whether a matching configuration control was activated.
105 */
106 function wpbc_gutenberg_handle_preview_edit_click( event ) {
107 var preview_wrapper;
108 var configure_button;
109
110 event.preventDefault();
111 event.stopPropagation();
112
113 preview_wrapper = event.currentTarget.closest( '.wpbc_gb_div_block' );
114 configure_button = preview_wrapper ? preview_wrapper.querySelector( '.wpbc-gutenberg-open-btn' ) : null;
115
116 if ( ! configure_button ) {
117 return false;
118 }
119
120 configure_button.click();
121 return true;
122 }
123
124 ( function( wp ) {
125 /**
126 * Registers a new block provided a unique name and an object defining its behavior.
127 * @see https://github.com/WordPress/gutenberg/tree/master/blocks#api
128 */
129 var registerBlockType = wp.blocks.registerBlockType;
130
131 /**
132 * Returns a new element of given type. Element is an abstraction layer atop React.
133 * @see https://github.com/WordPress/gutenberg/tree/master/packages/element#element
134 */
135 var el = wp.element.createElement;
136
137 /**
138 * Retrieves the translation of text.
139 * @see https://github.com/WordPress/gutenberg/tree/master/i18n#api
140 */
141 var __ = wp.i18n.__;
142
143 // FixIn: 8.4.3.1.
144 /*
145 var source = wp.blocks.source,
146 RichText = wp.editor.RichText,
147 BlockControls = wp.editor.BlockControls,
148 AlignmentToolbar = wp.editor.AlignmentToolbar;*/
149
150 /**
151 * Custom SVG path for Booking Calendar icon
152 */
153 // var wpbc_icon = el('svg', { width: 16, height: 16, fill: "currentColor", className: "bi bi-calendar3-range", viewBox: "-2 -1 20 20" },
154 // el('path', { d: "M14 0H2a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2zM1 3.857C1 3.384 1.448 3 2 3h12c.552 0 1 .384 1 .857v10.286c0 .473-.448.857-1 .857H2c-.552 0-1-.384-1-.857V3.857z" } ),
155 // el('path', { d: "M7 10a1 1 0 0 0 0-2H1v2h6zm2-3h6V5H9a1 1 0 0 0 0 2z" } )
156 // );
157
158 // FixIn: 10.11.3.3.
159 var wpbc_icon = el('svg', { width: 16, height: 16, fill: "currentColor", className: "bi bi-calendar3-range", viewBox: "0 0 550 550" },
160 el('path', { d: "M275 162.36c-92.32 0-167.15 77.82-167.15 173.81S182.69 509.99 275 509.99s167.15-77.82 167.15-173.82S367.31 162.36 275 162.36Zm0 264.53c-50.1 0-90.71-40.61-90.71-90.71s40.61-90.71 90.71-90.71 90.71 40.61 90.71 90.71-40.61 90.71-90.71 90.71Z", fill: "#eee" } ),
161 el('path', { d: "M340.53 398.91c-14.85 15.51-35.16 25.76-57.84 27.66-54.87 4.6-101.64-41.14-98.23-96.1 2.94-47.44 42.35-85.01 90.54-85.01 24.84 0 47.34 9.98 63.72 26.16 5.86 5.78 15.29 5.73 21.11-.09l35.14-35.14c5.69-5.69 5.9-14.87.43-20.77-30.41-32.83-73.1-53.26-120.4-53.26-92.32 0-167.15 77.82-167.15 173.81S182.69 509.99 275 509.99c48.49 0 92.15-21.47 122.68-55.76 5.29-5.94 5.02-14.97-.6-20.59l-35.05-35.05c-5.98-5.98-15.67-5.79-21.51.32Z", fill: "#000" } ),
162 el('path', { d: "M112.53 261.27c12.34-39.07 38.32-70.02 77.79-97.04.92-.63 1.48-1.67 1.48-2.79V14.76c0-4.28-3.68-7.76-8.22-7.76h-3.76c-18.56 0-73.17 40.3-71.79 60.62l-.17 192.91c0 2.74 3.86 3.34 4.68.73Z", fill: "#000" } )
163 );
164
165 registerBlockType( 'booking/booking', {
166
167 title: 'Booking Calendar',
168
169 description: __( 'Show a booking form, availability calendar or other elements from Booking Calendar plugin.' ),
170
171 icon: wpbc_icon, // FixIn: 9.5.2.1.
172
173 // icon: {
174 // // Specifying a background color to appear with the icon e.g.: in the inserter.
175 // background: 'rgb(129, 142, 160)',
176 // // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
177 // foreground: '#fff',
178 // // Specifying a dashicon for the block
179 // src: 'calendar-alt'
180 // },
181
182 category: 'common', // common | formatting | layout | widgets | embed
183
184 /*
185 // Use the block just once per post // its possible to use several Booking Calendar forms for different booking resources
186 multiple: false,
187 */
188
189 // // Add the support for block's alignment (left, center, right, wide, full).
190 // align: true,
191 //
192 // // Pick which alignment options to display.
193 // align: [ 'left', 'right', 'full' ],
194
195 keywords: [ 'wpbc' , 'oplugins', 'form' ],
196
197 // // Specifying my block attributes
198 attributes: {
199 /*content: {
200 type: 'string',
201 source: 'children',
202 selector: 'p',
203 },*/
204
205 wpbc_shortcode: {
206 type: 'string',
207 default: ''
208 }
209 },
210
211 deprecated: [
212 {
213 supports: {},
214 attributes: {
215 wpbc_shortcode: {
216 type: 'string',
217 source: 'text',
218 selector: 'div',
219 default: ''
220 }
221 },
222
223 /**
224 * Migrate a shortcode recovered from historical saved block markup.
225 *
226 * Some released posts contain a missing or stale comment attribute while
227 * retaining the complete shortcode inside the saved div. The deprecated
228 * parser makes that visible text authoritative only during recovery.
229 *
230 * @param {Object} attributes Parsed deprecated block attributes.
231 * @return {Object} Current block attributes containing the recovered shortcode.
232 */
233 migrate: function( attributes ) {
234 return {
235 wpbc_shortcode: attributes.wpbc_shortcode || ''
236 };
237 },
238
239 /**
240 * Reproduce the historical wrapper while WordPress validates old content.
241 *
242 * @param {Object} props Deprecated block properties.
243 * @return {Object} WordPress element for the historical saved markup.
244 */
245 save: function( props ) {
246 return el( 'div', null, props.attributes.wpbc_shortcode );
247 }
248 }
249 ],
250
251
252 edit: function( props ) {
253
254 //console.log( 'WPBC-Gb :: Edit :', props );
255
256 jQuery( '.wpbc-gutenberg-update-view').remove();
257
258 var children = [],
259 cid = props.clientId; // its reference to unique 'data-block' attribute in section: <div class="editor-block-list__block-edit" data-block="8a1b713a-6981-43d3-a1f5-ce98b0e611d4"> ...
260
261 var btnClassName = 'button wpbc-gutenberg-open-btn';
262
263
264 ////////////////////////////////////////////////////////////////////////////////////////////////////
265 ////////////////////////////////////////////////////////////////////////////////////////////////////
266
267 // The block attribute is the only authoritative editor value. Reading the
268 // mounted input here races React's next commit: after the configurator
269 // calls setAttributes(), the old input still contains the previous value
270 // and would immediately overwrite the new shortcode during this render.
271 var _val = props.attributes.wpbc_shortcode;
272
273 if ( typeof _val == typeof undefined ) {
274 _val = '';
275 }
276
277 ////////////////////////////////////////////////////////////////////////////////////////////////////
278 ////////////////////////////////////////////////////////////////////////////////////////////////////
279
280
281 children.push(
282 el( 'a',
283 {
284 className : btnClassName,
285 // href : 'javascript:void(0)', //FixIn: 8.7.3.17 href: '#!'
286 href : '#!',
287 data_block_id: cid,
288 popup_tab_index: 0, // Will be index for active tab in popup dialog
289 popup_shortcode_id: '',
290 onClick: function( event ) {
291 return wpbc_gutenberg_handle_configure_click( event, props.setAttributes );
292 },
293 key: 'configure_' + cid // FixIn: 8.7.3.18.
294 },
295 __( 'Configure Booking Calendar Block' )
296 )
297 );
298
299 // Visual Preview of Block
300 children = wpbc_gt_parse_shortcode( props.attributes.wpbc_shortcode, children , cid ); // FixIn: 8.7.3.18.
301
302 //console.log( 'WPBC children', children) ;
303
304 children.push(
305
306 el(
307 'input',
308 {
309 key: 'onchangewpbcinput_' + cid, // FixIn: 8.7.3.18.
310 value : _val, //props.attributes.wpbc_shortcode,
311 onChange : function ( event ) {
312 props.setAttributes( {wpbc_shortcode: event.target.value } );
313 //console.log( '%cWPBC-Gb :: o n C h a n g e !!!! Y E S !!! event for onChangeWPBCinputShortcode', 'color: orange; font-weight: bold;', event );
314 },
315 onClick: function (event) { // FixIn: 8.8.2.10.
316 props.setAttributes( {wpbc_shortcode: event.target.value } );
317 },
318 className: 'wpbc_gb_text_shortcode',
319 type : 'text',
320 //readOnly : 'readonly', // FixIn: 8.8.2.10.
321 //disabled : 'disabled', // FixIn: 8.8.2.10.
322 // onFocus : function ( event ){
323 // event.target.select();
324 // }
325 }
326 )
327
328 );
329
330
331 // Show Hided Block (after configuration) -- React update Block preview
332 jQuery( '.wpbc_gb_div_block' ).parent().removeClass( 'hidden' );
333
334
335 var wpbc_gb_div_block_css = 'wpbc_gb_div_block';
336 if ( '' == props.attributes.wpbc_shortcode ) {
337 // If no shortcode at all, then do not hide configure button
338 wpbc_gb_div_block_css += ' wpbc_gb_div_block_no_shortcode';
339 }
340
341 return el( 'div', { className: wpbc_gb_div_block_css }, children );
342 },
343
344
345 save: function( props ) {
346
347 //console.log( 'WPBC-Gb :: Saving ', props );
348
349 return el( 'div', null, props.attributes.wpbc_shortcode );
350 }
351
352
353 } );
354
355
356 } )(
357 window.wp
358 );
359
360
361 ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
362 ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
363 ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
364
365
366 ( function( $ ) {
367
368 $( document ).on( 'click', '.wpbc_gb_block_preview_inner_title_edit', function( e ) {
369 //jQuery( '.wpbc-gutenberg-open-btn' ).hide();
370 $( this ).closest( '.wpbc_gb_div_block' ).find( '.wpbc-gutenberg-open-btn' ).trigger( 'click' ); // FixIn: 8.7.11.12.
371
372 });
373
374 /**
375 * Open popup window for configuration Booking Calendar shortcode
376 */
377 $( document ).on( 'click', '.wpbc-gutenberg-open-btn', function( e ) {
378
379 e.preventDefault();
380 wpbc_gutenberg_open_configurator(
381 $( this ).attr( 'data_block_id' ),
382 $( this ).attr( 'popup_tab_index' ),
383 $( this ).attr( 'popup_shortcode_id' ),
384 this
385 );
386
387 });
388
389
390 /**
391 * Remove Update view button after clicking on it.
392 */
393 $( document ).on( 'click', '.wpbc-gutenberg-update-preview-btn', function( e ) {
394
395 e.preventDefault();
396
397 jQuery( '.wpbc-gutenberg-update-view').remove();
398
399 //console.log( 'WPBC-Gb :: Preview button clicked. Section #' );
400
401 });
402
403
404 } ) ( jQuery );
405
406
407 /**
408 * Send shortcode from popup dialog into the gutenberg sections.
409 *
410 * @param shortcode_text
411 * @returns {boolean}
412 */
413 function wpbc_send_text_to_gutenberg( shortcode_text ){
414
415 // Get ID of section, where to insert shortcode configuraiton
416 var block_section_id = jQuery( "#wpbc_text_gettenberg_section_id" ).val();
417 var block_editor_select;
418 var block_editor_dispatch;
419 var target_block;
420 var shortcode_input;
421 var active_set_attributes;
422
423 //console.log( 'WPBC-Gb :: wpbc_send_text_to_gutenberg' , shortcode_text, block_section_id );
424
425 if ( '' == block_section_id ) {
426
427 return false; // if no such block then just return false, its means tha inserting in Classic block - TinyMCE
428 }
429
430 // Use the updater from this exact block edit instance. Unlike the global
431 // data registry, this callback remains bound to a scoped BlockEditorProvider.
432 if (
433 block_section_id === wpbc_gutenberg_active_block_target.block_id &&
434 'function' === typeof wpbc_gutenberg_active_block_target.set_attributes
435 ) {
436 active_set_attributes = wpbc_gutenberg_active_block_target.set_attributes;
437 wpbc_gutenberg_active_block_target = {
438 block_id: '',
439 set_attributes: null
440 };
441 active_set_attributes(
442 { wpbc_shortcode: shortcode_text }
443 );
444 return true;
445 }
446
447 // Retain a verified fallback for editors that expose their block store in
448 // the global registry. Do not report success unless that registry owns the
449 // exact Booking Calendar block targeted by the configurator.
450 if (
451 wp.data &&
452 ( 'function' === typeof wp.data.select ) &&
453 ( 'function' === typeof wp.data.dispatch )
454 ) {
455 block_editor_select = wp.data.select( 'core/block-editor' );
456 target_block = block_editor_select && ( 'function' === typeof block_editor_select.getBlock )
457 ? block_editor_select.getBlock( block_section_id )
458 : null;
459
460 if ( target_block && ( 'booking/booking' === target_block.name ) ) {
461 block_editor_dispatch = wp.data.dispatch( 'core/block-editor' );
462 }
463
464 if ( block_editor_dispatch && ( 'function' === typeof block_editor_dispatch.updateBlockAttributes ) ) {
465 block_editor_dispatch.updateBlockAttributes(
466 block_section_id,
467 { wpbc_shortcode: shortcode_text }
468 );
469 return true;
470 }
471 }
472
473
474 // Code to insert into Gutenberg section in our text field
475 shortcode_input = jQuery( 'div[data-block="' + block_section_id + '"] .wpbc_gb_text_shortcode' );
476 if ( ! shortcode_input.length ) {
477 return false;
478 }
479 shortcode_input.val( shortcode_text );
480
481 //Its does not work for automatic generating "Edit" event :((( , so we make some workarround in Edit block event
482 shortcode_input.trigger( 'focus' ).trigger('mousedown').trigger( 'click' ).trigger('mouseup').trigger('change');
483
484 // FixIn: 8.4.2.10.
485 //FixIn: 8.7.3.17 href: '#!'
486 //FixIn: 8.7.3.19 - chnaged <a href="#!" to '<div href="#!" - its make update of block after clicking on DIV (and not A) element
487
488 //FixIn: 8.8.2.10 - commenting these 2 blocks
489 // jQuery( 'div[data-block="' + block_section_id + '"]' ).parent().parent().before(
490 // '<div class="editor-block-list__block wpbc-gutenberg-update-view" style="cursor: pointer;text-align: center;">' +
491 // '<div href="#!" class="button wpbc-gutenberg-update-preview-btn" ' +
492 // '>' + wp.i18n.__( 'Click to Preview Block' ) + '</div></div>'
493 // );
494 // // FixIn: 8.7.6.11.
495 // jQuery( 'div[data-block="' + block_section_id + '"]' ).before(
496 // '<div class="editor-block-list__block wpbc-gutenberg-update-view" style="cursor: pointer;text-align: center;">' +
497 // '<div href="#!" class="button wpbc-gutenberg-update-preview-btn" ' +
498 // '>' + wp.i18n.__( 'Click to Preview Block' ) + '</div></div>'
499 // );
500
501
502
503 // Hide entire Block -- until React does not update Block preview
504 //jQuery( 'div[data-block="' + block_section_id + '"]' ).addClass( 'hidden' ); //FixIn: 8.8.2.10 - commenting
505
506 // Neet to return true, to prevent insertion into some other TinyMCE block, if exist, because we have inserted it into Gutenberg
507 return true;
508 }
509
510
511 ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
512 ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
513 ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
514
515
516
517 ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
518 ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
519 ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
520
521 /**
522 * Parse shortcode in text field and show Visual Preview of element
523 *
524 * @param shortcode_in_text - shortcode from text field
525 * @param children - array of el for gnerating preview
526 * @returns - array of el
527 */
528 function wpbc_gt_parse_shortcode( shortcode_in_text, children, cid ){ // FixIn: 8.7.3.18.
529
530 //console.log( 'wpbc_gt_parse_shortcode cid', cid );
531
532 var wpbc_shortcode_type
533 , shortcode_obj
534 , block_preview_el = ''
535 , el = wp.element.createElement;
536
537 var block_header_txt, block_text_txt;
538
539 var wpbc_shortcode_type_arr = [ 'booking'
540 , 'bookingcalendar'
541 , 'booking_appointment'
542 , 'booking_resource_selector'
543 , 'bookingtimeline'
544 , 'bookingselect'
545 , 'bookingform'
546 , 'bookingsearch'
547 , 'bookingsearchresults'
548 , 'bookingedit'
549 , 'bookingcustomerlisting'
550 , 'bookingresource'
551 , 'booking_confirm'
552 , 'booking-manager-import'
553 , 'booking-manager-listing'
554 ];
555 var wpbc_shortcode_type_arr_length = wpbc_shortcode_type_arr.length;
556
557 for ( var i = 0; i < wpbc_shortcode_type_arr_length ; i++ ){
558
559 wpbc_shortcode_type = wpbc_shortcode_type_arr[ i ];
560
561 shortcode_obj = wp.shortcode.next( wpbc_shortcode_type, shortcode_in_text, 0 ); // Parse shortcode
562
563 if ( undefined != shortcode_obj ){
564
565 block_preview_el = '';
566 //console.log( 'wpbc_shortcode_type' , wpbc_shortcode_type);
567 // Get Preview
568 switch ( wpbc_shortcode_type ){
569
570 case 'booking':
571 block_preview_el = wpbc_gt_get_visual_block_for_booking( shortcode_obj.shortcode, {
572 'shortcode_in_text': shortcode_in_text
573 , 'cid_key': wpbc_shortcode_type+ '_' + cid // FixIn: 8.7.3.18.
574 } );
575 children[ (children.length - 1) ].props.popup_tab_index = 0; // Set index of Active tab in popup dialog
576 break;
577
578 case 'bookingcalendar':
579 block_preview_el = wpbc_gt_get_visual_block_for_bookingcalendar( shortcode_obj.shortcode, {
580 'shortcode_in_text': shortcode_in_text
581 , 'cid_key': wpbc_shortcode_type+ '_' + cid
582 } );
583 children[ (children.length - 1) ].props.popup_tab_index = 2; // Set index of Active tab in popup dialog
584 break;
585
586 case 'booking_appointment':
587 block_preview_el = wpbc_gt_get_visual_block_for_booking_appointment( shortcode_obj.shortcode, {
588 'shortcode_in_text': shortcode_in_text
589 , 'cid_key': wpbc_shortcode_type+ '_' + cid
590 } );
591 children[ (children.length - 1) ].props.popup_shortcode_id = 'booking_appointment';
592 break;
593
594 case 'booking_resource_selector':
595 block_preview_el = wpbc_gt_get_visual_block_for_booking_resource_selector( shortcode_obj.shortcode, {
596 'shortcode_in_text': shortcode_in_text
597 , 'cid_key': wpbc_shortcode_type+ '_' + cid
598 } );
599 children[ (children.length - 1) ].props.popup_shortcode_id = 'booking_resource_selector';
600 break;
601
602 case 'bookingtimeline':
603 block_preview_el = wpbc_gt_get_visual_block_for_bookingtimeline( shortcode_obj.shortcode, {
604 'shortcode_in_text': shortcode_in_text
605 , 'cid_key': wpbc_shortcode_type+ '_' + cid
606 } );
607 children[ (children.length - 1) ].props.popup_tab_index = 1; // Set index of Active tab in popup dialog
608 break;
609
610 case 'bookingselect':
611 block_preview_el = wpbc_gt_get_visual_block_for_bookingselect( shortcode_obj.shortcode, {
612 'shortcode_in_text': shortcode_in_text
613 , 'cid_key': wpbc_shortcode_type+ '_' + cid
614 } );
615 children[ (children.length - 1) ].props.popup_tab_index = 3; // Set index of Active tab in popup dialog
616 break;
617
618 case 'bookingform':
619 block_preview_el = wpbc_gt_get_visual_block_for_bookingform( shortcode_obj.shortcode, {
620 'shortcode_in_text': shortcode_in_text
621 , 'cid_key': wpbc_shortcode_type+ '_' + cid
622 } );
623 children[ (children.length - 1) ].props.popup_tab_index = 5; // Set index of Active tab in popup dialog
624 break;
625
626 case 'bookingsearch':
627 block_preview_el = wpbc_gt_get_visual_block_for_bookingsearch( shortcode_obj.shortcode, {
628 'shortcode_in_text': shortcode_in_text
629 , 'cid_key': wpbc_shortcode_type+ '_' + cid
630 } );
631 children[ (children.length - 1) ].props.popup_tab_index = 4; // Set index of Active tab in popup dialog
632 break;
633
634 case 'bookingsearchresults':
635 block_preview_el = wpbc_gt_get_visual_block_for_bookingsearchresults( shortcode_obj.shortcode, {
636 'shortcode_in_text': shortcode_in_text
637 , 'cid_key': wpbc_shortcode_type+ '_' + cid
638 } );
639 children[ (children.length - 1) ].props.popup_tab_index = 4; // Set index of Active tab in popup dialog
640 break;
641
642 case 'bookingedit':
643 block_preview_el = wpbc_gt_get_visual_block_for_bookingedit( shortcode_obj.shortcode, {
644 'shortcode_in_text': shortcode_in_text
645 , 'cid_key': wpbc_shortcode_type+ '_' + cid
646 } );
647 children[ (children.length - 1) ].props.popup_tab_index = -1; // Set index of Active tab in popup dialog
648 break;
649
650 case 'bookingcustomerlisting':
651 block_preview_el = wpbc_gt_get_visual_block_for_bookingcustomerlisting( shortcode_obj.shortcode, {
652 'shortcode_in_text': shortcode_in_text
653 , 'cid_key': wpbc_shortcode_type+ '_' + cid
654 } );
655 children[ (children.length - 1) ].props.popup_tab_index = -1; // Set index of Active tab in popup dialog
656 break;
657
658 case 'bookingresource':
659 block_preview_el = wpbc_gt_get_visual_block_for_bookingresource( shortcode_obj.shortcode, {
660 'shortcode_in_text': shortcode_in_text
661 , 'cid_key': wpbc_shortcode_type+ '_' + cid
662 } );
663 children[ (children.length - 1) ].props.popup_tab_index = -1; // Set index of Active tab in popup dialog
664 break;
665
666 case 'booking_confirm':
667 block_preview_el = wpbc_gt_get_visual_block_for_booking_confirm( shortcode_obj.shortcode, {
668 'shortcode_in_text': shortcode_in_text
669 , 'cid_key': wpbc_shortcode_type+ '_' + cid
670 } );
671 children[ (children.length - 1) ].props.popup_tab_index = -1; // Set index of Active tab in popup dialog
672 break;
673
674 case 'booking-manager-import':
675 block_preview_el = wpbc_gt_get_visual_block_for_booking_manager_import( shortcode_obj.shortcode, {
676 'shortcode_in_text': shortcode_in_text
677 , 'cid_key': wpbc_shortcode_type+ '_' + cid
678 } );
679 //block_preview_el = el( 'div', { className: 'test' }, 'Test Import 1' );
680 children[ (children.length - 1) ].props.popup_tab_index = -1; // Set index of Active tab in popup dialog
681 break;
682
683 case 'booking-manager-listing':
684 block_preview_el = wpbc_gt_get_visual_block_for_booking_manager_listing( shortcode_obj.shortcode, {
685 'shortcode_in_text': shortcode_in_text
686 , 'cid_key': wpbc_shortcode_type+ '_' + cid
687 } );
688 //block_preview_el = el( 'div', { className: 'test' }, 'Test 2' );
689 children[ (children.length - 1) ].props.popup_tab_index = -1; // Set index of Active tab in popup dialog
690 break;
691
692 default:
693 block_preview_el = wpbc_gt_get_visual_block_for_default( shortcode_obj.shortcode
694 , {
695 'shortcode_in_text': shortcode_in_text,
696 'block_header' : block_header_txt,
697 'block_text' : block_text_txt
698 , 'cid_key': wpbc_shortcode_type+ '_' + cid
699 }
700 );
701
702 }
703
704 //console.log( 'WPBC-Gb :: block_preview_el', block_preview_el);
705
706 if ( '' != block_preview_el ){
707 children.push( block_preview_el );
708 }
709 }
710
711 }
712
713 return children;
714 }
715
716
717 ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
718
719
720 /**
721 * Generate Visual Preview Block - just general Shortcode
722 *
723 * @param shortcode_obj - shortcode JavaScript obj.
724 * @returns
725 */
726 function wpbc_gt_get_visual_block_for_default( shortcode_obj, params ){
727
728 // Booking Form Parameters // FixIn: 10.0.0.16.
729 var shortcode_defaults = {
730 type : 1,
731 resource_id : 1,
732 nummonths : 1,
733 form_type : 'standard',
734 aggregate : null,
735 startmonth: null,
736 options : null
737 };
738
739 // // Calendar Parameters
740 // var shortcode_defaults = {
741 // type : 1,
742 // resource_id : 1,
743 // nummonths : 1,
744 // aggregate : null,
745 // startmonth: null,
746 // options : null
747 // };
748
749 var props = _.defaults( shortcode_obj.attrs.named, shortcode_defaults );
750
751 var el = wp.element.createElement;
752
753 //FixIn: 8.7.3.18 Start
754 var inner_header = el( 'div', {className: 'wpbc_gb_block_preview_inner_header', key: 'header_' + params[ 'cid_key' ]}
755 , wpbc_gb_tpl_header( { header: params[ 'block_header' ], cid_key: 'header_' + params[ 'cid_key' ] } )
756 );
757 var inner_body = el( 'div', {className: 'wpbc_gb_block_preview_inner_body', key: 'body_' + params[ 'cid_key' ] }
758 , wpbc_gb_tpl_shortcode_parameters(
759 [
760 { block_text: params[ 'block_text' ] }
761 , { name: 'Booking form', value: 'super-booking-admin'}
762 , { name: 'Number of months to show', value: '2'}
763 ]
764 , { cid_key: 'body_' + params[ 'cid_key' ] }
765 )
766 );
767 var inner_footer = el( 'div', {className: 'wpbc_gb_block_preview_inner_footer' , key: 'footer_' + params[ 'cid_key' ] }
768 , wpbc_gb_tpl_footer( { shortcode_in_text: params[ 'shortcode_in_text' ], cid_key: 'footer_' + params[ 'cid_key' ] } )
769 );
770
771 return el( 'div', { className: 'wpbc_gb_block_shortcode_preview_wrapper wpbc_gb_block_preview_default' , key: 'preview_wrapper_' + params[ 'cid_key' ] }
772
773 , el( 'div', { className: 'wpbc_gb_block_shortcode_preview_content' , key: 'preview_content_' + params[ 'cid_key' ] }
774 , [ inner_header, inner_body ]
775 )
776 , inner_footer
777 );
778 //FixIn: 8.7.3.18 End
779 }
780
781
782 /**
783 * Generate one configuration-box preview for a workflow shortcode.
784 *
785 * @param shortcode_obj Parsed WordPress shortcode object.
786 * @param params Preview instance parameters.
787 * @param configuration Header, description, CSS class, and parameter labels.
788 * @returns React preview element.
789 */
790 function wpbc_gt_get_visual_block_for_workflow( shortcode_obj, params, configuration ){
791
792 var props = shortcode_obj.attrs && shortcode_obj.attrs.named ? shortcode_obj.attrs.named : {};
793 var rows_in_content = [
794 { block_text: configuration.description }
795 ];
796
797 for ( var parameter_index = 0; parameter_index < configuration.parameters.length; parameter_index++ ) {
798 var parameter = configuration.parameters[ parameter_index ];
799 if ( ! Object.prototype.hasOwnProperty.call( props, parameter.key ) ) {
800 continue;
801 }
802
803 var parameter_value = props[ parameter.key ];
804 if ( '' === parameter_value ) {
805 parameter_value = wp.i18n.__( '(empty)' );
806 } else if ( parameter.prefix ) {
807 parameter_value = parameter.prefix + parameter_value;
808 }
809 rows_in_content.push( { name: parameter.label, value: parameter_value } );
810 }
811
812 var el = wp.element.createElement;
813 var inner_header = el( 'div', {
814 className: 'wpbc_gb_block_preview_inner_header',
815 key: 'header_' + params[ 'cid_key' ]
816 },
817 wpbc_gb_tpl_header( { header: configuration.header, cid_key: 'header_' + params[ 'cid_key' ] } )
818 );
819 var inner_body = el( 'div', {
820 className: 'wpbc_gb_block_preview_inner_body',
821 key: 'body_' + params[ 'cid_key' ]
822 },
823 wpbc_gb_tpl_shortcode_parameters( rows_in_content, { cid_key: 'body_' + params[ 'cid_key' ] } )
824 );
825 var inner_footer = el( 'div', {
826 className: 'wpbc_gb_block_preview_inner_footer',
827 key: 'footer_' + params[ 'cid_key' ]
828 },
829 wpbc_gb_tpl_footer( { shortcode_in_text: params[ 'shortcode_in_text' ], cid_key: 'footer_' + params[ 'cid_key' ] } )
830 );
831
832 return el( 'div', {
833 className: 'wpbc_gb_block_shortcode_preview_wrapper ' + configuration.class_name,
834 key: 'preview_wrapper_' + params[ 'cid_key' ]
835 },
836 el( 'div', {
837 className: 'wpbc_gb_block_shortcode_preview_content',
838 key: 'preview_content_' + params[ 'cid_key' ]
839 },
840 [ inner_header, inner_body ]
841 ),
842 inner_footer
843 );
844 }
845
846
847 /**
848 * Generate the [booking_appointment] Gutenberg configuration preview.
849 *
850 * @param shortcode_obj Parsed shortcode.
851 * @param params Preview instance parameters.
852 * @returns React preview element.
853 */
854 function wpbc_gt_get_visual_block_for_booking_appointment( shortcode_obj, params ){
855
856 return wpbc_gt_get_visual_block_for_workflow(
857 shortcode_obj,
858 params,
859 {
860 header: wp.i18n.__( 'Appointment Booking' ),
861 description: wp.i18n.__( 'Service-first appointment booking: visitors choose a Service and compatible Provider before selecting dates and entering booking details.' ),
862 class_name: 'wpbc_gb_block_preview_booking_appointment',
863 parameters: [
864 { key: 'service_id', label: wp.i18n.__( 'Preselected Service' ), prefix: 'ID = ' },
865 { key: 'provider_id', label: wp.i18n.__( 'Preselected Provider' ), prefix: 'ID = ' },
866 { key: 'services', label: wp.i18n.__( 'Allowed Services' ), prefix: 'ID = ' },
867 { key: 'providers', label: wp.i18n.__( 'Allowed Providers' ), prefix: 'ID = ' },
868 { key: 'auto_select_provider', label: wp.i18n.__( 'Auto-select the only Provider' ) },
869 { key: 'catalog_layout', label: wp.i18n.__( 'Catalog layout' ) },
870 { key: 'show_resource_filters', label: wp.i18n.__( 'Show catalog search' ) },
871 { key: 'show_resource_image', label: wp.i18n.__( 'Show images' ) },
872 { key: 'show_resource_title', label: wp.i18n.__( 'Show titles' ) },
873 { key: 'show_resource_description', label: wp.i18n.__( 'Show Service descriptions' ) },
874 { key: 'catalog_item_width', label: wp.i18n.__( 'Catalog item width' ) },
875 { key: 'catalog_item_max_width', label: wp.i18n.__( 'Maximum catalog item width (px)' ) },
876 { key: 'catalog_grid_items_per_row', label: wp.i18n.__( 'Grid items per row' ) },
877 { key: 'catalog_list_items_per_row', label: wp.i18n.__( 'List items per row' ) },
878 { key: 'show_resource_hierarchy', label: wp.i18n.__( 'Show Service relationship' ) },
879 { key: 'show_availability', label: wp.i18n.__( 'Show availability summary' ) },
880 { key: 'show_starting_price', label: wp.i18n.__( 'Show starting price' ) },
881 { key: 'form_type', label: wp.i18n.__( 'Booking Form' ) },
882 { key: 'nummonths', label: wp.i18n.__( 'Visible months number' ) },
883 { key: 'startmonth', label: wp.i18n.__( 'Start month' ) },
884 { key: 'calendar_dates_start', label: wp.i18n.__( 'First calendar date' ) },
885 { key: 'calendar_dates_end', label: wp.i18n.__( 'Last calendar date' ) },
886 { key: 'allow_past', label: wp.i18n.__( 'Allow past bookings' ) },
887 { key: 'show_progress', label: wp.i18n.__( 'Show progress' ) },
888 { key: 'progress_item_1_number', label: wp.i18n.__( 'Step 1 number' ) },
889 { key: 'progress_item_1_title', label: wp.i18n.__( 'Step 1 title' ) },
890 { key: 'progress_item_2_number', label: wp.i18n.__( 'Step 2 number' ) },
891 { key: 'progress_item_2_title', label: wp.i18n.__( 'Step 2 title' ) },
892 { key: 'progress_item_3_number', label: wp.i18n.__( 'Step 3 number' ) },
893 { key: 'progress_item_3_title', label: wp.i18n.__( 'Step 3 title' ) },
894 { key: 'progress_service_number', label: wp.i18n.__( 'Step 1 number (compatibility)' ) },
895 { key: 'progress_service_title', label: wp.i18n.__( 'Step 1 title (compatibility)' ) },
896 { key: 'progress_provider_number', label: wp.i18n.__( 'Step 2 number (compatibility)' ) },
897 { key: 'progress_provider_title', label: wp.i18n.__( 'Step 2 title (compatibility)' ) },
898 { key: 'progress_details_number', label: wp.i18n.__( 'Step 3 number (compatibility)' ) },
899 { key: 'progress_details_title', label: wp.i18n.__( 'Step 3 title (compatibility)' ) },
900 { key: 'screen_1_title', label: wp.i18n.__( 'Service screen title' ) },
901 { key: 'screen_1_description', label: wp.i18n.__( 'Service screen description' ) },
902 { key: 'screen_2_title', label: wp.i18n.__( 'Provider screen title' ) },
903 { key: 'screen_2_description', label: wp.i18n.__( 'Provider screen description' ) },
904 { key: 'options', label: wp.i18n.__( 'Options' ) }
905 ]
906 }
907 );
908 }
909
910
911 /**
912 * Generate the [booking_resource_selector] Gutenberg configuration preview.
913 *
914 * @param shortcode_obj Parsed shortcode.
915 * @param params Preview instance parameters.
916 * @returns React preview element.
917 */
918 function wpbc_gt_get_visual_block_for_booking_resource_selector( shortcode_obj, params ){
919
920 return wpbc_gt_get_visual_block_for_workflow(
921 shortcode_obj,
922 params,
923 {
924 header: wp.i18n.__( 'Booking Resource Selector' ),
925 description: wp.i18n.__( 'Resource-first booking: visitors choose a Booking Resource before selecting dates and completing its Booking Form.' ),
926 class_name: 'wpbc_gb_block_preview_booking_resource_selector',
927 parameters: [
928 { key: 'resource_id', label: wp.i18n.__( 'Preselected Booking Resource' ), prefix: 'ID = ' },
929 { key: 'resources', label: wp.i18n.__( 'Allowed Booking Resources' ), prefix: 'ID = ' },
930 { key: 'type', label: wp.i18n.__( 'Allowed Booking Resources (compatibility)' ), prefix: 'ID = ' },
931 { key: 'selected_resource_id', label: wp.i18n.__( 'Preselected Booking Resource (compatibility)' ), prefix: 'ID = ' },
932 { key: 'selected_type', label: wp.i18n.__( 'Preselected Booking Resource (legacy)' ), prefix: 'ID = ' },
933 { key: 'aggregate', label: wp.i18n.__( 'Aggregate Booking Resources' ), prefix: 'ID = ' },
934 { key: 'auto_select_resource', label: wp.i18n.__( 'Auto-select Booking Resource' ) },
935 { key: 'catalog_layout', label: wp.i18n.__( 'Resource layout' ) },
936 { key: 'show_resource_filters', label: wp.i18n.__( 'Show Resource search' ) },
937 { key: 'show_resource_image', label: wp.i18n.__( 'Show Resource image' ) },
938 { key: 'show_resource_title', label: wp.i18n.__( 'Show Resource title' ) },
939 { key: 'show_resource_description', label: wp.i18n.__( 'Show Resource description' ) },
940 { key: 'catalog_item_width', label: wp.i18n.__( 'Resource item width' ) },
941 { key: 'catalog_item_max_width', label: wp.i18n.__( 'Maximum Resource item width (px)' ) },
942 { key: 'catalog_grid_items_per_row', label: wp.i18n.__( 'Grid items per row' ) },
943 { key: 'catalog_list_items_per_row', label: wp.i18n.__( 'List items per row' ) },
944 { key: 'show_resource_hierarchy', label: wp.i18n.__( 'Show Resource hierarchy' ) },
945 { key: 'show_availability', label: wp.i18n.__( 'Show availability summary' ) },
946 { key: 'show_starting_price', label: wp.i18n.__( 'Show starting price' ) },
947 { key: 'form_type', label: wp.i18n.__( 'Booking Form' ) },
948 { key: 'nummonths', label: wp.i18n.__( 'Visible months number' ) },
949 { key: 'startmonth', label: wp.i18n.__( 'Start month' ) },
950 { key: 'calendar_dates_start', label: wp.i18n.__( 'First calendar date' ) },
951 { key: 'calendar_dates_end', label: wp.i18n.__( 'Last calendar date' ) },
952 { key: 'selected_dates', label: wp.i18n.__( 'Preselected dates' ) },
953 { key: 'allow_past', label: wp.i18n.__( 'Allow past bookings' ) },
954 { key: 'show_progress', label: wp.i18n.__( 'Show progress' ) },
955 { key: 'progress_item_1_number', label: wp.i18n.__( 'Step 1 number' ) },
956 { key: 'progress_item_1_title', label: wp.i18n.__( 'Step 1 title' ) },
957 { key: 'progress_item_2_number', label: wp.i18n.__( 'Step 2 number' ) },
958 { key: 'progress_item_2_title', label: wp.i18n.__( 'Step 2 title' ) },
959 { key: 'screen_1_title', label: wp.i18n.__( 'Resource screen title' ) },
960 { key: 'screen_1_description', label: wp.i18n.__( 'Resource screen description' ) },
961 { key: 'label', label: wp.i18n.__( 'Resource screen title (compatibility)' ) },
962 { key: 'options', label: wp.i18n.__( 'Options' ) }
963 ]
964 }
965 );
966 }
967
968
969 /**
970 * Generate Visual Preview Block of Booking form
971 *
972 * @param shortcode_obj - shortcode JavaScript obj.
973 * @returns
974 */
975 function wpbc_gt_get_visual_block_for_booking( shortcode_obj, params ){
976
977 // Booking Form Parameters // FixIn: 10.0.0.16.
978 var shortcode_defaults = {
979 type : 1,
980 resource_id : 1,
981 nummonths : 1,
982 form_type : 'standard',
983 aggregate : null,
984 startmonth: null,
985 options : null
986 };
987
988
989 var props = _.defaults( shortcode_obj.attrs.named, shortcode_defaults );
990
991 var el = wp.element.createElement;
992
993 var inner_header = el( 'div', {
994 className: 'wpbc_gb_block_preview_inner_header'
995 , key: 'header_' + params[ 'cid_key' ] // FixIn: 8.7.3.18.
996 }
997 , wpbc_gb_tpl_header( { header: wp.i18n.__( 'Booking Form' ), cid_key: 'header_' + params[ 'cid_key' ] } )
998 );
999 var inner_body = el( 'div', {
1000 className: 'wpbc_gb_block_preview_inner_body'
1001 , key: 'body_' + params[ 'cid_key' ] // FixIn: 8.7.3.18.
1002 }
1003 , wpbc_gb_tpl_shortcode_parameters( wpbc_parse_params_into_rows_arr_for_booking( props ), { cid_key: 'body_' + params[ 'cid_key' ] } )
1004 );
1005 var inner_footer = el( 'div', {
1006 className: 'wpbc_gb_block_preview_inner_footer'
1007 , key: 'footer_' + params[ 'cid_key' ] // FixIn: 8.7.3.18.
1008 }
1009 , wpbc_gb_tpl_footer( { shortcode_in_text: params[ 'shortcode_in_text' ], cid_key: 'footer_' + params[ 'cid_key' ] } )
1010 );
1011
1012
1013 return el( 'div', {
1014 className: 'wpbc_gb_block_shortcode_preview_wrapper wpbc_gb_block_preview_booking'
1015 , key: 'preview_wrapper_' + params[ 'cid_key' ] // FixIn: 8.7.3.18.
1016 }
1017 , el( 'div', {
1018 className: 'wpbc_gb_block_shortcode_preview_content'
1019 , key: 'preview_content_' + params[ 'cid_key' ] // FixIn: 8.7.3.18.
1020 }
1021 , [ inner_header, inner_body ]
1022 )
1023 , inner_footer
1024 );
1025 }
1026
1027
1028 /**
1029 * Parse parameters into array of rows objects for showing in conetnt of block
1030 *
1031 * @param props
1032 */
1033 function wpbc_parse_params_into_rows_arr_for_booking( props ){
1034 //console.log( 'WPBC::props', props, props[ 'type' ], props[ 'resource_id' ]);
1035 // Parameters Description /////////////////////////////////
1036 var rows_in_content = [];
1037 if ( (undefined != props[ 'type' ]) && ( 1 != props[ 'type' ]) ){
1038 rows_in_content.push( {name: wp.i18n.__( 'Booking resource' ), value: 'ID = ' + props[ 'type' ]} );
1039 }
1040 // FixIn: 10.0.0.16.
1041 if ( (undefined != props[ 'resource_id' ]) && ( 1 != props[ 'resource_id' ]) ){
1042 rows_in_content.push( {name: wp.i18n.__( 'Booking resource' ), value: 'ID = ' + props[ 'resource_id' ]} );
1043 }
1044 if ( undefined != props[ 'nummonths' ] ){
1045 rows_in_content.push( {name: wp.i18n.__( 'Visible months number' ), value: props[ 'nummonths' ]} );
1046 }
1047 if ( undefined != props[ 'startmonth' ] ) {
1048 rows_in_content.push( { name: wp.i18n.__( 'Start month' ), value: props[ 'startmonth' ] } );
1049 }
1050 if ( ( undefined != props[ 'form_type' ] ) && ( 'standard' != props[ 'form_type' ] ) ){
1051 rows_in_content.push( { name: wp.i18n.__( 'Custom booking form' ), value: props[ 'form_type' ] } );
1052 }
1053 if ( undefined != props[ 'aggregate' ] ) {
1054 rows_in_content.push( { name: wp.i18n.__( 'Unavailable dates from other booking resources' ), value: 'ID = ' + props[ 'aggregate' ] } );
1055 }
1056 if ( undefined != props[ 'options' ] ) {
1057 rows_in_content.push( { name: wp.i18n.__( 'Options' ), value: props[ 'options' ] } );
1058 }
1059
1060 return rows_in_content;
1061 }
1062
1063
1064 /**
1065 * Generate Visual Preview Block of Booking form
1066 *
1067 * @param shortcode_obj - shortcode JavaScript obj.
1068 * @returns
1069 */
1070 function wpbc_gt_get_visual_block_for_bookingcalendar( shortcode_obj, params ){
1071
1072 // Booking Form Parameters // FixIn: 10.0.0.16.
1073 var shortcode_defaults = {
1074 type : 1,
1075 resource_id : 1,
1076 nummonths : 1,
1077 aggregate : null,
1078 startmonth: null,
1079 options : null
1080 };
1081
1082
1083 var props = _.defaults( shortcode_obj.attrs.named, shortcode_defaults );
1084
1085 var el = wp.element.createElement;
1086
1087 var inner_header = el( 'div', {
1088 className: 'wpbc_gb_block_preview_inner_header'
1089 , key: 'header_' + params[ 'cid_key' ] // FixIn: 8.7.3.18.
1090 }
1091 , wpbc_gb_tpl_header( { header: wp.i18n.__( 'Availability Calendar' ), cid_key: 'header_' + params[ 'cid_key' ] } )
1092 );
1093 var inner_body = el( 'div', {
1094 className: 'wpbc_gb_block_preview_inner_body'
1095 , key: 'body_' + params[ 'cid_key' ] // FixIn: 8.7.3.18.
1096 }
1097 , wpbc_gb_tpl_shortcode_parameters( wpbc_parse_params_into_rows_arr_for_bookingcalendar( props ), { cid_key: 'body_' + params[ 'cid_key' ] } )
1098 );
1099 var inner_footer = el( 'div', {
1100 className: 'wpbc_gb_block_preview_inner_footer'
1101 , key: 'footer_' + params[ 'cid_key' ] // FixIn: 8.7.3.18.
1102 }
1103 , wpbc_gb_tpl_footer( { shortcode_in_text: params[ 'shortcode_in_text' ], cid_key: 'footer_' + params[ 'cid_key' ] } )
1104 );
1105
1106
1107 return el( 'div', {
1108 className: 'wpbc_gb_block_shortcode_preview_wrapper wpbc_gb_block_preview_bookingcalendar'
1109 , key: 'preview_wrapper_' + params[ 'cid_key' ] // FixIn: 8.7.3.18.
1110 }
1111
1112 , el( 'div', {
1113 className: 'wpbc_gb_block_shortcode_preview_content'
1114 , key: 'preview_content_' + params[ 'cid_key' ] // FixIn: 8.7.3.18.
1115 }
1116 , [ inner_header, inner_body ]
1117 )
1118 , inner_footer
1119 );
1120 }
1121
1122
1123 /**
1124 * Parse parameters into array of rows objects for showing in conetnt of block
1125 *
1126 * @param props
1127 */
1128 function wpbc_parse_params_into_rows_arr_for_bookingcalendar( props ){
1129
1130 // Parameters Description /////////////////////////////////
1131 var rows_in_content = [];
1132 if ( (undefined != props[ 'type' ]) && ( 1 != props[ 'type' ]) ){
1133 rows_in_content.push( {name: wp.i18n.__( 'Booking resource' ), value: 'ID = ' + props[ 'type' ]} );
1134 }
1135 // FixIn: 10.0.0.16.
1136 if ( (undefined != props[ 'resource_id' ]) && ( 1 != props[ 'resource_id' ]) ){
1137 rows_in_content.push( {name: wp.i18n.__( 'Booking resource' ), value: 'ID = ' + props[ 'resource_id' ]} );
1138 }
1139 if ( undefined != props[ 'nummonths' ] ){
1140 rows_in_content.push( {name: wp.i18n.__( 'Visible months number' ), value: props[ 'nummonths' ]} );
1141 }
1142 if ( undefined != props[ 'startmonth' ] ) {
1143 rows_in_content.push( { name: wp.i18n.__( 'Start month' ), value: props[ 'startmonth' ] } );
1144 }
1145 if ( undefined != props[ 'aggregate' ] ) {
1146 rows_in_content.push( { name: wp.i18n.__( 'Unavailable dates from other booking resources' ), value: 'ID = ' + props[ 'aggregate' ] } );
1147 }
1148 if ( undefined != props[ 'options' ] ) {
1149 rows_in_content.push( { name: wp.i18n.__( 'Options' ), value: props[ 'options' ] } );
1150 }
1151
1152 return rows_in_content;
1153 }
1154
1155
1156 /**
1157 * Generate Visual Preview Block of TimeLine
1158 *
1159 * @param shortcode_obj - shortcode JavaScript obj.
1160 * @returns
1161 */
1162 function wpbc_gt_get_visual_block_for_bookingtimeline( shortcode_obj, params ){
1163
1164 // Booking Form Parameters
1165 var shortcode_defaults = {
1166 type : 'Default', // 1,
1167 view_days_num : 30, // 30,
1168
1169 scroll_start_date : null, // '',
1170 scroll_day : null, // 0,
1171 scroll_month : null, // 0,
1172 header_title : null, // '',
1173 limit_hours : null, // '0,24'
1174 };
1175 var props = _.defaults( shortcode_obj.attrs.named, shortcode_defaults );
1176
1177 var el = wp.element.createElement;
1178
1179
1180 var inner_header = el( 'div', {
1181 className: 'wpbc_gb_block_preview_inner_header'
1182 , key: 'header_' + params[ 'cid_key' ] // FixIn: 8.7.3.18.
1183 }
1184 , wpbc_gb_tpl_header( { header: wp.i18n.__( 'Timeline' ), cid_key: 'header_' + params[ 'cid_key' ] } )
1185 );
1186 var inner_body = el( 'div', {
1187 className: 'wpbc_gb_block_preview_inner_body'
1188 , key: 'body_' + params[ 'cid_key' ] // FixIn: 8.7.3.18.
1189 }
1190 , wpbc_gb_tpl_shortcode_parameters( wpbc_parse_params_into_rows_arr_for_bookingtimeline( props ), { cid_key: 'body_' + params[ 'cid_key' ] } )
1191 );
1192 var inner_footer = el( 'div', {
1193 className: 'wpbc_gb_block_preview_inner_footer'
1194 , key: 'footer_' + params[ 'cid_key' ] // FixIn: 8.7.3.18.
1195 }
1196 , wpbc_gb_tpl_footer( { shortcode_in_text: params[ 'shortcode_in_text' ], cid_key: 'footer_' + params[ 'cid_key' ] } )
1197 );
1198
1199 return el( 'div', { className: 'wpbc_gb_block_shortcode_preview_wrapper wpbc_gb_block_preview_bookingtimeline' , key: 'preview_wrapper_' + params[ 'cid_key' ] }
1200
1201 , el( 'div', { className: 'wpbc_gb_block_shortcode_preview_content' , key: 'preview_content_' + params[ 'cid_key' ] }
1202 , [ inner_header, inner_body ]
1203 )
1204 , inner_footer
1205 );
1206 }
1207
1208
1209 /**
1210 * Parse parameters into array of rows objects for showing in conetnt of block
1211 *
1212 * @param props
1213 */
1214 function wpbc_parse_params_into_rows_arr_for_bookingtimeline( props ){
1215
1216 // Parameters Description /////////////////////////////////
1217 var rows_in_content = [];
1218 if ( undefined != props[ 'type' ] ){
1219 rows_in_content.push( {name: wp.i18n.__( 'Booking resource(s)' ), value: 'ID = ' + props[ 'type' ]} );
1220 }
1221 if ( undefined != props[ 'view_days_num' ] ){
1222
1223 if ( '1' == props[ 'view_days_num' ] ) {
1224 props[ 'view_days_num' ] = 'Day';
1225 }
1226 if ( '7' == props[ 'view_days_num' ] ) {
1227 props[ 'view_days_num' ] = 'Week';
1228 }
1229 if ( '30' == props[ 'view_days_num' ] ) {
1230 props[ 'view_days_num' ] = 'Month';
1231 }
1232 if ( '60' == props[ 'view_days_num' ] ) {
1233 props[ 'view_days_num' ] = '2 Months';
1234 }
1235 if ( '90' == props[ 'view_days_num' ] ) {
1236 props[ 'view_days_num' ] = '3 Months';
1237 }
1238 if ( '365' == props[ 'view_days_num' ] ){
1239 props[ 'view_days_num' ] = 'Year';
1240 }
1241 rows_in_content.push( {name: wp.i18n.__( 'View mode' ), value: props[ 'view_days_num' ]} );
1242 }
1243 if ( undefined != props[ 'header_title' ] ) {
1244 rows_in_content.push( { name: wp.i18n.__( 'Title' ), value: props[ 'header_title' ] } );
1245 }
1246 if ( undefined != props[ 'scroll_day' ] ) {
1247 rows_in_content.push( { name: wp.i18n.__( 'Number of days to scroll' ), value: props[ 'scroll_day' ] } );
1248 }
1249 if ( undefined != props[ 'scroll_month' ] ) {
1250 rows_in_content.push( { name: wp.i18n.__( 'Number of months to scroll' ), value: props[ 'scroll_month' ] } );
1251 }
1252 if ( undefined != props[ 'scroll_start_date' ] ) {
1253 rows_in_content.push( { name: wp.i18n.__( 'Start Date' ), value: props[ 'scroll_start_date' ] } );
1254 }
1255 if ( undefined != props[ 'limit_hours' ] ) {
1256 rows_in_content.push( { name: wp.i18n.__( 'Show from/to' ), value: props[ 'limit_hours' ] } );
1257 }
1258
1259 return rows_in_content;
1260 }
1261
1262
1263 /**
1264 * Generate Visual Preview Block of Booking form
1265 *
1266 * @param shortcode_obj - shortcode JavaScript obj.
1267 * @returns
1268 */
1269 function wpbc_gt_get_visual_block_for_bookingselect( shortcode_obj, params ){
1270
1271 // Booking Form Parameters
1272 var shortcode_defaults = {
1273 type : wp.i18n.__( 'All booking resources' ),
1274 nummonths : 1,
1275 form_type : null, // : 'standard',
1276 selected_type : null, // : '',
1277 label : null, // : '',
1278 first_option_title: wp.i18n.__( 'Please Select' ),
1279 startmonth : null,
1280 options : null
1281 };
1282
1283
1284 var props = _.defaults( shortcode_obj.attrs.named, shortcode_defaults );
1285
1286 var el = wp.element.createElement;
1287
1288 //FixIn: 8.7.3.18 Start
1289 var inner_header = el( 'div', {className: 'wpbc_gb_block_preview_inner_header', key: 'header_' + params[ 'cid_key' ]}
1290 , wpbc_gb_tpl_header( { header: wp.i18n.__( 'Selection of Resources' ), cid_key: 'header_' + params[ 'cid_key' ] } )
1291 );
1292 var inner_body = el( 'div', {className: 'wpbc_gb_block_preview_inner_body', key: 'body_' + params[ 'cid_key' ] }
1293 , wpbc_gb_tpl_shortcode_parameters( wpbc_parse_params_into_rows_arr_for_bookingselect( props ), { cid_key: 'body_' + params[ 'cid_key' ] } )
1294 );
1295 var inner_footer = el( 'div', {className: 'wpbc_gb_block_preview_inner_footer' , key: 'footer_' + params[ 'cid_key' ] }
1296 , wpbc_gb_tpl_footer( { shortcode_in_text: params[ 'shortcode_in_text' ], cid_key: 'footer_' + params[ 'cid_key' ] } )
1297 );
1298
1299 return el( 'div', { className: 'wpbc_gb_block_shortcode_preview_wrapper wpbc_gb_block_preview_bookingselect' , key: 'preview_wrapper_' + params[ 'cid_key' ] }
1300
1301 , el( 'div', { className: 'wpbc_gb_block_shortcode_preview_content' , key: 'preview_content_' + params[ 'cid_key' ] }
1302 , [ inner_header, inner_body ]
1303 )
1304 , inner_footer
1305 );
1306 //FixIn: 8.7.3.18 End
1307
1308 }
1309
1310
1311 /**
1312 * Parse parameters into array of rows objects for showing in conetnt of block
1313 *
1314 * @param props
1315 */
1316 function wpbc_parse_params_into_rows_arr_for_bookingselect( props ){
1317
1318 // Parameters Description /////////////////////////////////
1319 var rows_in_content = [];
1320 if ( undefined != props[ 'type' ] ){
1321 rows_in_content.push( {name: wp.i18n.__( 'Booking resource(s)' ), value: props[ 'type' ]} );
1322 }
1323 if ( undefined != props[ 'label' ] ) {
1324 rows_in_content.push( { name: wp.i18n.__( 'Label' ), value: props[ 'label' ] } );
1325 }
1326 if ( undefined != props[ 'selected_type' ] ) {
1327 rows_in_content.push( { name: wp.i18n.__( 'Selected booking resource (by default)' ), value: 'ID = ' + props[ 'selected_type' ] } );
1328 }
1329 if ( undefined != props[ 'first_option_title' ] ) {
1330 rows_in_content.push( { name: wp.i18n.__( 'Title of first option in list' ), value: props[ 'first_option_title' ] } );
1331 }
1332 if ( undefined != props[ 'nummonths' ] ){
1333 rows_in_content.push( {name: wp.i18n.__( 'Visible months number' ), value: props[ 'nummonths' ]} );
1334 }
1335 if ( undefined != props[ 'startmonth' ] ) {
1336 rows_in_content.push( { name: wp.i18n.__( 'Start month' ), value: props[ 'startmonth' ] } );
1337 }
1338 if ( ( undefined != props[ 'form_type' ] ) && ( 'standard' != props[ 'form_type' ] ) ){
1339 rows_in_content.push( { name: wp.i18n.__( 'Custom booking form for all booking resources' ), value: props[ 'form_type' ] } );
1340 }
1341 if ( undefined != props[ 'aggregate' ] ) {
1342 rows_in_content.push( { name: wp.i18n.__( 'Unavailable dates from other booking resources' ), value: 'ID = ' + props[ 'aggregate' ] } );
1343 }
1344 if ( undefined != props[ 'options' ] ) {
1345 rows_in_content.push( { name: wp.i18n.__( 'Options' ), value: props[ 'options' ] } );
1346 }
1347
1348 return rows_in_content;
1349 }
1350
1351
1352 /**
1353 * Generate Visual Preview Block of Booking form
1354 *
1355 * @param shortcode_obj - shortcode JavaScript obj.
1356 * @returns
1357 */
1358 function wpbc_gt_get_visual_block_for_bookingform( shortcode_obj, params ){
1359
1360 // Booking Form Parameters // FixIn: 10.0.0.16.
1361 var shortcode_defaults = {
1362 type : 1,
1363 resource_id : 1,
1364 selected_dates : null,
1365 form_type : 'standard'
1366 };
1367
1368
1369 var props = _.defaults( shortcode_obj.attrs.named, shortcode_defaults );
1370
1371 var el = wp.element.createElement;
1372
1373 //FixIn: 8.7.3.18 Start
1374 var inner_header = el( 'div', {className: 'wpbc_gb_block_preview_inner_header', key: 'header_' + params[ 'cid_key' ]}
1375 , wpbc_gb_tpl_header( { header: wp.i18n.__( 'Booking Form (without calendar)' ), cid_key: 'header_' + params[ 'cid_key' ] } )
1376 );
1377 var inner_body = el( 'div', {className: 'wpbc_gb_block_preview_inner_body', key: 'body_' + params[ 'cid_key' ] }
1378 , wpbc_gb_tpl_shortcode_parameters( wpbc_parse_params_into_rows_arr_for_bookingform( props ), { cid_key: 'body_' + params[ 'cid_key' ] } )
1379 );
1380 var inner_footer = el( 'div', {className: 'wpbc_gb_block_preview_inner_footer' , key: 'footer_' + params[ 'cid_key' ] }
1381 , wpbc_gb_tpl_footer( { shortcode_in_text: params[ 'shortcode_in_text' ], cid_key: 'footer_' + params[ 'cid_key' ] } )
1382 );
1383
1384 return el( 'div', { className: 'wpbc_gb_block_shortcode_preview_wrapper wpbc_gb_block_preview_bookingform' , key: 'preview_wrapper_' + params[ 'cid_key' ] }
1385
1386 , el( 'div', { className: 'wpbc_gb_block_shortcode_preview_content' , key: 'preview_content_' + params[ 'cid_key' ] }
1387 , [ inner_header, inner_body ]
1388 )
1389 , inner_footer
1390 );
1391 //FixIn: 8.7.3.18 End
1392 }
1393
1394
1395 /**
1396 * Parse parameters into array of rows objects for showing in conetnt of block
1397 *
1398 * @param props
1399 */
1400 function wpbc_parse_params_into_rows_arr_for_bookingform( props ){
1401
1402 // Parameters Description /////////////////////////////////
1403 var rows_in_content = [];
1404 if ( (undefined != props[ 'type' ]) && ( 1 != props[ 'type' ]) ){
1405 rows_in_content.push( {name: wp.i18n.__( 'Booking resource' ), value: 'ID = ' + props[ 'type' ]} );
1406 }
1407 // FixIn: 10.0.0.16.
1408 if ( (undefined != props[ 'resource_id' ]) && ( 1 != props[ 'resource_id' ]) ){
1409 rows_in_content.push( {name: wp.i18n.__( 'Booking resource' ), value: 'ID = ' + props[ 'resource_id' ]} );
1410 }
1411
1412 if ( undefined != props[ 'selected_dates' ] ){
1413 rows_in_content.push( {name: wp.i18n.__( 'Date for submit booking' ), value: props[ 'selected_dates' ]} );
1414 }
1415 if ( ( undefined != props[ 'form_type' ] ) && ( 'standard' != props[ 'form_type' ] ) ){
1416 rows_in_content.push( { name: wp.i18n.__( 'Custom booking form' ), value: props[ 'form_type' ] } );
1417 }
1418
1419 return rows_in_content;
1420 }
1421
1422
1423 /**
1424 * Generate Visual Preview Block of Search Availability Form
1425 *
1426 * @param shortcode_obj - shortcode JavaScript obj.
1427 * @returns
1428 */
1429 function wpbc_gt_get_visual_block_for_bookingsearch( shortcode_obj, params ){
1430
1431 // Booking Form Parameters
1432 var shortcode_defaults = {
1433 searchresultstitle : '', // searchresultstitle='{searchresults} Result(s) Found'
1434 noresultstitle : '', // noresultstitle='Nothing Found'
1435 users : null, // users='3,55'
1436 searchresults : null // searchresults='http://test.com/search-results'
1437 };
1438
1439 var props = _.defaults( shortcode_obj.attrs.named, shortcode_defaults );
1440
1441 var el = wp.element.createElement;
1442
1443 //FixIn: 8.7.3.18 Start
1444 var inner_header = el( 'div', {className: 'wpbc_gb_block_preview_inner_header', key: 'header_' + params[ 'cid_key' ]}
1445 , wpbc_gb_tpl_header( { header: wp.i18n.__( 'Search Availability form' ), cid_key: 'header_' + params[ 'cid_key' ] } )
1446 );
1447 var inner_body = el( 'div', {className: 'wpbc_gb_block_preview_inner_body', key: 'body_' + params[ 'cid_key' ] }
1448 , wpbc_gb_tpl_shortcode_parameters( wpbc_parse_params_into_rows_arr_for_bookingsearch( props ), { cid_key: 'body_' + params[ 'cid_key' ] } )
1449 );
1450 var inner_footer = el( 'div', {className: 'wpbc_gb_block_preview_inner_footer' , key: 'footer_' + params[ 'cid_key' ] }
1451 , wpbc_gb_tpl_footer( { shortcode_in_text: params[ 'shortcode_in_text' ], cid_key: 'footer_' + params[ 'cid_key' ] } )
1452 );
1453
1454 return el( 'div', { className: 'wpbc_gb_block_shortcode_preview_wrapper wpbc_gb_block_preview_bookingsearch' , key: 'preview_wrapper_' + params[ 'cid_key' ] }
1455
1456 , el( 'div', { className: 'wpbc_gb_block_shortcode_preview_content' , key: 'preview_content_' + params[ 'cid_key' ] }
1457 , [ inner_header, inner_body ]
1458 )
1459 , inner_footer
1460 );
1461 //FixIn: 8.7.3.18 End
1462
1463 }
1464
1465
1466 /**
1467 * Parse parameters into array of rows objects for showing in conetnt of block
1468 *
1469 * @param props
1470 */
1471 function wpbc_parse_params_into_rows_arr_for_bookingsearch( props ){
1472
1473 // Parameters Description /////////////////////////////////
1474 var rows_in_content = [];
1475 if ( undefined != props[ 'searchresults' ] ){
1476 rows_in_content.push( { name: wp.i18n.__( 'Show search results on other page' )
1477 , value: wp.element.createElement( 'a', { href: props[ 'searchresults' ] }, props[ 'searchresults' ] )
1478 } );
1479 rows_in_content.push( {name: wp.i18n.__( 'Note' ), value: wp.i18n.__( 'Search results page must have this shortcode' ) + ' [bookingsearchresults]' } );
1480 rows_in_content.push( { block_text: '---' } );
1481 } else {
1482 rows_in_content.push( { block_text: wp.i18n.__( 'Show search results in the same page' ) } );
1483 }
1484 if ( undefined != props[ 'searchresultstitle' ] ){
1485 //rows_in_content.push( {name: wp.i18n.__( 'Search Results Title' ), value: props[ 'searchresultstitle' ]} );
1486 }
1487 if ( undefined != props[ 'noresultstitle' ] ){
1488 //rows_in_content.push( {name: wp.i18n.__( 'Title, if no search results' ), value: props[ 'noresultstitle' ]} );
1489 }
1490 if ( undefined != props[ 'users' ] ){
1491 rows_in_content.push( {name: wp.i18n.__( 'Search in booking resources of WP users' ), value: 'ID = ' + props[ 'users' ]} );
1492 }
1493
1494 return rows_in_content;
1495 }
1496
1497
1498 /**
1499 * Generate Visual Preview Block of Search Results
1500 *
1501 * @param shortcode_obj - shortcode JavaScript obj.
1502 * @returns
1503 */
1504 function wpbc_gt_get_visual_block_for_bookingsearchresults( shortcode_obj, params ){
1505
1506 // Booking Form Parameters
1507 var shortcode_defaults = {
1508 };
1509
1510 var props = _.defaults( shortcode_obj.attrs.named, shortcode_defaults );
1511
1512 var el = wp.element.createElement;
1513
1514 //FixIn: 8.7.3.18 Start
1515 var inner_header = el( 'div', {className: 'wpbc_gb_block_preview_inner_header', key: 'header_' + params[ 'cid_key' ]}
1516 , wpbc_gb_tpl_header( { header: wp.i18n.__( 'Search Results' ), cid_key: 'header_' + params[ 'cid_key' ] } )
1517 );
1518 var inner_body = el( 'div', {className: 'wpbc_gb_block_preview_inner_body', key: 'body_' + params[ 'cid_key' ] }
1519 , wpbc_gb_tpl_shortcode_parameters( wpbc_parse_params_into_rows_arr_for_bookingsearchresults( props ), { cid_key: 'body_' + params[ 'cid_key' ] } )
1520 );
1521 var inner_footer = el( 'div', {className: 'wpbc_gb_block_preview_inner_footer' , key: 'footer_' + params[ 'cid_key' ] }
1522 , wpbc_gb_tpl_footer( { shortcode_in_text: params[ 'shortcode_in_text' ], cid_key: 'footer_' + params[ 'cid_key' ] } )
1523 );
1524
1525 return el( 'div', { className: 'wpbc_gb_block_shortcode_preview_wrapper wpbc_gb_block_preview_bookingsearch' , key: 'preview_wrapper_' + params[ 'cid_key' ] }
1526
1527 , el( 'div', { className: 'wpbc_gb_block_shortcode_preview_content' , key: 'preview_content_' + params[ 'cid_key' ] }
1528 , [ inner_header, inner_body ]
1529 )
1530 , inner_footer
1531 );
1532 //FixIn: 8.7.3.18 End
1533 }
1534
1535
1536 /**
1537 * Parse parameters into array of rows objects for showing in conetnt of block
1538 *
1539 * @param props
1540 */
1541 function wpbc_parse_params_into_rows_arr_for_bookingsearchresults( props ){
1542
1543 // Parameters Description /////////////////////////////////
1544 var rows_in_content = [];
1545 rows_in_content.push( { block_text: wp.i18n.__( 'Show search results on this page, after redirection from search form at other page.' ) } );
1546
1547 return rows_in_content;
1548 }
1549
1550
1551 /**
1552 * Generate Visual Preview Block of Booking Confirm - system shortcode
1553 *
1554 * @param shortcode_obj - shortcode JavaScript obj.
1555 * @returns
1556 */
1557 function wpbc_gt_get_visual_block_for_booking_confirm( shortcode_obj, params ){
1558
1559 // Booking Form Parameters
1560 var shortcode_defaults = {
1561 };
1562
1563 var props = _.defaults( shortcode_obj.attrs.named, shortcode_defaults );
1564
1565 var el = wp.element.createElement;
1566
1567 //FixIn: 8.7.3.18 Start
1568 var inner_header = el( 'div', {className: 'wpbc_gb_block_preview_inner_header', key: 'header_' + params[ 'cid_key' ]}
1569 , wpbc_gb_tpl_header( { header: 'WP Booking Calendar - ' + wp.i18n.__( 'System Block' ) , cid_key: 'header_' + params[ 'cid_key' ] } )
1570 );
1571 var inner_body = el( 'div', {className: 'wpbc_gb_block_preview_inner_body', key: 'body_' + params[ 'cid_key' ] }
1572 , wpbc_gb_tpl_shortcode_parameters( wpbc_parse_params_into_rows_arr_for_booking_confirm( props ,'body_' + params[ 'cid_key' ] ), { cid_key: 'body_' + params[ 'cid_key' ] } )
1573 );
1574 var inner_footer = el( 'div', {className: 'wpbc_gb_block_preview_inner_footer' , key: 'footer_' + params[ 'cid_key' ] }
1575 , wpbc_gb_tpl_footer( { shortcode_in_text: params[ 'shortcode_in_text' ], cid_key: 'footer_' + params[ 'cid_key' ] } )
1576 );
1577
1578 return el( 'div', { className: 'wpbc_gb_block_shortcode_preview_wrapper wpbc_gb_block_preview_booking_confirm' , key: 'preview_wrapper_' + params[ 'cid_key' ] }
1579
1580 , el( 'div', { className: 'wpbc_gb_block_shortcode_preview_content' , key: 'preview_content_' + params[ 'cid_key' ] }
1581 , [ inner_header, inner_body ]
1582 )
1583 , inner_footer
1584 );
1585 //FixIn: 8.7.3.18 End
1586 }
1587
1588
1589 /**
1590 * Generate Visual Preview Block of "Booking Manager" == Import ==
1591 *
1592 * @param shortcode_obj - shortcode JavaScript obj.
1593 * @returns
1594 */
1595 function wpbc_gt_get_visual_block_for_booking_manager_import( shortcode_obj, params ){
1596
1597 // Booking Form Parameters
1598 var shortcode_defaults = {};
1599
1600 var props = _.defaults( shortcode_obj.attrs.named, shortcode_defaults );
1601
1602 var el = wp.element.createElement;
1603
1604 var inner_header = el( 'div', {className: 'wpbc_gb_block_preview_inner_header', key: 'header_' + params[ 'cid_key' ]}
1605 , wpbc_gb_tpl_header( { header: 'Booking Manager - ' + wp.i18n.__( 'Import Events from .ics feed into WP Booking Calendar - Block' ) , cid_key: 'header_' + params[ 'cid_key' ] } )
1606 );
1607 var inner_body = el( 'div', {className: 'wpbc_gb_block_preview_inner_body', key: 'body_' + params[ 'cid_key' ] }
1608 , wpbc_gb_tpl_shortcode_parameters(
1609 [
1610 { block_text: wp.i18n.__( 'This shortcode [ booking-manager-import ] is used for import bookings from .ics feed URL into the WP Booking Calendar plugin' ) }
1611 ]
1612 , { cid_key: 'body_' + params[ 'cid_key' ] }
1613 )
1614 );
1615 var inner_footer = el( 'div', {className: 'wpbc_gb_block_preview_inner_footer' , key: 'footer_' + params[ 'cid_key' ] }
1616 , wpbc_gb_tpl_footer( { shortcode_in_text: params[ 'shortcode_in_text' ], cid_key: 'footer_' + params[ 'cid_key' ] } )
1617 );
1618
1619 return el( 'div', { className: 'wpbc_gb_block_shortcode_preview_wrapper wpbc_gb_block_preview_booking_import' , key: 'preview_wrapper_' + params[ 'cid_key' ] }
1620
1621 , el( 'div', { className: 'wpbc_gb_block_shortcode_preview_content' , key: 'preview_content_' + params[ 'cid_key' ] }
1622 , [ inner_header, inner_body ]
1623 )
1624 , inner_footer
1625 );
1626 }
1627
1628
1629 /**
1630 * Generate Visual Preview Block of "Booking Manager" == Import ==
1631 *
1632 * @param shortcode_obj - shortcode JavaScript obj.
1633 * @returns
1634 */
1635 function wpbc_gt_get_visual_block_for_booking_manager_listing( shortcode_obj, params ){
1636
1637 // Booking Form Parameters
1638 var shortcode_defaults = {};
1639
1640 var props = _.defaults( shortcode_obj.attrs.named, shortcode_defaults );
1641
1642 var el = wp.element.createElement;
1643
1644 var inner_header = el( 'div', {className: 'wpbc_gb_block_preview_inner_header', key: 'header_' + params[ 'cid_key' ]}
1645 , wpbc_gb_tpl_header( { header: 'Booking Manager - ' + wp.i18n.__( 'Show Events Listing from .ics feed - Block' ) , cid_key: 'header_' + params[ 'cid_key' ] } )
1646 );
1647 var inner_body = el( 'div', {className: 'wpbc_gb_block_preview_inner_body', key: 'body_' + params[ 'cid_key' ] }
1648 , wpbc_gb_tpl_shortcode_parameters(
1649 [
1650 { block_text: wp.i18n.__( 'This shortcode [ booking-manager-listing ] used for show events listing from .ics feed URL.' ) }
1651 ]
1652 , { cid_key: 'body_' + params[ 'cid_key' ] }
1653 )
1654 );
1655 var inner_footer = el( 'div', {className: 'wpbc_gb_block_preview_inner_footer' , key: 'footer_' + params[ 'cid_key' ] }
1656 , wpbc_gb_tpl_footer( { shortcode_in_text: params[ 'shortcode_in_text' ], cid_key: 'footer_' + params[ 'cid_key' ] } )
1657 );
1658
1659 return el( 'div', { className: 'wpbc_gb_block_shortcode_preview_wrapper wpbc_gb_block_preview_booking_import' , key: 'preview_wrapper_' + params[ 'cid_key' ] }
1660
1661 , el( 'div', { className: 'wpbc_gb_block_shortcode_preview_content' , key: 'preview_content_' + params[ 'cid_key' ] }
1662 , [ inner_header, inner_body ]
1663 )
1664 , inner_footer
1665 );
1666 }
1667
1668
1669 /**
1670 * Generate Visual Preview Block of Booking Edit - system shortcode
1671 *
1672 * @param shortcode_obj - shortcode JavaScript obj.
1673 * @returns
1674 */
1675 function wpbc_gt_get_visual_block_for_bookingedit( shortcode_obj, params ){
1676
1677 // Booking Form Parameters
1678 var shortcode_defaults = {
1679 };
1680
1681 var props = _.defaults( shortcode_obj.attrs.named, shortcode_defaults );
1682
1683 var el = wp.element.createElement;
1684
1685 //FixIn: 8.7.3.18 Start
1686 var inner_header = el( 'div', {className: 'wpbc_gb_block_preview_inner_header', key: 'header_' + params[ 'cid_key' ]}
1687 , wpbc_gb_tpl_header( { header: wp.i18n.__( 'System Block' ) + ' (' + wp.i18n.__( 'Booking Calendar Editing' ) + ')', cid_key: 'header_' + params[ 'cid_key' ] } )
1688 );
1689 var inner_body = el( 'div', {className: 'wpbc_gb_block_preview_inner_body', key: 'body_' + params[ 'cid_key' ] }
1690 , wpbc_gb_tpl_shortcode_parameters( wpbc_parse_params_into_rows_arr_for_bookingedit( props ,'body_' + params[ 'cid_key' ] ), { cid_key: 'body_' + params[ 'cid_key' ] } )
1691 );
1692 var inner_footer = el( 'div', {className: 'wpbc_gb_block_preview_inner_footer' , key: 'footer_' + params[ 'cid_key' ] }
1693 , wpbc_gb_tpl_footer( { shortcode_in_text: params[ 'shortcode_in_text' ], cid_key: 'footer_' + params[ 'cid_key' ] } )
1694 );
1695
1696 return el( 'div', { className: 'wpbc_gb_block_shortcode_preview_wrapper wpbc_gb_block_preview_bookingedit' , key: 'preview_wrapper_' + params[ 'cid_key' ] }
1697
1698 , el( 'div', { className: 'wpbc_gb_block_shortcode_preview_content' , key: 'preview_content_' + params[ 'cid_key' ] }
1699 , [ inner_header, inner_body ]
1700 )
1701 , inner_footer
1702 );
1703 //FixIn: 8.7.3.18 End
1704 }
1705
1706
1707 /**
1708 * Parse parameters into array of rows objects for showing in conetnt of block
1709 *
1710 * @param props
1711 */
1712 function wpbc_parse_params_into_rows_arr_for_booking_confirm( props , cid_key){
1713
1714 // Parameters Description /////////////////////////////////
1715 var rows_in_content = [];
1716 rows_in_content.push( { block_text: wp.i18n.__( 'This shortcode [booking_confirm] is used on a confirmation booking page to display booking details and confirmation after a successful booking.' ) } );
1717
1718 return rows_in_content;
1719 }
1720
1721
1722 /**
1723 * Parse parameters into array of rows objects for showing in conetnt of block
1724 *
1725 * @param props
1726 */
1727 function wpbc_parse_params_into_rows_arr_for_bookingedit( props, cid_key ){
1728
1729 var el = wp.element.createElement;
1730
1731 // Parameters Description /////////////////////////////////
1732 var rows_in_content = [];
1733 rows_in_content.push( { block_text: wp.i18n.__( 'This block required for ability to edit, cancel the booking by visitor, who made the booking, or for ability to show payment form, after sending payment request.' ) } );
1734
1735 rows_in_content.push( { block_text:
1736
1737 el( 'div', { key: 'wpbc_be1_' + cid_key }
1738 , el( 'span', { key: 'wpbc_be2_' + cid_key }, wp.i18n.__( 'Link to this page must be defined' ) )
1739 , ' '
1740 , el( 'a', { href: 'admin.php?page=wpbc-settings#wpbc_general_settings_advanced_metabox', key: 'wpbc_be3_' + cid_key }, 'on this page' )
1741 , ', '
1742 , el( 'span', { key: 'wpbc_be4_' + cid_key }, wp.i18n.__( 'at this option' ) )
1743 , ': "'
1744 , el( 'strong', { key: 'wpbc_be5_' + cid_key }, wp.i18n.__( 'URL to edit bookings' ) )
1745 , '".'
1746 )
1747 } );
1748 rows_in_content.push( { block_text:
1749 el( 'div', { style: { marginTop: '20px' }, key: 'wpbc_be6_' + cid_key }
1750 , el( 'strong', { key: 'wpbc_be7_' + cid_key }, wp.i18n.__( 'Important!' ) )
1751 , ' '
1752 , el( 'span', { key: 'wpbc_be8_' + cid_key }, wp.i18n.__( 'You can not open this page directly. Please, use links in ' ) )
1753 , ' '
1754 , el( 'a', { href: 'admin.php?page=wpbc-settings&tab=email' , key: 'wpbc_be9_' + cid_key }, 'email' )
1755 , '.'
1756 )
1757 } );
1758 rows_in_content.push( { block_text:
1759 el( 'div', { key: 'wpbc_be10_' + cid_key }
1760 , el( 'span', { key: 'wpbc_be11_' + cid_key }, wp.i18n.__( 'If you open this page directly, then you will see this error' ) )
1761 , ': "'
1762 , el( 'strong', { key: 'wpbc_be12_' + cid_key }, wp.i18n.__( 'You do not set any parameters for booking editing' ) )
1763 , '".'
1764 )
1765 } );
1766 return rows_in_content;
1767 }
1768
1769
1770 /**
1771 * Generate Visual Preview Block of Customer Bookings Listing - system shortcode
1772 *
1773 * @param shortcode_obj - shortcode JavaScript obj.
1774 * @returns
1775 */
1776 function wpbc_gt_get_visual_block_for_bookingcustomerlisting( shortcode_obj, params ){
1777
1778 // Booking Form Parameters
1779 var shortcode_defaults = {
1780 };
1781
1782 var props = _.defaults( shortcode_obj.attrs.named, shortcode_defaults );
1783
1784 var el = wp.element.createElement;
1785
1786 //FixIn: 8.7.3.18 Start
1787 var inner_header = el( 'div', {className: 'wpbc_gb_block_preview_inner_header', key: 'header_' + params[ 'cid_key' ]}
1788 , wpbc_gb_tpl_header( { header: wp.i18n.__( 'Customer Bookings Listing' ), cid_key: 'header_' + params[ 'cid_key' ] } )
1789 );
1790 var inner_body = el( 'div', {className: 'wpbc_gb_block_preview_inner_body', key: 'body_' + params[ 'cid_key' ] }
1791 , wpbc_gb_tpl_shortcode_parameters( wpbc_parse_params_into_rows_arr_for_bookingcustomerlisting( props, 'body_' + params[ 'cid_key' ] ), { cid_key: 'body_' + params[ 'cid_key' ] } )
1792 );
1793 var inner_footer = el( 'div', {className: 'wpbc_gb_block_preview_inner_footer' , key: 'footer_' + params[ 'cid_key' ] }
1794 , wpbc_gb_tpl_footer( { shortcode_in_text: params[ 'shortcode_in_text' ], cid_key: 'footer_' + params[ 'cid_key' ] } )
1795 );
1796
1797 return el( 'div', { className: 'wpbc_gb_block_shortcode_preview_wrapper wpbc_gb_block_preview_bookingcustomerlisting' , key: 'preview_wrapper_' + params[ 'cid_key' ] }
1798
1799 , el( 'div', { className: 'wpbc_gb_block_shortcode_preview_content' , key: 'preview_content_' + params[ 'cid_key' ] }
1800 , [ inner_header, inner_body ]
1801 )
1802 , inner_footer
1803 );
1804 //FixIn: 8.7.3.18 End
1805 }
1806
1807
1808 /**
1809 * Parse parameters into array of rows objects for showing in conetnt of block
1810 *
1811 * @param props
1812 */
1813 function wpbc_parse_params_into_rows_arr_for_bookingcustomerlisting( props, cid_key ){
1814
1815 var el = wp.element.createElement;
1816
1817 // Parameters Description /////////////////////////////////
1818 var rows_in_content = [];
1819 rows_in_content.push( { block_text: wp.i18n.__( 'Visitors of your website, can view previous (own) bookings, by clicking on secret link in email, which is sending after booking created.' ) } );
1820
1821 rows_in_content.push( { block_text:
1822
1823 el( 'div', { key: 'wpbc_bcl1_' + cid_key }
1824 , el( 'span', { key: 'wpbc_bcl2_' + cid_key }, wp.i18n.__( 'Link to this page must be defined' ) )
1825 , ' '
1826 , el( 'a', { href: 'admin.php?page=wpbc-settings#wpbc_general_settings_advanced_metabox' , key: 'wpbc_bcl2_2_' + cid_key }, 'on this page' )
1827 , ', '
1828 , el( 'span', { key: 'wpbc_bcl3_' + cid_key }, wp.i18n.__( 'at this option' ) )
1829 , ': "'
1830 , el( 'strong', { key: 'wpbc_bcl4_' + cid_key }, wp.i18n.__( 'URL of page for customer bookings listing' ) )
1831 , '".'
1832 )
1833 } );
1834 rows_in_content.push( { block_text:
1835 el( 'div', { style: { marginTop: '20px' }, key: 'wpbc_bcl5_' + cid_key }
1836 , el( 'strong', { key: 'wpbc_bcl6_' + cid_key }, wp.i18n.__( 'Important!' ) )
1837 , ' '
1838 , el( 'span', { key: 'wpbc_bcl7_' + cid_key }, wp.i18n.__( 'You can not open this page directly. Please, use links in ' ) )
1839 , ' '
1840 , el( 'a', { href: 'admin.php?page=wpbc-settings&tab=email' , key: 'wpbc_bcl8_' + cid_key }, 'email' )
1841 , '.'
1842 )
1843 } );
1844 rows_in_content.push( { block_text:
1845 el( 'div', { key: 'wpbc_bcl9_' + cid_key }
1846 , el( 'span', { key: 'wpbc_bcl10_' + cid_key }, wp.i18n.__( 'If you open this page directly, then you will see this error' ) )
1847 , ': "'
1848 , el( 'strong', { key: 'wpbc_bcl11_' + cid_key }, wp.i18n.__( 'You do not set any parameters for booking editing' ) )
1849 , '".'
1850 )
1851 } );
1852 return rows_in_content;
1853 }
1854
1855
1856
1857
1858 /**
1859 * Generate Visual Preview Block of Showing booking resource Info
1860 *
1861 * @param shortcode_obj - shortcode JavaScript obj.
1862 * @returns
1863 */
1864 function wpbc_gt_get_visual_block_for_bookingresource( shortcode_obj, params ){
1865
1866 // Booking Form Parameters // FixIn: 10.0.0.16.
1867 var shortcode_defaults = {
1868 type : 1,
1869 resource_id : 1,
1870 show : 'title'
1871 };
1872
1873
1874 var props = _.defaults( shortcode_obj.attrs.named, shortcode_defaults );
1875
1876 var el = wp.element.createElement;
1877
1878 //FixIn: 8.7.3.18 Start
1879 var inner_header = el( 'div', {className: 'wpbc_gb_block_preview_inner_header', key: 'header_' + params[ 'cid_key' ]}
1880 , wpbc_gb_tpl_header( { header: wp.i18n.__( 'Show Info of Booking Resource' ), cid_key: 'header_' + params[ 'cid_key' ] } )
1881 );
1882 var inner_body = el( 'div', {className: 'wpbc_gb_block_preview_inner_body', key: 'body_' + params[ 'cid_key' ] }
1883 , wpbc_gb_tpl_shortcode_parameters( wpbc_parse_params_into_rows_arr_for_bookingresource( props ), { cid_key: 'body_' + params[ 'cid_key' ] } )
1884 );
1885 var inner_footer = el( 'div', {className: 'wpbc_gb_block_preview_inner_footer' , key: 'footer_' + params[ 'cid_key' ] }
1886 , wpbc_gb_tpl_footer( { shortcode_in_text: params[ 'shortcode_in_text' ], cid_key: 'footer_' + params[ 'cid_key' ] } )
1887 );
1888
1889 return el( 'div', { className: 'wpbc_gb_block_shortcode_preview_wrapper wpbc_gb_block_preview_bookingresource' , key: 'preview_wrapper_' + params[ 'cid_key' ] }
1890
1891 , el( 'div', { className: 'wpbc_gb_block_shortcode_preview_content' , key: 'preview_content_' + params[ 'cid_key' ] }
1892 , [ inner_header, inner_body ]
1893 )
1894 , inner_footer
1895 );
1896 //FixIn: 8.7.3.18 End
1897 }
1898
1899
1900 /**
1901 * Parse parameters into array of rows objects for showing in content of block
1902 *
1903 * @param props
1904 */
1905 function wpbc_parse_params_into_rows_arr_for_bookingresource( props ){
1906
1907 // Parameters Description /////////////////////////////////
1908 var rows_in_content = [];
1909 if ( (undefined != props[ 'type' ]) && ( 1 != props[ 'type' ]) ){
1910 rows_in_content.push( {name: wp.i18n.__( 'Booking resource' ), value: 'ID = ' + props[ 'type' ]} );
1911 }
1912 // FixIn: 10.0.0.16.
1913 if ( (undefined != props[ 'resource_id' ]) && ( 1 != props[ 'resource_id' ]) ){
1914 rows_in_content.push( {name: wp.i18n.__( 'Booking resource' ), value: 'ID = ' + props[ 'resource_id' ]} );
1915 }
1916
1917 if ( undefined != props[ 'show' ] ) {
1918 rows_in_content.push( { name: wp.i18n.__( 'Show' ), value: props[ 'show' ] } );
1919 /*
1920 if ( 'title' == props[ 'show' ] ) {
1921 rows_in_content.push( { name: wp.i18n.__( 'Show' ), value: props[ 'show' ] } );
1922 }
1923 if ( 'cost' == props[ 'show' ] ) {
1924 rows_in_content.push( { name: wp.i18n.__( 'Show' ), value: props[ 'show' ] } );
1925 }
1926 if ( 'capacity' == props[ 'show' ] ) {
1927 rows_in_content.push( { name: wp.i18n.__( 'Show' ), value: props[ 'show' ] } );
1928 }
1929 */
1930 }
1931 return rows_in_content;
1932 }
1933
1934
1935
1936 // Templates ///////////////////////////////////////////////////////////////////////////////////////////////////////////
1937
1938 /**
1939 * Header template for Block Preview
1940 *
1941 * @param props - object of parameters
1942 * @returns array of createElements - react elements
1943 */
1944 function wpbc_gb_tpl_header( props ){
1945
1946 var el = wp.element.createElement;
1947 // FixIn: 8.7.3.18.
1948 return [
1949 el( 'h3', {className: 'wpbc_gb_block_preview_inner_title_text', key: 'h3header_' + props[ 'cid_key' ] }, props.header ),
1950
1951 el( 'a', {
1952 className: 'wpbc_gb_block_preview_inner_title_edit',
1953 href: '#!',
1954 onClick: wpbc_gutenberg_handle_preview_edit_click,
1955 key: 'a_clickedit_' + props[ 'cid_key' ]
1956 }, wp.i18n.__( 'Click to edit' ) ),
1957
1958 el( 'div', {className: 'wpbc_gb_block_preview_inner_title_desc', key: 'div_notreal_' + props[ 'cid_key' ] }, wp.i18n.__( 'This is not real preview. Its configuration block of "Booking Calendar".' ) )
1959 ];
1960 }
1961
1962
1963 /**
1964 * Parameters template for shortcode params in Body of Block Preview
1965 *
1966 * @param props - array of objects of parameters [ {name: 'title', value: 'data'}, ... ]
1967 * @returns array of createElements - react elements
1968 */
1969 function wpbc_gb_tpl_shortcode_parameters( props , params ){ // FixIn: 8.7.3.18.
1970
1971 var el = wp.element.createElement;
1972
1973 var shortcode_parameters_arr = [];
1974
1975 var propsLength = props.length;
1976
1977 var cid_key = params[ 'cid_key' ]; // FixIn: 8.7.3.18.
1978 for ( var i = 0; i < propsLength; i++ ){
1979
1980 cid_key = 'internal' + i + params[ 'cid_key' ];
1981
1982 if ( undefined != props[i]['block_text'] ) {
1983
1984 shortcode_parameters_arr.push(
1985 el( 'div', {className: 'wpbc_gb_block_preview_inner_params_row', key: 'div_text' + cid_key }
1986 , el( 'span', { key: 'inner_params_row_span' + cid_key }, props[ i ]['block_text'] )
1987 )
1988 );
1989
1990 }
1991
1992 if ( ( undefined != props[i]['name'] ) && ( undefined != props[i]['value'] ) ) {
1993
1994 shortcode_parameters_arr.push(
1995 el( 'div', {className: 'wpbc_gb_block_preview_inner_params_row', key: 'div_name' + cid_key }
1996 , el( 'strong', { key: 'strong_name' + cid_key }, props[ i ].name )
1997 , el( 'span', { key: 'span_name' + cid_key }, ': ' )
1998 , el( 'em', { key: 'em_value' + cid_key }, props[ i ].value )
1999 )
2000 );
2001 }
2002 }
2003
2004 return shortcode_parameters_arr;
2005 }
2006
2007
2008 /**
2009 * Header template for Block Preview
2010 *
2011 * @param props - object of parameters
2012 * @returns array of createElements - react elements
2013 */
2014 function wpbc_gb_tpl_footer( props ){
2015
2016 var el = wp.element.createElement;
2017 // FixIn: 8.7.3.18.
2018 return [
2019 el( 'div', { className: 'wpbc_gb_block_preview_inner_shortcode', key: 'div_foot_' + props[ 'cid_key' ] }, props.shortcode_in_text )
2020 ];
2021 }
2022