Booking Calendar / 11.5

Booking Calendar v11.5

booking / includes / page-form-builder / field-packs / section / _src / section-wptpl.js

section-wptpl.js in Booking Calendar 11.5, at includes/page-form-builder/field-packs/section/_src/section-wptpl.js

172 lines 5.8 KB

Raw Download Zip

1	/**
2	* WPBC BFB: Section Renderer (WP-template–driven, slim version)
3	* ---------------------------------------------------------------------------------
4	* - Delegates column-style logic to UI.WPBC_BFB_Column_Styles (separate module)
5	* - Inspector glue is moved to: /_out/core/bfb-inspector-patches.js
6	*
7	* Contracts:
8	* - Registry: Registry.register( 'section', WPBC_BFB_Section );
9	* - Class API: static get_defaults(), static render(el, data, ctx), static on_field_drop(data, el, ctx?)
10	*
11	* File: /includes/page-form-builder/field-packs/section/_out/section-wptpl.js
12	*
13	* @since 11.0.0
14	* @modified 2025-09-16 11:24
15	* @version 1.1.0
16	*/
17	(function ( w ) {
18	'use strict';
19
20	var Core = w.WPBC_BFB_Core \|\| {};
21	var Registry = Core.WPBC_BFB_Field_Renderer_Registry;
22	var Base = Core.WPBC_BFB_Field_Base;
23	var UI = ( Core.UI = Core.UI \|\| {} );
24
25	if ( ! Registry \|\| typeof Registry.register !== 'function' \|\| ! Base ) {
26	w._wpbc && w._wpbc.dev && w._wpbc.dev.error && w._wpbc.dev.error( 'WPBC_BFB_Section', 'Core registry/base missing' );
27	return;
28	}
29
30	// Shortcuts.
31	var S = Core.WPBC_BFB_Sanitize;
32	var ColStyles = UI.WPBC_BFB_Column_Styles \|\| null;
33
34	/**
35	* Clamp number of columns to supported range.
36	*
37	* @param {number\|string} n
38	* @returns {number}
39	*/
40	function clamp_cols( n ) {
41	return S.clamp( Number( n ) \|\| 1, 1, 4 );
42	}
43
44	class WPBC_BFB_Section extends Base {
45
46	static template_id = 'wpbc-bfb-section';
47
48	/**
49	* Default data for a new Section.
50	* NOTE: Keep in sync with PHP schema.
51	*/
52	static get_defaults() {
53	return {
54	type : 'section',
55	label : 'Section',
56	columns : 1,
57	id : '',
58	html_id : '',
59	cssclass : '',
60	col_styles : '' // JSON string, empty by default to avoid activation
61	};
62	}
63
64	/**
65	* Render section preview into element.
66	*
67	* @param {HTMLElement} el
68	* @param {object} data
69	* @param {object} ctx
70	*/
71	static render( el, data, ctx ) {
72	if ( ! el ) { return; }
73
74	var d = this.normalize_data( data );
75	var html_id = d.html_id ? S.sanitize_html_id( String( d.html_id ) ) : '';
76	var next_class = S.sanitize_css_classlist( String( d.cssclass \|\| '' ) );
77	var col_styles = ( d.col_styles != null ) ? String( d.col_styles ) : '';
78
79	// Treat legacy "[]" as empty / inactive.
80	if ( col_styles.trim() === '[]' ) { col_styles = ''; }
81
82	el.classList.add( 'wpbc_bfb__section' );
83	el.dataset.type = 'section';
84	el.dataset.label = ( d.label != null ? String( d.label ) : '' );
85	el.dataset.columns = ( d.columns != null ? String( clamp_cols( d.columns ) ) : '1' );
86	el.dataset.html_id = html_id;
87	el.dataset.cssclass = next_class \|\| '';
88	el.dataset.col_styles = col_styles;
89
90	// Replace previous custom classes.
91	var prev = ( el.__wpbc_prev_classes \|\| '' );
92	if ( prev ) {
93	prev.split( /\s+/ ).filter( Boolean ).forEach( function ( cls ) { el.classList.remove( cls ); } );
94	}
95	if ( next_class ) {
96	next_class.split( /\s+/ ).filter( Boolean ).forEach( function ( cls ) { el.classList.add( cls ); } );
97	}
98	el.__wpbc_prev_classes = next_class \|\| '';
99
100	// Render wp.template.
101	var tpl = this.get_template( this.template_id );
102	if ( typeof tpl !== 'function' ) {
103	w._wpbc && w._wpbc.dev && w._wpbc.dev.error && w._wpbc.dev.error( 'section_wptpl.tpl.missing', 'Template not found: ' + this.template_id );
104	el.innerHTML = '<div class="wpbc_bfb__error" role="alert">Template not found: wpbc-bfb-section.</div>';
105	return;
106	}
107	try {
108	el.innerHTML = tpl( {
109	type : 'section',
110	label : el.dataset.label \|\| 'Section',
111	columns : Number( el.dataset.columns \|\| 1 ),
112	id : d.id \|\| '',
113	html_id : html_id,
114	cssclass : next_class
115	} );
116	} catch ( e ) {
117	w._wpbc && w._wpbc.dev && w._wpbc.dev.error && w._wpbc.dev.error( 'section_wptpl.tpl.render', e );
118	el.innerHTML = '<div class="wpbc_bfb__error" role="alert">Error rendering section preview.</div>';
119	}
120
121	// Apply per-column styles via shared UI service (no-op if missing).
122	try {
123	if ( ColStyles && typeof ColStyles.apply === 'function' ) {
124	var arr = ColStyles.parse_col_styles( col_styles );
125	ColStyles.apply( el, arr );
126	}
127	} catch ( e2 ) {
128	w._wpbc && w._wpbc.dev && w._wpbc.dev.error && w._wpbc.dev.error( 'section_wptpl.apply_col_styles', e2 );
129	}
130
131	// Overlay controls (selection/toolbar), if available.
132	UI && UI.WPBC_BFB_Overlay && UI.WPBC_BFB_Overlay.ensure && UI.WPBC_BFB_Overlay.ensure( ctx && ctx.builder, el );
133	}
134
135	/**
136	* After drop hook.
137	*
138	* @param {object} data
139	* @param {HTMLElement} el
140	* @param {object} ctx
141	*/
142	static on_field_drop( data, el, ctx ) {
143	try {
144	var cols = clamp_cols(
145	( data && ( data.columns != null ? data.columns : data['data-columns'] ) )
146	\|\| ( el && el.dataset && el.dataset.columns )
147	\|\| 1
148	);
149	if ( ctx && ctx.builder && typeof ctx.builder.set_section_columns === 'function' ) {
150	ctx.builder.set_section_columns( el, cols );
151	}
152	el.dataset.columns = String( cols );
153
154	// Re-apply styles (baseline + activation state).
155	if ( ColStyles && typeof ColStyles.apply === 'function' ) {
156	var arr = ColStyles.parse_col_styles( el.dataset.col_styles \|\| '' );
157	ColStyles.apply( el, arr );
158	}
159	} catch ( e ) {
160	w._wpbc && w._wpbc.dev && w._wpbc.dev.error && w._wpbc.dev.error( 'WPBC_BFB_Section.on_field_drop', e );
161	}
162	}
163	}
164
165	try {
166	Registry.register( 'section', WPBC_BFB_Section );
167	} catch ( e ) {
168	w._wpbc && w._wpbc.dev && w._wpbc.dev.error && w._wpbc.dev.error( 'WPBC_BFB_Section.register_wptpl', e );
169	}
170
171	})( window );
172