🏠 Root
/
home
/
artorgp
/
www
/
wp-content
/
plugins
/
login-with-ajax
/
templates
/
Editing: login-with-ajax.js
/* Customize from here downwards */ /** @param {jQuery} jQuery */ jQuery(document).ready( function($) { // some backwards compatability here - will deprecate in 5.0 if( $('#LoginWithAjax').length > 0 ){ $('#LoginWithAjax').addClass('lwa'); $('#LoginWithAjax_Status').addClass('lwa-status'); $('#LoginWithAjax_Register').addClass('lwa-register'); $('#LoginWithAjax_Remember').addClass('lwa-remember'); $('#LoginWithAjax_Links_Remember').addClass('lwa-links-remember'); $('#LoginWithAjax_Links_Remember_Cancel').addClass('lwa-links-remember-cancel'); $('#LoginWithAjax_Form').addClass('lwa-form'); } // compatibility workaround, first 5 elements will take an ID $('.lwa-bones').each( function(i){ $(this).attr('id','lwa-'+ (i+1)); }); /* * links * add action input htmls */ //Remember and register form AJAX $(document).on('submit', 'form.lwa-form, form.lwa-remember, div.lwa-register form', function( event ){ event.preventDefault(); LoginWithAJAX.submit(this); }); //Catch login actions $(document).on('lwa_login', /** * Fired when users logs in and decides to either replace the widget or reload the page. * @param {Event} event * @param {Object} data * @param {jQuery} form */ function(event, data, form){ if( data.result === true && (data.skip === 'undefined' || !data.skip) ){ //Login Successful - Extra stuff to do if( data.widget != null ){ $.get( data.widget, function(widget_result) { let newWidget = form.closest('.lwa'); form.closest('.lwa').innerHTML = widget_result; let $newWidget = $(newWidget); var lwaSub = $newWidget.find('.lwa-title').show(); var lwaOrg = $newWidget.parent().find('.lwa-title'); lwaOrg.replaceWith(lwaSub); }); }else{ if(data.redirect == null){ window.location.reload(); }else{ let currentUrl = window.location.href; window.location = data.redirect; if( currentUrl.split('#')[0] === data.redirect.split('#')[0] ){ window.location.reload(); } } } } } ); // Modal $('.lwa-modal-trigger').each( function(i,e){ $(e).find('.lwa-modal-trigger-el, button, a').first().on('click', function( e ){ e.preventDefault(); var modal_id = $(this).closest('.lwa-modal-trigger').first().data('modal-id'); $('#'+modal_id+', #'+modal_id+' .lwa-modal-popup').addClass('active'); }); }); $('a.lwa-modal-trigger[data-modal-id], button.lwa-modal-trigger[data-modal-id]').on('click', function( e ){ e.preventDefault(); var modal_id = $(this).closest('.lwa-modal-trigger').first().data('modal-id'); $('#'+modal_id+', #'+modal_id+' .lwa-modal-popup').addClass('active'); }); $('.lwa-modal-overlay').each( function(i,e){ $('body').append(e); }); $('.lwa-modal-overlay .lwa-close-modal').click( function(e){ let modal = $(this).closest('.lwa-modal-overlay'); if( !modal.attr('data-prevent-close') ) { modal.removeClass('active').find('.lwa-modal-popup').removeClass('active'); $(document).triggerHandler('lwa_modal_close', [modal]); } }); $('.lwa-modal-overlay').click( function(e){ var target = $(e.target); if( target.hasClass('lwa-modal-overlay') ) { let modal = $(this); if( !modal.attr('data-prevent-close') ){ modal.removeClass('active').find('.lwa-modal-popup').removeClass('active'); $(document).triggerHandler('lwa_modal_close', modal); } } }); //Visual Effects for hidden items $(document).on('click', '.lwa-links-register-inline-cancel, .lwa-links-remember-cancel', function(event){ event.preventDefault(); let lwa = $(this).closest('.lwa'); lwa.find('.lwa-form').slideDown('slow'); lwa.find('.lwa-remember, .lwa-register').slideUp('slow'); }); //Register $(document).on('click', '.lwa-links-register-inline', function(event){ let lwa = $(this).closest('.lwa'); var register_form = lwa.find('.lwa-register'); if( register_form.length > 0 ){ event.preventDefault(); register_form.slideDown('slow'); lwa.find('.lwa-remember, .lwa-form').slideUp('slow'); } }); //Remember $(document).on('click', '.lwa-links-remember', function(event){ let lwa = $(this).closest('.lwa'); var remember_form = lwa.find('.lwa-remember'); if( remember_form.length > 0 ){ event.preventDefault(); remember_form.slideDown('slow'); lwa.find('.lwa-register, .lwa-form').slideUp('slow'); } }); // initialize minimalistic themes if( $('.lwa-minimalistic').length ){ lwa_init_minimalistic(); } $(document).triggerHandler('lwa_loaded'); document.dispatchEvent( new CustomEvent('lwa_loaded') ); }); const lwa_init_minimalistic = function(){ jQuery('.lwa-minimalistic .input-field label').each( function(i){ // move the label above the input jQuery(this).next('input').after(this); }); // clean up WP-style inputs jQuery('.lwa-minimalistic p > label > input').each( function(i,el){ let input = jQuery(this); let label = input.parent(); let p = label.parent(); let div = jQuery('<div class="input-field"></div>'); // move the label above the input, remove any br's input.appendTo(div); label.appendTo(div); label.find('br').remove(); if( !input.attr('placeholder') ){ input.attr('placeholder', label.text()); } p.replaceWith(div); }); }; /** * Various functions related to the submission and execution of a Login With AJAX form. * @type {{submit: LoginWithAJAX.submit, addStatusElement: LoginWithAJAX.addStatusElement, handleStatus: LoginWithAJAX.handleStatus, finish: LoginWithAJAX.finish}} */ const LoginWithAJAX = { /** * Handles submission of a LWA form. * @param {jQuery} form Form object which will be submitted. * @param {object} args Additional args passed as an object or serializeArray() comopatbible format for merging in. * @param {boolean} override If set to true then only args will be used to submit AJAX request, form data will be ignored. * @param {boolean} options If set to true then only args will be used to submit AJAX request, form data will be ignored. */ submit : async function( form, args = null, override = null, options = {} ){ //Stop event, add loading pic... if( !(form instanceof jQuery) ) form = jQuery(form); var response = { result : null, skip : false }; var statusElement = LoginWithAJAX.addStatusElement(form); jQuery(document).triggerHandler('lwa_pre_ajax', [response, form, statusElement]); if( response.result === null ) { var ajaxFlag = form.find('.lwa-ajax'); if( ajaxFlag.length == 0 ){ ajaxFlag = jQuery('<input class="lwa-ajax" name="lwa" type="hidden" value="1">'); form.prepend(ajaxFlag); } var ajaxActionFlag = form.find('[name="action"]'); if( ajaxActionFlag.length == 0 ){ ajaxActionFlag = jQuery('<input class="lwa-ajax-action" name="action" type="hidden" value="login-with-ajax">'); form.prepend(ajaxActionFlag); } else { ajaxActionFlag.value = 'login-with-ajax'; } if( !('spinner' in options) || options.spinner ) { LoginWithAJAX.start( form ); } // Prepare form data, merge in data from args if passed let form_data; if( override ){ form_data = [{'name':'lwa', 'value' : 1}, {'name':'action', 'value' : 'login-with-ajax'}]; }else{ form_data = form.serializeArray(); } if( args !== null ){ if( !Array.isArray(args) ){ // merge in args via each() Object.keys(args).forEach( function(key){ form_data.unshift({'name':key, 'value' : args[key]}); }); }else{ // merge directly form_data.push.apply(form_data, args); } } let form_string = jQuery.param(form_data); // Make Ajax Call let form_action = ( typeof LWA === 'undefined' ) ? form.attr('action') : LWA.ajaxurl; // Devs, assume this return a regular JS promise, not a jqXHR object, for future-proofing as one day this will be converted into a JS vanilla fetch response return jQuery.ajax({ type: 'POST', url: form_action, data: form_string, success: function (response) { jQuery(document).triggerHandler('lwa_' + response.action, [response, form, statusElement]); document.dispatchEvent( new CustomEvent('lwa_submit_' + response.action, {detail: {response: response, form: form[0], statusElement: statusElement[0]}}) ); if( response.skip === 'undefined' || !response.skip ){ LoginWithAJAX.handleStatus(response, statusElement); } }, error: function( jqXHR, textStatus, errorThrown ) { response.result = false; jQuery(document).triggerHandler('lwa_ajax_error', [response, jqXHR, textStatus, errorThrown, form, statusElement]); document.dispatchEvent( new CustomEvent('lwa_submit_error', {detail: {response: response, jqXHR: jqXHR, textStatus: textStatus, errorThrown: errorThrown, form: form[0], statusElement: statusElement[0]}}) ); if( !response.skip ) { response.error = textStatus + ' : ' + errorThrown; LoginWithAJAX.handleStatus(response, statusElement); }else{ LoginWithAJAX.finish(form); } }, complete: function( jqXHR, textStatus ){ jQuery(document).triggerHandler('lwa_ajax_complete', [jqXHR, textStatus, form, statusElement]); document.dispatchEvent( new CustomEvent('lwa_submit_complete', {detail: {jqXHR: jqXHR, textStatus: textStatus, form: form[0], statusElement: statusElement[0]}}) ); if( textStatus !== 'success' && textStatus !== 'error' ){ // this is already executed on success or error LoginWithAJAX.finish(form); } }, dataType: 'jsonp' }); }else{ if( !response.skip ) { LoginWithAJAX.handleStatus(response, statusElement); } } }, /** * Handles a status element of a form based on the return data of an AJAX call * @param {Object} response The response object of an AJAX call. * @param {jQuery} statusElement The status element in a form where error or success messages are to be added based on the response. */ handleStatus : function( response, statusElement ){ this.finish(); statusElement = jQuery(statusElement); if(response.result === true){ //Login Successful statusElement.removeClass('lwa-status-invalid').addClass('lwa-status-confirm').html(response.message); //modify status content }else if( response.result === false ){ //Login Failed statusElement.removeClass('lwa-status-confirm').addClass('lwa-status-invalid').html(response.error); //modify status content //We assume a link in the status message is for a forgotten password statusElement.find('a').on('click', function(event){ var remember_form = jQuery(this).parents('.lwa').find('form.lwa-remember'); if( remember_form.length > 0 ){ event.preventDefault(); remember_form.show('slow'); } }); }else{ //If there already is an error element, replace text contents, otherwise create a new one and insert it statusElement.removeClass('lwa-status-confirm').addClass('lwa-status-invalid').html('An error has occured. Please try again.'); //modify status content } jQuery(document).triggerHandler('lwa_handleStatus', [response, statusElement]); }, /** * Prepends a status element to the supplied form element. * @param {jQuery} form The form element to add the status element to. * @return {jQuery} The status element jQuery object. */ addStatusElement : function( form ){ let $form = jQuery(form); let statusElement = LoginWithAJAX.getStatusElement($form); if( statusElement === null ){ statusElement = jQuery('<span class="lwa-status" role="alert"></span>'); $form.prepend(statusElement); } jQuery(document).triggerHandler('lwa_addStatusElement', [$form, statusElement]); return statusElement; }, getStatusElement : function( form ){ let $form = jQuery(form); let statusElement = $form.find('.lwa-status'); if( statusElement.length > 0 ) { return statusElement; } return null; }, start : function( wrapper ){ let $wrapper = jQuery(wrapper); if( $wrapper.hasClass('lwa') ){ $wrapper.addClass('lwa-is-working'); }else{ $wrapper.closest('.lwa').addClass('lwa-is-working'); } jQuery('<div class="lwa-loading"></div>').prependTo($wrapper.closest('.lwa-wrapper')); }, /** * Remove spinners etc. from all forms, or the form wrapper if supplied. * @param {jQuery} wrapper Form or wrapper element contaning the spinner. */ finish : function( wrapper = null ){ if( wrapper ) { let $wrapper = jQuery(wrapper); } jQuery('.lwa-loading').remove(); if( wrapper && $wrapper.hasClass('lwa-is-working') ){ $wrapper.removeClass('lwa-is-working'); }else if( wrapper ){ $wrapper.closest('.lwa-is-working').removeClass('lwa-is-working'); }else{ jQuery('.lwa-is-working').removeClass('lwa-is-working'); } }, }; // shortcut - legacy const lwaAjax = LoginWithAJAX.handleStatus;
Save
Cancel