var status;
var page;
var pages;

var photoList;
var photoListIndex;

var preLoadLimit;
var preLoadIndex;

$(function() {
	status = "";
	page   = 1;
	pages  = 1;
	
	photoList = new Array();
	photoListIndex = 0;
	
	preLoadLimit = 20;
	preLoadIndex = 0;
	
	getPhotoList();
	
	$("#photo").hide();
	
	$("#photo").click(function() {
		if(photoListIndex >= photoList.length) {
			return;
		}
		
		$(this).fadeOut(200, function() {
			getPhoto();
			
			if(photoListIndex % preLoadLimit == 0) {
				preLoad();
			}
		});
	});
});

function getPhotoList() {	
	$.getJSON("../php/Flickr.php?page=" + page, function(jsonData) {
		try {
			status = jsonData['status'];
			
			if(status == "ok") {
				photoList = jsonData['photos'];
				pages     = jsonData['pages'];
				
				if(pages > page) {
					page++;
				}
				
				getPhoto();
				preLoad();
			}
		}
		catch(e) {
		}
	});
}


function getPhoto() {
	$("#photo").load(function() {
		$(this).fadeIn(200)
	});
	
	$("#photo").attr("src", photoList[photoListIndex]);
	$("#index").html(photoListIndex);
	
	photoListIndex++;
}

function preLoad() {
	var cacheImageList = new Array();
	var cacheImage;
	var i;
	var endIndex;
	
	if(preLoadIndex >= photoList.length) {
		return;
	}
	
	if(preLoadIndex == 0) {
		endIndex = preLoadLimit * 2;
	}
	else {
		endIndex = preLoadIndex + preLoadLimit;
	}
	
	for(i = preLoadIndex; i < endIndex; i++) {
		if(i >= photoList.length) {
			break;
		}
		
		cacheImage = document.createElement("img");
		cacheImage.src = photoList[i];
		cacheImageList.push(cacheImage);
		
		$("#debug").html($("#debug").html() + " " + i);
	}
	
	$("#debug").html($("#debug").html() + "<br>\n");
	
	preLoadIndex = i;
}