/****************************************************************************
 * Copyright (c) 1998-2007 Luna Imaging, Inc.  All Rights Reserved.
 *
 * This software is confidential and proprietary information of
 * Luna Imaging, Inc.  ("Confidential Information").  You shall not
 * disclose such Confidential Information and shall use it only in
 * accordance with the terms of the license agreement you entered into
 * with Luna Imaging, Inc.
 *
 * The software may not be copied, reproduced, translated or reduced to
 * any electronic medium or machine-readable form without
 * the prior written consent of Luna Imaging.
 *
 * You are not allowed to distribute the binary and source code
 * (if released) to third parties, without the prior written consent from
 * Luna Imaging.
 *
 * You are not allowed to reverse engineer, disassemble or decompile
 * code, or make any modifications of the binary or source code, remove
 * or alter any trademark, logo, copyright or other proprietary notices,
 * legends, symbols, or labels in the Software.
 *
 * You are not allowed to sub-license the Software or any derivative
 * work based on or derived from the Software.
 *
 * LUNA IMAGING MAKES NO REPRESENTATIONS OR WARRANTIES ABOUT THE
 * SUITABILITY OF THE SOFTWARE, EITHER EXPRESS OR IMPLIED, INCLUDING BUT
 * NOT LIMITED TO THE IMPLIED WARRANTIES OF MERCHANTABILITY, FITNESS FOR
 * A PARTICULAR PURPOSE, OR NON-INFRINGEMENT, LUNA IMAGING SHALL NOT BE
 * LIABLE FOR ANY DAMAGES SUFFERED BY LICENSEE AS A RESULT OF USING, 
 * MODIFYING OR DISTRIBUTING THIS SOFTWARE OR ITS DERIVATIVES.
 *  
 *  cruiz10020@yahoo.com
 *
 *  HideablePanel.js
 *
 *  Description:
 *    A panel that can hide itself
 *
 *  Structure:
 *
 *
 *  Requires:
 *    prototype.js - http://www.prototypejs.org/
 *    YUI - http://developer.yahoo.com/yui/
 *
 *  Development History:
 *    6-13-2007   cruiz    - created
 *
 *******************************************************************************/


