var def_scrollArea = "V1.0";			// The version of scrollArea.js

var areaIdBase      = "scrollArea";		// ID Bases are also used as class names
var contentIdBase   = "scrollContent";		// Any element with the class of areaIdBase will be converted into a Scroll Area
var upIdBase        = "scrollUp";
var downIdBase      = "scrollDown";
var indicatorIdBase = "scrollIndicator";
var showThisClass   = "subActive";		// Class of an item in the list to make sure is visible

//delay 20, step 1 is ok..., 10 5 is ok too

/*
var scrollDelay   = 1;
var defScrollMaxStep = 1;
var scrollMaxStep = 1;
var maxScrollMaxStep = 5;
var tmpDelay = 1;
*/

/*
var scrollDelay   = 1;
var defScrollMaxStep = 3;
var scrollMaxStep = 3;
var maxScrollMaxStep = 40;
var tmpDelay = 1;
*/


var scrollDelay   = 1;
var defScrollMaxStep = 3;
var scrollMaxStep = 3;
var maxScrollMaxStep = 40;
var tmpDelay = 1;


var scrollTimout = null;

var scrollAreaIds = new Array();
var scrollAreaOffsets = new Array();

function setArrows( areaNum )
{
  var areaId    = scrollAreaIds[areaNum];
  var contentId = contentIdBase + areaNum;
  var upId      = upIdBase + areaNum;
  var downId    = downIdBase + areaNum;
  var indicatorId = indicatorIdBase + areaNum;

  //doing that manually = should update this
  if( typeof( areaId ) == "null" || !areaId )
  {
    areaId = "q8staff_scroll";

    if( document.getElementById( areaId ) == "null" || !document.getElementById( areaId ) )
    {
      areaId = "list27";	//news
    }
  }

  if( getlayerheight( contentId ) <= getlayerheight( areaId ) )
  {
    var pos = getElt( areaId ).className.indexOf( areaIdBase );

    if( getElt( areaId ).id.indexOf( "q8staff_scroll" ) == -1 && getElt( areaId ).id.indexOf( "list27" ) == -1 )		//not the team or the news one
    {
      getElt( areaId ).className = getElt( areaId ).className.substring( 0, pos ) + getElt( areaId ).className.substring( pos + areaIdBase.length );
    }

    scrollAreaIds[areaNum] = null;

    getElt( upId ).style.display = "none";
    getElt( downId ).style.display = "none";
    getElt( indicatorId ).style.display = "none";

    return;
  }

  var offset = getOffset( contentId );

  if( offset < 0 )
  {
    getElt( upId ).style.display = "block";
    setfade( upId, 80 );
  }
  else
  {
    getElt( upId ).style.display = "none";
    scrollAreaClearTimeout();
  }

  if( offset + getlayerheight( contentId ) > getlayerheight( areaId ) )
  {
    getElt( downId ).style.display = "block";
    setfade( downId, 80 );
  }
  else
  {
    getElt( downId ).style.display = "none";
    scrollAreaClearTimeout();
  }

  setIndicator( areaNum );
}

function setArrows2( areaNum )		//only called by q8_staff content list
{
  var areaId    = scrollAreaIds[areaNum];
  var contentId = contentIdBase + areaNum;
  var upId      = upIdBase + areaNum;
  var downId    = downIdBase + areaNum;
  var indicatorId = indicatorIdBase + areaNum;

  //if( typeof(areaId) == "undefined" || areaId == "null" )
  //{
  areaId = "q8staff_scroll";
  //}


  if( getlayerheight( contentId ) <= getlayerheight( areaId ) )
  {
    var pos = getElt( areaId ).className.indexOf( areaIdBase );

    if( getElt( areaId ).id.indexOf( "q8staff_scroll" ) == -1 )		//not the team one
    {
      getElt( areaId ).className = getElt( areaId ).className.substring( 0, pos ) + getElt( areaId ).className.substring( pos + areaIdBase.length );
    }

    scrollAreaIds[areaNum] = null;

    getElt( upId ).style.display = "none";
    getElt( downId ).style.display = "none";
    getElt( indicatorId ).style.display = "none";

    return;
  }

  var offset = getOffset( contentId );

  if( offset < 0 )
  {
    getElt( upId ).style.display = "block";
    setfade( upId, 80 );
  }
  else
  {
    getElt( upId ).style.display = "none";
    scrollAreaClearTimeout();
  }

  if( offset + getlayerheight( contentId ) > getlayerheight( areaId ) )
  {
    getElt( downId ).style.display = "block";
    setfade( downId, 80 );
  }
  else
  {
    getElt( downId ).style.display = "none";
    scrollAreaClearTimeout();
  }

  setIndicator( areaNum );
}

