﻿
(function($j) {
    var ie6 = $j.browser.msie && parseInt($j.browser.version) == 6 && typeof window['XMLHttpRequest'] != "object",
		ieQuirks = null,
		w = [];

    /*
    * Stand-alone function to create a modal dialog.
    * 
    * @param {string, object} data A string, jQuery object or DOM object
    * @param {object} [options] An optional object containing options overrides
    */
    $j.modal = function(data, options) {
        return $j.modal.impl.init(data, options);
    };

    /*
    * Stand-alone close function to close the modal dialog
    */
    $j.modal.close = function() {
        $j.modal.impl.close();
    };

    /*
    * Chained function to create a modal dialog.
    * 
    * @param {object} [options] An optional object containing options overrides
    */
    $j.fn.modal = function(options) {
        return $j.modal.impl.init(this, options);
    };

    /*
    * SimpleModal default options
    * 
    * appendTo:		(String:'body') The jQuery selector to append the elements to. For ASP.NET, use 'form'.
    * focus:			(Boolean:true) Forces focus to remain on the modal dialog
    * opacity:			(Number:50) The opacity value for the overlay div, from 0 - 100
    * overlayId:		(String:'simplemodal-overlay') The DOM element id for the overlay div
    * overlayCss:		(Object:{}) The CSS styling for the overlay div
    * containerId:		(String:'simplemodal-container') The DOM element id for the container div
    * containerCss:	(Object:{}) The CSS styling for the container div
    * dataId:			(String:'simplemodal-data') The DOM element id for the data div
    * dataCss:			(Object:{}) The CSS styling for the data div
    * minHeight:		(Number:200) The minimum height for the container
    * minWidth:		(Number:200) The minimum width for the container
    * maxHeight:		(Number:null) The maximum height for the container. If not specified, the window height is used.
    * maxWidth:		(Number:null) The maximum width for the container. If not specified, the window width is used.
    * autoResize:		(Boolean:false) Resize container on window resize? Use with caution - this may have undesirable side-effects.
    * autoPosition:	(Boolean:true) Reposition container on window resize?
    * zIndex:			(Number: 1000) Starting z-index value
    * close:			(Boolean:true) If true, closeHTML, escClose and overClose will be used if set.
    If false, none of them will be used.
    * closeHTML:		(String:'<a class="modalCloseImg" title="Close"></a>') The HTML for the 
    default close link. SimpleModal will automatically add the closeClass to this element.
    * closeClass:		(String:'simplemodal-close') The CSS class used to bind to the close event
    * escClose:		(Boolean:true) Allow Esc keypress to close the dialog? 
    * overlayClose:	(Boolean:false) Allow click on overlay to close the dialog?
    * position:		(Array:null) Position of container [top, left]. Can be number of pixels or percentage
    * persist:			(Boolean:false) Persist the data across modal calls? Only used for existing
    DOM elements. If true, the data will be maintained across modal calls, if false,
    the data will be reverted to its original state.
    * onOpen:			(Function:null) The callback function used in place of SimpleModal's open
    * onShow:			(Function:null) The callback function used after the modal dialog has opened
    * onClose:			(Function:null) The callback function used in place of SimpleModal's close
    */
    $j.modal.defaults = {
        appendTo: 'body',
        focus: true,
        opacity: 50,
        overlayId: 'simplemodal-overlay',
        overlayCss: {},
        containerId: 'simplemodal-container',
        containerCss: {},
        dataId: 'simplemodal-data',
        dataCss: {},
        minHeight: 200,
        minWidth: 300,
        maxHeight: null,
        maxWidth: null,
        autoResize: false,
        autoPosition: true,
        zIndex: 1000,
        close: true,
        closeHTML: '<a class="modalCloseImg" title="Close"></a>',
        closeClass: 'simplemodal-close',
        escClose: true,
        overlayClose: false,
        position: null,
        persist: false,
        onOpen: null,
        onShow: null,
        onClose: null
    };

    /*
    * Main modal object
    */
    $j.modal.impl = {
        /*
        * Modal dialog options
        */
        o: null,
        /*
        * Contains the modal dialog elements and is the object passed 
        * back to the callback (onOpen, onShow, onClose) functions
        */
        d: {},
        /*
        * Initialize the modal dialog
        */
        init: function(data, options) {
            var s = this;

            // don't allow multiple calls
            if (s.d.data) {
                return false;
            }

            // $j.boxModel is undefined if checked earlier
            ieQuirks = $j.browser.msie && !$j.boxModel;

            // merge defaults and user options
            s.o = $j.extend({}, $j.modal.defaults, options);

            // keep track of z-index
            s.zIndex = s.o.zIndex;

            // set the onClose callback flag
            s.occb = false;

            // determine how to handle the data based on its type
            if (typeof data == 'object') {
                // convert DOM object to a jQuery object
                data = data instanceof jQuery ? data : $j(data);

                // if the object came from the DOM, keep track of its parent
                if (data.parent().parent().size() > 0) {
                    s.d.parentNode = data.parent();

                    // persist changes? if not, make a clone of the element
                    if (!s.o.persist) {
                        s.d.orig = data.clone(true);
                    }
                }
            }
            else if (typeof data == 'string' || typeof data == 'number') {
                // just insert the data as innerHTML
                data = $j('<div></div>').html(data);
            }
            else {
                // unsupported data type!
                alert('SimpleModal Error: Unsupported data type: ' + typeof data);
                return s;
            }

            // create the modal overlay, container and, if necessary, iframe
            s.create(data);
            data = null;

            // display the modal dialog
            s.open();

            // useful for adding events/manipulating data in the modal dialog
            if ($j.isFunction(s.o.onShow)) {
                s.o.onShow.apply(s, [s.d]);
            }

            // don't break the chain =)
            return s;
        },
        /*
        * Create and add the modal overlay and container to the page
        */
        create: function(data) {
            var s = this;

            // get the window properties
            w = s.getDimensions();

            // add an iframe to prevent select options from bleeding through
            if (ie6) {
                s.d.iframe = $j('<iframe src="javascript:false;"></iframe>')
					.css($j.extend(s.o.iframeCss, {
					    display: 'none',
					    opacity: 0,
					    position: 'fixed',
					    height: w[0],
					    width: w[1],
					    zIndex: s.o.zIndex,
					    top: 0,
					    left: 0
					}))
					.appendTo(s.o.appendTo);
            }

            // create the overlay
            s.d.overlay = $j('<div></div>')
				.attr('id', s.o.overlayId)
				.addClass('simplemodal-overlay')
				.css($j.extend(s.o.overlayCss, {
				    display: 'none',
				    opacity: s.o.opacity / 100,
				    height: w[0],
				    width: w[1],
				    position: 'fixed',
				    left: 0,
				    top: 0,
				    zIndex: s.o.zIndex + 1
				}))
				.appendTo(s.o.appendTo);

            // create the container
            s.d.container = $j('<div></div>')
				.attr('id', s.o.containerId)
				.addClass('simplemodal-container')
				.css($j.extend(s.o.containerCss, {
				    display: 'none',
				    position: 'fixed',
				    zIndex: s.o.zIndex + 2
				}))
				.append(s.o.close && s.o.closeHTML
					? $j(s.o.closeHTML).addClass(s.o.closeClass)
					: '')
				.appendTo(s.o.appendTo);

            s.d.wrap = $j('<div></div>')
				.attr('tabIndex', -1)
				.addClass('simplemodal-wrap')
				.css({ height: '100%', outline: 0, width: '100%' })
				.appendTo(s.d.container);

            // add styling and attributes to the data
            // append to body to get correct dimensions, then move to wrap
            s.d.data = data
				.attr('id', data.attr('id') || s.o.dataId)
				.addClass('simplemodal-data')
				.css($j.extend(s.o.dataCss, {
				    display: 'none'
				}))
				.appendTo('body');
            data = null;

            s.setContainerDimensions();
            s.d.data.appendTo(s.d.wrap);

            // fix issues with IE
            if (ie6 || ieQuirks) {
                s.fixIE();
            }
        },
        /*
        * Bind events
        */
        bindEvents: function() {
            var s = this;

            // bind the close event to any element with the closeClass class
            $j('.' + s.o.closeClass).bind('click.simplemodal', function(e) {
                e.preventDefault();
                s.close();
            });

            // bind the overlay click to the close function, if enabled
            if (s.o.close && s.o.overlayClose) {
                s.d.overlay.bind('click.simplemodal', function(e) {
                    e.preventDefault();
                    s.close();
                });
            }

            // bind keydown events
            $j(document).bind('keydown.simplemodal', function(e) {
                if (s.o.focus && e.keyCode == 9) { // TAB
                    s.watchTab(e);
                }
                else if ((s.o.close && s.o.escClose) && e.keyCode == 27) { // ESC
                    e.preventDefault();
                    s.close();
                }
            });

            // update window size
            $j(window).bind('resize.simplemodal', function() {
                // redetermine the window width/height
                w = s.getDimensions();

                // reposition the dialog
                s.setContainerDimensions(true);

                if (ie6 || ieQuirks) {
                    s.fixIE();
                }
                else {
                    // update the iframe & overlay
                    s.d.iframe && s.d.iframe.css({ height: w[0], width: w[1] });
                    s.d.overlay.css({ height: w[0], width: w[1] });
                }
            });
        },
        /*
        * Unbind events
        */
        unbindEvents: function() {
            $j('.' + this.o.closeClass).unbind('click.simplemodal');
            $j(document).unbind('keydown.simplemodal');
            $j(window).unbind('resize.simplemodal');
            this.d.overlay.unbind('click.simplemodal');
        },
        /*
        * Fix issues in IE6 and IE7 in quirks mode
        */
        fixIE: function() {
            var s = this, p = s.o.position;

            // simulate fixed position - adapted from BlockUI
            $j.each([s.d.iframe || null, s.d.overlay, s.d.container], function(i, el) {
                if (el) {
                    var bch = 'document.body.clientHeight', bcw = 'document.body.clientWidth',
						bsh = 'document.body.scrollHeight', bsl = 'document.body.scrollLeft',
						bst = 'document.body.scrollTop', bsw = 'document.body.scrollWidth',
						ch = 'document.documentElement.clientHeight', cw = 'document.documentElement.clientWidth',
						sl = 'document.documentElement.scrollLeft', st = 'document.documentElement.scrollTop',
						s = el[0].style;

                    s.position = 'absolute';
                    if (i < 2) {
                        s.removeExpression('height');
                        s.removeExpression('width');
                        s.setExpression('height', '' + bsh + ' > ' + bch + ' ? ' + bsh + ' : ' + bch + ' + "px"');
                        s.setExpression('width', '' + bsw + ' > ' + bcw + ' ? ' + bsw + ' : ' + bcw + ' + "px"');
                    }
                    else {
                        var te, le;
                        if (p && p.constructor == Array) {
                            var top = p[0]
								? typeof p[0] == 'number' ? p[0].toString() : p[0].replace(/px/, '')
								: el.css('top').replace(/px/, '');
                            te = top.indexOf('%') == -1
								? top + ' + (t = ' + st + ' ? ' + st + ' : ' + bst + ') + "px"'
								: parseInt(top.replace(/%/, '')) + ' * ((' + ch + ' || ' + bch + ') / 100) + (t = ' + st + ' ? ' + st + ' : ' + bst + ') + "px"';

                            if (p[1]) {
                                var left = typeof p[1] == 'number' ? p[1].toString() : p[1].replace(/px/, '');
                                le = left.indexOf('%') == -1
									? left + ' + (t = ' + sl + ' ? ' + sl + ' : ' + bsl + ') + "px"'
									: parseInt(left.replace(/%/, '')) + ' * ((' + cw + ' || ' + bcw + ') / 100) + (t = ' + sl + ' ? ' + sl + ' : ' + bsl + ') + "px"';
                            }
                        }
                        else {
                            te = '(' + ch + ' || ' + bch + ') / 2 - (this.offsetHeight / 2) + (t = ' + st + ' ? ' + st + ' : ' + bst + ') + "px"';
                            le = '(' + cw + ' || ' + bcw + ') / 2 - (this.offsetWidth / 2) + (t = ' + sl + ' ? ' + sl + ' : ' + bsl + ') + "px"';
                        }
                        s.removeExpression('top');
                        s.removeExpression('left');
                        s.setExpression('top', te);
                        s.setExpression('left', le);
                    }
                }
            });
        },
        focus: function(pos) {
            var s = this, p = pos || 'first';

            // focus on dialog or the first visible/enabled input element
            var input = $j(':input:enabled:visible:' + p, s.d.wrap);
            input.length > 0 ? input.focus() : s.d.wrap.focus();
        },
        getDimensions: function() {
            var el = $j(window);

            // fix a jQuery/Opera bug with determining the window height
            var h = $j.browser.opera && $j.browser.version > '9.5' && $j.fn.jquery <= '1.2.6' ? document.documentElement['clientHeight'] :
				$j.browser.opera && $j.browser.version < '9.5' && $j.fn.jquery > '1.2.6' ? window.innerHeight :
				el.height();

            return [h, el.width()];
        },
        getVal: function(v) {
            return v == 'auto' ? 0
				: v.indexOf('%') > 0 ? v
					: parseInt(v.replace(/px/, ''));
        },
        setContainerDimensions: function(resize) {
            var s = this;

            if (!resize || (resize && s.o.autoResize)) {
                // get the dimensions for the container and data
                var ch = s.getVal(s.d.container.css('height')), cw = s.getVal(s.d.container.css('width')),
					dh = s.d.data.outerHeight(true), dw = s.d.data.outerWidth(true);

                var mh = s.o.maxHeight && s.o.maxHeight < w[0] ? s.o.maxHeight : w[0],
					mw = s.o.maxWidth && s.o.maxWidth < w[1] ? s.o.maxWidth : w[1];

                // height
                if (!ch) {
                    if (!dh) { ch = s.o.minHeight; }
                    else {
                        if (dh > mh) { ch = mh; }
                        else if (dh < s.o.minHeight) { ch = s.o.minHeight; }
                        else { ch = dh; }
                    }
                }
                else {
                    ch = ch > mh ? mh : ch;
                }

                // width
                if (!cw) {
                    if (!dw) { cw = s.o.minWidth; }
                    else {
                        if (dw > mw) { cw = mw; }
                        else if (dw < s.o.minWidth) { cw = s.o.minWidth; }
                        else { cw = dw; }
                    }
                }
                else {
                    cw = cw > mw ? mw : cw;
                }

                s.d.container.css({ height: ch, width: cw });
                if (dh > ch || dw > cw) {
                    s.d.wrap.css({ overflow: 'auto' });
                }
            }

            if (s.o.autoPosition) {
                s.setPosition();
            }
        },
        setPosition: function() {
            var s = this, top, left,
				hc = (w[0] / 2) - (s.d.container.outerHeight(true) / 2),
				vc = (w[1] / 2) - (s.d.container.outerWidth(true) / 2);

            if (s.o.position && Object.prototype.toString.call(s.o.position) === "[object Array]") {
                top = s.o.position[0] || hc;
                left = s.o.position[1] || vc;
            } else {
                top = hc;
                left = vc;
            }
            s.d.container.css({ left: left, top: top });
        },
        watchTab: function(e) {
            var s = this;

            if ($j(e.target).parents('.simplemodal-container').length > 0) {
                // save the list of inputs
                s.inputs = $j(':input:enabled:visible:first, :input:enabled:visible:last', s.d.data[0]);

                // if it's the first or last tabbable element, refocus
                if ((!e.shiftKey && e.target == s.inputs[s.inputs.length - 1]) ||
						(e.shiftKey && e.target == s.inputs[0]) ||
						s.inputs.length == 0) {
                    e.preventDefault();
                    var pos = e.shiftKey ? 'last' : 'first';
                    setTimeout(function() { s.focus(pos); }, 10);
                }
            }
            else {
                // might be necessary when custom onShow callback is used
                e.preventDefault();
                setTimeout(function() { s.focus(); }, 10);
            }
        },
        /*
        * Open the modal dialog elements
        * - Note: If you use the onOpen callback, you must "show" the 
        *	        overlay and container elements manually 
        *         (the iframe will be handled by SimpleModal)
        */
        open: function() {
            var s = this;
            // display the iframe
            s.d.iframe && s.d.iframe.show();

            if ($j.isFunction(s.o.onOpen)) {
                // execute the onOpen callback 
                s.o.onOpen.apply(s, [s.d]);
            }
            else {
                // display the remaining elements
                s.d.overlay.show();
                s.d.container.show();
                s.d.data.show();
            }

            s.focus();

            // bind default events
            s.bindEvents();
        },
        /*
        * Close the modal dialog
        * - Note: If you use an onClose callback, you must remove the 
        *         overlay, container and iframe elements manually
        *
        * @param {boolean} external Indicates whether the call to this
        *     function was internal or external. If it was external, the
        *     onClose callback will be ignored
        */
        close: function() {
            var s = this;

            // prevent close when dialog does not exist
            if (!s.d.data) {
                return false;
            }

            // remove the default events
            s.unbindEvents();

            if ($j.isFunction(s.o.onClose) && !s.occb) {
                // set the onClose callback flag
                s.occb = true;

                // execute the onClose callback
                s.o.onClose.apply(s, [s.d]);
            }
            else {
                // if the data came from the DOM, put it back
                if (s.d.parentNode) {
                    // save changes to the data?
                    if (s.o.persist) {
                        // insert the (possibly) modified data back into the DOM
                        s.d.data.hide().appendTo(s.d.parentNode);
                    }
                    else {
                        // remove the current and insert the original, 
                        // unmodified data back into the DOM
                        s.d.data.hide().remove();
                        s.d.orig.appendTo(s.d.parentNode);
                    }
                }
                else {
                    // otherwise, remove it
                    s.d.data.hide().remove();
                }

                // remove the remaining elements
                s.d.container.hide().remove();
                s.d.overlay.hide().remove();
                s.d.iframe && s.d.iframe.hide().remove();

                // reset the dialog object
                s.d = {};
            }
        }
    };
})(jQuery);
