function getIndicator(){
    return new Template('<img src="'+myConfig['indicator']+'" alt="loading" style="background-color: white; border: 1px solid black;" />').evaluate(new Object());
}

function toggleDialog(content, keepAlive, namespace){
    namespace = namespace ? namespace : 'default';
    contentContainerId = 'dialog'+namespace+'container';
    backgroundContainerId = 'dialog'+namespace+'background';
    if(!$(backgroundContainerId) || keepAlive){
        if(!$(backgroundContainerId)){
            bg = new Element('div');
            bg.id = backgroundContainerId;
            bg.className = 'dialogBackground';
            bg.observe('click', function(){toggleDialog('', false, namespace)});
            $$('body')[0].appendChild(bg);
        }
        if(!$(contentContainerId)){
            contentContainer = new Element('div');
            contentContainer.id=contentContainerId;
            contentContainer.className='dialogContainer';
            contentContainer.style.position='fixed';
            $$('body')[0].appendChild(contentContainer);
        }
        if(content){
            contentContainer.innerHTML = content;
            centerElement(contentContainerId);
        }
    } else {
        $(contentContainerId).remove();
        $(backgroundContainerId).remove();
    }
}


function submitPagingForm(url, namespace, dialogCall){
    namespace = namespace ? namespace : 'default';
    var content = getIndicator();
    target = dialogCall ? 'dialog'+namespace+'container' : namespace;
    new Ajax.Updater(target, url, {
                parameters: $('pagingForm_'+namespace).serialize(), 
                asynchronous:true, 
                evalScripts:true, 
                onComplete:function(request, json){
                    if(!dialogCall){
                        toggleDialog('', false, namespace);
                    }
                }, 
                onLoading:function(request, json){
                    toggleDialog(content, true, namespace);
                }
    });
}

function setupPagingForm(page, options, namespace){
    $('page_'+namespace).value=page;
    if(options){
        options = options.evalJSON(true);
        for(key in options){
            input = new Element('input');
            input.type='hidden';
            input.name=key;
            input.value=options[key];
            $('pagingForm_'+namespace).appendChild(input);
        }
    }
    $('pagingSubmit_'+namespace).click();
}

function openDialog(url, params, namespace){
    namespace = namespace ? namespace : 'default';
    new Ajax.Updater('dialog'+namespace+'container', url, {
                parameters: {'json':params}, 
                asynchronous:true, 
                evalScripts:true, 
                onLoading: function(){
                    toggleDialog(getIndicator(), true, namespace);
                },
                onComplete: function(){
                    centerElement('dialog'+namespace+'container');
                }
    });
}

function centerElement(elementId){
    if(window.innerHeight){
        windowHeight = window.innerHeight;
    } else {
        windowHeight = document.documentElement.clientHeight;
    }
    
    if($(elementId).style.position == 'absolute'){
        $(elementId).style.top = parseInt(document.viewport.getScrollOffsets().top + ((windowHeight - $(elementId).getHeight()) / 2))+'px';
    } else if($(elementId).style.position == 'fixed'){
        $(elementId).style.top = parseInt((windowHeight - $(elementId).getHeight()) / 2)+'px';
    }
}