(function($)
{
	$.fn.CreateGrid2List = function(settings)
	{
		
		// Config Array
		var config = $.extend(
		{
			// Number of items per row in grid view
			numItemsPerRow: 3,
			
			// Listing Item CSS Class
			listingItemClass: 'listing-item',
			
			// Toggle Button ID's
			toggleBtnList: '#toggleViews-list',
			toggleBtnGrid: '#toggleViews-grid'
			
		}, settings || {});
			
	//  =============
	//  Global Object
		var global = 
		{
			// Listing Holder Object
			holder: $(this),
			
			// Default HTML - List View
			defaultHTML: $(this).html()
		};
		
	//  =================
	//  Initiate Function
		var jQueryGrid2List = function() 
		{
			// Click function for list view
			$(config.toggleBtnList).bind('click', function()
			{
				// Set the new HTML
				global.holder.html(setHTML('list'));
				// Add selected class for view item selected
				// And remove selected class for other view item
				$(this).parent().addClass('selected');
				$(config.toggleBtnGrid).parent().removeClass('selected');
				
				//Change the pagination query string to the correct view
				$('a.pagination').each(function(){
				    var newHref = $(this).attr('href').replace("grid","list")
				    $(this).attr('href', newHref);
				    });
				
				//Clear out grid if the page was initially loaded in the grid view
				$('div.grid-rows3').children('div.col').removeClass();    
				$('div.grid-rows3').children('div.col-last').removeClass();
				$('div.grid-rows3').removeClass();
				
				
				// Prevent href link from triggering
				return false;
			});
			
			// Click function for grid view
			$(config.toggleBtnGrid).bind('click', function()
			{
				// Set the new HTML
				global.holder.html(setHTML('grid'));
				
				// Add selected class for view item selected
				// And remove selected class for other view item
				$(this).parent().addClass('selected');
				$(config.toggleBtnList).parent().removeClass('selected');
				
				//Change the pagination query string to the correct view
				$('a.pagination').each(function(){
				    var newHref = $(this).attr('href').replace("list","grid")
				    $(this).attr('href', newHref);
				    });
				
				// Prevent href link from triggering
				return false;
			});
		};
		
	//  ==============================================
	//  Setting the proper HTML based on the view type
		function setHTML(type)
		{
			// HTML holder variable
			var html_str = '';
			
			switch (type)
			{
				case 'grid':
					var i = 0;
					var len_i = $('.' + config.listingItemClass, global.holder).length;
					
					for (i; i < len_i; i++)
					{
						// Assign the curren list item to a variable
						var listItem = $('.' + config.listingItemClass + ':eq(' + i + ')', global.holder);
						
						// Check whether the current item is the first item on the row
						// If it is the first item of a row and the first item in the list simply add the grid-rows class
						// If it is the first item of a row, and NOT the first item in the list add a closing div for the previous grid-rows and add a new grid-rows
						if (i % config.numItemsPerRow == 0)
						{
							html_str += (i == 0) ? '<div class="grid-rows' + config.numItemsPerRow + '"><div class="col">' : '</div><div class="grid-rows' + config.numItemsPerRow + '"><div class="col">';
						}
						// If it is NOT the first item in a list check whether it is the last item
						// If it is the last item add col-last class otherwise add col class
						else
						{
							html_str += (i % config.numItemsPerRow == config.numItemsPerRow - 1) ? '<div class="col-last">' : '<div class="col">';
						}
						
						// Add the list item html
						html_str += '<div class="' + config.listingItemClass + '">' + listItem.html() + '</div>';
						
						// Close the col or col-last div
						html_str += '</div>';
					}
					
					// Close the grid-rows div
					html_str += '</div>';
					break;
				
				case 'list':
					// Set the HTML back to the default
					html_str = global.defaultHTML;
					break;
			}
			
			// Return the HTML string formatted
			return html_str;
		};
	
		// Initiate the list to grid toggle
		jQueryGrid2List();
	};
})(jQuery);