Quinntal

let scn = 1; //variable for scene numbers

​

var livesCounter = 3;

var timer = 0;

​

let fade = 1;

let fadeadd;

let fadesubtract = 0;

​

var user; //variable for the player

var obstacles; //each obstacle is a object of the Meteors class that is declared in setup

var obstacles1;

var obstacles2;

var obstacles3;

var obstacles4;

var obstacles5;

var obstacles6;

​

let backgroundImage; //creates a variable for the background image

let asteroidImg1;

let asteroidImg2;

let asteroidImg3;

let asteroidImg4;

let asteroidNumber;

let shipImg;

​

let font;

​

let BlackHoleX = 640; //X position of black hole

let BlackHoleY = 1300; //Y position of black hole

let BlackHoleDiameter = 1700; //Diameter of black hole

​

function setup() {

  createCanvas(1280, 720); //creates canvas of standard monitor resolution of 1920,1080

  backgroundImage = loadImage("https://deckard.openprocessing.org/user288821/visual1304155/hbec9660e1cfbaf100c95f9ef83498875/Space%20Background.png"); //assigns background image to it's proper variable

  asteroidImg1 = loadImage("https://deckard.openprocessing.org/user288821/visual1304155/hbec9660e1cfbaf100c95f9ef83498875/Asteroid1.png");

  asteroidImg2 = loadImage("https://deckard.openprocessing.org/user288821/visual1304155/hbec9660e1cfbaf100c95f9ef83498875/Asteroid2.png");

  asteroidImg3 = loadImage("https://deckard.openprocessing.org/user288821/visual1304155/hbec9660e1cfbaf100c95f9ef83498875/Asteroid3.png");

  asteroidImg4 = loadImage("https://deckard.openprocessing.org/user288821/visual1304155/hbec9660e1cfbaf100c95f9ef83498875/Asteroid4.png");

  shipImg = loadImage("https://deckard.openprocessing.org/user288821/visual1304155/hbec9660e1cfbaf100c95f9ef83498875/Ship.png");

  font = loadFont("zorque.otf");

  user = new Player();

  obstacles = new Meteors(asteroidImg1);

  obstacles1 = new Meteors(asteroidImg1);

  obstacles2 = new Meteors(asteroidImg2);

  obstacles3 = new Meteors(asteroidImg2);

  obstacles4 = new Meteors(asteroidImg3);

  obstacles5 = new Meteors(asteroidImg4);

  obstacles6 = new Meteors(asteroidImg4);

}

​

function draw() { //main draw function that will draw the different scenes

  switch(scn){ //switches between the different scenes by the button

    case 1:

      startScene();

      break;

    case 2:

      settingScene();

      break;

    case 3:

      fadeText();

      break;

    case 4:

      startGame();

      break;

    case 5:

      tryAgain();

      break;

  }

}

​

///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

​

function startScene() { //scene for the start screen

  background(55, 66, 91); //defines the colour of the background

  textFont(font, 20);

  textAlign(CENTER); //aligns all text anchors to the center for accurate movement

  rectMode(CENTER); //aligns all rectangle anchors to the center for accurate movement

  /*size(400, 400);

  textSize(128);

  text("START", width / 2, 500);

  */  

  strokeWeight(8);

  fill(213, 198, 141); //creates colour of rectangle based on previous variables

  rect(width / 2, 450, 800, 100, 30); //(x-coordinate, y-coordinate, width, height/length, radius for full corners)

  fill(0); //creating the text with colour, size, position and what text says

  textSize(200);

  text("QUINNTAL", width / 2, 310);

  fill(0); //creating the text with colour, size, position and what text says

  textSize(100);

  text("START", width / 2, 485);

  fill(0); //creating the text with colour, size, position and what text says

  textSize(50);

  text("Directions:", width / 2, 590);

  fill(0); //creating the text with colour, size, position and what text says

  textSize(50);

  text("Use arrow keys to move and don't get hit!", width / 2, 635);

//  fill(213, 198, 141); //creates colour of rectangle based on previous variables

//  rect(width / 2, 600 , 800, 100, 30); //(x-coordinate, y-coordinate, width, height/length, radius for full corners)

//  fill(0); //creating the text with colour, size, position and what text says

//  textSize(100);

//  text("SETTINGS", width / 2, 635); 

  /*

  if (mouseClicked(mouseX > 710 && mouseX < 1210 && mouseY > 450 && mouseY < 550)){ //if the mouse is clicked within the button1's parameters it will run this if statement

    Rvalue1 = 69; //changes colour of RGB values of button 1

    Gvalue1= 125; //this is not the original purpose of this button, the colour changing is a stand in for when I figure out how to start the actual game

    Bvalue1 = 54; 

  }

  */

}

