/**
 * Portlets
 */

function PortletArticleGet(el)
{
	//nav is in DIV.Group-Content-Nav; this finds the previous DIV.Articles-Content sibling
	el = el.parentNode;
	while(el.previousSibling)
	{
		el =  el.previousSibling;
		if(el.nodeName == 'DIV' && el.className == 'Articles-Content')
			return el;
	}
	return false;
}

function PortletArticleHighlightIndex(el,i)
{
	var cn = el.parentNode.childNodes;
	for(var j=2;j<cn.length; j++)//skip first 2, Next & Prev links
		cn[j].removeClass('On');
	if(i+2 < cn.length-1)
		cn[i+2].addClass('On');
}

function PortletArticleGoTo(el,i,w)//element,position,width
{
	PortletArticleHighlightIndex(el,i);
	el = PortletArticleGet(el);
	if(el) el.style.marginLeft = (i == 0)? '0':'-'+(i*w)+'px';
}

function PortletArticleNext(el,n,w)//element,count,width
{
	var nav_el = el;
	el = PortletArticleGet(el);
	if(el)
	{
		var m = el.style.marginLeft? parseInt(el.style.marginLeft):0;
		el.style.marginLeft = (m == -((n-1)*w))? '0':(m-w)+'px';
		
		m = parseInt(el.style.marginLeft);
		var i = 0;
		while(m < 0)
		{
			m = m+w;
			i++;
		}
		PortletArticleHighlightIndex(nav_el,i);
	}
}

function PortletArticlePrev(el,n,w)//element,count,width
{
	var nav_el = el;
	el = PortletArticleGet(el);
	if(el)
	{
		var m = el.style.marginLeft? parseInt(el.style.marginLeft):0;
		el.style.marginLeft = (m == 0)? '-'+((n-1)*w)+'px':(m+w)+'px';
		
		m = parseInt(el.style.marginLeft);
		var i = 0;
		while(m < 0)
		{
			m = m+w;
			i++;
		}
		PortletArticleHighlightIndex(nav_el,i);
	}
}

function PortletArticleTitleStyles(toggler,el)
{
	var H3s = toggler.parentNode.parentNode.getElements('H3');
	for(var i=0; i<H3s.length; i++)
		H3s[i].removeClass('Accordian-Control-Active');
	toggler.getElement('H3').addClass('Accordian-Control-Active');
}
					
function PortletArticleFlashHide(toggler,el)
{
	var F = toggler.parentNode.parentNode.getElements('.Flash');
	for(var i=0; i<F.length; i++)
		F[i].style.visibility = 'hidden';
}

function PortletArticleFlashShow(toggler,el)
{
	var F = toggler.parentNode.parentNode.getElements('.Flash');
	for(var i=0; i<F.length; i++)
		F[i].style.visibility = 'visible';
}

window.addEvent('domready', function() { 

	$$('.Portlets .Portlet').each(function(el,n) {

		//Make sub navigation like this:
		/*
			<div class="Group-Content-Nav">
				//next and previous buttons
				<a href="javascript:PortletArticleNext()" class="Next">Next</a>
				<a href="javascript:PortletArticlePrev()" class="Previous">Previous</a>
				//page buttons
				<a href="javascript:PortletArticleGoTo(this,0,225)">1</a>
				<a href="javascript:PortletArticleGoTo(this,1,225)">2</a>
				<a href="javascript:PortletArticleGoTo(this,2,225)">3</a>
				// etc.
				// View more button
				<a href="..." class="All">All foo</a>
			</div>
		*/

		
		el.getElements('.Group-Content').each(function(GroupContent,GroupContentN) {

		
			var ArticlesBox = GroupContent.getElement('.Articles');
			if(ArticlesBox)
			{
				var w = GroupContent.getSize().x;
				//w = 225;//HACK: (for safari)
				
				var nav = new Element('div', { });
					nav.className = 'Group-Content-Nav';
				var Articles = GroupContent.getElements('.Article');
				if(Articles.length > 1)
				{
					// ".grab" is from Mootools, grabs and drops element into itself
					var Next = new Element('a', { });
						Next.className = 'Next';
						Next.w = w;
						Next.n = Articles.length;
						Next.onclick = function() { PortletArticleNext(this,this.n,this.w); };
					nav.grab( Next );
					var Prev = new Element('a', { });
						Prev.className = 'Previous';
						Prev.w = w;
						Prev.n = Articles.length;
						Prev.onclick = function() { PortletArticlePrev(this,this.n,this.w); };
					nav.grab( Prev );
					for(var i=0;i<Articles.length;i++)
					{
						var A = new Element('a', { html:(i+1) });
							A.i = i;
							A.w = w;
							A.onclick = function() { PortletArticleGoTo(this,this.i,this.w); };
							if(i==0)
								A.className = 'First On';
						nav.grab( A );
					}
					
					//Add "view all" link to articles nav
					var MoreLink = GroupContent.getElement('.More-Link');
					if(MoreLink)
					{
						MoreLink.dispose();
						MoreLink = MoreLink.innerHTML;
						var Span = new Element('span');
							Span.innerHTML = MoreLink;
							Span.className = 'More-Link';
						nav.grab( Span );
					}
					
					var Span = new Element('span');
						Span.innerHTML = '&nbsp;'
						Span.className = 'Float-Break';
					nav.grab( Span );
					ArticlesBox.grab(nav);
				}
			}
		});

		if(el.hasClass('Accordion'))
		{
			$$('#'+el.id+' div.Group-Title h3').each(function(H3,i) {
				H3.style.cursor = 'pointer';
				H3.className = 'Accordian-Control';
			});

			//Apply accordion effect (after above because of dynamic height calculations of .Articles)
			el.Accordion = new Accordion($$('#'+el.id+' div.Group-Title'), $$('#'+el.id+' div.Group-Content'), { 
				opacity: false,
				onActive: function(toggler,element) {
					PortletArticleTitleStyles(toggler,element);
					PortletArticleFlashHide(toggler,element);
				},
				onComplete: function(toggler,element) {
					PortletArticleFlashShow(toggler,element);
				}
			});
		}
		
	});

});