Click each tab to learn next - Next button

mmalhotra-4421
mmalhotra-4421 Community Member Posts: 21 ☆ Roadie ☆
Hi,
  1. I have three buttons leading to more content on clicking them.
  2. However, I don't want users to go to NEXT button without going through all the three tabs.
  3. What action do I put to deactive the next button till all 3 tabs are gone through.

Comments

  • cainam
    cainam Community Member Posts: 365 ♦ Idol ♦
    There are a lot of ways to do that - the way I found to make it more quickly to repeat, is to:
    1. Put a transparent button over the next button.  On click, display message "please participate in all activities on the page before continuing" (or something generic enough it will apply across other scenarios).
    2. add an action to each button to modify a variable - lets call them var1 for button 1, var2 for button 2, var3 for button 3 (Good to have these save between sessions as well).  make that the first action of the button. You can modify however you like, but lets say you make the initial value zero for each, and change the value to 1 when the button is clicked.
    3. the last action of each button can be the same.  (meaning make once, and copy/paste to the others). Hide the transparent button (from step 1), with condition that must all be met - var1 equals 1, var2 equals 1, var3 equals 1.
    4. bonus page action - in case the user revisits the page, you don't want them to have to click through again since they already did - so on page show, hide transparent button with the same conditions from the step above.
    Might seem like a lot at first, but this becomes very quick to replicate in the future, and will open up a lot more interactivity you can create in the future once you get comfortable leveraging variables in these more simple scenarios.  A quicker way if you don't need to make absolutely sure they clicked each button, but to at least know they clicked  button(s) 3 times, is to just use one variable (var1), and have it 'add 1' to the total instead of setting the variable to specific value.  Then your condition to hide the transparent button would be if var1 was greater than 2. (since you have 3 buttons).

    I went ahead and mocked this up in a module (attached).  This literally took me 3 minutes from start to finish creating everything in this demo.  At first, getting the concepts down will take some time, but once you get used to it, it will be very quick to do.
    - Adam Cain
  • mmalhotra-4421
    mmalhotra-4421 Community Member Posts: 21 ☆ Roadie ☆
    Thank you Adam for being such a great help and guide.

    I tried option 1, the message displays. However, once all the tabs are clicked - the Display message still appears.

    Is there a link where I can learn variables? I haven't ever worked on it ever in Lectora (just storyline 3).

    Also, for bonus page - do I need to create a new page?

    Kindly guide.

     

     
  • cainam
    cainam Community Member Posts: 365 ♦ Idol ♦
    I know Lectora has some courses related to variables - probably some webinars or actual classes you can take.  I'll let someone else chime in on that - I'm not positive on the details.  I'd recommend taking those courses to get you grounded - used to be a beginner, intermediate, and advanced course...

    You have a good start - but there isn't really a need to complicate things by having the pop-up info on separate pages - you can have it all on the same page.  (show the image, hide the others essentially).  I've mocked up your .awt with that style to get you started.  You need variables to trigger so you know the user has clicked the button - that is essentially all you are doing.  Then an action to hide the transparent button if those conditions are met. (Maybe someone else has an easier setup option as well).

    (I also changed the type of course to a SCORM/AICC style out of habit - you can change the settings back if you don't need this course in an LMS).
    - Adam Cain
  • carlfink
    carlfink Community Member Posts: 1,099 ✭ Legend ✭
    Not to argue with Adam, whose method will work fine.

    My own standard solution is to have the Next button hidden when the student arrives on the page. Whenever a tab is clicked, a variable goes up by 1. The second action on the button says "If this variable is 3 (or whatever number) or higher then Show the button." There are variations (such as disabling the button instead of hiding it).
  • mmalhotra-4421
    mmalhotra-4421 Community Member Posts: 21 ☆ Roadie ☆
    Thank you Adam and Carl. I am practicing the mock up file you shared to learn more.

    Regards

    Malvika
  • carlfink
    carlfink Community Member Posts: 1,099 ✭ Legend ✭
    Just in case anyone reads this thread later, I meant "a second action on each tab" and not "button".
  • mmalhotra-4421
    mmalhotra-4421 Community Member Posts: 21 ☆ Roadie ☆
    Hi Adam/Carl,

    I tried replicating the mock file, but my file seems to be missing something.

    I am unable to figure that out, request if you could check where am I going wrong under "Guidelines" section in the attached file.

    Regards

    Malvika
  • cainam
    cainam Community Member Posts: 365 ♦ Idol ♦
    Hi Malvika - I think you are close.  What you are missing is in the properties tab of the pop-up images (or group), and properties of the button.  Essentially you want the group your pop-ups are in to be "Initially Hidden", and your buttons you don't want to be "Always on Top".  These options are in the 'Appearance' area of the Properties Tab - please see screenshot:
    - Adam Cain
  • mmalhotra-4421
    mmalhotra-4421 Community Member Posts: 21 ☆ Roadie ☆
    Thank you for being such a good teacher Adam. This motivates me to continue practicing Lectora.

    There are few things that are still incomplete at my end - can't figure out, as attached.
  • mmalhotra-4421
    mmalhotra-4421 Community Member Posts: 21 ☆ Roadie ☆
    Any luck with this one? What am i missing?
  • cainam
    cainam Community Member Posts: 365 ♦ Idol ♦
    Really the same 2 options from the screenshot above.  all of your image assets that show up when you click the button should NOT be initially visible (checkbox).  And the buttons you want behind the images once clicked (so don't make them always on top, and either make sure those images are layered above the buttons, or check those images so they are 'always on top'.
    - Adam Cain
  • mmalhotra-9265
    mmalhotra-9265 Community Member Posts: 416 ✶ Headliner ✶
    It worked ..thank you Adam.

    Regards

    Malvika
  • mmalhotra-9265
    mmalhotra-9265 Community Member Posts: 416 ✶ Headliner ✶
    Hi,

    I tried this again but my actions aren't allowing me a polished review.
    Kindly suggest and guide on where am I going wrong?

    Regards
    Malvika