function $(id) {
 return document.getElementById(id);
}
function addLoadEvent(func){
 var oldonload = window.onload;
 if (typeof window.onload != 'function') {
  window.onload = func;
 } else {
  window.onload = function(){
   oldonload();
   func();
  }
 }
}
function addOnLoadEvent(invoker, func){
 var oldonload = window.onload;
 if (typeof window.onload != 'function') {
  window.onload = function() {
   func.apply(invoker);
  }
 } else {
  window.onload = function(){
   oldonload();
   func.apply(invoker);
  }
 }
}

Array.prototype.contains = function(_val) {
 for (var i = 0; i < this.length; i++) {
  if (this[i] == _val) {
   return true;
  }
 }
 return false;
}

var cusSetTimeout = function(invoker, fRef, mDelay) {
 if (typeof fRef == "function") {
  var argu = Array.prototype.slice.call(arguments, 3);
  var f = (function() {
   fRef.apply(invoker, argu);
  });
  return setTimeout(f, mDelay); // window.setTimeout原来有返回值，这里重写也应该返回
 }
 return setTimeout(fRef, mDelay); // 相当于setTimeout("test()", timeout);
}
/**
 * 增加一个扩展window.setInterval的函数
 */
var cusSetInterval = function(invoker, fRef, mDelay) {
 if (typeof fRef == "function") {
  var argu = Array.prototype.slice.call(arguments, 4);
  var f = (function() {
   fRef.apply(invoker, argu);
  });
  return setInterval(f, mDelay); 
 }
 return setInterval(fRef, mDelay); 
}

