Search code examples
javascripthtmlfullscreen

Full screen browsing with javascript using setInterval


I have a page with an iframe that should be updated every 5 minutes.

for this I used the following javascript code

var auto 
auto = self.setInterval(function(){refresh()}, 300000);
function refresh()
{
    var iframe = document.getElementById('report');
    iframe.src = iframe.src;

}

But now I want to ensure that I am always in full screen

I find in google the following code:

function full() {
                var
                      el = document.documentElement
                    , rfs =
                           el.requestFullScreen
                        || el.webkitRequestFullScreen
                        || el.mozRequestFullScreen
                ;
                rfs.call(el);
            };

it works fine if I call from a button

but does not work if I call the refresh function from:

    var auto
    auto = self.setInterval(function(){clicar()}, 300000);                                  
    function full() {
        var
              el = document.documentElement
            , rfs =
                   el.requestFullScreen
                || el.webkitRequestFullScreen
                || el.mozRequestFullScreen
        ;
        rfs.call(el);
    };  
    function clicar()
    {
        full();

        var iframe = document.getElementById('report');
        iframe.src = iframe.src;

    }

The browser returns no error just does not get full screen.

Any idea?


Solution

  • Switching to full screen is a potential security problem, and as such usually has to be tied to a user event (like clicking a button) to be actioned. In this case you wouldn't be able to switch to full screen from a setInterval event. There are other reasons why a switch to full screen might fail.

    Firefox specifically will log a message to the error console if the switch to full screen fails. Both Firefox and Chrome have opt-in switches that might allow this.

    From the MDN page on this:

    It's not guaranteed that you'll be able to switch into fullscreen mode. For example, <iframe> elements have the mozallowfullscreen attribute (webkitallowfullscreen, etc) in order to opt-in to allowing their content to be displayed in fullscreen mode.

    See the reference on MDN for more details