added misc plugins towards wizards for the portal
[myslice.git] / third-party / smartwizard-1636c86 / js / jquery.smartWizard-2.0.js
diff --git a/third-party/smartwizard-1636c86/js/jquery.smartWizard-2.0.js b/third-party/smartwizard-1636c86/js/jquery.smartWizard-2.0.js
new file mode 100644 (file)
index 0000000..813568b
--- /dev/null
@@ -0,0 +1,358 @@
+/*
+ * SmartWizard 2.0 plugin
+ * jQuery Wizard control Plugin
+ * by Dipu 
+ * 
+ * http://www.techlaboratory.net 
+ * http://tech-laboratory.blogspot.com
+ */
+(function($){
+    $.fn.smartWizard = function(action) {
+        var options = $.extend({}, $.fn.smartWizard.defaults, action);
+        var args = arguments;
+        
+        return this.each(function(){
+                var obj = $(this);
+                var curStepIdx = options.selected;
+                var steps = $("ul > li > a[href^='#step-']", obj); // Get all anchors in this array
+                var contentWidth = 0;
+                var loader,msgBox,elmActionBar,elmStepContainer,btNext,btPrevious,btFinish;
+                
+                elmActionBar = $('.actionBar',obj);
+                if(elmActionBar.length == 0){
+                  elmActionBar = $('<div></div>').addClass("actionBar");                
+                }
+
+                msgBox = $('.msgBox',obj);
+                if(msgBox.length == 0){
+                  msgBox = $('<div class="msgBox"><div class="content"></div><a href="#" class="close">X</a></div>');
+                  elmActionBar.append(msgBox);                
+                }
+                
+                $('.close',msgBox).click(function() {
+                    msgBox.fadeOut("normal");
+                    return false;
+                });
+                
+
+                // Method calling logic
+                if (!action || action === 'init' || typeof action === 'object') {
+                  init();
+                }else if (action === 'showMessage') {
+                  //showMessage(Array.prototype.slice.call( args, 1 ));
+                  var ar =  Array.prototype.slice.call( args, 1 );
+                  showMessage(ar[0]);
+                  return true;
+                }else if (action === 'setError') {
+                  var ar =  Array.prototype.slice.call( args, 1 );
+                  setError(ar[0].stepnum,ar[0].iserror);
+                  return true;
+                }else if (action === 'setDone') {
+                  var ar =  Array.prototype.slice.call( args, 1 );
+                  setDone(ar[0].stepnum,ar[0].isdone);
+                  return true;
+                } else {
+                  $.error( 'Method ' +  action + ' does not exist' );
+                }
+                
+                function init(){
+                  var allDivs =obj.children('div'); //$("div", obj);                
+                  obj.children('ul').addClass("anchor");
+                  allDivs.addClass("content");
+                  // Create Elements
+                  loader = $('<div>Loading</div>').addClass("loader");
+                  elmActionBar = $('<div></div>').addClass("actionBar");
+                  elmStepContainer = $('<div></div>').addClass("stepContainer");
+                  btNext = $('<a>'+options.labelNext+'</a>').attr("href","#").addClass("buttonNext");
+                  btPrevious = $('<a>'+options.labelPrevious+'</a>').attr("href","#").addClass("buttonPrevious");
+                  btFinish = $('<a>'+options.labelFinish+'</a>').attr("href","#").addClass("buttonFinish");
+                  
+                  // highlight steps with errors
+                  if(options.errorSteps && options.errorSteps.length>0){
+                    $.each(options.errorSteps, function(i, n){
+                      setError(n,true);
+                    });
+                  }
+
+
+                  elmStepContainer.append(allDivs);
+                  elmActionBar.append(loader);
+                  obj.append(elmStepContainer);
+                  obj.append(elmActionBar); 
+                  if (options.includeFinishButton) {
+                    elmActionBar.append(btFinish);
+                  }
+                  elmActionBar.append(btNext).append(btPrevious); 
+                  contentWidth = elmStepContainer.width();
+
+                  $(btNext).click(function() {
+                      if($(this).hasClass('buttonDisabled')){
+                        return false;
+                      }
+                      doForwardProgress();
+                      return false;
+                  }); 
+                  $(btPrevious).click(function() {
+                      if($(this).hasClass('buttonDisabled')){
+                        return false;
+                      }
+                      doBackwardProgress();
+                      return false;
+                  }); 
+                  $(btFinish).click(function() {
+                      if(!$(this).hasClass('buttonDisabled')){
+                         if($.isFunction(options.onFinish)) {
+                            if(!options.onFinish.call(this,$(steps))){
+                              return false;
+                            }
+                         }else{
+                           var frm = obj.parents('form');
+                           if(frm && frm.length){
+                             frm.submit();
+                           }                         
+                         }                      
+                      }
+
+                      return false;
+                  }); 
+                  
+                  $(steps).bind("click", function(e){
+                      if(steps.index(this) == curStepIdx){
+                        return false;                    
+                      }
+                      var nextStepIdx = steps.index(this);
+                      var isDone = steps.eq(nextStepIdx).attr("isDone") - 0;
+                      if(isDone == 1){
+                        LoadContent(nextStepIdx);                    
+                      }
+                      return false;
+                  }); 
+                  
+                  // Enable keyboard navigation                 
+                  if(options.keyNavigation){
+                      $(document).keyup(function(e){
+                          if(e.which==39){ // Right Arrow
+                            doForwardProgress();
+                          }else if(e.which==37){ // Left Arrow
+                            doBackwardProgress();
+                          }
+                      });
+                  }
+                  //  Prepare the steps
+                  prepareSteps();
+                  // Show the first slected step
+                  LoadContent(curStepIdx);                  
+                }
+
+                function prepareSteps(){
+                  if(!options.enableAllSteps){
+                    $(steps, obj).removeClass("selected").removeClass("done").addClass("disabled"); 
+                    $(steps, obj).attr("isDone",0);                 
+                  }else{
+                    $(steps, obj).removeClass("selected").removeClass("disabled").addClass("done"); 
+                    $(steps, obj).attr("isDone",1); 
+                  }
+
+                   $(steps, obj).each(function(i){
+                        $($(this).attr("href"), obj).hide();
+                        $(this).attr("rel",i+1);
+                  });
+                }
+                
+                function LoadContent(stepIdx){
+                    var selStep = steps.eq(stepIdx);
+                    var ajaxurl = options.contentURL;
+                    var hasContent =  selStep.data('hasContent');
+                    stepNum = stepIdx+1;
+                    if(ajaxurl && ajaxurl.length>0){
+                       if(options.contentCache && hasContent){
+                           showStep(stepIdx);                          
+                       }else{
+                           $.ajax({
+                            url: ajaxurl,
+                            type: "POST",
+                            data: ({step_number : stepNum}),
+                            dataType: "text",
+                            beforeSend: function(){ loader.show(); },
+                            error: function(){loader.hide();},
+                            success: function(res){ 
+                              loader.hide();       
+                              if(res && res.length>0){  
+                                 selStep.data('hasContent',true);            
+                                 $($(selStep, obj).attr("href"), obj).html(res);
+                                 showStep(stepIdx);
+                              }
+                            }
+                          }); 
+                      }
+                    }else{
+                      showStep(stepIdx);
+                    }
+                }
+                
+                function showStep(stepIdx){
+                    var selStep = steps.eq(stepIdx); 
+                    var curStep = steps.eq(curStepIdx);
+                    if(stepIdx != curStepIdx){
+                      if($.isFunction(options.onLeaveStep)) {
+                        if(!options.onLeaveStep.call(this,$(curStep))){
+                          return false;
+                        }
+                      }
+                    }     
+                    if (options.updateHeight)
+                        elmStepContainer.height($($(selStep, obj).attr("href"), obj).outerHeight());               
+                    if(options.transitionEffect == 'slide'){
+                      $($(curStep, obj).attr("href"), obj).slideUp("fast",function(e){
+                            $($(selStep, obj).attr("href"), obj).slideDown("fast");
+                            curStepIdx =  stepIdx;                        
+                            SetupStep(curStep,selStep);
+                          });
+                    } else if(options.transitionEffect == 'fade'){                      
+                      $($(curStep, obj).attr("href"), obj).fadeOut("fast",function(e){
+                            $($(selStep, obj).attr("href"), obj).fadeIn("fast");
+                            curStepIdx =  stepIdx;                        
+                            SetupStep(curStep,selStep);                           
+                          });                    
+                    } else if(options.transitionEffect == 'slideleft'){
+                        var nextElmLeft = 0;
+                        var curElementLeft = 0;
+                        if(stepIdx > curStepIdx){
+                            nextElmLeft1 = contentWidth + 10;
+                            nextElmLeft2 = 0;
+                            curElementLeft = 0 - $($(curStep, obj).attr("href"), obj).outerWidth();
+                        } else {
+                            nextElmLeft1 = 0 - $($(selStep, obj).attr("href"), obj).outerWidth() + 20;
+                            nextElmLeft2 = 0;
+                            curElementLeft = 10 + $($(curStep, obj).attr("href"), obj).outerWidth();
+                        }
+                        if(stepIdx == curStepIdx){
+                            nextElmLeft1 = $($(selStep, obj).attr("href"), obj).outerWidth() + 20;
+                            nextElmLeft2 = 0;
+                            curElementLeft = 0 - $($(curStep, obj).attr("href"), obj).outerWidth();                           
+                        }else{
+                            $($(curStep, obj).attr("href"), obj).animate({left:curElementLeft},"fast",function(e){
+                              $($(curStep, obj).attr("href"), obj).hide();
+                            });                       
+                        }
+
+                        $($(selStep, obj).attr("href"), obj).css("left",nextElmLeft1);
+                        $($(selStep, obj).attr("href"), obj).show();
+                        $($(selStep, obj).attr("href"), obj).animate({left:nextElmLeft2},"fast",function(e){
+                          curStepIdx =  stepIdx;                        
+                          SetupStep(curStep,selStep);                      
+                        });
+                    } else{
+                        $($(curStep, obj).attr("href"), obj).hide(); 
+                        $($(selStep, obj).attr("href"), obj).show();
+                        curStepIdx =  stepIdx;                        
+                        SetupStep(curStep,selStep);
+                    }
+                    return true;
+                }
+                
+                function SetupStep(curStep,selStep){
+                   $(curStep, obj).removeClass("selected");
+                   $(curStep, obj).addClass("done");
+                   
+                   $(selStep, obj).removeClass("disabled");
+                   $(selStep, obj).removeClass("done");
+                   $(selStep, obj).addClass("selected");
+                   $(selStep, obj).attr("isDone",1);
+                   adjustButton();
+                   if($.isFunction(options.onShowStep)) {
+                      if(!options.onShowStep.call(this,$(selStep))){
+                        return false;
+                      }
+                   } 
+                }                
+                
+                function doForwardProgress(){
+                  var nextStepIdx = curStepIdx + 1;
+                  if(steps.length <= nextStepIdx){
+                    if(!options.cycleSteps){
+                      return false;
+                    }                  
+                    nextStepIdx = 0;
+                  }
+                  LoadContent(nextStepIdx);
+                }
+                
+                function doBackwardProgress(){
+                  var nextStepIdx = curStepIdx-1;
+                  if(0 > nextStepIdx){
+                    if(!options.cycleSteps){
+                      return false;
+                    }
+                    nextStepIdx = steps.length - 1;
+                  }
+                  LoadContent(nextStepIdx);
+                }  
+                
+                function adjustButton(){
+                  if(!options.cycleSteps){                
+                    if(0 >= curStepIdx){
+                      $(btPrevious).addClass("buttonDisabled");
+                    }else{
+                      $(btPrevious).removeClass("buttonDisabled");
+                    }
+                    if((steps.length-1) <= curStepIdx){
+                      $(btNext).addClass("buttonDisabled");
+                    }else{
+                      $(btNext).removeClass("buttonDisabled");
+                    }
+                  }
+                  // Finish Button 
+                  if(!steps.hasClass('disabled') || options.enableFinishButton){
+                    $(btFinish).removeClass("buttonDisabled");
+                  }else{
+                    $(btFinish).addClass("buttonDisabled");
+                  }                  
+                }
+                
+                function showMessage(msg){
+                  $('.content',msgBox).html(msg);
+                       msgBox.show();
+                }
+                
+                function setError(stepnum,iserror){
+                  if(iserror){                    
+                    $(steps.eq(stepnum-1), obj).addClass('error')
+                  }else{
+                    $(steps.eq(stepnum-1), obj).removeClass("error");
+                  }                                   
+                }                        
+
+                function setDone(stepnum,isdone){
+                  if(isdone){                    
+                    $(steps.eq(stepnum-1), obj).removeClass("selected").removeClass("disabled").addClass('done')
+                  }else{
+                    $(steps.eq(stepnum-1), obj).removeClass("done");
+                  }                                   
+                }                        
+        });  
+    };  
+    // Default Properties and Events
+    $.fn.smartWizard.defaults = {
+          selected: 0,  // Selected Step, 0 = first step   
+          keyNavigation: true, // Enable/Disable key navigation(left and right keys are used if enabled)
+          enableAllSteps: false,
+          updateHeight: true,
+          transitionEffect: 'fade', // Effect on navigation, none/fade/slide/slideleft
+          contentURL:null, // content url, Enables Ajax content loading
+          contentCache:true, // cache step contents, if false content is fetched always from ajax url
+          cycleSteps: false, // cycle step navigation
+          includeFinishButton: true, // whether to show a Finish button
+          enableFinishButton: false, // make finish button enabled always
+          errorSteps:[],    // Array Steps with errors
+          labelNext:'Next',
+          labelPrevious:'Previous',
+          labelFinish:'Finish',          
+          onLeaveStep: null, // triggers when leaving a step
+          onShowStep: null,  // triggers when showing a step
+          onFinish: null  // triggers when Finish button is clicked
+    };    
+    
+})(jQuery);