$(document).ready(function() {
				  function frontBackTransit() {
				  if ( $('#cardFrontImage').css('display') == 'none' ) {
				  $('#cardBackImage').fadeOut('normal', function() {
											  $('#cardFrontImage').fadeIn('normal');
											  });
				  } else {
				  $('#cardFrontImage').fadeOut('normal', function() {
											   $('#cardBackImage').fadeIn('normal');
											   });
				  }
				  }
				  function getNote() {
				  // get last path
				  var paths = $('#cardBackImage').attr('src').split('/');
				  $.getJSON(gSiteURL + 'index.php/browse/note/' + paths[paths.length - 1], 
							function(data, textStatus) {
							$('#cardPosted').html('<span class="smallFont greenFont">posted on ' + data.date_created + '</span><br /><span class="smallFont greenFont">from</span> ' + data.from_where );
							$('#cardMainNote').html(data.message);
							$('#cardLike > .orangeFont').text(data.count);
							$('#cardPosted').fadeIn();
							$('#cardMainNote').fadeIn();
							});
				  $('#cardPosted').fadeOut();
				  $('#cardMainNote').fadeOut();
				  }
				  $("#flipButton").click(function() {
										 frontBackTransit();
										 return false;
										 });
				  // parse the list
				  $('#noteList ul li img')
				  .each(function(i, val){
						$(val).parent()
						.click(function() 
							   {
							   var pimg, imgLoaded = false, fadedOut = false;
							   // replace image
							   var curImg, otherImg, curImgPath, otherImgPath;
							   if ( $('#cardFrontImage').css('display') == 'none' ) {
								   curImg = $('#cardBackImage');
								   otherImg = $('#cardFrontImage');
								   curImgPath = 'card_browse_front';
								   otherImgPath = 'card_browse_back';
							   } else if ( $('#cardBackImage').css('display') == 'none' ) {
								   curImg = $('#cardFrontImage');
								   otherImg = $('#cardBackImage');
								   curImgPath = 'card_browse_back';
								   otherImgPath = 'card_browse_front';
							   }
							   pimg = $("<img />").attr('src', val.src.replace(/card_browse_thumb/, curImgPath))
							   .load(function() {
									 imgLoaded = true;
									 if ( fadedOut ) {
									 $('#loadingSpin').css('display', 'none');
									 curImg.attr('src', $(this).attr('src'));
									 curImg.fadeIn('normal');
									 otherImg.attr('src', val.src.replace(/card_browse_thumb/, otherImgPath));
									 getNote();
									 }
									 });
							   $('#cardPosted').fadeOut();
							   $('#cardMainNote').fadeOut();
							   curImg.fadeOut('normal', function() {
											  fadedOut = true;
											  if ( imgLoaded ) {
											  curImg.attr('src', pimg.attr('src'));
											  curImg.fadeIn('normal');
											  otherImg.attr('src', val.src.replace(/card_browse_thumb/, otherImgPath));
											  getNote();
											  } else {
											  $('#loadingSpin').css('display', 'block');
											  }
											  });
							   });
						});
				  // note
				  $('#moreNoteBtn').click(getNote);
				  
				  });