Fullscreen option for embedded Storyline course within Rise

Jul 15, 2021

Sam Kay
By Sam Kay

Hi all,

Apologies if this question has been asked already.

In Rise, when embedding Storyline content, we have the option to scale the content to small, medium, or full-width. I wondered if it would be possible to allow the users a fullscreen option for the Storyline player?

I am developing some e-learning for a new cloud system currently, and so the course size is 1920px x 1080px as this matches the screen resolution of the majority of laptops that will be watching it. The system will also mostly be run at this resolution, and so it makes sense to have the course be the same size so that it matches the screenshot size perfectly (no horizontal or vertical stretching).

The full-width resolution works perfectly for the width, but when you include the player the height becomes an issue - you have to be really precise with the scroll bar to include both the full course and the seekbar. I would ideally like to make the content medium with the option to full-screen it if needed. Is this possible or is it something that could be evaluated as a possible feature?

 

Many thanks,

Sam

33 Replies
Albert Miquel i Serrat
over 1 year ago09/12/22 at 12:44 pm (UTC)

Hello all,
I've found a way to allow full screen on Rise. It seems the Storyline wrapper in the Rise HTML doesn't allow full screen. However, when you insert the activity multimedia > embed, you can embed whatever iFrame you create, and here's how you do it. See the process below:

1. Publish your storyline with a button that triggers this JS code:

function requestFullScreen(element) {
    // Supports most browsers and their versions.
    var requestMethod = element.requestFullScreen || element.webkitRequestFullScreen || element.mozRequestFullScreen || element.msRequestFullScreen;

    if (requestMethod) { // Native full screen.
        requestMethod.call(element);
    } else if (typeof window.ActiveXObject !== "undefined") { // Older IE.
        var wscript = new ActiveXObject("WScript.Shell");
        if (wscript !== null) {
            wscript.SendKeys("{F11}");
        }
    }
}

var elem = document.body; // Make the body go full screen.
requestFullScreen(elem);

2. Access the review link and copy the iFrame from the browser inspector (access the inspector by pressing F12 or right-click on Review > Inspect).

3. Add a multimedia > embed activity in Rise360

4. Paste the iFrame HTML code you obtained in Review360 from step 2 in the content text field.

 

You should be good to go. ;-)

NOTE 1: I choose to use two buttons: one to activate full screen (pasted in step 1) and another to exit it (document.exitFullscreen();). using true-false variables I set up my SL360 to display one or the other accordingly. However, there are several ways to do it and you should adapt your JS code accordingly.

NOTE 2: some LMS restrict the iFrames to NOT allow full screen. If you want to upload your course as SCROM into an LMS, I suggest you do it using the last version of the SCORM format. You'd better test it first using SCORM Cloud.

Amy O'Neill
11 months ago05/31/23 at 9:44 am (UTC)

This would be a very helpful feature upgrade. 

I have created a slide in Storyline that has a video "Inserted from a website" (Vimeo). I have published this to Rise to place into a Storyline block in Rise. However, the full-screen option in Vimeo isn't available. I have also ensured that the setting is set correct in Vimeo to show.

Angelo Cruz
9 months ago08/04/23 at 12:10 am (UTC)

Hi Alexandra! Yes, there isn't an option to show a Storyline block in fullscreen when previewing the Rise course.

I'm glad to hear that you're able to see this option with the published output in your LMS.

We'll post updates to this thread if we receive any news about the feature request or if we make changes to this behavior in the future.

Sign In to Reply