I am working on a school project. It is a dress-up game where the user dresses up "Lucy" in three outfits. Everything works great until the dates (actual dates "Lucy" is going on).
The dates are just pictures I found on Pinterest. After each date, she would need to go back to her room to change again. However, each sprite background is just a layer and I draw layers on top of the previous one every time the user switches to a new screen.
It is really hard to explain, but every time I click on a button, another button at the same place gets clicked too. Although the second button can't be seen, it still calls that function and works. I used code.org for this project since I couldn't find any other website to code that has an easy-to-navigate interface.
World.frameRate = 60;
function date1() {
if (mousePressedOver(startingbutton)) {
instruction.visible = true;
instructionbutton.visible = true;
instructionbutton3.depth = 14;
}
if (mousePressedOver(instructionbutton)) {
showLucyRoom();
instructionbutton.visible = false;
instructionbutton2.depth = 10;
}
if (mousePressedOver(schoolbutton)) {
CropTop.visible = false;
sweat.visible = false;
dress.visible = false;
school.visible = true;
school.scale = 0.6;
instructionbutton2.visible = true;
}
if (mousePressedOver(sweatbutton)) {
CropTop.visible = false;
school.visible = false;
dress.visible = false;
sweat.visible = true;
sweat.scale = 1;
instructionbutton2.visible = true;
}
if (mousePressedOver(dressbutton)) {
CropTop.visible = false;
school.visible = false;
sweat.visible = false;
dress.visible = true;
dress.scale = 1;
instructionbutton2.visible = true;
}
if (mousePressedOver(instructionbutton2)) {
showCafe();
}
if (mousePressedOver(instructionbutton3)) {
showLucyRoom();
}
}
function date2() {
if (mousePressedOver(startingbutton)) {
instruction.visible = true;
instructionbutton.visible = true;
instructionbutton3.depth = 10;
instructionbutton4.visible = false;
}
if (mousePressedOver(instructionbutton)) {
showLucyRoom();
stalker.visible = true;
stalker.depth = 6;
instructionbutton4.visible = false;
instructionbutton4.depth = 10;
}
if (mousePressedOver(schoolbutton)) {
CropTop.visible = false;
sweat.visible = false;
dress.visible = false;
school.visible = true;
school.scale = 0.6;
instructionbutton4.visible = true;
instructionbutton4.visible = false;
}
if (mousePressedOver(sweatbutton)) {
CropTop.visible = false;
school.visible = false;
dress.visible = false;
sweat.visible = true;
sweat.scale = 1;
instructionbutton4.visible = true;
instructionbutton4.visible = false;
}
if (mousePressedOver(dressbutton)) {
CropTop.visible = false;
school.visible = false;
sweat.visible = false;
dress.visible = true;
dress.scale = 1;
instructionbutton4.visible = true;
instructionbutton4.visible = false;
}
if (mousePressedOver(instructionbutton4)) {
showMuseum();
}
if (mousePressedOver(instructionbutton3)) {
showLucyRoom();
}
}
function showLucyRoom() {
LucyRoom.visible = true;
CropTop.visible = true;
CropTop.scale = 0.6;
schoolbutton.visible = true;
schoolbutton.scale = 0.4;
sweatbutton.visible = true;
sweatbutton.scale = 0.4;
dressbutton.visible = true;
dressbutton.scale = 0.4;
cafe.visible = false;
museum.visible = false;
instructionbutton3.visible = false;
instructionbutton3.depth = 14;
}
function showCafe() {
cafe.visible = true;
cafe.scale = 2.3;
text("This was super fun, I’d love to go with you again!", 28, 26);
instructionbutton3.visible = true;
instructionbutton3.depth = 14; // Ensure instructionbutton3 is on top
}
function showMuseum() {
museum.visible = true;
museum.scale = 2.3;
text("This is the second date of the day!", 28, 26);
instructionbutton3.visible = true;
instructionbutton3.depth = 14; // Ensure instructionbutton3 is on top
}
var background = createSprite(200, 200);
background.setAnimation("StartingPage");
var startingbutton = createSprite(104, 228);
startingbutton.setAnimation("StartingPageButton");
var instruction = createSprite(200, 200);
instruction.visible = false;
instruction.setAnimation("InstructionPage");
var instructionbutton = createSprite(88, 372);
instructionbutton.visible = false;
instructionbutton.setAnimation("InstructionPageButton");
var instructionbutton2 = createSprite(240, 320);
instructionbutton2.visible = false;
instructionbutton2.setAnimation("InstructionPageButton");
var instructionbutton3 = createSprite(328, 354);
instructionbutton3.visible = false;
instructionbutton3.setAnimation("InstructionPageButton");
var instructionbutton4 = createSprite(238, 268);
instructionbutton4.visible = false;
instructionbutton4.setAnimation("InstructionPageButton");
var LucyRoom = createSprite(200, 200);
LucyRoom.visible = false;
LucyRoom.setAnimation("Lucy'sRoom.jpg");
var CropTop = createSprite(72, 220);
CropTop.visible = false;
CropTop.setAnimation("CropTop");
var school = createSprite(72, 215);
school.visible = false;
school.setAnimation("School");
var schoolbutton = createSprite(218, 138);
schoolbutton.visible = false;
schoolbutton.setAnimation("SchoolButton");
var dress = createSprite(100, 215);
dress.visible = false;
dress.setAnimation("dress");
var sweat = createSprite(72, 215);
sweat.visible = false;
sweat.setAnimation("sweatshirt");
var sweatbutton = createSprite(340, 138);
sweatbutton.visible = false;
sweatbutton.setAnimation("sweatbutton");
var dressbutton = createSprite(336, 310);
dressbutton.visible = false;
dressbutton.setAnimation("dressbutton");
var cafe = createSprite(200, 200);
cafe.visible = false;
cafe.setAnimation("cafe");
var museum = createSprite(200, 200);
museum.visible = false;
museum.setAnimation("museum");
var stalker = createSprite(117,236);
stalker.visible = false;
stalker.setAnimation("stalker");
function draw() {
date1();
date2();
drawSprites();
}
I've tried using .visible, but that only changes whether the user can see it or not. It doesn't actually stop the button from responding.