Forum Discussion

Tim_'s avatar
Tim_
Community Member
10 months ago

Assign multi-line text value to variable

How do you assign a multi-line value to a text variable in Storyline 360. Pasting in more than one line in the ‘text’ variable only stores the first line.

i want the slide to load, then the variable to be available with the multiline value, so that javascript that executes on the slide load is able to read and use that value without user interaction.

Also, can you read the value of the current slide ‘notes’ (transcript) using variables/javascript?

  • As for reading the Notes into a variable, yes you can.

    See the attached .story file for an example.

    It uses a short script (it has a lot of comments, but is short) to extract the Notes text from the DOM and put it into a variable, which is diplayed on the slide.

    The script has a few options you can set in the variables.

    Main constraints are (Modern Player)

    1. Your Menus & Controls must be on
    2. Your side menu Notes tab must be enabled

    I have included an option to hide the Notes tab in the side menu if you don't want it visible.

    I also added an option to completely hide the Menus & Controls frame from view, but still have the conetnts accessible (i.e., the Notes), if you don't want that visible either. This is experimental, so test.

    See the script for details (added some error checks)

    //Get contents of Notes page into a single text variable
    //
    //To be accessible, Player settings must be:
    //Menus & Controls must be On
    //Notes must be checked in player's Player Tabs menu
    
    const hideNotesTab = true;//Hide Notes tab is side menu
    const hideMenusAndControls = false;//Make sure Player's Menus & Controls are On first
    
    var notes = "";
    
    //use this as a linebreak in the variable
    //<br> will insert a break in text when displayed in SL via %notes% 
    const lb = "<br>";
    
    //----Optional to hide the Notes tab in the side menu-----------------
    
    //If you don't want user to see a Notes tab in the side menu, then use this to hide it
    if (hideNotesTab) {
    	try {
    		document.getElementById("transcript-tab").style.visibility = "hidden";
    	} catch(err) {
    		console.log("Is the Notes tab enabled?", err.message);
    	}
    }
    
    //----End, Notes tab--------------------------------------------------
    
    //----Optional to hide the Menus & Controls---------------------------
    //if you want it to look like the Menus & Controls are set to Off, but still have Notes access
    //then try the following (Player Menus & Controls needs to be set to ON for this to work):
    //Note- you should test this to make sure everything works as expected before releasing
    
    if (hideMenusAndControls) {
    	try {
    		//The menus and controls are found in the <div> with id="frame" 
    		var f = document.getElementById("frame");
    
    		//if this frame is not already hidden
    		if (f.style.visibility !== "hidden") {
    			//The slide content is found in the <div> with id="slide", inside the one above if it is present
    			var s = document.getElementById("slide");
    
    			//move the slide contents out of the frame div, and insert it before it
    			f.parentNode.insertBefore(s,f);
    
    			//hide the frame div. Essentially replicates hiding the Menus & Controls,
    			//but the notes and other elements are still there, just not visible
    			f.style.visibility = "hidden";
    		}
    	} catch(err) {
    		console.log("Did you enable the Menus & Controls frame?", err.message);
    	}
    }
    //----End, Menus & Controls-------------------------------------------
    
    //get all of the lines in the notes section (for this slide)
    var el = document.querySelectorAll("div.note-content p span");
    
    //For each line of notes, extract the text and concatenate onto previous text
    //insert your linebreak between lines
    el.forEach((e) => {
    	//get text content only (removes added html tags)
    	//but leaves any tags you typed into the text itself
    	notes += e.innerText + lb;
    });
    
    //remove extra linebreak from end of string
    notes = notes.slice(0,-(lb.length));
    
    //test the output
    //console.log("Notes:",notes);
    
    //Send to Storyline
    GetPlayer().SetVar("notes",notes);

     

    • DonGriesheimer's avatar
      DonGriesheimer
      Community Member

      Nathan_Hilliard, thank you for sharing your code. I definitely appreciate the comments within the code. I am attempting to create a minimal "player" without using the Storyline 360 player frame. I realize that I will lose some functionality, but it is for a limited set of short (3-5) just in time trainings.

      My company, American Nurses Association, requires that I get permission to use other's IP (which includes your code) in my company's products. If you are willing, please reply to this message with a statement of permission to use. Thank you for your consideration of this request.

      • Nathan_Hilliard's avatar
        Nathan_Hilliard
        Community Member

        Yes, you can use the code as you wish. Since access to the notes requies the player frame and Notes tab to be present, you will have to try using the hideMenusAndControls option. Like I said, I just threw this together yesterday so you will want to test your slides for the required functionality before you get too far along. 

  • Adding my voice to Tim's last question, can you read the value of the current slide notes (transcript) into a variable using javascript? And if so, can you then use that javascript in the master slide template to load the notes from the slide into a variable and display that variable on a master slide layer to be called from the base slide layer?

  • OMG, I'm a relative newbie when it comes to writing javascript. Your script would have taken me days, if not weeks, to create. Thank you, thank you, thank you! I am working on this project while working on another one. I'll keep you posted about the hideMenusAndControls options. Preliminary testing has proven successful.