var paymentBlockElements = ['placeholder', 'cc', 'sofortueberweisungredirect', 'moneyorder' , 'paypal'];

String.prototype.reverseHTMLEntities = function () {
    strText = this;
    strText = strText.replace( new RegExp('ü', "g"), 'ü');
    strText = strText.replace( new RegExp('ö', "g"), 'ö');
    strText = strText.replace( new RegExp('ä', "g"), 'ä');
    strText = strText.replace( new RegExp('Ü', "g"), 'Ü');
    strText = strText.replace( new RegExp('Ö', "g"), 'Ö');
    strText = strText.replace( new RegExp('Ä', "g"), 'Ä');
    strText = strText.replace( new RegExp('&szlih;', "g"), 'ß');
    return strText;
}

$(
    function ()
    {
        LanguageSelect.init();
        NewsletterInput.init();


        // Content Handler
        new ContentPage();

        Currency_Selection.init();

        Hover_Info.init();
        Sidebar_Accordion.init();
    }
);


    var Navigation = {
        redirect: function (newUrl) {
            document.location.href = newUrl;
        }
    };



    function ContentPage () {
        this.contentID = (typeof contentPageGroup != "undefined") ? contentPageGroup : null;

        this.init();
    }

    ContentPage.prototype.init = function () {

        if (null == this.contentID) {
            return false;
        }
        else {
            return this.handleContentPage();
        }
    };


    ContentPage.prototype.handleContentPage = function () {

        switch (this.contentID)
        {
            case 9:
                return this.handleSizePage();
                break;

            default:
                return false;
                break;
        }
    };


    ContentPage.prototype.handleSizePage = function () {
        if ((typeof(currentGender) != "undefined") && ("men" == currentGender)) {
            $("html").scrollTop(Math.round($('#size-chart-men').offset().top));
        }
        else if ((typeof(currentGender) != "undefined") && ("kids" == currentGender)) {
            $("html").scrollTop(Math.round($('#size-chart-kids').offset().top));
        }
    };


    /**
     * Newsletter input class, which handles the newsletter input field
     * @class NewsletterInput
     */
    var NewsletterInput = {

        /**
         * Flag, if the input field was already resetted
         * @type {Boolean}
         */
        wasResetted: false,

        /**
         * The id of the input element
         * @type {String}
         */
        ID: 'email',


        /**
         * The input handler
         * @type {jQuery}
         */
        $inputHandler: null,


        /**
         * Initializes the component and registers the event listeners
         */
        init: function () {
            var self = this;
            this.$inputHandler = $('#' + this.ID);

            this.$inputHandler.focus(
                function () {
                    self.onFocus();
                }
            );
        },


        /**
         * Handles the focus event
         */
        onFocus: function () {
            if (!this.wasResetted) {
                this.$inputHandler.val('');
                this.wasResetted = true;
            }
        }
    };


    var Currency_Selection = {

        SELECT_ID: "currency-selection",
        $handler: null,

        init: function () {
            this.$handler = $('#' + this.SELECT_ID);

            this._registerEventListeners();
        },

        _registerEventListeners: function () {

            var self = this;

            this.$handler.change(
                function () {
                    self._onChange();
                }
            );

            this.$handler.find('option').click(
                function () {
                    self.$handler.trigger('change');
                }
            );

        },

        _onChange: function () {
            var newCurrencyCode = this.$handler.find('option:selected').val();

            // cancel, if nothing is changed
            if (newCurrencyCode == currentCurrencyCode) {
                return;
            }

            this.$handler.closest('form').submit();
        }
    };


    var Popup = {

        topLogo: "",

        template: {
            before_before_class: '<div id="ajax-popup-wrap"',
            before_after_class: '><h1><img src="' + this.topLogo + '" alt="" /></h1><div id="ajax-popup-content"><div id="ajax-popup-content-inner">',
            after: '</div></div></div>'
        },

        init: function (topLogo) {
            this.topLogo = topLogo;
        },

        show: function (content, special_class) {

            if ((typeof special_class != "undefined") && (0 < special_class.length)) {
                special_class = ' class="' + special_class + '"';
            }
            else {
                special_class = '';
            }
            var popupContent = this.template.before_before_class + special_class + this.template.before_after_class + content + this.template.after;

            $.fancybox({
                "content": popupContent,
                "scrolling": "no",
                "autoDimensions": true,
                "autoScale": true
            });
        }

    };


    Popup.init(topLogo);



    var Hover_Info = {
        REL_PREFIX: 'hover-info:',
        HOVER_INFO_CONTAINER_ELEMENT_ID: 'hover-info-container',

        $container: null,

        init: function () {

            var self = this;

            $('[rel^="' + this.REL_PREFIX + '"]').hover(
                function () {
                    $(this).css("cursor", "help");
                    self._showPopup( $(this) );
                },
                function () {
                    self._hidePopup( $(this) );
                }
            );
        },

        _showPopup: function ($handler) {
            var $contentHandler = this._getPopupElementHandler($handler);
            var content = $contentHandler.html();

            var popupContent = this._buildPopupHtml(content);

            $('body').append(popupContent);
            this.$container = $('#' + this.HOVER_INFO_CONTAINER_ELEMENT_ID);
            this._moveContainer($handler);
        },


        _buildPopupHtml: function (content) {
            var html = '<div id="' + this.HOVER_INFO_CONTAINER_ELEMENT_ID + '">';

            html += content;

            html += '</div>';
            return html;
        },

        _moveContainer: function ($handler) {

            var offset = $handler.offset();

            this.$container.css({
                'top':  offset.top  - this.$container.height() - $handler.height() - 5,
                'left': offset.left - this.$container.width()  - $handler.width()  - 5
            });
        },



        /**
         * Hides the popup
         * @param $handler jQuery the handler of the hovered element
         */
        _hidePopup: function ($handler) {

            if (null != this.$container) {
                this.$container.remove();
                this.$container = null;
            }
        },


        /**
         * Returns the handler of the popup elements content element
         * @param $openerHandler jQuery
         * @throws exception, if rel attribute not correctly formatted
         * @returns the handler to the popup elements content element
         * @type jQuery
         */
        _getPopupElementHandler: function ($openerHandler) {
            var rel = $openerHandler.attr("rel").split(":");

            if (2 != rel.length) {
                throw "Invalid hover-info rel format.";
            }

            return $('#' + rel[1]);
        }

    };


