github.com/insionng/yougam@v0.0.0-20170714101924-2bc18d833463/public/root/js/jquery.wizard.js (about)

     1  /*
     2   * jQuery wizard plug-in 3.0.5
     3   *
     4   *
     5   * Copyright (c) 2011 Jan Sundman (jan.sundman[at]aland.net)
     6   *
     7   * http://www.thecodemine.org
     8   *
     9   * Licensed under the MIT licens:
    10   *   http://www.opensource.org/licenses/mit-license.php
    11   *
    12   */
    13  
    14  
    15  (function($){
    16  	$.widget("ui.formwizard", {
    17  
    18  		_init: function() {
    19  
    20  			var wizard = this;
    21  			var formOptionsSuccess = this.options.formOptions.success;
    22  			var formOptionsComplete = this.options.formOptions.complete;
    23  			var formOptionsBeforeSend = this.options.formOptions.beforeSend;
    24  			var formOptionsBeforeSubmit = this.options.formOptions.beforeSubmit;
    25  			var formOptionsBeforeSerialize = this.options.formOptions.beforeSerialize;
    26  			this.options.formOptions = $.extend(this.options.formOptions,{
    27  				success	: function(responseText, textStatus, xhr){
    28  					if(formOptionsSuccess){
    29  						formOptionsSuccess(responseText, textStatus, xhr);
    30  					}
    31  					if(wizard.options.formOptions && wizard.options.formOptions.resetForm || !wizard.options.formOptions){
    32  						wizard._reset();
    33  					}
    34  				},
    35  				complete : function(xhr, textStatus){
    36  					if(formOptionsComplete){
    37  						formOptionsComplete(xhr, textStatus);
    38  					}
    39  					wizard._enableNavigation();
    40  				},
    41  				beforeSubmit : function(arr, theForm, options) {
    42  					if(formOptionsBeforeSubmit){
    43  						var shouldSubmit = formOptionsBeforeSubmit(arr, theForm, options);
    44  						if(!shouldSubmit)
    45  							wizard._enableNavigation();
    46  						return shouldSubmit;
    47  					}
    48  				},
    49  				beforeSend : function(xhr) {
    50  					if(formOptionsBeforeSend){
    51  						var shouldSubmit = formOptionsBeforeSend(xhr);
    52  						if(!shouldSubmit)
    53  							wizard._enableNavigation();
    54  						return shouldSubmit;
    55  					}
    56  				},
    57  				beforeSerialize: function(form, options) {
    58  					if(formOptionsBeforeSerialize){
    59  						var shouldSubmit = formOptionsBeforeSerialize(form, options);
    60  						if(!shouldSubmit)
    61  							wizard._enableNavigation();
    62  						return shouldSubmit;
    63  					}
    64  				}
    65  			});
    66  
    67  			this.steps = this.element.find(".step").hide();
    68  
    69  			this.firstStep = this.steps.eq(0).attr("id");
    70  			this.activatedSteps = new Array();
    71  			this.isLastStep = false;
    72  			this.previousStep = undefined;
    73  			this.currentStep = this.steps.eq(0).attr("id");
    74  			this.nextButton	= this.element.find(this.options.next)
    75  					.click(function() {
    76  						return wizard._next();
    77  					});
    78  
    79  			this.nextButtonInitinalValue = this.nextButton.val();
    80  			this.nextButton.val(this.options.textNext);
    81  
    82  				this.backButton	= this.element.find(this.options.back)
    83  					.click(function() {
    84  						wizard._back();return false;
    85  					});
    86  
    87  				this.backButtonInitinalValue = this.backButton.val();
    88  				this.backButton.val(this.options.textBack);
    89  
    90  			if(this.options.validationEnabled && jQuery().validate  == undefined){
    91  				this.options.validationEnabled = false;
    92  				if( (window['console'] !== undefined) ){
    93  					console.log("%s", "validationEnabled option set, but the validation plugin is not included");
    94  				}
    95  			}else if(this.options.validationEnabled){
    96  				this.element.validate(this.options.validationOptions);
    97  			}
    98  			if(this.options.formPluginEnabled && jQuery().ajaxSubmit == undefined){
    99  				this.options.formPluginEnabled = false;
   100  				if( (window['console'] !== undefined) ){
   101  					console.log("%s", "formPluginEnabled option set but the form plugin is not included");
   102  				}
   103  			}
   104  
   105  			if(this.options.disableInputFields == true){
   106  				$(this.steps).find(":input:not('.wizard-ignore')").attr("disabled","disabled");
   107  			}
   108  
   109  			if(this.options.historyEnabled){
   110  				$(window).bind('hashchange', undefined, function(event){
   111  					var hashStep = event.getState( "_" + $(wizard.element).attr( 'id' )) || wizard.firstStep;
   112  					if(hashStep !== wizard.currentStep){
   113  						if(wizard.options.validationEnabled && hashStep === wizard._navigate(wizard.currentStep)){
   114  							if(!wizard.element.valid()){
   115  								wizard._updateHistory(wizard.currentStep);
   116  								wizard.element.validate().focusInvalid();
   117  
   118  								return false;
   119  							}
   120  						}
   121  						if(hashStep !== wizard.currentStep)
   122  							wizard._show(hashStep);
   123  					}
   124  				});
   125  			}
   126  
   127  			this.element.addClass("ui-formwizard");
   128  			this.element.find(":input").addClass("ui-wizard-content");
   129  			this.steps.addClass("ui-formwizard-content");
   130  			this.backButton.addClass("ui-formwizard-button ui-wizard-content");
   131  			this.nextButton.addClass("ui-formwizard-button ui-wizard-content");
   132  
   133  			if(!this.options.disableUIStyles){
   134  				this.element.addClass("ui-helper-reset ui-widget ui-widget-content ui-helper-reset ui-corner-all");
   135  				this.element.find(":input").addClass("ui-helper-reset ui-state-default");
   136  				this.steps.addClass("ui-helper-reset ui-corner-all");
   137  				this.backButton.addClass("ui-helper-reset ui-state-default");
   138  				this.nextButton.addClass("ui-helper-reset ui-state-default");
   139  			}
   140  			this._show(undefined);
   141  			return $(this);
   142  		},
   143  
   144  		_next : function(){
   145  			if(this.options.validationEnabled){
   146  				if(!this.element.valid()){
   147  					this.element.validate().focusInvalid();
   148  					return false;
   149  				}
   150  			}
   151  
   152  			if(this.options.remoteAjax != undefined){
   153  				var options = this.options.remoteAjax[this.currentStep];
   154  				var wizard = this;
   155  				if(options !== undefined){
   156  					var success = options.success;
   157  					var beforeSend = options.beforeSend;
   158  					var complete = options.complete;
   159  
   160  					options = $.extend({},options,{
   161  						success: function(data, statusText){
   162  							if((success !== undefined && success(data, statusText)) || (success == undefined)){
   163  								wizard._continueToNextStep();
   164  							}
   165  						},
   166  						beforeSend : function(xhr){
   167  							wizard._disableNavigation();
   168  							if(beforeSend !== undefined)
   169  								beforeSend(xhr);
   170  							$(wizard.element).trigger('before_remote_ajax', {"currentStep" : wizard.currentStep});
   171  						},
   172  						complete : function(xhr, statusText){
   173  							if(complete !== undefined)
   174  								complete(xhr, statusText);
   175  							$(wizard.element).trigger('after_remote_ajax', {"currentStep" : wizard.currentStep});
   176  							wizard._enableNavigation();
   177  						}
   178  					})
   179  					this.element.ajaxSubmit(options);
   180  					return false;
   181  				}
   182  			}
   183  
   184  			return this._continueToNextStep();
   185  		},
   186  
   187  		_back : function(){
   188  			if(this.activatedSteps.length > 0){
   189  				if(this.options.historyEnabled){
   190  					this._updateHistory(this.activatedSteps[this.activatedSteps.length - 2]);
   191  				}else{
   192  					this._show(this.activatedSteps[this.activatedSteps.length - 2], true);
   193  				}
   194  			}
   195  			return false;
   196  		},
   197  
   198  		_continueToNextStep : function(){
   199  			if(this.isLastStep){
   200  				for(var i = 0; i < this.activatedSteps.length; i++){
   201  					this.steps.filter("#" + this.activatedSteps[i]).find(":input").not(".wizard-ignore").removeAttr("disabled");
   202  				}
   203  				if(!this.options.formPluginEnabled){
   204  					return true;
   205  				}else{
   206  					this._disableNavigation();
   207  					this.element.ajaxSubmit(this.options.formOptions);
   208  					return false;
   209  				}
   210  			}
   211  
   212  			var step = this._navigate(this.currentStep);
   213  			if(step == this.currentStep){
   214  				return false;
   215  			}
   216  			if(this.options.historyEnabled){
   217  				this._updateHistory(step);
   218  			}else{
   219  				this._show(step, true);
   220  			}
   221  			return false;
   222  		},
   223  
   224  		_updateHistory : function(step){
   225  			var state = {};
   226  			state["_" + $(this.element).attr('id')] = step;
   227  			$.bbq.pushState(state);
   228  		},
   229  
   230  		_disableNavigation : function(){
   231  			this.nextButton.attr("disabled","disabled");
   232  			this.backButton.attr("disabled","disabled");
   233  			if(!this.options.disableUIStyles){
   234  				this.nextButton.removeClass("ui-state-active").addClass("ui-state-disabled");
   235  				this.backButton.removeClass("ui-state-active").addClass("ui-state-disabled");
   236  			}
   237  		},
   238  
   239  		_enableNavigation : function(){
   240  			if(this.isLastStep){
   241  				this.nextButton.val(this.options.textSubmit);
   242  			}else{
   243  				this.nextButton.val(this.options.textNext);
   244  			}
   245  
   246  			if($.trim(this.currentStep) !== this.steps.eq(0).attr("id")){
   247  				this.backButton.removeAttr("disabled");
   248  				if(!this.options.disableUIStyles){
   249  					this.backButton.removeClass("ui-state-disabled").addClass("ui-state-active");
   250  				}
   251  			}
   252  
   253  			this.nextButton.removeAttr("disabled");
   254  			if(!this.options.disableUIStyles){
   255  				this.nextButton.removeClass("ui-state-disabled").addClass("ui-state-active");
   256  			}
   257  		},
   258  
   259  		_animate : function(oldStep, newStep, stepShownCallback){
   260  			this._disableNavigation();
   261  			var old = this.steps.filter("#" + oldStep);
   262  			var current = this.steps.filter("#" + newStep);
   263  			old.find(":input").not(".wizard-ignore").attr("disabled","disabled");
   264  			current.find(":input").not(".wizard-ignore").removeAttr("disabled");
   265  			var wizard = this;
   266  			old.animate(wizard.options.outAnimation, wizard.options.outDuration, wizard.options.easing, function(){
   267  				current.animate(wizard.options.inAnimation, wizard.options.inDuration, wizard.options.easing, function(){
   268  					if(wizard.options.focusFirstInput)
   269  						current.find(":input:first").focus();
   270  					wizard._enableNavigation();
   271  
   272  					stepShownCallback.apply(wizard);
   273  				});
   274  				return;
   275  			});
   276  		},
   277  
   278  		_checkIflastStep : function(step){
   279  			this.isLastStep = false;
   280  			if($("#" + step).hasClass(this.options.submitStepClass) || this.steps.filter(":last").attr("id") == step){
   281  				this.isLastStep = true;
   282  			}
   283  		},
   284  
   285  		_getLink : function(step){
   286  			var link = undefined;
   287  			var links = this.steps.filter("#" + step).find(this.options.linkClass);
   288  
   289  			if(links != undefined){
   290  				if(links.filter(":radio,:checkbox").size() > 0){
   291  					link = links.filter(this.options.linkClass + ":checked").val();
   292  				}else{
   293  					link = $(links).val();
   294  				}
   295  			}
   296  			return link;
   297  		},
   298  
   299  		_navigate : function(step){
   300  			var link = this._getLink(step);
   301  			if(link != undefined){
   302  				if((link != "" && link != null && link != undefined) && this.steps.filter("#" + link).attr("id") != undefined){
   303  					return link;
   304  				}
   305  				return this.currentStep;
   306  			}else if(link == undefined && !this.isLastStep){
   307  				var step1 =  this.steps.filter("#" + step).next().attr("id");
   308  				return step1;
   309  			}
   310  		},
   311  
   312  		_show : function(step){
   313  			var backwards = false;
   314  			var triggerStepShown = step !== undefined;
   315  			if(step == undefined || step == ""){
   316  					this.activatedSteps.pop();
   317  					step = this.firstStep;
   318  					this.activatedSteps.push(step);
   319  			}else{
   320  				if($.inArray(step, this.activatedSteps) > -1){
   321  					backwards = true;
   322  					this.activatedSteps.pop();
   323  				}else {
   324  					this.activatedSteps.push(step);
   325  				}
   326  			}
   327  
   328  			if(this.currentStep !== step || step === this.firstStep){
   329  				this.previousStep = this.currentStep;
   330  				this._checkIflastStep(step);
   331  				this.currentStep = step;
   332  				var stepShownCallback = function(){if(triggerStepShown)$(this.element).trigger('step_shown', $.extend({"isBackNavigation" : backwards},this._state()));};
   333  				this._animate(this.previousStep, step, stepShownCallback);
   334  			};
   335  
   336  
   337  		},
   338  
   339  	   _reset : function(){
   340  			this.element.resetForm()
   341  			$("label,:input,textarea",this).removeClass("error");
   342  			for(var i = 0; i < this.activatedSteps.length; i++){
   343  				this.steps.filter("#" + this.activatedSteps[i]).hide().find(":input").attr("disabled","disabled");
   344  			}
   345  			this.activatedSteps = new Array();
   346  			this.previousStep = undefined;
   347  			this.isLastStep = false;
   348  			if(this.options.historyEnabled){
   349  				this._updateHistory(this.firstStep);
   350  			}else{
   351  				this._show(this.firstStep);
   352  			}
   353  
   354  		},
   355  
   356  		_state : function(state){
   357  			var currentState = { "settings" : this.options,
   358  				"activatedSteps" : this.activatedSteps,
   359  				"isLastStep" : this.isLastStep,
   360  				"isFirstStep" : this.currentStep === this.firstStep,
   361  				"previousStep" : this.previousStep,
   362  				"currentStep" : this.currentStep,
   363  				"backButton" : this.backButton,
   364  				"nextButton" : this.nextButton,
   365  				"steps" : this.steps,
   366  				"firstStep" : this.firstStep
   367  			}
   368  
   369  			if(state !== undefined)
   370  				return currentState[state];
   371  
   372  			return currentState;
   373  		},
   374  
   375  	  /*Methods*/
   376  
   377  		show : function(step){
   378  			if(this.options.historyEnabled){
   379  				this._updateHistory(step);
   380  			}else{
   381  				this._show(step);
   382  			}
   383  		},
   384  
   385  		state : function(state){
   386  			return this._state(state);
   387  		},
   388  
   389  		reset : function(){
   390  			this._reset();
   391  		},
   392  
   393  		next : function(){
   394  			this._next();
   395  		},
   396  
   397  		back : function(){
   398  			this._back();
   399  		},
   400  
   401  		destroy: function() {
   402  			this.element.find("*").removeAttr("disabled").show();
   403  			this.nextButton.unbind("click").val(this.nextButtonInitinalValue).removeClass("ui-state-disabled").addClass("ui-state-active");
   404  			this.backButton.unbind("click").val(this.backButtonInitinalValue).removeClass("ui-state-disabled").addClass("ui-state-active");
   405  			this.backButtonInitinalValue = undefined;
   406  			this.nextButtonInitinalValue = undefined;
   407  			this.activatedSteps = undefined;
   408  			this.previousStep = undefined;
   409  			this.currentStep = undefined;
   410  			this.isLastStep = undefined;
   411  			this.options = undefined;
   412  			this.nextButton = undefined;
   413  			this.backButton = undefined;
   414  			this.formwizard = undefined;
   415  			this.element = undefined;
   416  			this.steps = undefined;
   417  			this.firstStep = undefined;
   418  		},
   419  
   420  		update_steps : function(){
   421  			this.steps = this.element.find(".step").addClass("ui-formwizard-content");
   422  			this.steps.not("#" + this.currentStep).hide().find(":input").addClass("ui-wizard-content").attr("disabled","disabled");
   423  			this._checkIflastStep(this.currentStep);
   424  			this._enableNavigation();
   425  			if(!this.options.disableUIStyles){
   426  				this.steps.addClass("ui-helper-reset ui-corner-all");
   427  				this.steps.find(":input").addClass("ui-helper-reset ui-state-default");
   428  			}
   429  		},
   430  
   431  		options: {
   432  	   		historyEnabled	: false,
   433  			validationEnabled : false,
   434  			validationOptions : undefined,
   435  			formPluginEnabled : false,
   436  			linkClass	: ".link",
   437  			submitStepClass : "submit_step",
   438  			back : ":reset",
   439  			next : ":submit",
   440  			textSubmit : 'Submit',
   441  			textNext : 'Next',
   442  			textBack : 'Back',
   443  			remoteAjax : undefined,
   444  			inAnimation : {opacity: 'show'},
   445  			outAnimation: {opacity: 'hide'},
   446  			inDuration : 400,
   447  			outDuration: 400,
   448  			easing: 'swing',
   449  			focusFirstInput : false,
   450  			disableInputFields : true,
   451  			formOptions : { reset: true, success: function(data) { if( (window['console'] !== undefined) ){console.log("%s", "form submit successful");}},
   452  			disableUIStyles : false
   453  		}
   454     }
   455   });
   456  })(jQuery);