var MH2_Tools = {

	start: function() 

	{

    new MH2_Menu_Slick($E('ul', 'menu'), {mode: 'move',transition: Fx.Transitions.Bounce.easeOut,duration: 700 });



    new MH2_Menu_DD('div#menu li.parent', {mode: 'height', transition: Fx.Transitions.Expo.easeOut,duration: 700 });



		var menuEnter = { 'color': '#FF0000' };

		var menuLeave = { 'color': '#FFFFFF' };



    new MH2_Morph('div#menu li.level1', menuEnter, menuLeave, 

			{ transition: Fx.Transitions.expoOut, duration: 300, ignoreClass: 'active' },

			{ transition: Fx.Transitions.sineIn, duration: 200 }, '.level1');



		var menuEnter = { 'color': '#FF0000' };

		var menuLeave = { 'color': '#FFFFFF' };



		new MH2_Morph('div#menu li.level2 a, div#menu li.level2 span.separator', menuEnter, menuLeave, 

			{ transition: Fx.Transitions.expoOut, duration: 300 },

			{ transition: Fx.Transitions.sineIn, duration: 500 });



		var menuEnter = { 'color': '#FF0000' };

		var menuLeave = { 'color': '#FFFFFF' };



		new MH2_Morph('div#middle ul.menu a, div#middle ul.menu span.separator', menuEnter, menuLeave, 

			{ transition: Fx.Transitions.expoOut, duration: 300 },

			{ transition: Fx.Transitions.sineIn, duration: 500 });

		

		/* Smoothscroll */

		new SmoothScroll({ duration: 500, transition: Fx.Transitions.Expo.easeOut });

		

	}

}		



var MH2_BackgroundFx = new Class({

    initialize: function(options) {

        this.setOptions({

            transition: Fx.Transitions.linear,

            duration: 9000,

            wait: false,

            colors: ['#FFFFFF', '#999999']

        },

        options);

        var body = new Element(document.body);

        var fx = body.effects(this.options);

        var index = 0;

        var colors = this.options.colors;

        var timer = animate.periodical(this.options.duration * 2);

        animate();

        function animate() {

            fx.start({

                'background-color': colors[index]

            });

            if (index + 1 >= colors.length) {

                index = 0

            } else {

                index++

            }

        }

    }

});

MH2_BackgroundFx.implement(new Options);



var MH2_Menu_Slick = new Class({

    initialize: function(menu, options) {

        this.setOptions({

            transition: Fx.Transitions.sineInOut,

            duration: 500,

            wait: false,

            onClick: Class.empty,

            opacity: 1,

            mode: 'move',

            slideOffset: 30,

            itemSelector: 'li.level1',

            activeSelector: 'li.active'

        },

        options);

        this.menu = $(menu),

        this.current = this.menu.getElement(this.options.activeSelector);

        this.li = [];

        this.div = [];

        this.menu.getElements(this.options.itemSelector).each(function(item, i) {

            this.createBackground(item, i);

            item.addEvent('click',

            function(event) {

                this.clickItem(event, item)

            }.bind(this));

            item.addEvent('mouseenter',

            function() {

                this.mouseenterItem(item, i)

            }.bind(this));

            if (this.options.mode == 'move') {

                item.addEvent('mouseleave',

                function() {

                    this.mouseleaveItem(this.current, i)

                }.bind(this))

            }

            else {

                item.addEvent('mouseleave',

                function() {

                    this.mouseleaveItem(item, i)

                }.bind(this))

            }



        }.bind(this));

        if (this.options.mode == 'move') {

            if (this.current) {

                this.setCurrent(this.current)

            }

            else {

                this.setCurrent(this.menu.getElement('li'))

            }



        }



    },

    createBackground: function(item, i) {

        if (this.options.mode == 'move' && i != 0) return;

        this.div[i] = new Element('div', {

            'class': 'fancy-container'

        }).adopt(new Element('div', {

            'class': 'fancy-l'

        }), new Element('div', {

            'class': 'fancy-m'

        }), new Element('div', {

            'class': 'fancy-r'

        }));

        this.div[i].fx = this.div[i].effects(this.options);

        this.li[i] = new Element('li', {

            'class': 'fancy ' + 'bg' + (i + 1)

        }).adopt(this.div[i]).injectInside(this.menu);

        this.li[i].fx = this.li[i].effects(this.options)

    },

    setCurrent: function(item) {

        this.li[0].setStyles({

            'left': item.offsetLeft,

            'width': item.offsetWidth,

            'visibility': 'visible',

            'opacity': this.options.opacity

        });

        this.current = item

    },

    clickItem: function(event, item) {

        if (!this.current) this.setCurrent(item);

        this.current = item;

        this.options.onClick(new Event(event), item)

    },

    mouseenterItem: function(item, i) {

        switch (this.options.mode) {

        case 'fade':

            this.fadeFx(item, i, true);

            break;

        case 'slide':

            this.slideFx(item, i, true);

            break;

        default:

            this.moveFx(item, 0)

        }



    },

    mouseleaveItem: function(item, i) {

        switch (this.options.mode) {

        case 'fade':

            this.fadeFx(item, i, false);

            break;

        case 'slide':

            this.slideFx(item, i, false);

            break;

        default:

            this.moveFx(item, 0)

        }



    },

    moveFx: function(item, i) {

        if (!this.current) return;

        this.li[i].fx.custom({

            'left': [this.li[i].offsetLeft, item.offsetLeft],

            'width': [this.li[i].offsetWidth, item.offsetWidth]

        })

    },

    fadeFx: function(item, i, show) {

        if (show) {

            this.li[i].fx.setOptions(this.options);

            this.li[i].fx.set({

                'left': item.offsetLeft,

                'width': item.offsetWidth

            });

            this.li[i].fx.custom({

                'opacity': [0, 1]

            })

        }

        else {

            var dur = this.options.duration * 2;

            this.li[i].fx.setOptions({

                duration: dur

            });

            this.li[i].fx.custom({

                'opacity': [1, 0]

            })

        }



    },

    slideFx: function(item, i, show) {

        var offset = this.options.slideOffset;

        if (show) {

            this.li[i].fx.set({

                'opacity': 1,

                'left': item.offsetLeft,

                'width': item.offsetWidth

            });

            this.div[i].fx.set({

                'margin-top': offset

            });

            this.div[i].fx.custom({

                'margin-top': [offset, 0]

            })

        }

        else {

            this.div[i].fx.set({

                'margin-top': 0

            });

            this.div[i].fx.custom({

                'margin-top': [0, offset]

            })

        }



    }



});

