I made a falling game with images. When I click the x box button on the image, it generates another image. I can't figure out how I can make the images non-repeatable. So far, I have 6 png images, and they repeat when I play the game. I used for loop in the function preload. Please advise.
Here is my code.
//variables
let x = 10;
let y = 200;
let iw = 300;
let ih = 200;
let score = 0;
let speed = 1.5;
let screen = 0;
let bw = 24;
let bh = 20;
let slider;
var timerValue = 60;
// let ads;
let ads = [];
function preload() {
for (let i = 0; i < 6; i++) {
// ads[i] = loadImage(`ads/ad${i}.png`);
ads[i] = loadImage("ads/ad" + i + ".png");
}
}
function setup() {
createCanvas(windowWidth, windowHeight);
for (let i = 0; i < 1; i++){
img = random(ads);
}
button = createButton("X");
button.size(bw,bh);
button.mouseClicked(changeImage);
x1 = random(windowWidth-410);
slider = createSlider(0, 255, 100);
slider.position(18, 40);
slider.style('width', '80px');
setInterval(timeIt, 1000);
}
//which screen to display
function draw() {
let val = slider.value();
background(val);
if (screen === 0) {
startScreen();
}
if (screen === 1) {
startGame();
}
if (screen === 2) {
endGame();
}
}
//what happens when you tap on the canvas
function mousePressed() {
if (screen === 0) {
screen = 1;
}
if (screen === 2) {
screen = 0;
}
}
//what to display at the start
function startScreen() {
background(69);
fill(255);
textAlign(CENTER);
textSize(20);
text("IMAGE FALLING GAME", width / 2, height / 2);
text("Click To Start", width / 2, height / 2 + 30);
restart();
}
//Function for the game
function startGame() {
if (timerValue >= 10) {
text("0:" + timerValue, width / 2, height / 2);
}
if (timerValue < 10) {
text('0:0' + timerValue, width / 2, height / 2);
}
if (timerValue == 0) {
text('game over', width / 2, height / 2 + 15);
}
//score text
fill(255);
noStroke();
textSize(20);
textStyle(NORMAL);
text("Score: " + score, 60, 30);
//change the y value
y += speed;
image(img, x1, y-ih, iw, ih);
// button.position(iw-bw,y);
button.show();
// button.position(x1+iw-bw,y-ih);
button.position(x1+iw-bw,y-ih);
if (y > height) {
screen = 2;
}
}
//mouseCkicked event
function changeImage() {
for (let i = 0; i < 1; i++){
img = random(ads);
}
y = 0;
score++;
// speed += 0.5;
speed += 0.1;
let xpos = random(width);
// let xpos = random(x);
x1 = xpos;
button.position(xpos, y);
}
function timeIt() {
if (timerValue > 0) {
timerValue--;
}
}
//endgame screen
function endGame() {
background(255, 0, 0);
noStroke();
textAlign(CENTER);
textSize(20);
text("You Lost", width / 2, height / 2);
text("Score :" + score, width / 2, height / 2 + 20);
text("Click To Play Again", width / 2, height / 2 + 40);
button.hide();
timerValue = 60;
}
//restart function
function restart() {
y = 0;
speed = 1.5;
score = 0;
}
function reSet() {
score = 0;
}
Aucun commentaire:
Enregistrer un commentaire