/*

Mayfair v2.0 Javascript (C) 2009 Resource Techniques LTD

Please contact us if you need to use this code. 
Not to be used without express written permission.

:: Init at the bottom of the page ::

*/

// Global Namespace
var Mayfair = Mayfair || {};

/* Utility Methods */

Mayfair.fn = {};

Mayfair.fn.CenterInViewport = function (object) {
    var viewportOffsetTop = document.viewport.getScrollOffsets().top;
    var viewportDimensions = document.viewport.getDimensions();
    var objectsDimensions = object.getDimensions();

    object.setStyle({
        top: viewportOffsetTop + viewportDimensions.height / 2 - objectsDimensions.height / 2 + 'px',
        left: viewportDimensions.width / 2 - objectsDimensions.width / 2 + 'px'
    });

    return object;
};

/* Plugins */

Mayfair.Accordion = function (containerId, options) {
    var container = $(containerId);
    var triggers = $$('#' + containerId + ' li a');
    var init = true;

    var _hideLoader = function () {
        var fx = [];
        fx.push(new Effect.Fade($('accordionLoader'), { sync: true }));
        fx.push(new Effect.Appear(container.down('ul'), { sync: true }));
        new Effect.Parallel(fx, { duration: 0.3 });
    };

    var _resizeAccordion = function (event) {
        var trigger = event.target;

        if (trigger.getStyle('width') === options.close + 'px') {
            //event.stop();

            var fx = [];
            var opts = {
                duration: '1',
                delay: '0',
                transition: function (pos) { return (pos == 1) ? 1 : -Math.pow(2, -10 * pos) + 1; }
            };

            var triggersWithoutTrigger = triggers.without(trigger);

            triggersWithoutTrigger.each(function (i) {
                fx.push(new Effect.Morph(i, { style: { width: options.close + 'px'} }, { sync: true }));
            });

            fx.push(new Effect.Morph(trigger, { style: { width: options.open + 'px'} }, { sync: true }));

            new Effect.Parallel(fx, opts);
        } else {
            if (init && document.viewport.getDimensions().height < 700) {
                Effect.ScrollTo('accordion', { duration: 1 });
                init = false;
            }
        }
    };


    var _setupAccordion = function () {
        triggers.each(function (trigger, index) {
            trigger.style.backgroundPosition = -options.open * index + 'px 0px';
            if (index === 0) {
                trigger.style.width = options.open + 'px';
            } else if (index === triggers.length - 1) {
                trigger.style.backgroundPosition = 'right 0px';
            }
        });

        setTimeout(_hideLoader, 1000);
    };


    var _showLoader = function () {
        var loader = new Element('div', { 'id': 'accordionLoader' });
        loader.setStyle({
            position: 'absolute',
            display: 'block',
            width: '100%',
            height: '260px',
            top: '0',
            left: '0',
            background: 'url(../img/loader.gif) no-repeat center center',
            zIndex: '9995'
        });
        container.insert({ 'bottom': loader });
    };

    if (container !== null) {
        _showLoader();
        _setupAccordion();

        triggers.invoke('observe', 'click', function (event) {
            _resizeAccordion(event);
        });
    }
};

Mayfair.MoreOptionsPanel = function (triggersClassName) {
    var panel, triggers = $$(triggersClassName);
    var options = {
        duration: 0.2,
        delay: 0
    };

    var _toggleVisibility = function (trigger) {
        panel = trigger.previous('ul');
        if (panel.visible()) {
            new Effect.SlideUp(panel, options);
            trigger.value = 'More Options';
        } else {
            new Effect.SlideDown(panel, options);
            trigger.value = 'Less Options';
        }
    };

    triggers.invoke('observe', 'click', function (event) {
        event.stop();
        _toggleVisibility(event.target);
    });
};

Mayfair.QuickSearchTabsHandler = function (triggersContainerId, propertySearchPanelId, agentSearchPanelId) {
    var triggers = $$('#' + triggersContainerId + ' a');
    var propertyPanel = $(propertySearchPanelId);
    var agentPanel = $(agentSearchPanelId);

    var options = {
        duration: 0.3,
        delay: 0,
        queue: 'end'
    };

    var _togglePanels = function (trigger) {
        if (!trigger.hasClassName('current')) {
            triggers.invoke('removeClassName', 'current');
            trigger.addClassName('current');
            if (triggers.indexOf(trigger) == 0) {
                new Effect.Fade(agentPanel, options);
                new Effect.Appear(propertyPanel, options);
            } else {
                new Effect.Fade(propertyPanel, options);
                new Effect.Appear(agentPanel, options);
            }
        }
    }

    triggers.each(function (trigger) {
        trigger.observe('click', function (event) {
            event.stop();
            _togglePanels(trigger);
        });
    });
};

Mayfair.RadioSearchHandler = function (fieldsetId) {
    var labels = $$('#' + fieldsetId + ' label');
    var radios = $$('#' + fieldsetId + ' input');

    var saleLabel = labels.first();
    var rentLabel = labels.last();
    var saleRadio = radios.first();
    var rentRadio = radios.last();

    var _resetLabels = function () {
        if (typeof saleLabel !== 'undefined' && typeof rentLabel !== 'undefined') {
            saleLabel.addClassName('forSale');
            rentLabel.addClassName('toRent');
        }
    };

    if (saleLabel !== null && typeof saleLabel !== 'undefined') {
        _resetLabels();
        if (saleRadio.checked === true) {
            saleLabel.addClassName('current');
        } else if (rentRadio.checked === true) {
            rentLabel.addClassName('current');
        }
    }
};

