Gallery.imgPath = "images/";
Gallery.pageImg = null;
Gallery.imgCaption = null;
Gallery.loadingImg = null;
Gallery.nextBtn = null;
Gallery.prevBtn = null;
Gallery.startBtn = null;
Gallery.curImg = 0;
Gallery.toLoad = 0;
Gallery.timer = null;

function Gallery() {
}

var gitems = [
	[ "screen-analyse1-crop.png", "MixZing's clean design allows the album art to speak for itself.  And if you're missing album art then we automatically download it for you." ],
	[ "screen-analyse2-crop.png", "Shortly after you start playing a song MixZing adds recommended songs to your now playing queue.<br>Tapping the album area makes the advanced controls appear and disappear." ],
	[ "screen-analyse3-crop.png", "Tapping the Queue button displays the now playing queue." ],
	[ "screen-analyse-queue1-crop.png", "The now playing queue shows the original song you selected plus the recommendations that MixZing added." ],
	[ "screen-analyse-queue2-crop.png", "Tapping the positive rating button adds the recommended song to your playlist.<br>Tapping the negative rating would remove the song from your recommendations." ],
	[ "screen-analyse-queue3-crop.png", "This makes it very easy to create great playlists that you can enjoy over and over." ],
	[ "screen-analyse-queue4-crop.png", "Rating the recommendations allows MixZing to update your queue with improved recommendations a short time later." ],
	[ "screen-analyse-queue5-crop.png", "Tapping a recommended song plays that song." ],
	[ "screen-analyse4-crop.png", "You can also rate songs from the main playing screen using the rating buttons, which are enabled whenever a recommended song is being played." ],
	[ "screen-analyse5-crop.png", "Tapping the positive rating button adds the recommended song to your playlist, the same as in the now playing queue screen." ],
	[ "screen-analyse6-crop.png", "By default MixZing automatically rates a song positively if you listen to most of it.  You can also tell MixZing to rate a song negatively if you skip it.  This is the easiest way to create a customized playlist." ],
	[ "screen-analyse7-crop.png", "Tapping the Info button brings up artist information." ],
	[ "screen-analyse8-crop.png", "A future update will have multiple tabs for song lyrics, artist news, events, etc." ],
	[ "screen-analyse9-crop.png", "MixZing also recommends songs that you don't have in your library (this feature is currently in beta).  These songs are accessed by selecting the New Music menu option." ],
	[ "screen-analyse10-crop.png", "You can listen to previews of the new music recommendations and rate them, the same as for music from your library." ],
	[ "screen-analyse11-crop.png", "Tapping the Queue button displays the new music recommendation queue." ],
	[ "screen-analyse12-crop.png", "Positively rating a New Music song adds it to your shopping cart.  When this feature is out of beta you will be able to buy and download the songs that are in your shopping cart." ]
];
var numImgs = gitems.length;
var lastImg = numImgs - 1;

function GalleryItem(num, fname, caption, delay) {
	if (num != null) {
		this.num = num;
		this.src = Gallery.imgPath + fname;
		this.caption = caption;
		this.delay = delay;

		var img = new Image();
		img.onload = function(evt) { imgOnload(num, true, evt); };
		img.onerror = img.abort = function(evt) { imgOnload(num, false, evt); };
		this.img = img;

		this.loaded = false;
		this.loading = false;
		this.showOnLoad = false;
	}
}

new GalleryItem();

GalleryItem.prototype.load = function(show) {
	//assert(this.loaded == false, "load(" + this.num + ") called when already loaded");
	this.showOnLoad = show;
	if (!this.loading) {
		this.loading = true;
		this.img.src = this.src;
	}
}

GalleryItem.prototype.show = function() {
	Gallery.imgCaption.innerHTML = this.caption;
	//alert("show: " + this);
	if (this.loaded) {
		Gallery.pageImg.src = this.src;
		Gallery.loadingImg.style.visibility = "hidden";
		Gallery.pageImg.style.visibility = "visible";
		Gallery.curImg = this.num;
		if (this.delay) {
			Gallery.timer = window.setTimeout(function() { showNext(true, true); }, this.delay);
		}
	}
	else {
		Gallery.pageImg.style.visibility = "hidden";
		Gallery.loadingImg.style.visibility = "visible";
		this.load(true);
	}
}

GalleryItem.prototype.toString = function() {
	return "num = " + this.num + ", loaded = " + this.loaded + ", loading = " + this.loading + ", src = " + this.src;
}

function handled(evt) {
	if (evt != null) {
		if (evt.returnValue) {
			evt.returnValue = false;
		}
		else if (evt.preventDefault) {
			evt.preventDefault();
		}
	}
	return false;
}

function getEvent(evt) {
	return (evt != null ? evt : event);
}

function imgOnload(num, success, evt) {
	evt = getEvent(evt);
	var item = gitems[parseInt(num)];
	//alert("imgOnload: item = " + item + ", toload = " + Gallery.toLoad);
	item.loading = false;
	item.loaded = true;
	if (item.showOnLoad) {
		item.showOnLoad = false;
		item.show();
	}
	if (++Gallery.toLoad <= lastImg) {
		loadNext();
	}
	return success ? handled(evt) : true;
}

function loadNext() {
	//assert(Gallery.toLoad <= lastImg, "loadNext called with toLoad > lastImg");
	var next = Gallery.toLoad;
	//alert("loadNext: next = " + next);
	if (next <= lastImg) {
		var item = gitems[next];
		//alert("loadNext: item = " + item);
		if (!item.loaded && !item.loading) {
			window.setTimeout(function() { item.load(false); }, 10);
		}
	}
	//else {
	//	assert(i > 0, "loadNext called with all images loaded or loading");
	//}
}

function showImg(num) {
	if (num == 0) {
		Gallery.startBtn.style.display = "block";
		Gallery.prevBtn.style.display = "none";
		Gallery.nextBtn.style.display= "none";
	}
	else {
		Gallery.startBtn.style.display = "none";
		Gallery.prevBtn.style.display = "block";
		Gallery.nextBtn.style.display = num == lastImg ? "none" : "block";
	}
	gitems[num].show();
}

function showNext(forward, animate) {
	if (!animate && Gallery.timer) {
		window.clearTimeout(Gallery.timer);
	}
	Gallery.timer = null;

	var num = Gallery.curImg;
	var item;
	if (forward) {
		if (!animate && gitems[num].delay) {
			// skip over animation
			while (gitems[++num].delay);
		}
		if (++num > lastImg) {
			num = lastImg;
		}
	}
	else {
		if (num > 0 && gitems[num - 1].delay) {
			// skip to start of animation
			while (--num > 0 && gitems[num - 1].delay);
		}
		if (--num < 0) {
			num = 0;
		}
	}
	showImg(num);
	return false;
}

function initGallery() {
	Gallery.pageImg = document.getElementById("pageImg");
	Gallery.imgCaption = document.getElementById("imgCaption");
	Gallery.loadingImg = document.getElementById("loadingImg");
	Gallery.nextBtn = document.getElementById("nextBtn");
	Gallery.prevBtn = document.getElementById("prevBtn");
	Gallery.startBtn = document.getElementById("startBtn");

	for (var i = lastImg; i >= 0; --i) {
		var a = gitems[i];
		gitems[i] = new GalleryItem(i, a[0], a[1], a[2]);
	}
	showImg(0);
}