// depends on jQuery 1.5.1 & Modernizr custom build of 1.7

$(document).ready(function(){

	// !impliment membership widget
	if(supportsTableCell())
		$(document.documentElement).addClass('tablecellOK')

	// add animated member login widget event to membership link
	$('#membership').attr('href','#memberlogin').live('click', function(evt){

		// overide the defaut url
		evt.preventDefault();

		// does client support cssTransitions?
		var support = $('html.csstransitions').length;

		if ($('#memberlogin').length) {

			// If the loging form exists then it's visible close the widget and remove the form from DOM
			if(support){

				// trigger close animation
				$('#barone').css({height:0});

				// the cssTransition end event will rove the node from DOM

			} else {

				// jQuery fallback
				$('#barone').animate({'height':0},200,function(){
					$('#memberlogin').remove();
				});

			}

		// else Create the form and display it
		} else {

			mForm = $('<div id="memberlogin"><form action="MP3/verify.asp" method="GET" target="_blank"><h1>Member login</h1></form></div>');
			$('form',mForm).append('<p><label for="UserNameBox">Email address</label><input class="txt" type="email" id="UserNameBox" name="UserNameBox" size="40" maxlength="40"></p>');
			$('form',mForm).append('<p><label for="PasswordBox">Password</label><input class="txt" type="password" id="PasswordBox" name="PasswordBox" size="20" maxlength="20"></p>');
			$('form',mForm).append('<p><input class="btn" type="submit" value="Enter"></p>');

			$(mForm).append('<div id="notamember"><h1>Not a member?</h1><p>Become a member and keep informed with Band news and upcoming gigs…</p><p><a href="./MP3/Join.asp" target="_blank">Sign up for membership</a></p></div>');

			if(support){

				$('#barone').append(mForm).css({height:mForm.outerHeight()})
					.bind('webkitTransitionEnd',endsMemberAnimation)
					.bind('oTransitionEnd',endsMemberAnimation)
					.bind('msTransitionEnd',endsMemberAnimation)
					.bind('transitionend',endsMemberAnimation);

			} else {

				$('#barone').append(mForm).animate({'height':mForm.outerHeight()},200,function(){
					$('#UserNameBox').focus();
				});

			}
		}

		function endsMemberAnimation() {

			if ($('#barone').height() == 0) {
				$('#memberlogin').remove();
			} else {
				$('#UserNameBox').focus();
			}
		}

	});

	$('marquee').bind({
		mouseover: function(){
			this.stop();
		},
		mouseout: function() {
			this.start();
		}
	});

	$('#footer .memberlogin').click(function(evt){
		evt.preventDefault();
		$('html,body').animate({scrollTop:0},100);
		if (!$('#memberlogin').length)
			$('#membership').trigger('click');
	});

	// !bookings
	$('#online-enquiry.should-close').slideUp(function(){
		$('#toggle-form').toggle(
			function(evt){
				evt.preventDefault();
				$('#online-enquiry').slideDown(300,function(){
					$('#Name').focus();
				});
				$(this).toggleClass('open');
			},
			function(evt){
				evt.preventDefault();
				$('#online-enquiry').slideUp(350);
				$(this).toggleClass('open');
			}
		);
	});

	//$('#flickr_badge_wrapper').append('<script src="http://www.flickr.com/badge_code_v2.gne?show_name=1&amp;count=7&amp;display=random&amp;size=s&amp;layout=x&amp;source=user&amp;user=28093284%40N00" />');

	$('.closebox').live('click', function(evt){
      	evt.preventDefault();
		$(this).parent().hide(200,function(){
			$(this).remove();
		});
	});

	if ($('#photobar').length)
		getHomePageImages();


	if (supports_mp3()) {

		$('#samples .playaudio').each(function(evt){
			var Src = $(this).attr('href');
			var html = $('<audio preload="none" type="audio/mpeg" style="position:absolute;height:0;width:0;overflow:hidden;" />').data('src',Src)
						.bind({

					        loadstart: function(){
					        	//console.log("LOADSTART: begin loading media data")
				        	},
					        progress: function(){
					        	// console.log("fetching media...")
						        var soFar = parseInt(((this.buffered.end(0) / this.duration) * 100));
								$(this).closest('td').find('.loading').css({'width':(soFar + 1) + '%'});
					        },
					        canplay: function(){
					        	// console.log("CANPLAYcan play, but will eventually have to buffer")
					        },
					        canplaythrough: function(){
					        	// console.log("CANPLAYTHROUGH: can play, won't have to buffer anymore:" + this.currentTime);
								var player = $(this).closest('td').find('.player');
								if (player.hasClass('aloading')) {
						        	this.play();
						        	player.removeClass('aloading');
					        	}
					        },
					        loadeddata: function(){/*console.log("can render media data at current playback position")*/},
							loadedmetadata	: function(){/*console.log("now we know duration, height, width, and more")*/},
							timeupdate: function(){
								//console.log(this.currentTime)
								var percentLoaded = parseInt((this.currentTime / this.duration) * 100);
								$(this).closest('td').find('.playing').css({'width':percentLoaded + '%'});
							},
							durationchange: function(){/*console.log("new info about the duration")*/},
							volumechange: function(){/*console.log("volume or muted property has changed")*/},
							play: function(){
								//console.log("PLAY: just returned from the play function")
								$(this).closest('td').find('.player').addClass('isplaying').removeClass('paused');
							},
							playing: function(){/*console.log("PLAYING: playback has started ")*/},
							pause: function(){
								//console.log("PAUSE: just returned from the pause function: " + this.paused);
								$(this).closest('td').find('.player').addClass('paused').removeClass('isplaying');
							},
							suspend: function(){/*console.log("SUSPEND: loading has stopped, but not all of the media has downloaded")*/},
							waiting: function(){
								//console.log("WAITING: stopped playback because we're waiting for the next frame")
								this.pause();
								$(this).closest('td').find('.player').addClass('aloading');
							},
							stalled: function(){/*console.log("STALLED: fetching media data, but none is arriving")*/},
							ended: function(){
								//console.log("ENDED: Has just finished")
								$(this).closest('td').find('.player').addClass('played').removeClass('isplaying');
								this.pause();
							},
							error: function(){/*console.log("ERROR")*/}

						});

			$(this).closest('td').addClass('widget');
			$(this).wrap(html);

			var customControl = $('<div class="player"><span class="playtoggle" /><span class="gutter"><span class="loading" /><span class="playing" /></span><span class="timeleft" /></div>')
				.click(
					function(){
						var player = $(this).closest('td').find('audio').get(0);
						// Chrome 10, 11 preload bug workaround
						if (!!!$(player).attr('src')) {
							$(player).attr({
								preload : 'auto',
								src : $(player).data('src')
							});
						}
						if (!$(this).hasClass('isplaying')) {
							player.play();
						} else {
							player.pause();
						}
					}
				);

			$(this).closest('td').append(customControl);

		});

	}

	// Get the counter data
	// IE caches the AJAX request so we need to make the URL unique
	var iefix = "?iefix=" + new Date().getTime();
	$.get('/counter.txt'+iefix, function(data) {
	  addCounter(data);
	});


}); // !end ready

