Titles = function() {
	this.Services = $('.services');

	this.init();
}

Titles.prototype = {
	ANIM_DURATION : 'fast',

	init: function() {
		this.initList();
	},

	initList: function() {
		var oThis = this;

		this.Services.find("a, b").each(
			function(i){
				var oIcon = new TitlesIcon($(this), i, oThis);
			}
		);
	},

	initTitlesAppearance : function(){
		this.each(
			function(){
				this.initAppearance();
			}
		);
	}
}

TitlesIcon = function(oIcon, id, oTitles){
	this.oIcon = oIcon;
	this.id = id;
	this.oTitles = oTitles;

	this.init();
}

TitlesIcon.prototype = {
	IS_ANIMATE: false,

	init : function(){
		this.jTitle = this.oIcon.find("span.e");
		this.attachEvents();
	},

	attachEvents : function(){
		var oThis = this;

		this.oIcon.hover(
			function(){
				oThis.bOut = false;
				if(!oThis.IS_ANIMATE){
					oThis.open();
				}
			},
			function(){
				oThis.bOut = true;

				if(!oThis.IS_ANIMATE){
					oThis.close();
				}
			}
		);
	},

	open: function(){
		var oThis = this;
		this.IS_ANIMATE = true;

		this.jTitle.animate({width: '125px'}, this.oTitles.ANIM_DURATION, function() {
			oThis.IS_ANIMATE = false;

			if(oThis.bOut){
				oThis.close();
			}
		});
	},

	close: function(){
		var oThis = this;
		this.IS_ANIMATE = true;

		this.jTitle.animate({width: 0}, this.oTitles.ANIM_DURATION, function() {
			oThis.IS_ANIMATE = false;
		});
	}


}

$(document).ready(
	function(){
		new Titles();
	}
);