p5.js Web Editor | como nossos pais alpha

xxxxxxxxxx
class Letra {
  constructor() {
  this.lyric = createImage(1200, 720);
  this.graphic = createImage(1200,720);
  }
  
swap() {
  let t = millis() - songStart
  if (t >= 0 && t < 1200) {
    background(red);
    this.lyric = lt1a;
  } else if (t >= 1200 && t < 6000) {
    background(red);
    this.lyric = lt1b;
  } else if (t >= 6000 && t < 7200) {
    background(red);
    this.lyric = lt1c;
    this.graphic = gr1;
    if (mouseIsPressed) {
      this.graphic = gr1a;
    }
  } else if (t >= 7200 && t < 11200) {
    background(red);
    this.lyric = lt1d;
    this.graphic = gr1;
    if (mouseIsPressed) {
      this.graphic = gr1a;
    }
  } else if (t >= 11200 && t < 14000) {
    background(purp);
    this.lyric = lt2a;
    this.graphic = gr1;
    if (mouseIsPressed) {
      this.graphic = gr1a;
    }
  } else if (t >= 14000 && t < 15200) {
    background(purp);
    this.lyric = lt2b;
    this.graphic = gr1;
    if (mouseIsPressed) {
      this.graphic = gr1a;
    }
  } else if (t >= 15200 && t < 21200) {
    background(purp);
    this.lyric = lt2c;
    this.graphic = gr1;
    if (mouseIsPressed) {
      this.graphic = gr1a;
    }
  } else if (t >= 21200 && t < 23200) {
    background(red);
    this.lyric = lt3a;
    this.graphic = createImage(1200,720);
  } else if (t >= 23200 && t < 25200) {
    background(red);
    this.lyric = lt3b;
    this.graphic = createImage(1200,720);
  } else if (t >= 25200 && t < 27200) {
    background(red);
    this.lyric = lt3c;
    this.graphic = createImage(1200,720);
  } else if (t >= 27200 && t < 32000) {
    background(red);
    this.lyric = lt3d;
    this.graphic = createImage(1200,720);
  } else if (t >= 32000 && t < 33200) {
    background(purp);
    this.lyric = lt4a;
    this.graphic = gr2;
    if (mouseIsPressed) {
      this.graphic = gr2a;
    }
  } else if (t >= 33200 && t < 34000) {
    background(purp);
    this.lyric = lt4b;
    this.graphic = gr2;
    if (mouseIsPressed) {
      this.graphic = gr2a;
    }
  } else if (t >= 34000 && t < 36000) {
    background(purp);
    this.lyric = lt4c;
    this.graphic = gr2;
    if (mouseIsPressed) {
      this.graphic = gr2a;
    }
  } else if (t >= 36000 && t < 42000) {
    background(purp);
    this.lyric = lt4d;
    this.graphic = gr2;
    if (mouseIsPressed) {
      this.graphic = gr2a;
    }
  } else if (t >= 42000 && t < 43200) {
    background(red);
    this.lyric = lt5a;
    this.graphic = gr3;
    if (mouseIsPressed) {
      this.graphic = gr3a;
    }
  } else if (t >= 43200 && t < 46000) {
    background(red);
    this.lyric = lt5b;
    this.graphic = gr3;
    if (mouseIsPressed) {
      this.graphic = gr3a;
    }
  } else if (t >= 46000 && t < 47200) {
    background(red);
    this.lyric = lt5c;
    this.graphic = gr3;
    if (mouseIsPressed) {
      this.graphic = gr3a;
    }
  } else if (t >= 47200 && t < 53200) {
    background(red);
    this.lyric = lt5d;
    this.graphic = gr3;
    if (mouseIsPressed) {
      this.graphic = gr3a;
    }
  } else if (t >= 53200 && t < 55600) {
    background(purp);
    this.lyric = lt5e;
    this.graphic = gr3;
    if (mouseIsPressed) {
      this.graphic = gr3a;
    }
  } else if (t >= 55600 && t < 59200) {
    background(purp);
    this.lyric = lt5f;
    this.graphic = gr3;
    if (mouseIsPressed) {
      this.graphic = gr3a;
    }
  } else if (t >= 59200 && t < 63200) {
    background(purp);
    this.lyric = lt5g;
    this.graphic = gr3;
    if (mouseIsPressed) {
      this.graphic = gr3a;
    }
  } else if (t >= 63200 && t < 66000) {
    background(red);
    this.lyric = lt6a;
    this.graphic = gr4;
    if (mouseIsPressed) {
      this.graphic = gr4a;
    }
  } else if (t >= 66000 && t < 70400) {
    background(red);
    this.lyric = lt6b;
    this.graphic = gr4;
    if (mouseIsPressed) {
      this.graphic = gr4a;
    }
  } else if (t >= 70400 && t < 74000) {
    background(red);
    this.lyric = lt6c;
    this.graphic = gr4;
    if (mouseIsPressed) {
      this.graphic = gr4a;
    }
  } else if (t >= 74000 && t < 75200) {
    background(red);
    this.lyric = lt6d;
    this.graphic = gr4;
    if (mouseIsPressed) {
      this.graphic = gr4a;
    }
  } else if (t >= 75200 && t < 76800) {
    background(red);
    this.lyric = lt6e;
    this.graphic = gr4;
    if (mouseIsPressed) {
      this.graphic = gr4a;
    }
  } else if (t >= 76800 && t < 78000) {
    background(red);
    this.lyric = lt6f;
    this.graphic = gr4;
    if (mouseIsPressed) {
      this.graphic = gr4a;
    }
  } else if (t >= 78000 && t < 83200) {
    background(red);
    this.lyric = lt6g;
    this.graphic = gr4;
    if (mouseIsPressed) {
      this.graphic = gr4a;
    }
  } else if (t >= 83200 && t < 85200) {
    background(purp);
    this.lyric = lt7a;
    this.graphic = gr5;
    if (mouseIsPressed) {
      this.graphic = gr5a;
    }
  } else if (t >= 85200 && t < 88000) {
    background(purp);
    this.lyric = lt7b;
    this.graphic = gr5;
    if (mouseIsPressed) {
      this.graphic = gr5a;
    }
  } else if (t >= 88000 && t < 90400) {
    background(purp);
    this.lyric = lt7c;
    this.graphic = gr5;
    if (mouseIsPressed) {
      this.graphic = gr5a;
    }
  } else if (t >= 90400 && t < 92000) {
    background(purp);
    this.lyric = lt7d;
    this.graphic = gr5;
    if (mouseIsPressed) {
      this.graphic = gr5a;
    }
  } else if (t >= 92000 && t < 94000) {
    background(purp);
    this.lyric = lt8a;
    this.graphic = gr6;
    if (mouseIsPressed) {
      this.graphic = gr6a;
    }
  } else if (t >= 94000 && t < 97200) {
    background(purp);
    this.lyric = lt8b;
    this.graphic = gr6;
    if (mouseIsPressed) {
      this.graphic = gr6a;
    }
  } else if (t >= 97200 && t < 99600) {
    background(purp);
    this.lyric = lt8c;
    this.graphic = gr6;
    if (mouseIsPressed) {
      this.graphic = gr6a;
    }
  } else if (t >= 99600 && t < 102000) {
    background(purp);
    this.lyric = lt8d;
    this.graphic = gr6;
    if (mouseIsPressed) {
      this.graphic = gr6a;
    }
  } else if (t >= 102000 && t < 105600) {
    background(red);
    this.lyric = lt9a;
    this.graphic = gr7;
    if (mouseIsPressed) {
      this.graphic = gr7a;
    }
  } else if (t >= 105600 && t < 111200) {
    background(red);
    this.lyric = lt9b;
    this.graphic = gr7;
    if (mouseIsPressed) {
      this.graphic = gr7a;
    }
  } else if (t >= 111200 && t < 116000) {
    background(purp);
    this.lyric = lt10a;
    this.graphic = gr8;
    if (mouseIsPressed) {
      this.graphic = gr8a;
    }
  } else if (t >= 116000 && t < 117600) {
    background(purp);
    this.lyric = lt10b;
    this.graphic = gr8;
    if (mouseIsPressed) {
      this.graphic = gr8a;
    }
  } else if (t >= 117600 && t < 121200) {
    background(purp);
    this.lyric = lt10c;
    this.graphic = gr8;
    if (mouseIsPressed) {
      this.graphic = gr8a;
    }
  } else if (t >= 121200 && t < 124000) {
    background(red);
    this.lyric = lt10d;
    this.graphic = gr8;
    if (mouseIsPressed) {
      this.graphic = gr8a;
    }
  } else if (t >= 124000 && t < 126000) {
    background(red);
    this.lyric = lt10e;
    this.graphic = gr8;
    if (mouseIsPressed) {
      this.graphic = gr8a;
    }
  } else if (t >= 126000 && t < 131200) {
    background(red);
    this.lyric = lt10f;
    this.graphic = gr8;
    if (mouseIsPressed) {
      this.graphic = gr8a;
    }
  } else if (t >= 131200 && t < 134000) {
    background(purp);
    this.lyric = lt11a;
    this.graphic = gr9;
    if (mouseIsPressed) {
      this.graphic = gr9a;
    }
  } else if (t >= 134000 && t < 136000) {
    background(purp);
    this.lyric = lt11b;
    this.graphic = gr9;
    if (mouseIsPressed) {
      this.graphic = gr9a;
    }
  } else if (t >= 136000 && t < 141200) {
    background(purp);
    this.lyric = lt11c;
    this.graphic = gr9;
    if (mouseIsPressed) {
      this.graphic = gr9a;
    }
  } else if (t >= 141200 && t < 144000) {
    background(purp);
    this.lyric = lt11d;
    this.graphic = gr9;
    if (mouseIsPressed) {
      this.graphic = gr9a;
    }
  } else if (t >= 144000 && t < 146800) {
    background(purp);
    this.lyric = lt11e;
    this.graphic = gr9;
    if (mouseIsPressed) {
      this.graphic = gr9a;
    }
  } else if (t >= 146800 && t < 150000) {
    background(purp);
    this.lyric = lt11f;
    this.graphic = gr9;
    if (mouseIsPressed) {
      this.graphic = gr9a;
    }
  } else if (t >= 150000 && t < 157200) {
    background(purp);
    this.lyric = lt11g;
    this.graphic = gr9;
    if (mouseIsPressed) {
      this.graphic = gr9a;
    }
  } else if (t >= 157200 && t < 161200) {
    background(red);
    this.lyric = lt12a;
    this.graphic = gr10;
    if (mouseIsPressed) {
      this.graphic = gr10a;
    }
  } else if (t >= 161200 && t < 166000) {
    background(red);
    this.lyric = lt12b;
    this.graphic = gr10;
    if (mouseIsPressed) {
      this.graphic = gr10a;
    }
  } else if (t >= 166000 && t < 169200) {
    background(red);
    this.lyric = lt12c;
    this.graphic = gr10;
    if (mouseIsPressed) {
      this.graphic = gr10a;
    }
  } else if (t >= 169200 && t < 172000) {
    background(red);
    this.lyric = lt12d;
    this.graphic = gr10;
    if (mouseIsPressed) {
      this.graphic = gr10a;
    }
  } else if (t >= 172000 && t < 176000) {
    background(red);
    this.lyric = lt12e;
    this.graphic = gr10;
    if (mouseIsPressed) {
      this.graphic = gr10a;
    }
  } else if (t >= 176000 && t < 180000) {
    background(purp);
    this.lyric = lt13a;
    this.graphic = createImage(1200,720);
  } else if (t >= 180000 && t < 186000) {
    background(purp);
    this.lyric = lt13b;
    this.graphic = createImage(1200,720);
  } else if (t >= 186000 && t < 187200) {
    background(purp);
    this.lyric = lt14a;
    this.graphic = gr11;
    if (mouseIsPressed) {
      this.graphic = gr11a;
    }
  } else if (t >= 187200 && t < 189200) {
    background(purp);
    this.lyric = lt14b;
    this.graphic = gr11;
    if (mouseIsPressed) {
      this.graphic = gr11a;
    }
  } else if (t >= 189200 && t < 191600) {
    background(purp);
    this.lyric = lt14c;
    this.graphic = gr11;
    if (mouseIsPressed) {
      this.graphic = gr11a;
    }
  } else if (t >= 191600 && t < 195600) {
    background(purp);
    this.lyric = lt14d;
    this.graphic = gr11;
    if (mouseIsPressed) {
      this.graphic = gr11a;
    }
  } else if (t >= 195600 && t < 201200) {
    background(purp);
    this.lyric = lt14e;
    this.graphic = gr11;
    if (mouseIsPressed) {
      this.graphic = gr11a;
    }
  } else if (t >= 201200 && t < 205200) {
    background(red);
    this.lyric = lt15a;
    this.graphic = gr12;
    if (mouseIsPressed) {
      this.graphic = gr12a;
    }
  } else if (t >= 205200 && t < 211200) {
    background(red);
    this.lyric = lt15b;
    this.graphic = gr12;
    if (mouseIsPressed) {
      this.graphic = gr12a;
    }
  } else if (t >= 211200 && t < 213200) {
    background(red);
    this.lyric = lt15c;
    this.graphic = gr12;
    if (mouseIsPressed) {
      this.graphic = gr12a;
    }
  } else if (t >= 213200 && t < 216000) {
    background(red);
    this.lyric = lt15d;
    this.graphic = gr12;
    if (mouseIsPressed) {
      this.graphic = gr12a;
    }
  } else if (t >= 216000 && t < 221200) {
    background(red);
    this.lyric = lt15e;
    this.graphic = gr12;
    if (mouseIsPressed) {
      this.graphic = gr12a;
    }
  } else if (t >= 221200 && t < 223000) {
    background(purp);
    this.lyric = lt16a;
    this.graphic = gr13;
    if (mouseIsPressed) {
      this.graphic = gr13a;
    }
  } else if (t >= 223000 && t < 226000) {
    background(purp);
    this.lyric = lt16b;
    this.graphic = gr13;
    if (mouseIsPressed) {
      this.graphic = gr13a;
    }
  } else if (t >= 226000 && t < 231200) {
    background(purp);
    this.lyric = lt16c;
    this.graphic = gr13;
    if (mouseIsPressed) {
      this.graphic = gr13a;
    }
  } else if (t >= 231200 && t < 233200) {
    background(purp);
    this.lyric = lt16d;
    this.graphic = gr13;
    if (mouseIsPressed) {
      this.graphic = gr13a;
    }
  } else if (t >= 233200 && t < 236000) {
    background(purp);
    this.lyric = lt16e;
    this.graphic = gr13;
    if (mouseIsPressed) {
      this.graphic = gr13a;
    }
  } else if (t >= 236000 && t < 241200) {
    background(purp);
    this.lyric = lt16f;
    this.graphic = gr13;
    if (mouseIsPressed) {
      this.graphic = gr13a;
    }
  } else if (t >= 241200 && t < 246000) {
    background(purp);
    this.lyric = lt16g;
    this.graphic = gr13;
    if (mouseIsPressed) {
      this.graphic = gr13a;
    }
  } else if (t >= 246000 && t < 260000) {
    background(purp);
    this.lyric = lt16h;
    this.graphic = gr13;
    if (mouseIsPressed) {
      this.graphic = gr13a;
    }
  } else if (t >= 260000 && t < 265000) {
    background(purp);
    this.lyric = createImage(1200, 720);
    this.graphic = createImage(1200,720);
  } else if (t >= 265000) {
    screen = 0;
  }
    }
    
    render(){
      image(this.lyric, 50, 10, 1200, 720);
      image(this.graphic, 50, 10, 1200, 720);
    }
}
Cookies

Sketch Files

Console

Preview
