window.addEvent('domready', function() {
	// scroller
		var scroll = new Fx.Scroll('content', { duration: 1000, transition: Fx.Transitions.Quad.easeInOut});		
		var sld_on = new Fx.Slide('frs_hl', {mode: 'horizontal', duration: 500, transition: Fx.Transitions.Expo.easeOut});		
		$('on_in').addEvent('click', function(e){
			sld_on.hide();
			scroll.toElement('y').chain(function(){ 
				sld_on.slideIn();
			});		
		});			
		var sld_tw = new Fx.Slide('scd_hl', {mode: 'horizontal', duration: 200});
		$('tw_in').addEvent('click', function(e){
			sld_tw.hide();
			scroll.toElement('r').chain(function(){ 
				sld_tw.slideIn();
			});		
		});			
		var sld_thr = new Fx.Slide('thd_hl', {mode: 'horizontal', duration: 200});
		$('thr_in').addEvent('click', function(e){
			sld_thr.hide();
			scroll.toElement('u').chain(function(){ 
				sld_thr.slideIn();
			});	
		});		
		var sld_fr = new Fx.Slide('fr_hl', {mode: 'horizontal', duration: 200});
		$('fr_in').addEvent('click', function(e){
			sld_fr.hide(); 
			scroll.toElement('reading').chain(function(){ 
				sld_fr.slideIn();
			});		
		});		
		var sld_fv = new Fx.Slide('fv_hl', {mode: 'horizontal', duration: 200});
		$('fv_in').addEvent('click', function(e){
			sld_fv.hide();
			scroll.toElement('the_url').chain(function(){ 
				sld_fv.slideIn();
			});		
		});

	// appear

	var Site = {
		appearText: function(){
			var timer = 0;
			var sideblocks = $$('#navi li');			
			var slidefxs = [];
			
			sideblocks.each(function(el, i){
				el.setStyle('margin-right', '100px');
				timer += 150;
				slidefxs[i] = new Fx.Style(el, 'margin-right', {
					duration: 300,
					transition: Fx.Transitions.backOut,
					wait: false,
					onComplete: Site.createOver.pass([el, i])
				});
				slidefxs[i].start.delay(timer, slidefxs[i], 0);
			}, this);
		},
		
		createOver: function(el, i){
			var first = el.getFirst();
			if (!first || first.getTag() != 'a') return;
			var overfxs = new Fx.Styles(first, {'duration': 200, 'wait': false});			
			el.mouseouted = true;
			el.addEvent('mouseenter', function(e){
				overfxs.start({
					'margin-right': 1
				});
			});
			el.addEvent('mouseleave', function(e){
				overfxs.start({
					'margin-right': 5
				});
			});
		}
	}; Site.appearText();

	// thumbs
		var fx = [];			
		$$('div.web_thumb').each(function(div, index){
			fx[index] = div.effects({ transition:Fx.Transitions.Back.easeOut, wait: false });
			div.addEvents({
				'mouseenter':  function(){ 
					wait: true;
					fx[index].start({
						'height':'112px',
						'border-color' : ['#FFFFFF', '#888888']
					});	
				},
				'mouseleave':  function(){
					fx[index].start({
						'height': '81px',
						'border-color' : ['#FFFFFF', '#888888']
					});
				}
			});	
		});

	// tips
		var Tips2 = new Tips($$('.tips'), {
			initialize:function(){
				this.fx = new Fx.Style(this.toolTip, 'opacity', {duration: 300, wait: false}).set(0);
			},
			onShow: function(toolTip) { this.fx.start(1); },
			onHide: function(toolTip) { this.fx.start(0); }
		});
		
	// slide imprint
	var mySlide = new Fx.Slide('imprint_text');
	mySlide.hide();
	$('imprint_header').addEvent('click', function(e){
		this.setStyles('background: black; color: white;');
		e = new Event(e);
		mySlide.toggle();
		e.stop();
	});
	$('imprint_header').addEvent('mouseenter', function(){this.setStyles('background: black; color: white;');});	
	$('imprint_header').addEvent('mouseleave', function(){this.setStyles('background: none; color: #999;');});	
	
	$('mobile_link').addEvent('mouseenter', function(){this.setStyles('background: black; color: white;');});	
	$('mobile_link').addEvent('mouseleave', function(){this.setStyles('background: none; color: #999;');});
	
	$('msg_content').addEvent('focus', function(){this.setStyles('background: #999; color: #000;');});
	$('msg_content').addEvent('blur', function(){this.setStyles('background: #000; color: white;');});	
	
	// scroll web
	var wrap = new Fx.Scroll('thumbs_wrap', {
		wait: false,
		duration: 300,
		/*offset: {'x': -200, 'y': -50},*/
		transition: Fx.Transitions.Quad.easeInOut
	});
	
	$('totheleft').addEvent('click', function(event) {
		event = new Event(event).stop();
		wrap.scrollTo(0, 0);
		$('totheleft').setStyle('text-decoration','underline');
		$('totheright').setStyle('text-decoration','none');
	});	
	$('totheright').addEvent('click', function(event) {
		event = new Event(event).stop();
		wrap.scrollTo(595,0);
		$('totheright').setStyle('text-decoration','underline');
		$('totheleft').setStyle('text-decoration','none');
	});

});
