ATD
/
jitsi-stream-client
1
0
Fork 0
Code Issues 2 Pull Requests Releases Wiki Activity

fix: size calculation

This commit is contained in:
henne 2020-12-26 22:22:43 +01:00
parent f7211ebe3b
commit 7815d08216
2 changed files with 9 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
index.html
View File

@ -11,7 +11,7 @@
<script src="script.js" ></script>
<style type="text/css">
body {
padding: 6px;
padding: 0;
background-color: black;
color: #eeeeee;
}
@ -44,6 +44,7 @@
}
.video {
text-align: center;
overflow: hidden;
}
.volume {
display: inline-block;

14
script.js
View File

@ -35,15 +35,15 @@ let isJoined = false;
*/
function initHtml(rows, cols) {
// calculate video element sizes
let windowHeight = document.body.clientHeight;
let windowWidth = document.body.clientWidth;
let windowHeight = window.innerHeight;
let windowWidth = window.innerWidth;
console.log(windowHeight);
let margin = 8; // 3px margin on each side, 1px border on each side
let margin = 6; // 3px margin on each side
let maxWidth = windowWidth / cols - margin
let maxHeight = windowHeight / rows - margin - 0 - 28; // 32 -> size added for nametag; 28px per row for control elements
let maxHeight = windowHeight / rows - margin - 24 - 28 - 6; // 24 -> size added for nametag; 28px per row for control elements; idontknow where the 6px appear xD
if(maxWidth/16*9 < maxHeight) {
if(maxWidth/16*9 <= maxHeight) {
videoSize.width = maxWidth;
videoSize.height = maxWidth/16*9;
} else {
@ -63,8 +63,8 @@ function initHtml(rows, cols) {
for(let j = 0; j < cols; j++) {
let colElem = $(document.createElement("div"));
colElem.addClass(`video video-${elemCounter++}`);
colElem.width(videoSize.width + 2*margin);
colElem.height(videoSize.height + 2*margin + 24);
colElem.width(videoSize.width + margin);
colElem.height(videoSize.height + margin + 24);
colElem.css("display", "inline-block");
colElem.append(`
<video autoplay='autoplay' width="${videoSize.width}" height="${videoSize.height}"></video>