Press ESC to exit full screen mode message

Question

I've implemented fullscreen mode on my desktop webapp and pressing ESC button will actually exit full screen mode and update layout of my app since it calls my function, however when you click on "Press ESC to exit full screen mode" it exits fullscreen mode but doesn't update my layout since there is happens direct call of browser's API. I'm trying to figure out how to make click on "Press ESC to exit full screen mode" to call my function instead of API of browser. Thanks.

Answer 1

I had the same problem, with this code I've solved

$(document).on("webkitfullscreenchange mozfullscreenchange fullscreenchange", function () {
    if (!(document.mozFullScreen || document.webkitIsFullScreen || document.fullscreenchange)) {
        exit_fullscreen();
    }
});

function exit_fullscreen() {
[...] //whatever you need to change in layout
    if (document.exitFullscreen) {
        document.exitFullscreen();
    } else if (document.webkitExitFullscreen) {
        document.webkitExitFullscreen();
    } else if (document.mozCancelFullScreen) {
        document.mozCancelFullScreen();
    } else if (document.msExitFullscreen) {
        document.msExitFullscreen();
    }
}