JAVASCRIPT   113
wizard
Guest on 7th May 2022 04:03:46 PM


  1. /*global ajaxurl, _ */
  2.  
  3. var WPMLCore = WPMLCore || {};
  4.  
  5. WPMLCore.wizardFramework = function ( $, wizardImplementation ) {
  6.         "use strict";
  7.  
  8.         var self = this;
  9.  
  10.         var init = function () {
  11.  
  12.                 self.storage = {};
  13.  
  14.                 self.backButton = $( '.js-wizard-back' );
  15.                 self.nextButton = $( '.js-wizard-next' );
  16.                 self.stepContent = $( '.js-wizard-step-content' );
  17.                 self.nonce = $( '.js-wpml-wizard' ).data( 'nonce' );
  18.                 self.steps = $( '.js-wizard-step' );
  19.  
  20.                 self.currentStep = self.getCurrentStep();
  21.                 self.getCurrentStepIndex();
  22.  
  23.                 self.initializeButtons();
  24.  
  25.                 wizardImplementation.notifyCurrentStep( self.currentStep );
  26.  
  27.                 self.fetchContent();
  28.  
  29.                 self.hideNotices();
  30.                 self.hideScreenOptions();
  31.         };
  32.  
  33.         var showElement = function ( element, state ) {
  34.                 if ( state ) {
  35.                         element.show();
  36.                 } else {
  37.                         element.hide();
  38.                 }
  39.         };
  40.  
  41.         self.moveToStep = function ( newStep ) {
  42.                 var beforeCurrentStepClass = 'wizard-active-step';
  43.                 self.steps.removeClass( beforeCurrentStepClass );
  44.                 self.steps.each( function ( index ) {
  45.                         if ( index === self.currentStepIndex ) {
  46.                                 $( this ).removeClass( 'wizard-current-step' );
  47.                         }
  48.                         if ( index === newStep ) {
  49.                                 self.currentStep = $( this ).addClass( 'wizard-current-step' ).data( 'step-slug' );
  50.                                 beforeCurrentStepClass = '';
  51.                         }
  52.                         if ( beforeCurrentStepClass ) {
  53.                                 $( this ).addClass( beforeCurrentStepClass );
  54.                         }
  55.                 } );
  56.  
  57.                 self.currentStepIndex = newStep;
  58.  
  59.                 self.setBackButtonState();
  60.                 self.setNextButtonState();
  61.  
  62.                 self.fetchContent();
  63.  
  64.         };
  65.  
  66.  
  67.         self.showSteps = function ( state ) {
  68.                 showElement( $( '.js-wizard-steps-container' ), state );
  69.         };
  70.  
  71.         self.moveToNextStep = function ( e ) {
  72.                 wizardImplementation.isOkToMoveToNextStep( self.currentStep, function () {
  73.                         self.moveToStep( self.currentStepIndex + 1 );
  74.                 } );
  75.         };
  76.  
  77.         self.moveToPreviousStep = function ( e ) {
  78.                 self.moveToStep( self.currentStepIndex - 1 );
  79.         };
  80.  
  81.         self.getCurrentStepIndex = function () {
  82.                 self.steps.each( function ( index ) {
  83.                         if ( self.currentStep === $( this ).data( 'step-slug' ) ) {
  84.                                 self.currentStepIndex = index;
  85.                         }
  86.                 } );
  87.         };
  88.  
  89.         self.getCurrentStep = function () {
  90.                 return self.stepContent.data( 'current-step' );
  91.         };
  92.  
  93.         self.initializeButtons = function () {
  94.                 self.backButton.on( 'click', self.moveToPreviousStep );
  95.                 self.nextButton.on( 'click', self.moveToNextStep );
  96.  
  97.                 self.setBackButtonState();
  98.                 self.setNextButtonState();
  99.         };
  100.  
  101.         self.setBackButtonState = function () {
  102.                 if ( self.currentStepIndex === 0 ) {
  103.                         self.backButton.attr( 'disabled', 'disabled' );
  104.                 } else {
  105.                         self.backButton.removeAttr( 'disabled' );
  106.                 }
  107.         };
  108.  
  109.         self.setNextButtonState = function () {
  110.                 self.enableNextButton( self.currentStepIndex !== self.steps.length - 1 );
  111.         };
  112.  
  113.         self.fetchContent = function ( data ) {
  114.                 if ( !data ) {
  115.                         data = {};
  116.                 }
  117.                 data = _.extend( data, {
  118.                         action: 'wpml_wizard_fetch_content',
  119.                         step_slug: self.currentStep,
  120.                         nonce: self.nonce
  121.                 } );
  122.                 $.ajax( {
  123.                         type: 'POST',
  124.                         url: ajaxurl,
  125.                         dataType: 'json',
  126.                         data: data,
  127.                         success: function ( response ) {
  128.                                 $( '.js-wpml-wizard' ).show();
  129.                                 if ( response.success ) {
  130.                                         self.stepContent.html( response.data );
  131.                                         wizardImplementation.notifyContentFetched( self.currentStep, self.stepContent );
  132.                                 }
  133.                         }
  134.                 } );
  135.         };
  136.  
  137.         self.showBackButton = function ( state ) {
  138.                 showElement( self.backButton, state );
  139.         };
  140.  
  141.         self.showNextButton = function ( state ) {
  142.                 showElement( self.nextButton, state );
  143.         };
  144.  
  145.         self.setNextButtonText = function ( text ) {
  146.                 self.nextButton.html( text );
  147.         };
  148.  
  149.         self.enableNextButton = function ( state ) {
  150.                 if ( state ) {
  151.                         self.nextButton.removeAttr( 'disabled' );
  152.                 } else {
  153.                         self.nextButton.attr( 'disabled', 'disabled' );
  154.                 }
  155.         };
  156.  
  157.         self.setNextButtonPrimary = function ( state ) {
  158.                 if ( state ) {
  159.                         self.nextButton.addClass( 'button-primary' ).removeClass( 'button-secondary' );
  160.                 } else {
  161.                         self.nextButton.addClass( 'button-secondary' ).removeClass( 'button-primary' );
  162.                 }
  163.         };
  164.  
  165.         self.triggerNextStep = function () {
  166.                 self.nextButton.trigger( 'click' );
  167.         };
  168.  
  169.         self.storeData = function ( key, data ) {
  170.                 self.storage[ key ] = data;
  171.         };
  172.  
  173.         self.getData = function ( key, defaultValue ) {
  174.                 if ( self.storage[ key ] ) {
  175.                         return self.storage[ key ];
  176.                 } else {
  177.                         return defaultValue;
  178.                 }
  179.         };
  180.  
  181.         self.hideNotices = function () {
  182.                 $( '.otgs-notice, .icl_admin_message' ).hide();
  183.         };
  184.  
  185.         self.hideScreenOptions = function () {
  186.                 $( '#screen-meta-links' ).hide();
  187.         };
  188.  
  189.         init();
  190.  
  191. };
  192.  
  193. WPMLCore.wizardFrameworkFactory = {
  194.         create: function ( $, wizardImplementation ) {
  195.                 "use strict";
  196.  
  197.                 return new WPMLCore.wizardFramework( $, wizardImplementation );
  198.         }
  199. };
Raw Paste

Login or Register to edit or fork this paste. It's free.