/**
 * Layout setup: rounded corners, nav, etc.
 */

/*
$(window).bind('load', function(){
	$('#nav').backgroundCanvasPaint(NavPaint);
}).bind('resize', function(){
	$('#nav').backgroundCanvasPaint(NavPaint);
});
*/

// I'm sick of wasting my time with this browser.  Enough.
$(document).ready(function(){
	if($.browser.msie) {
		$('body').prepend('<div id="overlay"></div>');
		alert("We notice you're using Internet Explorer.\n\nThis site uses some advanced features that may not function correctly in some versions of IE.\n\nWe highly recommend you upgrade to a better browser.  There are some very good (and free!) ones available.  Just try a google search for one of the following:\n\n* Firefox\n* Opera\n* Safari\n* Google Chrome\n\nThanks!");
		$('#overlay').remove();
	}
});

//$(document).readyX({cmd: 'last', fn: function(){
$(document).ready(function(){
	jQuery.fn.reverse = function() {
		return this.pushStack(this.get().reverse(), arguments);
	};
	try {
		$('.rounded').corner();
		$('#login').corner();

		// fix tab backgrounds and margins, as curvycorners will mess them up
		$('.tabs-container').parent().css('margin-bottom', '15px');
		$('.tabs-container').css('background-color', '#a1dc6a').corner();
		$('.box').corner();
		$('.box a.hide').click(function(){ $(this).parent().parent().parent().hide('normal'); return false; });

		//$('#header').backgroundCanvas();
		//$('#header').backgroundCanvasPaint(HeaderPaint);
		//$('#footer').backgroundCanvas();
		//$('#footer').backgroundCanvasPaint(FooterPaint);
		$('#nav').css('width', $('#nav').width()+15);
		$('#nav').backgroundCanvas();
		$('#nav').backgroundCanvasPaint(NavPaint);

		// ugly hack to make sure IE draws the nav properly
		if($.browser.msie) {
			setTimeout(function(){ $('#nav').backgroundCanvasPaint(NavPaint) }, 1000);
		}

		// make tabs "pop up" when hovered
		$('#nav li').hover(function(){
			window._tab_high = this;
			$('#nav').backgroundCanvasPaint(NavPaint);
			$(this).css('top', '-5px');
		}, function(){
			$(this).css('top', '0px');
			window._tab_high = false;
			$('#nav').backgroundCanvasPaint(NavPaint);
		}).click(function(){
			// any clicks on the <li> will go to the <a>'s href
			var href = $(this).find('a:first').attr('href');
			location.href = href;
			return false;
		});
	} catch(e) {}
});

function RoundedBox(context, width, height, canvas, $canvas, $canvasDiv, $content, $element ) 
{
	var options = {x:0, height: height, width: width, radius:10, border:0 };

	// Draw the rounded/bordered rectangle 
	context.fillStyle = $element.css('border-left-color');
	$.canvasPaint.roundedRect(context,options);
		
	// Draw the gradient filled inner rectangle
	options.border = 2;
	context.fillStyle = $element.css('background-color');
	$.canvasPaint.roundedRect(context,options);

	$element.css({
		'background-color': 'inherit',
		'border-style': 'none',
		'margin-left': $element.css('margin-left')+$element.css('border-left-width'),
		'margin-top': $element.css('margin-top')+$element.css('border-top-width')
	});
}

function HeaderPaint(context, width, height, canvas, $canvas, $canvasDiv, $content, $element ) 
{
		var options = {x:0, height: height, width: width, radius:0,  border: 0 };
		var backgroundGradient = context.createLinearGradient(0, 0, 0, height - 2);
		// inner gradient
		backgroundGradient.addColorStop(0 ,'#77c52e');
		backgroundGradient.addColorStop(1, '#336a2a');

		// Draw the rounded/bordered rectangle 
		context.fillStyle = "#336a2a";
		$.canvasPaint.roundedRect(context,options);
		
		// Draw the gradient filled inner rectangle
		options.border = 1;
		context.fillStyle = backgroundGradient; 
		$.canvasPaint.roundedRect(context,options);
}

function FooterPaint(context, width, height, canvas, $canvas, $canvasDiv, $content, $element ) 
{
		var options = {x:0, height: height, width: width, radius:0,  border: 0 };
		var backgroundGradient = context.createLinearGradient(0, 0, 0, height - 2);
		// inner gradient
		backgroundGradient.addColorStop(0, '#336a2a');
		backgroundGradient.addColorStop(1 ,'#77c52e');

		// Draw the rounded/bordered rectangle 
		context.fillStyle = "#336a2a";
		$.canvasPaint.roundedRect(context,options);
		
		// Draw the gradient filled inner rectangle
		options.border = 1;
		context.fillStyle = backgroundGradient; 
		$.canvasPaint.roundedRect(context,options);
}

function NavPaint(context, width, height, canvas, $canvas, $canvasDiv, $content, $element ) 
{
	function _drawtab($elem, context, width, height, $content, bg) {
		var offsetParent = $content.offset();
		var offset = $elem.offset({relativeTo:$content[0]});
		var width = $elem.outerWidth();
		var height = $elem.outerHeight();
		var options = {
			x: offset.left - offsetParent.left,
			y: offset.top - offsetParent.top + 5,
			height: height + 10, 
			width: width + 15,
			offsetLeft: 5,
			offsetRight: 30,
			radiusLeft: 7,
			radiusRight: 7,
			border:0
		};
		var options = {
			x: offset.left - offsetParent.left,
			y: offset.top - offsetParent.top + 14,
			height: height,
			width: width + 15,
			offsetLeft: 5,
			offsetRight: 30,
			radiusLeft: 7,
			radiusRight: 7,
			border:0
		};
		if(!$.browser.opera) options.height += 2;
		if($.browser.msie) true;
		if(window._tab_high == $elem.get(0)) {
			options.y -= 5;
			options.height += 5;
		}

		context.fillStyle = bg ? "#336a2a" : "#333333"; // Border Color
		$.canvasPaint.roundTab(context,options); 
		options.border = 1;
		context.fillStyle = bg ? "#ffffff" : "#458e39"; // Background color
		$.canvasPaint.roundTab(context,options);

		/*
		if(1 || !$this.hasClass('current')) {
			// draw bottom line under tab
			context.beginPath();
			context.strokeStyle = $this.hasClass('current') ? "#ffffff" : "#336a2a";
			context.moveTo(options.x, options.y+options.height-2);
			context.lineTo(options.x+options.width-3, options.y+options.height-2);
			context.stroke();
			context.closePath();
		}*/
	}

	// process each list element and draw a tab shape
	$element.find("li").reverse().each(function(){
		$this = $(this);
		if($this.hasClass('current')) return;
		_drawtab($this, context, width, height, $content, false);
	}); 

	// now draw the active one on top
	$this = $element.find("li a.current");
	if($this.size()) _drawtab($this.parent(), context, width, height, $content, true);
}