(function()
{
	Common.Object.create('Typical.Chat.WindowBarButton', {

		mainBar : null,
		window 	: null,
		
		element : null,
		backgroundElement : null,
		
		onResize : null,
		
		WindowBarButton : function(mainBar, window)
		{
			this.mainBar 	= mainBar;
			this.window 	= window;
			
			this.onResize = new Common.Dispatcher();
			
			this.initGUI();
			this.propagateSize();

			this.window.onUnfocussedActivity.add(this.startHighlighting, this);
			this.window.onTitleUpdate.add(this.handleTitleUpdate, this);
			this.window.onFocus.add(this.handleWindowFocus, this);
			this.window.onBlur.add(this.setBlurred, this);
		},
		
		propagateSize : function()
		{
			if(!this.element.parentNode || !this.element.parentNode.parentNode)
				setTimeout(this.propagateSize.bind(this), 10);
				
			else
				this.onResize.dispatch.curry(this).bind(this.onResize).defer();
		},
		
		initGUI : function()
		{
			// Build window button.
			this.element = Builder.node('div', {'class' : 'typical chat windowbarbutton'});
			{
				// Build background.
				this.backgroundElement = Builder.node('div', {'class' : 'windowbackground'});
				{
					Element.setOpacity(this.backgroundElement, 0);
				}
				Element.insert(this.element, this.backgroundElement);
				
				// Build content.
				var contentElement = Builder.node('div', {'class' : 'content'});
				{
					// Build icon.
					Element.insert(contentElement, Builder.node('img', {'class' : 'icon', src : Config.baseUrl + 'external/image/typical/chat/' + this.window.getIcon()}));
					
					// Build title.
					this.windowTitleElement = Builder.node('div', {'class' : 'title'});
					{
						this.windowTitleElement.innerHTML = this.window.getTitle();
					}
					Element.insert(contentElement, this.windowTitleElement);
					
					// Build close control?
					if(!this.window.isPrimary())
					{
						var closeElement = Builder.node('img', {src : Config.baseUrl + 'external/image/typical/chat/mainbar/close.png', 'class' : 'close'});
						{
							Event.observe(closeElement, 'mousedown', this.closeWindow.bind(this));
						}
						Element.insert(contentElement, closeElement);
					}
				}
				Element.insert(this.element, contentElement);
				
				this.setBlurred();
				
				// Listen for interaction.
				Event.observe(this.element, 'mouseover', 	this.setHovered.bindAsEventListener(this));
				Event.observe(this.element, 'mouseout',		this.handleMouseOut.bindAsEventListener(this));
				Event.observe(this.element, 'mousedown',	this.handleClick.bindAsEventListener(this));
			}
			
			// IE9 no-render bugfix.
			setInterval(function()
			{
				if(this.element)
				{
					var oldColor = Element.getStyle(this.element, 'color');
					
					Element.setStyle(this.element, { color : 'black'});
					
					Element.setStyle(this.element, { color : oldColor});
				}
			}.bind(this), 100);
		},
		
		closeWindow : function()
		{
			this.window.close();
			
			Event.stopObserving(this.element, 'mousedown');
		},
		
		getWindowOverlap : function()
		{
			return { right : document.viewport.getWidth() - Element.cumulativeOffset(this.element)[0] + 10, width : Element.getWidth(this.element) + 20};
		},
		
		handleTitleUpdate : function()
		{
			this.windowTitleElement.innerHTML = this.window.getTitle();
			
			this.onResize.dispatch(this);
		},
		
		handleWindowFocus : function()
		{
			this.stopHighlightinging();
			this.setFocussed();
		},
		
		handleClick : function()
		{
			if(this.window.isFocussed)
				this.window.blur();
				
			else
				this.window.focus();
		},
		
		handleMouseOut : function()
		{
			if(!this.window.isFocussed)
				this.setBlurred();
		},
		
		setHovered : function()
		{
			Element.setOpacity(this.element, 1);
		},
		
		setFocussed : function()
		{
			Element.addClassName(this.element, 'focussed');
			
			Element.setOpacity(this.element, 1);	
		},
		
		setBlurred : function()
		{
			Element.removeClassName(this.element, 'focussed');
			
			Element.setOpacity(this.element, 0.75);
		},
		
		startHighlighting : function()
		{
			if(this.window.isFocussed)
				return;
			
			if(this.lastHighlightEffect)
				this.lastHighlightEffect.cancel();
			
			this.lastHighlightEffect = new Effect.Pulsate(this.backgroundElement, { pulses : 3, duration : 2, from : 0, to : 0.5,
							   							transition : Effect.Transitions.reverse, afterFinish : function()
														{
															this.lastHighlightEffect = new Effect.Opacity(this.backgroundElement, { from : 0, to : 0.5, duration : 2 / 3 / 2 });
														}.bind(this)});
		},
		
		stopHighlightinging : function()
		{
			if(this.lastHighlightEffect)
				this.lastHighlightEffect.cancel();
			
			if(Element.getOpacity(this.backgroundElement) == 0)
				return;
			
			this.lastHighlightEffect = new Effect.Opacity(this.backgroundElement, { from : Element.getOpacity(this.backgroundElement), to : 0, duration : 2 / 3 / 2 });	
		}
		
	});
})();