Hi, I don’t really understand the Corvid and I am struggling to find a list of elements so I can translate. Basically I am building a tinny mini-game with three buttons where people have to click in the right order to then view a page.
Pseudo code would be something like this:
If button1_click
if then button3_click
if then button1_click
if then button2_click
if then button3_click
print(‘Well done!’)
→ here a button should appear to go to the next page
else:
print(‘Try again’)
I hope you understand the sequence so the buttons should be clicked 1,3,1,2,3, otherwise it should just say “try again” as soon as the chain is broken.
have no idea how to go about it because it creates events for one click as if one click was only one function but unfortunately that is not what I am trying to do.
Any suggestions?
Thank you for your time
How to make if-else-queries?
if ( ) { }
else { }
How to code buttons?
$w('#myButton1).onClick((event)=>{
//... here your code what to do when button was clicked.
})
So let’s GO!
$w('#myButton1).onClick((event)=>{
if ( ) { }
else { }
})
For one Button…
$w('#myButton1).onClick((event)=>{
let target = event.target
console.log(target)
})
For all Buttons…
$w('Button).onClick((event)=>{
let target = event.target
let targetID = event.target.id
console.log("TARGET = ", target)
console.log("TARGET-ID = ", targetID)
})
Take a look into the CONSOLE of PREVIEW-MODE or press F-12 in google-chrome-browser and go to console.
Take a look onto the results, when pressing on one of your buttons?
What can you recognize? What you have understood this part, try to complete the code using some if-else-queries.
$w('Button).onClick((event)=>{
let target = event.target
let targetID = event.target.id
console.log("TARGET = ", target)
console.log("TARGET-ID = ", targetID)
if (targetID === "button1") {console.log("button1-clicked"}
else if (targetID === "button2") {console.log("button2-clicked"}
else {console.log("button3-clicked"}
})
And also do not forget to put everything into a onReady-Command, like this…
$w.onReady(function () {
$w('Button).onClick((event)=>{
let target = event.target
let targetID = event.target.id
console.log("TARGET = ", target)
console.log("TARGET-ID = ", targetID)
if (targetID === "button1") {console.log("button1-clicked"}
else if (targetID === "button2") {console.log("button2-clicked"}
else {console.log("button3-clicked"}
})
})
Good luck and happy x-mas-coding.
Hi,
Firstly thank you so much that solves a lot of my confusion!! However there’s something I don’t fully understand if you wouldn’t mind clarifying:
$w ( '#myButton1 ). onClick ((event) => {
let target = event . target
console . log ( target )
})
I am undesrtanding this as "when clicking on button 1, the target will be the event target, so in the console the targuet is now actually the value of event.target. Is that correct? If so is the “event.targuet” the button being clicked?
When clicking on one of the buttons, you run an EVENT.
This EVENT has a target.
And every TARGET has an id. ----> EVENT.TARGET.ID
But you use just one button-selector.
You should better use the whole class.
This one is more flexible.
$w('Button').onClick((event)=>{ })
Or…range of several buttons…
$w('#button1, #button2, #button3, #button4').onClick((event)=>{ })
Helo Russian-dima
I have made two light boxes, one called “Welldone” and another one called “nope”, there’s no errors but the windows aren’t popping up. I don’t want to do it onReady because they have to interact with the buttons first. What did I do wrong?
Hello again.
You have wrong thinking.
Even if you would put it into the onReady perocedure, it would interact just by clicking one of the buttons.
Using → onReady is recommended!
Try first to use normal boxes. As beginner the handling with a lightbox is not recommended.
For more informations about lightboxes, see the API-Reference here…