Passing variables from LMS into an embed

Hi Matthew, that's interesting. So you're saying I might be able to access some Rise object from within the iframe using the `parent` object? Do you know what that object is in Rise? (equivalent to the GetPlayer() in Storyline used in that article)

I want to create virtual lab inside a Rise course. Essentially an iframe that'd display a command line powered by a docker container. The container instance would be user-specific though, so I need to pass information to that iframe about the user that's currently logged in and about some of their env variables.

Ok, hard is not a problem :-)  Where would you recommend I start?

Hi @Matthew and @Jan please let me know if you guys came up with a solution for this. Trying to do the same thing. 

Same here! I'm using Typeform to include a form where the user can upload an image. With typeform it's possible to add hidden fields that can be used in a query string to store the information, something like this typeformurl#userid=xxxxx&firstname=xxxxx

I created an html site with the typeform and the script to get the username from the lms. It does work great as a webobject in storyline, but it does not work as an iframe in rise as the iframe is denied accessing the lms. 

I guess I would have to first store the username in Rise and then pass it to the iframe. I haven't figured out a solution so far, any hint or suggestion is highly appreciated!

I think I could find a way, not sure if this would help anyone but in case that someone faces a similar challenge.

The downside with this approach is, that the webobject and the scorm package have to be uploaded to the same domain in order to use localStorage.

First step is creating the html file for the iframe in Rise. The html file would contain the follwoing script:

<script>

var iframeUserName = window.localStorage.getItem('localUserName');

</script>

After uploading the html file to the server I'll paste the url to Rise (Multimedia->Embed) and then publish the course for LMS.

I unzip the scorm package and open the index.html. Inside the scormcontent folder I go to the very end of the file and paste the following snippet before </body>:

    <script>

      /* this function looks for the lms API */

      function findLMSAPI(win) {

      // look in this window

      if (win.hasOwnProperty("GetStudentID")) return win;

      // all done if no parent

      else if (win.parent == win) return null;

      // climb up to parent window & look there

      else return findLMSAPI(win.parent);

      }

      var lmsAPI = findLMSAPI(this);
      
      // get the user ID and user name from the LMS

      var userID = lmsAPI.GetStudentID();

      var userName = lmsAPI.GetStudentName();

      // store the user name and user ID to localStorage 

      window.localStorage.setItem('localUserName', userID);

      window.localStorage.setItem('localUserID', userName);

    </script>

It is important that the parameters in setItem match getItem from the iframe match.

That is my current approach. Any comment, improvement, idea is highly appreciated.

Thanks so much for your contribution, Fabian!