// Show/hide the modal form's background ///////////////////////////////////////////////////////////

var openForms = 0;

function _showModalBackground(formName, show)
{
  var elem = document.getElementById(formName + 'Background');
  
  if (elem)
  {
    elem.setAttribute('style', ('z-index: ' + (1000 + (2 * openForms))));
    
    elem.style.width = (($(window).width() + $(window).scrollLeft()) + 'px');
    elem.style.height = (($(window).height() + $(window).scrollTop()) + 'px');
    
    if (show)
    {
      document.body.style.overflow = 'hidden';
      elem.style.display = (((ieVersion() != 7) && (elem.nodeName != 'DIV')) ? 'table' : 'block');
    }
    else
    {
      elem.style.display = ((ieVersion() != 7) ? 'none' : '');
    }
  }
}

// Show/hide the modal form ////////////////////////////////////////////////////////////////////////

function _showModalForm(formName, formWidth, formHeight)
{
  _showModalBackground(formName, true);

  var elem = document.getElementById(formName);
  
  if (elem)
  {
    elem.setAttribute('style', ('z-index: ' + (1001 + (2 * openForms))));
    
    var content = getChildElementsByClassName(elem, 'modalContent')[0];

    if (content)
    {
      content.style.width = ((formWidth - 10) + 'px');
      content.style.height = ((formHeight - 45) + 'px');
    }
    
    elem.style.width = (formWidth + 'px');
    elem.style.height = (formHeight + 'px');

    elem.style.left = (((($(window).width() - formWidth) / 2) + $(window).scrollLeft()) + 'px');
    elem.style.top = (((($(window).height() - formHeight) / 2) + $(window).scrollTop()) + 'px');

    elem.style.display = (((ieVersion() != 7) && (elem.nodeName != 'DIV')) ? 'table' : 'block');

    openForms++;
  }
}

function hideModalForm(formName)
{
  _showModalBackground(formName, false);

  var elem = document.getElementById(formName);

  if (elem)
  {
    elem.style.display = ((ieVersion() != 7) ? 'none' : '');

    document.body.removeChild(elem.parentNode);

    openForms--;

    if (openForms == 0)
    {
      document.body.style.overflow = 'auto';
    }
  }
}

// Show a modal form with dynamic content //////////////////////////////////////////////////////////

function showModalForm(formName, width, height, subject, content, canClose)
{
  if ((canClose == null) || (canClose == undefined))
  {
    canClose = true;
  }
  
  var formHTML = '<div class="modalBackground" id="' + formName + 'Background"></div>' +
                 '<div class="modalForeground" id="' + formName + '">' +
                   '<div class="modalHeader">' +
                     subject;

  if (canClose)
  {
    formHTML += '<div class="close" onclick="hideModalForm(\'' + formName + '\');" title="Close this form"></div>';
  }

  formHTML +=      '</div>' +
                   '<div class="modalContent">' +
                     content +
                   '</div>' +
                 '</div>';
  
  newDiv = document.createElement('div');
  newDiv.innerHTML = formHTML;

  document.body.appendChild(newDiv);
  
  _showModalForm(formName, width, height);
}