PluginProbe
LoginPress | wp-login Custom Login Page Customizer / trunk
LoginPress | wp-login Custom Login Page Customizer vtrunk
6.2.5 6.2.4 6.2.3 6.2.2 6.2.1 trunk 1.0.0 1.0.1 1.0.10 1.0.11 1.0.12 1.0.13 1.0.14 1.0.15 1.0.16 1.0.17 1.0.18 1.0.19 1.0.2 1.0.20 1.0.21 1.0.22 1.0.23 1.0.3 1.0.4 All 118 releases
loginpress / js / customizer.js

customizer.js in LoginPress | wp-login Custom Login Page Customizer trunk, at js/customizer.js

296 lines 8.9 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /**
2 * Customizer Communicator
3 *
4 * @since 1.0.23
5 * @version 6.0.0
6 */
7 ( function ( exports, $ ) {
8 "use strict";
9
10 var api = wp.customize, OldPreviewer;
11
12 // Custom Customizer Previewer class (attached to the Customize API)
13 api.myCustomizerPreviewer = {
14 // Init
15 init: function () {
16 // Store a reference to "this" in case callback functions need to reference it
17
18 // Listen to the "customize-section-back" event for removing 'active' class from customize-partial-edit-shortcut.
19 $( document ).on(
20 'click',
21 '.customize-section-back',
22 function () {
23 // if not multisites. 1.1.3
24 if ( ! $( "#customize-preview iframe" ).hasClass( 'loginpress_multisite_active' ) ) {
25
26 $( '#customize-preview iframe' ).contents().find( '.loginpress-partial.customize-partial-edit-shortcut' ).each(
27 function () {
28 $( this ).removeClass( 'active' );
29 }
30 );
31 }
32 }
33 );
34
35 // activated loginpress partial icons
36 $( document ).on(
37 'click',
38 '.control-subsection',
39 function () {
40 // if not multisites. 1.1.3
41 if ( ! $( "#customize-preview iframe" ).hasClass( 'loginpress_multisite_active' ) ) {
42 if ( $( this ).attr( 'aria-owns' ) !== undefined ) {
43 var trigger = $( this ).attr( 'aria-owns' ).replace( "sub-accordion-section-", "" );
44 $( '#customize-preview iframe' ).contents().find( '[data-customizer-event="' + trigger + '"]' ).parent().addClass( 'active' );
45 }
46 }
47 }
48 );
49 $( '#customize-controls h3.loginpress-group-heading' ).each(
50 function () {
51 if ($( this ).next( '.loginpress-group-info' ).length > 0) {
52 $( this ).next( '.loginpress-group-info' ).hide();
53 $( this ).append( '<button type="button" class="customize-help-toggle dashicons dashicons-editor-help" aria-expanded="false"><span class="screen-reader-text">Help</span></button>' );
54 }
55 }
56 );
57 $( document ).on(
58 'click',
59 '#customize-controls h3.loginpress-group-heading .customize-help-toggle',
60 function () {
61 $( this ).parent().next( '.loginpress-group-info' ).slideToggle();
62 }
63 );
64
65 $( '<li class="accordion-section accordion-section-LoginPress control-section control-section-default control-subsection"><a href="https://wordpress.org/support/plugin/loginpress/reviews/#new-post" target="_blank"><h4 class="accordion-section-title">Like our plugin? Leave a review here!</h4></a></li><li style="padding: 10px; text-align: center;">Made with ❤ by <a href="https://loginpress.pro/pricing/?utm_source=loginpress-lite&utm_medium=customizer-footer&utm_campaign=pro-upgrade&utm_content=made-with-link" target="_blank">Adnan</a></li>' ).appendTo( '#sub-accordion-panel-loginpress_panel' );
66
67 }
68 };
69
70 /**
71 * Capture the instance of the Preview since it is private (this has changed in WordPress 4.0).
72 */
73 OldPreviewer = api.Previewer;
74 api.Previewer = OldPreviewer.extend(
75 {
76 initialize: function ( params, options ) {
77 // Store a reference to the Previewer.
78 api.myCustomizerPreviewer.preview = this;
79
80 // Call the old Previewer's initialize function.
81 OldPreviewer.prototype.initialize.call( this, params, options );
82 }
83 }
84 );
85
86 // Document Ready.
87 $(
88 function () {
89 // Initialize our Previewer.
90 api.myCustomizerPreviewer.init();
91 }
92 );
93
94 var intervalId = null; // Store interval ID to stop when needed
95
96 // Function to update background images
97 function updateBackgroundImages() {
98 try {
99 var images = wp.customize( 'loginpress_customization[lp_random_bg_img_upload]' ).get();
100 if ( ! images ) {
101 return;
102 }
103 images = images.split( ',' );
104 } catch (error) {
105 // Error getting images - silently fail
106 return;
107 }
108
109 if (images.length === 0) {
110 return;
111 }
112
113 var currentIndex = 0;
114 var imagesLoaded = 0;
115 var imagesToLoad = images.length;
116 var imagesPreloaded = [];
117
118 function preloadImages() {
119 if (imagesLoaded < imagesToLoad) {
120 var image = new Image();
121 image.src = images[imagesLoaded];
122 image.onload = function () {
123 imagesPreloaded.push( image.src );
124 imagesLoaded++;
125 preloadImages();
126 };
127 image.onerror = function () {
128 // Error loading image - continue with next
129 imagesLoaded++;
130 preloadImages();
131 };
132 }
133 }
134
135 function changeBackground() {
136 currentIndex = (currentIndex + 1) % imagesToLoad;
137 if ( images[currentIndex] ) {
138 $( '#customize-preview iframe' ).contents().find( 'body.login' ).css( '--background-desktop-image', 'url(' + imagesPreloaded[currentIndex] + ')' );
139 }
140 }
141
142 // Clear any existing interval to avoid memory leaks
143 if (intervalId) {
144 clearInterval( intervalId );
145 }
146
147 // Preload all images
148 preloadImages();
149
150 // Start cycling through images after all images have been preloaded
151 intervalId = setInterval(
152 function () {
153 if (imagesLoaded === imagesToLoad) {
154 changeBackground();
155 }
156 },
157 5000
158 );
159 }
160
161 // Function to stop changing backgrounds and restore original settings.
162 function stopBackgroundImages() {
163 clearInterval( intervalId );
164
165 // Get current background settings
166 var displayBg = wp.customize( 'loginpress_customization[loginpress_display_bg]' ).get();
167 var displayBgVideo = wp.customize( 'loginpress_customization[loginpress_display_bg_video]' ).get();
168 var bgColor = wp.customize( 'loginpress_customization[setting_background_color]' ).get();
169 var bgImage = wp.customize( 'loginpress_customization[setting_background]' ).get();
170 var galleryBg = wp.customize( 'loginpress_customization[gallery_background]' ).get();
171
172 var $body = $( '#customize-preview iframe' ).contents().find( 'body.login' );
173
174 // Clear random background override
175 $body.css( '--background-desktop-image', '' );
176 $body.css( 'background-color', '' );
177
178 // Restore background video if enabled
179 if ( displayBgVideo ) {
180 // Background video logic would go here if needed
181 // For now, just ensure video container is visible
182 }
183
184 // Restore background image if enabled
185 if ( displayBg ) {
186 var finalBgImage = bgImage || galleryBg;
187 if ( finalBgImage ) {
188 $body.css( '--background-desktop-image', 'url(' + finalBgImage + ')' );
189 }
190 }
191
192 // Restore background color if no background image
193 if ( ! displayBg && bgColor ) {
194 $body.css( 'background-color', bgColor );
195 }
196 }
197
198 // Combined listener for both random background toggle and image list changes
199 function handleRandomBackgroundChanges() {
200 var isEnabled = wp.customize( 'loginpress_customization[lp_random_bg_img_check]' ).get();
201 if ( isEnabled ) {
202 updateBackgroundImages();
203 } else {
204 stopBackgroundImages();
205 }
206 }
207
208 // Listen for changes in the toggle setting
209 wp.customize(
210 'loginpress_customization[lp_random_bg_img_check]',
211 function ( value ) {
212 value.bind( handleRandomBackgroundChanges );
213 }
214 );
215
216 // Listen for changes in background images list
217 wp.customize(
218 'loginpress_customization[lp_random_bg_img_upload]',
219 function ( value ) {
220 value.bind( handleRandomBackgroundChanges );
221 }
222 );
223
224 } )( wp, jQuery );
225
226
227 jQuery( document ).ready(
228 function ($) {
229 $( '.loginpress-upload-gallery-button' ).on(
230 'click',
231 function (e) {
232 e.preventDefault();
233
234 var button = $( this );
235 var upload_custom_img = wp.media(
236 {
237 title: loginpress_customizer.translations['title'],
238 button: {
239 text: loginpress_customizer.translations['btn_text']
240 },
241 multiple: true
242 }
243 ).on(
244 'select',
245 function () {
246 var attachments = upload_custom_img.state().get( 'selection' ).map(
247 function (attachment) {
248 attachment = attachment.toJSON();
249 return attachment.url;
250 }
251 );
252
253 var galleryList = button.siblings( '.loginpress-gallery-list' );
254 var hiddenField = button.siblings( 'input[type="hidden"]' );
255 var currentImages = hiddenField.val().split( ',' );
256
257 $.each(
258 attachments,
259 function (index, attachment) {
260 if ($.inArray( attachment, currentImages ) === -1) { // Check if the image is already selected
261 galleryList.append( '<li class="loginpress-gallery-item" style="width: 30%; display:inline-block; padding: 4px;"><img src="' + attachment + '" /><span class="remove-image" style="color:red; cursor: pointer;"></br>x</span></li>' );
262 currentImages.push( attachment );
263 }
264 }
265 );
266
267 hiddenField.val( currentImages.join( ',' ) ).trigger( 'change' ); // Trigger change event
268 }
269 ).open();
270 }
271 );
272
273 $( document ).on(
274 'click',
275 '.loginpress-gallery-item .remove-image',
276 function () {
277 var button = $( this );
278 var image = button.siblings( 'img' ).attr( 'src' );
279 var galleryList = button.closest( '.loginpress-gallery-list' );
280 var hiddenField = galleryList.siblings( 'input[type="hidden"]' );
281 var currentImages = hiddenField.val().split( ',' );
282
283 currentImages = currentImages.filter(
284 function (item) {
285 return item !== image;
286 }
287 );
288
289 hiddenField.val( currentImages.join( ',' ) ).trigger( 'change' ); // Trigger change event
290
291 button.parent().remove();
292 }
293 );
294 }
295 );
296