$(document).ready(function() {
	
	
	// AJAX: we need to fetch a list of 100 random directory names which we store in a js variable
	var randomArtists = Array();
	var isLoadingArtistInfo = false;
	
	getRandomArtists();
	
	
	function getRandomArtists() {
	
		console.log('getting random artists');
		
		$.getJSON("ajax/getRandomArtists.php", function(json) {
			
			if (json.hasError == false) {
				
				// add the returned data to our random artists array
				//console.log(json);
				$.each(json.data, function(i, artist) {						
					randomArtists.push(artist);
				});
				
				
				// get the info and display it for the first set of artists
				getArtistInfo();
				
			} else {
				
				console.log('json result is blank. error: ' + json.error + ", errorMessage: " + json.errorMessage);
			}
			
		});
		
		//console.log(randomArtists);
	};
	
	
	
	
	// AJAX: load and display additional data when we scroll down
	
	
	// fetch & display our last 5 requested
	function getArtistInfo() {
		
		if (randomArtists.length == 0 || isLoadingArtistInfo) return;
		isLoadingArtistInfo = true;
		
		console.log('get artist info');
		
		//var ID = $(".message_box:last").attr("id");
		
		var directoryNames = Array();
		
		// pop off the top i from randomArtists
		var i = 5;
		if (i > randomArtists.length) i = randomArtists.length;
		
		//console.log('i: '+i);
		
		for (j=0; j < i; j++) {
			directoryNames.push(randomArtists.pop());
		}
		
		
		//console.log(directoryNames);
		//console.log('-------');
		//console.log(randomArtists);
		
		
		// show the loading animation
		$("#main").append('<img id="loadingAnimation" src="/images/loadingAnimation.gif">');
		$("#loadingAnimation").hide().fadeIn(600);
		
		
		// load the artists' info
		$.getJSON("ajax/getArtistInfo.php?directoryNames="+directoryNames, function(json) {
			
			if (json.hasError == false) {
				
				//console.log('get artist info....');
				//console.log(json);
				
				// for each returned artist, build and display the info
				$.each(json.data, function(i, artist) {
					insertArtistInfo(i, artist);
				});
				
			}
			
			
			// hide the loading animation
			$("#loadingAnimation").remove();
			
			
			// set the flag to signify that we're not loading the artist info anymore
			isLoadingArtistInfo = false;
		});
	};
	
	
	// populate and insert the html for each portfolio
	function insertArtistInfo(directoryName, artistInfo) {
		
		console.log('insertArtistInfo()');
		//console.log(artistInfo);
		//console.log('------------');
		
		
		var artistInfoHTML = '\
		<div class="portfolio">\
			\
			<img class="tempMainPhoto" src="http://photos.ndustrio.us/'+directoryName+'/'+artistInfo.photos[0]+'">\
			\
			<div class="artistName">'+artistInfo.name+'</div>\
			\
			<div class="artistWebsite"><a href="http://'+artistInfo.website+'" target="_blank">'+artistInfo.website+'</a></div>\
			\
			<div class="artistLocation">'+artistInfo.city+', '+artistInfo.state+'</div>\
			\
			<img src="/images/favorite-up.png" class="favoriteIndicator">\
			\
		</div>\
		';
		
		
		$("#portfolios").append(artistInfoHTML);
	};
	
	
	// function that listens for us to hit the bottom of the page
	$(window).scroll(function() {
		
		if ($(window).scrollTop() == $(document).height() - $(window).height()) {
			getArtistInfo();
		}
		
	});
});