var portfolio_items;
var numitems;
var currentPortfolioItem = 1;
var tags = new Array();
var portfolio_tagged = new Object();

var portfolio_paused = 1;
var portfolio_hold_time = 5000;
var portfolio_timer;

var controls = new Element('div', {	'id': 'controls' });
var next = new Element('span', { 'class': 'next' });
var playpause = new Element('span', { 'class': 'playpause pause' });
var previous = new Element('span', { 'class': 'previous' });

Array.prototype.getUnique = function () {
	var o = new Object();
	var i, e;
	for (i = 0; e = this[i]; i++) {o[e] = 1};
	var a = new Array();
	for (e in o) {a.push (e)};
	return a;
}

function portfolio_prv() {

	var prv = currentPortfolioItem;
	do {
		prv--;
		if(prv < 1) prv = numitems;
	} while($('pFx'+prv).getStyle('display')=='none');
		
	var imageHolder = $('pFx'+prv).getElement('div.image img');
	if(imageHolder.get('src')==imageBlankSrc) {
		imageHolder.setProperty('src', portfolio_images[prv]);
	}

	$('pFx'+currentPortfolioItem).morph({ left: 962 });
	$('pFx'+prv).morph({ left: [-962, 0] });
	currentPortfolioItem = prv;

	for(var i=0; i<onlyPreload; i++) {
		prv = prv-1;
		if(prv < 1) prv = numitems;
		imageHolder = $('pFx'+prv).getElement('div.image img');
		if(imageHolder.get('src')==imageBlankSrc) {
			imageHolder.setProperty('src', portfolio_images[prv]);
		}
	}

}

function portfolio_nxt() {

	var nxt = currentPortfolioItem;
	do {
		nxt++;
		if(nxt > numitems) nxt = 1;
	} while($('pFx'+nxt).getStyle('display')=='none');

	var imageHolder = $('pFx'+nxt).getElement('div.image img');
	if(imageHolder.get('src')==imageBlankSrc) {
		imageHolder.setProperty('src', portfolio_images[nxt]);
	}

	$('pFx'+currentPortfolioItem).morph({ left: -962 });
	$('pFx'+nxt).morph({ left: [962, 0] });
	currentPortfolioItem = nxt;

	for(var i=0; i<onlyPreload; i++) {
		nxt = nxt+1;
		if(nxt > numitems) nxt = 1;
		imageHolder = $('pFx'+nxt).getElement('div.image img');
		if(imageHolder.get('src')==imageBlankSrc) {
			imageHolder.setProperty('src', portfolio_images[nxt]);
		}
	}

}

function portfolio_play() {
	portfolio_paused = 0;
	portfolio_timer = portfolio_nxt.periodical(portfolio_hold_time);
	$('controls').getElement('span.playpause').removeClass('pause');
	$('controls').getElement('span.playpause').addClass('play');
}


window.addEvent('domready', function() {
	
	portfolio_items = $('portfolio').getElements('div.view');
	numitems = portfolio_items.length;

	$each(portfolio_items, function(view, index){
		view.set('id', 'pFx'+(index+1));
		view.set('morph', {	duration: 'long', transition: Fx.Transitions.Quad.easeInOut });
		view.setStyle('position', 'absolute');
		view.setStyle('left', -962);
		if(index == 0) {
			view.setStyle('left', 0);
		}
		var itemtags = view.getElements('dl.metadata dd');
		$each(itemtags, function (itemtag, idx) {
			tags.push(itemtag.get('html'));
			if(portfolio_tagged[itemtag.get('html')] == undefined) {
				portfolio_tagged[itemtag.get('html')] = new Array();
				portfolio_tagged[itemtag.get('html')]['total'] = 0;
			}
			portfolio_tagged[itemtag.get('html')][index+1] = 'pFx'+(index+1);
			portfolio_tagged[itemtag.get('html')]['total']++;
		});
	});
	
	var categoryselector = new Element('select', { 'id': 'filter' });
	var showall = '';
	for (key in portfolio_tagged) {
		if(showall=='' && portfolio_tagged[key]['total']==numitems) {
			categoryselector.grab(new Element('option', {'value': key, 'html': 'Show all categories ('+portfolio_tagged[key]['total']+')', 'selected': 'selected'}));
			showall = key;
		} else {
			categoryselector.grab(new Element('option', {'value': key, 'html': 'Show '+key+' ('+portfolio_tagged[key]['total']+')'}));
		}
	}

	if(tags.getUnique().length>1) $('article').grab(categoryselector);
	$('article').grab(controls);
	$('controls').grab(previous);
	$('controls').grab(playpause);
	$('controls').grab(next);
	$('controls').setStyle('background-image', 'none');

	categoryselector.addEvent('change', function (e) {
		e.stop();
		var show_category = this.value;
		var this_view = 0;
		var first_view = '';
		$each(portfolio_items, function (view, index) {
			if(portfolio_tagged[show_category][index+1]==undefined) {
				view.setStyle('display', 'none');
			} else {
				if(first_view=='') {
					$('pFx'+currentPortfolioItem).setStyle('left', -962);
					view.setStyle('left', 0);
					var imageHolder = view.getElement('div.image img');
					if(imageHolder.get('src')==imageBlankSrc) {
						imageHolder.setProperty('src', portfolio_images[index+1]);
					}
					first_view = view.get('id');
					currentPortfolioItem = index+1;
				}
				view.setStyle('display', 'block');
				this_view++;
				view.getElement('span.counter').set('html', '<span class="this">'+this_view+'</span>/'+portfolio_tagged[show_category]['total']);
			}
		});

	});

	previous.addEvent('click', function(e){
		e.stop();
		if(portfolio_paused == 0) {
			$clear(portfolio_timer);
			portfolio_timer = portfolio_nxt.periodical(portfolio_hold_time);
		}
		portfolio_prv();
	});
	next.addEvent('click', function(e){
		e.stop();
		if(portfolio_paused == 0) {
			$clear(portfolio_timer);
			portfolio_timer = portfolio_nxt.periodical(portfolio_hold_time);
		}
		portfolio_nxt();
	});
	playpause.addEvent('click', function(e){
		e.stop();
		if(portfolio_paused == 0) {
			portfolio_paused = 1;
			$clear(portfolio_timer);
			this.removeClass('play');
			this.addClass('pause');
		} else {
			portfolio_paused = 0;
			portfolio_nxt();
			portfolio_timer = portfolio_nxt.periodical(portfolio_hold_time);
			this.removeClass('pause');
			this.addClass('play');
		}
	});

});
window.addEvent('load', function() {
	portfolio_play();
});