﻿
var walk_dom=function walk(node,func){
	func(node);
	node=node.firstChild;
	while(node){
		walk(node,func);
		node=node.nextSibling;
	}
};
var hasClass=function(o,className){
	var patt=new RegExp("(^|\\s)" + className + "(\\s|$)");
    return patt.test(o.className);
}

var getElementsByClassName=function (o,className){
	var results=[];
	walk_dom(o,function(node){
		var actual=node.nodeType===1 && node.className;
		if(typeof actual==='string' && (hasClass(node,className) || typeof className!=='string')){
			results.push(node);
		}
	});
	return results;
}
var getChildren=function(o){
	var elem=o.firstChild;
	var results=[];
	while(elem){
		if(elem.nodeType==1){
			results.push(elem);
		}
		elem=elem.nextSibling;
	}
	return results;
}
var view={
	timer:1,
	size:0,
	init:function(conf){
		var id=conf.id;
		if(!document.getElementById(id)){
			alert("id: "+id+" 指向的元素不存在！");
			return;
		}
		var v=view[id]={};
		v.id=id;
	
		v.obj=document.getElementById(id);
	
		v.stage=getElementsByClassName(v.obj,"viewStage")[0];
		v.pics=getChildren(v.stage);
		v.size=v.pics.length;
		

		var nav=document.createElement("ul");
		nav.className="viewNav";
		v.obj.appendChild(nav);
		v.nav=getElementsByClassName(v.obj,"viewNav")[0];
		var i=0,html='';
		for(;i<v.size;i++){
			html+='<li><a href="javascript:void(0);">'+parseInt(i+1)+'</a></li>';
		}
		v.nav.innerHTML=html;
	
		v.nums=getChildren(v.nav);

		v.index=parseInt((conf.index||1)-1);
		v.endIndex=v.nums.length-1;
		v.nums[v.index].className="selected";
		v.pics[v.index].style.display="block";
		v.time=conf.time;
		for(i=0; i<=v.endIndex; i++){
			v.nums[i].onmouseover=function(i){
				return function(){
					view._moveTo(id,i);
				};
			}(i)
			v.nums[i].onmouseout=function(i){
				return function(){
					view._start(id);
				};
			}(i);
			v.pics[i].onmouseover=function(){
				view._stop(id);
			}
			v.pics[i].onmouseout=function(){
				view._start(id);
			}
		}
		this._start(id);
	},
	writeStyle:function(){
		document.write(view.style.join(" "));
	},
	_start:function(id){
		var v=this[id];
		var self=this;
		v.timer=setTimeout(function(){self._move(id)},v.time);
	},
	_move:function(id){
		var v=this[id];
		var self=this;
		clearTimeout(v.timer);
		v.nums[v.index].className="";
		v.pics[v.index].style.display="none";
		v.index==v.endIndex?v.index=0:v.index++;
		v.nums[v.index].className="selected";
		v.pics[v.index].style.display="block";
		v.timer=setTimeout(function(){self._move(id)},v.time);
		//alert(v.stage.innerHTML);
	},
	_stop:function(id){
		clearTimeout(this[id]["timer"]);
	},
	_moveTo:function(id,index){
		var v=this[id];
		clearTimeout(v.timer);
		v.nums[v.index].className="";
		v.pics[v.index].style.display="none";
		v.index=index;
		v.nums[v.index].className="selected";
		v.pics[v.index].style.display="block";
	}
}
