diff --git a/css/apple2.css b/css/apple2.css index 547a1a0..7dfeb20 100644 --- a/css/apple2.css +++ b/css/apple2.css @@ -81,6 +81,45 @@ label { border-radius: 10px; } +.zoomwindow { + width: 100vw; + height: 68.5714vw; /* 384px / 560px * 100% */ + max-height: 100vh; + max-width: 145.83vh; /* 560px / 384px * 100% */ + padding: 0; + border: 0; + position: fixed; + top:0; + bottom: 0; + left: 0; + right: 0; + justify-content: center; + align-items: center; + margin: auto !important; +} + +.maxhw { + width: 100%; + height: 100%; +} + +.flexbox-centering { + height: 100%; + display: flex; + justify-content: center; + align-items: center; + background: green; +} + +.hidden { + display: none !important; +} + +.fillparent { + width: 100%; + height: 100%; +} + #power { padding: 2px; border: 1px inset #888; diff --git a/js/main2e.js b/js/main2e.js index 814973e..5751315 100644 --- a/js/main2e.js +++ b/js/main2e.js @@ -793,7 +793,16 @@ function _keydown(evt) { cpu.reset(); } else if (evt.keyCode === 113) { // F2 - Full Screen var elem = document.getElementById('screen'); - if (document.webkitCancelFullScreen) { + if (evt.shiftKey) { // Full window, but not full screen + $('#display').toggleClass('zoomwindow'); + $('#display > div') + .toggleClass('overscan') + .toggleClass('flexbox-centering'); + $('#screen').toggleClass('maxhw'); + $('#header').toggleClass('hidden'); + $('.inset').toggleClass('hidden'); + $('#reset').toggleClass('hidden'); + } else if (document.webkitCancelFullScreen) { if (document.webkitIsFullScreen) { document.webkitCancelFullScreen(); } else {