﻿
function Snapshot(moduleID, snapshotbronnen) {
	var This = this;
	This.Initialiseer(moduleID, snapshotbronnen);
	if (Sys) {
		this.aspAjaxUnloader = function() {
			This.unload();
			Sys.WebForms.PageRequestManager.getInstance().remove_pageLoading(This.aspAjaxUnloader);
		}
		Sys.WebForms.PageRequestManager.getInstance().add_pageLoading(this.aspAjaxUnloader);
	}
}

Snapshot.prototype = {
	bronnen: null,
	moduleID: null,
	rootdiv: null,
	titelIntervalID: null,
	intervalID: new Array(),
	unload: function() {
		var This = this;
		if (This.titelIntervalID != null)
			clearInterval(This.titelIntervalID);
		if (This.intervalID != null) {
			for (i = 0; i < This.intervalID.length; i++)
				clearInterval(This.intervalID[i]);
		}
		This.rootdiv.innerHTML = "";
		This.bronnen = null;
		This.moduleID = null;
		This.rootdiv = null;
		This.intervalID = null;
	},
	Update: function(index) {
		var This = this;
		var datum = new Date();
		var snapshottitel = $(String.format("#snapshottitel_{0}_{1}", This.moduleID, index));
		var snapshotimage = document.getElementById(String.format("snapshotimage_{0}_{1}", This.moduleID, index));
		if (snapshotimage) {
			var pad = This.bronnen[index].pad;
			var urlscheiding = "?";
			if (pad.indexOf("?") != -1)
				urlscheiding = "&_tijd_=";
			if (pad.indexOf("ftp:") != -1)
				urlscheiding = "#";
			snapshotimage.src = String.format("{0}{1}{2}", pad, urlscheiding, datum.getTime());
			if (snapshottitel.interval != "")
				snapshottitel.attr("interval", This.bronnen[index].interval);
		}
	},
	UpdateTitels: function() {
		var This = this;
		if (This.bronnen != null) {
			for (i = 0; i < This.bronnen.length; i++) {
				var titel = $(String.format("#snapshottitel_{0}_{1}", This.moduleID, i));
				var voortgang = $(String.format("#snapshotvoortgang_{0}_{1}", This.moduleID, i));
				var secondenStr = titel.attr("interval");
				if (secondenStr != "") {
					var breedte = parseInt(This.bronnen[i].breedte);
					var interval = parseInt(This.bronnen[i].interval);
					var seconden = parseInt(secondenStr);
					if (secondenStr == undefined || secondenStr == "0")
						$(voortgang).css("width", "0px");
					else {
						seconden--;
						titel.attr("interval", seconden.toString());
						var breedtevoortgang = Math.round(breedte - (breedte / interval) * seconden);
						$(voortgang).css("width", String.format("{0}px", breedtevoortgang));
					}
				}
			}
		}
	},
	Initialiseer: function(moduleid, snapshotbronnen) {
		var This = this;
		if (snapshotbronnen != null) {
			This.moduleID = moduleid;
			This.bronnen = snapshotbronnen;
			This.rootdiv = document.getElementById(String.format("snapshot_{0}", This.moduleID));
			This.titelIntervalID = setInterval(String.format("Snapshot{0}.UpdateTitels()", This.moduleID), 1000);
			$(This.rootdiv).css("float", "left");
			for (i = 0; i < This.bronnen.length; i++) {
				var containerdiv = document.createElement("div");
				var snapshottitel = document.createElement("div");
				var snapshotvoortgang = document.createElement("div");
				var snapshotimage = document.createElement("img");
				var volgendesnapshot = i < This.bronnen.length ? This.bronnen[i + 1] : null;

				//Containerdiv
				$(containerdiv).css("float", "left");

				//Titel
				snapshottitel.innerText = This.bronnen[i].titel;
				$(snapshottitel).addClass("Snapshottitel");
				snapshottitel.setAttribute("id", String.format("snapshottitel_{0}_{1}", This.moduleID, i));
				if (parseInt(This.bronnen[i].interval) > 1 && This.bronnen[i].voortgangsindicator == "true")
					snapshottitel.interval = This.bronnen[i].interval;

				//Voortgangsindicator
				snapshotvoortgang.setAttribute("id", String.format("snapshotvoortgang_{0}_{1}", This.moduleID, i));
				
				//Imagetag
				snapshotimage.setAttribute("src", This.bronnen[i].pad);
				snapshotimage.setAttribute("id", String.format("snapshotimage_{0}_{1}", This.moduleID, i));
				$(snapshotimage).css("width", This.bronnen[i].breedte + "px");
				$(snapshotimage).css("height", (This.bronnen[i].breedte / 5 * 4) + "px");
				$(containerdiv).css("padding-left", This.bronnen[i].marge + "px");
				$(containerdiv).css("width", This.bronnen[i].breedte + "px");
				snapshotimage.setAttribute("title", String.format("Verversingsinterval {0} seconden", This.bronnen[i].interval));

				//Voeg alle elementen toe aan de containerdiv
				containerdiv.appendChild(snapshottitel);
				containerdiv.appendChild(snapshotvoortgang);
				containerdiv.appendChild(snapshotimage);
				This.rootdiv.appendChild(containerdiv);

				var voortgang = $(String.format("#snapshotvoortgang_{0}_{1}", This.moduleID, i));
				$(voortgang).addClass("Snapshotvoortgangsindicator");
				$(voortgang).css("width", "0px");

				//Voeg een groepsscheiding toe indien nodig
				if (volgendesnapshot) {
					if (volgendesnapshot.groep != This.bronnen[i].groep) {
						var scheidingsdiv = document.createElement("div");
						scheidingsdiv.style.clear = "both";
						This.rootdiv.appendChild(scheidingsdiv);
					}
				}

				//Interval
				var interval = parseInt(This.bronnen[i].interval);
				if (interval == NaN)
					interval = 1000;
				else interval *= 1000;
				This.intervalID[i] = setInterval(String.format("Snapshot{0}.Update({1})", This.moduleID, i), interval);
			}
		}
	}
}
