var topbar = {
	toggle_combo : function() {
		var bttn = document.getElementById('topbar_combo_button');
		var menu = document.getElementById('topbar_combo_menu');
		if (menu.style.display === 'block') {
			bttn.className = undefined;
			menu.style.display = 'none';
		} else {
			bttn.className = 'active';
			menu.style.display = 'block';
		}
	},
	mouseover_button : function() {
		document.getElementById('topbar_combo_button').className = 'active';
	},
	mouseout_button : function() {
		if (document.getElementById('topbar_combo_menu').style.display === 'none') {
			document.getElementById('topbar_combo_button').className = undefined;
		}
	},
	toggle_userpanel : function() {
		var userpanel = document.getElementById('topbar_user_extend');
		if (userpanel.style.display == 'block') {
			userpanel.style.display = 'none';
		} else {
			userpanel.style.display = 'block';
		}
	},
	toggle_login : function() {
		var menu = document.getElementById('topbar_login_extend');
		var bttn = document.getElementById('topbar_login_button');
		if (menu.style.display == 'block') {
			bttn.className = 'topbar_button';
			menu.style.display = 'none';
		} else {
			bttn.className = 'topbar_button active';
			menu.style.display = 'block';
			document.getElementById('topbar_f_login_name').focus();
		}
	},
	mouseover_login : function() {
		document.getElementById('topbar_login_button').className = 'topbar_button active';
	},
	mouseout_login : function() {
		if (document.getElementById('topbar_login_extend').style.display === 'none') {
			document.getElementById('topbar_login_button').className = 'topbar_button';
		}
	},
	mouseover_bttn : function(bttn_id) {
		document.getElementById(bttn_id).className = 'topbar_button active';
	},
	mouseout_bttn : function(bttn_id) {
		document.getElementById(bttn_id).className = 'topbar_button';
	},
	helper_add_event : function(obj, event_type, fn) {
		if (obj !== undefined) {
			if (obj.addEventListener !== undefined) {
				obj.addEventListener(event_type, fn, false);
			} else if (obj.attachEvent !== undefined) {
				obj.attachEvent('on' + event_type, fn);
			}
		}
	}
};
// Make menu collapse when click outside
topbar.helper_add_event(document.body, 'click', function(e){
	var target = (e.target)? e.target : e.srcElement;
	if (target === document.getElementById('topbar_f_login_name') || 
		target === document.getElementById('topbar_f_password') ||
		target === document.getElementById('topbar_f_remember') ||
		target === document.getElementById('topbar_f_remember_label')) {
		return;
	}
	if (target !== document.getElementById('topbar_combo_button') && 
		document.getElementById('topbar_combo_menu').style.display === 'block') {
		topbar.toggle_combo();
	} else if (target !== document.getElementById('topbar_login_button') && 
		document.getElementById('topbar_login_extend') && 
		document.getElementById('topbar_login_extend').style.display === 'block') {
		topbar.toggle_login();
	} else if (target !== document.getElementById('topbar_user_button') && 
		document.getElementById('topbar_user_extend') && 
		document.getElementById('topbar_user_extend').style.display === 'block') {
		topbar.toggle_userpanel();
	} 
});

