$(document).ready(function() {
		
	// set the base href
	root = $('base').attr('href');
		
	popupLinks();
	emailLinks();
	buildExpandBoxes();
	buildDisplay();
    buildColorbox();
	
	// projects
	kanaQuiz();
						
});		


	// ==================================================
	// create popup links
	// ==================================================
	function popupLinks() {
		var a = $('a.popup');
		a.each(function() {
			if(!$(this).hasClass('noicon')) {
				this.style.backgroundImage = "url(images/popup.png)";
				this.style.backgroundPosition = "right center";
				this.style.backgroundRepeat = "no-repeat";
				this.style.paddingRight = "14px";
				this.style.marginRight = "3px";
			}
			
			// find any images and add alt text to them
			$(this).find('img').attr('alt','Link opens in a new window');
			
			var href = $(this).attr('href');
			$(this).attr('href',"javascript:popup('" + href + "','newWin','')");
			var title = $(this).attr('title');
			$(this).attr('title',title + ' [Opens in New Window]');
		
		});
	}
	// ==================================================
	// popup script for popupLinks()
	// ==================================================
	function popup(url,name,opt) {
		window.open(url,name,opt);
	}



	// ==================================================
	// create email links
	// ==================================================
	function emailLinks() {
		var s = $('span.emailLink');
		s.each(function() {
			var email = $(this).text();
			email = email.replace(' [at] ','@');
			email = email.replace(' [dot] ','.');
			$(this).text(email);		
			$(this).wrap('<a href="mailto:'+email+'"></a>');
		});
	}



	// ==================================================
	// buildColorbox
	// ==================================================
	function buildColorbox() {
		var cb = $('a.colorbox');
		if(cb.length > 0) {
			$.getScript('assets/jquery.colorbox.min.js', function() {
				$('head').append('<link href="' + root + '/assets/colorbox.css" rel="stylesheet" type="text/css" />');
				var opts = {
					maxWidth: '75%',
					maxHeight: '75%',
					scalePhotos: true,
					rel: 'slideshow',
					preloading: false,
				};
				cb.colorbox(opts);
			});
		}
	}
	
	
	// ==================================================
	// build expand boxes
	// ==================================================
	function buildExpandBoxes() {
		// retrieve all items that will become the links for expanding / collapsing boxes
		var s = $('.expandBoxSource');
		// loop all
		s.each(function() {
			// wrap the contents of the source object in a link	
			$(this).wrapInner('<a href="" title="Expand this content"></a>');
			// add a message for screenreaders
			$(this).append('<span class="expandBoxNote">This content box is currently collapsed.  Select the previous link to expand it.</span>');
			// find the next item (this will be the content we want to hide)
			var target = $(this).next();
			// hide the content
			target.hide();
			
			// find the links we just created and bind an onclick event
			$(this).find('a').bind('click',function(e) {
				// capture the current background image (initially this will be set by the .expandBoxSource class in the CSS file
				bgImg = $(this).css('background-image');
				// if the image name has 'arrowDown.png' in it, the target box is currently collapsed
				if(bgImg.match('iconPlus.png')) {
					// update image, title and note
					var newBgImg = bgImg.replace(/iconPlus.png/, 'iconMinus.png');
					$(this).css('background-image', newBgImg);
					$(this).attr('title','Collapse this content');
					$(this).next('.expandBoxNote').text('This content box is currently expanded.  Select the previous link to collapse it.');
				
				// otherwise, it is currently expanded
				} else {
					// update image, title and note
					var newBgImg = bgImg.replace(/iconMinus.png/, 'iconPlus.png');
					$(this).css('background-image', newBgImg);
					$(this).attr('title','Expand this content');
					$(this).next('.expandBoxNote').text('This content box is currently collapsed.  Select the previous link to expand it.');
				}
				// finally, toggle the target box
				target.slideToggle(400);
				// prevent the link from firing
				e.preventDefault();
			});
		});	
	}
	
	


// ===========================================================================================
// build the display 
// ===========================================================================================
	function buildDisplay() {
		if($('body').hasClass('buildPane')) $('body').pane();
	}
	
	



// ===========================================================================================
// Kana Quiz Ajax submits 
// ===========================================================================================
	function kanaQuiz() {		
		// refresh button
		$('#kanaQuizRefresh').bind('click', function(e) {
			getNewKana();								 
		});
		
		
		// update settings
		$('#kanaQuizSettingsForm').bind('submit', function(e) {
			// make a string of all selected 
			var stackStr = '';
			$('input[name=setKanaStacks[]]').each(function() {
				if($(this).attr('checked') == true) {
					stackStr += $(this).attr('id') + ',';
				}
			});
			
			// Ajax submit the new settings
			$.ajax({
				url		:	root + '/includes/kanaQuiz/Kana.php',
				data	:	({ 'method' : 'setKanaStacks' , 'stackStr' : stackStr , 'fromAjax' : true }),
				success	:	function(html) {
					$('#kanaSettingsMessage').html(html);
					setTimeout(function() {
						$('#kanaSettingsMessageText').fadeOut(300);					
					}, 4000);
				},
			});
			// refresh the quiz
			getNewKana();
			
			e.preventDefault();												   
		});
		
		// submit guess
		$('#kanaQuizForm').bind('submit', function(e) {
			var kana = $('#kanaQuizKana').html();									   
			var guess = $('#kanaQuizGuess').attr('value');
			var answer = $('#kanaQuizAnswer').attr('value');
			if(guess == answer)		$('#kanaQuizResponse').html('<div id="kanaQuizResponseText" class="msgPos">Correct!</div>');
			else					$('#kanaQuizResponse').html('<div id="kanaQuizResponseText" class="msgNeg">Incorrect.  The reading for <strong>' + kana + '</strong> is <strong>' + answer + '</strong></div>');
			
			// refresh the quiz
			getNewKana();

			e.preventDefault();										   
		});
	}
	
	function getNewKana() {
		$.ajax({
				url		:	root + '/includes/kanaQuiz/Kana.php',
				data	:	({ 'method' : 'getNewKana' , 'fromAjax' : true }),
				success	:	function(html) {
					// split the html to get the new kana and romaji
					var responseArr = html.split('|');
					var k = responseArr[0];
					var r = responseArr[1];
					// fade the old kana out
					$('#kanaQuizKana').fadeOut(300, function() { 
						$('#kanaQuizAnswer').attr('value',r);
						$('#kanaQuizKana').html(k).fadeIn(300);
						// clear the answer field
						$('#kanaQuizGuess').attr('value','').focus();
					});
				},
		});
	}