xxxxxxxxxx
228
//Image
var pig;
var pigBot;
var coinCent;
var coinDime;
var coinQuarter;
var coinHalf;
var coinDollar;
var showCoin;
//SFX
var insertC;
var shake;
var empty;
//UI to open wallet
var showUI = false;
var saveMX;
var saveMY;
//Array
var coinType = [];
var coinChoice = [];
var insertC = [];
//Switch
var coinIn = false;
var phase = 0; //0: not moving, 1: shaking, 2: bottom open
//Counter
var coinCounter = 0;
var aCoin = 30;
var aShake = 300;
var aTime = 0;
var coinDrop = 0;
function preload() {
pig = loadImage("piggyBank.png");
pigBot = loadImage("piggyBottom.png");
coinCent = loadImage("cent.png");
coinDime = loadImage("dime.png");
coinQuarter = loadImage("quarter.png");
coinHalf = loadImage("half.png");
coinDollar = loadImage("dollar.png");
insertC1 = loadSound("d1.wav");
insertC2 = loadSound("d2.wav");
insertC3 = loadSound("d3.wav");
insertC4 = loadSound("d4.wav");
shake = loadSound("shake.wav");
empty = loadSound("toGround.wav");
}
function setup() {
createCanvas(600, 600);
coinType = [coinCent, coinDime, coinQuarter, coinHalf, coinDollar];
insertC = [insertC1, insertC2, insertC3, insertC4];
}
function draw() {
// console.log("coin counter is " + coinCounter);
// console.log("coin drop is " + coinDrop);
background(220);
if (phase == 0) {
piggy(300, 300);
} else if (phase == 1) {
aTime++;
push();
translate(random(30), random(30));
piggy(300, 300);
pop();
if (aTime >= aShake) {
phase = 0;
aTime = 0;
}
} else if (phase == 2) {
if (coinChoice.length > 0 && coinDrop <= coinCounter) {
let coinV = 14;
image(coinChoice[coinDrop], 300, 300 + aTime * coinV, 80, 80);
push();
translate(0, random(50));
piggy(300, 300);
pop();
//AnimationTime
if (aTime < 30) {
aTime++;
} else {
phase = 0;
aTime = 0;
coinDrop++;
}
}
//no coin
else {
phase = 0;
aTime = 0;
}
}
UI();
}
function mousePressed() {
if (
mouseX >= 225 &&
mouseX <= 420 &&
mouseY >= 25 &&
mouseY <= 130 &&
phase == 0 &&
aTime == 0
) {
coinChoice[coinCounter] = random(coinType);
random(insertC).play();
coinIn = true;
} else if (
phase == 0 &&
mouseX >= 135 &&
mouseX <= 465 &&
mouseY >= 160 &&
mouseY <= 440 &&
showUI == false
) {
saveMX = mouseX;
saveMY = mouseY;
showUI = true;
} else if (
phase == 0 &&
mouseX >= saveMX + 60 - 10 &&
mouseX <= saveMX + 60 + 10 &&
mouseY <= saveMY + 10 &&
mouseY >= saveMY - 10 &&
showUI == true &&
aTime == 0
) {
// console.log("yes");
showUI = false;
phase = 1;
shake.play();
} else if (
phase == 0 &&
mouseX >= saveMX - 60 - 10 &&
mouseX <= saveMX - 60 + 10 &&
mouseY <= saveMY + 10 &&
mouseY >= saveMY - 10 &&
showUI == true &&
aTime == 0
) {
showUI = false;
phase = 2;
empty.play();
}
console.log(coinChoice);
}
function arrow(x, y) {
noStroke();
fill(255, 0, 0);
rectMode(CENTER);
rect(x, y, 20, 50);
rectMode(CORNER);
triangle(x - 20, y + 25, x + 20, y + 25, x, y + 50);
}
function piggy(x, y) {
fill(0);
ellipse(x + 20, y - 15, 250);
imageMode(CENTER);
image(pig, x, y, pig.width / 2, pig.height / 2);
if (phase == 0) {
fill(255, 0, 0);
textSize(20);
textAlign(CENTER);
text("Press to insert coin!", x + 25, 40);
arrow(x + 25, 80);
}
let coinV = 6;
if (coinIn == true) {
if (aTime <= aCoin) {
aTime++;
image(
coinChoice[coinCounter],
x + 25,
80 + aTime * coinV,
80,
80
);
} else {
aTime = 0;
coinIn = false;
coinCounter++;
}
}
image(pigBot, x, y, pig.width / 2, pig.height / 2);
}
function UI() {
if (showUI == true) {
fill(120);
noStroke();
ellipse(saveMX, saveMY, 15);
noFill();
stroke(120);
strokeWeight(2);
ellipse(saveMX, saveMY, 120);
fill(255, 0, 0);
noStroke();
ellipse(saveMX + 60, saveMY, 20);
fill(0, 0, 255);
ellipse(saveMX - 60, saveMY, 20);
textSize(15);
fill(0);
textAlign(LEFT, CENTER);
text("Press the red button to shake piggy bank", 10, 560);
text("Press the blue button to open piggy bank", 10, 580);
}
}