/*
 U.Va. Institute on Aging
*/

var IOA = {

    text_size: 1,
    
    start: function () {
        if ($('tabs')) {
            IOA.parseTabs();
        } 
        
        IOA.toggleTextSize();
		IOA.flashNotice();
    },
    
    /**
     * Sliding effect on home page
     */             
    parseTabs: function () {
        var tabs = $$('#tabs li');
        var fx = new Fx.Elements(tabs, {wait: false, duration: 700, transition: Fx.Transitions.Quad.easeInOut});
        tabs.each(function(tab, i) {
            tab.addEvent('mouseenter', function (e) {
                var obj = {};
                obj[i] = {
                    'width': [tab.getStyle('width').toInt(), 636]
                };
                tabs.each(function(other, j) {
                    if (other != tab){
                        var w = other.getStyle('width').toInt();
                        if (w != 44) obj[j] = {'width': [w, 44]};
                    }
                });
                fx.start(obj);
            });
        });
        
        $('tabs').addEvent('mouseleave', function (e) {
            var obj = {};
            tabs.each(function(other, j) {
                if (tabs[j].hasClass('current')) {
                    obj[j] = {'width': [other.getStyle('width').toInt(), 636]};
                } else {
                    obj[j] = {'width': [other.getStyle('width').toInt(), 44]};
                }
            });
            fx.start(obj);
        });
    },
    
    /**
     * Set text size when user navigates between pages
     */         
    setTextSize: function () {
        if (Cookie.get("text_size")) {
            IOA.text_size = Cookie.get("text_size").toInt();
            $E('body').addClass(IOA.makeClass(IOA.text_size));
        }
    },
    
    /**
     * Make class name from text size
     * @param {Number} size Text size       
     * @return {String} 
     */                        
    makeClass: function (size) {
        return 'text' + size;
    },
    
    /**
     * Increase and decrease text size by adding classes to body element
     * Classes are defined in screen.css     
     */         
    toggleTextSize: function () {
        var body = $E('body');
        
        $$('#bar .increase').addEvent('click', function (e) {
            if (IOA.text_size < 7) {
                body.removeClass(IOA.makeClass(IOA.text_size));
                IOA.text_size++;
                body.addClass(IOA.makeClass(IOA.text_size));
                Cookie.set("text_size", IOA.text_size, {path: "/aginginstitute/", duration: 30}); 
            }
            
            var event = new Event(e).stop();
        });
        
        $$('#bar .decrease').addEvent('click', function (e) {
            if (IOA.text_size > 1) {
                body.removeClass(IOA.makeClass(IOA.text_size));
                IOA.text_size--;
                body.addClass(IOA.makeClass(IOA.text_size));
                Cookie.set("text_size", IOA.text_size, {path: "/aginginstitute/", duration: 30});
            }
            var event = new Event(e).stop();
        });
    },

	flashNotice: function () {
		var myNotice = new Fx.Styles('notice', {duration: 1000, transition: Fx.Transitions.linear });
		myNotice.start({
		    'background-color': ['#fef4af', '#FFF']
		});
	}

};

window.addEvent('domready', IOA.setTextSize);
window.addEvent('load', IOA.start);
