//no-nonsense dom-modal

;
(function($){
    jQuery.fn.modal = function(options){
        var presets = {
            //width: 600
            //,height: 450
            transitionRate:250
            ,opacity:.85
            ,padding: {
                top:        25
                ,right:     25
                ,bottom:    15
                ,left:      25
            }
            ,closeBtn: true
            ,backBtn: true
        };
        $.extend(presets,options);

        //bind onclick destroy modal window to selector
        $('.modalRemove').live('click', function(e){
            e.preventDefault;
            $('#modalOverlay, #modalContent').fadeOut(presets.transitionRate, function(){
                $('#modalOverlay, #modalContent').remove();
            });
            return false;
        });

        return this.each(function(){
            $this = $(this);
            $this.bind('click', function(e){
                e.preventDefault;
                //construct and append overlay
                var $modalOverlay = $('<div>', {
                    id:'modalOverlay'
                    ,'class':'modalRemove'
                    }).css({opacity:presets.opacity}).appendTo('body').fadeIn(presets.transitionRate);

                //TODO: verify href in IE
                //alert($this.attr('href'));
                
                var target = {
                    $el:    $($this.attr('href'))//find modal content
                    ,width: $($this.attr('href')).width()
                    ,height:$($this.attr('href')).height() + ((presets.backBtn) ? 35 : 0 )
                }
                
                //construct and append modal content
                var $modalContent = $('<div>', {id:'modalContent'})
                .height(target.height)
                .width(target.width)
                .css({
                    marginTop: -((target.height + presets.padding.top + presets.padding.bottom) / 2) + 'px'
                    ,marginLeft: -((target.width + presets.padding.left + presets.padding.right) /2) + 'px'
                    , padding: presets.padding.top + 'px ' + presets.padding.right + 'px ' + presets.padding.bottom + 'px ' + presets.padding.left + 'px'
                })//wrapper
                    .append(target.$el.clone().css({display:'block'}))//cloned content
                    .appendTo('body').fadeIn(presets.transitionRate);
                if(presets.closeBtn) {
                    $modalContent.append($('<a>', {
                        id:'modalClose'
                        ,'class':'modalRemove'
                        ,title:'close'
                        ,text:"close"
                        ,href:'#modalRemove'
                        }));//close button
                }
                if(presets.backBtn) {
                    $modalContent.append($('<a>',{
                        id:'modalBack'
                        ,'class':'modalRemove'
                        ,title:'back'
                        ,text:"close"
                        ,href:'#modalRemove'
                        }));//continue button
                }
                return false;
            });
        });
    };
})(jQuery);