// interval in msec tussen elke actie (integer)
// 33 is ongeveer 30 updates per seconde (1000/33)
// 20 is ongeveer 50 updates per seconde (1000/20)
var scrollinterval = 33;
//totale breedte van elk element (inclusief marges e.d.) (integer)
var scrollelementwidth = 192;
//aantal elemenenten wat zichtbaar is binnen het window (integer)
var scrollingwindow = 3;
//stapgrootte waarmee de snelheid wordt aangepast (float)
var speedstep = .05;
//"magnetisme" van elke positie. Hogere waarden laten de scroller sneller stoppen. Bij lagere
//waarden kan de scroller nog even heen en weer bewegen voordat het stopt (float)
var snap = 3;

//interne variabelen
var scollingelement = false;
var scrollinglength = 0;
var currentpos = 0;
var scrolltarget = 0;
var scrollspeed = 0;
var scrolling = false;
var displaydetail = false;


/*
 deze functie bepaald de volgende positie van het scrolling frame en steld deze in
 Als het scroll-doel nog niet is bereikt wordt deze functie herhaald na het scrollinginterval
 
 Deze functie gaat ervan uit dat het begin en het einde van het scrolling frame gelijk zijn
 om de indruk van een oneindige scroller te geven
*/
function set_scroll()
{
  if ((scrollspeed != 0) || (currentpos != scrolltarget)) {
    setTimeout('set_scroll()', scrollinterval)
  //scrolling houdt bij of het frame in beweging is.
  scrolling = true;
  //maak een schatting van de uiteindelijke positie als we nu gaan afremmen
  var estimate = 0;
  var speed = 0;
  speed = Math.abs(scrollspeed);
  for (var i = 1; i <= (speed/speedstep); i++) {
    estimate += i*speedstep;
  }
  if (scrollspeed < 0) estimate *= -1;
  var start = currentpos;
  var end = start+estimate;
  //als we nog voor ons doel uitkomen -> versnellen
  if (end < scrolltarget) scrollspeed += speedstep;
  //anders vertragen
  else scrollspeed -= speedstep;
  //nieuwe positie bepalen
  currentpos = start + scrollspeed;
  //controleer of we niet voorbij het begin of einde scrollen
  if (currentpos > 0) {
    //voorbij het begin, stel de positie bij op het einde
    currentpos -= scrollinglength;
    scrolltarget -= scrollinglength;
  }
  if (currentpos < (-1 * scrollinglength)) {
    //voorbij het einde, stel de positie bij op het begin
    currentpos += scrollinglength;
    scrolltarget += scrollinglength;
  }
  //scroll het frame
  scrollingelement.style.left = Math.round(currentpos)+'px';
  //bepaal of het doel bereikt is
  if ((Math.abs(currentpos - scrolltarget) < snap*speedstep) && (Math.abs(scrollspeed) < (snap*speedstep))) {
    scrollingelement.style.left = scrolltarget+'px';
    scrolling = false;
    scrollspeed = 0;
    currentpos = scrolltarget;
  }
  }
}

/*
Stel het scrolldoel bij 
*/
function scroll_by(amount)
{
  scrolltarget += amount;
  /*if (scrolltarget < 0) scrolltarget = 0;*/
  if (!scrolling) setTimeout('set_scroll()', scrollinterval);
  hide_product();
}

/*
scroll naar het volgende product
*/
function next_product()
{
  scroll_by(-1 * scrollelementwidth);
}

/*
scroll naar het vorige product
*/
function prev_product()
{
  scroll_by(scrollelementwidth);
}

/*
verberg het frame met productgegevens
*/
function hide_product()
{
  if (displaydetail) {
    displaydetail = false;
    //$('productscroller-detail').style.display = 'none';  
    $('productscroller-detail').style.left = 0;
    $('productscroller-detail').style.top = 0;
    Effect.DropOut('productscroller-detail');
  }
}

/*
laadt de productgegevens en geef het frame met productgegevens weer
*/
function show_product(productid)
{
  if (!displaydetail) {
    displaydetail = true;
    new Ajax.Updater('productscroller-detail', '/Ajax', {
      method: 'get',
      parameters: {
        module: 'Productvergelijker',
        m: 'homepageproduct',
        id: productid
      },
      onComplete: function() {
        //$('productscroller-detail').style.display = 'block';
        $('productscroller-detail').style.left = 0;
        $('productscroller-detail').style.top = 0;
        Effect.SlideDown('productscroller-detail');
      }
    })
  }
}

/*
productscroller initialisatie
*/
function init_product()
{
  var scrollerdetail = $('productscroller-detail')
  scrollingelement = $('productscroller');
  scrollerdetail.style.display = 'none';
  scrollingelement.style.left = 0;
  childelements = scrollingelement.childElements();
  scrollingelement.style.width = (childelements.length * scrollelementwidth) + 'px';
  scrollinglength = (childelements.length - scrollingwindow) * scrollelementwidth;
  //maak speedstep onafhankelijk van scrollinterval
  speedstep *= scrollinterval;
  if (childelements.length <= scrollingwindow) {
    disable_scroller();
  }
}

function disable_scroller()
{
  $('productscroller-left').innerHTML = '';
  $('productscroller-right').innerHTML = '';
}

addLoadEvent(init_product);