//
// Viewport
//
// This module requires core.js
//
function CViewport(a_szItemClassName, a_szLeftButtonID, a_szRightButtonID)
{
   //
   // Public Variables
   //
   var m_szItemClassName = a_szItemClassName;
   this.m_szItemClassName = m_szItemClassName;

   var m_szLeftButtonID = a_szLeftButtonID;
   this.m_szLeftButtonID = m_szLeftButtonID;

   var m_oLeftButton  = ei(m_szLeftButtonID);
   this.m_oLeftButton = m_oLeftButton;

   var m_szRightButtonID = a_szRightButtonID;
   this.m_szRightButtonID = m_szRightButtonID;

   var m_oRightButton = ei(m_szRightButtonID);
   this.m_oRightButton = m_oRightButton;

   var m_arrImageStore = new Array();
   this.m_arrImageStore = m_arrImageStore;
   //
   // Private Variables
   //
   var m_oItemCollection = new Array();
   var m_iBaseZIndex = null;
   var m_iDefaultBaseZIndex = 1000;

   var m_iSlideLeftID = -1;
   var m_iSlideLeftInterval = 10;
   var m_iSlideRightID = -1;
   var m_iSlideRightInterval = 10;

   var m_oTransAccel = new CTransAccel(0);
   var m_oLeftItem = null;
   var m_oRightItem = null;
   //
   // Constructor
   //
   if(m_szItemClassName && m_oLeftButton && m_oLeftButton)
   {
      __preloadImages(
                        {
                           left_up:        "images/portfolio/nav_left_up.gif",
                           left_hover:     "images/portfolio/nav_left_hover.gif",
                           left_disabled:  "images/portfolio/nav_left_disabled.gif",
                           right_up:       "images/portfolio/nav_right_up.gif",
                           right_hover:    "images/portfolio/nav_right_hover.gif",
                           right_disabled: "images/portfolio/nav_right_disabled.gif"
                        }
                     );
                     
      refresh();
   }
   //
   // Public Functions
   //
   function refresh()
   {
      m_oItemCollection = new Array();
      m_oItemCollection.currentIndex = 0;

      var oItemCollection = etc("div", m_szItemClassName);
      if( oItemCollection && (oItemCollection.length > 0) )
      {
         if(oItemCollection[0].style.zIndex)
         {
            m_iBaseZIndex = parseInt(oItemCollection[0].style.zIndex);
            if(m_iBaseZIndex < 1)
            {
               m_iBaseZIndex = m_iDefaultBaseZIndex;
            }
         }
         else
         {
            m_iBaseZIndex = m_iDefaultBaseZIndex;
         }
         for(var i = 0; i < oItemCollection.length; i++)
         {
            var oParent = getParent(oItemCollection[i]);
            if(oParent && ('none' != oParent.style.display) )
            {
               oItemCollection[i].style.zIndex = m_iBaseZIndex - i;
               if(i)
               {
                  var iWidth = oItemCollection[i].offsetWidth;
                  if(0 == iWidth)
                  {
                     iWidth = parseInt(oItemCollection[i].style.width);
                  }
                  oItemCollection[i].style.left = iWidth;
               }
               m_oItemCollection.push(oItemCollection[i]);
            }
         }
         m_oItemCollection[m_oItemCollection.currentIndex].style.left = 0;

         m_oLeftButton.onclick     = leftButtonClick;
         m_oLeftButton.onmouseover = leftButtonMouseOver;
         m_oLeftButton.onmouseout  = leftButtonMouseOut;

         m_oRightButton.onclick     = rightButtonClick;
         m_oRightButton.onmouseover = rightButtonMouseOver;
         m_oRightButton.onmouseout  = rightButtonMouseOut;
      }
   }
   this.refresh = refresh;

   function slideLeft()
   {
      if(!m_oItemCollection) return;
      stop();
      __offsetItemsRight();
      var iLeftIndex = m_oItemCollection.currentIndex;
      m_oItemCollection.currentIndex++;
      if(m_oItemCollection.currentIndex >= m_oItemCollection.length)
      {
         m_oItemCollection.currentIndex = 0;
      }
      var iRightIndex = m_oItemCollection.currentIndex;

      if(iRightIndex == iLeftIndex)
      {
         m_oItemCollection[m_oItemCollection.currentIndex].style.left = 0;
         return;
      }
      m_oLeftItem = m_oItemCollection[iLeftIndex];
      m_oRightItem = m_oItemCollection[iRightIndex];

      var iWidth = m_oRightItem.offsetWidth;
      if(0==iWidth)
      {
         iWidth = parseInt(m_oRightItem.style.width);
      }
      m_oRightItem.style.left = iWidth;
      m_oLeftItem.style.left = 0;

      __updateZIndex();

      m_oLeftItem.startLeft = (m_oLeftItem.style.left)? parseInt(m_oLeftItem.style.left) : 0;
      m_oRightItem.startLeft = (m_oRightItem.style.left)? parseInt(m_oRightItem.style.left) : 0;
      m_oLeftItem.finalLeft = -iWidth;
      m_oRightItem.finalLeft = 0;

      m_oTransAccel.run(iWidth);
      m_iSlideLeftID = setTimeout(__slideLeft,m_iSlideLeftInterval);
   }
   this.slideLeft = slideLeft;

   function slideRight()
   {
      if(!m_oItemCollection) return;
      stop();
      __offsetItemsRight();
      var iRightIndex = m_oItemCollection.currentIndex;
      m_oItemCollection.currentIndex--;
      if(m_oItemCollection.currentIndex < 0)
      {
         m_oItemCollection.currentIndex = m_oItemCollection.length - 1;
      }
      var iLeftIndex = m_oItemCollection.currentIndex;
      if(iLeftIndex == iRightIndex)
      {
         m_oItemCollection[m_oItemCollection.currentIndex].style.left = 0;
         return;
      }

      m_oRightItem = m_oItemCollection[iRightIndex];
      m_oLeftItem = m_oItemCollection[iLeftIndex];

      var iWidth = m_oLeftItem.offsetWidth;
      if(0==iWidth)
      {
         iWidth = parseInt(m_oLeftItem.style.width);
      }
      m_oLeftItem.style.left = -iWidth;
      m_oRightItem.style.left = 0;

      __updateZIndex();

      m_oLeftItem.startLeft = -iWidth;
      m_oRightItem.startLeft = (m_oRightItem.style.left)? parseInt(m_oRightItem.style.left) : 0;
      m_oLeftItem.finalLeft = 0;
      m_oRightItem.finalLeft = iWidth;

      m_oTransAccel.run(iWidth);
      m_iSlideRightID = setTimeout(__slideRight,m_iSlideRightInterval);
   }
   this.slideRight = slideRight;
   //
   // Private Functions
   //
   function stop()
   {
      if(-1 != m_iSlideLeftID)
      {
         clearTimeout(m_iSlideLeftID);
         m_iSlideLeftID = -1;
      }
   }
   function __preloadImages(a_arrImagePairs)
   {
      for(szName in a_arrImagePairs)
      {
         preloadImage(a_arrImagePairs[szName]);
         m_arrImageStore[szName] = "url('"+a_arrImagePairs[szName]+"')";
      }
   }   

   function rightButtonClick(a_e)
   {
      var oe = getElementFromEvent(a_e);
      if(!oe) return;
      slideRight();
   }
   function leftButtonClick(a_e)
   {
      var oe = getElementFromEvent(a_e);
      if(!oe) return;
      slideLeft();
   }

   function leftButtonMouseOver(a_e)
   {
      var oe = getElementFromEvent(a_e);
      if(!oe) return;

      oe.style.backgroundImage = m_arrImageStore['left_hover'];
   }

   function rightButtonMouseOver(a_e)
   {
      var oe = getElementFromEvent(a_e);
      if(!oe) return;

      oe.style.backgroundImage = m_arrImageStore['right_hover'];
   }

   function leftButtonMouseOut(a_e)
   {
      var oe = getElementFromEvent(a_e);
      if(!oe) return;

      oe.style.backgroundImage = m_arrImageStore['left_up'];
   }

   function rightButtonMouseOut(a_e)
   {
      var oe = getElementFromEvent(a_e);
      if(!oe) return;

      oe.style.backgroundImage = m_arrImageStore['right_up'];
   }

   function __updateZIndex()
   {
      for(var i = 0; i < m_oItemCollection.length; i++)
      {
         if(i <= m_oItemCollection.currentIndex)
         {
            m_oItemCollection[i].style.zIndex = m_iBaseZIndex - m_oItemCollection.currentIndex-0 + i;
         }
         else
         {
            m_oItemCollection[i].style.zIndex = m_iBaseZIndex - m_oItemCollection.currentIndex - (i - m_oItemCollection.currentIndex);
         }
      }
   }

   function __slideLeft()
   {
      if(!m_oRightItem) return;
      if(!m_oLeftItem) return;
      var iDistanceTraveled = m_oTransAccel.getDistanceTraveled();

      var iLeftLeft = m_oLeftItem.startLeft - iDistanceTraveled;
      var iRightLeft = m_oRightItem.startLeft - iDistanceTraveled;
      if(m_oTransAccel.isDone())
      {
         stop();
         m_oLeftItem.style.left = m_oLeftItem.finalLeft;
         m_oRightItem.style.left = m_oRightItem.finalLeft;

         return;
      }

      if(iLeftLeft > m_oLeftItem.finalLeft)
      {
         m_oLeftItem.style.left = iLeftLeft;
      }
      if(iRightLeft > m_oRightItem.finalLeft)
      {
         m_oRightItem.style.left = iRightLeft;
      }
      
      m_iSlideLeftID = setTimeout(__slideLeft,m_iSlideLeftInterval);

   } // End of function __slideLeft()

   function __slideRight()
   {
      if(!m_oRightItem) return;
      if(!m_oLeftItem) return;
      var iDistanceTraveled = m_oTransAccel.getDistanceTraveled();

      var iLeftLeft = m_oLeftItem.startLeft-0 + iDistanceTraveled;
      var iRightLeft = m_oRightItem.startLeft-0 + iDistanceTraveled;
      if(m_oTransAccel.isDone())
      {
         stop();
         m_oLeftItem.style.left = m_oLeftItem.finalLeft;
         m_oRightItem.style.left = m_oRightItem.finalLeft;

         return;
      }

      if(iLeftLeft < m_oLeftItem.finalLeft)
      {
         m_oLeftItem.style.left = iLeftLeft;
      }
      if(iRightLeft < m_oRightItem.finalLeft)
      {
         m_oRightItem.style.left = iRightLeft;
      }
      
      m_iSlideRightID = setTimeout(__slideRight,m_iSlideRightInterval);

   } // End of function __slideRight()

   function __offsetItemsRight()
   {
      for(var i = 0; i < m_oItemCollection.length; i++)
      {
         m_oItemCollection[i].style.zIndex = m_iBaseZIndex - i;
         if(i != m_oItemCollection.currentIndex)
         {
            m_oItemCollection[i].style.left = m_oItemCollection[i].offsetWidth;               
         }
      }
   }


} //End of function CTransViewport(a_szItemClassName, a_szLeftButtonID, a_szRightButtonID)