var FormLoaded=new Array();
var FormData=new Array();
var OrigData=new Array();


function LoadCol(){
	var list = $$('div.colle');
	list.each(function(element,i) {
		FormLoaded[i]=false;
		element.style.cursor='pointer';
		element.title='Click to Upload an Image';
		element.addEvent('click', function(){
			if (FormLoaded[i]==false){
				this.style.borderColor ="#999999";
				FormData[i]=this.innerHTML;
				var form = '<form onsubmit="Loading(\''+this.id+'\')" target="uploader" action="collage/process/upload.asp" method="post" enctype="multipart/form-data" name="'+this.id+'" id="F'+this.id+'">';
				form += '<input name="file" size = "10" type="file" class="plainfield" onChange="document.'+this.id+'.submit()"/>';
				form += '<input name="divid" type="hidden" value="'+this.id+'" /><input name="id" type="hidden" value="'+i+'" />';
				form += '<input name="divw" type="hidden" value="'+this.style.width+'" /><input name="divh" type="hidden" value="'+this.style.height+'" />';
				form += '</form>';
				form += '<div id="loaddis"></div>';
				this.innerHTML =form;
				FormLoaded[i]=true;
				OrigData[i]="";
				
			}
		});
		var fx = new Fx.Styles(element, {duration:200, wait:false});
		element.addEvent('mouseenter', function(){
			fx.start({
				'background-color': '#D3D3D3'
			});
		});
	 
		element.addEvent('mouseleave', function(){
			fx.start({
				'background-color': '#EFEFEF'
			});
		});
	});
}
function Post(){
	var GotImg = true;
	for (var i = 0; i < OrigData.length; i++){
		if(!OrigData[i]){
			GotImg = false;
		}
	}
	if(GotImg){
		var PostData = "?img="+OrigData+"&design="+Design
		window.location = "collage/process/image.asp"+PostData;
	}
}

function Loading(id){
	$('F'+id).style.display="none";
	$('loaddis').innerHTML = "<div class=\"loading\">Uploading Image<br><b>Please Wait</b><BR><br><img src=\"collage/img/ajax-loader.gif\"></div>";
}
function ImageLoaded(error,div,id,pth,opth){
	switch(error){
	case "nofile":
		$(div).innerHTML = "<div class=\"loading\">No File Uploaded</div>";
		break;
	case "filetype":
		$(div).innerHTML = "<div class=\"loading\">Only JPG, JPEG, GIF, PNG files allowed</div>";
		break;
	case "filesize":
		$(div).innerHTML = "<div class=\"loading\">File must be larger than 200kbs in size</div>";
		break;
	default:
		$(div).innerHTML = "<img id=\"IMG"+div.id+"\" src=\"collage/images/"+pth+"\" width=\""+$(div).style.width+"\" height=\""+$(div).style.height+"\">";
		OrigData[id]=opth;
		$(div).style.borderColor ="#ffffff";
		$(div).title ="Click to change this image";
	}
	FormLoaded[id]=false;
}
window.addEvent('domready', LoadCol());