/**
 * ########################################
 * ## My IMG-UP.net Bildverwaltungs-Tool ##
 * ######## von Benjamin Grössing #########
 * ########################################
 * 
 * DAS KOPIEREN DES QUELLCODES, WENN AUCH NUR AUSZUGSWEISE, IST VERBOTEN.
 * 
 * Das Werk ist urheberrechtlich geschützt.
 * Die dadurch begründeten Rechte, insbesondere die der Vervielfältigung,
 * Verbreitung, Ausstellung, Bearbeitung sowie der öffentlichen Demonstration, vorbehalten.
 */

window.onload = function() {
	my = new MyImages("my_imgup");
	my.writeIDs();
	my.writeWaitingMessage();
	my.writeControlBar();
	my.writeImgNum();
	my.selectImgNumByCookie();
	my.writeDataIDs();
	my.requestAlben();
}

function MyImages(id) {
	this.id = id;
	this.albenoption = "";
	this.newAlbumID = 0;
	this.newAlbumIndex = 0;
	this.page = 0;
	this.imgnum = 0;
	this.albumdavorselectedIndex = 0;
	this.searchfdavor = "";
	this.infolayer;
	this.bgcolors = new Array("#BFFFBF", "#70FF6F");
	this.requests;
	this.requestActive = false;
	this.limits = new Array	(
					new Array(8, 12, 16, 24),
					new Array(8, 16, 24, 32, 40),
					new Array(4, 8, 12, 16)
					);
	this.warningmsg = "<div style='color: darkred; font-weight: bold'>Achtung: Dieses Bild wird bald gelöscht!</div>";

	function writeTo(id, html) {
		document.getElementById(id).innerHTML = html;
	}
	
	this.selectImgNumByCookie = function() {
		var cnum = this.getCookie("my_num");
		var cnumact = (cnum != "" && cnum != null);
		
		if(cnumact) {
			var opt = document.forms.my_ctrlbar_form.my_imgnumselect.options;
			for(var i = 0; i < opt.length; i++) {
				if(opt[i].text == cnum) {
					document.forms.my_ctrlbar_form.my_imgnumselect.selectedIndex = i;
				}
			}
		}
	}
	
	this.writeIDs = function() {
		writeTo(this.id, 
				"<table>" +
				"<tr><td></td><td>" +
				"<table cellspacing='0' width='100%'><tr>" +
				"<td style='padding-left: 5px; height: 20px; vertical-align: middle'>" +
				"<span id='my_changemsg' style='background-color: #FFF47F; vertical-align: middle; text-align: center; padding: 2px; display: none'></span>" +
				"</td><td style='padding: 0px; text-align: right; vertical-align: middle'><span id='my_pages'>&nbsp;</span>&nbsp;</td></tr></table></td></tr>" +
				"<tr>" +
				"<td rowspan='3' style='width: 170px'>" +
				"<div id='my_ctrlbar'></div>" +
				"</td>" +
				"<td style='width: 530px'></td></tr>" +
				"<tr><td><div id='my_data'></div></td></tr>" +
				"<tr><td style='padding: 0px; text-align: right'><span id='my_pages2'>&nbsp;</span>&nbsp;</td></tr>" +
				"</td></tr></table>"
				);
	}
	
	this.writeWaitingMessage = function() {
		writeTo("my_data", "My IMG-UP.net wird initialisiert...");
	}
	
	this.newQuery = function(id, url, param) {
		if(this.requests == null || this.requests.length <= 0) {
			this.requests = new Array(1);
			this.requests[0] = new Array(3);
			this.requests[0][0] = id;
			this.requests[0][1] = url;
			this.requests[0][2] = param;
		}
		else {
			temp = new Array(this.requests.length+1);
			for(var i = 0; i < this.requests.length; i++) {
				for(ii = 0; ii < 3; ii++) {
					temp[i][ii] = this.requests[i][ii];
				}
			}
			temp[this.requests.length][0] = id;
			temp[this.requests.length][1] = url;
			temp[this.requests.length][2] = param;
			this.requests = temp;
		}
		
		this.doNextQuery();
	}
	
	this.removeFirstQuery = function() {
		temp = new Array(this.requests.length-1);
		for(var i = 0; i < this.requests.length-1; i++) {
			for(ii = 0; ii < 3; ii++) {
				temp[i][ii] = this.requests[i][ii];
			}
		}
		this.requests = temp;
		this.requestActive = false;
	}
	
	this.setChangeMessage = function(msg, state) {
		writeTo("my_changemsg", msg + "&nbsp;<a href='#' onClick='my.setChangeMessage(\"\", false)' class='smartlink'>Schließen</a>");
		document.getElementById("my_changemsg").style.display = (state?"block":"none");
	}
	
	this.doNextQuery = function() {
		if(!this.requestActive && (this.requests.length > 0)) {
			this.requestActive = true;
			new Request(this.requests[this.requests.length-1][0],
						this.requests[this.requests.length-1][1],
						this.requests[this.requests.length-1][2],
						this);
		}
	}
	
	this.checkAnswer = function(reqid, xmldata) {
		this.removeFirstQuery();
		this.doNextQuery();
		switch(reqid) {
			case "alben1":
				this.writeAlben(xmldata);
				if(preselectalbum > 0) {
					document.forms.my_ctrlbar_form.my_alben_select.value = preselectalbum;
				}
				this.writeFilterText();
				this.requestData();
				break;
			case "new_album1":
				this.newAlbumID = xmldata.getElementsByTagName('id')[0].firstChild.data;
				this.requestAlbenAndSelectAlbum();
				break;
			case "alben2":
				this.writeAlben(xmldata);
				this.selectNewAlbum();
				break;
			case "alben3":
				this.writeAlbenSelectLayer(xmldata);
				this.selectNewAlbum();
				this.requestData();
				break;
			case "img1":
				this.writeImages(xmldata);
				break;
			case "batchremove":
					this.setChangeMessage("Bild(er) wurde(n) gelöscht.", true);
				this.requestData();
				break;	
			case "albenbatch" :
				this.writeAlbumBatchSelectLayer(xmldata);
				break;
			default:
				split = reqid.split(".");
				if(split[0] == "changelayer") {
					this.requestSingleDataAndRefreshLayer(split[1], split[2], split[3]);
				}
				else if(split[0] == "imglayer") {
					this.refreshLayerPart(split[1], split[2], xmldata);
				}
				else if(split[0] == "albenlayer") {
					this.writeAlbumSelectLayer(split[1], split[2], xmldata);
				}
				else if(split[0] == "albenselect") {
					this.writeAlben(xmldata);
					document.forms.my_ctrlbar_form.my_alben_select.value = split[1];
				}
				else if(split[0] == "albenselectreq") {
					this.writeAlben(xmldata);
					document.forms.my_ctrlbar_form.my_alben_select.value = split[1];
					this.requestData();
				}
				else if(split[0] == "removeImage") {
					this.setChangeMessage("Bild wurde gelöscht.", true);
					this.requestDataAndCheck(split[1]);
				}
				else if(split[0] == "imgcheck") {
					imgid = Math.floor(split[1]);
					checkboxes = new Array(this.imgnum);
					var ii = 0;
					for(var i = 0; i < this.imgnum-1; i++) {
						if(i == imgid) {
							ii++;
						}
						checkboxes[i] = document.getElementById("my_imgdata_check_" + ii).checked;
						ii++;
					}
					checkboxes[this.imgnum-1] = false;
					
					this.writeImages(xmldata);
					
					for(var i = 0; i < this.imgnum; i++) {
						document.getElementById("my_imgdata_check_" + i).checked = checkboxes[i];
					}
				}
				else if(split[0] == "batchalbum") {
					imgids = split[1].split(",");
					r_albumid = xmldata.getElementsByTagName("albumid")[0].firstChild.data;
					r_album = xmldata.getElementsByTagName("album")[0].firstChild.data;
					for(var i = 0; i < imgids.length; i++) {
						this.infolayer[imgids[i]][8] = r_albumid;
						this.infolayer[imgids[i]][9] = r_album;
					}
					this.albumCheckedCancel();
					albumfilter = document.forms.my_ctrlbar_form.my_alben_select.value;
					if(albumfilter != r_albumid && albumfilter != "-1") {
						this.requestAlbenSelectAlbumIDAndRequestData(albumfilter);
					}
					else {
						this.requestAlbenAndSelectAlbumID(albumfilter);
					}
					this.setChangeMessage("Bild(er) wurde(n) in das Album verschoben.", true);
				}
				break;
		}
	}
	
	this.selectNewAlbum = function() {
		document.my_ctrlbar_form.my_alben_select.selectedIndex = this.newAlbumIndex;
	}
	
	this.getCookie = function(name) {
	   var i=0;
	   var suche = name + "=";
	   while (i<document.cookie.length) {
	      if (document.cookie.substring(i, i + suche.length) == suche) {
	         var ende = document.cookie.indexOf(";", i + suche.length);
	         if(ende <= -1) {
	         	ende = document.cookie.length;
	         }
	         var cook = document.cookie.substring(i + suche.length, ende);
	         return unescape(cook);
	      }
	      i++;
	   }
	   return "";
	}
	
	this.writeControlBar = function() {
		var ctype = this.getCookie("my_type");
		var ctypeact = (ctype == "0" || ctype == "1");
		var ctrlbar = '<form name="my_ctrlbar_form" onsubmit="my.changeFilter(); return false;"> ' +
				'<table>' +
				'<tr><td colspan="2" class="bolded" style="width: 160px">Filter:</td></tr>' +
				'<tr><td>Suche:</td><td><input style="width: 110px" type="text" name="my_searchselect" class="textfield" onchange="my.checkSearchField()" onkeyup="my.checkSearchField()"></td></tr>' +
				'<tr class="hiddenitem" id="filter_album"><td>Album:</td><td><span id="my_albenselect"><select id="my_albumselect">' +
				'<option value="-3">Lade...</option></select></span></td></tr>' +
				'<tr class="hiddenitem" id="filter_view"><td>Ansicht:</td><td>' +
				'<select name="my_viewselect" onChange="javascript: my.writeImgNum()">' +
				'<option value="0"' + (ctypeact&&ctype=="0"?' selected="selected"':'') + '>Thumbnails</option>' +
				'<option value="1"' + (ctypeact&&ctype=="1"?' selected="selected"':'') + '>Details</option>' +
				'</select></td></tr> ' +
				'<tr class="hiddenitem" id="filter_num"><td>Zeige:</td><td><span id="my_imgnum"></span></td></tr>' +
				'<tr class="hiddenitem" id="filter_submit"><td></td><td><input type="submit" value="OK"></td></tr>' +
				'<tr id="filter_text"><td colspan="2" id="filter_text_value"></td></tr>' +
				'<tr><td colspan="2">&nbsp;</td></tr>' +
				'<tr><td colspan="2" class="bolded">Markierung:</td></tr>' +
				'<tr><td colspan="2">' +
					'<a href="javascript: my.checkAll()"><img src="img_int/check_all.gif" style="border-width: 0px"></a><br>' +
					'<a href="javascript: my.checkNone()"><img src="img_int/check_none.gif" style="border-width: 0px"></a><br>' +
					'<a href="javascript: my.checkInvert()"><img src="img_int/check_invert.gif" style="border-width: 0px"></a><br>' +
					'<hr style="background-color: green; height: 1px; border-width: 0px; width: 135px; margin-right: auto; margin-left: 0px">' +
					'<span id="my_batchalbum"><a href="javascript: my.albumChecked()"><img src="img_int/album.gif" style="border-width: 0px"></a></span><br>' +
					'<a href="javascript: my.deleteChecked()"><img src="img_int/batchdelete.gif" style="border-width: 0px"></a>' +
				'</td></tr>' +
				'</form>';
		writeTo("my_ctrlbar", ctrlbar);
	}
	
	this.writeFilterText = function() {
		tmp = "Es werden " + document.forms.my_ctrlbar_form.my_imgnumselect.value + " Bilder-";
		if(document.forms.my_ctrlbar_form.my_viewselect.value == 0)
			tmp += "Thumbnails";
		else
			tmp += "Details";
		
		tmp += " pro Seite";
			
		if(document.forms.my_ctrlbar_form.my_alben_select.value == 0)
			tmp += ", die in keinem Album sind,"; 
		if(document.forms.my_ctrlbar_form.my_alben_select.value > 0)
			tmp += ", die im Album " + document.forms.my_ctrlbar_form.my_alben_select.options[document.forms.my_ctrlbar_form.my_alben_select.selectedIndex].text.replace(/</g, "&lt;").replace(/>/g, "&gt;") + " sind,";
			
		tmp += " angezeigt. (<a href='javascript: my.showControlbar()' class='smartlink'>Ändern</a>)";
		
		writeTo("filter_text_value", tmp);
	}
	
	this.changeFilter = function() {
		this.saveControlbarCookies();
		this.writeFilterText();
		this.hideControlbar();
		this.writeDataIDs();
		this.requestData();
	}
	
	this.saveControlbarCookies = function() {
		var a = new Date();
		a = new Date(a.getTime() + 60*60*24*365);
		document.cookie = "my_num=" + document.forms.my_ctrlbar_form.my_imgnumselect.value + "; expires="+a.toGMTString()+"; domain=.img-up.net; "; 
		document.cookie = "my_type=" + document.forms.my_ctrlbar_form.my_viewselect.value + "; expires="+a.toGMTString()+"; domain=.img-up.net; "; 
	}
	
	this.showControlbar = function () {
		document.getElementById("filter_text").className = "hiddenitem";
		document.getElementById("filter_album").className = "tablerowitem";
		document.getElementById("filter_view").className = "tablerowitem";
		document.getElementById("filter_num").className = "tablerowitem";
		document.getElementById("filter_submit").className = "tablerowitem";
	}
	
	this.hideControlbar = function () {
		document.getElementById("filter_text").className = "tablerowitem";
		document.getElementById("filter_album").className = "hiddenitem";
		document.getElementById("filter_view").className = "hiddenitem";
		document.getElementById("filter_num").className = "hiddenitem";
		document.getElementById("filter_submit").className = "hiddenitem";
	}
	
	this.requestAlben = function() {
		this.newQuery("alben1", "alben", null);
	}
	
	this.requestAlbenAndSelectAlbum = function() {
		this.newQuery("alben2", "alben", null);
	}
	
	this.requestAlbenAndSelectAlbumID = function(albumid) {
		this.newQuery("albenselect." + albumid, "alben", null);
	}
	
	this.requestAlbenSelectAlbumIDAndRequestData = function(albumid) {
		this.newQuery("albenselectreq." + albumid, "alben", null);
	}
	
	this.requestAlbenSelectLayer = function(imgid, sid) {
		this.newQuery("albenlayer." + imgid + "." + sid, "alben", null);
	}
	
	this.writeAlbumSelectLayer = function(imgid, sid, data) {
		var alben = "";
		var albumid = data.getElementsByTagName('id');
		var albumname = data.getElementsByTagName('name');
		
		alben += "<select id='my_imgdata_changebox_form_album_field_" + imgid + "'>";
		alben += "<option value='0'>Kein Album</option>";
		for(var i = 0; i < albumid.length; i++) {
			if(albumid[i].firstChild.data == Math.floor(this.infolayer[imgid][8])) {
				selected = " selected='selected'";
			}
			else {
				selected = "";
			}
			alben += "<option value='" + albumid[i].firstChild.data + "'" + selected + "></option>";
		}
		
		alben += "<option value='-2' style='font-style: italic; border-top: 1px black solid' on>Neues Album</option>";
		alben += "</select>";
		
		btns = "<input type='button' class='btn' value='OK' onClick='my.changeImageAlbumByLayer(\"album\", \"my_imgdata_changebox_form_album_" + imgid + "\", " + imgid + ", " + sid + ")'>" +
				"<input type='button' class='btn' value='Abbruch' onClick='my.toggleLayerChange(\"album\", \"my_imgdata_changebox_form_album_" + imgid + "\", " + imgid + ")'>";
		
		writeTo("my_imgdata_changebox_form_album_" + imgid, alben + btns);
		
		// Mit Namen befuellen
		for(var i = 0; i < albumid.length; i++) {
			document.getElementById("my_imgdata_changebox_form_album_field_" + imgid).options[i+1].text = albumname[i].firstChild.data;
		}
	}
	
	this.writeAlbumBatchSelectLayer = function(data) {
		var alben = "";
		var albumid = data.getElementsByTagName('id');
		var albumname = data.getElementsByTagName('name');
		var imgids = this.getCheckedImgIds();
		var havesame = false;
		var presel;
		if(imgids.length > 0) {
			imgids = imgids.split(",");
			havesame = true;
			var tmp = this.infolayer[imgids[0]][8];
			for(var i = 1; i < imgids.length && havesame; i++) {
				if(tmp != this.infolayer[imgids[i]][8]) {
					havesame = false;
				}
				tmp = this.infolayer[imgids[i]][8];
			}
			if(havesame) {
				presel = tmp;
			}
		}
		
		alben += "<select id='my_batchalbum_field'>";
		alben += "<option value='-1'" + (havesame?"":" selected='selected'") + ">- Bitte auswählen -</option>";
		alben += "<option value='0'" + (havesame&&presel==0?" selected='selected'":"") + ">Kein Album</option>";
		for(var i = 0; i < albumid.length; i++) {
			alben += "<option value='" + albumid[i].firstChild.data + "'" + (havesame&&(presel==albumid[i].firstChild.data)?" selected='selected'":"") + "></option>";
		}
		
		alben += "<option value='-2' style='font-style: italic; border-top: 1px black solid' on>Neues Album</option>";
		alben += "</select>";
		
		btns = "<br><input type='button' class='btn' value='OK' onClick='my.albumCheckedGo()'>" +
				"<input type='button' class='btn' value='Abbruch' onClick='my.albumCheckedCancel()'>";
		
		writeTo("my_batchalbum", alben + btns);
		
		// Mit Namen befuellen
		for(var i = 0; i < albumid.length; i++) {
			document.getElementById("my_batchalbum_field").options[i+2].text = albumname[i].firstChild.data;
		}
	}
	
	this.writeAlben = function(data) {
		var alben = "";
		var albumid = data.getElementsByTagName('id');
		var albumname = data.getElementsByTagName('name');
		
		alben += "<select name='my_alben_select' onchange='my.checkAlbenSelect(this.options[this.selectedIndex].value, this.selectedIndex)'>";
		alben += "<option value='-1'>Alle Bilder</option>";
		alben += "<option value='0'>Kein Album</option>";
		for(var i = 0; i < albumid.length; i++) {
			if(albumid[i].firstChild.data == this.newAlbumID) {
				this.newAlbumIndex = i+2;
			}
			alben += "<option value='" + albumid[i].firstChild.data + "'></option>";
		}
		
		alben += "<option value='-2' style='font-style: italic; border-top: 1px black solid' on>Neues Album</option>";
		alben += "</select>";
		
		writeTo("my_albenselect", alben);
		
		// Mit Namen befuellen
		for(var i = 0; i < albumid.length; i++) {
			document.forms.my_ctrlbar_form.my_alben_select.options[i+2].text = albumname[i].firstChild.data;
		}
	}
	
	this.checkAlbenSelect = function(selected, selectedIndex) {
		if(selected == "-2") {
			document.my_ctrlbar_form.my_alben_select.selectedIndex = this.albumdavorselectedIndex;
			var albumname = window.prompt("Gib den Namen des neuen Albums ein!", "Mein Album");
			if(albumname == "") {
				albumname = "Mein Album";
			}
			if(albumname != null) {
				this.createNewAlbum(albumname);
			}
		}
		else {
			this.albumdavorselectedIndex = selectedIndex;
		}
	}
	
	this.checkSearchField = function() {
		if(document.forms.my_ctrlbar_form.my_searchselect.value != this.searchfdavor) {
			this.searchfdavor = document.forms.my_ctrlbar_form.my_searchselect.value;
			this.requestData();
		}
	}
	
	this.createNewAlbum = function(albumname) {
		this.newQuery("new_album1", "new_album", new Array("name", albumname));
	}

	this.writeImgNum = function() {
		var select = "<select name='my_imgnumselect'>";
		var act;
		for(var i = 0; i < this.limits[document.my_ctrlbar_form.my_viewselect.value].length; i++) {
			act = this.limits[document.my_ctrlbar_form.my_viewselect.value][i];
			if(document.my_ctrlbar_form.my_imgnumselect != undefined && document.my_ctrlbar_form.my_imgnumselect.value == act) {
				select += "<option value='" + act + "' selected='selected'>" + act + "</option>";
			}
			else {
				select += "<option value='" + act + "'>" + act + "</option>";
			}
		}
		select += "</select>";
		writeTo("my_imgnum", select);
	}
	
	this.writeDataIDs = function() {
		
		var view = document.my_ctrlbar_form.my_viewselect.value;
		if(view == "0") {
			var data = "<table cellpadding='5' style='margin-left: 0px; margin-right: auto'>";
		}
		else {
			var data = "<table cellpadding='2' style='margin-left: 0px; margin-right: auto; width: 100%'>";
		}
		for(i = 0; i < document.my_ctrlbar_form.my_imgnumselect.value; i++) {
			if(view == "0") {
				if(i%4 == 0) {
					data += "<tr>";
				}
			}
			else {
				data += "<tr style='visibility: hidden; background-color: " + this.bgcolors[i%2] + "' id='my_imgfield_" + i + "' name='my_imgfield_" + i + "'>";
			}
			
			
			
			if(view == "0") {
				data += "<td style='visibility: hidden; width: 120px; height: 160px; background-color: " + this.bgcolors[(i%2+Math.floor(i/4)%2)%2] + "' id='my_imgfield_" + i + "' name='my_imgfield_" + i + "'>";
			
				data += "<div id='my_imgdata_thumbnail_" + i + "' style='min-height: 120px'></div>";
				data += "<div id='my_imgdata_name_" + i + "' class='bolded' style='margin-top: 5px; text-align: left; background-color: transparent'></div>";
				data += "<table style='background-color: transparent; width: 100%'>" +
						"<tr>" +
						"<td style='text-align: center'><span id='my_imgdata_checkbox_" + i + "'></span></td>";
				data += "<td style='text-align: center'><a rel='#my_imgdata_infobox_" + i + "' class='lbOn' id='my_imgdata_icon_info_" + i + "' onMouseDown='my.writeInfoLayerContent(" + i + ")'></a></td>" +
						"<td style='text-align: center'><a rel='#my_imgdata_changebox_" + i + "' class='lbOn' id='my_imgdata_icon_deletesoon_" + i + "' onMouseDown='my.writeChangeLayerContent(" + i + ")'></a></td>" +
						"<td style='text-align: center'><span id='my_imgdata_icon_delete_" + i + "'></span></td>" +
						"</tr>" +
						"</table>";
				data +=	"<div id='my_imgdata_infobox_" + i + "' class='overlay'>" +
							"<div id='my_imgdata_infobox_content_" + i + "'></div>" +
							"<div style='position: absolute; top: 35px; right: 35px'>" +
								"<img src='img_int/close.gif' style='border-width: 0px' class='icon exit'>" +
							"</div>" +
						"</div>";
				data +=	"<div id='my_imgdata_changebox_" + i + "' class='overlay'>" +
							"<div id='my_imgdata_changebox_content_" + i + "'></div>" +
							"<div style='position: absolute; top: 35px; right: 35px'>" +
								"<img src='img_int/close.gif' style='border-width: 0px' class='icon exit'>" +
							"</div>" +
						"</div>";
			
				data += "</td>";
			}
			else {
				data += "<td style='width: 16px'><span id='my_imgdata_checkbox_" + i + "'></span></td>";
				data += "<td style='vertical-align: middle'><span id='my_imgdata_name_" + i + "' class='bolded' style='text-align: left'></span></td>";
				data += "<td style='vertical-align: middle; width: 50px; text-align: center' id='my_imgdata_size_" + i + "'></td>";
				data += "<td style='vertical-align: middle; width: 65px; text-align: center' id='my_imgdata_dimensions_" + i + "'></td>";
				data += "<td style='width: 16px'><a rel='#my_imgdata_infobox_" + i + "' class='lbOn' id='my_imgdata_icon_info_" + i + "' onMouseDown='my.writeInfoLayerContent(" + i + ")'></a></td>";
				data += "<td style='width: 16px'>";
				data += "<a rel='#my_imgdata_changebox_" + i + "' class='lbOn' id='my_imgdata_icon_deletesoon_" + i + "' onMouseDown='my.writeChangeLayerContent(" + i + ")'></a>";
				data +=	"<div id='my_imgdata_infobox_" + i + "' class='overlay'>" +
							"<div id='my_imgdata_infobox_content_" + i + "'></div>" +
							"<div style='position: absolute; top: 35px; right: 35px'>" +
								"<img src='img_int/close.gif' style='border-width: 0px' class='icon exit'>" +
							"</div>" +
						"</div>";
				data +=	"<div id='my_imgdata_changebox_" + i + "' class='overlay'>" +
							"<div id='my_imgdata_changebox_content_" + i + "'></div>" +
							"<div style='position: absolute; top: 35px; right: 35px'>" +
								"<img src='img_int/close.gif' style='border-width: 0px' class='icon exit'>" +
							"</div>" +
						"</div>";
				data += "</td>" +
						"<td style='width: 16px'><span id='my_imgdata_icon_delete_" + i + "'></span></td>";
			}
			
			if(view == "0") {
				if(i%4 == 3) {
					data += "</tr>";
				}
			}
			else {
				data += "</tr>";
			}
			
		}
		data += "</table>";
    
		writeTo("my_data", data);
    
    $("*.lbOn").overlay({
      close: 'img.exit',
      onBeforeLoad: function() { 
        this.getBackgroundImage().expose({color: '#4e754b'}); 
      },
      onClose: function() { 
        $.expose.close(); 
      } 
    });
		
		this.infolayer = new Array(Number(document.my_ctrlbar_form.my_imgnumselect.value));
		for(i = 0; i < this.infolayer.length; i++) {
			this.infolayer[i] = new Array(14);
		}
	}
	
	this.requestData = function() {
		this.newQuery("img1", "list", new Array(
										"view", document.forms.my_ctrlbar_form.my_viewselect.value,
										"limit", document.forms.my_ctrlbar_form.my_imgnumselect.value,
										"album", document.forms.my_ctrlbar_form.my_alben_select.value,
										"search", document.forms.my_ctrlbar_form.my_searchselect.value,
										"page", (this.page * Number(document.my_ctrlbar_form.my_imgnumselect.value))
									));
	}
	
	this.requestDataAndCheck = function(imgid) {
		this.newQuery("imgcheck." + imgid, "list", new Array(
										"view", document.forms.my_ctrlbar_form.my_viewselect.value,
										"limit", document.forms.my_ctrlbar_form.my_imgnumselect.value,
										"album", document.forms.my_ctrlbar_form.my_alben_select.value,
										"search", document.forms.my_ctrlbar_form.my_searchselect.value,
										"page", (this.page * Number(document.my_ctrlbar_form.my_imgnumselect.value))
									));
	}
	
	this.requestDataAndCheckBatch = function(imgids) {
		this.newQuery("imgcheckbatch." + imgids, "list", new Array(
										"view", document.forms.my_ctrlbar_form.my_viewselect.value,
										"limit", document.forms.my_ctrlbar_form.my_imgnumselect.value,
										"album", document.forms.my_ctrlbar_form.my_alben_select.value,
										"search", document.forms.my_ctrlbar_form.my_searchselect.value,
										"page", (this.page * Number(document.my_ctrlbar_form.my_imgnumselect.value))
									));
	}
	
	this.requestSingleDataAndRefreshLayer = function(sid, type, imgid) {
		this.newQuery("imglayer." + type + "." + imgid, "single", new Array(
								"imgid", sid
							));
	}
	
	this.refreshLayerPart = function(type, imgid, xml) {
		switch(type) {
			case "delete":
				writeTo("my_imgdata_changebox_warning_" + imgid, "");
				writeTo("my_imgdata_icon_deletesoon_" + imgid, ("<img src='img_int/noattention.gif' title='Details anzeigen / bearbeiten' style='border-width: 0px' class='icon'>"));
				break;
			case "description":
				writeTo("my_imgdata_changebox_form_description_" + imgid, xml.getElementsByTagName("description")[0].firstChild.data.replace(/</g, "&lt;").replace(/>/g, "&gt;"));
				this.infolayer[imgid][13] = xml.getElementsByTagName("description")[0].firstChild.data;
				break;
			case "album":
				this.infolayer[imgid][8] = xml.getElementsByTagName("albumid")[0].firstChild.data;
				this.infolayer[imgid][9] = xml.getElementsByTagName("album")[0].firstChild.data;
				writeTo("my_imgdata_changebox_form_album_" + imgid, this.infolayer[imgid][8] == "0" ? "Kein Album" : this.infolayer[imgid][9].replace(/</g, "&lt;").replace(/>/g, "&gt;"));
				this.requestAlbenAndSelectAlbumID(document.forms.my_ctrlbar_form.my_alben_select.value);
				break;
		}
	}
	
	this.setPage = function(p) {
		this.page = p;
	}
	
	this.writeImages = function(xml) {
		var totalnum = xml.getElementsByTagName("totalnum")[0].firstChild.data;
		var perpage = Number(document.my_ctrlbar_form.my_imgnumselect.value);
		if(this.page > 0 && xml.getElementsByTagName("filename").length <= 0) {
			this.page--;
			this.requestData();
		}
		else {
			this.imgnum = xml.getElementsByTagName("filename").length;
			this.writePages(totalnum);
			
			var view = document.forms.my_ctrlbar_form.my_viewselect.value;
			var max = document.forms.my_ctrlbar_form.my_imgnumselect.value;
			
			var r_id = xml.getElementsByTagName("id");
			var r_filename = xml.getElementsByTagName("filename");
			var r_server = xml.getElementsByTagName("server");
			var r_size = xml.getElementsByTagName("size");
			var r_dimensions = xml.getElementsByTagName("dimensions");
			var r_name = xml.getElementsByTagName("name");
			var r_uploaded = xml.getElementsByTagName("uploaded");
			var r_views = xml.getElementsByTagName("views");
			var r_albumid = xml.getElementsByTagName("albumid");
			var r_album = xml.getElementsByTagName("album");
			var r_description = xml.getElementsByTagName("description");
			
			for(var i = 0; i < r_filename.length; i++) {
				if(document.all) {
					document.all["my_imgfield_" + i].style.visibility = "visible";
				}
				else {
					document.getElementById("my_imgfield_" + i).style.visibility = "visible";
				}
				
				spl = r_filename[i].firstChild.data.split(".");
				thumbname = "";
				for(var ii = 0; ii < spl.length-1; ii++) {
					thumbname += spl[ii] + ".";
				}
				
				if(view == "0") { // Thumbnail					
					writeTo("my_imgdata_thumbnail_" + i, "<a href='http://" + r_server[i].firstChild.data + ".img-up.net/?up=" + r_filename[i].firstChild.data + "' target='_blank'><img src='http://" + r_server[i].firstChild.data + "t.img-up.net/" + thumbname + "jpg' style='border-width: 0px'></a>");
				}
				else { // Detail
					writeTo("my_imgdata_size_" + i, Math.round(r_size[i].firstChild.data/102.4)/10 + " kB");
					writeTo("my_imgdata_dimensions_" + i, r_dimensions[i].firstChild.data);
				}
				writeTo("my_imgdata_name_" + i, r_name[i].firstChild.data);
				writeTo("my_imgdata_icon_info_" + i, "<img src='img_int/details.gif' style='border-width: 0px' class='icon' title='Links anzeigen'>");
				writeTo("my_imgdata_checkbox_" + i, "<input type='checkbox' id='my_imgdata_check_" + i + "' style='margin: 0px'>")
				writeTo("my_imgdata_icon_deletesoon_" + i, "<img src='img_int/noattention.gif' title='Details anzeigen / bearbeiten' style='border-width: 0px' class='icon'>");
				writeTo("my_imgdata_icon_delete_" + i, "<img src='img_int/delete.gif' title='Löschen' class='icon' style='border-width: 0px' onClick='my.confirmDeleteImage(" + i + ", " + r_id[i].firstChild.data + ", \"" + r_name[i].firstChild.data.replace("'", "").replace("\"", "") + "\", \"" + r_filename[i].firstChild.data + "\")'>");
				
				this.infolayer[i][0] = "<a href='http://" + r_server[i].firstChild.data + ".img-up.net/?up=" + r_filename[i].firstChild.data + "' target='_blank'><img src='http://" + r_server[i].firstChild.data + "t.img-up.net/" + thumbname + "jpg' style='border-width: 0px'></a>";
				this.infolayer[i][1] = "<iframe src='?viewlinks=" + r_filename[i].firstChild.data + "&server=" + r_server[i].firstChild.data + "' frameborder='0' style='width: 100%; height: 240px; padding: 0px; margin: 0px; border-width: 0px' scrolling='no'>";
				
				this.infolayer[i][3] = r_name[i].firstChild.data;
				this.infolayer[i][4] = r_filename[i].firstChild.data;
				this.infolayer[i][5] = r_uploaded[i].firstChild.data;
				this.infolayer[i][7] = r_id[i].firstChild.data;
				this.infolayer[i][8] = r_albumid[i].firstChild.data;
				this.infolayer[i][9] = r_album[i].firstChild.data;
				this.infolayer[i][10] = r_views[i].firstChild.data;
				this.infolayer[i][11] = null;
				this.infolayer[i][12] = null;
				this.infolayer[i][13] = (r_description[i].firstChild == null ? "" : r_description[i].firstChild.data);
				
			}
			for(var i = r_filename.length; i < max; i++) {
				if(view == "0") { // Thumbnail
					writeTo("my_imgdata_thumbnail_" + i, "");
				}
				writeTo("my_imgdata_name_" + i, "");
				writeTo("my_imgdata_checkbox_" + i, "");
				writeTo("my_imgdata_icon_info_" + i, "");
				writeTo("my_imgdata_icon_deletesoon_" + i, "");
				if(document.all) {
					document.all["my_imgfield_" + i].style.visibility = "hidden";
				}
				else {
					document.getElementById("my_imgfield_" + i).style.visibility = "hidden";
				}
			}
		}
	}
	
	this.confirmDeleteImage = function(imgid, i, namex, filename) {
		if(confirm("Möchtest du " + namex + " (" +  filename + ") wirklich löschen?")) {
			this.removeImage(imgid, i);
		}
	}
	
	this.checkAll = function() {
		for(var i = 0; i < this.imgnum; i++) {
			document.getElementById("my_imgdata_check_" + i).checked = true;
		}
	}
	
	this.checkNone = function() {
		for(var i = 0; i < this.imgnum; i++) {
			document.getElementById("my_imgdata_check_" + i).checked = false;
		}
	}
	
	this.checkInvert = function() {
		for(var i = 0; i < this.imgnum; i++) {
			document.getElementById("my_imgdata_check_" + i).checked = !document.getElementById("my_imgdata_check_" + i).checked;
		}
	}
	
	this.getChecked = function() {
		erg = "";
		for(var i = 0; i < this.imgnum; i++) {
			if(document.getElementById("my_imgdata_check_" + i).checked) {
				erg += (erg.length == 0 ? "" : ",") + this.infolayer[i][7];
			}
		}
		return erg;
	}
	
	this.getCheckedImgIds = function() {
		erg = "";
		for(var i = 0; i < this.imgnum; i++) {
			if(document.getElementById("my_imgdata_check_" + i).checked) {
				erg += (erg.length == 0 ? "" : ",") + i;
			}
		}
		return erg;
	}
	
	this.deleteChecked = function() {
		checkstr = this.getChecked();
		if(checkstr.length > 0) {
			num = checkstr.split(",").length;
			if(confirm("Möchtest du diese" + (num>1?"":"s") + (num>1?" " + num : "") + " Bild" + (num>1?"er":"") + " löschen?"))
			this.newQuery("batchremove", "change", new Array(
								"action", "batchremove",
								"imgids", checkstr
							));
		}
		else {
			alert("Keine Bilder ausgewählt!");
		}
	}
	
	this.albumChecked = function() {
		writeTo("my_batchalbum", "Loading...");
		this.newQuery("albenbatch", "alben", null);
	}
	
	this.albumCheckedCancel = function() {
		writeTo("my_batchalbum", '<a href="javascript: my.albumChecked()"><img src="img_int/album.gif" style="border-width: 0px"></a>');
	}
	
	this.albumCheckedGo = function() {
		checkstr = this.getChecked();
		if(checkstr.length > 0) {
			newv = document.getElementById("my_batchalbum_field").value;
			if(newv != "-1") {
				var albumname = "";
				var go = true;
				if(newv == "-2") {
					albumname = window.prompt("Gib den Namen des neuen Albums ein!", "Mein Album");
					go = (albumname != null);
				}
				if(go) {
					writeTo("my_batchalbum", "Loading...");
					this.newQuery("batchalbum." + this.getCheckedImgIds(), "change", new Array(
										"action", "batchalbum",
										"imgids", checkstr,
										"new", newv,
										"albumname", albumname
									));
				}
			}
			else {
				alert("Bitte Album auswählen oder erstellen!");
			}
		}
		else {
			alert("Keine Bilder ausgewählt!");
		}
	}
	
	this.writeInfoLayerContent = function(id) {
		writeTo("my_imgdata_infobox_content_" + id, "<table class='leftedcont' style='height: 100%'>" +
												"<tr>" +
													"<td>" + this.infolayer[id][0] + "<br><!-- AD? --></td>" +
													"<td style='width: 100%'>" + this.infolayer[id][1] + "</td>" +
												"</tr>" +
											"</table>");
	}
	
	this.writeChangeLayerContent = function(id) {
		warning = "<div id='my_imgdata_changebox_warning_" + id + "'>";
		
		if(this.infolayer[id][2] == "1") {
			warning += this.warningmsg;
		}
		
		warning += "</div>";
				
		temp = warning + "<form name='my_imgdata_change_form_" + id + "' onsubmit='return false;'>" +
				"<table class='leftedcont mylayer' style='height: 100%; border-spacing: 5px'>" +
					"<tr>" +
						"<td class='bolded'>Bild:</td>" +
						"<td style='width: 13px'></td>" +
						"<td style='width: 100%'>" + this.infolayer[id][3] + " (" + this.infolayer[id][4] + ")" +
					"</tr>" +
					"<tr>" +
						"<td class='bolded' colspan='2'>Upgeloaded:</td>" +
						"<td>" + this.infolayer[id][5] + "</td>" +
					"</tr>" +
					"<tr>" +
						"<td class='bolded'>Album:</td>" +
						"<td><img src='img_int/edit.gif' class='icon' onClick='my.toggleLayerChange(\"album\", \"my_imgdata_changebox_form_album_" + id + "\", " + id + ", " + this.infolayer[id][7] + ")' style='border: 0px'></td>" +
						"<td id='my_imgdata_changebox_form_album_" + id + "'>" + (this.infolayer[id][8] == "0" ? "Kein Album" : this.infolayer[id][9].replace(/</g, "&lt;").replace(/>/g, "&gt;")) + "</td>" +
					"</tr>" +
					"<tr>" +
						"<td class='bolded' colspan='2'>Angezeigt:</td>" +
						"<td>" + this.infolayer[id][10] + " Views</td>" +
					"</tr>" +
					"<tr>" +
						"<td class='bolded'>Beschreibung:</td>" +
						"<td><img src='img_int/edit.gif' class='icon' onClick='my.toggleLayerChange(\"description\", \"my_imgdata_changebox_form_description_" + id + "\", " + id + ", " + this.infolayer[id][7] + ")' style='border: 0px'></td>" +
						"<td id='my_imgdata_changebox_form_description_" + id + "'>" + (this.infolayer[id][13].replace(/</g, "&lt;").replace(/>/g, "&gt;")) + "</td>" +
					"</tr>" +
				"</table>" +
				"</form>";
		writeTo("my_imgdata_changebox_content_" + id, "<table class='leftedcont' style='height: 100%'>" +
												"<tr>" +
													"<td>" + this.infolayer[id][0] + "<br><!-- AD? --></td>" +
													"<td style='width: 100%'>" + temp + "</td>" +
												"</tr>" +
											"</table>");
	}
	
	this.toggleLayerChange = function(type, wid, imgid, sid) {
		temp = "";
		switch(type) {
			case "album":
				if(!document.getElementById("my_imgdata_changebox_form_" + type + "_field_" + imgid)) {
					temp = "Lade Alben...";
					this.requestAlbenSelectLayer(imgid, sid);
				}
				else {
					temp = (this.infolayer[imgid][8] == "0" ? "Kein Album" : this.infolayer[imgid][9].replace(/</g, "&lt;").replace(/>/g, "&gt;"));
				}
				break;
			case "description":
				if(!document.getElementById("my_imgdata_changebox_form_" + type + "_field_" + imgid)) {
					temp = "<textarea rows='2' cols='30' id='my_imgdata_changebox_form_" + type + "_field_" + imgid + "'>" + this.infolayer[imgid][13] + "</textarea><br>" +
							"<input type='button' class='btn' value='OK' onClick='my.changeImageByLayer(\"" + type + "\", \"" + wid + "\", " + imgid + ", " + sid + ")'>" +
							"<input type='button' class='btn' value='Abbruch' onClick='my.toggleLayerChange(\"" + type + "\", \"" + wid + "\", " + imgid + ")'>";
				}
				else {
					temp = this.infolayer[imgid][13].replace(/</g, "&lt;").replace(/>/g, "&gt;");
				}
				break;
		}
		writeTo(wid, temp);
	}
	
	this.changeImageByLayer = function(type, wid, imgid, sid) {
		newvalue = document.getElementById("my_imgdata_changebox_form_" + type + "_field_" + imgid).value;
		if(newvalue == "") {
			newvalue = " ";
		}
		this.newQuery("changelayer." + sid + "." + type + "." + imgid, "change", new Array(
										"action", type,
										"imgid", sid,
										"new", newvalue
									));
	}
	
	this.removeImage = function(imgid, sid) {
		this.newQuery("removeImage." + imgid, "change", new Array(
										"action", "remove",
										"imgid", sid
									));
	}
	
	this.changeImageAlbumByLayer = function(type, wid, imgid, sid) {
		if(document.getElementById("my_imgdata_changebox_form_" + type + "_field_" + imgid).value == "-2") {
			var albumname = window.prompt("Gib den Namen des neuen Albums ein!", "Mein Album");
			if(albumname != null) {
				this.newQuery("changelayer." + sid + "." + type + "." + imgid, "change", new Array(
										"action", type,
										"imgid", sid,
										"new", document.getElementById("my_imgdata_changebox_form_" + type + "_field_" + imgid).value,
										"albumname", albumname
									));
			}
			else {
				this.toggleLayerChange(type, wid, imgid, sid);
			}
		}
		else {
			this.newQuery("changelayer." + sid + "." + type + "." + imgid, "change", new Array(
											"action", type,
											"imgid", sid,
											"new", document.getElementById("my_imgdata_changebox_form_" + type + "_field_" + imgid).value
										));
		}
	}
	
	this.writePages = function(num) {
		var perpage = Number(document.my_ctrlbar_form.my_imgnumselect.value);
		var act;
		var erg = (num > 0 ? "Seite: " : "");
		var leftpointsdone = false;
		var rightpointsdone = false;
		for(var i = 0; i < num; i += perpage) {
			act = Math.floor(i/perpage);
			if(i == this.page*perpage) {
				erg += "<span class='bolded'>" + (act+1) + "</span> ";
			}
			else {
				var outp = "<span class='icon' style='color: #777777' onClick='my.setPage(" + act + "); my.requestData()'>" + (act+1) + "</span> ";
				
				if(num/perpage > 8) {
					if(i == 0 || i == (num - num%perpage)) {
						erg += outp;
					}
					else if(i == (this.page*perpage + perpage)) {
						erg += outp;
					}
					else if(i == (this.page*perpage + perpage*2)) {
						erg += outp + ("");
					}
					else if(i == (this.page*perpage - perpage)) {
						erg += outp;
					}
					else if(i == (this.page*perpage - perpage*2)) {
						erg += outp + ("");
					}
					else if(i <= (this.page*perpage - perpage*3) && !leftpointsdone) {
						erg += "... ";
						leftpointsdone = true;
					}
					else if(i >= (this.page*perpage + perpage*3) && !rightpointsdone) {
						erg += "... ";
						rightpointsdone = true;
					}
          else if(i+perpage == num) {
            erg += outp;
          }
				}
				else {
					erg += outp;
				}
			}
		}
		writeTo("my_pages", erg);
		writeTo("my_pages2", erg);
	}
}

