bit-form / includes / Frontend / Form / View / Theme / Fields / PhoneNumberField.php

PhoneNumberField.php in Bit Form – Contact Form, Payment Forms, Multi Step Forms, Calculator & Custom Form Builder 3.2.2, at includes/Frontend/Form/View/Theme/Fields/PhoneNumberField.php

299 lines 8.7 KB

Raw Download Zip

1	<?php
2
3	namespace BitCode\BitForm\Frontend\Form\View\Theme\Fields;
4
5	class PhoneNumberField
6	{
7	public static function init($field, $rowID, $field_name, $form_atomic_Cls_map, $formID, $error = null, $value = null)
8	{
9	$inputWrapper = new ClassicInputWrapper($field, $rowID, $field_name, $form_atomic_Cls_map, $formID, $error, $value);
10	$input = self::field($field, $rowID, $field_name, $form_atomic_Cls_map, $formID, $error, $value);
11	return $inputWrapper->wrapper($input);
12	}
13
14	private static function field($field, $rowID, $field_name, $form_atomic_Cls_map, $formID, $error = null, $value = null)
15	{
16	$fh = new ClassicFieldHelpers($field, $rowID, $form_atomic_Cls_map);
17	$img_url = BITFORMS_ROOT_URI . '/static/countries/';
18	$req = $fh->required();
19	$disabled = $fh->disabled();
20	$readonly = $fh->readonly();
21	$name = $fh->name();
22	$ph = $fh->placeholder();
23	$ariaDescribedBy = $fh->ariaDescribedBy();
24	$ariaRequired = $fh->ariaRequired();
25	// Get dynamic label ID to properly link the combobox to its label for screen readers
26	$labelId = $fh->getLabelId();
27	$selectedFlagImage = '';
28	$dropDownBtn = '';
29	$tabIndx = isset($field->disabled) ? -1 : 0;
30	$selectedCountryClearable = '';
31	$dpdWrap = '';
32	$searchPlaceholder = '';
33	$searchClearable = '';
34	$optionWrap = '';
35	$options = '';
36	$showSelectedFlagImg = $fh->property_exists_nested($field, 'config->selectedFlagImage', true);
37	$hideCountryList = $fh->property_exists_nested($field, 'config->hideCountryList', true);
38	$readonlyCls = isset($field->readonly) ? 'readonly' : '';
39	$disabledCls = isset($field->disabled) ? 'disabled' : '';
40	$img = esc_url(includes_url('images/blank.gif'));
41
42	$val = $fh->value();
43
44	if ($showSelectedFlagImg) {
45	$selectedFlagImage = sprintf(
46	'<div class="%1$s">
47	<img
48	%2$s
49	alt="Selected Country image"
50	aria-hidden="true"
51	class="%3$s %4$s"
52	src="%5$s"
53	/>
54	</div>',
55	$fh->getAtomicCls('selected-country-wrp'),
56	$fh->getCustomAttributes('selected-phone-img'),
57	$fh->getAtomicCls('selected-country-img'),
58	$fh->getCustomClasses('selected-country-img'),
59	$img
60	);
61	}
62
63	if (!$hideCountryList) {
64	$dropDownBtn = sprintf(
65	'<div class="%1$s">
66	<svg
67	width="15"
68	height="15"
69	role="img"
70	title="Downarrow icon"
71	viewBox="0 0 24 24"
72	fill="none"
73	stroke="currentColor"
74	stroke-width="2"
75	stroke-linecap="round"
76	stroke-linejoin="round"
77	>
78	<polyline points="6 9 12 15 18 9" />
79	</svg>
80	</div>',
81	$fh->getAtomicCls('dpd-down-btn')
82	);
83	}
84
85	if ($fh->property_exists_nested($field, 'config->selectedCountryClearable', true)) {
86	$selectedCountryClearable = sprintf(
87	'<button
88	%1$s
89	type="button"
90	title="Clear value"
91	class="%2$s %3$s"
92	>
93	<svg
94	width="12"
95	height="12"
96	viewBox="0 0 24 24"
97	fill="none"
98	stroke="currentColor"
99	stroke-width="2"
100	stroke-linecap="round"
101	stroke-linejoin="round"
102	>
103	<line x1="18" y1="6" x2="6" y2="18" />
104	<line x1="6" y1="6" x2="18" y2="18" />
105	</svg>
106	</button>',
107	$fh->getCustomAttributes('input-clear-btn'),
108	$fh->getAtomicCls('input-clear-btn'),
109	$fh->getCustomClasses('input-clear-btn')
110	);
111	}
112
113	if ($fh->property_exists_nested($field, 'config->searchPlaceholder', '', 1)) {
114	$searchPlaceholder = "{$field->config->searchPlaceholder}";
115	}
116
117	if ($fh->property_exists_nested($field, 'config->searchClearable', true)) {
118	$searchClearable = sprintf(
119	'<button
120	%1$s
121	type="button"
122	aria-label="Clear search"
123	class="%2$s %3$s"
124	tabIndex="-1"
125	>
126	<svg
127	width="12"
128	height="12"
129	viewBox="0 0 24 24"
130	fill="none"
131	stroke="currentColor"
132	stroke-width="2"
133	stroke-linecap="round"
134	stroke-linejoin="round"
135	>
136	<line x1="18" y1="6" x2="6" y2="18" />
137	<line x1="6" y1="6" x2="18" y2="18" />
138	</svg>
139	</button>',
140	$fh->getCustomAttributes('search-clear-btn'),
141	$fh->getAtomicCls('search-clear-btn'),
142	$fh->getCustomClasses('search-clear-btn')
143	);
144	}
145
146	if (!$hideCountryList \|\| $showSelectedFlagImg) {
147	$dpdWrap = sprintf(
148	'<div
149	class="%1$s"
150	role="combobox"
151	aria-haspopup="listbox"
152	aria-live="assertive"
153	aria-labelledby="%2$s"
154	aria-expanded="false"
155	tabIndex=%3$s
156	>
157	%4$s
158	%5$s
159	</div>',
160	$fh->getAtomicCls('dpd-wrp'),
161	$labelId,
162	$tabIndx,
163	$selectedFlagImage,
164	$dropDownBtn
165	);
166	}
167
168	if (!$hideCountryList) {
169	$optionWrap = sprintf(
170	'<div
171	%1$s
172	class="%2$s %3$s"
173	>
174	<div class="%4$s">
175	<div
176	%5$s
177	class="%6$s %7$s"
178	>
179	<input
180	%8$s
181	aria-label="Search for countries"
182	type="search"
183	class="%9$s %10$s"
184	placeholder="%11$s"
185	autoComplete="off"
186	tabIndex="-1"
187	/>
188	<svg
189	%12$s
190	class="%13$s %14$s"
191	aria-hidden="true"
192	width="22"
193	height="22"
194	viewBox="0 0 24 24"
195	fill="none"
196	stroke="currentColor"
197	stroke-width="2"
198	stroke-linecap="round"
199	stroke-linejoin="round"
200	>
201	<circle cx="11" cy="11" r="8" />
202	<line x1="21" y1="21" x2="16.65" y2="16.65" />
203	</svg>
204	%15$s
205	</div>
206	<ul
207	%16$s
208	class="%17$s %18$s"
209	tabIndex="-1"
210	role="listbox"
211	aria-label="country list"
212	>
213	%19$s
214	</ul>
215	</div>
216	</div>',
217	$fh->getCustomAttributes('option-wrp'),
218	$fh->getAtomicCls('option-wrp'),
219	$fh->getCustomClasses('option-wrp'),
220	$fh->getAtomicCls('option-inner-wrp'),
221	$fh->getCustomAttributes('option-search-wrp'),
222	$fh->getAtomicCls('option-search-wrp'),
223	$fh->getCustomClasses('option-search-wrp'),
224	$fh->getCustomAttributes('opt-search-input'),
225	$fh->getAtomicCls('opt-search-input'),
226	$fh->getCustomClasses('opt-search-icn'),
227	$fh->esc_attr($searchPlaceholder),
228	$fh->getCustomAttributes('opt-search-icn'),
229	$fh->getAtomicCls('opt-search-icn'),
230	$fh->getCustomClasses('opt-search-icn'),
231	$searchClearable,
232	$fh->getCustomAttributes('option-list'),
233	$fh->getAtomicCls('option-list'),
234	$fh->getCustomClasses('option-list'),
235	$options
236	);
237	}
238
239	return sprintf(
240	'<div class="%1$s">
241	<div
242	%2$s
243	class="%3$s %4$s %5$s %6$s"
244	>
245	<input
246	%7$s
247	%8$s
248	%9$s
249	%10$s
250	type="text"
251	title="Phone-number Hidden Input"
252	class="%11$s d-none"
253	%12$s
254	%13$s
255	%14$s
256	/>
257	<div class="%15$s">
258	%16$s
259	<input
260	%17$s
261	aria-label="Phone Number"
262	type="tel"
263	class="%18$s %19$s"
264	autoComplete="tel"
265	%20$s
266	tabIndex=%21$s
267	/>
268	%22$s
269	</div>
270	%23$s
271	</div>
272	</div>',
273	$fh->getAtomicCls('phone-fld-container'), // 1
274	$fh->getCustomAttributes('phone-fld-wrp'), // 2
275	$fh->getAtomicCls('phone-fld-wrp'), // 3
276	$fh->getCustomClasses('phone-fld-wrp'), // 4
277	$readonly, // 5
278	$disabled, // 6
279	$name, // 7
280	$req, // 8
281	$ariaRequired, // 9
282	$ariaDescribedBy, // 10
283	$fh->getAtomicCls('phone-hidden-input'), // 11
284	$fh->disabled(), // 12
285	$fh->readonly(), // 13
286	$val, // 14
287	$fh->getAtomicCls('phone-inner-wrp'), // 15
288	$dpdWrap, // 16
289	$fh->getCustomAttributes('phone-number-input'), // 17
290	$fh->getAtomicCls('phone-number-input'), // 18
291	$fh->getCustomClasses('phone-number-input'), // 19
292	$ph, // 20
293	$tabIndx, // 21
294	$selectedCountryClearable, // 22
295	$optionWrap // 23
296	);
297	}
298	}
299