SUI.util.spruzMain = {
	scrollTo: function(child,container,options){
		
		var getTop = function(el){
			var curtop = 0;
			if (el.offsetParent){
				while (el.offsetParent){
					curtop += el.offsetTop
					el = el.offsetParent;
				}
			}
			else if(el.y){
				curtop += el.y;
			}
			return curtop;
		};
		var Dom = YAHOO.util.Dom;
		//child = typeof child == 'string' ? document.getElementById(child) : child;
		//container = typeof container == 'string' ? document.getElementById(container) : container;
		var scrollend = getTop(child) - getTop(container);
		var cur = getTop(container);
		//var scrollend = Dom.getY(child) - Dom.getY(container);
		//document.title = scrollend +', '+ SUI.util.spruzMain.createPhraseAnimate.i + ', ' + child.innerHTML;
		
		var scrAnim1 = new YAHOO.util.Scroll(container, {scroll: { by: [800,0] } }, 0.5, YAHOO.util.Easing.elasticIn);
		var scroll = function(){
			container.scrollTop = scrollend;
			var scrAnim2 = new YAHOO.util.Scroll(container, {scroll: { by: [-800,0] } }, 0.5, YAHOO.util.Easing.elasticOut);
			scrAnim2.onComplete.subscribe(function(){
				options.callback();
			});
			scrAnim2.animate();
		};
		scrAnim1.onComplete.subscribe(function(){
			scroll();
		});
		
		scrAnim1.animate();
		/*
		var scrAnim1 = new YAHOO.util.Anim(container, {opacity: { to: [0] } }, 0.5);
		var scroll = function(){
			container.scrollTop = scrollend;
			var scrAnim2 = new YAHOO.util.Scroll(container, {opacity: { to: [100] } }, 0.5);
			scrAnim2.onComplete.subscribe(function(){
				options.callback();
			});
			scrAnim2.animate();
		};
		scrAnim1.onComplete.subscribe(function(){
			scroll();
		});
		
		scrAnim1.animate();
		*/
		
		
	},
	createPhraseAnimate: function(){
		if(document.getElementById('create-yourown')){
			
			//alert(children.length);
			SUI.util.spruzMain.createPhraseAnimate.i=0;
			SUI.util.spruzMain.createPhraseAnimate.start = function(){
				var container = document.getElementById('create-yourown');
				var i = SUI.util.spruzMain.createPhraseAnimate.i;
				
				var start = SUI.util.spruzMain.createPhraseAnimate.start;
				if(container.getElementsByTagName('span')[SUI.util.spruzMain.createPhraseAnimate.i+1]){
					SUI.util.spruzMain.createPhraseAnimate.i++;
					var fun = function(){
						SUI.util.spruzMain.scrollTo(container.getElementsByTagName('span')[SUI.util.spruzMain.createPhraseAnimate.i],container,{callback:start});
					};
					
					setTimeout(fun,4000);
					
				}
				else{
					//alert('yousuck');
					SUI.util.spruzMain.createPhraseAnimate.i = 0;
					var fun = function(){
						SUI.util.spruzMain.scrollTo(container.getElementsByTagName('span')[SUI.util.spruzMain.createPhraseAnimate.i],container,{callback:start});
					};
					
					setTimeout(fun,4000);
					
				}
			};
			setTimeout(SUI.util.spruzMain.createPhraseAnimate.start,3000);
		}
	},
	drawSlides: function(){
		if(document.getElementById('spruz-slides')){
			var Store = {
				tabs:[],
				slides:[]
			};
			
			SUI.util.spruzMain.drawSlides.store = Store;
			var Dom = YAHOO.util.Dom,
				canvas = document.getElementById('spruz-slides');
			var table = '<table border="0" cellspacing="0" cellpadding="0" height="250" width="780">'+
							'<tr>'+
								'<td><img src="user/67429/images/design/slides/flexibility-tab.jpg" alt="" height="250" width="30" border="0" /></td>'+
								'<td class="slide"><img src="user/67429/images/design/slides/flexibility2.jpg" alt="" height="250" width="660" border="0" /></td>'+
								'<td><img src="user/67429/images/design/slides/power-tab.jpg" alt="" height="250" width="30" border="0" /></td>'+
								'<td class="slide"><img src="user/67429/images/design/slides/power.jpg" alt="" height="250" width="0" border="0" /></td>'+
								'<td><img src="user/67429/images/design/slides/freedom-tab.jpg" alt="" height="250" width="30" border="0" /></td>'+
								'<td class="slide"><img src="user/67429/images/design/slides/freedom.jpg" alt="" height="250" width="0" border="0" /></td>'+
								'<td><img src="user/67429/images/design/slides/originality-tab.jpg" alt="" height="250" width="30" border="0" /></td>'+
								'<td class="slide"><img src="user/67429/images/design/slides/originality.jpg" alt="" height="250" width="0" border="0" /></td>'+
							'</tr>'+
						'</table>';
			var tcont = document.createElement('div');
			tcont.innerHTML = table;
			
			var flipSlide = function(id){
				var mult = 1;
				clearInterval(Store.interval);
				var actvImg = document.getElementById(id).getElementsByTagName('img')[0];
				actvImg.style.display = 'block';
				
				var animFrame = function(){
					var step = 4*mult;
					mult = mult*2;
					var fulW = 660;
					
					var actvWidth = Dom.getStyle(actvImg,'width').replace('px','')*1;
					
					if(actvWidth<fulW - step){
						Dom.setStyle(actvImg,'width',actvWidth + step+'px');
						(function(){
							var toClose = [];
							var xN = 0;
							for(var i=0;Store.slides[i];i++){
								if(Store.slides[i]!=id){
									var node = document.getElementById(Store.slides[i]).getElementsByTagName('img')[0];
									var nWidth = Dom.getStyle(node,'width').replace('px','')*1;
									if(Dom.getStyle(node,'display')!='none'){
										toClose.push([node,nWidth]);
									}
									else{
										Dom.setStyle(node,'width','0px');
									}
								}
							}
							while(step>0){
								if(toClose[xN]){
									if(toClose[xN][1] > 0){
										toClose[xN][1]--;
										step--;
									}
									else{
										xN++;
									}
								}
								else{
									xN = 0;
								}
								var left = 0;
								for(var i=0;toClose[i];i++){
									left = left + toClose[i][1];
								}
								if(left == 0){
									step = 0;
								}
							}
							for(var i=0;toClose[i];i++){
								if(toClose[i][1]>0){
									Dom.setStyle(toClose[i][0],'width',toClose[i][1]+'px');
								}
								else{
									Dom.setStyle(toClose[i][0],'width','0px');
									Dom.setStyle(toClose[i][0],'display','none');
								}
							}
						})();
					}
					else{
						Dom.setStyle(actvImg,'width',fulW+'px');
						for(var i=0;Store.slides[i];i++){
							if(Store.slides[i]!=id){
								var node = document.getElementById(Store.slides[i]).getElementsByTagName('img')[0];
								var nWidth = Dom.getStyle(node,'width').replace('px','')*1;
								if(Dom.getStyle(node,'display')!='none'){
									Dom.setStyle(node,'width','0px');
									Dom.setStyle(node,'display','none');
								}
								else{
									Dom.setStyle(node,'width','0px');
								}
							}
						}
						clearInterval(Store.interval);
					}
				}
				Store.interval = setInterval(animFrame,30);
			};
			
			(function(){
				var tds = tcont.getElementsByTagName('td');
				var ran = Math.floor(Math.random()*(tds.length/2));
				for(var i=0;tds[i];i++){
					tds[i].id = 'SPRUZ-Slides-n'+i;
					if(tds[i].className == 'slide'){
						SUI.util.spruzMain.drawSlides.store.slides.push(tds[i].id);
						if(i==(ran*2)+1){
							tds[i].getElementsByTagName('img')[0].style.cssText = 'width: 660px; height: 250px; display: block;';
						}
						else{
							tds[i].getElementsByTagName('img')[0].style.cssText = 'width: 0px; height: 250px; display: none;';
						}
					}
					else{
						SUI.util.spruzMain.drawSlides.store.tabs.push(tds[i].id);
						tds[i].onmouseover = function(){
							for(var x=0;SUI.util.spruzMain.drawSlides.store.tabs[x];x++){
								if(SUI.util.spruzMain.drawSlides.store.tabs[x] == this.id){
									flipSlide(SUI.util.spruzMain.drawSlides.store.slides[x]);
									break;
								}
							}
							
						}
					}
				}
			})();
			canvas.innerHTML = '';
			canvas.appendChild(tcont);
		}
	},
	flavorInit: function(){
		var Dom = YAHOO.util.Dom,
			Event = YAHOO.util.Event;
		SUI.util.spruzMain.flavorInit.store = {};
		if(Dom.get('SPRUZ-Choose-Flavor')){
			var canvas = Dom.getAncestorByClassName('SPRUZ-Choose-Flavor','element-container'),
				message = Dom.get('SPRUZ-Choose-Flavor').innerHTML,
				dw=247,dh=192,
				flavors=[];
			canvas.innerHTML = '';
			canvas.className = '';
			canvas.style.cssText = 'display: block; height: 440px; position: relative; z-index: 1; background: url(http://spruz.com/user/67429/images/design/round-shadow.jpg) no-repeat center bottom;';
			
			(function(){
				var f = Dom.get('SPRUZ-Flavors').getElementsByTagName('a');
				for(var i=0;f[i];i++){
					flavors.push({
						url: f[i].href,
						label: f[i].innerHTML,
						title: f[i].title
					});
				}
			})();
			//SUI.util.spruzMain.flavors = flavors;
			Dom.getAncestorByClassName('SPRUZ-Flavors','element-container').style.display = 'none';
			//http://spruz.com/user/67429/images/design/spruzdrink.png
			//http://spruz.com/user/67429/images/design/flavorbutton.png
			//http://spruz.com/user/67429/images/design/round-shadow.jpg
			Event.onContentReady(canvas.id,function(){
				var pos = [
					{top:{by:-120},left:{by:-230}}, // tl
					{top:{by:-170}},				// t
					{top:{by:-120},left:{by:230}},	// tr
					{left:{by:300}},				// r
					{top:{by:120},left:{by:230}},	// br
					{top:{by:170}},					// b
					{top:{by:120},left:{by:-230}},	// bl
					{left:{by:-300}}				// l
				];
				var getColor = function(){
					var c = ['0','1','2','3','4','5','6','7','8','9','a','b','c','d','e','f'],
						r = '';
						for(var i=0;i<6;i++){
							r = r+c[Math.round(Math.random()*14)];
						}
						return '#'+r;
				};
				SUI.util.spruzMain.flavorInit.store.message = 'Choose <strong style="color: #000;">your</strong> flavor...';
				var holder = document.createDocumentFragment();
				(function(){// Draw Drink
					var drink = document.createElement('div');
					drink.style.cssText = 'position: absolute; width: '+dw+'px; height: '+dh+'px; top: '+Math.round((canvas.offsetHeight/2)-(dh/2)-40)+'px; left: '+Math.round((canvas.offsetWidth/2)-(dw/2))+'px;'+
						'background: transparent url(http://spruz.com/user/67429/images/design/spruzdrink.png) no-repeat; z-index: 2;';
					var mes = document.createElement('div');
					mes.style.cssText = 'font-family: arial; font-size: 14px; color: #939393; position: absolute; z-index: 3; width: '+(dw-30)+'px; top: '+Math.round((canvas.offsetHeight/2)+(dh/2)-40)+'px; left: '+Math.round((canvas.offsetWidth/2)-(dw/2)+15)+'px;';
					mes.innerHTML = SUI.util.spruzMain.flavorInit.store.message;
					mes.id = 'SPRUZ-Flavor-Message';
					holder.appendChild(drink);
					holder.appendChild(mes);
				})();
				
				for(var i=0;flavors[i];i++){
					var c1 = document.createElement('div'), // Absolute Container
						c2 = document.createElement('div'), // Relative Container
						sk = document.createElement('div'), // Skin
						lk = document.createElement('a'); // Link
					c1.className = 'SPRUZ-Flavor';
					c1.style.cssText = 'background-color: '+getColor()+'; position: absolute; top: '+Math.round((canvas.offsetHeight/2)-(64/2)-20)+'px; left: '+Math.round((canvas.offsetWidth/2)-(163/2))+'px;';
					c1.id = 'SPRUZ-Flavor'+i;
					c2.className = 'inner';
					sk.className = 'skin';
					lk.href = flavors[i].url;
					lk.setAttribute('m',flavors[i].title);
					lk.innerHTML = flavors[i].label;
					lk.onmouseover = function(){
						document.getElementById('SPRUZ-Flavor-Message').innerHTML = this.getAttribute('m');
					}
					lk.onmouseout = function(){
						document.getElementById('SPRUZ-Flavor-Message').innerHTML = SUI.util.spruzMain.flavorInit.store.message;
					}
					c2.appendChild(sk);
					c2.appendChild(lk);
					c1.appendChild(c2);
					holder.appendChild(c1);
				}
				canvas.appendChild(holder);
				for(var i=0;flavors[i];i++){
					SUI.util.spruzMain.flavorInit.store['anim'+i] = new YAHOO.util.Motion('SPRUZ-Flavor'+i,pos[i]);
					//setTimeout(function(){SUI.util.spruzMain.flavorInit.store['anim'+i].animate()},100);
					SUI.util.spruzMain.flavorInit.store['anim'+i].animate();
				}
			});
		}
	}
};
SUI.util.spruzMain.createPhraseAnimate();
SUI.util.spruzMain.drawSlides();
SUI.util.spruzMain.flavorInit();
if(document.getElementById('SPRUZ-CreateStart-button')){
	document.getElementById('SPRUZ-CreateStart-button').parentNode.style.cssText = '';
}