cha0s/humus-old
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: preserve ratio

Browse Source
This commit is contained in:
cha0s 2019-03-28 04:12:14 -05:00
parent 7a7bd84f4b
commit 9fc749fdad
2 changed files with 19 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
client/index.html
View File

@ -12,13 +12,16 @@
margin: 0;
overflow: hidden;
}
body {
.app {
align-items: center;
display: flex;
}
.app, canvas {
height: 100%;
line-height: 0;
width: 100%;
}
canvas {
margin: auto;
}
</style>
</head>
<body>

13
client/index.js
View File

@ -107,3 +107,16 @@ if (module.hot) {
renderer.destroy();
});
}
// Make sure dis boi always correct ratio and always maximally visible.
function onResize() {
const ratio = window.innerWidth / window.innerHeight;
const axe = ratio > (16 / 9) ? 'height' : 'width';
const nodes = window.document.querySelectorAll('.app canvas');
nodes.forEach((node) => {
for (const key of ['height', 'width']) {
node.style[key] = key === axe ? '100%' : 'auto';
}
});
}
window.addEventListener('resize', onResize);
onResize();