(function ($) {
	
	var $ = jQuery;
	
	$.fn.apsContentSwitcher = function (opt) {
		
		this.obj = $.extend({
			'contentContainer'	: 'apsPleasePassAValidValueForThis',
			'content'			: 'apsPleasePassAValidValueForThis',
			'buttonContainer'	: 'apsPleasePassAValidValueForThis',
			'buttonAttr'		: 'apsPleasePassAValidValueForThis',
			'contentAttr'		: 'apsPleasePassAValidValueForThis',
			'transitionLength'	: 600,
			'transitionType'	: 'linear'
		},opt);
		

		/*---------------------------------------------------------------------------------------*/
		
		
		
		
		/*---------------------------------------------------------------------------------------*/
		//this is the function that kicks everything off.
		this.apsInit = function (instance, apsContentSwitcherOptions) {
			
			/* Declare Variables ______________________________________________*/
				//our top level variables...
					var apsInstance			= instance;
					var options				= apsContentSwitcherOptions;
				
				//variables declared for ease of access...
					var contentContainer	= $(options.contentContainer);
					var content				= $(options.content);
					var contentObject		= new Object();
					var buttonContainer		= $(options.buttonContainer);
					var contentAttr			= options.contentAttr.toString();
					var buttonAttr			= options.buttonAttr.toString();
					var transitionLength	= parseInt(options.transitionLength);
					var transitionType		= options.transitionType.toString();
					var contentContainerBaseWidth, contentContainerBaseHeight, galleriaInstance,
						contentVisible, apsPerformSwap, btnWasClicked, initGalleria, removeShutter;
				
				//dynamically generated & specialty :oD variables...
					var theShutter			= $(document.createElement('span')).css({
													'position' : 'absolute',
													'left':'3px','top':'3px','right':'3px','bottom':'3px',
													'backgroundColor' : '#ffffff',
													'z-index' : '999999'
												});
												
					var contentTotalItems	= (function(){
					/*just in case we this*/		var counter = 0;
					/*this is the number of*/		content.each(function(){
					/*content elements the*/		counter++;
					/*user has given us*/			});
													return counter;
												})();
			
				//function declarations...
				removeShutter = function(){

					theShutter.animate({'opacity':'0'},transitionLength,function(){
					
						$(this).remove();
						
						buttonContainer.attr('disabled','');
					
					});
					
				}/*end removeShutter*/
				
				
				initGalleria = function (containingElement) {
					galleriaContainer = containingElement.children('.gallery_container');
					
					datSrc = galleriaContainer.children('.project_images');
					
					if (datSrc.find('img').length > 0) {
						galleriaContainer.galleria({
							dataSource		: datSrc,
							transition		: 'fade',
							width			: 630,
							height			: 360,
							showCounter		: false,
							extend			: function(gallOpts){
								$(this).css({
									'z-index':'0'
								});
								galleriaContainer.find('.galleria-image-nav > *').append($(document.createElement('span')).addClass('caran-galleria-btn'));
							}
						});
					}
					
					apsPerformSwap(containingElement);

				}/*end initGalleria*/
				
				
				btnWasClicked = function(){
					
					var clickedID = $(this).val();
					
					buttonContainer.attr('disabled','disabled');
					
					theShutter.appendTo(contentContainer);

					theShutter.stop(true,true).animate({'opacity':'1'},transitionLength,function(){

						contentVisible.remove();
						
						var objectKey = null;
						
						for (var contentKey in contentObject) {
							
							if (contentObject[contentKey].attr(contentAttr) == clickedID) {
							
								contentVisible = contentObject[contentKey].clone();
								
								objectKey = contentKey;
							
							}
						
						}
	
						/*contentContainer.stop(true,true).animate({
							'width'		: contentObject[objectKey][0].apsDimensions.width,
							'height'	: contentObject[objectKey][0].apsDimensions.height
						},200, function(){*/
							
							initGalleria(contentVisible);
						
						/*});*/
					
					});
					
				}/*end btnWasClicked*/
				
				
				apsPerformSwap = function (containingElement) {
					
					containingElement.insertBefore(theShutter);
					
					removeShutter();
					
				}/*end apsPerformSwap*/
				
				
			/* Prepare Content _________________________________________________*/
			var tempCounter1 = 0;

			content.each(function(){

				contentObject[tempCounter1] = $(this).clone();

				contentObject[tempCounter1][0].apsDimensions = {
					'width'		: $(this).outerWidth(),
					'height'	: $(this).outerHeight()
				};

				$(this).remove();

				tempCounter1++;
			});
			
			
			/* Prepare Content Container _______________________________________*/
			contentVisible = contentObject[0].clone();
			
			/*contentContainerBaseHeight = contentContainer.outerHeight();
			
			console.log(contentContainerBaseHeight);
			
			contentContainerBaseWidth;*/
			
			contentContainer.css({
				'display'	: 'block',
				'position'	: 'relative'
				/*'width'		: contentObject[0][0].apsDimensions.width,
				'height'	: contentObject[0][0].apsDimensions.height*/
			}).append(theShutter);
			
			initGalleria(contentVisible);
			
			
			/* Un-hide Initial Content _________________________________________*/

				//for the purpose of this particular use of this plugin on caranconstruction.com (2011-07-13)
				//I've added the next line to ensure that on non-forced refresh, the first option is visible
				//as the selected option otherwise on non-forced refresh, if the user has already changed the option
				//once, the browser may keep the selected option thereby making the visible content and the
				//chosen option fall out of sync.
				buttonContainer.children('['+buttonAttr+'="'+$(content[0]).attr(contentAttr)+'"]').attr('selected','selected');
			
			buttonContainer.bind('change',btnWasClicked);

			removeShutter();
		}
		
		
		/*---------------------------------------------------------------------------------------*/
		//this.apsReadyLength needs to be the total number of attributes in this.obj
		this.apsReadyLength = 7;
		//this.apsReadyCheck is the counter to check if we've got all we need
		//to try executing the plugin
		this.apsReadyCheck = 0;
		//here we run the check to see if some value has been assigned by the
		//user to each of the mandatory attributes in this.obj
		for (var i in this.obj) {
			if (this.obj[i] != 'apsPleasePassAValidValueForThis') {
				this.apsReadyCheck++;
			}
		}
		
		/*---------------------------------------------------------------------------------------*/
		if (this.apsReadyCheck == this.apsReadyLength) {
				
			this.apsInit(this, this.obj);
				
		} else {
			
			alert(
				'Error: apsContentSwitcher()This plugin requires that you pass it several mandatory options.\r\n\r\n'+
				'1) contentContainer =	either a jQuery object or a string selector for the element that will become the master container of the content that you will be switching.\r\n\r\n'+
				'2) buttonContainer =	a container element such as a <ul> or a <p> with a collection of child elements such as <li> or <a> that will act as the buttons that are linked to the element containers of the content you wish to make switch-able.\r\n\r\n'+
				'3) buttonAttr =		the attribute to use from buttons to pull the related content container when switching to it.\r\n\r\n'+
				'4) contentAttr =		the attribute to use pulling content containers in relation to their calling buttons.\r\n\r\n'+
				'Example for buttonAttr and contentAttr:\r\n'+
				'		button:		<button class="content1">Content 1</button>\r\n'+
				'		content:		<div class="content1">A whole lot of content!</div>'
			);
			
		}
		
		//maintain jQuery chain-ability
		return this;


	}//$.fn.apsContentSwitcher ends
	
})(jQuery);

$().ready(function () {

	Galleria.loadTheme('js/themes/classic/galleria.classic.min.js');
	
	$('#portfolio_container').apsContentSwitcher({
		contentContainer	: '#portfolio_container',
		content				: '.project_container',
		buttonContainer		: '#project_list select',
		buttonAttr			: 'value',
		contentAttr			: 'class'
	});
	
});











//-->