
(function($){
		

var visual = {};

var xmldataSet;

$(window).load(function(){
$.ajax( {
type : "GET",
url : "top_visual/xml/visual.xml?"+ new Date().getTime(),
dataType : "xml",
timeout: 1000,
success : function(data){
visual.init(data);
}
});
});



visual.init = function(data){
	
	var imp = $('#impression');
	var mmi = $('#main-images');
	var btns = [];
	var btn = $('<div id="main-btn"><ul></ul></div>');
		
	visual.imgW = mmi.find('img').width();
	visual.imgH = mmi.find('img').height();
	
	mmi.css({'width':visual.imgW,'height':visual.imgH});
	imp.css({'width':visual.imgW,'height':visual.imgH});
	
	visual.width2_3 = Math.floor(visual.imgW/3)*2;
	
	var imgset = $(data).find('impression').get();
	visual.maxImg = parseInt(imgset[0].getAttribute('maxImage'),10);
	visual.delay = parseInt(imgset[0].getAttribute('delay'),10)*1000;
	visual.loop  = imgset[0].getAttribute('loopFlag')
	
	visual.defclip = 'rect(0px '+ visual.imgW + 'px ' + visual.imgH  + 'px 0px)';

	$(data).find('img').each(function(index){
	
	if(index >= visual.maxImg && visual.maxImg != null) return;
	
	if(this.getAttribute('href')){
	
	if(this.getAttribute('target')) var targetnum = this.getAttribute('target');
	else var targetnum = '_self';
		
	var pimg = $('<p><a href="'+this.getAttribute('href')+'" target="'+targetnum+'"><img src="'+this.getAttribute('src') +'" alt="'+ this.getAttribute('alt') +'" /></a></p>');
	
	}else{
	var pimg = $('<p><img src="'+this.getAttribute('src') +'" alt="'+ this.getAttribute('alt') +'" /></p>');
	}
	
	
	
	if(index == 0) pimg.css({'zIndex':100,'clip':visual.defclip,'position':'absolute'});
	else pimg.css({'zIndex':80,'clip':visual.defclip,'display':'none','position':'absolute'});
	
	mmi.append(pimg);
	
	if((index+1) < 10) ii = '0' + (index+1);
	else ii = index+1;
	
	if(index==0) var litag = $('<li class="stay"><span class="over">&nbsp;</span></li>');
	else var litag = $('<li><span>&nbsp;</span></li>');
	litag.click(visual.elmcl);
	
	litag.mouseover(function(){ $(this).children().addClass('over'); });
	litag.mouseout(function(){ if(this.className != 'stay') $(this).children().removeClass('over'); });
	
	btn.children().append(litag);
	
	});
		
	btn.css('width',$(data).find('img').length*63);

	mmi.after(btn);
	mmi.find('p:first').remove();


	visual.elm = mmi.find('p').get();
	visual.elmbtn = btn.find('span').get();
	visual.elmbtn2();
	
	var nextfunc = function(){
	visual.elmani2();
	}
	
}					  


var j2=0;
var prevpos = 0;

visual.autoFlg = true;

visual.elmani2 = function(){
	
	if(visual.endFlg) return;
	
	visual.endFlg = true;	
	
	visual.elm[j2].style.display = 'block';
	visual.elm[j2].style.zIndex = 100;
	
	if(j2 == (visual.elm.length-1)){
	
	visual.elm[0].style.display = 'block';
	$(visual.elm[0]).css('opacity','1');
	$(visual.elm[0]).css({'clip':visual.defclip,'left':0});
	$(visual.elmbtn[visual.elmbtn.length-1]).removeClass('over');
	$(visual.elmbtn[visual.elmbtn.length-1]).parent().removeClass('stay');
	$(visual.elmbtn[0]).addClass('over');
	$(visual.elmbtn[0]).parent().addClass('stay');
	}else{
	visual.elm[j2+1].style.display = 'block';
	$(visual.elm[j2+1]).css('opacity','1');
	$(visual.elm[j2+1]).css({'clip':visual.defclip,'left':0});
	$(visual.elmbtn[j2]).removeClass('over');
	$(visual.elmbtn[j2]).parent().removeClass('stay');
	$(visual.elmbtn[j2+1]).addClass('over');
	$(visual.elmbtn[j2+1]).parent().addClass('stay');
	}
	
	
	new ukk.Effect.Fade(visual.elm[j2],[100,0,1200,70]);																	 																	 
	new ukk.Effect.Clip(visual.elm[j2],[0,visual.imgW,visual.imgH,visual.imgW,1200,70],[function(){
	visual.elm[j2].style.zIndex = 90;
	visual.elm[j2].style.display = 'none';
	j2++
	if(j2 == (visual.elm.length)){
		j2=0;
		if(visual.loop == '0') visual.loopfix = true;
	}
	
	prevpos = j2;
	
	visual.endFlg = false;
		
	if(visual.autoFlg) {
		clearTimeout(visual.time);
		if(!visual.loopfix) visual.time = setTimeout(visual.elmani2,visual.delay);
	}
	},0]);

//new ukk.Effect.Move(visual.elm[j2],[500,0,800,-70]);
	

}

visual.elmbtn2 = function(){

var i=0;

var loopfunc = function(){
if(i>=visual.elmbtn.length) {
	clearInterval(settime);
	setTimeout(visual.elmani2,5000);
	return;
}
$(visual.elmbtn[i]).css({'visibility':'visible','opacity':'0'});
new ukk.Effect.Fade(visual.elmbtn[i],[0,100,1000,70]);
//new ukk.Effect.Move(visual.elmbtn[i],[,-50,500,100]);
i++;
}

var settime = setInterval(loopfunc,200);

}



visual.elmcl = function(){
	
	if(visual.endFlg) return;
	if(this.className == 'stay') return;
	clearTimeout(visual.time);
	visual.endFlg = true;
	
	$(this).parents('ul').find('.stay .over').removeClass('over');
	$(this).parents('ul').find('.stay').removeClass('stay');
	
	this.className = 'stay'
	
	j2 =  $('#main-btn li').index(this);
	
	visual.autoFlg = false;
	var visp_st = visual.elm[prevpos].style;
	var visj_st = visual.elm[j2].style;
	
	visj_st.display = 'block';
	visp_st.display = 'block';
	visp_st.zIndex = 100;
	visj_st.zIndex = 90;
	$(visual.elm[j2]).css({'clip':visual.defclip,'left':0,'opacity':1});
	$(visual.elm[prevpos]).css({'clip':visual.defclip,'left':0});
	
	new ukk.Effect.Fade(visual.elm[prevpos],[100,0,1200,70]);
	new ukk.Effect.Clip(visual.elm[prevpos],[0,visual.imgW,visual.imgH,visual.imgW,1200,70],[function(){
	visp_st.zIndex = 80;
	visj_st.zIndex = 100;
	visp_st.display = 'none';
	prevpos = j2;
	visual.endFlg = false;
	},0]);
	visual.autoFlg = true;
	if(!visual.loopfix) visual.time = setTimeout(visual.elmani2,10000);
}


})(jq132);
