var gallery_exhibits = null;
var gallery_gref;
var gallery_gtitle;
var gallery_gpauseplay;
var gallery_showing = -1;
var gallery_timer;
var gallery_duration = 3000; // default in ms
var gallery_paused = false;

function GetGallery() {
  var xhr;
  var jsondata;
  var i;
  
  if (window.XMLHttpRequest) {
    // code for IE7+, Firefox, Chrome, Opera, Safari
    xhr = new XMLHttpRequest();
  } else {
    // code for IE6, IE5
    xhr = new ActiveXObject("Microsoft.XMLHTTP");
  }
  xhr.open("get", "data/gallery.json", false);
  xhr.send(null);

	jsondata = JSON.parse(xhr.responseText);
	if (jsondata.duration_ms) {gallery_duration = jsondata.duration_ms;}
	if (!jsondata.exhibits) {return;}
	gallery_exhibits = jsondata.exhibits;
	if (gallery_exhibits.length < 1) {return;}
	for (i = 0; i < gallery_exhibits.length; i++) {
		gallery_exhibits[i].loadstate = "unloaded";
	}
}

function LoadedExhibit(index) {
	gallery_exhibits[index].loadstate = "loaded";
}

function LoadExhibit(index) {
	if (gallery_exhibits[index].loadstate === "unloaded") {
		gallery_exhibits[index].loadstate = "loading";
		gallery_exhibits[index].image = new Image();
		gallery_exhibits[index].image.id = "gimage";
		gallery_exhibits[index].image.onload = function() {
			LoadedExhibit(index);
		};
		gallery_exhibits[index].image.src = gallery_exhibits[index].src + "mdpr.jpg";
	}
}

function ShowExhibit() {
	if (gallery_gref.firstChild) {
		gallery_gref.removeChild(gallery_gref.firstChild);
	}
	gallery_gref.appendChild(gallery_exhibits[gallery_showing].image);
	gallery_gref.href = gallery_exhibits[gallery_showing].link;
	gallery_gtitle.innerHTML = gallery_exhibits[gallery_showing].title;
	Play();
	LoadExhibit((gallery_showing + 1) % gallery_exhibits.length);
}

function Timeout() {
	var next;
	window.clearTimeout(gallery_timer);
	if (gallery_exhibits[gallery_showing].loadstate === "loaded") {
		gallery_showing = (gallery_showing + 1) % gallery_exhibits.length;
	}
	ShowExhibit();
}

function Pause() {
	window.clearTimeout(gallery_timer);
	gallery_gpauseplay.alt = "continue";
	gallery_gpauseplay.title = "continue";
	gallery_gpauseplay.src = "graphics/ctrlplay.png";
	gallery_paused = true;
}

function Play() {
	gallery_gpauseplay.alt = "pause";
	gallery_gpauseplay.title = "pause";
	gallery_gpauseplay.src = "graphics/ctrlpause.png";
	gallery_paused = false;
	gallery_timer = window.setTimeout(Timeout, gallery_duration);
}

function ClickPausePlay() {
	if (!gallery_paused) {Pause();} else {Play();}
}

function ClickBackward() {
	var next;
	window.clearTimeout(gallery_timer);
	next = (gallery_exhibits.length + gallery_showing - 1) % gallery_exhibits.length;
	if (gallery_exhibits[next].loadstate === "loaded") {
		gallery_showing = next;
	}
	ShowExhibit();
}

function ClickForward() {
	window.clearTimeout(gallery_timer);
	gallery_showing = (gallery_showing + 1) % gallery_exhibits.length;
	ShowExhibit();
}

function RenderGallery() {
	var html;
	if (gallery_exhibits) {
		
		window.clearTimeout(gallery_timer);
		html = "";
		html += "<img id='gbackward' alt='previous' title='previous' src='graphics/ctrlprev.png' onclick='ClickBackward()'/>";
		html += "<img id='gpauseplay' alt='continue' title='continue' src='graphics/ctrlplay.png' onclick='ClickPausePlay()'/>";
		html += "<img id='gforward' alt='next' title='next' src='graphics/ctrlnext.png' onclick='ClickForward()'/>";

    document.getElementById('gcontrols').innerHTML = html;
    gallery_gref = document.getElementById('gref');
    gallery_gtitle = document.getElementById('gtitle');
    gallery_gpauseplay = document.getElementById('gpauseplay');
    gallery_gpauseplay.src = "graphics/ctrlpause.png";
    
    LoadExhibit(0);
    gallery_showing = 0;
    ShowExhibit();
  }
}