var cur = 0;
var imgs = [];
var tips = [];
var curtain;
var dic = {};
var ischanging = false;
var sw;
var sh;
var th;
var changertimer;
$(document).ready(function(){
	$('#main div.topic').each(function(){
		var img = $(this).find('img');
		if (!img.length) return true;
		dic[$(img).attr('src').replace(/[\w\-\.]+\//g,'')] = imgs.length;
		imgs.push({'src':$(img).attr('src'),'width':$(img).attr('width'),'height':$(img).attr('height')});
		$(this).find('img').remove();
		var tip = '';
		$(this).find('p').each(function(){
			tip += $(this).html();
		});
		tips.push(tip);
	});
	$('#main div.topic').remove();
	$('#backimage').append('<img src="'+imgs[cur]['src']+'" alt="" />');
	var apnd = '';
	for (var i=0;i<imgs.length;i++) {
		var src = imgs[i]['src'].replace(/\.(\w+)$/,'-120x90.$1');
		apnd += '<div class="thumbs" ind="'+i+'" id="thumb'+i+'"><img src="'+src+'" alt="" /></div>';
	}
	$('#thumbsslide').append(apnd);
	//$('#pulldockarea,#thumbsslide').mouseover(slideUp).mouseout(slideDown);
	//setTimeout(slideDown,3000);

	//setInterval(slider,50);
	changertimer = setInterval(changer,5000);
	resize();
	//$('#thumbsslide').css({'top':(th+2)+'px'});
	//$('#pulldock').css({'top':(th+2)+'px'});
});
$(window).resize(resize);

function resize() {
	sw = $('#backimage').width();
	sh = $('#backimage').height();
	var height;
	var width;
	if (sw/sh>imgs[cur]['width']/imgs[cur]['height']) {
		width = sw;
		height = imgs[cur]['height'] * sw / imgs[cur]['width'];
	} else {
		height = sh;
		width = imgs[cur]['width'] * sh / imgs[cur]['height'];
	}
	//$('#backimage img').css({'width':width+'px','height':height+'px','left':((sw - width) /2)+'px','top':((sh - height) /2)+'px'});
	$('#backimage img').css({'width':width+'px','height':height+'px','left':((sw - width) /2)+'px','top':'0px'});
	$('#logo').css('top',(sh/2)+'px');
	$('#thumbsslide div.thumbs').css({'width':(sw/12)+'px'}).find('img').css({'width':(sw/12)+'px'});
	//th = imgs[cur]['height'] * sw/12 / imgs[cur]['width'];
	th = imgs[0]['height'] * sw/12 / imgs[0]['width'];
	//$('#footer').css('top',(sh-th)+'px');
	$('#footer').css('top',(sh-th-17)+'px');
	$('#thumbsslide').css({'height':(th+1)+'px'});
	//$('#thumbsslide div.thumbs').css({cursor:'pointer'}).each(function(){
		//tp=th/2;
		//if ($(this).find('img').attr('src') == imgs[cur]['src']) tp = 1;
		//$(this).css({'top':tp+'px','height':th+'px'}).unbind('mouseover').unbind('mouseout').unbind('click').mouseover(function(){
		//	$(this).animate({'top':'1px'},300);
		//}).mouseout(function(){
		//	if ($(this).attr('ind')==cur) return;
		//	$(this).animate({'top':tp+'px'},300);
		//}).click(function(){
		//	changeImage($(this).attr('ind'));
		//});
		//$(this).css({'height':(th+1)+'px'}).unbind('click').click(function(){
		//	changeImage($(this).attr('ind'));
		//});
		//if ($(this).attr('ind')==cur) $(this).animate({'top':'1px'},300);
	//});
	$('#info').css('top',(sh-150)+'px').html('<span>'+tips[cur]+'</span>');
}
function changeImage(next) {
	if (ischanging) return;
	clearInterval(changertimer);
	changertimer = setInterval(changer,5000);
	ischanging = true;
//        var style = 'width:'+$('#backimage img').width()+'px;height:'+$('#backimage img').height()+'px;position:absolute;top:'+$('#backimage img').css('top')+';left:'+$('#backimage img').css('left')+';z-index:1';
//        $('body').append('<img src="'+imgs[cur]['src']+'" alt="" style=style id="trnd" />');
	$('body').append('<img src="'+imgs[cur]['src']+'" alt="" style="width:'+$('#backimage img').width()+'px;height:'+$('#backimage img').height()+'px;position:absolute;top:'+$('#backimage img').css('top')+';left:'+$('#backimage img').css('left')+';z-index:1;" id="trnd" />');
	var src = imgs[next]['src'];
	$('#backimage img').attr('src',src);

	$('#trnd').fadeOut('slow',function(){
//        if( $('#trnd').animate({opacity:'toggle'},1200,function(){
//        setTimeout(fadeout,40);
//    fadeout();
		$(this).remove();
		if ($('#trnd').length) $('#trnd').remove();
	});
	cur = next;
	resize();
	ischanging = false;
}
function changer() {
	num = parseInt(cur)+1;
	if (num>imgs.length-1) num=0;
	changeImage(num);
}
/*
function fadeout(){

//    var i = $('#trnd').css('opacity')-0.2;
//    $('#trnd').css('opacity',i);
//    for( ;; ){
	if($('#trnd').css('opacity')>0.1){
//	    i -= 0.01
	    $('#trnd').transitionAnimate({'opacity':'0'},'600ms','linear');

//	    setTimeout(fadeout,40);
//	}else{
//	    break;
	}else{
		$(this).remove();
	    console.log($(this));
		if ($('#trnd').length) $('#trnd').remove();
	}
//    }

}
*/
//var slidex = 0;
//function slider() {
//	slidex -= 2;
//	$('#thumbsslide').css('left',slidex+'px');
//	var fw = $('#thumbsslide div:first').width();
//	if (slidex+fw<0) {
//		$('#thumbsslide div:first').clone(true).appendTo('#thumbsslide');
//		$('#thumbsslide div:first').remove();
//		slidex += fw;
//		$('#thumbsslide').css('left',slidex+'px');
//	}
//}
//var slidetimer;
//function slideUp() {
//	//clearTimeout(slidetimer);
//	$('#thumbsslide').stop().animate({'top':'1px'});
//	$('#pulldock').stop().animate({'top':'0px'});
//}
//function slideOut() {
//	slidetimer = setTimeout(slideDown,3000);
//}
//function slideDown(){
//	$('#thumbsslide').stop().animate({'top':(th+2)+'px'});
//	$('#pulldock').stop().animate({'top':(th+2)+'px'});
//}