var image = {
	data: [{src:'',action:'',title:''}],
	width: 740, height: 290, current: 0, time: 5000, object: null,
	change:function(obj){
		image.stop();
		image.current = obj.value;
		image.play();
	},
	stop:function(){
		//clearInterval(autoPlay);
	},
	run:function(obj){
		if(obj) image.object = obj;
		image.play(image.object);
		//autoPlay = setInterval("image.play()", image.time);
	},
	play:function(){
		var html = '';
		image.object.style.height = image.height + 'px';
		image.object.style.width = image.width + 'px';
		image.object.style.background = 'url('+image.data[image.current].src+') repeat-x left top';
		image.data.each(function(e, i){
			if(i == image.current)
				html += '<li value="'+i+'" class="current" style="width: '+(100/image.data.length)+'%;">'+e.title+'</li>';
			else
				html += '<li value="'+i+'" onmouseover="javascript: image.change(this);" style="width: '+(100/image.data.length)+'%;">'+e.title+'</li>';
		});
		html = '<a href="'+image.data[image.current].action+'" target="_blank" style="height: '+(image.height-30)+'px;"></a><ul>'+html+'</ul><div style="clear: both;"></div>';
		image.object.innerHTML = html;
		if(image.current<this.data.length-1) image.current++; else image.current = 0;
	}
	
}




var defaultOpts = { interval: 5000, fadeInTime: 300, fadeOutTime: 200 };
var _titles = $$("ul.slide-txt li");
var _titles_bg = $$("ul.op li");
var _bodies = $$("ul.slide-pic li");
var _count = _titles.length;
var _current = 0;
var _intervalID = null;
var stop = function() { window.clearInterval(_intervalID); };
var slide = function(opts) {
	if (opts) {
		_current = opts.current || 0;
	} else {
		_current = (_current >= (_count - 1)) ? 0 : (++_current);
	};
	_bodies.each(function(sitem, index){if(_current == index) sitem.addClass('cur');else if(sitem.hasClass('cur'))sitem.removeClass('cur');});
	_titles.each(function(sitem, index){if(_current == index) sitem.addClass('cur');else if(sitem.hasClass('cur'))sitem.removeClass('cur');});
	_titles_bg.each(function(sitem, index){if(_current == index) sitem.addClass('cur');else if(sitem.hasClass('cur'))sitem.removeClass('cur');});
}; //endof slide
var go = function() {
	stop();
	_intervalID = window.setInterval(function() { slide(); }, defaultOpts.interval);
}; //endof go
var itemMouseOver = function(target, items) {
	stop();
	var i = items.inArray(target);//$.inArray(target, items);
	slide({ current: i });
}; //endof itemMouseOver
_titles.addEvent('mouseover', function(e){if(this.hasClass('cur')){stop();}else{itemMouseOver(this, _titles);go();};});
//_bodies.addEvent('mouseover', function(e){stop();go();});
go();
Array.prototype.inArray = function(value){
	var i;   
	for (i = 0; i < this.length; i++){  
		if (this[i] === value) return i;   
	}  
	return false;  
};


var direction = 'right';
repository = new Array();

repository.push({ img: '/public/images/p0-1.png', url: '840', name: '绅士优雅 黑色底 配色系列', price: '168.00'});
repository.push({ img: '/public/images/p0-2.png', url: '838', name: '蓝 白 格纹 黑色儒雅男士领带', price: '99.00'});
repository.push({ img: '/public/images/p0-3.png', url: '549', name: '男士纯棉长袖衬衫 黑色底白色细条纹 经典绅士款 常规版', price: '78.00'});
repository.push({ img: '/public/images/p0-4.png', url: '843', name: '热情活力 红色 条纹 配色系列', price: '168.00'});
repository.push({ img: '/public/images/p0-5.png', url: '815', name: '纯棉 红黑蓝三色 格纹 短裤', price: '29.90'});
repository.push({ img: '/public/images/p0-6.png', url: '527', name: '男士纯棉长袖衬衫 黑底浅灰色条纹 经典商务时尚款 常规版', price: '78.00'});
repository.push({ img: '/public/images/p0-7.png', url: '548', name: '男士纯棉长袖衬衫 蔚蓝底细黄条 优雅休闲款 常规版', price: '78.00'});
repository.push({ img: '/public/images/p0-8.png', url: '423', name: '女士纯棉长袖衬衫 白底灰黑色格子 经典职业款', price: '148.00'});
repository.push({ img: '/public/images/p0-9.png', url: '559', name: '男士纯棉免烫 深灰色 商务休闲 长裤', price: '198.00'});
repository.push({ img: '/public/images/p0-10.png', url: '611', name: '女士纯棉长袖衬衫 白底浅黑色条纹 时尚休闲款', price: '148.00'});
repository.push({ img: '/public/images/p0-11.png', url: '781', name: '湖蓝色 圆点 真丝领	带', price: '99.00'});


function initScroll(){
	swapContent();
	scroll();
}

function setDirection(lr){
	direction = lr;
}

function swapContent(){

	if(direction == 'right') {
		repository.reverse();
		a = repository.pop();
		repository.reverse();
		repository.push(a);
	}else{
		a = repository.pop();
		repository.reverse();
		repository.push(a);
		repository.reverse();
	}
	content = '<table width="1184"><tr>';
	for(i=0;i<8;i++){
		if(i < 2){
			content = content + '<td width="148" align="center" onmouseover="setDirection(\'left\');">';
		}else if (i > 3){
			content = content + '<td width="148" align="center" onmouseover="setDirection(\'right\');">';
		}else{
			content = content + '<td width="148" align="center" onmouseover="setDirection(\'stop\');">';
		}
		content = content + '<a href="/?product-'+ repository[i].url + '.html" ';
		content = content + 'class="scrollLink"><img src="' + repository[i].img + '" alt="' + repository[i].name + '" />';
		content = content + '<br />￥' + repository[i].price + '</a></td>';
	}
	content = content + '</tr></table>';
	$E("#mover").innerHTML = content;
}

function scroll() {
//	alert($("#mover").innerHTML);
	offset = 1;
	if(direction == 'right') {
		newPos = parseInt( $E("#mover").style.left ) - offset;
	}else if(direction == 'left'){
		newPos = parseInt( $E("#mover").style.left ) + offset;
	}
	if ( newPos < -222) {
		swapContent();
		newPos = -72;
	}
	if(newPos > -72) {
		swapContent();
		newPos = -222;
	}
		 
	$E("#mover").style.left = newPos + "px";
	window.setTimeout("scroll()", 20);
}