// Format the counter data
function addCounter(data){
	var source = $("<div id='hits'><span>You are the</span><b></b><span>visitor to our site</span></div>");
	$('b',source).append(formatNumber(data));
	$('#nav').append(source);
}

$(window).load(function(evt){
	// See if we need a Recaptcha
	recaptchaCreate();

	// Open hidden details if URL has hash
	if(window.location.hash.length) {
		var oHash = window.location.hash;
		var sSelector = 'a[href="' + oHash + '"]';
		$(sSelector).trigger('click');
	}
});

function recaptchaCreate(){
	if ($('#online-enquiry').length) {
		Recaptcha.create("6Ld6ZQUAAAAAAO0HQPI6vGO7G9VsaSqQ_21MtswZ", 'captcha_palcholder', {
			theme: "white",
			callback: null,
			tabindex : 0
		});
	}
}

function getHomePageImages() {
	var apicall = 'http://api.flickr.com/services/rest/?method=flickr.photos.search';
	var apiKey = '&api_key=622023fdafda30f830ab0d22a411ab14';
	var userID = '&user_id=38364432@N03';
	var tag = '&tags=homepage';
	var defaults = '&per_page=9&page=1&sort=interestingness-desc&format=json&jsoncallback=?';
	var extras = '&extras=views,media,path_alias,url_sq,url_s,url_m';

	var getRequest = apicall + apiKey + userID + tag + defaults + extras;

	$.getJSON(getRequest,function(data){
      $.each(data.photos.photo, function(i,item){
      	var a = $('<a/>',{'href':item.url_m,click:function(evt){
      		evt.preventDefault();
      		var hloc = $('#photobar').offset();
      		var vloc = $('#main').offset();
      		var flickrUrl = 'http://www.flickr.com/photos/' + item.pathalias + '/' + item.id + '/';
      		displayHomePhoto(flickrUrl, item.url_s, item.height_s, item.width_s,vloc.left,hloc.top);

      	}}).append($('<img>',{'src':item.url_sq})).appendTo('#photobar');
        if ( i == 9 ) return false;
    });
   });
}

