conference-site/content/js/onload.js

var globalResizerTimer = null;
var sedicinoni = 1.777784514;

function resizeLive() {
  // Let's calculate the right needed height for the video based on the
  // browser settings.
  var livewidth = $(window).innerWidth() - 20;
  var liveheight = $(window).innerHeight() - 136 - 25;

  // Calculate the videowidth based on proportions
  var videowidth = Math.ceil(livewidth * 0.70);
  var videoheight = Math.ceil(videowidth / sedicinoni);
  var chatwidth = livewidth - videowidth;
  
  // Case 1: the height calculated with the aspect ratio is bigger than the
  // available space. Let's reverse the calculation and understand which video
  // size we need
  if (videoheight > liveheight) {
    var videowidth = Math.round(liveheight * sedicinoni);
    var chatwidth = livewidth - videowidth;
    $("#live").height(liveheight);
    $("#embedded-video").width(videowidth).height(liveheight);
    $("#embedded-chat").width(chatwidth);
  } else {
    // In any other case, I will apply all the dimensions
    $("#live").height(liveheight);
    $("#embedded-video").width(videowidth);
    $("#embedded-video iframe").attr("width", videowidth).attr("height", liveheight);
    $("#embedded-chat").width(chatwidth);
  }
}

$(document).ready(resizeLive());
$(window).resize(function(){
  if (globalResizerTimer != null)
    window.clearTimeout(globalResizeTimer);
  globalResizeTimer = window.setTimeout(function(){
    resizeLive();
  }, 200);
});