var PagePopup=
{
  Holder  :null,
  Back  :null,
  Front :null,
  Frame :null,
  Close :null,
  Scroll  :{X:0,Y:0},
  Timer :null,
  Width :0,
  Height  :0,
  CurTime :0,
  TimeFade:0,
  TimeSize:0,
  Opacity :0,
  NoClose :false,
  OnBeforeClose: null,
  OnAfterClose:  null,
  
  Open:function(Url,Width,Height,Background,Opacity,TimeFade,TimeSize,NoClose)
  {
    PagePopup.NoClose =NoClose;

    PagePopup.CreateElements();
  
    PagePopup.Scroll.X=(document.body.parentNode.scrollLeft ?document.body.parentNode.scrollLeft:document.body.scrollLeft);
    PagePopup.Scroll.Y=(document.body.parentNode.scrollTop  ?document.body.parentNode.scrollTop :document.body.scrollTop);

    document.body.parentNode.style.overflow =document.body.style.overflow ='hidden';
    document.body.parentNode.scrollLeft   =document.body.scrollLeft   ='0';
    document.body.parentNode.scrollTop    =document.body.scrollTop    ='0';

    PagePopup.Url   =Url;
    PagePopup.Width   =Width;
    PagePopup.Height    =Height;
    PagePopup.Opacity =Opacity;
    PagePopup.TimeFade  =TimeFade;
    PagePopup.TimeSize  =TimeSize;
    PagePopup.CurTime =0;

    PagePopup.Frame.src='about:blank';
    PagePopup.Close.style.display='none';

    PagePopup.Update();
    
    PagePopup.Holder.style.width    =PagePopup.Back.style.width =((document.body.parentNode.clientWidth?document.body.parentNode.clientWidth:document.body.clientWidth)-20)+'px';
    PagePopup.Holder.style.height =PagePopup.Back.style.height  =(document.body.parentNode.clientHeight?document.body.parentNode.clientHeight:document.body.clientHeight)+'px';
    PagePopup.Holder.style.display  ='block';
    PagePopup.Front.style.display ='block';
    PagePopup.Back.style.background =Background;

    PagePopup.Wrapper.style.width =Math.round(PagePopup.Width)+'px';
    PagePopup.Wrapper.style.left    =-Math.round(PagePopup.Width/2)+'px';
    PagePopup.Title.style.width   =Math.round(PagePopup.Width)+'px';
    PagePopup.Frame.style.width   =Math.round(PagePopup.Width)+'px';
    
    return this;
  },
  
  CloseWindow:function()
  {
    PagePopup.CurTime=0;
    PagePopup.Front.style.display='none';
    PagePopup.ClosePage();
  },
  
  ClosePage:function()
  {
    if (!PagePopup.CurTime && PagePopup.OnBeforeClose) PagePopup.OnBeforeClose(); 

    var Ratio =1-((PagePopup.CurTime/PagePopup.TimeFade)>1?1:((PagePopup.CurTime/PagePopup.TimeFade)<0?0:(PagePopup.CurTime/PagePopup.TimeFade)));
    var Opacity =Math.round(Ratio*PagePopup.Opacity);

    PagePopup.Back.style.opacity    =(Opacity/100);
    PagePopup.Back.style.mozOpacity =(Opacity/100);
    PagePopup.Back.style.KhtmlOpacity=(Opacity/100);
    PagePopup.Back.style.filter   ='alpha(opacity='+Opacity+')';

    PagePopup.CurTime+=50;

    if(PagePopup.CurTime<=PagePopup.TimeFade)
    {
      clearTimeout(PagePopup.Timer);
      setTimeout(function(){ PagePopup.ClosePage(); },50);
    }
    else
    {
      PagePopup.Holder.style.display        ='none';
      PagePopup.Front.style.display       ='none';
      document.body.parentNode.style.overflow =document.body.style.overflow ='auto';
      document.body.parentNode.scrollLeft   =document.body.scrollLeft   =PagePopup.Scroll.X;
      document.body.parentNode.scrollTop    =document.body.scrollTop    =PagePopup.Scroll.Y;

      if (PagePopup.OnAfterClose) PagePopup.OnAfterClose(); 
    }
  },
  
  Resize:function()
  {
    PagePopup.Holder.style.width    =PagePopup.Back.style.width =((document.body.parentNode.clientWidth?document.body.parentNode.clientWidth:document.body.clientWidth)-20)+'px';
    PagePopup.Holder.style.height =PagePopup.Back.style.height  =(document.body.parentNode.clientHeight?document.body.parentNode.clientHeight:document.body.clientHeight)+'px';

    PagePopup.Wrapper.style.width =Math.round(PagePopup.Width)+'px';
    PagePopup.Wrapper.style.left    =-Math.round(PagePopup.Width/2)+'px';
    PagePopup.Title.style.width   =Math.round(PagePopup.Width)+'px';
    PagePopup.Frame.style.width   =Math.round(PagePopup.Width)+'px';
  },
  
  Update:function()
  {
    var Width =0;
    var Height  =0;

    if(PagePopup.CurTime<=PagePopup.TimeFade)
    {
      var Ratio =(PagePopup.CurTime/PagePopup.TimeFade)>1?1:((PagePopup.CurTime/PagePopup.TimeFade)<0?0:(PagePopup.CurTime/PagePopup.TimeFade));
      var Opacity =Math.round(Ratio*PagePopup.Opacity);

      PagePopup.Back.style.opacity    =(Opacity/100);
      PagePopup.Back.style.mozOpacity =(Opacity/100);
      PagePopup.Back.style.KhtmlOpacity=(Opacity/100);
      PagePopup.Back.style.filter   ='alpha(opacity='+Opacity+')';
    }
    else
    {
      Width =((PagePopup.CurTime-PagePopup.TimeFade)/PagePopup.TimeSize)*PagePopup.Width;
      Width =Width<2?2:(Width>PagePopup.Width?PagePopup.Width:Width);
      Height  =((PagePopup.CurTime-PagePopup.TimeFade)/PagePopup.TimeSize)*PagePopup.Height;
      Height  =Height<2?2:(Height>PagePopup.Height?PagePopup.Height:Height);
    }

    if(PagePopup.CurTime>=PagePopup.TimeFade+PagePopup.TimeSize)
    {
      PagePopup.Close.style.display='block';
      PagePopup.Close.style.top =-Math.round(PagePopup.Height/2-2)+'px';
      PagePopup.Close.style.left  =Math.round(PagePopup.Width/2-22)+'px';
      setTimeout(function(){ PagePopup.Frame.src=PagePopup.Url; },50);
    }

    PagePopup.Wrapper.style.height  =Math.round(Height)+'px';
    PagePopup.Wrapper.style.top =-Math.round(Height/2)+'px';

    PagePopup.Title.style.height  =Math.round(Height)+'px';
    PagePopup.Frame.style.height  =Math.round(Height)+'px';
    PagePopup.StretchBackgroundImage.style.height='20px';
    PagePopup.SduLogo.style.height  ='20px';
  
    PagePopup.CurTime+=50;

    if(PagePopup.CurTime<=PagePopup.TimeFade+PagePopup.TimeSize)
    {
      clearTimeout(PagePopup.Timer);
      setTimeout(function(){ PagePopup.Update(); },50);
    }
  },

  CreateElements:function()
  {
    if(!PagePopup.Holder && !PagePopup.Back && !PagePopup.Front && !PagePopup.Frame)
    {
      PagePopup.Holder=document.createElement('div');
      PagePopup.Holder.style.display  ='none';
      PagePopup.Holder.style.position ='absolute';
      PagePopup.Holder.style.top    =PagePopup.Holder.style.left    ='0px';
      PagePopup.Holder.style.width    =PagePopup.Holder.style.height  ='100%';
      PagePopup.Holder.style.float    ='none';
      PagePopup.Holder.style.padding  =PagePopup.Holder.style.margin=PagePopup.Holder.style.border='0px';
      PagePopup.Holder.style.zIndex ='1000';

      PagePopup.Back=document.createElement('div');
      PagePopup.Back.style.position ='absolute';
      PagePopup.Back.style.top      =PagePopup.Back.style.left  ='0px';
      PagePopup.Back.style.width    =PagePopup.Back.style.height  ='100%';
      PagePopup.Back.style.float    ='none';
      PagePopup.Back.style.padding    =PagePopup.Back.style.margin=PagePopup.Back.style.border='0px';
      PagePopup.Back.style.zIndex   ='1';

      PagePopup.Front=document.createElement('div');
      PagePopup.Front.style.position  ='absolute';
      PagePopup.Front.style.top   =PagePopup.Front.style.left ='50%';
      PagePopup.Front.style.width   =PagePopup.Front.style.height='1px';
      PagePopup.Front.style.float   ='none';
      PagePopup.Front.style.padding =PagePopup.Front.style.margin=PagePopup.Front.style.border='0px';
      PagePopup.Front.style.zIndex    ='2';

      PagePopup.Wrapper=document.createElement('div');
      PagePopup.Wrapper.style.position  ='absolute';
      PagePopup.Wrapper.style.top   =PagePopup.Wrapper.style.left ='0px';
      PagePopup.Wrapper.style.width   =PagePopup.Wrapper.style.height='1px';
      PagePopup.Wrapper.style.float   ='none';
      PagePopup.Wrapper.style.padding =PagePopup.Wrapper.style.margin='0px';
      PagePopup.Wrapper.style.background  ='#FFFFFF';
      //PagePopup.Wrapper.style.border    ='1px solid red';
      
      PagePopup.Title=document.createElement('div');
      PagePopup.Title.style.position  ='absolute';
      PagePopup.Title.style.top   = '0px';
      PagePopup.Title.style.left    ='0px';
      PagePopup.Title.style.padding =PagePopup.Title.style.margin='0px';
      PagePopup.Title.style.width = '0px';
      PagePopup.Title.style.height = '0px';

      PagePopup.TitleLink=document.createElement('a');
      PagePopup.TitleLink.style.position  = 'absolute';
      PagePopup.TitleLink.style.display = 'none';
      PagePopup.TitleLink.style.float   = 'right';
      PagePopup.TitleLink.style.marginRight= '32px';
      PagePopup.TitleLink.style.zIndex    = '33';
      PagePopup.TitleLink.style.right   = '0px';
      PagePopup.TitleLink.style.top   = '4px';
      PagePopup.TitleLink.href        = '#';
      PagePopup.TitleLink.innerHTML   = 'Sluit Venster';
      PagePopup.TitleLink.onclick     =function()
      {
        PagePopup.CloseWindow();
      };
      
      PagePopup.Title.appendChild(PagePopup.TitleLink);

      /*
      PagePopup.StretchBackgroundImage=document.createElement('img');
      PagePopup.StretchBackgroundImage.style.position ='absolute';
      PagePopup.StretchBackgroundImage.style.top    = '0px';
      PagePopup.StretchBackgroundImage.style.left   ='0px';
      PagePopup.StretchBackgroundImage.style.padding  =PagePopup.StretchBackgroundImage.style.margin='0px';
      PagePopup.StretchBackgroundImage.style.width = '100%';
      PagePopup.StretchBackgroundImage.style.height = '0px';
      PagePopup.StretchBackgroundImage.src = 'images/header_title_bar.png';
      PagePopup.StretchBackgroundImage.style.zIndex = '30';
      */
      
      PagePopup.StretchBackgroundImage=document.createElement('div');
      PagePopup.StretchBackgroundImage.style.position ='absolute';
      PagePopup.StretchBackgroundImage.style.top    = '0px';
      PagePopup.StretchBackgroundImage.style.left   ='0px';
      PagePopup.StretchBackgroundImage.style.padding  =PagePopup.StretchBackgroundImage.style.margin='0px';
      PagePopup.StretchBackgroundImage.style.width = '100%';
      PagePopup.StretchBackgroundImage.style.height = '0px';
      PagePopup.StretchBackgroundImage.style.zIndex = '30';
      
      var classAttr1 = document.createAttribute('class');
      classAttr1.nodeValue = 'popup_header';
      PagePopup.StretchBackgroundImage.setAttributeNode(classAttr1);
      
      
      PagePopup.SduLogo=document.createElement('img');
      PagePopup.SduLogo.style.position  ='absolute';
      PagePopup.SduLogo.style.display  ='none';
      PagePopup.SduLogo.style.top   = '0px';
      PagePopup.SduLogo.style.left    ='0px';
      PagePopup.SduLogo.style.padding =PagePopup.SduLogo.style.margin='0px';
      PagePopup.SduLogo.style.width = '100px';
      PagePopup.SduLogo.style.height = '0px';
      PagePopup.SduLogo.style.zIndex = '31';
      PagePopup.SduLogo.src = '../img/header_title_logo.gif';
      
      PagePopup.Frame=document.createElement('iframe');
      PagePopup.Frame.style.position  ='relative';
      PagePopup.Frame.style.top   = '20px';
      PagePopup.Frame.style.left    = '0px';
      PagePopup.Frame.style.width   =PagePopup.Frame.style.height='0px';
      PagePopup.Frame.frameBorder   ='0';
      PagePopup.Frame.style.float   ='none';
      PagePopup.Frame.style.padding =PagePopup.Frame.style.margin='0px';
      PagePopup.Frame.style.background  ='#FFFFFF';
      

      var TextHolder=document.createElement('div');
        TextHolder.style.position ='absolute';
        TextHolder.style.left   =TextHolder.style.bottom='0px';
        TextHolder.style.width    ='20px';
        TextHolder.style.height   ='20px';
        TextHolder.style.overflow ='hidden';
        //TextHolder.style.border   ='1px solid #555555';
        TextHolder.style.margin   ='0px';
        TextHolder.style.padding  ='0px 0px 0px 2px';
        TextHolder.style.background ='transparent';
        
      var Text=document.createElement('span');
        Text.style.position   ='absolute';
        Text.style.left     =Text.style.bottom='2px';
        Text.style.color    ='#555555';
        Text.style.fontFamily ='arial';
        Text.style.fontWeight ='800';
        Text.style.fontSize   ='22px';
        Text.style.lineHeight ='22px';
        Text.style.top      ='0px';
        Text.style.background ='transparent';
        Text.style.display ='none';
        Text.innerHTML      ='x';

      PagePopup.Close=document.createElement('div');
      PagePopup.Close.style.position  ='absolute';
      PagePopup.Close.style.width   ='20px';
      PagePopup.Close.style.height    ='20px';
      PagePopup.Close.style.overflow  ='hidden';
      PagePopup.Close.style.float   ='right';
      PagePopup.Close.style.margin    ='0px';
      PagePopup.Close.style.padding ='0px';
      PagePopup.Close.style.background  ='#FFFFFF';
      PagePopup.Close.style.border    ='0px';
      PagePopup.Close.style.cursor    ='pointer';
      PagePopup.Close.style.zIndex    ='33';
      //PagePopup.Close.onmouseover   =function(){ TextHolder.style.background='#CCCCCC'; };
      //PagePopup.Close.onmouseout    =function(){ TextHolder.style.background='#FFFFFF'; };
      PagePopup.Close.onclick     =function()
      { 
        PagePopup.CloseWindow();
      };
      
      classAttr = document.createAttribute('class');
      classAttr.nodeValue = 'popup_close';
      PagePopup.Close.setAttributeNode(classAttr);

      TextHolder.appendChild(Text);
      
      PagePopup.Close.appendChild(TextHolder);
      
      PagePopup.Front.appendChild(PagePopup.Wrapper);
      if (!PagePopup.NoClose)
      {
        PagePopup.Wrapper.appendChild(PagePopup.Title);
      }
      PagePopup.Title.appendChild(PagePopup.StretchBackgroundImage);

      PagePopup.Wrapper.appendChild(PagePopup.Frame);
      if (!PagePopup.NoClose)
      {
        PagePopup.Front.appendChild(PagePopup.Close);
      }
      PagePopup.Holder.appendChild(PagePopup.Back);
      PagePopup.Holder.appendChild(PagePopup.Front);
      document.body.appendChild(PagePopup.Holder);
    }
  }
}
document.PagePopup = PagePopup;