// jquery for notes
	var arrNotes = [ 
	 "A0",  
	 "A1",  
	 "B0",  
	 "B1",  
	 "C0",  
	 "C1",  
	 "D0",
	 "E0",
	 "F0",
	 "G0",  
	 "G1"
	 ];


/**
 * jQuery.Preload - Multifunctional preloader
 * Copyright (c) 2008 Ariel Flesler - aflesler(at)gmail(dot)com
 * Dual licensed under MIT and GPL.
 * Date: 3/25/2009
 * @author Ariel Flesler
 * @version 1.0.8
 */
;(function($){var h=$.preload=function(c,d){if(c.split)c=$(c);d=$.extend({},h.defaults,d);var f=$.map(c,function(a){if(!a)return;if(a.split)return d.base+a+d.ext;var b=a.src||a.href;if(typeof d.placeholder=='string'&&a.src)a.src=d.placeholder;if(b&&d.find)b=b.replace(d.find,d.replace);return b||null}),data={loaded:0,failed:0,next:0,done:0,total:f.length};if(!data.total)return finish();var g=$(Array(d.threshold+1).join('<img/>')).load(handler).error(handler).bind('abort',handler).each(fetch);function handler(e){data.element=this;data.found=e.type=='load';data.image=this.src;data.index=this.index;var a=data.original=c[this.index];data[data.found?'loaded':'failed']++;data.done++;if(d.enforceCache)h.cache.push($('<img/>').attr('src',data.image)[0]);if(d.placeholder&&a.src)a.src=data.found?data.image:d.notFound||a.src;if(d.onComplete)d.onComplete(data);if(data.done<data.total)fetch(0,this);else{if(g&&g.unbind)g.unbind('load').unbind('error').unbind('abort');g=null;finish()}};function fetch(i,a,b){if(a.attachEvent&&data.next&&data.next%h.gap==0&&!b){setTimeout(function(){fetch(i,a,1)},0);return!1}if(data.next==data.total)return!1;a.index=data.next;a.src=f[data.next++];if(d.onRequest){data.index=a.index;data.element=a;data.image=a.src;data.original=c[data.next-1];d.onRequest(data)}};function finish(){if(d.onFinish)d.onFinish(data)}};h.gap=14;h.cache=[];h.defaults={threshold:2,base:'',ext:'',replace:''};$.fn.preload=function(a){h(this,a);return this}})(jQuery);
	// pre load images

	$.preload( arrNotes, {
		base:'img/',
		ext:'.png',
		onComplete:function( data ){
			var img = new Image();
			img.src = data.image;
			$('#url-images').append(img);
		},
		/*onFinish:function(){
			$('#url-images p').fadeOut(2000);
		}*/
	});