Mayfair.ShowPanel = function (triggersClass, panelId, closeButtonId) {
    var loginPanel = $(panelId);
    var triggers = $$(triggersClass);
    var closeButton = $(closeButtonId);

    var speed = 0.3;

    triggers.invoke('observe', 'click', function (event) {
        event.stop();
        Mayfair.fn.CenterInViewport(loginPanel);
        Effect.Appear(loginPanel, { duration: speed });
    });

    closeButton.observe('click', function () {
        Effect.Fade(loginPanel, { duration: speed });
    });

    return false;
};

Mayfair.GoToURL = function (triggersClassname, destinationUrl) {
    var triggers = $$(triggersClassname);

    triggers.invoke('observe', 'click', function (event) {
        event.stop();
        window.location = destinationUrl;
    });
};

Mayfair.HighlightTown = function () {
    var dropdown = $$('.f_select')[2];
    var template = '<div id="highlightTown" style="display:none;"></div>';
    $(document.body).insert({ bottom: template });
    var msg = $('highlightTown');
    var d = dropdown.viewportOffset();
    msg.setStyle({
        top: d[1] - 61 - 100 + 'px',
        left: d[0] + 116 + 'px'
    });

    var fx = [];

    var options = {
        duration: 0.8,
        delay: 0,
        afterFinish: function () {
            setTimeout(function () {
                var out = [];
                var o = { duration: 0.6, delay: 0 };

                out.push(new Effect.Fade(msg, { sync: true }));
                out.push(new Effect.Move(msg, { y: -50 }, { sync: true }));

                new Effect.Parallel(out, o);
            }, 3000);
        }
    };

    fx.push(new Effect.Appear(msg, { to: '0.9' }, { sync: true }));
    fx.push(new Effect.Move(msg, { y: 100 }, { sync: true }));

    new Effect.Parallel(fx, options);
};

Mayfair.SmoothScroll = function (triggerClass) {
    var target, triggers = $$(triggerClass);
    var options = {
        duration: 1.5,
        transition: function (pos) { return (pos == 1) ? 1 : -Math.pow(2, -10 * pos) + 1; }
    };

    triggers.invoke('observe', 'click', function (event) {
        event.stop();
        target = event.target.href.split('#').last();
        new Effect.ScrollTo(target, options);
    });
};

Mayfair.TextboxesHandler = function (textboxesClass) {
    textboxes = $$(textboxesClass);

    var _onBlur = function (event) {
        var textbox = event.target;
        if (textbox.value == '') {
            textbox.value = textbox.defaultValue;
        };
    };

    var _onFocus = function (event) {
        var textbox = event.target;
        if (textbox.value == textbox.defaultValue) {
            textbox.value = "";
        };
    };

    textboxes.invoke('observe', 'blur', function (event) {
        _onBlur(event);
    });

    textboxes.invoke('observe', 'focus', function (event) {
        _onFocus(event)
    });
};

Mayfair.UCGradient = function () {
    var left = new Element("div", { "id": "UCGradientLeft" });
    var right = new Element("div", { "id": "UCGradientRight" });

    left.setStyle({
        display: "block",
        width: "40px",
        height: "270px",
        position: "absolute",
        top: "0",
        left: "-40px",
        background: "url('../img/international/upper-content_gradients.png') left no-repeat"
    });

    right.setStyle({
        display: "block",
        width: "40px",
        height: "270px",
        position: "absolute",
        top: "0",
        left: "930px",
        background: "url('../img/international/upper-content_gradients.png') right no-repeat"
    });

    $('upper_content').insert({ bottom: left });
    $('upper_content').insert({ bottom: right });
};

Mayfair.UserRegistrationHandler = function (triggerId, panelId) {
    var trigger = $(triggerId);
    var panel = $(panelId);

    var beingExecuted = false;

    _registerNewUser = function () {
        var options = {
            duration: 1.5,
            transition: function (pos) { return (pos == 1) ? 1 : -Math.pow(2, -10 * pos) + 1; },
            queue: 'end',
            afterFinish: function () {
                beingExecuted = false;
            }
        };

        if (!beingExecuted) {
            beingExecuted = true;
            if (panel.style.display === 'none') {
                new Effect.SlideDown(panel, options);
                new Effect.ScrollTo('scroller', options);
                new Effect.Highlight('ctl00_ContentPlaceHolder1_tbxNewFirstName', options);
            } else {
                new Effect.ScrollTo('tertiary_nav', options);
                new Effect.SlideUp(panel, options);
            }
        }
    }

    if (trigger !== null) {
        trigger.observe('click', function (event) {
            event.stop();
            _registerNewUser();
        });
    }
};

Mayfair.ZIndexReverser = function () {
    if (Prototype.Browser.IE) {
        var elements = $$('div');
        var zIndexNumber = elements.length * 100;

        elements.each(function (el) {
            el.style.zIndex = zIndexNumber;
            zIndexNumber -= 10;
        });
    }
};

Mayfair.HandleNewsArchiveNav = function () {
    if ($$('.archive_months') != null) {
        $$('.archive_months').each(function (item) {
            var i = item.childElements();
            if (i == 0) {
                item.addClassName('hide');
            } else {
                item.setStyle(
                {
                    display: 'block'
                });
            }
        });
    };
};

/* Init */

document.observe('dom:loaded', function () {
    Mayfair.Accordion('accordion', { open: '248', close: '103' });
    Mayfair.QuickSearchTabsHandler('switches', 'quick_property_search', 'quick_agent_search');
    Mayfair.SmoothScroll('.scrollup');
    Mayfair.TextboxesHandler('.f_input');
    Mayfair.UserRegistrationHandler('new-registration', 'new');
    Mayfair.HandleNewsArchiveNav();
});