var AJAX=ROOT+'/'+CONTROLLER+'/ajax/';
window.addEvent('domready', function(){
	window.bubbleBoardScroller=new Fx.Scroll($('bubble-board'));

	bubbleInput=$('bubble-input');
	bubbleInput.setStyle('color', '#999999');
	window.startMessage=bubbleInput.value;
	bubbleInput.addEvent('focus', function(){
		if(this.value==window.startMessage){
			bubbleInput.setStyle('color', '#444444');
			this.value='';
			window.startMessage=false;
		}
	});
	bubbleEmail=$('bubble-email');
	bubbleEmail.setStyle('color', '#999999');
	window.emailStartMessage=bubbleEmail.value;
	bubbleEmail.addEvent('focus', function(){
		if(this.value==window.emailStartMessage){
			bubbleEmail.setStyle('color', '#444444');
			this.value='';
			window.emailStartMessage=false;
		}
	});

	$('bubble-send').addEvent('click', function(){
		if(bubbleInput.value==window.startMessage || bubbleInput.value.trim()==''){
			alert('You must type a message!');
		} else if(bubbleEmail.value==window.emailStartMessage || bubbleEmail.value.trim()==''){
			alert('You must enter your email address!');
		} else  if(!/\w{1,}[@][\w\-]{1,}([.]([\w\-]{1,})){1,3}$/.test(bubbleEmail.value)){
			alert("You must enter a valid email address");
		} else {
			bubbleInfo={content:bubbleInput.value, email:bubbleEmail.value};
			bubbleInput.value="\n\n          Please Wait...";
			bubbleInput.disabled=true;
			new Request.JSON({
				url:AJAX+'addbubble',
				onComplete:function(data){
					newBubbleElement=new Element('LI');
					newBubbleElement.className=data.bubbleClass;
					newBubbleElement.setStyles({
						'left':data.x+"px",
						'top':data.y+"px"
					});
					newSpan=new Element('SPAN');
					newSpan.innerHTML=(data.content);
					newSpan.injectInside(newBubbleElement);
					newBubbleElement.injectInside($('bubble-list'));
					centerAlign();
					newBubbleElement.setStyle('opacity', 0);
					new Fx.Scroll($('bubble-board'), {
						duration:1000,
						onComplete:function(){
							bubbleInput.value="";
							bubbleInput.disabled=false;
							new Fx.Tween(newBubbleElement, {duration:1000}).start('opacity', 1);
						}
					}).toElement(newBubbleElement);

				}
			}).post(bubbleInfo);
		}
	});

	if(!Browser.Engine.trident){
		$('scrollbar-container').setStyle('display', 'block');
		$('bubble-board').setStyle('overflow', 'hidden');
	}

});

window.addEvent('load', function(){
	centerAlign();
	el=$('scrollbar-container');
	window.mySlider=new Slider(el, el.getElement('#scroller'), {
		steps:200,
		wheel:true,
		onChange:function(value){
			bubbles=$$('#bubble-list li');
			rightMost=bubbles[bubbles.length-1];
			rightValue=parseInt(rightMost.getStyle('left'));
			window.bubbleBoardScroller.set((rightValue/200)*value);
		}
	});
});

function centerAlign(){
	spans=$$('.bubble span')
	$$('#bubble-board ul li').each(function(myBubble, index){
		mySpan=spans[index];
		if(mySpan){
			diff=(parseInt(myBubble.getStyle('height'))-mySpan.getHeight());
			marginHeight=(diff/2).toInt();
			mySpan.setStyle('margin-top', marginHeight);
		}
	});
}