function FocusPicture(fname, ifocus, ifocus_piclist, ifocus_btn, normal, current, imageHeight, maxCurrentNum, autoChangeInterval) {
 this.instanceName = fname; 
 this.ifocus = ifocus ? ifocus : "ifocus"; 
 this.ifocusPicList = ifocus_piclist ? ifocus_piclist : "ifocus_piclist"; 
 this.ifocusBtn = ifocus_btn ? ifocus_btn : "ifocus_btn"; 
 this.normalClassName = normal ? normal : "normal"; 
 this.currentClassName = current ? current : "current"; 
 this.imageHeight = imageHeight ? imageHeight : 80;
 this.maxCurrentNum = maxCurrentNum ? maxCurrentNum : 4; 
 this.autoChangeInterval = autoChangeInterval ? autoChangeInterval : 4000; 
 this.isAutoChange = true; 
 this.slideSpeed = 10; 
 this.invokeInterval = 5; 
 this.setIsAutoChange = function(flag) {
  this.isAutoChange = flag;
 }

 this.moveElement = function(elementID, final_x, final_y) {
  if (!document.getElementById)
   return false;
  if (!document.getElementById(elementID))
   return false;
  var elem = document.getElementById(elementID); 
  if (elem.movement) {
   clearTimeout(elem.movement);
  } 
  if (!elem.style.left) {
   elem.style.left = "0px";
  } 
  if (!elem.style.top) {
   elem.style.top = "0px";
  } 
  var xpos = parseInt(elem.style.left);
  var ypos = parseInt(elem.style.top);  
  if (xpos == final_x && ypos == final_y) {
   return true;
  }
  if (xpos < final_x) {
   var dist = Math.ceil((final_x - xpos) / this.slideSpeed);
   xpos = xpos + dist;
  } 
  if (xpos > final_x) {
   var dist = Math.ceil((xpos - final_x) / this.slideSpeed);
   xpos = xpos - dist;
  } 
  if (ypos < final_y) {
   var dist = Math.ceil((final_y - ypos) / this.slideSpeed);
   ypos = ypos + dist;
  } 
  if (ypos > final_y) {
   var dist = Math.ceil((ypos - final_y) / this.slideSpeed);
   ypos = ypos - dist;
  } 
  elem.style.left = xpos + "px";
  elem.style.top = ypos + "px";  
  elem.movement = cusSetTimeout(this, this.moveElement, this.invokeInterval, elementID, final_x, final_y);
 } 

 this.classNormal = function(iFocusBtnID){
  var iFocusBtns= $(iFocusBtnID).getElementsByTagName('li'); 
  for(var i=0; i < iFocusBtns.length; i++) { 
   iFocusBtns[i].className = this.normalClassName;
  }
 }

 this.classCurrent = function(iFocusBtnID, n){
 	  // alert(n)
 	  //alert(this.maxCurrentNum)
  
 	 // console.log(n)
 	  
  if (n >= this.maxCurrentNum)
  {
  	console.log(this.maxCurrentNum)
   n = this.maxCurrentNum ;
  }
  var iFocusBtns= $(iFocusBtnID).getElementsByTagName('li');
 // alert(iFocusBtns)
  iFocusBtns[n].className = this.currentClassName;
  
 }

 this.iFocusChange = function() {

  if (!$(this.ifocus))
   return false;

  var instance = eval(this.instanceName);
  $(this.ifocus).instance = instance;

  $(this.ifocus).onmouseover = function() {
   this.instance.setIsAutoChange(false);
  };

  $(this.ifocus).onmouseout = function() {
   this.instance.setIsAutoChange(true);
  };
  var iFocusBtns = $(this.ifocusBtn).getElementsByTagName('li');
  var listLength = iFocusBtns.length;
  this.maxCurrentNum = listLength -1
  iFocusBtns[0].instance = instance;
  iFocusBtns[0].ifocusPicList = this.ifocusPicList;
  iFocusBtns[0].ifocusBtn = this.ifocusBtn;
  iFocusBtns[0].onmouseover = function() {
   this.instance.moveElement(this.ifocusPicList, 0, 0, 5);
   this.instance.classNormal(this.ifocusBtn);
   this.instance.classCurrent(this.ifocusBtn, 0);
  }
  for (var i = 1; i < listLength; i++) {
   iFocusBtns[i].instance = instance;
   iFocusBtns[i].ifocusPicList = this.ifocusPicList;
   iFocusBtns[i].ifocusBtn = this.ifocusBtn;
   iFocusBtns[i].value = i;
   iFocusBtns[i].yAxis = -i * this.imageHeight;
   iFocusBtns[i].onmouseover = function() {
    this.instance.moveElement(this.ifocusPicList, 0, this.yAxis);
    this.instance.classNormal(this.ifocusBtn);
   
    this.instance.classCurrent(this.ifocusBtn, this.value); 
   }
  }
 }

 this.autoiFocus = function() {
  if(!$(this.ifocus)) return false;

  if (!this.isAutoChange) return false;  

  var focusBtnList = $(this.ifocusBtn).getElementsByTagName('li');
  var listLength = focusBtnList.length; 
 
  var currentNum=0;
 
  for (var i = 0; i < listLength; i++) {
   if (focusBtnList[i].className == this.currentClassName) {
    currentNum = i;
    break;
   }
  }  
  //console.log("currentNum:"+currentNum);
  //console.log("currentNum:"+this.maxCurrentNum);
  
  if (currentNum == this.maxCurrentNum-1 )
  {
   this.moveElement(this.ifocusPicList, 0, 0);
   this.classNormal(this.ifocusBtn);
   this.classCurrent(this.ifocusBtn, 0);
  }
  else
  { 
   this.moveElement(this.ifocusPicList, 0, -(currentNum + 1) * this.imageHeight);
   this.classNormal(this.ifocusBtn); 
   this.classCurrent(this.ifocusBtn, currentNum + 1);
  }
 }

 this.startAutoChange = function() {
  cusSetInterval(this, this.autoiFocus, this.autoChangeInterval);
 }
}

var focusPictureC = new FocusPicture("focusPictureC", "ifocus2", "ifocus_piclist2", "ifocus_btn2", "normal", "current", "215", "3", "5000");
focusPictureC.startAutoChange();
addOnLoadEvent(focusPictureC, focusPictureC.iFocusChange);