//vDialog 1.01 01-Feb-2010


(function($) {

    $.fn.vDialog = function(options) {
        var dc = function(a) { return document.createElement(a); };

        var config = {
            name: 'vdialog',
            type: 'window',                     // window|modal|alert
            backcolour: '#000',
            backopacity: 0.75,
            backfadein: 250,
            backfadeout: 200,
            openanimation: 'slide',
            maskanimation: 'fade',
            triggerSelector: '',
            hasNexus: false,
            ajaxURL: '',
            ajaxParam: 'ref',
            innerplaceholderID: ''
        };

        $.extend(config, options);
        var $mask = null;
        var $ourdialog = null;

        function viewport() {

            // the horror case
            if ($.browser.msie) {

                // if there are no scrollbars then use window.height
                var d = $(document).height(), w = $(window).height();

                return [
				window.innerWidth || 							// ie7+
				document.documentElement.clientWidth || 	// ie6  
				document.body.clientWidth, 					// ie6 quirks mode
				d - w < 20 ? w : d
			];
            }

            // other well behaving browsers
            return [$(window).width(), $(document).height()];

        }

        function opendialog(whichone, trigger, data) {
            //we may need to do different things depending on what kind of dialog we are

            switch (config.type) {
                case 'window':
                    //the window is handled by itself, we just display it
                    break;
                case 'alert':
                    //we fill in the content for the alert message based on the passed data
                    if (data != null) {
                        $('#' + config.innerplaceholderID).html(data);
                    } else {
                        //otherwise we look for data on the trigger element
                        var triggerdata = $(trigger).attr('data-content');
                        $('#' + config.innerplaceholderID).html(triggerdata);
                    }
                case 'vnexus':
                    //we trigger updates on any vnexus that are assigned to us
                    //does the trigger include a rel with the ID in it?
                    if (trigger != '') {
                        $ourdialog.trigger("vnxselect", triggerdata);
                    }

                    break;
                case 'ajax':
                    //we load in the content according to the passed trigger
                    var triggerdata = $(trigger).attr('rel');
                    var data = {};
                    data[config.ajaxParam] = triggerdata;
                    $('#' + config.innerplaceholderID).html("").load(config.ajaxURL, data, function(event) {
                        //alert("done");
                    });
                    break;
            }



            //get mask into position
            var size = viewport();
            $mask.css({ 'top': '0px', 'left': '0px' });
            $mask.width(size[0]);
            $mask.height(size[1]);

            var leftmargin = -($ourdialog.outerWidth() / 2);

            //get window into position
            $ourdialog.css({
                position: 'absolute',
                left: '50%',
                marginLeft: leftmargin + 'px',
                marginTop: '0px',
                top: '100px',
                zIndex: '9999'
            });

            switch (config.openanimation) {
                case 'slide':
                    $ourdialog.css({ marginTop: '-70px' }).show().animate({ marginTop: '0px' }, 400, 'easeout');
                    break;
                case 'spin':
                    $ourdialog.css({
                        marginLeft: '-' + ($ourdialog.outerWidth() / 2) + 'px',
                        marginTop: '-' + ($ourdialog.outerHeight() / 2) + 'px'
                    }).show().animate({ 'webkitTransform': 'rotateY(180deg)' }, 400, 'easeout');
                    break;
                case 'show':
                    $ourdialog.show();
                    break;
                default:
                    $ourdialog.css({
                        marginLeft: '-' + ($ourdialog.outerWidth() / 2) + 'px',
                        marginTop: '-' + ($ourdialog.outerHeight() / 2) + 'px'
                    }).show();
                    break;
            }
            
                $mask.fadeTo(config.backfadein, config.backopacity);



        }

        function closedialog(thetrigger) {

            $ourdialog.hide();
            $ourdialog.css({
                position: 'absolute'
            }).css({
                marginLeft: 0,
                marginTop: 0
            });

            $mask.fadeTo(config.backfadeout, 0).css({ top: '-1000px', left: '-1000px', width: 10, height: 10 });
        }

        $(document).ready(function() {


            //create the background mask if there isn't one already
            var mid = '#' + config.name + '-mask';
            if ($(mid).length == 0) {
                $mask = $(dc('div'));
                $mask.css({
                    'background-color': config.backcolour,
                    'position': 'absolute',
                    'z-index': 9000,
                    'top': -1000,
                    'left': -1000,
                    'width': 10,
                    'height': 10,
                    'opacity': 0
                });
                $('body').append($mask);
            }
            else {
                $mask = $(mid);
            }

            $(window).resize(function() {

                if ($mask != null && $mask.css('top') != '-1000px') {
                    var size = viewport();
                    $mask.width(size[0]);
                    $mask.height(size[1]);
                }
            });

        });


        //are we going to allow any more than one item to be turned into a dialog at
        //any one time?
        return this.each(function() {

            $ourdialog = $(this);
            $ourdialog.hide();

            //is there a trigger selector for this window?
            if (config.triggerSelector != '') {
                $(config.triggerSelector).live("click", function(e) {
                    opendialog($ourdialog, $(this), null);
                });
            }

            //capture any bubbled up clicks for this dialog

            $(this).click(function(e) {
                if ($(e.target).hasClass('vdialog-close')) {
                    closedialog(e.target);
                }
            });

            $(this).bind('vdialog-open', function(event, content) {
                opendialog($ourdialog, $(event.target), content);
            });


            $(this).bind('vdialog-close', function(event) {
                closedialog($ourdialog);
            });
        }); //this.each

    } //fn.vedit

})(jQuery);