FullScreen

juanmajr93 · February 24, 2017

How can I get a full screen of scene? I am using this function inside "create scene" method and It doesn't work:

engine.switchFullscreen(true)

davrous · February 24, 2017

Hello,

You can check my code on Sponza:

var renderingZone = document.getElementById("renderingZone");
var isFullScreen = false;

document.addEventListener("fullscreenchange", onFullScreenChange, false);
document.addEventListener("mozfullscreenchange", onFullScreenChange, false);
document.addEventListener("webkitfullscreenchange", onFullScreenChange, false);
document.addEventListener("msfullscreenchange", onFullScreenChange, false);

function onFullScreenChange() {
    if (document.fullscreen !== undefined) {
        isFullScreen = document.fullscreen;
    } else if (document.mozFullScreen !== undefined) {
        isFullScreen = document.mozFullScreen;
    } else if (document.webkitIsFullScreen !== undefined) {
        isFullScreen = document.webkitIsFullScreen;
    } else if (document.msIsFullScreen !== undefined) {
        isFullScreen = document.msIsFullScreen;
    }
}

switchFullscreen = function () {
    if (!isFullScreen) {
        BABYLON.Tools.RequestFullscreen(renderingZone);
    }
    else {
        BABYLON.Tools.ExitFullscreen();
    }
};

Please note you can't force a full screen by code. It must be user initiated (for security reasons). This means that the code that will switch the canvas to full screen must live behing an user's action such as clicking on a button.

David

juanmajr93 · February 24, 2017

Ok done!

Thierry Mil · July 26, 2017

Hello Babylonjs friends. Hello David.davrous.

I looked at this thread. I also want to put in 'fullscree'n my 3D scene.

Sadly, even if I tryed to code the same as David Sponza demo, (code it in this thread,),

when I click on my 'fu screen button', it says this in the javascript console :

==> La requête d’accès au plein écran a été refusée, car au moins l’un des éléments contenus dans le document n’est pas un iframe ou ne possède pas l’attribut « allowfullscreen ».

In English(via google translate) :

he full-screen access request was denied because at least one of the elements contained in the document is not an iframe or does not have the attribute "allowfullscreen".

I am 10% stuck with this problem. If someone has an idea, do not hesitate: do give it.

A] Here is the link :

http://free-visit.net/index.php/fr/23-modules-positions-50/building-entrance-webgl

B] Here is my code:

1) the html file:

#renderCanvas {
width: 100%;
height: 100%;
touch-action: none;
}
</style>
</head>
<body>
<canvas id="renderCanvas"></canvas>
<script >

2) the javascipt code to go fullscreen:

loader.onFinish = function() {
// --> Code pour gérer le fullscreen :
// New :
alert("25a) avant les declarations des differents 'fullscreenchange' ");
canvas.addEventListener("fullscreenchange", onFullScreenChange, false);
canvas.addEventListener("mozfullscreenchange", onFullScreenChange, false);
canvas.addEventListener("webkitfullscreenchange", onFullScreenChange, false);
canvas.addEventListener("msfullscreenchange", onFullScreenChange, false);
alert("25b) apres les declarations des differents 'fullscreenchange' ");

// --> Bouton pour mettre en full-screen :
btGoFullScreen = new bGUI.GUIPanel("btGoFullScreen", assets["icBtGoFullScreen"], null, gui);
btGoFullScreen.relativePosition(new BABYLON.Vector3(0.97, 0.96 , 0));
btGoFullScreen.setVisible(true);
btGoFullScreen.onClick = function() {
    alert("25a) Avant lancement goFullScreen() ");
    //engine.switchFullscreen(true);
    switchFullscreen();
    //goFullScreen();
    alert("25b) Apres lancement goFullScreen()");
}

};
// (fin)  loader.onFinish...

function onFullScreenChange() {
 alert("26a) Debut fonction onFullScreenChange()!");
    if (canvas.fullscreen !== undefined) {
         isFullScreen = canvas.fullscreen;
   } else if (canvas.mozFullScreen !== undefined) {
         isFullScreen = canvas.mozFullScreen;
   } else if (canvas.webkitIsFullScreen !== undefined) {
         isFullScreen     = canvas.webkitIsFullScreen;
   } else if (canvas.msIsFullScreen !== undefined) {
         isFullScreen = canvas.msIsFullScreen;
    }
 alert("26b) Fin fonction onFullScreenChange()!");

}

/* function qui lance l'EVT RequestFullScreen ou ExitFullScreen sur canvas !
*/
function switchFullscreen(){
    alert("switchFullscreen>>debut  ");
    if (!isFullScreen) {
        BABYLON.Tools.RequestFullscreen(canvas/*renderingZone*/);
    }
    else {
        BABYLON.Tools.ExitFullscreen();
    }
    alert("switchFullscreen>>fin  ");

};

Sign In

FullScreen

Recommended Posts

juanmajr93

engine.switchFullscreen(true)

Link to comment

Share on other sites

davrous

Link to comment

Share on other sites

juanmajr93

Link to comment

Share on other sites

Thierry Mil

Link to comment

Share on other sites

Join the conversation

Recently Browsing 0 members

Browse

Activity