Apple-2-Tools/apple2js
1
0
Fork 0
mirror of https://github.com/whscullin/apple2js.git synced 2024-01-12 14:14:38 +00:00
Code Issues Projects Releases Wiki Activity

Rework full page mode.

Browse Source
This commit is contained in:
Will Scullin 2019-12-30 11:40:28 -08:00
parent d15979d67e
commit eaef394eb1
No known key found for this signature in database
GPG Key ID: 9092A5C0A673416B
2 changed files with 18 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
css/apple2.css
View File

@ -77,7 +77,11 @@ body {
border-radius: 10px; border-radius: 10px;
} }
.zoomwindow { .full-page {
background: black;
}
.full-page #display {
width: 100vw; width: 100vw;
height: 68.5714vw; /* 384px / 560px * 100% */ height: 68.5714vw; /* 384px / 560px * 100% */
max-height: 100vh; max-height: 100vh;
@ -94,28 +98,28 @@ body {
margin: auto !important; margin: auto !important;
} }
.maxhw { .full-page .overscan {
width: 100%; margin: initial;
height: 100%; padding: 0;
} width: initial;
height: 384px;
.flexbox-centering { border: 0;
border-radius: 0;
height: 100%; height: 100%;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
background: green;
} }
.hidden { .full-page #screen {
display: none !important;
}
.fillparent {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
.full-page #header, .full-page .inset, .full-page #reset {
display: none;
}
#power { #power {
padding: 2px; padding: 2px;
border: 1px inset #888; border: 1px inset #888;

8
js/ui/apple2.js
View File

@ -531,13 +531,7 @@ function _keydown(evt) {
} else if (evt.keyCode === 113) { // F2 - Full Screen } else if (evt.keyCode === 113) { // F2 - Full Screen
var elem = document.getElementById('screen'); var elem = document.getElementById('screen');
if (evt.shiftKey) { // Full window, but not full screen if (evt.shiftKey) { // Full window, but not full screen
document.querySelector('#display').classList.toggle('zoomwindow'); document.body.classList.toggle('full-page');
document.querySelector('#display > div').classList.toggle('overscan');
document.querySelector('#display > div').classList.toggle('flexbox-centering');
document.querySelector('#screen').classList.toggle('maxhw');
document.querySelector('#header').classList.toggle('hidden');
document.querySelectorAll('.inset').forEach(function(el) { el.classList.toggle('hidden'); });
document.querySelector('#reset').classList.toggle('hidden');
} else if (document.webkitCancelFullScreen) { } else if (document.webkitCancelFullScreen) {
if (document.webkitIsFullScreen) { if (document.webkitIsFullScreen) {
document.webkitCancelFullScreen(); document.webkitCancelFullScreen();