​

///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

​

function settingScene() { //scene for the settings page

  background(100);

}

​

///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

​

function fadeText() { //scene that begins the game

  background(55, 66, 91);

  textFont(font, 20);

  textAlign(CENTER);

  textSize(200);

  fill(0, fade);

  text("QUINN", width/2, 400);

  if (fade == 1) { //begins the fade from 1 up

    fadeadd = 1;

  } else if (fade == 300){ //once the fade counter reaches 300, the fadeadd variable stops, fadesubtract begins and fade starts going down

    fadeadd = 0;

    fadesubtract = -10;

  } else if (fade == 0) { //once fade reaches 0, fadesubtract stops and scenes switch

    fadesubtract = 0

    scn = 4;

  }

  fade = fade + fadeadd

  fade = fade + fadesubtract;

  // print(fade);

}

​

///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

​

function startGame(){

  strokeWeight(1);

  rectMode(CENTER);

  fill(255,255,255)

  // rect(width / 2, 703, 1280, 30); // (x-coordinate, y-coordinate, width, height)

  user.display();

  user.movement();

  user.gravity();

  // user.jump();

  user.keyReleased();

  user.collision();

  user.lives();

​

    obstacles.display();

    obstacles.movement();

    obstacles.replay();

    obstacles1.display();

    obstacles1.movement();

    obstacles1.replay();

    obstacles2.display();

    obstacles2.movement();

    obstacles2.replay();

    obstacles3.display();

    obstacles3.movement();

    obstacles3.replay();

    obstacles4.display();

    obstacles4.movement();

    obstacles4.replay();

    obstacles5.display();

    obstacles5.movement();

    obstacles5.replay();

    obstacles6.display();

    obstacles6.movement();

    obstacles6.replay();

  BlackHole();

  textFont(font, 20);

  textAlign(CENTER);

  textSize(100);

  fill(255);

  text("X" + livesCounter, 450, 700);

  imageMode(CENTER);

  image(shipImg, 330, 660, 100, 100);

  // print(AsteroidXsize);

  if (frameCount%60 == 0 && livesCounter >= 0){ //Timer information to begin when the game begins, frameCount counts frames and it's remainder is counted up until 60 where it is divided by 60 and the remainder is 0 (1 second passes)

    timer +=1;

  } 

  text("Time", 750, 700,);

  text(timer, 950, 700);

}

​

​

function BlackHole(){

​

  fill(0);

  ellipse(BlackHoleX, BlackHoleY, BlackHoleDiameter, BlackHoleDiameter);

}

​

​

class Player {

  constructor () {

    this.Xmovement = 640;

    this.Ymovement = 160;

    this.diameter = 50;

    this.Xspeed = 5;

    this.Yspeed = 5;

    this.right = 0;

    this.left = 0;

    this.up = 0;

    this.down = 0;

    this.weight = 1;

  }

  display() {

    imageMode(CENTER);

    image(backgroundImage, width / 2, height / 2, 1280, 720);

    // fill (100);

    // rect (this.Xmovement, this.Ymovement, 5000, 5000);

    // image(shipImg, this.Xmovement, this.Ymovement, this.diameter, this.diameter);

    fill (0,200,0);

    // ellipse(this.Xmovement, this.Ymovement, this.diameter, this.diameter);

    image(shipImg, this.Xmovement, this.Ymovement, this.diameter, this.diameter); // calls image variable of ship and ships movement and size variables

  }