function Request(iid, target, iparams, ireader) {
	var id = iid;
	var params = iparams;
	var req = false;
	var reader = ireader;
	
	if (window.XMLHttpRequest) {
		req = new XMLHttpRequest();
		if(req.overrideMimeType) {
			req.overrideMimeType('text/xml');
		}
	} else if (window.ActiveXObject) {
		try {
			req = new ActiveXObject("Msxml2.XMLHTTP");
		} catch (e) {
			try {
				req = new ActiveXObject("Microsoft.XMLHTTP");
			} catch (e) {}
		}
	}
	req.onreadystatechange = finish;
	req.open('GET', 'xml/my_' + target + '.php' + listParams(), true);
	req.send(null);
	
	function listParams() {
		var list = "";
		if(params != null) {
			for(i = 0; i < params.length; i += 2) {
				list += (i == 0 ? "?" : "&") + params[i] + "=" + encodeURIComponent(params[i+1]);
			}
		}
		return list;
	}
	
	function finish() {
		if (req.readyState == 4) {
			if (req.status == 200) {
				reader.checkAnswer(id, req.responseXML);
			}
        }
	}
}

Array.prototype.contains = function (elem) {
  var i;
  for (i = 0; i < this.length; i++) {
    if (this[i] == elem) {
      return true;
    }
  }

  return false;
};