function displayHomePhoto(flickrUrl,url,h,w,ol,ot) {
	if(!$('#photoviewer').length) {

		$('<div id="photoviewer" style="display:none;"><a class="closebox" href="#">Close</a><a id="flickerlink" href="http://www.flickr.com/" title="Open this photo in Flickr.com"><img src="/ui/i/icon_flickr.png"/></a><div id="photoframe" style="display:none;"><img/></div></div>').appendTo(document.body);
		$('#photobar').clone(true).attr('id','photoindex').appendTo($('#photoviewer'));
		$('#photoviewer').css({top:ot-98,left:ol-80}).fadeIn(350);
		//$('#photoframe').fadeIn(500);
	}

	if (url !== $('#photoframe img').attr('src')) {

		$('#flickerlink').attr('href',flickrUrl);

		var tpad = 'padding-top:' + Math.floor((260 - h)/2) + 'px;';
		var lpad = 'padding-left:' + Math.floor((260 - w)/2) + 'px;';

		$('#photoframe').fadeOut(250,function(){
			$(this).find('img').attr({'src':url,'width':w,'height':h,'style':tpad+lpad,'alt':''}).click(function(){
				window.location = flickrUrl;
			}).load(function(){
				$(this).parent().fadeIn(250);
			});
		});

	} else {
		$('#photoframe').fadeOut(250).fadeIn(250)
	}

}

// <audio controls="controls"><source src="http://www.streetparty.com.au/MP3/Grabs/{url}" type="audio/mpeg"/></audio>
function supports_audio() {
  return !!document.createElement('audio').canPlayType;
}

function supports_mp3() {
  if (!supports_audio()) { return false; }
  var v = document.createElement('audio');
  return v.canPlayType('audio/mpeg');
}

function supportsTableCell() {
	var el = document.createElement('span');

	try {
	  el.style.display = 'table-cell';
	} catch(err) {
	  el.style.display = 'inline';
	}

	return (el.style.display === 'table-cell')?true:false;
	delete el;
}


function formatNumber(nStr) {

	nStr = trim(nStr);
	var nths = ["th","st","nd","rd","th","th","th","th","th","th"];

	var lastNum = (nStr.charAt(nStr.length - 1));
	var nth = nths[lastNum];

	// If last 2 numbers are Teen numbers then
	// we need to treat as a special case
	if (nStr.length > 1) {
		var teenTest =  nStr.charAt(nStr.length-2);
		if (teenTest == 1) {
			nth =  "th";
		}
	}

	var rgx = /(\d+)(\d{3})/;
	while (rgx.test(nStr)) {
		nStr = nStr.replace(rgx, '$1' + ',' + '$2');
	}
	return nStr + nth;
}

function trim(str) {
	return str.replace(/^\s+|\s+$/g, '');
}