// font effects: http://www.iofo.it/jquery/fonteffect/
(function($){var FE={};FE.divcounter=0;FE.tabpos=["","0001021020212212","00010203041020304041424344142434","000102030405061020304050606162636465162636465666"];FE.font={serif:"Georgia, 'Times New Roman', 'Century Schoolbook L', serif",sans_serif:"Verdana, Helvetica, Arial, 'URW Gothic L', sans-serif",monospace:"'Courier New', Courier, 'DejaVu Sans Mono', monospace",fantasy:"Impact, Papyrus, fantasy",cursive:"'Comic Sans MS' cursive"};$.fn.FontEffect=function(o){var d=$.extend({outline:false,outlineColor1:"",outlineColor2:"",outlineWeight:1,mirror:false,mirrorColor:"#000",mirrorOffset:-10,mirrorHeight:50,mirrorDetail:1,mirrorTLength:50,mirrorTStart:0.2,shadow:false,shadowColor:"#aaa",shadowOffsetTop:5,shadowOffsetLeft:5,shadowBlur:1,shadowOpacity:0.1,gradient:false,gradientColor:"",gradientFromTop:true,gradientPosition:20,gradientLength:50,gradientSteps:20,proportional:false,hideText:false,debug:false},o);this.not(".JQFE").each(function(){if(!d.outline&&!d.shadow&&!d.mirror&&!d.gradient){d.outline=true;};if(d.outline){if(d.outlineColor1==""&&d.outlineColor2==""){d.outlineColor1=pickcontrast($(this).css("color"));};if(d.outlineColor2=="")d.outlineColor2=d.outlineColor1;};if(d.gradient&&d.gradientColor==""){d.gradientColor=pickcontrast($(this).css("color"));};var userdisplay=$(this).css("display");var userposition=$(this).css("position");$(this).css({display:"inline",position:((userposition=="absolute")?"absolute":"relative")});var h=$(this).height();var w=$(this).width()*1.04;var W=w+"px";var H=h+"px";var t=$(this).html();$(this).data("options",d).addClass("JQFE").css({width:W,height:H,display:userdisplay,position:(($(this).css("position")!="absolute")?"relative":"absolute"),zoom:1});var MyContainer=$("<div></div>").css({width:W,height:H,position:"relative"});MyContainer.append($("<div class='JQFEText'>"+t+"</div>").css({display:d.hideText?"none":"inline",width:W,height:H,position:"relative",zIndex:100}));var alldivsup=$("<div></div>").css({width:W,height:H,left:"0px",position:"absolute",top:parseInt($(this).css("paddingTop"))*0+"px",zIndex:110});var alldivsdown=$(alldivsup).clone().css({zIndex:90});FE.divounter+=4;$(this).html("");if(d.mirror){for(i=0;i<h*(d.mirrorHeight/100);i++){if(d.proportional){var css_top1=(h+d.mirrorOffset+i*d.mirrorDetail).pxToEm({scope:this});var css_height=d.mirrorDetail.pxToEm({scope:this});var css_top2=((h*-1)+i*(100/d.mirrorHeight)).pxToEm({scope:this});}
else{var css_top1=(h+d.mirrorOffset+i*d.mirrorDetail)+"px";var css_height=d.mirrorDetail+"px";var css_top2=((h*-1)+i*(100/d.mirrorHeight))+"px";};var css_opacity=d.mirrorTStart-(i*(d.mirrorTStart/((d.mirrorHeight/100)*d.mirrorTLength)));var appo=$("<div class='JQFEMirror'></div>").css({position:"absolute",top:css_top1,height:css_height,width:W,overflow:"hidden"}).append($("<div>"+t+"</div>").css({position:"absolute",color:d.mirrorColor,top:css_top2,opacity:css_opacity}));FE.divounter+=i*2;if(css_opacity<0.01)break;alldivsdown.append(appo);};};if(d.outline){var totdiv=(d.outlineWeight)*8;var to=FE.tabpos[d.outlineWeight];for(i=0;i<totdiv;i++){appo=$("<div class='JQFEOutline'>"+t+"</div>").css({position:"absolute",top:(to.charAt(i*2)-d.outlineWeight)+"px",left:(to.charAt(i*2+1)-d.outlineWeight)+"px",width:W,color:((i<totdiv/2+d.outlineWeight)?d.outlineColor1:d.outlineColor2),zIndex:((i>totdiv-totdiv/3)?20:30)});FE.divounter+=i;alldivsdown.append(appo);};};if(d.shadow){var totdiv=(d.shadowBlur)*8;var to=FE.tabpos[d.shadowBlur];for(i=0;i<totdiv;i++){appo=$("<div class='JQFEShadow'>"+t+"</div>").css({opacity:d.shadowOpacity,position:"absolute",top:(to.charAt(i*2)-d.shadowBlur)+d.shadowOffsetTop+"px",left:(to.charAt(i*2+1)-d.shadowBlur)+d.shadowOffsetLeft+"px",width:W,height:H,color:d.shadowColor,zIndex:10});FE.divounter+=i;alldivsdown.append(appo);};};if(d.gradient){var step=Math.round((h*(d.gradientLength*0.01))/d.gradientSteps);var postop=h*(d.gradientPosition*0.01);var opa=(1/d.gradientSteps);var gcolor=d.gradientColor;for(i=0;i<d.gradientSteps;i++){if(d.proportional){css_top1=(((i==0)?0:postop)+i*step).pxToEm({scope:this});css_height=(((i==0)?postop:0)+step).pxToEm({scope:this});css_top2=((((i==0)?0:postop)+i*step)*-1).pxToEm({scope:this});}
else{css_top1=(((i==0)?0:postop)+i*step)+"px";css_height=(((i==0)?postop:0)+step)+"px";css_top2=((((i==0)?0:postop)+i*step)*-1)+"px";};appo=$("<div class='JQFEGradient'></div>").css({position:"absolute",top:css_top1,height:css_height,left:"0px",width:W,overflow:"hidden"}).append($("<div>"+t+"</div>").css({width:"100%",position:"absolute",top:css_top2,color:gcolor,opacity:1-opa*i}));FE.divounter+=i*2;alldivsup.append(appo);};};MyContainer.append(alldivsdown);MyContainer.append(alldivsup);$(this).append(MyContainer);});function hex2rgb(hexcolor){hexcolor=hexcolor.substring(1);if(hexcolor.length==3)hexcolor=hexcolor.charAt(0)+hexcolor.charAt(0)+hexcolor.charAt(1)+hexcolor.charAt(1)+hexcolor.charAt(2)+hexcolor.charAt(2);var rgbcolor="rgb("+parseInt(hexcolor.substring(0,2),16)+", "+parseInt(hexcolor.substring(2,4),16)+", "+parseInt(hexcolor.substring(4,6),16)+")";return(rgbcolor);};function chkColorString(col){return(/(#([0-9A-Fa-f]{3,6})\b)|(rgb\(\s*\b([0-9]|[1-9][0-9]|1[0-9][0-9]|2[0-4][0-9]|25[0-5])\b\s*,\s*\b([0-9]|[1-9][0-9]|1[0-9][0-9]|2[0-4][0-9]|25[0-5])\b\s*,\s*\b([0-9]|[1-9][0-9]|1[0-9][0-9]|2[0-4][0-9]|25[0-5])\b\s*\))|(rgb\(\s*(\d?\d%|100%)+\s*,\s*(\d?\d%|100%)+\s*,\s*(\d?\d%|100%)+\s*\))/.test(col));};function pickcontrast(col){if(chkColorString(col)){col=col.toUpperCase();if(col.charAt(0)=="#")col=hex2rgb(col);var appo=col.substring(4,col.length-1).split(", ");var g=255-parseInt(appo[0]);var b=255-parseInt(appo[1]);var r=255-parseInt(appo[2]);col="rgb("+r+", "+g+", "+b+")";};return(col);};return this;};$.fn.changeOptionsFE=function(newoptions){if(this){var oldoptions=$(this).data("options")||{};$.extend(oldoptions,newoptions);$(this).data("options",oldoptions);};};$.fn.redrawFE=function(newoptions){if(this){if(newoptions)$(this).changeOptionsFE(newoptions);$(this).removeFE();$(this).FontEffect($(this).data("options"));};};$.fn.removeFE=function(removeoptions){if(this&&$(this).hasClass("JQFE")){var t=$(this).find("div[class='JQFEText']").html();$(this).removeClass("JQFE");if(removeoptions)$(this).data("options",{});$(this).find("div[class^='JQFE']").remove();$(this).html(t);};};})(jQuery);Number.prototype.pxToEm=String.prototype.pxToEm=function(settings){settings=$.extend({scope:'body',reverse:false},settings);var pxVal=(this=='')?0:parseFloat(this);var scopeVal;var getWindowWidth=function(){var de=document.documentElement;return self.innerWidth||(de&&de.clientWidth)||document.body.clientWidth;};if(settings.scope=='body'&&$.browser.msie&&(parseFloat($('body').css('font-size'))/getWindowWidth()).toFixed(1)>0.0){var calcFontSize=function(){return(parseFloat($('body').css('font-size'))/getWindowWidth()).toFixed(3)*16;};scopeVal=calcFontSize();}
else{scopeVal=parseFloat($(settings.scope).css("font-size"));};var result=(settings.reverse==true)?(pxVal*scopeVal).toFixed(2)+'px':(pxVal/scopeVal).toFixed(2)+'em';return result;};

$(document).ready(function() {

	var correctCount = 0;
	var outOf = 0;
	// display random note
	$('#notecontainer').css({ background: "#FFF url(" + randNote() + ") center -10px no-repeat" });
	// add click function to display next note
	$('#nextnote').click(function() {
		$('#notecontainer').css({ background: "#FFF url(" + randNote() + ") center -10px no-repeat" });
 		$('#answer').val($('option:first', $('#answer')).val());
		return false;
	});
	// add click function to display next note
	$('#iscorrect').click(function() {
		outOf++;
		if($('input#note').val().substring(0,1) == $('select#answer').val())
			{
				alert('Well done! Hit the next arrow to try another');
				correctCount++;}
			else {
				alert( 'Oops! The note is \''+$('input#note').val().substring(0,1)+'\'' );
				}
		$('span#correct').text(correctCount);
		$('span#outof').text(outOf);
		//alert(document.getElementById('note').value);
		//alert(document.getElementById('answer').value);
		return false;
	});
	// animate note name reveal/hide
	$('#notecontainer').toggle(function() {
            $(this).animate(
                { height: 190 }, {
                    duration: 1000,
                    easing: 'easeOutBounce'
                });
			}, function() {
	  $(this).animate(
                { height: 133 }, {
                    duration: 1000,
                    easing: 'easeOutBounce'
                });
	});
	$('#notecontainer').mouseleave(function() {
            $(this).animate(
                { height: 133 }, {
                    duration: 1000,
                    easing: 'easeOutBounce'
                });
	});	
	// animate button images
	$("#answerrow a, #answerrow #answer, #homelink").hover(function(){
		$(this).fadeTo("fast", 0.7); // This should set the opacity to 100% on hover
	},function(){
   		$(this).fadeTo("slow", 1.0); // This should set the opacity back to 60% on mouseout
	});

	// font effects
	$('h1').FontEffect({
    outline         :false, // Apply the outline effect
    outlineColor1   :"#FFF",    // [find contrasting] The upper left  outline color
    outlineColor2   :"#333",    // [outlineColor1] the lower right outline color
    outlineWeight   :1,     // 1=light,2=normal,3=bold
    mirror          :false, // Apply the mirror effect
    mirrorColor     :"#FFF",    // [object color] The color of the reflex
    mirrorOffset    :-10,   // The distance from text
    mirrorHeight    :50,    // The height of the reflex (perc.)*
    mirrorDetail    :2,     // The reflex detail 1=high,2=medium,3=low
    mirrorTLength   :50,    // The length of the sfumature (perc.)*
    mirrorTStart    :0.5,   // The starting opacity of the reflex (0-1)
    shadow          :true, // Apply the shadow effect
    shadowColor     :"#eee",// The color of the shadow
    shadowOffsetTop :5,     // The top offset position (px)
    shadowOffsetLeft:5,     // The left offset position (px)
    shadowBlur      :2,     // The shadow blur 1=none,2=low,3=high
    shadowOpacity   :0.1,   // The opacity of the shadow (0=none,1=all)
    gradient        :false, // Apply the gradient effect
    gradientColor   :"#FFF",    // The color of the gradient
    gradientPosition:10,    // The start position of the gradient (perc.)*
    gradientLength  :75,    // The length of the gradient (perc.)*
    gradientSteps   :20,    // the steps of the gradient
    hideText        :false // Hide the source text
	});

	
});

// return random note image and set hidden field value
function randNote(){
	var note = arrNotes[Math.floor(Math.random()*arrNotes.length)] ;
	document.getElementById('note').value = note;
	return escape('img/'+note+'.png');
}