xxxxxxxxxx
248
let gameState = 'start';
let backgroundImage;
//creating the arrays of images for each piece of furniture and diaglogue bubble and starting the current image from first position.
let sofas = [];
let currentSofa = 0;
let leftDecors = [];
let currentLeftDecor = 0;
let rightDecors = [];
let currentRightDecor = 0;
let lamps = [];
let currentLamp = 0;
let bubbles = [];
let currentBubble = 0;
let paymentStopped = false;
let randomPayment = 0;
//loading all the images and sounds before setup runs
function preload() {
clicking = loadSound("sounds/clicking.mp3");
piano = loadSound("sounds/piano.mp3");
backgroundImage = loadImage("images/room.png");
instructionsImage = loadImage("images/begin_new.gif");
paymentImage = loadImage("images/end_new.gif");
characterImage = loadImage("images/character.png");
// Loading images of each piece of furniture to an array of that piece of furniture
sofas[0] = loadImage("images/sofa_0.png");
sofas[1] = loadImage("images/sofa_1.png");
sofas[2] = loadImage("images/sofa_2.png");
sofas[3] = loadImage("images/sofa_3.png");
sofas[4] = loadImage("images/sofa_4.png");
sofas[5] = loadImage("images/sofa_5.png");
leftDecors[0] = loadImage("images/leftDecor_0.png");
leftDecors[1] = loadImage("images/leftDecor_1.png");
leftDecors[2] = loadImage("images/leftDecor_2.png");
leftDecors[3] = loadImage("images/leftDecor_3.png");
leftDecors[4] = loadImage("images/leftDecor_4.png");
leftDecors[5] = loadImage("images/leftDecor_5.png");
rightDecors[0] = loadImage("images/rightDecor_0.png");
rightDecors[1] = loadImage("images/rightDecor_1.png");
rightDecors[2] = loadImage("images/rightDecor_2.png");
rightDecors[3] = loadImage("images/rightDecor_3.png");
rightDecors[4] = loadImage("images/rightDecor_4.png");
rightDecors[5] = loadImage("images/rightDecor_5.png");
lamps[0] = loadImage("images/lamp_0.png");
lamps[1] = loadImage("images/lamp_1.png");
lamps[2] = loadImage("images/lamp_2.png");
lamps[3] = loadImage("images/lamp_3.png");
lamps[4] = loadImage("images/lamp_4.png");
lamps[5] = loadImage("images/lamp_5.png");
//loading the images of dialogue bubbles to the array of dialogue bubbles
bubbles[0] = loadImage("images/bubble_0.png");
bubbles[1] = loadImage("images/bubble_1.png");
bubbles[2] = loadImage("images/bubble_2.png");
bubbles[3] = loadImage("images/bubble_3.png");
bubbles[4] = loadImage("images/bubble_4.png");
bubbles[5] = loadImage("images/bubble_5.png");
}
function setup() {
createCanvas(1000, 400);
restartGame(); //game starts with the restart function
piano.play(); //game starts with the piano music playing
}
function restartGame() {
gameState = 'start'; //the game is at starting state
}
function draw() {
background(220);
//the function is called at every state of the game
if (gameState == 'start') {
drawInstructions();
} else if (gameState == 'playing') {
drawGame();
} else if (gameState == 'end') {
drawEndScreen();
}
}
//the actions done every time mouse clicked on certain areas
function mouseClicked() {
clicking.play (); //every click is accompanied with clicking sound
// everything inside this conditional happens only in the playing state, which is the state inside the room
if (gameState == 'playing') {
//if the mouse is clicked inside the area of piece of furniture, the next image is shown from the array of that piece of furniture
if (mouseX >= width / 2 - sofas[0].width / 2 &&
mouseX <= width / 2 - sofas[0].width / 2 + sofas[0].width &&
mouseY >= height * 0.5 &&
mouseY <= height * 0.5 + sofas[0].height) {
currentSofa++;
if (currentSofa >= sofas.length) {
currentSofa = 0;
}
} else if (mouseX >= width * 0.2 &&
mouseX <= width * 0.2 + leftDecors[0].width &&
mouseY >= height * 0.4 &&
mouseY <= height * 0.4 + leftDecors[0].height) {
currentLeftDecor++;
if (currentLeftDecor >= leftDecors.length) {
currentLeftDecor = 0;
}
} else if (mouseX >= width * 0.65 &&
mouseX <= width * 0.65 + rightDecors[0].width &&
mouseY >= height * 0.4 &&
mouseY <= height * 0.4 + rightDecors[0].height) {
currentRightDecor++;
if (currentRightDecor >= rightDecors.length) {
currentRightDecor = 0;
}
} else if (mouseX >= width / 2 - lamps[0].width / 2 &&
mouseX <= width / 2 - lamps[0].width / 2 + lamps[0].width &&
mouseY >= 0 &&
mouseY <= height * 0.5 + lamps[0].height) {
currentLamp++;
if (currentLamp >= lamps.length) {
currentLamp = 0;
}
//if the mouse is clicked inside the area of image of character, the next image of dialogue bubble with text is shown from the array of the bubbles
} else if (mouseX >= width * 0.02 &&
mouseX <= width * 0.02 + characterImage.width &&
mouseY >= height * 0.1 &&
mouseY <= height * 0.1 + characterImage.height) {
currentBubble++;
if (currentBubble >= bubbles.length) {
currentBubble = 1;
}
}
}
//one button is responsible for changing the game states. Every time the rectangle is clicked, the state of the game changes.
if (mouseX >= width * 0.8 &&
mouseX <= width * 0.9 &&
mouseY >= height * 0.8 &&
mouseY <= height * 0.9) {
if (gameState == 'start') {
gameState = 'playing';
stopPayment() ; //random payment amount is generated every time the game starts
} else if (gameState == 'playing') {
gameState = 'end';
} else if (gameState == 'end') {
//the design is returned back to default design of interior, which is the image in the first position of each array of images.
currentSofa = 0;
currentLeftDecor = 0;
currentRightDecor = 0;
currentLamp = 0;
currentBubble = 0;
restartGame();
}
}
return false;
}
//drawing all the necessary images in the playing state.
function drawGame() {
image(backgroundImage, 0, 0);
image(characterImage, 20, 100);
//showing the current chosen pieces of furniture and last dialogue box
image(sofas[currentSofa], width/2-sofas[0].width/2, height*0.5);
image(leftDecors[currentLeftDecor], width*0.2, height*0.4);
image(rightDecors[currentRightDecor], width*0.65, height*0.4);
image(lamps[currentLamp], width/2-lamps[0].width/2, 0);
image(bubbles[currentBubble], width*0.12, height*0.01);
//"SELL" button design and size
fill(255,162,19); // Pink color in RGB
strokeWeight(4);
stroke(0, 0, 139)
rect(width * 0.8, height * 0.8, width * 0.9 - width * 0.8, height * 0.9- height * 0.8, 20);
noStroke();
fill(0, 0, 139);
textSize(20);
textStyle(BOLD);
text('SELL', (width * 0.8+ width * 0.9)/2 -textWidth('SELL')/2, (height * 0.9 + height * 0.8)/2 +7);
}
//showing the instructions image in the start state.
function drawInstructions() {
background(255);
image(instructionsImage, 0, 0);
//"PLAY" button design and size
fill(255, 255, 0);
strokeWeight(4);
stroke(0, 0, 139)
rect(width * 0.8, height * 0.8, width * 0.9 - width * 0.8, height * 0.9- height * 0.8, 20);
noStroke();
fill(0, 0, 139);
textSize(20);
textStyle(BOLD);
text('PLAY', (width * 0.8+ width * 0.9)/2 -textWidth('PLAY')/2, (height * 0.9 + height * 0.8)/2 +7);
}
//function generating the random amount of payment
function stopPayment() {
randomPayment = '$' + Math.floor(random(2000, 20001)); // Generate a random payment amount
paymentStopped = true;
}
//showing the payment image in the end state.
function drawEndScreen() {
image(paymentImage, 0, 0);
// Rectangle design for displaying the random payment amount
fill(255, 105, 180);
strokeWeight(4);
stroke(0, 0, 139);
rect(width * 0.5, height * 0.4, width * 0.8 - width * 0.5, height * 0.6 - height * 0.4, 20);
noStroke();
if (!paymentStopped) {
fill(0, 0, 139);
textSize(40);
text('Calculating...', (width * 0.8 + width * 0.5)/2 - textWidth('Calculating...')/2, (height * 0.6 + height * 0.4)/2+10);
}
// Display the random payment amount
else {
fill(0, 0, 139);
textSize(40);
text(randomPayment, (width * 0.8 + width * 0.5)/2 - textWidth(randomPayment)/2, (height * 0.6 + height * 0.4)/2+10);
}
//"RESTART" button design and size
fill(173, 216, 230);
strokeWeight(4);
stroke(0, 0, 139)
rect(width * 0.8, height * 0.8, width * 0.9 - width * 0.8, height * 0.9- height * 0.8, 20);
noStroke();
fill(0, 0, 139);
textSize(17);
textStyle(BOLD);
text('RESTART', (width * 0.8+ width * 0.9)/2 -textWidth('RESTART')/2, (height * 0.9 + height * 0.8)/2 +7);
}