﻿$jq.namespace('MatchCore.UI.Site');
$jq.namespace('MatchCore.UI.Site.Modal');

MatchCore.UI.Site.ModalDialog = function() {
    var _container;
    var _showDelegate = new MatchCore.Delegate();
    var _dismissDelegate = new MatchCore.Delegate();
    var _templateManager = new MatchCore.UI.Site.Modal.templateManager();

    var _effects = {
        "fadeIn": null,
        "fadeOut": null
    };

    var _settings = {
        autoShow: false,
        autoCenter: false
    };

    var wireupControls = function() {
        $jq('.modal_dismiss', _container).bind('click', function() {
            self.dismiss();
        });
        if (_settings.autoCenter) {
            $jq(window).resize(function() {
                self.center();
            });
            $jq(document).ready(function() {
                self.center();
            });
        }
    };

    var centerToBrowser = function() {
        var div = _container;
        var browserX;
        var browserY;
        var browserW;
        var browserH;

        if (typeof (window.innerWidth) == 'number') {
            browserW = window.innerWidth;
        }
        else {
            browserW = document.documentElement.clientWidth;
        }
        if (document.documentElement && (document.documentElement.scrollLeft)) {
            browserX = document.documentElement.scrollLeft;
        }
        else {
            browserX = document.body.scrollLeft;
        }
        if (typeof (window.innerHeight) == 'number') {
            browserH = window.innerHeight;
        }
        else {
            browserH = document.documentElement.clientHeight;
        }
        if (document.documentElement && (document.documentElement.scrollTop)) {
            browserY = document.documentElement.scrollTop;
        }
        else {
            browserY = document.body.scrollTop;
        }

        var divHeight = $jq(div).height();
        var divWidth = $jq(div).width();

        var HorizontalReference;
        if (browserW > 1024) {
            HorizontalReference = 1024;
        }
        else {
            HorizontalReference = browserW;
        }
        var VerticalReference = browserH;

        $jq(div).css("top", (VerticalReference / 2) - (divHeight / 2) + browserY + 'px');
        $jq(div).css("left", (HorizontalReference / 2) - (divWidth / 2) + browserX + 'px');
    }

    var obscureNonZindexElements = function() {
        $jq(".obscureFromModal").each(function() {
            if ($jq(this).parents('.modal_dialog').length == 0) {
                $jq(this).addClass('obscuredFromModal');
            }
        });

        $jq("object").each(function() {
            if ($jq(this).parents('.modal_dialog').length == 0) {
                $jq(this).attr('modal_obscured', '1');
                $jq(this).css('visibility', 'hidden');
            }
        });

        if (jQuery.browser.msie) {
            $jq('SELECT').each(function() {
                if ($jq(this).parents('.modal_dialog').length == 0) {
                    $jq(this).attr('modal_obscured', '1');
                    $jq(this).css('visibility', 'hidden');
                }
            });
        }
    };

    var overtakePage = function() {
        $jq("HTML").css({ "height": "100%", "overflow": "hidden" });
        $jq("BODY").css({ "height": "100%", "overflow": "hidden" });
        window.scrollTo("0", "0");
    };

    var restorePage = function() {
        $jq("HTML").css({ "height": "auto", "overflow": "auto" });
        $jq("BODY").css({ "height": "auto", "overflow": "hidden" });
        $jq('*[@modal_obscured="1"]').css('visibility', 'visible');
        $jq('.obscuredFromModal').removeClass('obscuredFromModal');
    };

    var setupModal = function(opts) {
        _container = opts.container;
        $jq(_container).addClass('client_modal');

        $jq(_container).hide();

        parseMeta(opts.meta);

        wireupControls();

        if (_settings.autoShow)
            self.show();
    }

    var parseMeta = function(options) {
        if (options) {
            (options.onShow) ? self.onShow(opts.meta.onShow) : undefined;

            (options.onDismiss) ? self.onDismiss(opts.meta.onDismiss) : undefined;

            if (options.moveOutHierarchy) {
                $jq(_container).remove();
                $jq("#bodyContent").append(_container);
            }

            if (options.fadeIn)
                _effects.fadeIn = options.fadeIn;

            if (options.fadeOut)
                _effects.fadeOut = options.fadeOut;

            if (options.autoShow)
                _settings.autoShow = options.autoShow;

            if (options.autoCenter)
                _settings.autoCenter = options.autoCenter;

        }
    };

    var self = {
        init: function(opts) {
            if (!opts) return false;

            if (opts.meta && opts.meta.templateUrl) {
                _templateManager.createModalFromTemplate(opts, setupModal);
            } else {
                setupModal(opts);
            }

            MatchCore.UI.Site.ModalMaster.addModal(this);

        },

        dismiss: function() {
            _dismissDelegate.fireAndPreserve();

            restorePage();

            $jq(".modal_overlay").remove();

            if (_effects.fadeOut != null) {
                $jq(_container).fadeOut(_effects.fadeOut);
            }
            else {
                $jq(_container).hide();
            }
        },

        show: function() {
            _showDelegate.fireAndPreserve();
            if (_settings.autoCenter) {
                $jq('body > *:first').before('<div class="modal_overlay"></div>');
            } else {
                $jq(_container).before('<div class="modal_overlay"></div>');
            }
            $jq('#bodyWrapper').addClass("hasModal");
            overtakePage();

            obscureNonZindexElements();

            if (_settings.autoCenter) centerToBrowser();
            if (_effects.fadeIn != null) {
                $jq(_container).fadeIn(_effects.fadeIn);
            }
            else {
                $jq(_container).show();
            }
        },

        center: function() {
            centerToBrowser();
        },

        id: function() {
            return $jq(_container).attr('id');
        },

        onShow: function(handler) {
            _showDelegate.add(handler);
        },

        onDismiss: function(handler) {
            _dismissDelegate.add(handler);
        }


    }

    return self;
};

MatchCore.UI.Site.Modal.templateManager = function() {
    var _opts, _callback;

    var _bindModalData = function(resp) {
        if (_opts.meta.data) {
            $jq(_opts.container).setTemplate(resp);
            $jq(_opts.container).processTemplate(_opts.meta.data);
        } else {
            $jq(_opts.container).html(resp);
        }

        _callback(_opts);
    };

    return {
        createModalFromTemplate: function(opts, callback) {
            _opts = opts;
            _callback = callback;
            var _tp = new MatchCore.templateProxy(_opts.meta.templateUrl);
            _tp.invoke({ success: _bindModalData });

        }
    };
}

MatchCore.UI.Site.ModalMaster = function() {
    var _modals = [];
    
    var hideAll = function(except) {
        for (var key in _modals) {
            if (key != except)
                _modals[key].dismiss();
        }
    };
    
    var self = {
        addModal : function(modal) {
            var thisId = modal.id();
            
            modal.onShow(function() {
                hideAll(thisId);    
            });
            
            _modals[modal.id()] = modal;
        },
        
        getModal : function(id) {
            return _modals[id];
        }
    };
    
    return self;
}();


jQuery.fn.showClientModal = function(){
    return this.each(function() {
        //check for attached behavior
        jQuery(this).behavior('MatchCore.UI.Site.ModalDialog', function(modal) {
			modal.show();
        });
    });
};

jQuery.fn.dismissClientModal = function(){
    return this.each(function() {
        //check for attached behavior
        jQuery(this).behavior('MatchCore.UI.Site.ModalDialog', function(modal) {
			modal.dismiss();
        });
    });
};
