Fullscreen or not fullscreen (html5)

Armory Engine General
1

I’m not good at programming.
Please help create a switch button from the full screen and back to xml5.
The principle of action by analogy with sketches.

What would be on the site to place a preview in a small window. Clicking the button opens the full screen. In the full screen, they are deactivated again via the button.

2

It looks like a solution:

    <head>
     ......
<style>
#knop{position: absolute;top: 1em;right: 1em;}
:-moz-full-screen #knop {position: fixed;top: 2em;right: 2em;width: 300px;height: 100px;}
#full {width: 100%; height: 100%}
#contf {width: 100%;height: 500px;    position: relative;}
#contf:-webkit-full-screen {width: 100vw;height: 100vh}
#contf:-moz-full-screen {width: 100vw;height: 100vh}
#contf:-ms-full-screen {width: 100vw;height: 100vh}
#contf:full-screen {width: 100vw;height: 100vh}
#toggle_fullscreen{border: none;color: #000;}
</style>
......
    </head>
<body>
......
<div id="contf">
<iframe id="full" width="100%" height="100vh" src="**path your armory3d page**" frameborder="0"></iframe>
<button id="knop" onclick="toggleFullScreen()"><i class="fa fa-arrows-alt fa-2x"></i></button>
</div>
......
<script>
  var videoElement = document.getElementById("contf");
  function toggleFullScreen() {
    // ## The below if statement seems to work better ## if ((document.fullScreenElement && document.fullScreenElement !== null) || (document.msfullscreenElement && document.msfullscreenElement !== null) || (!document.mozFullScreen && !document.webkitIsFullScreen)) {
    if ((document.fullScreenElement !== undefined && document.fullScreenElement === null) || (document.msFullscreenElement !== undefined && document.msFullscreenElement === null) || (document.mozFullScreen !== undefined && !document.mozFullScreen) || (document.webkitIsFullScreen !== undefined && !document.webkitIsFullScreen)) {
        if (videoElement.requestFullScreen) {
            videoElement.requestFullScreen();
        } else if (videoElement.mozRequestFullScreen) {
            videoElement.mozRequestFullScreen();
        } else if (videoElement.webkitRequestFullScreen) {
            videoElement.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);
        } else if (videoElement.msRequestFullscreen) {
            videoElement.msRequestFullscreen();
        }
    } else {
        if (document.cancelFullScreen) {
            document.cancelFullScreen();
        } else if (document.mozCancelFullScreen) {
            document.mozCancelFullScreen();
        } else if (document.webkitCancelFullScreen) {
            document.webkitCancelFullScreen();
        } else if (document.msExitFullscreen) {
            document.msExitFullscreen();
        }
    }
}
</script>
</body>

An example of work can be found here.

3

Lack of generation of previews in Armory:smiley: