Create a continue button

Home Forums FAQ / Tips Create a continue button

Viewing 1 post (of 1 total)
  • Author
    Posts
  • #1597
    Jeremy
    Keymaster

    The most simple way of having a continue button anywhere in your trial is to create a Button element using newButton and then use the commands print and wait:

    newButton("continue", "Click here to continue")
        .print()
        .wait()
    

    However if you use many continue buttons this can rapidly become a hassle. And if you use more than one such continue button within one trial, you either have to give each of them different names, or create one Button element atop of your trial’s script and refer back to it each time using getButton. Finally, you may prefer continue to appear as some text link rather than as a button.

    Here is a method that will save you some time (explanations below):

    var continueLinks = 0;
    var clickContinue = text => [
        continueLinks++
        ,
        newText("continue_text_"+continueLinks, text||"Click here to continue")
            .settings.color("blue")
            .print()
        ,
        newSelector("continue_selector_"+continueLinks)
            .settings.add( getText("continue_text_"+continueLinks) )
            .wait()
        ,
        getText("continue_text_"+continueLinks)
            .remove( )
    ];
    
    PennController(
        newText("hello", "Hello")
            .print()
        ,
        clickContinue()
        ,
        newText("world", "World")
            .print()
        ,
        clickContinue("Click to finish")  
    );
    

    This script creates a JavaScript function called clickContinue which generates an array of PennController commands. The commands within clickContinue create a new Text element and a new Selector element each time, this is why we use a JavaScript variable that we named continueLinks and that we increment each time to ensure the name of the elements are unique (the elements are named "continue_text_0" and "continue_selector_0" by the first clickContinue() and "continue_text_1" and "continue_selector_1" by the second clickContinue()).

    This solution exploits the fact that PennController evaluates JavaScript arrays of commands as a simple series of commands (and ignores non-PennController-commands contained in the array). So technically, the script above is equivalent to this:

    PennController(
        newText("hello", "Hello")
            .print()
        ,
        [
          newText("continue_text_0", "Click here to continue")
              .settings.color("blue")
              .print()
          ,
          newSelector("continue_selector_0")
              .settings.add( getText("continue_text_0") )
              .wait()
          ,
          getText("continue_text_0")
              .remove()
        ]
        ,
        newText("world", "World")
            .print()
        ,
        [
          newText("continue_text_1", "Click to finish")
              .settings.color("blue")
              .print()
          ,
          newSelector("continue_selector_1")
              .settings.add( getText("continue_text_1") )
              .wait()
          ,
          getText("continue_text_1")
              .remove()
        ]
    );
    

    Which is equivalent to the exact same script without the [‘s and ]‘s.

Viewing 1 post (of 1 total)
  • You must be logged in to reply to this topic.