← All changes | back/Partial/forms/popup.php +0 -279 10.11.1 → 11.1.1 View file →

		@@ -1,279 +1,0 @@
1		-<?php
2		-$hideForScroll = '';
3		-if (!$edition && isset($form->settings['display']['scroll']) && $form->settings['display']['scroll'] != 0) {
4		- $hideForScroll = 'style="display: none;"';
5		-}
6		-?>
7		-<div id="acym_fulldiv_<?php echo $form->form_tag_name; ?>"
8		- class="acym__subscription__form__popup__overlay acym__subscription__form-erase"
9		- <?php echo $hideForScroll; ?>>
10		- <div class="acym__subscription__form__popup">
11		- <div class="acym__subscription__form__popup__close acymicon-close"></div>
12		- <?php
13		- if ($edition) {
14		- echo '<form action="#" onsubmit="return false;" id="'.$form->form_tag_name.'">';
15		- } else {
16		- $isButton = $form->settings['display']['display_action'] === 'yes';
17		- if ($isButton) {
18		- $cookieExpirationAttr = 'acym-data-cookie="0"';
19		- } else {
20		- $cookieExpirationAttr = empty($form->settings['cookie']['cookie_expiration']) ? 'acym-data-cookie="1"'
21		- : 'acym-data-cookie="'.$form->settings['cookie']['cookie_expiration'].'"';
22		- }
23		- echo '<form acym-data-id="'.$form->id.'" '.$cookieExpirationAttr.' action="'.$form->form_tag_action.'" id="'.$form->form_tag_name.'" name="'.$form->form_tag_name.'" enctype="multipart/form-data" onsubmit="return submitAcymForm(\'subscribe\',\''.$form->form_tag_name.'\', \'acymSubmitSubForm\')">';
24		- }
25		- if (in_array($form->settings['style']['position'], ['image-top', 'image-left'])) {
26		- if (!empty($form->settings['message']['text']) && $form->settings['message']['position'] === 'before-image') {
27		- echo '<p id="acym__subscription__form__popup-text">'.nl2br(acym_translation($form->settings['message']['text'])).'</p>';
28		- }
29		- include acym_getPartial('forms', 'image');
30		- }
31		- echo '<div class="acym__subscription__form__popup__fields-button">';
32		- include acym_getPartial('forms', 'fields');
33		- if (!empty($form->settings['message']['text']) && $form->settings['message']['position'] == 'before-button') {
34		- echo '<p id="acym__subscription__form__popup-text">'.nl2br(acym_translation($form->settings['message']['text'])).'</p>';
35		- }
36		- include acym_getPartial('forms', 'button');
37		- echo '</div>';
38		- if (in_array($form->settings['style']['position'], ['image-bottom', 'image-right'])) {
39		- if (!empty($form->settings['message']['text']) && $form->settings['message']['position'] == 'before-image') {
40		- echo '<p id="acym__subscription__form__popup-text">'.nl2br(acym_translation($form->settings['message']['text'])).'</p>';
41		- }
42		- include acym_getPartial('forms', 'image');
43		- }
44		- include acym_getPartial('forms', 'hidden_params');
45		- ?>
46		- </form>
47		- </div>
48		-</div>
49		-<?php
50		-$popupPosition = $form->settings['display']['popup_position'] ?? 'center';
51		-$positionMap = [
52		- 'top_left' => 'top: 20px; left: 20px;',
53		- 'top_center' => 'top: 20px; left: 50%; transform: translateX(-50%);',
54		- 'top_right' => 'top: 20px; right: 20px;',
55		- 'middle_left' => 'top: 50%; left: 20px; transform: translateY(-50%);',
56		- 'middle_right' => 'top: 50%; right: 20px; transform: translateY(-50%);',
57		- 'bottom_left' => 'bottom: 20px; left: 20px;',
58		- 'bottom_center' => 'bottom: 20px; left: 50%; transform: translateX(-50%);',
59		- 'bottom_right' => 'bottom: 20px; right: 20px;',
60		-];
61		-$positionCss = $positionMap[$popupPosition] ?? 'top: 50%; left: 50%; transform: translate(-50%, -50%);';
62		-?>
63		-<style>
64		- <?php echo '#acym_fulldiv_'.$form->form_tag_name; ?>.acym__subscription__form__popup__overlay{
65		- display: <?php echo $edition ? 'inline' : 'none'; ?>;
66		- <?php if ($popupPosition === 'center') { ?>
67		- position: fixed;
68		- top: 0;
69		- bottom: 0;
70		- right: 0;
71		- left: 0;
72		- background-color: rgba(200, 200, 200, .5);
73		- <?php } else { ?>
74		- position: static;
75		- <?php } ?> z-index: 999999;
76		- }
77		-
78		- <?php echo '#acym_fulldiv_'.$form->form_tag_name.' '; ?>.acym__subscription__form__popup__close{
79		- position: absolute;
80		- top: 10px;
81		- right: 10px;
82		- font-weight: bold;
83		- font-size: 1rem;
84		- cursor: pointer;
85		- }
86		-
87		- <?php echo '#acym_fulldiv_'.$form->form_tag_name.' '; ?>.acym__subscription__form__popup{
88		- position: fixed;
89		- <?php echo $positionCss; ?> padding: <?php echo $form->settings['style']['padding']['height']; ?>px <?php echo $form->settings['style']['padding']['width']; ?>px;
90		- background-color: <?php echo $form->settings['style']['background_color']; ?>;
91		- color: <?php echo $form->settings['style']['text_color']; ?> !important;
92		- background-image: url("<?php echo $form->settings['style']['background_image']; ?>");
93		- background-size: <?php echo $form->settings['style']['background_size']; ?>;
94		- background-position: <?php echo str_replace('_', ' ', $form->settings['style']['background_position']); ?>;
95		- background-repeat: <?php echo $form->settings['style']['background_repeat']; ?>;
96		- border-radius: <?php echo intval($form->settings['style']['border_radius'] ?? 0); ?>px;
97		- box-shadow: <?php echo intval($form->settings['style']['shadow_x'] ?? 0); ?>px <?php echo intval($form->settings['style']['shadow_y'] ?? 0); ?>px <?php echo intval($form->settings['style']['shadow_blur'] ?? 0); ?>px<?php echo $form->settings['style']['shadow_color'] ?? 'rgba(0,0,0,0.2)'; ?>;
98		- z-index: 999999;
99		- text-align: center;
100		- display: flex;
101		- justify-content: center;
102		- align-items: center;
103		- }
104		-
105		- <?php echo '#acym_fulldiv_'.$form->form_tag_name.' '; ?>.acym__subscription__form__popup .responseContainer{
106		- margin-bottom: 0 !important;
107		- padding: .4rem !important;
108		- }
109		-
110		- <?php echo '#acym_fulldiv_'.$form->form_tag_name.' '; ?>.acym__subscription__form__popup <?php echo '#'.$form->form_tag_name; ?>{
111		- margin: 0;
112		- }
113		-
114		- <?php echo '#acym_fulldiv_'.$form->form_tag_name.' '; ?>.acym__subscription__form__popup .acym__subscription__form__fields, <?php echo '#acym_fulldiv_'.$form->form_tag_name.' '; ?>.acym__subscription__form__popup .acym__subscription__form__button{
115		- display: block;
116		- width: 100%;
117		- margin: 1rem 0 !important;
118		- }
119		-
120		- <?php echo '#acym_fulldiv_'.$form->form_tag_name.' '; ?>.acym__subscription__form__popup .acym__subscription__form__fields input:not([type="radio"]):not([type="checkbox"]), <?php echo '#acym_fulldiv_'.$form->form_tag_name.' '; ?>.acym__subscription__form__popup .acym__subscription__form__fields label{
121		- display: block;
122		- }
123		-
124		- <?php echo '#acym_fulldiv_'.$form->form_tag_name.' '; ?>.acym__subscription__form__popup .acym__subscription__form__fields input[type="radio"], <?php echo '#acym_fulldiv_'.$form->form_tag_name.' '; ?>.acym__subscription__form__popup .acym__subscription__form__fields input[type="checkbox"]{
125		- margin-left: 5px;
126		- }
127		-
128		- <?php echo '#acym_fulldiv_'.$form->form_tag_name.' '; ?>.acym__subscription__form__popup .acym__subscription__form__fields .acym__subscription__form__lists{
129		- display: block;
130		- width: 100%;
131		- margin: 1rem 10px !important;
132		- }
133		-
134		- <?php echo '#acym_fulldiv_'.$form->form_tag_name.' '; ?>.acym__subscription__form__popup .acym__subscription__form__fields .acym__user__edit__email{
135		- margin: auto;
136		- }
137		-
138		- <?php if (!empty($form->settings['message']['color'])) { ?>
139		- <?php echo '#acym_fulldiv_'.$form->form_tag_name.' '; ?>#acym__subscription__form__popup-text{
140		- color: <?php echo $form->settings['message']['color']; ?>;
141		- }
142		-
143		- <?php } ?>
144		-
145		- <?php if (in_array($form->settings['style']['position'], ['image-right', 'image-left'])) { ?>
146		- <?php echo '#acym_fulldiv_'.$form->form_tag_name.' '; ?>.acym__subscription__form__popup <?php echo '#'.$form->form_tag_name; ?>{
147		- display: flex;
148		- justify-content: center;
149		- align-items: center
150		- }
151		-
152		- <?php echo '#acym_fulldiv_'.$form->form_tag_name.' '; ?>.acym__subscription__form__popup__fields-button, <?php echo '#acym_fulldiv_'.$form->form_tag_name.' '; ?>.acym__subscription__form__image{
153		- display: inline-block;
154		- }
155		-
156		- <?php } ?>
157		-
158		-</style>
159		-<?php if (!$edition) { ?>
160		- <script type="text/javascript">
161		- const acymBackupFormTimeout<?php echo $form->form_tag_name; ?> = setTimeout(() => {
162		- acym_initPopupDisplay<?php echo $form->form_tag_name; ?>(true);
163		- }, 1000);
164		-
165		- window.addEventListener('DOMContentLoaded', function () {
166		- clearTimeout(acymBackupFormTimeout<?php echo $form->form_tag_name; ?>);
167		- acym_initPopupDisplay<?php echo $form->form_tag_name; ?>();
168		- });
169		-
170		- function acym_initPopupDisplay<?php echo $form->form_tag_name; ?>(addedDelayForBackup = false) {
171		- const acym_popupForm = document.querySelector('#acym_fulldiv_<?php echo $form->form_tag_name; ?>.acym__subscription__form__popup__overlay');
172		-
173		- if (!acym_popupForm) {
174		- return;
175		- }
176		-
177		- const isDisplayButton = <?php echo $isButton ? 'true' : 'false'; ?>;
178		-
179		- function acym_closePopupform<?php echo $form->form_tag_name; ?>(element) {
180		- element.style.display = 'none';
181		-
182		- if (isDisplayButton) {
183		- return;
184		- }
185		-
186		- let expirationDate = new Date();
187		- expirationDate.setDate(expirationDate.getDate() + <?php echo empty($form->settings['cookie']['cookie_expiration']) ? 1
188		- : $form->settings['cookie']['cookie_expiration']; ?>);
189		- document.cookie = 'acym_form_<?php echo $form->id; ?>=' + Date.now() + ';expires=' + expirationDate.toUTCString() + ';path=/';
190		- }
191		-
192		- <?php if ($popupPosition === 'center') { ?>
193		- acym_popupForm.addEventListener('click', function (event) {
194		- if (event.target.closest('.acym__subscription__form__popup') === null) {
195		- acym_closePopupform<?php echo $form->form_tag_name; ?>(this);
196		- }
197		- });
198		- <?php } ?>
199		- document.querySelector('#acym_fulldiv_<?php echo $form->form_tag_name; ?> .acym__subscription__form__popup__close').addEventListener('click', function (event) {
200		- acym_closePopupform<?php echo $form->form_tag_name; ?>(event.target.closest('.acym__subscription__form__popup__overlay'));
201		- });
202		-
203		- if (isDisplayButton) {
204		- displayByButton();
205		- } else {
206		- displayByDelayAndScroll();
207		- }
208		-
209		- function displayByButton() {
210		- const button = document.querySelector('#<?php echo $form->settings['display']['button']; ?>');
211		-
212		- if (!button) {
213		- console.error('Could not find the button with the ID <?php echo $form->settings['display']['button']; ?>');
214		- return;
215		- }
216		-
217		- button.addEventListener('click', function () {
218		- acym_popupForm.style.display = 'inline';
219		- });
220		- }
221		-
222		- function displayByDelayAndScroll() {
223		- const delayDisplay = parseInt(<?php echo $form->settings['display']['delay']; ?>);
224		- const scrollPercentLimit = parseInt(<?php echo $form->settings['display']['scroll']; ?>);
225		- let windowSize;
226		- let browserHeight;
227		- let delayRemaining = false;
228		-
229		- if (delayDisplay > 0) {
230		- delayRemaining = true;
231		- }
232		-
233		- let scrollRemaining = false;
234		- if (scrollPercentLimit > 0) {
235		- scrollRemaining = true;
236		- }
237		-
238		- windowSize = document.getElementsByTagName('body')[0].clientHeight;
239		- browserHeight = document.documentElement.clientHeight;
240		-
241		- if (!delayRemaining && (windowSize <= browserHeight || !scrollRemaining)) {
242		- scrollRemaining = false;
243		- acym_popupForm.style.display = 'inline';
244		- } else {
245		- function displayAcymPopupForm() {
246		- let scrollPercent = Math.round((window.scrollY) / (windowSize - browserHeight) * 100);
247		- if (scrollPercent >= scrollPercentLimit) {
248		- scrollRemaining = false;
249		- window.removeEventListener('scroll', displayAcymPopupForm);
250		- if (!delayRemaining && acym_popupForm) {
251		- acym_popupForm.style.display = 'inline';
252		- }
253		- }
254		- }
255		-
256		- window.addEventListener('scroll', displayAcymPopupForm);
257		-
258		- let delayInMs = delayDisplay * 1000;
259		- if (addedDelayForBackup && delayDisplay > 1000) {
260		- delayInMs -= 1000;
261		- }
262		-
263		- setTimeout(function () {
264		- if (acym_popupForm !== null) {
265		- delayRemaining = false;
266		- if (!scrollRemaining) {
267		- acym_popupForm.style.display = 'inline';
268		- window.removeEventListener('scroll', displayAcymPopupForm);
269		- }
270		- }
271		- }, delayInMs);
272		- }
273		- }
274		- }
275		- </script>
276		- <?php
277		- include acym_getPartial('forms', 'cookie');
278		-}
279		-?>