var mask = new Mask();
var LayerUtil = 
 {
     createLayer : function( innerHTML )
     {
         return new Layer( innerHTML );    
     }
 }
 
 var Layer = function ( innerHTML )
 {
     var IE = document.all ? true : false ;
     
     var layerElement = document.createElement("DIV");
     
     var layerInnerHTML    = innerHTML;
     
     this.closeLayer = function()
     {
        if (mask != null) 
            mask.clean();    
         layerElement.innerHTML = "";
         layerElement.style.display = "none";
     }
     
     this.getLayer = function ()
     {
         return layerElement;
     }
     
     this.setInnerHTML = function ( html )
     {
         layerInnerHTML = html;
     }
     
     this.setDisplay = function( isView )
     {
         this.reloadLayer();
         layerElement.style.display = isView ? "block" : "none";
     }
     
     this.moveLayer = function ( x , y )
     {
         layerElement.style.left = x + "px";
         layerElement.style.top =  y + "px";
     }
 
     this.viewLayer = function ( isFade , x , y )
     {
         mask.show();
         this.reloadLayer( x , y );
         if( !isFade ) 
         { 
                layerElement.style.display = "";
         }
         else
         { 
             IE ? layerElement.style.filter = "alpha(opacity=0)" : layerElement.style.opacity = "0";
             layerElement.style.zIndex = mask.zIndexNow;
             var popup = $("popup");
             if (popup != null)
             {
                 var title = $("poptitle");
                 if (title != null)
                 {
                    var dragAble = new DragAble(layerElement, title);
                  }
              }   
             var opacity = 95 ;
             var intervalID = window.setInterval
             (
                 function()
                 {
                     if( opacity < 100 )
                     { 
                         if( IE )
                         {
                             layerElement.style.filter = "alpha(opacity=" +  opacity + ")";
                         }
                         else
                         {
                             layerElement.style.opacity = (opacity / 100);
                         }
                         opacity = opacity + 5;
                     }
                     else
                     { 
                         window.clearInterval( intervalID );
                     }
                 }
                 ,
                 100
             )
        }
     }
 
     this.reloadLayer = function ( x , y )
     {
         document.body.appendChild(layerElement);
         layerElement.style.position = "absolute";
         layerElement.style.display = "block";
         layerElement.innerHTML = layerInnerHTML;
         var docWidth = document.documentElement.clientWidth;
         var docHeight = document.documentElement.clientHeight;
         var scrollTop = document.documentElement.scrollTop;
         var scrollLeft = document.documentElement.scrollLeft;
         layerElement.style.left = ( !isNaN(x) ? x : (docWidth - layerElement.offsetWidth)/2   + scrollLeft)   + "px";
         if(( !isNaN(y) ? y : (docHeight - layerElement.offsetHeight)/2 + scrollTop ) < 0)
         {     
            layerElement.style.top = "10px";     
          }
          else
          {   
             layerElement.style.top  = ( !isNaN(y) ? y : (docHeight - layerElement.offsetHeight)/2 + scrollTop )   + "px";
           }  
        
     }
 }