//PopupEclipse.js

//constructor
function PopupEclipse( config )
{
    this.toggle_ids = config.toggle_ids;
    this.popup_size = ( config.size ) ? config.size : {};
    this.max_zindex = config.max_zindex;
    this.get_content = config.get_content;      //should be function
    this.dynamic = ( config.dynamic ) ? config.dynamic : false;
    this.layout_structs = {};

    this.registerToggle = function( id )
    {
        var pe = this;
        $( '#' + id ).click( function( e ){ pe.show();spottago.event.kill( e ); } );
    }

    this.writeHTML = function()
    {
        var popup_container = jQuery( document.createElement( 'div' ) );
        popup_container.css( 'z-index', this.max_zindex+1 );
        popup_container.css( 'position', 'fixed' );
        popup_container.css( 'top', '0px' );
        popup_container.css( 'left', '0px' );
        popup_container.css( 'display', 'none' );

        var shadow = jQuery( document.createElement( 'div' ) );
        shadow.css( 'width', '100%' );
        shadow.css( 'height', '100%' );
        shadow.css( 'background', 'rgb(50,50,50)' );
        shadow.css( 'opacity', '0.5' )
        shadow.css( 'filter', 'alpha(opacity=50)' );

        var popup = jQuery( document.createElement( 'table' ) );
        popup.attr( 'id', 'popup' );
        popup.css( 'width', this.popup_size.width + 'px' );
        popup.css( 'height', this.popup_size.height + 'px' );
        popup.css( 'position', 'absolute' );
        popup.css( 'z-index', this.max_zindex + 2 );
        popup.css( 'line-height', '1' );

        var tbody = jQuery( document.createElement( 'tbody' ) );
        popup.append( tbody );

        var top_row = jQuery( document.createElement( 'tr' ) );
        top_row.css( 'height', '20px' );
        var tl = jQuery( document.createElement( 'td' ) );
        tl.addClass( 'tl_corner' );
        var t = jQuery( document.createElement( 'td' ) );
        t.addClass( "t_side" );
        var tr = jQuery( document.createElement( 'td' ) );
        tr.addClass( 'tr_corner' );

        top_row.append( tl );
        top_row.append( t );
        top_row.append( tr );

        var middle_row = jQuery( document.createElement( 'tr' ) );
        var l = jQuery( document.createElement( 'td' ) );
        l.addClass( "l_side" );
        var content = jQuery( document.createElement( 'td' ) );
        content.addClass( "content" );
        content.attr( 'vAlign', "top" );
        var content_container = jQuery( document.createElement( 'div' ) );
        content_container.css( 'position', 'relative' );
        content_container.css( 'float', 'left' );
        content_container.css( 'width', ( this.popup_size.width - 20 ) + "px" );
        var content_div = jQuery( document.createElement( 'div' ) );
        var r = jQuery( document.createElement( 'td' ) );
        r.addClass( 'r_side' );

        content_container.append( content_div );
        content.append( content_container );
        middle_row.append( l );
        middle_row.append( content );
        middle_row.append( r );

        var bottom_row = jQuery( document.createElement( 'tr' ) );
        var bl = jQuery( document.createElement( 'td' ) );
        bl.addClass( 'bl_corner' );
        var b = jQuery( document.createElement( 'td' ) );
        b.addClass( 'b_side' );
        var br = jQuery( document.createElement( 'td' ) );
        br.addClass(  'br_corner' );

        bottom_row.append( bl );
        bottom_row.append( b );
        bottom_row.append( br );

        var close = jQuery( document.createElement( 'a' ) );
        close.attr( 'href', "" );
        close.addClass( 'close' );
        close.css( 'z-index', this.max_zindex+2 );

        var ex = jQuery( document.createElement( 'img' ) );
        ex.attr( 'width', '16' );
        ex.attr( 'height', '16' );
        ex.attr( 'src', '/images/close_remove_x.png' );

        var close_text = jQuery( document.createElement( 'span' ) );
        close_text.html( 'Close' );
        close.append( ex );
        close.append( close_text );

        var pe = this;
        close.click( function( e ){ pe.hide();spottago.event.kill( e ); } );
        content_container.append( close );

        tbody.append( top_row );
        tbody.append( middle_row );
        tbody.append( bottom_row );

        popup_container.append( shadow );
        popup_container.append( popup );

        this.layout_structs.container = popup_container;
        this.layout_structs.popup = popup;
        this.layout_structs.popup_content = content_div;

        this.setContent();

        jQuery( document.body ).append( popup_container );
    }

    this.setContent = function()
    {
        this.layout_structs.popup_content.empty();

        if( typeof this.get_content == "function" )
        {
            var inner_content = this.get_content();
            if( typeof inner_content == "string" )
            {
                this.layout_structs.popup_content.html( inner_content );
            }
            else
            {
                this.layout_structs.popup_content.append( inner_content );
            }
        }
    }

    this.show = function()
    {
        this.setDimensions();
        if( this.dynamic ) this.setContent();
        this.layout_structs.container.fadeIn( 800 );
    }

    this.hide = function(){ this.layout_structs.container.fadeOut(); }

    this.setDimensions = function()
    {
        var document_size = spottago.window.getDocumentDimensions();
        var screen_pos = spottago.window.getCenterPositionBySize( this.popup_size );

        this.layout_structs.container.css( 'width', '100%' );
        this.layout_structs.container.css( 'height', '100%' );

        this.layout_structs.popup.css( 'top', screen_pos.vertical + 'px' );
        this.layout_structs.popup.css( 'left',screen_pos.horizontal + 'px' );
    }

    this.initialize = function( elements )
    {
        this.writeHTML();

        if( this.toggle_ids )
        {
            for( i = 0; i < this.toggle_ids.length; i++ )
            {
                this.registerToggle( this.toggle_ids[i] );
            }
        }
    }
    this.initialize();
}