Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[bug] Fullscreen blocks content if height is greater than screen height #92

Open
KristinAoki opened this issue Nov 25, 2024 · 1 comment · May be fixed by #93
Open

[bug] Fullscreen blocks content if height is greater than screen height #92

KristinAoki opened this issue Nov 25, 2024 · 1 comment · May be fixed by #93

Comments

@KristinAoki
Copy link

Full screen navigation is very hard to navigate and makes it impossible for users to scroll down completely and access the content. It completely hides the buttons making it impossible to move forward. They have to exit full screen to continue to navigate.

Happens only on certain devices (like a laptop), does not happen as often at higher resolutions.

The solution would be to have the height of <div class="scorm-pane " /> updated to the screen height if it is less than the saved height. The following changes will need to be made:

  1. function onFullscreenChange(e) {
    if (isFullscreen()) {
    $(e.target).addClass("fullscreen-enabled");
    } else {
    $(e.target).removeClass("fullscreen-enabled");
    }
    // This is required to trigger the actual content resize in some packages
    window.dispatchEvent(new Event('resize'));
    }

    Update the function to include height changes
function onFullscreenChange(e) {
        if (isFullscreen()) {
            $(e.target).addClass("fullscreen-enabled");
            // NEW LINE
            if (settings.block_height > screen.height) {
                $(e.target).css("height", screen.height);
            }
        } else {
            $(e.target).removeClass("fullscreen-enabled");
            // NEW LINE
            $(e.target).css("height", settings.block_height);
        }
        // This is required to trigger the actual content resize in some packages
        window.dispatchEvent(new Event('resize'));
}
  1. frag.initialize_js(
    "ScormXBlock",
    json_args={
    "scorm_version": self.scorm_version,
    "popup_on_launch": self.popup_on_launch,
    "popup_width": self.width or 800,
    "popup_height": self.height or 800,
    "scorm_data": self.scorm_data,
    },
    )

    Add block_height to json_args
"block_height": self.height or 450,
@DawoudSheraz
Copy link

@Danyal-Faheem FYI

@KristinAoki KristinAoki linked a pull request Dec 2, 2024 that will close this issue
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
Development

Successfully merging a pull request may close this issue.

2 participants