function scrollUp( ev )
{
  if( typeof( ev ) == "undefined" ) ev = event;

  var buttonDiv = ( ( typeof( ev.target ) == "undefined" ) ? ev.srcElement : ev.target );

  var areaNum = buttonDiv.id.substring( 8 );

  scrollArea( areaNum, scrollMaxStep );
}

function scrollDown( ev )
{
  if( typeof( ev ) == "undefined" ) ev = event;

  var buttonDiv = ( ( typeof( ev.target ) == "undefined" ) ? ev.srcElement : ev.target );

  var areaNum = buttonDiv.id.substring( 10 );

  scrollArea( areaNum, -scrollMaxStep );
}

function setIndicator( areaNum )
{
  var areaId      = scrollAreaIds[areaNum];
  var contentId   = contentIdBase + areaNum;
  var indicatorId = indicatorIdBase + areaNum;

  var indHeight = getlayerheight( areaId ) * getlayerheight( areaId ) / getlayerheight( contentId );

  getElt( indicatorId ).style.height = indHeight + "px";

  var indTop = Math.abs( getOffset( contentId ) ) * getlayerheight( areaId ) / getlayerheight( contentId );

  getElt( indicatorId ).style.top = indTop + "px";
}

function scrollArea( areaNum, step )
{
  scrollAreaClearTimeout();


  if( Math.abs( step ) < maxScrollMaxStep )
  {
    if( tmpDelay>=15 && tmpDelay%15 == 0 ) //every 15 times
    {
      if( step<0)
      {
        step--;
      }
      else
      {
        step++;
      }
    }
    
    //scrollDelay += 5;
    scrollMaxStep = Math.abs( step );
    tmpDelay++;
  }


//  document.getElementById( "comments" ).innerHTML = "step: " + step + " and delay:" + scrollDelay;

  var areaId    = scrollAreaIds[areaNum];
  var contentId = contentIdBase + areaNum;

  var offset = getOffset( contentId );

  offset = offset + step;

  scrollAreaTo( areaNum, offset );

  //if( Math.abs( step ) < maxScrollMaxStep ) step = step * 2;

//  document.getElementById( "comments" ).innerHTML = "step: " + step + " and delay:" + scrollDelay;

  if( ( offset < 0 ) || ( offset + getlayerheight( contentId ) > getlayerheight( areaId ) ) )
  {
    scrollTimout = setTimeout( "scrollArea( " + areaNum + ", " + step + " )", scrollDelay );
  }
}

function scrollAreaToArea( areaNum, offset, areaId )
{
  var contentId = contentIdBase + areaNum;

  if( getlayerheight( contentId ) < getlayerheight( areaId ) ) offset = 0;

  if( offset + getlayerheight( contentId ) < getlayerheight( areaId ) )
  {
    offset = getlayerheight( areaId ) - getlayerheight( contentId );
  }

  if( offset > 0 )
  {
    offset = 0;
  }

  getElt( contentId ).style.marginTop = offset + "px";

  setArrows( areaNum );
}

function scrollAreaTo( areaNum, offset )
{
  var areaId    = scrollAreaIds[areaNum];
  var contentId = contentIdBase + areaNum;

  if( offset + getlayerheight( contentId ) < getlayerheight( areaId ) )
  {
    offset = getlayerheight( areaId ) - getlayerheight( contentId );
  }
  if( offset > 0 )
  {
    offset = 0;
  }

  getElt( contentId ).style.marginTop = offset + "px";

  setArrows( areaNum );
}

function getOffset( contentId )
{
  var offset = parseInt( getElt( contentId ).style.marginTop );

  if( isNaN( offset ) ) offset = 0;

  return offset;
}

function scrollAreaStep()
{
  scrollDelay   = 1;
  scrollMaxStep = 3;  //1
  tmpDelay = 1;
}

function scrollAreaClearTimeout()
{
  if( scrollTimout != null ) clearTimeout( scrollTimout );

  scrollTimout = null;
}

function scrollAreaStart()
{
  scrollAreaClearTimeout();

  var areaNum;

  for( areaNum in scrollAreaOffsets )
  {
    if( typeof( scrollAreaIds[areaNum] ) != "undefined" && scrollAreaIds[areaNum] != null )
    {
      scrollAreaTo( areaNum, 0 - ( scrollAreaOffsets[areaNum] - getlayerheight( scrollAreaIds[areaNum] ) / 2 ) );
    }
  }
}