/**
 * Handles the sidebar accordion
 *
 * @class Sidebar_Accordion
 */
var Sidebar_Accordion = {

    /**
    * The box elements' headers
    *
    * @type jQuery
    */
    $boxHeader: null,


    /**
    * The active class to give the active elements
    *
    * @constant
    * @type String
    */
    ACTIVE_CLASS: "active",


    /**
    * The speed of the transition
    *
    * @constant
    * @type String
    */
    TRANSITION_SPEED: "slow",


    /**
    * Flag, whether there is an active animation process
    *
    * @type Boolean
    */
    inAnimation: false,



    /**
    * Initializes the sidebar
    *
    * @constructs Sidebar_Accordion
    */
    init: function ()
    {
        this.$boxHeader = $('#leftNav').children('h2');

        var self = this;

        this.$boxHeader.click(
        function ()
            {
                self._onClick($(this));
            }
        );
    },



    /**
    * onClick handler for the box headers
    *
    * @private
    * @param $boxHeader jQuery
    */
    _onClick: function ($boxHeader)
    {
        if (this.inAnimation)
        {
            return;
        }

        this.inAnimation = true;
        var self = this;
        var $boxBody = $boxHeader.next('ul');

        if ($boxHeader.hasClass(this.ACTIVE_CLASS))
        {
            $boxHeader.removeClass(self.ACTIVE_CLASS);

            $boxBody.slideUp(
                this.TRANSITION_SPEED,
                function ()
                {
                    $(this).removeClass(self.ACTIVE_CLASS);
                    self.inAnimation = false;
                }
            );
        }
        else
        {
            $boxHeader.addClass(self.ACTIVE_CLASS);

            $boxBody.slideDown(
                this.TRANSITION_SPEED,
                function ()
                {
                    $(this).addClass(self.ACTIVE_CLASS);
                    self.inAnimation = false;
                }
            );
        }
    }
};