/* 

=====ILQ Popover=====
Required: leadgeneration.css

functions to care about:
  showPopover(content, url) - content is HTML to be rendered, url is the url to be rendered in the iFrame.
  setWidthsNHeights()       - resizes the popover to the size of the constants which are initialized globally.
  closePopover()            - removes the popover from the browser window.

*/

var horizontal1s = Array();
var horizontal2s = Array();
var horizontal3s = Array();
var verticals   = Array();
var popover;
var form;

var WIDTH1  = 850;
var WIDTH2  = WIDTH1 + 8;
var WIDTH3  = WIDTH1 + 38;

var HEIGHT = 450;
var HEIGHT_AC = 450;
var HEIGHT_RE = 660;
var TOPMARGIN = 100;

function setWidth(num) {
    WIDTH1  = num;
    WIDTH2  = WIDTH1 + 8;
    WIDTH3  = WIDTH1 + 38;
}

function showPopover(content, url) {
    document.body.style.overflow = "hidden";

    var popBG = document.createElement('div');
    popBG.id = "popBG";

    popover = document.createElement('div');
    popover.setAttribute("class", "popover");

    var poptop = document.createElement('div');
    poptop.setAttribute("class", "poptopBar");
    horizontal3s.push(poptop);

    var poptop_left = document.createElement('div');
    poptop_left.setAttribute("class", "left");

    var ot1 = document.createElement('div');
    ot1.setAttribute("class", "overlay");
    poptop_left.appendChild(ot1);

    var poptop_middle = document.createElement('div');
    poptop_middle.setAttribute("class", "middle");
    horizontal1s.push(poptop_middle);

    var ot2 = document.createElement('div');
    ot2.setAttribute("class", "overlay");
    poptop_middle.appendChild(ot2);
    horizontal1s.push(ot2);

    var poptop_right = document.createElement('div');
    poptop_right.setAttribute("class", "right");

    var ot3 = document.createElement('div');
    ot3.setAttribute("class", "overlay");
    poptop_right.appendChild(ot3);

    poptop.appendChild(poptop_left);
    poptop.appendChild(poptop_middle);
    poptop.appendChild(poptop_right);

    var popmid = document.createElement('div');
    popmid.setAttribute("class", "popmiddle");
    horizontal3s.push(popmid);

    var popmid_left = document.createElement('div');
    popmid_left.setAttribute("class", "left");
    verticals.push(popmid_left);

    var om1 = document.createElement('div');
    om1.setAttribute("class", "overlay");
    popmid_left.appendChild(om1);
    verticals.push(om1);

    popmid_middle = document.createElement('div');
    popmid_middle.setAttribute("class", "middle");
    verticals.push(popmid_middle);
    horizontal2s.push(popmid_middle);

    var om2 = document.createElement('div');
    om2.setAttribute("class", "overlay");
    popmid_middle.appendChild(om2);
    horizontal2s.push(om2);
    verticals.push(om2);

    var popmid_right = document.createElement('div');
    popmid_right.setAttribute("class", "right");
    verticals.push(popmid_right);

    var om3 = document.createElement('div');
    om3.setAttribute("class", "overlay");
    popmid_right.appendChild(om3);
    verticals.push(om3);

    popmid.appendChild(popmid_left);
    popmid.appendChild(popmid_middle);
    popmid.appendChild(popmid_right);
    
    var popbot = document.createElement('div');
    popbot.setAttribute("class", "popbotBar");
    horizontal3s.push(popbot);

    var popbot_left = document.createElement('div');
    popbot_left.setAttribute("class", "left");

    var ob1 = document.createElement('div');
    ob1.setAttribute("class", "overlay");
    popbot_left.appendChild(ob1);

    var popbot_middle = document.createElement('div');
    popbot_middle.setAttribute("class", "middle");
    horizontal1s.push(popbot_middle);

    var ob2 = document.createElement('div');
    ob2.setAttribute("class", "overlay");
    popbot_middle.appendChild(ob2);
    horizontal1s.push(ob2);

    var popbot_right = document.createElement('div');
    popbot_right.setAttribute("class", "right");

    var ob3 = document.createElement('div');
    ob3.setAttribute("class", "overlay");
    popbot_right.appendChild(ob3);
    
    popbot.appendChild(popbot_left);
    popbot.appendChild(popbot_middle);
    popbot.appendChild(popbot_right);

    popover.appendChild(poptop);
    popover.appendChild(popmid);
    popover.appendChild(popbot);

    popBG.appendChild(popover);

    setWidthsNHeights();

    
    if(content != null) {
        om2.innerHTML = content;
    } else {
        if(navigator.appName == "Microsoft Internet Explorer") {
            form = document.createElement('iframe');
            form.setAttribute('frameborder', "0");
            form.setAttribute('src', url);
            form.setAttribute('height', HEIGHT);
            form.setAttribute('width', WIDTH1);
        } else {
            form = document.createElement('object');
            form.setAttribute('data', url);
            form.setAttribute('style', 'height:' + HEIGHT + '; width:' + WIDTH1 + '; border-style:none;');
            form.setAttribute('width', WIDTH1 + 'px');
            form.setAttribute('height', HEIGHT + 'px');
            form.setAttribute('type', 'text/html');
            console.log(form);
        } 
        om2.appendChild(form);
    }
    popover.appendChild(popbot);

    popBG.appendChild(popover);
    document.body.appendChild(popBG);
}

function setWidthsNHeights() {
  for(i in horizontal1s) {
    horizontal1s[i].style.width = WIDTH1 + "px";
  }
  for(i in horizontal2s) {
    horizontal2s[i].style.width = WIDTH2 + "px";    
  }
  for(i in horizontal3s) {
    horizontal3s[i].style.width = WIDTH3 + "px";
  }
  for(i in verticals) {
    verticals[i].style.height = HEIGHT + "px";
  }
  popover.style.width = WIDTH1 + "px";
  popover.style.margin = TOPMARGIN + "px auto";
  
  if(form != null) {
    form.setAttribute("height", HEIGHT);
    form.setAttribute("width", WIDTH1);
    form.style.height = HEIGHT;
    form.style.width = WIDTH1;
  }
}

function closePopover() {
    document.body.style.overflow = "auto";
    document.body.removeChild(document.getElementById("popBG"));
}