
/**
 * vectorsProjectNav jQuery Plugin v2.0 by Craig Dietrich
 * Accepts an array of projects, displaying them in a bar with rollover effects
 */

(function($){  

	$.fn.vectorsProjectNav = function(options) {  

		var defaults = {  
			width: 464,
			height:  18,
			issueId: 0,      
			issueTitle: '', 
			projectId: 0,   
			projects: [],			
			issueTitleWidth: 60,
			cellRightPadding: 3,
			roll_amount: 2,
			roll_speed: 40	     	
		};  
		var options = $.extend(defaults, options);  

		if ('undefined'==typeof(options.projects) && 'undefined'==typeof(options.projectId)) return;

		return this.each(function() { 
    
			var $this = $(this); 
    		
			// Methods
    		
			$this.widthPerCell= function() {
				var numElements = ((options.projects.length)-1);  // Magic number: remove the project presently being displayed
				var widthPerCell = Math.round((options.width - options.issueTitleWidth) / numElements);  	
				return widthPerCell;		
			}	    		
    		
			$this.startRoll = function(obj, widthPerCell) {
				var $obj = $(obj)
				if ($obj.data('is_rolling')) return;
				$obj.data('is_rolling', true);
				$obj.data('is_resetting', false);
				$this.doRoll(obj, options.roll_amount, options.roll_speed, widthPerCell);
			}
			
			$this.stopRoll = function(obj) {
				var $obj = $(obj);
				if ($obj.data('is_resetting')) return;
				$obj.data('is_resetting', true);
				$obj.data('is_rolling', false);	
				$this.doRevert(obj, (options.roll_amount/3), options.roll_speed);
			}				
			
			$this.doRoll = function(obj, roll_amount, roll_speed, widthPerCell) {
				var $obj = $(obj);
				if (!$obj.data('is_rolling')) return;
				$obj.data('is_resetting', false);
			  	var currentLeft = parseInt($obj.css('left'));
			  	var width = parseInt($obj.find('a:first').width());
			  	if (currentLeft < (width*-1 + widthPerCell - (options.cellRightPadding*2))) return;
			  	var newLeft = (currentLeft - roll_amount);
				$obj.css('left', newLeft);
			  	setTimeout(function() {
			  		$this.doRoll(obj, roll_amount, roll_speed, widthPerCell);
			  	}, roll_speed);		
			}
	
			$this.doRevert = function(obj, roll_amount, roll_speed) {
				var $obj = $(obj);
				if (!$obj.data('is_resetting')) return;
				$obj.data('is_rolling', false);
			  	var currentLeft = parseInt($obj.css('left'));
			  	if (currentLeft > 0) return;
			  	var newLeft = (currentLeft + roll_amount);
				$obj.css('left', newLeft);
			  	setTimeout(function() {
			  		$this.doRevert(obj, roll_amount, roll_speed);
			  	}, roll_speed);		
			}	
			
			// Create wrapper
			
			var $myTable = $('<table cellspacing="0" cellpadding="0"></table>');
			$myTable.addClass('vectorsProjectNav');
			$myTable.width(options.width);
			$myTable.height(options.height);
			$this.append($myTable);	
			var $myRow = $('<tr></tr>');
			$myTable.append($myRow);

			// Issue title
			
			var $cell = $('<td></td>');
			var $div = $('<div></div>');
			$div.addClass('issueDiv');
			$div.html('<div><a href="../issues/index.php?issue='+options.issueId+'">'+options.issueTitle+':</a></div>');
			$cell.append($div);
			$myRow.append($cell);

			// Num elements

			var widthPerCell = $this.widthPerCell();	

			// Elements

			for (var a = 0; a < options.projects.length; a++) {
				if (options.projectId == options.projects[a].project_id) continue;
				var $cell = $('<td></td>');
				$cell.addClass('projectCell')
				$cell.width(widthPerCell);
				var $div = $('<div></div>');
				$div.addClass('projectDiv');
				$div.width( (widthPerCell-options.cellRightPadding) );		
				$cell.append($div);				
				var $roller = $('<div><a href="'+options.projects[a].url+'">'+options.projects[a].title+'</a></div>');
				$roller.addClass('roller');
				$div.append($roller);
				$cell.mouseenter(function() {
					$this.startRoll( $(this).find('.roller')[0], widthPerCell );
				});
				$cell.mouseleave(function() {
					$this.stopRoll( $(this).find('.roller')[0] );
				});														
				$myRow.append($cell);
			}
 
		});  
    	
	};  
 	
})(jQuery);  