MH2_Menu_Slick.implement(new Options);





var MH2_Menu_DD = new Class({

    initialize: function(element, options) {

        this.setOptions({

            mode: 'default',

            duration: 600,

            transition: Fx.Transitions.linear,

            wait: false

        },

        options);

        var reset = {

            'width': 0,

            'height': 0,

            'opacity': 0

        };

        switch (this.options.mode) {

        case 'width':

            reset = {

                'width': 0,

                'opacity': 0

            };

            break;

        case 'height':

            reset = {

                'height': 0,

                'opacity': 0

            };

            break

        }

        $$(element).each(function(li) {

            var ul = li.getElement('ul');

            if (ul) {

                var fx = new Fx.Styles(ul, this.options);

                var styles = ul.getStyles('width', 'height', 'opacity');

                ul.setStyles(reset);

                li.addEvents({

                    mouseenter: function() {

                        var parent = li.getParent();

                        if (parent.getStyle('overflow') == 'hidden') parent.setStyle('overflow', 'visible');

                        fx.element.setStyle('overflow', 'hidden');

                        fx.element.setStyle('opacity', '100%');

                        fx.start(styles)

                    },

                    mouseleave: function() {

                        fx.stop();

                        ul.setStyles(reset)

                    }

                })

            }

        }.bind(this))

    }

});

MH2_Menu_DD.implement(new Options);





var MH2_Menu_Slide = new Class({

    initialize: function(element, items, options) {

        this.setOptions({

            widthSliderPx: 105,

            widthSliderOpenPx: 165

        },

        options);

        var wrapper = $E(element);

        var sliders = $ES(items);

        var fx = new Fx.Elements(sliders, {

            wait: false,

            duration: 200,

            transition: Fx.Transitions.quadOut

        });

        var widthSliderPx = this.options.widthSliderPx;

        var widthSliderOpenPx = this.options.widthSliderOpenPx;

        var widthSliderCollapsedPx = parseInt(widthSliderPx - ((widthSliderOpenPx - widthSliderPx) / (sliders.length - 1)));

        sliders.each(function(slider, i) {

            slider.addEvent('mouseenter',

            function(event) {

                var o = {



};

                o[i] = {

                    width: [slider.getStyle('width').toInt(), widthSliderOpenPx]

                };

                sliders.each(function(other, j) {

                    if (i != j) {

                        var w = other.getStyle('width').toInt();

                        if (w != widthSliderCollapsedPx) o[j] = {

                            width: [w, widthSliderCollapsedPx]

                        }



                    }



                });

                fx.start(o)

            })

        });

        wrapper.addEvent('mouseleave',

        function(event) {

            var o = {



};

            sliders.each(function(slider, i) {

                o[i] = {

                    width: [slider.getStyle('width').toInt(), widthSliderPx]

                }



            });

            fx.start(o)

        })

    }



});

MH2_Menu_Slide.implement(new Options);





var MH2_Morph = new Class({

    initialize: function(element, enter, leave, enterFx, leaveFx, elementFx) {

        this.setOptions({

            duration: 200,

            transition: Fx.Transitions.expoOut,

            wait: false,

            ignoreClass: ''

        },

        enterFx);

        var options = this.options;

        $$(element).each(function(el, i) {

            var elfx = el;

            if (elementFx) {

                elfx = el.getElement(elementFx)

            }

            var fx = new Fx.Styles(elfx, options);

            if (! ($chk(options.ignoreClass) && el.hasClass(options.ignoreClass))) {

                el.addEvent('mouseenter',

                function(e) {

                    fx.setOptions(options, enterFx).start(enter)

                });

                el.addEvent('mouseleave',

                function(e) {

                    fx.setOptions(options, leaveFx).start(leave)

                })

            }



        })

    }

});

MH2_Morph.implement(new Options);



function sfHover(selector) {

    $ES(selector).each(function(element) {

        element.addEvents({

            mouseenter: function() {

                element.addClass('sfhover')

            },

            mouseleave: function() {

                element.removeClass('sfhover')

            }

        })

    })

}



function loadIE6Fix() {

	sfHover('#menu span.separator');

	sfHover('#menu li');

}



window.addEvent('domready', MH2_Tools.start);



if (window.ie6) {

	window.addEvent('domready', loadIE6Fix);

}