/*
 *  Created:     Marzo 2010
 *  Modified:    4 Agosto 2010
 *
 *  Crafted by Emateu
 *  TODO: parametrizar efectos; complementar con jQuery UI; drag&drop y efectos de jQuery UI
 */

function GenericPopout(cfg){
    this.cfg                = null;	
    this.html               = null;
    this.body               = null;
    this.popoutLayer        = null;
    this.popoutWrapper      = null;
    this.docHeight          = null;
    this.ie6                = null;
    this.ie6Layer           = null;
    var _this               = this;

    this.init = function(){
        _this.setCfg(cfg);
        _this.html 		= jQuery("html");
        _this.body 		= jQuery("body");
        _this.docHeight         = jQuery(document).height();
        _this.ie6		= jQuery.browser.msie && jQuery.browser.version.substr(0, 1) < 7;
    };

    this.setupPopout = function(){
        _this.body.append(_this.structure());
        
        _this.popoutBody            = jQuery("#"+_this.cfg.id.popoutBody);
        _this.popoutLayer           = jQuery("#"+_this.cfg.id.popoutLayer);
        _this.popoutWrapper         = jQuery("#"+_this.cfg.id.popoutWrapper);
        _this.ie6Layer              = jQuery("#"+_this.cfg.id.popoutIe6Layer);

        if (!_this.cfg.pageScroll || _this.ie6){
            _this.html.css({
                height      : _this.docHeight+"px",
                overflow    : "hidden"
            });
        }
        if (_this.cfg.verticalAlign){
            _this.verticalAlign();
        }

        if (_this.cfg.opacity < 1) _this.popoutLayer.css("opacity", _this.cfg.opacity);
        _this.popoutLayer.hide();
        _this.popoutWrapper.hide();

        if (_this.ie6){
            _this.ie6Layer.hide();
            _this.popoutWrapper.css("position", "absolute");
        }

        jQuery("#"+_this.cfg.id.popoutClose).click(function(){
            _this.close();
        });
    };

    this.close = function(){
        eval("(_this.popoutWrapper."+_this.cfg.hideFx+"("+_this.cfg.hideFxDelay+"))");
        _this.popoutLayer.hide();

        if (!_this.cfg.pageScroll || _this.ie6){
            _this.html.css({
                height      : "auto",
                overflow    : "auto"
            });
            if (_this.ie6) _this.html.css("overflow-x", "hidden");
        }

        setTimeout(function(){
            _this.popoutLayer.remove();
            _this.popoutWrapper.remove();
            if (_this.ie6){
                _this.ie6Layer.remove();
            }
        },(_this.cfg.hideFxDelay+300));
    };

    this.show = function(html, clase, node){
        _this.setupPopout();
        var data = "";
        if (node != null){
            data = jQuery(html).find(node).html();
        } else {
            data = html;            
        }
        if (clase != null){
            _this.popoutWrapper.addClass(clase);
        }
        _this.popoutBody.html(data);

        if (_this.ie6){
            jQuery("#"+_this.cfg.id.popoutIe6Layer).show();
        }
        _this.popoutLayer.show();
        eval("(_this.popoutWrapper."+_this.cfg.showFx+"("+_this.cfg.showFxDelay+"))");
        //_this.popoutWrapper.fadeIn(_this.cfg.showFxDelay);
    };

    this.structure = function(){
        var html =  '\
                    <div id="'+_this.cfg.id.popoutLayer+'" style="height:'+_this.docHeight+'px; position: absolute; z-index:99998; top: 0; left:0; width:100%;"></div>\
                    <div id="'+_this.cfg.id.popoutWrapper+'" style="position:'+_this.cfg.position+'; z-index: 99999; top: 0; left: 0; width: 100%;">\
                        <div id="'+_this.cfg.id.popoutBox+'">\
                            <div id="'+_this.cfg.id.popoutHeader+'">\
                                <div id="'+_this.cfg.id.popoutClose+'" title="'+_this.cfg.closeText+'">'+_this.cfg.closeText+'</div>\
                            </div>\
                            <div id="'+_this.cfg.id.popoutBody+'"></div>\
                        </div>\
                    </div>\
            ';

        if (_this.ie6){
            _this.body.append("<iframe id='"+_this.cfg.id.popoutIe6Layer+"' src='javascript:false;' scrolling='no' frameborder='0' style='width: 100%; height: " +_this.doc_height+ "px; position:absolute; top:0; left:0; z-index:997;  filter: alpha(opacity=0);' />")
        }

        return html;
    };

    this.verticalAlign = function(){
        var _window         = jQuery(window);
        var doc_height      = _window.height();
        var pop_height      = _this.popoutWrapper.height();
        var y_position      = 0;
        if (_this.cfg.position == "absolute"){
            y_position      = parseInt((doc_height-pop_height)/2+_window.scrollTop());
        } else {
            y_position      = parseInt((doc_height-pop_height)/2);
        }
        y_position -= 20;
        _this.popoutWrapper.css("padding-top", y_position+"px");
    }
    
    this.setCfg = function(cfg){
        if (cfg == null) cfg = {};
        _this.cfg = {
            verticalAlign   : (cfg.verticalAlign != null)   ? cfg.verticalAlign : true,
            pageScroll      : (cfg.pageScroll != null)      ? cfg.pageScroll : true,
            position        : (cfg.position != null)        ? cfg.position : "fixed",
            popoutClass     : (cfg.popoutClass != null)     ? cfg.popoutClass : null,
            showFx          : (cfg.showFx != null)          ? cfg.showFx : "fadeIn",
            showFxDelay     : (cfg.showFxDelay != null)     ? cfg.showFxDelay : 500,
            hideFx          : (cfg.hideFx != null)          ? cfg.hideFx : "fadeOut",
            hideFxDelay     : (cfg.hideFxDelay != null)     ? cfg.hideFxDelay : 500,
            closeText       : (cfg.closeText != null)       ? cfg.closeText : "Cerrar",
            opacity         : (cfg.opacity != null)         ? parseFloat(cfg.opacity) : 0.5,
            id              : {
                popoutLayer     : (cfg.popoutLayer != null)     ? cfg.popoutLayer : "popoutLayer",
                popoutWrapper   : (cfg.popoutWrapper != null)   ? cfg.popoutWrapper : "popoutWrapper",
                popoutBox       : (cfg.popoutBox != null)       ? cfg.popoutBox : "popoutBox",
                popoutHeader    : (cfg.popoutHeader != null)    ? cfg.popoutHeader : "popoutHeader",
                popoutClose     : (cfg.popoutClose != null)     ? cfg.popoutClose : "popoutClose",
                popoutBody      : (cfg.popoutBody != null)      ? cfg.popoutBody : "popoutBody",
                popoutIe6Layer  : (cfg.popoutIe6Layer != null)  ? cfg.popoutIe6Layer : "popoutIe6Layer"
            }
        };
    }

    this.init();
}