Forum Discussion

SaeedChopdat's avatar
SaeedChopdat
Community Member
7 days ago

Keyword or Phrases Javascript

Hi,

I am trying to create something in Storyline, which could have multiple different answers, so wondered if anyone has created a Javascript based on keywords. or know how to do this with variables in Storyline?

EG, Please could you list the steps for making an omelet:-

1 student could write, First I would crack an egg, and another answers, I will start by cracking an egg.  so the keywords could be Crack or Cracking.

 

Once answered they will be directed to a correct or try again layer with feedback.

 

Any help would be greatly appreciated.

 

PS. I have no knowledge of JavaScript, and I did get ChatGPT to write one for me, but it doesn't seem to work.

 

 

  • SaeedChopdat's avatar
    SaeedChopdat
    Community Member
    6 days ago

    Hi SamHill

    Thank you for all your help and support on here.

    I have sent you an invitation on LinkedIn.

    Thanks,

  • SamHill's avatar
    SamHill
    Super Hero
    7 days ago

    Hi there SaeedChopdat you will have to use JavaScript as we cannot look at a string of text in Storyline and see if it "contains" a word.

    I'm going to assume you are comfortable with Storyline and Storyline triggers. In order to use the JavaScript, you can use Storyline variables, and change the value of them to trigger an outcome in Storyline. For example, a "step01Correct" text variable could be initialised as "" and when you evaluate if step 01 is correct, the value of "step01Correct" could be set to "true" or "false" which then can trigger an action in Storyline (when variable changes). The reason I didn't opt for a "True/False" variable, is you need three values in order to detect a change in the variable value. As setting a variable to "false" when already "false" will not trigger a variable change action. OK, that's that bit.

    A consideration for the JavaScript function too is that it should find whole words only. Otherwise you may get a false positive on "crack" in a word like "firecracker".

    Add the following function to your project (JavaScript on timeline start on the slide with the interaction)

    window.findWordInString = function(slvar, word, slresultVar) {
    // get the storyline player
    const player = GetPlayer();
    // get the string from the storyline variable
    const text = player.GetVar(slvar);
    // check if the text and word are strings
    if (typeof text !== 'string' || typeof word !== 'string') {
        throw new TypeError('Both text and word must be strings');
    }
    if (text.length === 0 || word.length === 0) {
        return false;
    }
    // Create a regular expression pattern with word boundaries
    const pattern = `\\b${word}\\b`;
    // Add case-insensitive flag if not case sensitive
    const regex = new RegExp(pattern, 'i');
    // test the regex against the text  
    const result = regex.test(text);
    // set the result variable with the result in storyline
    player.SetVar(slresultVar, result+"");
}

    You will then call this function when you need to. The function takes three arguments.

    slvar = Name of the Storyline variable with the string the user has type (typically associated with the input text box)

    word = The word you are searching for in the string

    slresultVar = Name of the Storyline variable that will store the result. Initialised as "" and then set to either "true" or "false"

    The function could be called in anyway you would like. For example, executing JavaScript on a button click. The following function assumes the following:

    step01 is a Storyline variable (type:Text) that is associated with the input box.

    "egg" is the word we are searching for in step01

    step01Result is a Storyline variable (type:Text) that is used to trigger another action in Storyline when "variable changes". The value it will change to is either "true" or "false".

    window.findWordInString(step01, "egg", step01Result);

     

Related Content