Simple game with Javascript (Code Clean-up)

Modularity & Reusability

To start with, I cleaned up the function draw(){}.

In order to do that, I categorized every codes/elements in draw function into several different functions.

As a result, it became easier to understand what is going to be happen in draw function.

Also, It is easier to make a adjustment because function() work as navigation.

function draw() {
  background(0);
  
   if (mode == "homePage") {
   startHome();
  }
  
  if (mode == "gamePage") {
    
    //Animate background
    backgroundDecorate();

    //Draw EVE
    drawEve();

    //Draw UFO
    drawUFO();

    //Draw ENEMY
    drawEnemy();

    //TEXT
    instructionText();
  }

Also, since I grouped codes into functions, I could make each functions to interact more freely. I also could

simulate in my head and come up with crazier ideas. So I decided to make a starting/landing page before the

game, so that users can chose when to start. I designed startPage() first.

Then, I used mousePressed(){} and if(){} to make it switch between homePage and gamePage when user press start button .