function scrollAreaSetup()
{
  if( scroll_unload != null && typeof( scroll_unload ) != "undefined" )
  {
    scroll_unload();
    scroll_unload = null;
  }

  var areaNum = 1;

  var divs = document.getElementsByTagName( "div" );

  for( var i = 0 ; i < divs.length ; i++ )
  {
    if( typeof( divs.item( i ).className ) != "undefined" && divs.item( i ).className != null && divs.item( i ).className.indexOf( areaIdBase ) != -1 )
    {
      if( divs.item( i ).id == null || typeof( divs.item( i ).id ) == "undefined" || divs.item( i ).id == "" )
      {
        divs.item( i ).id = areaIdBase + areaNum;
      }

      scrollAreaIds[areaNum] = divs.item( i ).id;

      divs.item( i ).innerHTML = '  <div id="' + upIdBase + areaNum + '" class="' + upIdBase + '" onmouseover="updateClass(\'' + upIdBase + areaNum + '\'); scrollUp(event)" onmouseout="updateClass(\'' + upIdBase + areaNum + '\'); scrollAreaClearTimeout();scrollAreaStep()"></div>' +
        '  <div id="' + downIdBase + areaNum + '" class="' + downIdBase +'" onmouseover="updateClass(\'' + downIdBase + areaNum + '\'); scrollDown(event)" onmouseout="updateClass(\'' + downIdBase + areaNum + '\'); scrollAreaClearTimeout();scrollAreaStep()"></div>' +
        '  <div id="' + indicatorIdBase + areaNum + '" class="' + indicatorIdBase + '"></div>' +
        '  <div id="' + contentIdBase + areaNum + '" class="' + contentIdBase + '">' + divs.item( i ).innerHTML + '  </div>';

      //alert( divs.item( i ).innerHTML );

      setArrows( areaNum );

      areaNum++;
    }
    else if( typeof( divs.item( i ).className ) != "undefined" && divs.item( i ).className != null && divs.item( i ).className.indexOf( showThisClass ) != -1 )
    {
      scrollAreaOffsets[areaNum - 1] = divs.item( i ).offsetTop;
    }
  }

  scrollTimout = setTimeout( "scrollAreaStart()", scrollDelay );

}

function scrollUpBis( divName )
{
  var buttonDiv = document.getElementById( "scrollUp1" );

  var areaNum = buttonDiv.id.substring( 8 );

  divName = divName.replace( "BODY", "" );

  var offset = parseInt( document.getElementById( divName ).offsetTop ) ;

  if( offset > 38 )
  {
    offset = offset - 38;
  }
  else
  {
    offset = 0;
  }

//  setTimeout( "scrollAreaTo( " + areaNum + ", -" + offset + ");", 500 );
  scrollAreaTo( areaNum, 0 - offset );
  //scrollAreaTo( areaNum, -offset );

  setArrows( areaNum );
}

function scrollUpBisArea( divName, areaId )
{
  var buttonDiv = document.getElementById( "scrollUp1" );

  var areaNum = buttonDiv.id.substring( 8 );

  divName = divName.replace( "BODY", "" );

  var offset = parseInt( document.getElementById( divName ).offsetTop ) ;

  if( offset > 38 )
  {
    offset = offset - 38;
  }
  else
  {
    offset = 0;
  }

//  setTimeout( "scrollAreaToArea( " + areaNum + ", -" + offset + ", '" + areaId + "');", 500 );
  scrollAreaToArea( areaNum, 0 - offset, areaId );
  //scrollAreaTo( areaNum, -offset );

  setArrows( areaNum );
}

function scrollTeam( divName )
{
  var buttonDiv = document.getElementById( "scrollUp1" );
  var areaNum = "1";

  if( buttonDiv!=null )
  {
    areaNum = buttonDiv.id.substring( 8 );
  }

  //divName = divName.replace( "BODY", "" );

  //not sure that is needed
  setTimeout( "scrollAreaTo( " + areaNum + ", 0 " + ");", 10 );
  setTimeout( "setArrows2( " + areaNum + ");", 300 );

  //alert( "scrolling team" );

}

function updateClass( objName )
{
	var divObj = document.getElementById( objName );

	if( divObj == undefined ) return;

	if( divObj.className.indexOf( "Over" )!=-1 )
	{
		divObj.className = divObj.className.substring( 0, divObj.className.indexOf ( "Over" ) );
	}
	else if( divObj.className != "" )
	{
		divObj.className = divObj.className + "Over";
	}

}

scroll_unload = window.onload;
window.onload = scrollAreaSetup;