function HideablePanel()
{
  this.mContainer = null;
  this.mPositionRefernceElement = null;
  this.mPanel = null;
  this.mBody = null;
  this.mCloseButton = null;
  
  this.mDimensions = null;
  this.mAnimate = true;
  this.mIsHidden = false;
  
  this.CLASSNAME = 'hideablePanel';
  this.CLASSNAME_BODY = 'body';
  this.CLASSNAME_HIDE_BUTTON = 'closeButton';  
  
  this.DEFAULT_ZINDEX = 999999;
  
  this.HIDE_TEXT = 'Close';
  this.HIDE_INSTRCUTIONS = 'Click to close!';
  
  this.init = function()
  {    
    if( ! this.mPanel )
    {
      this.mPanel = $( document.createElement( 'div' ) );
      this.mContainer.appendChild( this.mPanel );
    }
    
    if( ! this.mBody )
    {
      this.mBody = $( document.createElement( 'div' ) );
      this.mPanel.appendChild( this.mBody );
    }
    
    this.mCloseButton = $( document.createElement( 'a' ) );
    
    this.mCloseButton.href = 'javascript: var closeButton;';
    this.mCloseButton.title = this.HIDE_INSTRCUTIONS;
    this.mPanel.addClassName( this.CLASSNAME );
    this.mBody.addClassName( this.CLASSNAME_BODY );
    this.mCloseButton.addClassName( this.CLASSNAME_HIDE_BUTTON );    
    
    this.mPanel.appendChild( this.mCloseButton );    
    
    // events
    var hp = this;
    this.mCloseButton.onclick = function(){ hp.hide(); };
    
    // stylings
    this.mPanel.style.position = 'absolute';
    this.mPanel.style.top = 0 + 'px';
    this.mPanel.style.left = 0 + 'px';
    this.mPanel.style.overflow = 'hidden';
    this.mPanel.style.zIndex = this.DEFAULT_ZINDEX;
    
    this.mCloseButton.style.position = 'absolute';
    this.mCloseButton.style.right = 20 + 'px';
    this.mCloseButton.style.top = 10 + 'px';
    
    // background image is optional
    if( ! this.mCloseButton.style.backgroundImage )
    {
      this.mCloseButton.update( this.HIDE_TEXT );
    }
    
    this.mPanel.style.width = 0 + 'px';
    this.mPanel.style.height = 0 + 'px';
    
    this.mBody.style.overflow = 'auto';
    
    // hide by default
    this.mPanel.hide();
    this.mIsHidden = true;
  };
   
  this.render = function( element )
  {
    if( element )
    {
      this.mContainer = element;
      this.init();
    }
  }
  
  this.associate = function( panel )
  {
    if( panel )
    {
      panel = $( panel );
      this.mContainer = panel.up();
      this.mPanel = panel;
      this.mBody = panel.immediateDescendants()[0];
      this.init();
    }
  };
  
  this.hide = function()
  {
    this.mIsHidden = true;
    if( this.mAnimate == true )
    {
      //this.mBody.hide();
      //this.mCloseButton.hide();
      ElementEffects.animateElementGrowth( this.mPanel, [ this.mDimensions[0], 0 ], 55, .45 );
    }
    else
    {
      this.mPanel.hide();
    }
  };
  
  this.show = function()
  {
    this.mIsHidden = false;
    this.mPanel.show();
    this.updatePosition();
    
    if( this.mAnimate == true )
    {
      this.mPanel.style.width = this.mDimensions[0] + 'px';
      this.mPanel.style.height = 0 + 'px';
      ElementEffects.animateElementGrowth( this.mPanel, this.mDimensions, 55, .45 );
    }
  };
  
  this.toggle = function()
  {
    if( this.mIsHidden == true )
    {
      this.show();
    }
    else
    {
      this.hide();
    }
  };
  
  this.updatePosition = function()
  {
    if( this.mPanel && this.mPositionRefernceElement )
    {
      var referencePosition = Position.cumulativeOffset( this.mPositionRefernceElement );
      var windowSize = jshGetWindowSize();
      var newPosition = $( [ 0, 0 ] );
      newPosition[0] = referencePosition[0];
      newPosition[1] = referencePosition[1] + this.mPositionRefernceElement.getHeight();

      // keep within visible area      
      if( ( newPosition[0] + this.mDimensions[0] ) > windowSize[0]  )
      {
        // lets try the far end of the elemnt
        newPosition[0] = referencePosition[0] + this.mPositionRefernceElement.getWidth() - this.mDimensions[0];
            
        // to fat, let just place it at the far end
        if( ( newPosition[0] + this.mDimensions[0] ) > windowSize[0]  )
          newPosition[0] = ( windowSize[0] - this.mDimensions[0] );
      }

      this.mPanel.style.left = newPosition[0] + 'px';
      this.mPanel.style.top = newPosition[1] + 'px';
    }
  };
  
  this.setPostionRefernceElement = function( element )
  {
    this.mPositionRefernceElement = $( element );
    this.updatePosition();
  };
  
  this.setDimensions = function( dimensions )
  {
    this.mDimensions = dimensions;
    
    if( this.mPanel )
    {
      this.mPanel.style.width = this.mDimensions[0] + 'px';
      this.mPanel.style.height = this.mDimensions[1] + 'px';
      
      var borders = jshBorderOffset( this.mBody, [0, 0] );
      this.mBody.style.width = ( this.mDimensions[0] - borders[0] ) + 'px';
      this.mBody.style.height = ( this.mDimensions[1] - borders[1] )  + 'px';
    }
    
    this.updatePosition();
  };
  
  /**
   * If true the panel will animate certain actions like close and open
   */
  this.setAnimate = function( animate )
  {
    this.mAnimate = animate;
  }
}