This game is about “Trowing out flammable objects” like cigarettes, sparklers, fireworks, lanterns, heaters, and etc. With this game, I would be able to inform people to throw away caution objects, instead of leaving them in the forest.
*Systems & Keys
For this game, I have two scoring systems. One system is adding points(+)when the user successfully throws out an item while another system is deducting points(-) when the user throws out an item that is not dangerous.
Right arrow, Left arrow, ENTER (detailed instructions in the program)
*Goal
Score at least 5 points by throwing out flammable objects
*Attention
If you score lower than -5, Fail page will pop up. If you fail, you can’t start again because you CAN NOT undo wildfire 🙁 But you can start again if you success by pressing ENTER key 🙂
//Final Project
var introPage; //Click page
var introScreen; //click screen
var item_counter = 0;
var item_interval = 13; // items amount decreases as the user earns more point
var item_startPage; // How page
var item_finishPage; // Congrats page
var item_finishFailPage; //fail page
var item_startScreen; // How page illustration
var item_finishScreen; //Congrats page illustration
var item_finishFailScreen; //Fail page illustration
var weapons = []; //dangerous items array
var nonWeaps = []; //non-weapons array
var dropping_weapons = []
var dropping_nonWeaps = []
var trashcan; // trash can image
var backg;
var rate = 2; // speed of items falling
var item_score = 0; // score of throwing out items
var x = 0;
var height = 540;
var y = height - 100;
//trash can keys
var moveRight = false;
var moveLeft = false;
function preload() { // preloads images of dangerous weapons
var Weapons = [
"https://i.imgur.com/nu43pvX.png", //lantern
"https://i.imgur.com/iftAnZO.png", //cigarette
"https://i.imgur.com/JWyEvWW.png", //firework
"https://i.imgur.com/RDVdcYb.png"]; //sparklers
for (var i = 0; i < Weapons.length; i++){
weapons.push(loadImage(Weapons[i]));
}
var NonWeaps = [
"https://i.imgur.com/y3uSh1k.png", //leaf
"https://i.imgur.com/RVbYaC6.png", //branch
"https://i.imgur.com/2UQizyS.png"]; //acorn
for (var i = 0; i < NonWeaps.length; i++){
nonWeaps.push(loadImage(NonWeaps[i]));
}
}
function item_setup () {
createCanvas(450, 440);
item_score = 0;
item_startPage = false;
item_finishPage = false;
trashcan = loadImage("https://i.imgur.com/JpPvsJn.png"); //trash can image
item_startScreen = loadImage("https://i.imgur.com/in44Atu.png"); // How page of the game
backg = loadImage("https://i.imgur.com/m6iJCVQ.png"); // forest background
item_finishScreen = loadImage("https://i.imgur.com/UJUGvtS.png"); // congrats page of the game
item_finishFailScreen = loadImage("https://i.imgur.com/JZkuboH.png"); //Fail page of the game
item_counter = 0; // counts the number of trash caught in the trash can
item_interval = 50;
}
function item_keyPressed() {
item_startPage =false;
if (key === RIGHT){
moveRight = true;
} else if(key === LEFT){
moveLeft = true;
}
if (item_startPage) { // starts the game after pressing any key
item_startPage = false;
} else if (keyCode == ENTER) { // returns back to home screen
setup();
}
}
function item_draw() { // draws other functions that is needed for game page
if (item_startPage == true) {
push();
scale(1/4);
image(item_startScreen, 0, 0);
pop();
} else {
scale(0.35);
image(backg, 0, 0);
scale(1/0.4);
drawTrashCan(); // draw trash can
drawItems(); // draw dangerous items
drawNonWeaps();
item_drawScore(); // number of items thrown out
item_update(); // drops items continuously
}
if (item_finishPage == true) { // appears the finish page as the game ends
push();
scale(0.28);
image(item_finishScreen,0,0);
pop();
}
if (item_finishFailPage == true){
push();
scale(0.28);
image(item_finishFailScreen,0,0);
pop();
}
}
function ScoreMax() { // if score of 5(maximum) is reached, shows congratulation page
max = 5;
if(item_score >= max){
item_finishPage = true;
}
}
function ScoreMin(){ // if score of -5(minimum) is reached, shows Fail page
min = -5;
if(item_score <= min){
item_finishFailPage = true;
}
}
function item_drawScore() { // score on top left of the screen
textSize(15);
fill(25,30,37);
text(("Your score: " + this.item_score), 10, 30);
}
function makeNonWeap(xposs, yposs, imagee) {
var non = {
"x": xposs,
"y": yposs,
"img": imagee,
}
return non;
}
function makeItem(xx, yy, image) {
var item = {
"x": xx,
"y": yy,
"img": image,
}
return item;
}
function drawNonWeaps() {
for (var i = 0; i < dropping_nonWeaps.length; i++){
var non = dropping_nonWeaps[i];
image(non.img, non.x, non.y,50,50);
}
}
function drawItems() {
for (var i = 0; i < dropping_weapons.length; i++){
var item = dropping_weapons[i];
image(item.img, item.x, item.y,50,50);
}
}
function drawTrashCan() { // renders the trash can
image(trashcan, this.x, this.y-90,120,180);
}
function updateNonWeapY() { // updates the varying dropping of the non weapons
for (var i = 0; i < dropping_nonWeaps.length; i++){
var non = dropping_nonWeaps[i];
non.y += rate;
if (non.y > height) {
dropping_nonWeaps.splice(i, 1);
}
}
}
function updateItemY() {
for (var i = 0; i < dropping_weapons.length; i++){
var item = dropping_weapons[i];
item.y += rate;
if (item.y > height) {
dropping_weapons.splice(i, 1);
}
}
}
function itemHitsTrashCan(item) { // moment when dangerous items hit the trash can
var hit = this.x < item.x + 10 & item.x < this.x + 80 - 20 & item.y > this.y - 110;
return hit;
}
function nonWeapHitsTrashCan(non) { // moment when non-weapon items hit the trash can
var hitt = this.x < non.x + 10 & non.x < this.x + 80 - 20 & non.y > this.y - 110;
return hitt;
}
function updateNonWeapHit() { // the non-weapons disappear when it hits the trash can
for (var i = 0; i < dropping_nonWeaps.length; i++){
var non = dropping_nonWeaps[i];
if(nonWeapHitsTrashCan(non)) {
dropping_nonWeaps.splice(i, 1);
item_score -= 1; //score decreases
}
}
}
function updateItemHit() { // dangerous items disappear when it hits the trash can
for (var i = 0; i < dropping_weapons.length; i++){
var item = dropping_weapons[i];
if(itemHitsTrashCan(item)) {
dropping_weapons.splice(i, 1);
item_score++; //score increases
item_interval += 1;
}
}
}
function item_update() { // update random items from the top
if(item_counter % item_interval == 0){
var new_item = makeItem(random(10, 440), -80, random(weapons));
dropping_weapons.push(new_item);
var new_non = makeNonWeap(random(9,430),-80, random(nonWeaps));
dropping_nonWeaps.push(new_non);
item_counter = item_counter % item_interval;
}
if(keyIsDown(RIGHT_ARROW) & this.x < width - 10){ // right arrow moving the trash can
this.x += rate;
}
if (keyIsDown(LEFT_ARROW) & this.x > -10){ // left arrow moving the trash can
this.x -= rate;
}
item_counter++;
updateItemY();
updateNonWeapY();
updateItemHit();
updateNonWeapHit();
ScoreMax();
ScoreMin();
}
function setup() {
createCanvas(450, 450);
introPage = true; // intro page is "true" here because it should start with this
score = 0; //initial score
introScreen = loadImage("https://i.imgur.com/EWQ38kD.png"); // home screen
item_setup(); // calls the item setup function to combine
}
function keyPressed(){
if (item_startPage | item_finishPage){
item_keyPressed();
} else if(item_finishPage & key == ENTER){ //going back to start page
setup();
}
}
function draw() {
if (introPage == true) { // draws the intro page
push();
scale(1/4);
image(introScreen, 0, 0);
pop();
} else {
item_draw(); // game page
}
}
function mouseClicked() {
var xx = mouseX;
var yy = mouseY;
if (introPage) {
if (0 < xx & xx < width & 0 < yy & yy < height) { //click any part of the screen
item_startPage = true; // start page shows up
introPage = false;
}
}
}