// -------------------------------------------------------------------
// !GYROContent
//
// jQuery plugin that "traps" or stops propagation of mouse event
// from selected elements to others "below" them
// -------------------------------------------------------------------
(function($) {

	$.fn.GYROContent = function(config) {
	
		// default config overriden with settings if avaialble
		var defaults = {
			"contentContainerId": "#content",
			"descriptionContainerId": "#description",
			"listContainerId": "#list",
			"content": undefined
		};
		
		var content;
		var description;
		var list;
		var caption;
		
		// override config with any matching settings		
		if (config) {
			$.extend(defaults, config);
		}

		function updateContent() {
			
			if (description) {
				description.empty();		
			}
			
			if (list) {				
				list.empty();
				if ($.isArray(defaults.content.list) && defaults.content.list.length > 0) {
					list.show();
					buildList();		
				} else {
					list.hide();
				}
			}
				
			// update content
			buildDescription();
		}
		
		function clearContent() {
			// remove existing content
			content.empty();		
		}
		
		function buildDescription() {
			
			// if description already does not have content
			if (description && description.html() === "") {
				description.append("<h1></h1>");
				$(defaults.descriptionContainerId + ">h1").text(defaults.content.header);
				description.append("<p></p>");
				$(defaults.descriptionContainerId + ">p").text(defaults.content.copy);
			};

		}

		function buildList() {
					
			if (list && jQuery.isArray(defaults.content.list)) {
		
				var listData = defaults.content.list;
			
				for (var listIndex = 0; listIndex < listData.length; listIndex++) {
					
					// if item is a link
					if (listData[listIndex].dir !== undefined && listData[listIndex].dir !== "") {
						list.append("<li><a href=\"" + listData[listIndex].dir + "\">" + listData[listIndex].label + "</a></li>");
					} else {
						list.append("<li>" + listData[listIndex].label + "</li>");
					}
				}

				// see multi-column CSS3 properties (inc. browser custom ones) is natively available	
				var css3ColumnIsAvailable = jQuery("body").css("column-count") || jQuery("body").css("-webkit-column-count") || jQuery("body").css("-moz-column-count");
				
				// if CSS3 properties for multiple columns is not available
				if (!css3ColumnIsAvailable) {
					splitListIntoColumns();
				}
				
			}

		}
		
		// ------------------------------------------------------------
		// split the list into multiple lists (to emulate columns)
		// ------------------------------------------------------------
		function splitListIntoColumns() {

			var listWidth = parseInt(list.css("width"), 10) + parseInt(list.css("column-gap"), 10);
			var numberofColumns = parseInt(list.css("column-count"));
	
			//  adjust the container's width
			list.css("width", containerWidth); 
	
			// use the columnizer to divide into two columns
			list.columnize({ columns: numberofColumns, buildOnce: true, lastNeverTallest: true });
			
			// set width of each column - must be set after columnizer is run
			// - removes the 2px fudge built into columnizer's column widths
			var columnWidth = Math.floor(listWidth/numberofColumns);
			jQuery("#list>.column").css({ "width": columnWidth });
			
			// remove uncessary <br> to clear floats that's built into columnizer (could cause height error)
			list.children("br").remove();
			
			// set overflow hidden to counter floating columns
			list.css("overflow", "hidden");		
		}
		
		function transitionContentIn() {
			this.show();
		}
		
		function transitionContentOut() {
			this.hide();		
		}
				
		this.update = function(newContentData) {
			if (newContentData) {
				defaults.content = newContentData;			
				updateContent();
			} else {
				$.log("ERROR: bad content passed to update");
			}
		};
		
		this.transitionIn = function(callback) {
			transitionContentIn(callback);
		};
		
		this.transitionOut = function(callback) {
			transitionContentOut(callback);
		};
		
		this.handleImageLoadComplete = function() {
		
			// update caption if any
			
			//$.log("Content got load complete");
		};
		
		// -----------------------------------------------------------------------
		// initialize for each matched item then return it
		// -----------------------------------------------------------------------
		return this.each(function() {
			
			content = $(this);
	
			// rudimentary validation		
			if (defaults.content) {

				// setup description
				if ((typeof(defaults.content.header) === "string" && defaults.content.header.length > 0) || 
					(typeof(defaults.content.copy) === "string" && defaults.content.copy.length > 0)) {				
					description = $(defaults.descriptionContainerId);
					if (description.length === 0) {
						content.append("<div id=\"" + defaults.descriptionContainerId.split("#")[1] + "\"></div>");
						description = $(defaults.descriptionContainerId);
					}
				} else {
					$(defaults.descriptionContainerId).hide();				
				}

				if ($.isArray(defaults.content.list) && defaults.content.list.length > 0) {
					list = $(defaults.listContainerId + ">ul");
					if (list.legnth === 0) {
						content.append("<div class=\"section two-columns\" id=\"" + defaults.listContainerId.split("#")[1] + "\"><ul class=\"no-bullet\"></ul></div>");
						list = $(defaults.listContainerId + ">ul");
					}
				} else {
					$(defaults.listContainerId).hide();
				}
			
				updateContent();
			}

			$.log("Finished initializing GYROContent");

		});
	};
	
})(jQuery);