title: Functions are being called twice or triple time
body: <p>There are 4 steps of the flow. It will call another step's function once the step is completed. It runs correctly in the first time to run thought the flow. </p>
  
  <p>I did try to console the step in each function. And fonund that in stage 2 and onwards functions are called repeatedly after the whole flow ran one time. Should I unbind any of the functions in each step so that the functions will not be called again and again?</p>
  
  <pre><code>var index_Function = {
  settings: {
      body: $("body"),
      wrapper: $("#wrapper"),
      option: null,
      cameraCounter: 5, //seconds
      qrCounter: 5 //seconds
  },
  step0Handler: function() {
      var $this = this;
      var $wrapper = this.settings.wrapper;
      var $container = $wrapper.find("section.stage-0");
  
      var $start_btn = $container.find(".start-btn");
  
      if($wrapper.hasClass("stage-0")){
          $start_btn.click(function(){
              $wrapper.removeClass("stage-0").addClass("stage-1");
              $this.step1Handler();
          });
      }
  
  },
  step1Handler: function() {
      var $this = this;
      var $wrapper = this.settings.wrapper;
      var $container = $wrapper.find("section.stage-1");
  
      var $option_btn = $container.find("a");
  
      if($wrapper.hasClass("stage-1")){
          console.log("stage-1");
          $option_btn.click(function(){
              $wrapper.removeClass("stage-1").addClass("stage-2");
              $this.step2Handler();
          });
      }
  },
  step2Handler: function() {
      var $this = this;
      var $wrapper = this.settings.wrapper;
      var $container = $wrapper.find("section.stage-2");
  
      var $cameraCounter = this.settings.cameraCounter;
      var $counter = $container.find(".countdown");
      var $interval = null;
  
      if($wrapper.hasClass("stage-2")){
          console.log("stage-2");
          console.log("option: "+ this.settings.option);
  
          $counter.text($cameraCounter);
          $interval = setInterval(function() {
              $cameraCounter--;
              if ($cameraCounter &gt; 0) {
                  $counter.text($cameraCounter);
              }else if ($cameraCounter === 0) {
                  clearInterval($interval);
                  $wrapper.removeClass("stage-2").addClass("stage-3");
                  $this.step3Handler();
              }
          }, 1000);
  
  
      }
  },
  step3Handler: function() {
      var $this = this;
      var $wrapper = this.settings.wrapper;
      var $container = $wrapper.find("section.stage-3");
  
      var $retry_btn = $container.find("a");
  
      var $qrCounter = this.settings.qrCounter;
      var $counter = $container.find(".countdown");
      var $interval = null;
  
      if($wrapper.hasClass("stage-3")){
          console.log("stage-3");
          startTimer($qrCounter, $counter);
  
          $retry_btn.click(function(){
              clearInterval($interval);
              $this.retryHandler();
          });
      }
  
      function startTimer(duration, display) {
          var timer = duration, minutes, seconds;
          timer--;
          $interval = setInterval(function () {
              minutes = parseInt(timer / 60, 10)
              seconds = parseInt(timer % 60, 10);
  
              timer--;
              if (timer &gt; 0) {
                  display.text(minutes + "m " + seconds + "s");
              }else if (timer === 0) {
                  clearInterval($interval);
                  $wrapper.removeClass("stage-3").addClass("stage-0");
                  //$this.step0Handler();
              }
          }, 1000);
      }
  },
  retryHandler: function() {
      this.settings.option = null;
      var $wrapper = this.settings.wrapper;
      console.log('retryHandler');
      $wrapper.removeClass("stage-0 stage-1 stage-2 stage-3").addClass("stage-1");
  },
  restartHandler: function() {
      this.settings.option = null;
      var $wrapper = this.settings.wrapper;
      console.log('retryHandler');
      $wrapper.removeClass("stage-0 stage-1 stage-2 stage-3").addClass("stage-0");
      //clear canvas
  },
  init: function() {
      this.step0Handler();
  },
  </code></pre>
  
  <p>}</p>