var iconPath = '/ajax_server.php';
var filePath = '/file.php';
var iconListObjs = {}
var iconList = {};
var iconPreload = {};
/** ********************************************************************************************************************* **/
function Icon() {
	
}


function IconList() {
	this.children = {};
	this.childrenArr = new Array();
	this.init = init;
	this.drawIconList = drawIconList;
	this.loadIcons = loadIcons;
	this.loadIconList = loadIconList;
	this.addIconList = addIconList;
	this.removeIconList = removeIconList;
	this.changeImageDisplay = changeImageDisplay;
	this.mouseOverDel = mouseOverDel;
	this.mouseOutDel = mouseOutDel;
	this.iconDel = iconDel;
	this.iconSelect = iconSelect;
	
	function init() {
		attachEventListener(window,'load',this.loadIconList, false);
		iconList[0] = '/icons/notfound.jpg';
		iconPreload[0] = new Image();
		iconPreload[0].src = '/icons/notfound.jpg';
	}
	
	function loadIconList() {
		if ( !document.getElementById || !document.createElement || !document.getElementsByTagName ) {
			return;
		}
		var iconElems = document.getElementsByTagName('iconlist');
		for (var x = 0; x < iconElems .length; x++) {
			var module = iconElems [x].getAttribute('module') ? iconElems [x].getAttribute('module') : '';
			addIconList(iconElems [x].id, module ,'' );			
		}//for
		iconElems  = document.getElementsByTagName('iconlost');
		while (iconElems.length > 0) {
			iconElems[0].parentNode.removeChild(iconElems[0]);
		}
	}//function

	function removeIconList(itemId) {
		var temp = document.createElement('iconlist');
		var old = document.getElementById(itemId);
		old.id = itemId+'_temp';
		temp.id = itemId;
		old.parentNode.insertBefore(temp, old);
		old.parentNode.removeChild(old);
		pop(iconListObjs[itemId]);

		return temp;
	}
	
	function addIconList(itemId, module, contentId) {
		var temp;
		var elem = document.getElementById(itemId);
		var old = elem;
		var atrType = elem.getAttribute('type');
		var prefix = '';
		temp = drawIconList(itemId,module,contentId);
		temp.parentNode.removeChild(temp);
		if (!(elem.getAttribute('autoload') == "false"))
			stdAjax(iconPath, 'POST', 'module='+module+'&action=list&targetId='+itemId, loadIcons)
		if (!temp) {
			alert('unable to load icon list '+ elem.getAttribute('id'));
		}
		return old;
	}
	
	function drawIconList(itemId, module, contentId) {
		var old = document.getElementById(itemId);
		var container = document.createElement('div');
		var iconSrc = document.createElement('input');
		var image = document.createElement('img');
		var imageDiv = document.createElement('div');
		var imageListSel = document.createElement('div');
		var uploadFrame = document.createElement('iframe');
//		var selOpt = document.createElement('div');
		var selItem = document.createElement('span');
		old.id = 'tempOld'+itemId;

		iconSrc.type = 'hidden';
		iconSrc.name = itemId;
		iconSrc.id = itemId;
		iconSrc.value = '0';
		container.id = itemId+'_container';
		container.className = 'iconList';

		image.id = itemId+'_display';
		image.className = 'iconImage';
		image.src = iconPreload[0].src;
		imageDiv.className = 'iconImageDiv';

		imageListSel.id = itemId+'_list';
		imageListSel.className = 'iconSelect';
		
		selItem.id = itemId+'_iconSelect_0'
		selItem.className = 'iconNotSelected';
		selItem.appendChild(document.createTextNode('None'));
		//selOpt.appendChild(selItem);		
		uploadFrame.id = itemId+'_iframe';
		uploadFrame.src = filePath+'?module='+module+'&action=add&contentId='+contentId+'&parentId='+itemId;
		uploadFrame.className = 'iconIframe';

		imageDiv.appendChild(image);
		imageListSel.appendChild(selItem);
		container.appendChild(iconSrc);
		container.appendChild(imageListSel);
		container.appendChild(imageDiv);
		if (!old.getAttribute('upload') || old.getAttribute('upload') == true) {
			iconSrc.setAttribute('uploadEnabled', true);
			container.appendChild(uploadFrame);
		} else 
			iconSrc.setAttribute('uploadEnabled', false);
		if (!old.getAttribute('delete') || old.getAttribute('delete') == true) {
			iconSrc.setAttribute('deleteEnabled', true);
		} else {
			iconSrc.setAttribute('deleteEnabled', false);
		}			
		attachEventListener(selItem,'click',changeImageDisplay,true);
		old.parentNode.insertBefore(container, old);
		return old;
	}
	function loadIcons(xmlDoc) {
		if (xmlDoc.getElementsByTagName('response')[0].getAttribute('code') != 200) {
			alert(xmlDoc.getElementsByTagName('response')[0].lastChild.nodeValue);
		
			return;
		}
		var contentList = xmlDoc.getElementsByTagName('contentList')[0].childNodes;
		var relatedTables = xmlDoc.getElementsByTagName('relatedTable');
		var itemId = xmlDoc.getElementsByTagName('action')[0].getAttribute('targetId')+'_list';
		var srcId = xmlDoc.getElementsByTagName('action')[0].getAttribute('targetId');
		var elem = document.getElementById(itemId);
		if (!elem)
			return;
		var x = 0;
		while (x < contentList.length) {
			var selItem = document.createElement('span');
			var selDel = document.createElement('img');
			var selId;
			if (contentList[x].getAttribute('icon_id'))
				selId = contentList[x].getAttribute('icon_id');
			else if (contentList[x].getAttribute('picture_id'))
				selId = contentList[x].getAttribute('picture_id');
			else {
				alert ('Error during icon list update');
				return;
			}
			selDel.src = '/images/del.jpg';
			selDel.className = 'iconDel';
			selDel.alt = 'Delete';
			selItem.id = srcId+'_iconSelect_'+selId;
			selItem.className = 'iconNotSelected';
			if (document.getElementById(srcId).getAttribute('deleteEnabled') == true)
				selItem.appendChild(selDel);
			if (contentList[x].getAttribute('name'))
				selItem.appendChild(document.createTextNode(contentList[x].getAttribute('name')));
			else
				selItem.appendChild(document.createTextNode('&nbsp;'));

			
			iconPreload[selId] = new Image();
			if (contentList[x].getAttribute('url')) {
				iconList[selId] = contentList[x].getAttribute('url');
			iconPreload[selId].src = contentList[x].getAttribute('url');	
			} else if (contentList[x].getAttribute('thumb_small')) {
				iconList[selId] = contentList[x].getAttribute('thumb_small');
			iconPreload[selId].src = contentList[x].getAttribute('thumb_small');	
			}
			elem.appendChild(selItem);
			attachEventListener(selItem,'click',changeImageDisplay,true);
			attachEventListener(selDel,'mouseover',mouseOverDel,true);
			attachEventListener(selDel,'click',iconDel,true);
			attachEventListener(selDel,'mouseout',mouseOutDel,true);
			x++;
		}
		iconSelect(srcId,document.getElementById(srcId).value);
	}
	function changeImageDisplay(e) {
		if (!e) var e = window.event;
		var tg = (window.event) ? e.srcElement : e.target;
		var itemId = tg.id.replace(/\_iconSelect\_[0-9]+/,'');
		if (itemId == tg.id)
			return;
		var newVal = tg.id.replace(/^.*\_iconSelect\_/,'');
		var listVal = document.getElementById(itemId);
		if (newVal == listVal.value)
			return;
		iconSelect(itemId, newVal);
	}
	function iconSelect (itemId, newVal ) {
		var listVal = document.getElementById(itemId);
		//alert(itemId+'_iconSelect_'+listVal.value);
		var image = document.getElementById(itemId+'_display');
		if (listVal.value != '')
			document.getElementById(itemId+'_iconSelect_'+listVal.value).className = 'iconNotSelected';
		if (newVal == '') newVal = 0;
		document.getElementById(itemId+'_iconSelect_'+newVal).className = 'iconSelected';
		listVal.value = newVal;
		if (iconPreload[newVal] && image) {
			image.src = iconPreload[newVal].src;
		}
	}
	function mouseOverDel (e) {
		if (!e) var e = window.event;
		var tg = (window.event) ? e.srcElement : e.target;
		tg.src = '/images/delOver.gif';
	}
	function mouseOutDel (e) {
		if (!e) var e = window.event;
		var tg = (window.event) ? e.srcElement : e.target;
		tg.src = '/images/del.gif';
	}
	
	function iconDel(e) {

		if (!e) var e = window.event;
		if (window.event) event.cancelBubble=true;
		else if (e.stopPropagation) e.stopPropagation()

		var tg = (window.event) ? e.srcElement : e.target;
		var selId = tg.parentNode.id.replace(/\_iconSelect\_[0-9]+$/,'');
		var itemId = tg.parentNode.id.replace(/^.*\_iconSelect\_/,'');
		var image = document.getElementById(selId+'_display');
		var listVal = document.getElementById(selId);
		var prevSib = tg.parentNode.previousSibling;
		var prevId = prevSib.id.replace(/^.*\_iconSelect\_/,'');
		if (listVal.value == itemId) {
			document.getElementById(selId+'_iconSelect_'+prevId).className = 'iconSelected';
			listVal.value = prevId;
			iconPreload[itemId] = undefined;
			iconList[itemId] = undefined;
			image.src = iconPreload[prevId].src;
		}
		tg.parentNode.parentNode.removeChild(tg.parentNode);
		stdAjax(iconPath, 'POST', 'module='+this.module+'&action=delete&contentId='+itemId+'&targetId='+itemId, function(){})
			
	}
}

var ilist = new IconList();
ilist.init();