diff --git a/webssh/static/icons/arrows-fullscreen.svg b/webssh/static/icons/arrows-fullscreen.svg new file mode 100644 index 0000000..7633e3f --- /dev/null +++ b/webssh/static/icons/arrows-fullscreen.svg @@ -0,0 +1,3 @@ + \ No newline at end of file diff --git a/webssh/static/icons/fullscreen-exit.svg b/webssh/static/icons/fullscreen-exit.svg new file mode 100644 index 0000000..cfde3a3 --- /dev/null +++ b/webssh/static/icons/fullscreen-exit.svg @@ -0,0 +1,3 @@ + \ No newline at end of file diff --git a/webssh/static/js/main.js b/webssh/static/js/main.js index c2b49a0..c16f540 100644 --- a/webssh/static/js/main.js +++ b/webssh/static/js/main.js @@ -799,6 +799,31 @@ jQuery(function($){ connect(); }); + $('#btn-fullscreen').click(fullscreen_handler); + window.document.addEventListener('fullscreenchange', fullscreen_handler, false); + window.document.addEventListener('mozfullscreenchange', fullscreen_handler, false); + window.document.addEventListener('webkitfullscreenchange', fullscreen_handler, false); + window.document.addEventListener('msfullscreenChange', fullscreen_handler, false); + function fullscreen_handler(event) { + var doc = window.document; + var docEl = doc.documentElement; + var requestFullScreen = docEl.requestFullscreen || docEl.mozRequestFullScreen || docEl.webkitRequestFullScreen || docEl.msRequestFullscreen; + var cancelFullScreen = doc.exitFullscreen || doc.mozCancelFullScreen || doc.webkitExitFullscreen || doc.msExitFullscreen; + if (!doc.fullscreenElement && !doc.mozFullScreenElement && !doc.webkitFullscreenElement && !doc.msFullscreenElement) { + if (event.currentTarget.id === 'btn-fullscreen') { + requestFullScreen.call(docEl); + } + $('#fullscreen-enter').show(); + $('#fullscreen-exit').hide(); + } else { + if (event.currentTarget.id === 'btn-fullscreen') { + cancelFullScreen.call(doc); + } + $('#fullscreen-enter').hide(); + $('#fullscreen-exit').show(); + } + event.preventDefault(); + } function cross_origin_connect(event) { diff --git a/webssh/templates/index.html b/webssh/templates/index.html index f727ef1..e05c0ba 100644 --- a/webssh/templates/index.html +++ b/webssh/templates/index.html @@ -24,6 +24,18 @@ .btn-danger { margin-left: 5px; } + + #btn-fullscreen { + bottom: 32px; + font-size: 0; + margin: 0; + opacity: 0.5; + padding: 6px; + position: fixed; + right: 8px; + z-index: 256; + } + {% if font.family %} @font-face { font-family: '{{ font.family }}'; @@ -91,6 +103,11 @@
+ +