var my_config = [];
with (my_config) {
 my_config.speed = "30";
 my_config.scroll = 1;
 my_config.width = "640";
 my_config.height = "180";
 my_config.direction = "left";
 my_config.banners;
 my_config.slider;
 my_config.slider_1;
 my_config.slider_2;
 my_config.timer;
}
function autoScroll(type){
 my_config.direction = type;
 this.items = [];
 this.add_banner = function(image,link,title,target){
  var newItem  = {};
  newItem.image = image;
  newItem.link = link;
  newItem.title = title;
  newItem.target = target;
  this.items[this.items.length] = newItem;
 }

 this.play = function(){
  my_config.banners = this.items;
  scroll_html();
  with (my_config) {
   slider=document.getElementById("slider_box");
   slider_1=document.getElementById("slider_box_1");
   slider_2=document.getElementById("slider_box_2");
   slider_2.innerHTML=slider_1.innerHTML;
   timer=setInterval(do_timer,speed);
  }
 }
}

function scroll_html(){
 var str = "", tmp = "", b = "", c ="", d = "";
 for(var i=0;i<my_config.banners.length;i++){
   var a = my_config.banners[i]
   str += "<li><a href='"+a.link+"' target='"+a.target+"'><img src='"+a.image+"' width=57 height=40 title='"+a.title+"'></a><h1><a href='"+a.link+"' >"+a.title+"</a></h1></li>";
 }
 if (my_config.direction == "left" || my_config.direction == "right"){
  b = "<div id=slider_scroller style='float: left; width: 800%'>";
  c = " style='float: left'";
  d = "</div>";
 }
 tmp += "<div id=slider_box onmouseover='do_stop()' onmouseout='do_move()' style='overflow:hidden; width:"+my_config.width+"px; height:"+my_config.height+"px'>";
 tmp += b + "<div id=slider_box_1"+c+">" + str;
 tmp += "</div><div id=slider_box_2"+c+">"+d+"</div></div>";
 document.getElementById("slider_show").innerHTML = tmp;
}

function do_left() {my_config.direction='left'}
function do_right() {my_config.direction='right'}
function do_stop() {my_config.scroll=0}
function do_move() {my_config.scroll=1}

function do_timer(){
 with(my_config){ 
  if (scroll) {
   if (direction == "top"){
    if (slider_2.offsetTop-slider.scrollTop<=0){ slider.scrollTop-=slider_1.offsetHeight }
    else {slider.scrollTop++}
   } else if(direction == "down"){
    if (slider_1.offsetTop-slider.scrollTop>=0) slider.scrollTop+=slider_2.offsetHeight
    else {slider.scrollTop--}
   } else if (direction == "left"){
    if (slider_2.offsetWidth-slider.scrollLeft<=0) slider.scrollLeft-=slider_1.offsetWidth
    else {slider.scrollLeft++;}
   } else if (direction == "right"){
    if (slider.scrollLeft<=0) slider.scrollLeft+=slider_2.offsetWidth
    else {slider.scrollLeft--}
   }
  }
 }
}

function play_game (type){
 if (my_config.timer) clearInterval(my_config.timer);
 var direction = type;
 var obj = new autoScroll(type);
 obj.add_banner("products/uspcharcoal6oz.gif","item.php?ca_id=1&it_id=1","USP Charcoal<br>6 Oz powder","_top");
 obj.add_banner("products/actcharcoal28oz.gif","item.php?ca_id=1&it_id=2","Act. Charcoal<br>28 Oz Powder","_top");
 obj.add_banner("products/sugarcoated100ct.gif","item.php?ca_id=1&it_id=3","Sugar-coated<br>Charcoal 100 tablets","_top");
 obj.add_banner("products/uspcharcoal130ct.gif","item.php?ca_id=1&it_id=4","USP Charcoal<br>130 tablets","_top");
 obj.add_banner("products/uspcharcoal360ct.gif","item.php?ca_id=1&it_id=5","USP Charcoal<br>360 tablets","_top");
 obj.add_banner("products/uspcharcoal125caps.gif","item.php?ca_id=1&it_id=6","USP Charcoal<br>125 vegecaps","_top");
 obj.add_banner("products/granularact5lbs.gif","item.php?ca_id=1&it_id=7","Granular Act.<br>Charcoal 5 lbs","_top");
 obj.add_banner("products/eyepad.gif","item.php?ca_id=1&it_id=8","Act Charcoal<br>Eye Pad","_top");
 obj.add_banner("products/mattresspad.gif","item.php?ca_id=1&it_id=9","Bamboo Charcoal<br>Mattress Pad","_top");
 obj.add_banner("products/pillow.gif","item.php?ca_id=1&it_id=10","Act Charcoal<br>Pillow","_top");
 obj.play();
}
