//change promo bar script

var startIndex = 0;    
var numberToShow = 4;

//use this function if the number is different than 4
function setNumberToShow(numBoxes){
  numberToShow = numBoxes;
  hideExtraBoxes();
}

function moveRight(){                
  boxes = document.getElementById("promo-bar").getElementsByTagName("div");
  if(boxes.length > startIndex + numberToShow + 1){        
    boxes[startIndex].style.display = 'none';
    boxes[(startIndex + numberToShow)].style.display =  'inline';
    startIndex = startIndex + 1; 
  }
  
  document.getElementById("moveLeftButton").style.visibility = 'visible';
  
  if(boxes.length == startIndex + numberToShow + 1){
    document.getElementById("moveRightButton").style.visibility = 'hidden';
  }
}

function moveLeft(){                              
  boxes = document.getElementById("promo-bar").getElementsByTagName("div");
  if(startIndex > 0){
    boxes[startIndex + numberToShow - 1].style.display = 'none';
    boxes[startIndex - 1].style.display =  'inline'; 
    startIndex = startIndex - 1; 
  }
  
  document.getElementById("moveRightButton").style.visibility = 'visible';
        
  if(startIndex == 0){
    document.getElementById("moveLeftButton").style.visibility = 'hidden';
  }      
}

function hideExtraBoxes(){
  var boxes = document.getElementById("promo-bar").getElementsByTagName("div");
  var i = 0;
  for(i = 0; i < numberToShow; i++){
    boxes[i].style.display = 'inline';
  }
  for(i; i < boxes.length; i++){
    boxes[i].style.display = 'none';
  } 
}
