Videogular - toggleFullscreen()

Question

I try to toggle to Fullscreen with the videogular API and I don't get it.

The strange thing is, that.API.play() works well, but that.API.toggleFullscreen() not. I check out the vg-controls plugin-fullscreen-button and there is another method called onClickFullscreen() but in my case that won't work too.

Has somebody an idea how I can fix it? I use it with an Ionic-App, so maybe it is a bit more complicated but here some code from the controller:

    var that = this;
    that.onPlayerReady = function(API) {
        that.API = API;
    };

            if (window.matchMedia("(orientation: landscape)").matches) {
            // you're in LANDSCAPE mode
            console.log("Landscape") //works fine
            that.API.play(); //works also very fine
            that.API.toggleFullScreen(); //no chance....
        }

I also have no errors in the console. So it looks like the function get called, but nothing happens. When I write that.onClickFullScreen() in the console the error "no function available for that object" comes up.

Answer 1

Videogular fullscreen is only for HTML5 fullscreen API, you need to use the native fullscreen API. For such thing I recommend you to use a Cordova plugin.

There are several options, this could be one: https://github.com/mesmotronic/cordova-plugin-fullscreen

Another option could be to disable HTML5 fullscreen in Videogular. If you disable it, Videogular will try to occupy the whole HTML document and it could be a good solution for you too.

<videogular vg-native-fullscreen="false">
    <!-- more stuff here -->
</videogular>