/**
 *
 * $(function(){
 * 	lala = new loadingOverlay ({
 * 		base_obj: 'some_id',
 * 		background: { css: 'white', opacity: 0.78 },
 * 		loading_img: { image: 'loading_img.gif', width: 32, height: 32 }
 * 	}) ;
 * }) ;
 *
 * flobu . enable () ;
 * flobu . disable () ;
 *
 **/
$(document).ready(function() {
//	$('.left-menu a, .top-menu li div a').click(function(){
//		var parent = $(this).parent('li');
//		if (parent.children('ul').length > 0) {
//			parent.children('ul').slideToggle(300);
//			parent.toggleClass('active');
//			return false;
//		}
//	});

	var left = $('.top-menu>table td>div').position().left;
	$('.top-menu>table td>div').each(function(){
		var parent = $(this).parent('td');
		var btn = $(parent).find('a,span').first();
		if (!btn) {
			btn = $(this).parent('td');
		}
		var pad = btn ? parseInt(btn.css('margin-left')) : 0;

		var left0 = parent.position().left;
		var w0 = btn.width();
		var w1 = $(this).outerWidth();

		if (w1 > w0) {
			$(this).css('left', (left0 + (w0 - w1) / 2));
		} else {
			$(this).css('width', w0);
			$(this).css('left', left0 + pad/2);
		}
	});
});


var loadingOverlay = function ( options ) {

	// begin: define defaults
	this . defaults = {
		base_obj: null, // which (jquery-)object to block
		container_id: 'loading_overlay_container',
		fade_speed: 100,
		zindex: 5000,
		css: {background: 'white', opacity: 0.4},
		loading_img: {image: 'loading_img.gif', width: 'auto', height: 'auto'},
		show_overlay: 1
	} ;
	// end: define defaults

	// begin: add some timestamp to the id to make it quite unique
	var t = new Date () ;
	this . defaults . container_id += '_' + t . getTime () ;
	// end: add some timestamp to the id to make it quite unique

	// begin: setup container vars
	jQuery . extend ( this . defaults, options ) ;
	jQuery . extend ( this, this . defaults ) ;
	// end: setup container vars

	// begin: preload images
	this.preload_image = $( '<img src="' + this . loading_img . image + '" />' ) ;
	if ( this . loading_img . width == 'auto' || this . loading_img . width == undefined )
		this . loading_img . width = this.preload_image . get ( 0 ) . width ;
	if ( this . loading_img . height == 'auto' || this . loading_img . height == undefined )
		this . loading_img . height = this.preload_image . get ( 0 ) . height ;
	// end: preload images


        this.container = $( '<div></div>' ) ;
        this.container . attr ( 'id', this . container_id ) ;
        this.container . css ({
            position: 'absolute',
            'z-index': this . zindex,
            overflow: 'hidden',
            display: 'none',
			'text-align' : 'left'
        }) ;
        if (this.show_overlay) {
            this.container . css ({
                background: this . css . background,
                opacity: this . css . opacity
            }) ;
        }
        this.preload_image . css ({
                position: 'relative',
                left: '50%',
                top: '50%',
				'margin-left': '-'+this . loading_img.width+'px',
				'margin-top': '-'+this . loading_img.height+'px',
				display: 'none'
        }) ;
        this.container . append ( this.preload_image ) ;
        $( 'body' ) . append ( this.container ) ;

	// show loading_img
	this . enable = function ()
	{
			var p = $('#'+this.base_obj);
            var pos = p . offset () ;
			var loading_img = this.preload_image;
            this.container . css ({
                    top: parseInt(pos.top) + 'px',
                    left: parseInt(pos.left) + 'px',
                    width: p . outerWidth()+'px',
                    height: p . outerHeight()+'px'
            }) ;
            this.container . fadeIn ( this . fade_speed, function() {
				if ($(this).css('display') != 'none')
					loading_img.show();
			});
	}

	// hide
	this . disable = function ()
	{
			this.preload_image.hide()
            this.container.hide();
	}
}