give / src / Helpers / IntlTelInput.php

IntlTelInput.php in GiveWP – Donation Plugin and Fundraising Platform 4.16.8.1, at src/Helpers/IntlTelInput.php

222 lines 6.9 KB

Raw Download Zip

1	<?php
2
3	namespace Give\Helpers;
4
5	/**
6	* @since 3.9.0
7	*
8	* @see https://github.com/jackocnr/intl-tel-input
9	*/
10	class IntlTelInput
11	{
12	/**
13	* @since 3.9.0
14	*/
15	public static function getCssUrl(): string
16	{
17	return 'https://cdn.jsdelivr.net/npm/intl-tel-input@21.2.4/build/css/intlTelInput.css';
18	}
19
20	/**
21	* @since 3.9.0
22	*/
23	public static function getScriptUrl(): string
24	{
25	return 'https://cdn.jsdelivr.net/npm/intl-tel-input@21.2.4/build/js/intlTelInput.min.js';
26	}
27
28	/**
29	* @since 3.9.0
30	*/
31	public static function getUtilsScriptUrl(): string
32	{
33	return 'https://cdn.jsdelivr.net/npm/intl-tel-input@21.2.4/build/js/utils.js';
34	}
35
36	/**
37	* @since 3.9.0
38	*/
39	public static function getI18n(): array
40	{
41	$countryList = array_change_key_case(give_get_country_list());
42	array_shift($countryList); // Remove first empty item from the country list
43
44	$i18n = array_merge($countryList, [
45	// Aria label for the selected country element
46	'selectedCountryAriaLabel' => __('Selected country', 'give'),
47	// Screen reader text for when no country is selected
48	'noCountrySelected' => __('No country selected', 'give'),
49	// Aria label for the country list element
50	'countryListAriaLabel' => __('List of countries', 'give'),
51	// Placeholder for the search input in the dropdown (when countrySearch enabled)
52	'searchPlaceholder' => __('Search', 'give'),
53	// Screen reader text for when the search produces no results
54	'zeroSearchResults' => __('No results found', 'give'),
55	// Screen reader text for when the search produces 1 result
56	'oneSearchResult' => __('1 result found', 'give'),
57	// Screen reader text for when the search produces multiple results, where ${count} will be replaced by the count
58	'multipleSearchResults' => __('${count} results found', 'give'),
59	]);
60
61	return $i18n;
62	}
63
64	/**
65	* @since 3.9.0
66	*/
67	public static function getErrorMap(): array
68	{
69	return [
70	__('Invalid number.', 'give'),
71	__('Invalid country code.', 'give'),
72	__('Invalid number: too short.', 'give'),
73	__('Invalid number: too long.', 'give'),
74	__('Invalid number.', 'give'),
75	];
76	}
77
78	/**
79	* @since 3.9.0
80	*/
81	public static function getInitialCountry(): string
82	{
83	return strtolower(give_get_country());
84	}
85
86	/**
87	* @since 3.9.0
88	*/
89	public static function getShowSelectedDialCode(): bool
90	{
91	return true;
92	}
93
94	/**
95	* @since 3.9.0
96	*/
97	public static function getStrictMode(): bool
98	{
99	return true;
100	}
101
102	/**
103	* @since 3.9.0
104	*/
105	public static function getUseFullscreenPopup(): bool
106	{
107	return false;
108	}
109
110	/**
111	* @since 3.9.0
112	*/
113	public static function getSettings(): array
114	{
115	return [
116	'initialCountry' => self::getInitialCountry(),
117	'showSelectedDialCode' => self::getShowSelectedDialCode(),
118	'strictMode' => self::getStrictMode(),
119	'i18n' => self::getI18n(),
120	'cssUrl' => self::getCssUrl(),
121	'scriptUrl' => self::getScriptUrl(),
122	'utilsScriptUrl' => self::getUtilsScriptUrl(),
123	'errorMap' => self::getErrorMap(),
124	'useFullscreenPopup' => self::getUseFullscreenPopup(),
125	];
126	}
127
128	/**
129	* @since 4.16.4 Escaped the value attribute output.
130	* @since 3.9.0
131	*/
132	public static function getHtmlInput(string $value, string $id, string $class = '', string $name = ''): string
133	{
134	if (empty($name)) {
135	$name = $id;
136	}
137
138	ob_start();
139
140	?>
141	<script src="<?php
142	echo self::getScriptUrl(); ?>">
143	</script>
144
145	<link rel="stylesheet" href="<?php
146	echo self::getCssUrl(); ?>">
147
148	<input id="<?php
149	echo $id . '--intl_tel_input'; ?>" class="<?php
150	echo $class; ?>" name="<?php
151	echo $name; ?>" value="<?php
152	echo esc_attr($value); ?>" type='text'>
153
154	<span id="<?php
155	echo $id . '--error-msg'; ?>" class="give-intl-tel-input-hide" style="color:red;"></span>
156
157	<style>
158	.give-intl-tel-input-hide {
159	display: none !important;
160	}
161
162	.give-intl-tel-input-error {
163	border: 1px solid red !important;
164	}
165	</style>
166	<script>
167	if (document.readyState !== 'loading') {
168	readyHandler();
169	} else {
170	document.addEventListener('DOMContentLoaded', readyHandler);
171	}
172
173	function readyHandler() {
174	const input = document.querySelector("#<?php echo $id . '--intl_tel_input'; ?>");
175	const intl = window.intlTelInput(input, {
176	utilsScript: "<?php echo self::getUtilsScriptUrl(); ?>",
177	hiddenInput: function (telInputName) {
178	return {
179	phone: "<?php echo $id ?>",
180	};
181	},
182	initialCountry: "<?php echo self::getInitialCountry(); ?>",
183	showSelectedDialCode: Boolean(<?php echo self::getShowSelectedDialCode(); ?>),
184	useFullscreenPopup: Boolean(<?php echo self::getUseFullscreenPopup(); ?>),
185	strictMode: Boolean(<?php echo self::getStrictMode(); ?>),
186	i18n: <?php echo json_encode(self::getI18n()); ?>,
187	});
188
189	const errorMsg = document.querySelector("#<?php echo $id . '--error-msg'; ?>");
190	const errorMap = <?php echo json_encode(self::getErrorMap()); ?>;
191
192	const resetErrorMessage = () => {
193	input.classList.remove("give-intl-tel-input-error");
194	errorMsg.innerHTML = "";
195	errorMsg.classList.add("give-intl-tel-input-hide");
196	};
197
198	const showErrorMessage = (msg) => {
199	input.classList.add("give-intl-tel-input-error");
200	errorMsg.innerHTML = msg;
201	errorMsg.classList.remove("give-intl-tel-input-hide");
202	};
203
204	input.addEventListener('change', resetErrorMessage);
205	input.addEventListener('keyup', resetErrorMessage);
206	input.form.addEventListener("submit", function (e) {
207	if (input.value.trim() && !intl.isValidNumber()) {
208	e.preventDefault();
209	const errorCode = intl.getValidationError();
210	const msg = errorMap[errorCode] \|\| errorMap[0];
211	showErrorMessage(msg);
212	return false;
213	}
214	});
215	}
216	</script>
217	<?php
218
219	return ob_get_clean();
220	}
221	}
222