SPCL.miniportfolio = {
	firstRun: true,
	
	init: function(lid, category, userParams) {
		var defaultParams = {
			title: 'Portfolio',
			siteSlideNumbers: {},
			scrollDuration: 300,
			scrollDirection: 'right',
			autoScroll: true,
			path: '/common/spcomponents/miniportfolio'
		};
		
		jQuery.extend(defaultParams, userParams);
		
		if (SPCL.miniportfolio.firstRun) {
			SPCL.miniportfolio.firstRun = false;
			jQuery('head').append('<link rel="stylesheet" href="'+defaultParams.path+'/spcl.miniportfolio.css" />');
		}
		
		var obj = new SPCL_MINIPORTFOLIO_CLASS(lid, category, defaultParams);
		
		if (defaultParams.autoScroll) {
			obj.scrollTimer = setInterval(function() {
				obj.doScroll();
			}, 4000+obj.scrollDuration);
			// Start auto-scrolling
//			this.scrollTimer = setInterval(this.doScroll, 4000+this.scrollDuration);
		}
		
		return obj;
	}
};

function SPCL_MINIPORTFOLIO_CLASS(lid, category, params) {
	// If the container can't be found, don't do anything
	this.params = params;
	
	this.json = null;
	this.category = category;
	this.el_id = lid;
	this.template = null;
	this.domReady = false;
	this.SPscrollObj = null;
	
	this.scrollTimer = 0;
	this.scrollDuration = params.scrollDuration;
	this.scrollDirection = params.scrollDirection;
	
	var obj = this;
	
	// Get the template HTML
	jQuery.ajax({
		cache: false,
		dataType: 'html',
		success: function(data) { obj.onGetHtml(data); },
		url: params.path + '/spcl.miniportfolio.template.php'
	});
	
	// Get the JSON data
	jQuery.ajax({
		cache: false,
		dataType: 'json',
		data: {'category': category},
		success: function(data) { obj.onGetJson(data); },
		url: params.path + '/spcl.miniportfolio.json.php'
	});
	
	// Listen for the DOM to be ready
	jQuery(function() { obj.onDomReady(); });
}

SPCL_MINIPORTFOLIO_CLASS.prototype.onGetHtml = function(html) {
	this.template = jQuery('<div></div>').append(html);
	this.check();
}

SPCL_MINIPORTFOLIO_CLASS.prototype.onGetJson = function(json) {
	this.json = json;
	this.check();
}

SPCL_MINIPORTFOLIO_CLASS.prototype.onDomReady = function() {
	this.el_siteTitle = this.template.find('#miniPortSiteTitle');
	this.el_siteLink  = this.template.find('#miniPortSiteLink');
	this.el_siteZoom  = this.template.find('#miniPortZoom');
	
	this.domReady = true;
	this.check();
}

SPCL_MINIPORTFOLIO_CLASS.prototype.check = function() {
	var obj = this;
	
	if (this.domReady  &&  this.json != null  &&  this.template != null) { this.setup(); }
}

SPCL_MINIPORTFOLIO_CLASS.prototype.setup = function() {
	var data = [];
	var obj = this;
	
	// Prepare each site
	$.each(this.json, function() { data.push(obj.formatClient(this)); });
	
	// Initialize the scroller
	this.template.find('#miniPortContent').SPscroll({
		arrowLeft: this.template.find('#miniPortArrowLeft'),
		arrowRight: this.template.find('#miniPortArrowRight'),
		num:1,
		data: data,
		fillFn:function(clone, data) {
			clone = clone
				.css('background-image', 'url('+data.image+')')
				.attr('pptitle', data.title)
				.attr('ppdomain', data.domain)
				.attr('pptype', data.type)
				.click(function(event) { obj.stopAutoScroll(); event.preventDefault(); })
			;
			if (data.zoom)
				clone = clone
					.attr('href', data.zoom)
					.attr('rel', data.shadowbox)
					;
				
			return clone;
		},
		onScroll: function(item) {
			item = jQuery(item);
			
			zoomSrc = '/portfolio/images/';
			switch (item.attr('pptype')) {
				case 'img': zoomSrc += 'zoom.png'; break;
				case 'flv': zoomSrc += 'play.png'; break;
			}

			obj.el_siteTitle.html(item.attr('pptitle'));
			obj.el_siteLink.attr('href', 'http://'+item.attr('ppdomain')).html(item.attr('ppdomain'));
			
			if (item.attr('rel'))
				obj.el_siteZoom.attr('href', item.attr('href')).attr('rel', item.attr('rel')).attr('pptype', item.attr('pptype')).css('visibility', '').find('img').attr('src', zoomSrc);
			else
				obj.el_siteZoom.css('visibility', 'hidden');
		}
	});
	this.SPscrollObj = this.template.find('#miniPortContent')[0].SPscroll;
	
	// Setup the template
	this.template = this.template
		.find('#miniPortTitle')
			.html(this.params.title)
			.end()
		.find('#miniPortLink')
			.attr('href', '/portfolio/index.php#'+this.category)
			.end()
		.find('.arrowBtn')
			.click(function() { obj.stopAutoScroll(); return false; })
			.end()
		.find('#miniPortZoom')
			.click(function() { obj.onZoom(); return false; })
			.end()
		.children().appendTo('#'+this.el_id)
		;
		
	// Initialize Shadowbox
	Shadowbox.init({
		initialWidth:400,
		initialHeight:400,
		flvPlayer:'/common/flash/flvplayer.swf',
		loadingImage: '/common/images/shadowbox/loading.gif',
		overlayBgImage: '/common/images/shadowbox/overlay-85.png'
	});
}

SPCL_MINIPORTFOLIO_CLASS.prototype.onZoom = function() {
	this.stopAutoScroll();
	
	var opts = {
		type:this.el_siteZoom.attr('pptype'),
		content: this.el_siteZoom.attr('href')
	};
	sbo = this.el_siteZoom.attr('rel').split(';');
	for (var i = 0;  i < sbo.length;  i++) {
		var o = sbo[i].split('=');
		if (o[0] == 'width') opts.width = o[1];
		else if (o[0] == 'height') opts.height = o[1];
	}
	Shadowbox.open(opts, {initialWidth:400, initialHeight:400});
}

SPCL_MINIPORTFOLIO_CLASS.prototype.stopAutoScroll = function() {
	clearInterval(this.scrollTimer);
}

SPCL_MINIPORTFOLIO_CLASS.prototype.doScroll = function() {
	var switchdir = jQuery.SPautoScrollFn(this.SPscrollObj, this.scrollDirection);
	if (switchdir)
		this.scrollDirection = this.scrollDirection == 'right' ? 'left' : 'right';
}

SPCL_MINIPORTFOLIO_CLASS.prototype.formatClient = function(client) {
	var result = {title:client.title, domain:client.domain, image:'', zoom:'', shadowbox:'', type:''};
	
	var slideIndex = this.params.siteSlideNumbers[client.code] ? (this.params.siteSlideNumbers[client.code]*1-1) : 0;
	var $slide = jQuery(client.slides[0].html.replace('href="images/', 'href="/portfolio/images/'));
	
	var $item = $slide.find('a[rel^=shadowbox]');
	result.image = $item.find('img').attr('src');
	result.zoom  = $item.attr('href');
	result.shadowbox = $item.attr('rel');
	result.type = result.zoom.substring(result.zoom.length-4, result.zoom.length) == '.flv' ? 'flv' : 'img';
	
	return result;
}