  movement() {

    this.Xmovement = this.Xmovement + (this.right - this.left) * this.Xspeed // technically unecessary, but allows for smoother motion

    this.Ymovement = this.Ymovement + (this.down - this.up) * this.Yspeed

    if (keyIsDown(37)){ // takes input number 65 on keyboard, the left arrow key, and if clicked runs what is underneath

      this.Xmovement-= this.Xspeed;

      this.left = 1;

    }

    if (keyIsDown(39)){ // takes input number 68 on keyboard, the right arrow key, and if clicked runs what is underneath

      this.Xmovement+= this.Xspeed;

      this.right = 1;

    }

    if (keyIsDown(38)){ // takes input number 87 on keyboard, the up arrow key, and if clicked runs what is underneath

      this.Ymovement-= this.Yspeed;

      this.up = 1;

    }

    if (keyIsDown(40)){ // takes input number 83 on keyboard, the down arrow key, and if clicked runs what is underneath

      this.Ymovement+= this.Yspeed;

      this.down = 1;

    }

    // print(Asteroid.Xposition);

  }

  gravity(){

    this.Ymovement = this.Ymovement + this.weight;

  }

  keyReleased(){

    if (key == "ArrowLeft"){

      this.left = 0;

    }

    if (key == "ArrowRight"){

      this.right = 0;

    }

    if (key == "ArrowUp"){

      this.up = 0;

    }

    if (key == "ArrowDown"){

      this.down = 0;

    }

  }

​

  collision(){

    if (dist(this.Xmovement, this.Ymovement, BlackHoleX, BlackHoleY) < (this.diameter / 2) + (BlackHoleDiameter / 2) ){ // detection against black hole

      this.Xmovement = 640;

      this.Ymovement = 360;

      livesCounter = livesCounter - 1;

    }

    if (this.Xmovement <= 0 || this.Xmovement >= 1280 || this.Ymovement <= 0){ // detection against walls

      this.Xmovement = 640;

      this.Ymovement = 360;

      livesCounter = livesCounter - 1;

    }

    if (dist(this.Xmovement, this.Ymovement, obstacles.Xposition, obstacles.Yposition) < (this.diameter / 2) + (sqrt((obstacles.Xsize / 2) * (obstacles.Xsize / 2) + (obstacles.Ysize / 2) * (obstacles.Ysize / 2)))) {

      this.Xmovement = 640;

      this.Ymovement = 360;

      livesCounter = livesCounter - 1;

    }

    if (dist(this.Xmovement, this.Ymovement, obstacles1.Xposition, obstacles1.Yposition) < (this.diameter / 2) + (sqrt((obstacles1.Xsize / 2) * (obstacles1.Xsize / 2) + (obstacles1.Ysize / 2) * (obstacles1.Ysize / 2)))) {

      this.Xmovement = 640;

      this.Ymovement = 360;

      livesCounter = livesCounter - 1;

    }

    if (dist(this.Xmovement, this.Ymovement, obstacles2.Xposition, obstacles2.Yposition) < (this.diameter / 2) + (sqrt((obstacles2.Xsize / 2) * (obstacles2.Xsize / 2) + (obstacles2.Ysize / 2) * (obstacles2.Ysize / 2)))) {

      this.Xmovement = 640;

      this.Ymovement = 360;

      livesCounter = livesCounter - 1;

    }

    if (dist(this.Xmovement, this.Ymovement, obstacles3.Xposition, obstacles3.Yposition) < (this.diameter / 2) + (sqrt((obstacles3.Xsize / 2) * (obstacles3.Xsize / 2) + (obstacles3.Ysize / 2) * (obstacles3.Ysize / 2)))) {

      this.Xmovement = 640;

      this.Ymovement = 360;

      livesCounter = livesCounter - 1;

    }

    if (dist(this.Xmovement, this.Ymovement, obstacles4.Xposition, obstacles4.Yposition) < (this.diameter / 2) + (sqrt((obstacles4.Xsize / 2) * (obstacles4.Xsize / 2) + (obstacles4.Ysize / 2) * (obstacles4.Ysize / 2)))) {

      this.Xmovement = 640;

      this.Ymovement = 360;

      livesCounter = livesCounter - 1;

    }

    if (dist(this.Xmovement, this.Ymovement, obstacles5.Xposition, obstacles5.Yposition) < (this.diameter / 2) + (sqrt((obstacles5.Xsize / 2) * (obstacles5.Xsize / 2) + (obstacles5.Ysize / 2) * (obstacles5.Ysize / 2)))) {

      this.Xmovement = 640;

      this.Ymovement = 360;

      livesCounter = livesCounter - 1;

    }

    if (dist(this.Xmovement, this.Ymovement, obstacles6.Xposition, obstacles6.Yposition) < (this.diameter / 2) + (sqrt((obstacles6.Xsize / 2) * (obstacles6.Xsize / 2) + (obstacles6.Ysize / 2) * (obstacles6.Ysize / 2)))) {

      this.Xmovement = 640;

      this.Ymovement = 360;

      livesCounter = livesCounter - 1;

    }

    // print(livesCounter);

  }

