var b = null;
var imageChecker;
var lastOpen = false;

window.addEvent('domready', function() {
	b = $$( "body" )[0];
//	if( Browser.Engine.trident4 ) fixPNG();
	
	$$( "#header LI" ).each( function( link ) {
		link.addEvent( 'mouseover', activate.bind( link ) );
		link.addEvent( 'mouseout', deactivate.bind( link ) );
	} );

	$$( "#header A" ).each( function( link ) {
		link.addEvent( 'mouseover', activate.bind( link ) );
		link.addEvent( 'mouseout', deactivate.bind( link ) );
	} );

	$$( "H2.expand" ).each( function( o ) {
		var area = o.getNext();
		o.addEvent( 'click', expand.bind( area ) );
		var mySlider = new Fx.Slide(o.getNext());
		area.slide = mySlider;
		area.slide.hide();
	} );

	var selectedOpen = false;
	$$( ".topics .selected" ).each( function( o ) {
		o.getParent().getParent().getParent().getParent().getFirst().addClass( "open" );
		if(o.getParent().getParent().slide) {
			o.getParent().getParent().slide.show();
		}
		lastOpen = o.getParent().getParent();
		selectedOpen = true;
	} );

	if( !selectedOpen &&  $$( "H2.expand" )[0] ) {
		$$( "H2.expand" )[0].getNext().getFirst().slide.show();
		lastOpen = $$( "H2.expand" )[0].getNext().getFirst();
		$$( "H2.expand" )[0].addClass( "open" );
	}

});

function expand() {
//	new Fx.Slide(this).toggle();
		if( lastOpen != this ) {
			this.getParent().getParent().getFirst().toggleClass( "open" );
			this.slide.toggle();
			if( lastOpen ) {
				lastOpen.slide.toggle();
				lastOpen.getParent().getParent().getFirst().toggleClass( "open" );
			}
			lastOpen = this;
		}
		else {
			this.slide.toggle();
			this.getParent().getParent().getFirst().toggleClass( "open" );
			lastOpen = false;
		}
}

function openSub( sub, btn ) {
	
	if( $( sub ).hasClass( "show" ) ) return;
	
	$$( "#header .show" ).each( function( e ) {
			e.setStyle( "z-index", 1 );
			if( e.anim ) e.anim.stop();
			var mytrans = new Fx.Styles( e, { duration: 500, transition: Fx.Transitions.Cubic.easeOut, onComplete: function( e ) { e.removeClass( "show" ); } } );
			e.anim = mytrans;
			e.anim.start({
			    'opacity': [1,  0],
			    'top': [168, 131]
			});

	} );
	
	$$( "#navi img" ).each( function( b ) {
		if( b.src.contains( "_selected" ) ) b.src = b.src.split( "_selected" )[0] + ".gif";
	} );
	if( btn.src.contains( "_over" ) ) btn.src = btn.src.split( "_over.gif" )[0] + "_selected.gif";
	else btn.src = btn.src.split( ".gif" )[0] + "_selected.gif";

	if( $(sub).anim ) $(sub).anim.stop();
	var mytrans = new Fx.Styles( sub, { duration: 250, transition: Fx.Transitions.Cubic.easeOut, onStart: function( e ) {
		e.addClass( "show" );
		e.setStyles( { "z-index": 2, "opacity": 1 } );
 	} } );
	$(sub).anim = mytrans;
	mytrans.start({
	    'top': [131, 168]
	});
	

	document.addEvent( "mousemove", function( e ) {
		if( e.clientY > 230 ) {
			document.removeEvents( "mousemove" );

			$(sub).anim.stop();
			e.anim =  new Fx.Styles( $(sub), { duration: 500, transition: Fx.Transitions.Cubic.easeOut, onComplete: function( e ) { e.removeClass( "show" ); } } );
			e.anim.start({
			    'opacity': [1,  0],
			    'top': [168, 131]
			});
			if( btn.src.contains( "_selected" ) ) btn.src = btn.src.split( "_selected" )[0] + ".gif";
		}
	} );
	
}

function openMap( map ) {
	var placeHolder = new Element( "div", {
		'class': 'mapholder',
		'id': 'mapholder'
	} );
	placeHolder.setStyle( "visibility", "hidden" );
	
	placeHolder.closeButton = new Element( "div", {
		'class': "close",
		'style': "cursor: pointer"
	} ).setText( "sulje" );
	placeHolder.closeButton.addEvent( 'click', closeMap );
	
	placeHolder.image = new Element( "img", {
		'src': '/img/kartat/' + map + '.jpg'
	} );

	placeHolder.injectInside( $$("body")[0] );

	placeHolder.closeButton.injectInside( placeHolder );
	placeHolder.image.injectInside( placeHolder );

	imageChecker = ( function() {
		if( this.image.offsetHeight > 0 ) {
			$clear( imageChecker );
			this.setStyles( {
				"top": ( window.getHeight() - this.image.offsetHeight - 20 ) / 2 + window.getScrollTop() + "px",
				"left": ( window.getWidth() - this.image.offsetWidth - 8 ) / 2 + window.getScrollLeft() + "px",
				"visibility": "visible"
			} );
			
/*
			this.setStyles( { "height": "0", "width": "0" } );
			
			new Fx.Styles( this, {} ).start( {
				"top": [window.getHeight() / 2 + window.getScrollTop() + "px", ( window.getHeight() - this.image.offsetHeight - 20 ) / 2 + window.getScrollTop() + "px"],
				"left": [window.getWidth() / 2 + window.getScrollLeft() + "px", ( window.getWidth() - this.image.offsetWidth - 8 ) / 2 + window.getScrollLeft() + "px"],
				"width": [0, this.image.offsetWidth + "px"],
				"height": [0, this.image.offsetHeight + "px"],
				"opacity": [0, 1]
			} );

			new Fx.Styles( this.getLast(), {} ).start( {
				"opacity": [0, 1]
			} );
*/
			this.setStyles( { "visibility": "visible" } );

		}
	} ).periodical( 1, placeHolder );
}

function closeMap( i ) {
	$( 'mapholder' ).remove();
}

function activate( link ) {
	if( this.getFirst().nodeName != "A" ) {
		src = this.getFirst().src;
		if( src.contains( "_selected" ) == false ) this.getFirst().src = src.substr( 0, src.length - 4 ) + "_over" + src.substr( src.length - 4, 4 );
	}
}

function deactivate() {
	if( this.getFirst().nodeName != "A" && this.getFirst().src.contains( "_selected" ) == false ) {
		src = this.getFirst().src.split( "_over" );
		this.getFirst().src = src[0] + src[1];
	}
}