function getViewport()
{
  var viewportwidth;
  var viewportheight;
  
  // the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
  if (typeof window.innerWidth != 'undefined') 
  {
    viewportwidth = window.innerWidth;
    viewportheight = window.innerHeight;
  }
  
  // IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)  
  else if (typeof document.documentElement != 'undefined' 
    && typeof document.documentElement.clientWidth != 'undefined'
    && document.documentElement.clientWidth != 0) 
    {
      viewportwidth = document.documentElement.clientWidth;
      viewportheight = document.documentElement.clientHeight;
    }
    
    // older versions of IE
    else 
    {
      viewportwidth = document.getElementsByTagName('body')[0].clientWidth;
      viewportheight = document.getElementsByTagName('body')[0].clientHeight;
    }
  
  return {
    x: viewportwidth,
    y: viewportheight
  };
}


var MM_Slickbox = {
   triggers: []
  ,wrapper: null
  ,wrapperContent: null
  ,wrapperHead: null
  ,content: null
  ,fx: null
  ,lastCaller: null
  ,init: function()
  {
    this.triggers = $$('a[rel^=slickbox]');
    this.triggers.each(function(el)
    {
      el.addEvent('click', function(e)
      {
        e;
        MM_Slickbox.hide();
        MM_Slickbox.show(this.href, this);
      }.bindWithEvent(el));
    });
    
    this.wrapper = new Element('div');
    
    this.wrapper.set('html', 
    '<div style="text-align: left; width: 640px">' +
    '    <div style="overflow: hidden; width: 100%; position: relative;">' +
    '    <h1 id="page-head"><span class="head">&nbsp;</span><span' +
    '      style="position: absolute; top: 0px; right: 2px; font-size: 1.6em; cursor: pointer;"' +
    '      onclick="MM_Slickbox.hide();">X</span></h1>' +
    '    </div>' +
    '' +
    '<div style="margin: 0 10px; padding-bottom: 10px;" class="content">' +
    '</div>' +
    '</div>'
    );
    
    document.getElement('body').adopt(this.wrapper);
    this.wrapperContent = this.wrapper.getElement('div.content');
    this.wrapperHead = this.wrapper.getElement('span.head');
/*
    this.wrapper.makeDraggable({
       handle: this.wrapperHead.getParent()
      ,onComplete: function()
      {
        var slickBoxPos = new Hash.Cookie('MM_SlickboxPos', {duration: 3600});
        slickBoxPos.set('coord', arguments[0].getCoordinates());
        slickBoxPos.save();
      }
    });
*/
    this.wrapperHead.getParent().setStyles({
      cursor: 'move'
    });

    this.wrapper.setStyles({
       overflow: 'hidden'
      ,height: 0
      ,width: 0
      ,position: 'absolute'
      ,background: '#f1f1f1'
      ,border: '1px solid #999999'
      ,zIndex: 9999
      ,opacity: 0
    });
    
    this.fx = new Fx.Morph(this.wrapper, {duration: 250, wait: false, onComplete: function()
    {      
      if (!MM_Slickbox.amClosed)
      {
        var dim = window.getSize();
        var dim2 = MM_Slickbox.wrapper.getFirst().getCoordinates();
        var w = dim2.width;
        var h = dim2.height;
        var dim3 = getViewport();
        MM_Slickbox.wrapperContent.setStyles({
           overflow: 'auto'
          ,height: Math.min(h, dim3.y - 100) - 50
        });
        
        if (0 < MM_Slickbox.wrapperContent.scrollHeight - parseInt(MM_Slickbox.wrapperContent.getStyle('height')))
        {
          MM_Slickbox.wrapper.getFirst().setStyle('width', 670);
          MM_Slickbox.wrapper.setStyle('width', 670);
        }
        else
        {
          MM_Slickbox.wrapper.getFirst().setStyle('width', 640);
          MM_Slickbox.wrapper.setStyle('width', 640);
        }
        MM_Slickbox.wrapperHead.getParent().setStyle('width', '100%');
        MM_Slickbox.wrapper.removeClass('ajax-loading');
      }
    }});
  }
  
  ,hide: function()
  {
    this.wrapperHead.empty();
    this.wrapperContent.empty();
    this.wrapperContent.setStyles({overflow: 'visible', height: 0, width: 0});
    this.wrapper.addClass('ajax-loading');
    if (this.lastCaller)
    {
      this.amClosed = true;
      this.fx.start(this.getPositionsFromCaller());
    }
  }
  
  ,getPositionsFromCaller: function()
  {
    var dim = this.lastCaller.getCoordinates();
    
    return {
       width: 0
      ,height: 0
      ,left: dim.left + Math.floor(dim.width / 2)
      ,top: dim.top + Math.floor(dim.height / 2)
      ,opacity: 0
    }
  }
  
  ,show: function(url, obj)
  {
    this.lastCaller = obj;
    
    new Request({url: url,
      onComplete: function(resp)
      {
        MM_Slickbox.wrapper.setStyles({
           overflow: 'visible'
          ,opacity: 0
          ,width: 'auto'
          ,height: 'auto'
        });
        MM_Slickbox.wrapperContent.setStyles({
           overflow: 'visible'
          ,width: 'auto'
          ,height: 'auto'
        });
        
        MM_Slickbox.wrapperHead.set('html', /<h1>([^<]*)<\/h1>/.exec(resp).pop());
        resp = resp.replace(/<h1>.*<\/h1>/, '');
        
        MM_Slickbox.wrapperContent.set('html', resp);
        var dim = window.getSize();
        var dim2 = MM_Slickbox.wrapper.getFirst().getCoordinates();
        var w = dim2.width;
        var h = dim2.height;
        MM_Slickbox.wrapper.setStyles({
           overflow: 'hidden'
        });
        MM_Slickbox.wrapper.setStyles({
           opacity: 1
        });
        MM_Slickbox.wrapper.setStyles(MM_Slickbox.getPositionsFromCaller());
        
        var dim3 = getViewport();
        
        var newPos = {
           width: w
          ,height: Math.min(h, dim3.y - 100)
          ,top: 50 + dim.scroll.y
          ,left: Math.floor(dim.size.x / 2) - Math.floor(w / 2)
          ,opacity: 1
        };
        
        var slickBoxPos = new Hash.Cookie('MM_SlickboxPos', {duration: 3600});
        var coord = slickBoxPos.get('coord');
        if (coord)
        {
          newPos.top = Math.max(1, Math.min(dim.scroll.y + dim3.y - 30, coord.top));
          newPos.left = Math.max(-600, Math.min(dim3.x - 40, coord.left));
        }
        
        MM_Slickbox.amClosed = false;
        MM_Slickbox.fx.start(newPos);
      }.bind(obj)
    }).send();
  }
};

window.addEvent('domready', function()
{
  MM_Slickbox.init();
});