title: JavaScript function sequence (Phaser game)
body: <p>can anyone explain how the code below works ? this is a timed animation  that uses the Phaser Javascript framework. </p>
  
  <p>I can't work out how this works in sequence, e.g. how each function is triggered, doIntro0() followed by doIntro1() </p>
  
  <p>For brevity , I have ommited the majorty of doIntro functions.</p>
  
  <pre><code>showIntro(); // initial call 
  
      var introFlags = new Object();
      function showIntro(){
        if (!introFlags.step0){
          if (!introFlags.doingStep0){
            introFlags.doingStep0 = true;
            doIntro0();
          }
          return
        }
  
        if (!introFlags.step1){
          if (!introFlags.doingStep1){
            introFlags.doingStep1 = true;
            doIntro1();
          }
          return
        }
      }
  
       function doIntro0(){
        player.animations.play("rest");
        player.x = 160+32;
        princess.animations.play("rest0");
        princess.x = 240;
        graves.alpha = 0;
        devil.alpha = 0;
        armour = game.add.sprite(140,354,"armour");
        setTimeout(endIntro0,500);
      }
  
      function endIntro0(){
        introFlags.step0 = true;
      }
  
      function doIntro1(){
        blackBg.alpha = 0.2;
        setTimeout(endIntro1,2000);  
      }
  
      function endIntro1(){
        introFlags.step1 = true;
      }
  </code></pre>