  lives(){

    if (livesCounter <= 0){

      scn = 5;

      livesCounter = livesCounter + 3;

    }

  }

}

​

class Meteors { // Issue is that I need to take a variable from this class and put it into the other class so the player has a collision system with the asteroids

  constructor(Img){

    this.Xposition = random(0,1280);

    this.Yposition = random(0, -10);

    this.Yfall = random(1, 15);

    this.Xsize = random(30,50);

    this.Ysize = random(30,50);

    this.asteroidNumber = Img;

  }

  display() {

    // fill(169,169,169);

    // radians(this.asteroidNumber);

    // rotate(this.asteroidNumber);

    if (scn == 5){

      this.Yposition = -5;

    } else if (scn == 3){

      this.Yposition = (0,-10);

    }

    imageMode(CENTER);

    image(this.asteroidNumber, this.Xposition, this.Yposition, this.Xsize, this.Ysize);

    // ellipse(this.Xposition, this.Yposition, this.Xsize, this.Ysize);

  }

  movement(){

    this.Yposition = this.Yposition + this.Yfall;

  }

  replay(){

    if (this.Yposition >= 720){

    this.Yposition = -10; 

    this.Xposition = random(0,1280);

    }

  }

}

​

///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

​

function tryAgain(){

  background(55, 66, 91); //defines the colour of the background

  textFont(font, 20);

  textAlign(CENTER); //aligns all text anchors to the center for accurate movement

  rectMode(CENTER); //aligns all rectangle anchors to the center for accurate movement

​

  strokeWeight(8);

  fill(213, 198, 141); //creates colour of rectangle based on previous variables

  rect(width / 2, 600, 800, 100, 30); //(x-coordinate, y-coordinate, width, height/length, radius for full corners)

  fill(0); //creating the text with colour, size, position and what text says

  textSize(200);

  text("Time", width / 2, 210);

  fill(0); //creating the text with colour, size, position and what text says

  textSize(200);

  text(timer, width / 2, 410);

  fill(0); //creating the text with colour, size, position and what text says

  textSize(100);

  text("TRY AGAIN?", width / 2, 635);

}

​

///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

​

function mouseClicked() { //function runs when mouse is clicked, it checks what is beneath it

  if (scn == 1) {

    if (mouseX > 240 && mouseX < 1040 && mouseY > 400 && mouseY < 600){ //if the mouse is clicked within the button1's parameters it will run this if statement

      scn = 3;

    } 

  }

  if (scn == 5) {

    if (mouseX > 240 && mouseX < 1040 && mouseY > 550 && mouseY < 750){ //if the mouse is clicked within the button1's parameters it will run this if statement

      scn = 4;

      timer = 0;

    } 

  }

  //  if (mouseX > 240 && mouseX < 1040 && mouseY > 550 && mouseY < 650){ //if the mouse is clicked within the button2's parameters it will run this if statement

  //    scn = 2;

  // } 

}

​

function keyPressed(){

  if (scn == 5){

    if (keyIsDown(32)){

      scn = 3;

      timer = 0;

    }

  }

}

/*

function mouseClicked() {

  o = 0;

}

/*

Right now I have an idea of the menu set up. I have figured out the way of creating "scenes" for the game. I need to begin working on the game istelf.

I will start with an easy stage or area for my character to walk on and exist. I will then create the character and program the movement.

*/

​

​

​

​

//Page switch functions or use draw as manager of scenes and create functions to make scenes

​